div.header .col-1 {
    width: 23%;
    min-width: 200px;
    margin-right: 1%;
}

div.header .col-2 {
    width: 64%;
}

div.header .col-3 {
    clear: none;
    float: right !important;
    margin-left: 1%;
    text-align: right;
}

div.header a.logo {
    display: inline-block;
    float: left;
    width: 165px;
    height: 55px;
    margin-top: 15px;
    background: url(img/menu-quedra-logo.png) left center no-repeat;
    background-size: contain;
}

div.header a.text {
    display: inline-block;
    float: left;
    width: 19%;
    margin-top: 5px;
    height: 50px;
    padding-top: 25px;
    color: #555;
    text-align: center;
    box-shadow: 0 -4px 0 0 transparent inset;
}

    div.header a.text:hover, div.header a.text:focus {
        color: #000;
        box-shadow: 0 -4px 0 0 #f80 inset;
    }

    div.header a.text.down {
        background: url(img/menu-down.png) center 50px no-repeat;
    }

        div.header a.text.down:hover, div.header a.text.down:focus {
            background: url(img/menu-down-hot.png) center 55px no-repeat;
        }

    div.header a.text.down-selected {
        background: url(img/menu-down-hot.png) center 50px no-repeat;
        box-shadow: 0 -4px 0 0 #f80 inset !important;
    }

div.header a.icon {
    display: inline-block;
    width: 48px;
    height: 76px;
    margin: 4px;
    background: center no-repeat;
    box-shadow: 0 -3px 0 0 transparent inset !important;
    cursor: pointer;
    opacity: 0.5;
}

    div.header a.icon:last-child {
        margin-right: 0;
    }

    div.header a.icon:hover, div.header a.icon:focus {
        opacity: 1;
        box-shadow: 0 -3px 0 0 #f80 inset !important;
    }

    div.header a.icon#search {
        display: none;
        background-image: url(img/menu-search.png);
    }

    div.header a.icon#language {
        background-image: url(img/menu-language.png);
        display: none;
    }

    div.header a.icon#mobile {
        display: none;
        background-image: url(img/menu-mobile-menu.png);
    }

    div.header a.icon#close {
        width: 40px !important;
        height: 40px !important;
        margin: 5px !important;
        background-image: url(img/menu-mobile-close.png);
        float: right !important;
        border-radius: 50% !important;
    }

        div.header a.icon#close:hover, div.header a.icon#close:focus {
            background-color: rgba(0,0,0,0.1) !important;
            box-shadow: none !important;
        }

div.header .center .col hr {
    display: inline-block;
    float: left;
    width: 1px;
    height: 40px;
    margin: 25px 0.4% 0 0.4%;
    background: rgba(0,0,0,0.05);
    border: none;
}

div.menu-detail {
    width: 100%;
    display: table;
    position: relative;
    background: #fff;
    z-index: -1;
    display: none;
    opacity: 0;
    overflow: hidden;
    box-shadow: 0 2px 2px 0 rgba(0,0,0,0.15), 0 1px 0 0 rgba(0,0,0,0.1) inset;
}

    div.menu-detail .center {
        height: 400px;
    }

    div.menu-detail .menu-detail-content {
        width: 100%;
        height: 100%;
        color: #000;
        display: none;
        opacity: 0;
        overflow: hidden;
    }

        div.menu-detail .menu-detail-content .menu-detail-col-left {
            float: left;
            width: 25%;
            max-width: 240px;
            height: 359px;
            margin-top: 21px;
            padding-right: 2%;
            color: #777;
            border-right: 1px solid rgba(0,0,0,0.05);
        }

        div.menu-detail .menu-detail-content .menu-detail-col-right {
            float: left;
            width: 68%;
            height: 339px;
            margin-top: 1px;
            padding: 30px 0 30px 3%;
            font-size: 16px;
        }

div.menu-detail-col-left span {
    display: block;
}

div.menu-detail-col-left hr {
    height: 1px;
    margin: 5px 0;
    background: rgba(0,0,0,0.05);
    border: none;
}

a.menu-detail-link {
    display: block;
    padding: 5px 0 5px 10px;
    background: 85% center no-repeat;
    color: #000;
}

    a.menu-detail-link:hover, a.menu-detail-link:focus {
        background: #f80 url(img/menu-detail-arrow-hot.png) 95% center no-repeat;
        color: #fff;
    }

a.menu-detail-link-selected {
    background: url(img/menu-detail-arrow.png) 95% center no-repeat;
}

.menu-detail-col-right > div {
    width: 100%;
    height: 339px;
    display: none;
    opacity: 0;
    overflow: hidden;
}

    .menu-detail-col-right > div > a, .menu-detail-col-right > div > a * {
        color: #000;
        border: none;
    }

    .menu-detail-col-right > div .content-left {
        float: left;
        width: 60%;
        height: 339px;
    }

    .menu-detail-col-right > div .content-left {
        display: block;
        opacity: 1;
    }

    .menu-detail-col-right > div .content-right {
        float: left;
        width: 37%;
        height: 339px;
        margin-left: 3%;
        background: right top no-repeat;
        background-size: contain;
    }

    .menu-detail-col-right > div#menu-detail-urunler .content-right {
        background-image: url(img/menu-urunler.jpg);
        display: block;
        opacity: 1;
    }

    .menu-detail-col-right > div#menu-detail-urunler-yonetim .content-right {
        background-image: url(img/menu-urunler-yonetim.jpg);
    }

    .menu-detail-col-right > div#menu-detail-urunler-ofis .content-right {
        background-image: url(img/menu-urunler-ofis.jpg);
    }

    .menu-detail-col-right > div#menu-detail-urunler-log-yonetimi .content-right {
        background-image: url(img/menu-urunler-log-yonetimi.jpg);
    }

    .menu-detail-col-right > div#menu-detail-bilgi-merkezi .content-right {
        background-image: url(img/menu-bilgi-merkezi.jpg);
    }

    .menu-detail-col-right > div#menu-detail-bilgi-merkezi-bilgi-demo-istegi .content-right {
        background-image: url(img/menu-bilgi-merkezi-bilgi-demo-istegi.jpg);
    }

    .menu-detail-col-right > div#menu-detail-bilgi-merkezi-nereden-alirim .content-right {
        background-image: url(img/menu-bilgi-merkezi-nereden-alirim.jpg);
    }

    .menu-detail-col-right > div#menu-detail-bilgi-merkezi-haberler .content-right {
        background-image: url(img/menu-bilgi-merkezi-haberler.jpg);
    }

    .menu-detail-col-right > div#menu-detail-destek .content-right {
        background-image: url(img/menu-destek.jpg);
    }

    .menu-detail-col-right > div#menu-detail-destek-destek-basvurusu .content-right {
        background-image: url(img/menu-destek-destek-basvurusu.jpg);
    }

    .menu-detail-col-right > div#menu-detail-destek-indirmeler .content-right {
        background-image: url(img/menu-destek-indirmeler.jpg);
    }

    .menu-detail-col-right > div#menu-detail-destek-dokumanlar .content-right {
        background-image: url(img/menu-destek-dokumanlar.jpg);
    }

    .menu-detail-col-right > div#menu-detail-destek-lisanslama .content-right {
        background-image: url(img/menu-destek-lisanslama.jpg);
    }

    .menu-detail-col-right > div#menu-detail-kurumsal .content-right {
        background-image: url(img/menu-kurumsal.jpg);
    }

    .menu-detail-col-right > div#menu-detail-kurumsal-iletisim .content-right {
        background-image: url(img/menu-kurumsal-iletisim.jpg);
    }

    .menu-detail-col-right > div#menu-detail-kurumsal-hakkimizda .content-right {
        background-image: url(img/menu-kurumsal-hakkimizda.jpg);
    }

    .menu-detail-col-right > div#menu-detail-kurumsal-yonetim-ekibi .content-right {
        background-image: url(img/menu-kurumsal-yonetim-ekibi.jpg);
    }

.menu-detail-col-right p {
    display: inline-block;
    width: 100%;
    margin: 0;
    padding: 0;
}

.menu-detail-col-right h1, .menu-detail-col-right h2, .menu-detail-col-right h3, .menu-detail-col-right h4, .menu-detail-col-right h5, .menu-detail-col-right h6 {
    margin: 0;
    padding: 0;
}

div.mobile-menu {
    position: fixed;
    display: none;
    width: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: #fff;
    box-shadow: -20px 0 20px 0 rgba(0,0,0,0.3);
    overflow-x: hidden;
    overflow-y: auto;
}

    div.mobile-menu div.header {
        padding: 0 10px;
        height: 50px;
    }

    div.mobile-menu .master {
        display: table;
        width: 100%;
        padding: 13px 15px;
        font-size: 16px;
        color: #777;
        cursor: pointer;
        box-shadow: 0 1px 0 0 transparent inset, 0 -1px 0 0 rgba(0,0,0,0.1) inset;
        transition: all linear 0.15s;
    }

        div.mobile-menu .master:hover, div.mobile-menu .master:focus, div.mobile-menu .master:active {
            background: rgba(0,0,0,0.1);
            box-shadow: 0 1px 0 0 rgba(0,0,0,0.15) inset, 0 -1px 0 0 rgba(0,0,0,0.15) inset, 0 5px 5px 0 rgba(0,0,0,0.15) inset;
            transition: all linear 0.15s;
        }

        div.mobile-menu .master div {
            display: none;
            margin: 0 -15px;
            padding: 20px 0 0 0;
            opacity: 0;
        }

    div.mobile-menu .master-selected {
        background-color: #999 !important;
        color: #fff;
        transition: all linear 0.15s;
    }

        div.mobile-menu .master-selected:hover, div.mobile-menu .master-selected:focus, div.mobile-menu .master-selected:active {
            transition: all linear 0.15s;
        }

    div.mobile-menu a.detail {
        display: block;
        padding: 10px 48px;
        font-size: 14px;
        color: #000;
        background: #fff;
        box-shadow: 0 1px 0 0 transparent inset, 0 -1px 0 0 rgba(0,0,0,0.1) inset;
        transition: all linear 0.15s;
    }

        div.mobile-menu a.detail:last-child {
            margin-bottom: -13px;
        }

        div.mobile-menu a.detail:hover, div.mobile-menu a.detail:focus, div.mobile-menu a.detail:active {
            background-color: #f80;
            color: #fff;
            box-shadow: 0 1px 0 0 rgba(0,0,0,0.15) inset, 0 -1px 0 0 rgba(0,0,0,0.15) inset, 0 5px 5px 0 rgba(0,0,0,0.15) inset;
            transition: all linear 0.15s;
        }