@font-face {
  font-family: 'Inter';               
  src: url('/static/frontend/fonts/Inter-Regular.otf') format('opentype');
  font-weight: normal;                 
  font-style: normal;
}

body {
    font-family: 'Inter';
}

.topbox {
    display: flex;
}

.col-left {
    display: flex;
    flex: 1;
    justify-content: space-between;
}

.felirat {
    width: 300px;
    text-transform: uppercase;
    margin-right: 10px; 
    text-align: right;
    
    font-size: 16px;
    line-height: 20px;
}

.col-right {
  display: flex;  
}

.col-right img {
    display: block;         
    height: 145px;     
    width: auto;
}  

.desktop-menu a {
    font-family: "Satoshi";
    font-weight: 500;
    font-size: 15px;
    line-height: 100%;
    color: #454C5D;
}

header {
    background-color: #fff;
}

header nav {
    width: 100%;
}

header .mcontainer > nav ul li a, .page-menu .mcontainer > nav ul li a {
    color: #E74550 !important;
}

header nav ul.main li {
    margin-right: 8px;
}

header .mcontainer {
    border-top: none !important;
    background-color: #E74550;
}

header .mcontainer {
    padding: 10px;
    max-width: 1000px;
}

.teruleti-col1 li a {
    text-decoration: none;
}

.teruleti-col2 li a {
    text-decoration: none;
}

header .mcontainer.sub-menu {
    border-bottom: 0;
}

header .mcontainer.sub-menu .table {
    max-width: 1030px;
}

/* DESKTOP menü */

@media (min-width: 768px) {

    .topbox {
        max-height: 145px;
    }
    
    .teruleti-nav {
        display: flex;                
    }

    .teruleti-nav .container {
        display: flex;
        border-top: 2px solid #E74550;
        border-bottom: 2px solid #E74550;
        padding: 0;
        max-width: 1000px;
        margin-top: 10px;
    }

    .teruleti-col1 {
        flex: 0 0 70%;
        margin-bottom: 0;
        padding-left: 0;
    }
    
    .teruleti-col1 li {
        display: inline-block;
        padding: 20px 20px 20px 0px;
    }
    
    .teruleti-col1 li a {        
        display: inline-block;
    }
    
    .teruleti-col2 li {
        display: inline-block;
    }
    
    .teruleti-col2 li a {
        display: inline-block;
        padding: 20px 0 20px 10px;
    }
    
    .teruleti-col2 {
        flex: 0 0 30%;
        margin-bottom: 0; 
        text-align: right;       
    }    

    span.menu-button {
        display: none;
    }
    .hidden-lg {
        display: none;
    }  
    
    header .mcontainer.sub-menu .table nav > ul > li ul {
        border-top: 0;
        padding-left: 0;
    }

    header .mcontainer.sub-menu .table {
        border-bottom: 1px solid #454C5D;
    }

    header .mcontainer.sub-menu .table nav > ul > li > a {
        text-transform: uppercase;
        font-weight: 700;
        padding-left: 0;
        text-indent: 0;
        margin-bottom: 12px;
        line-height: 130%;
        color: #454C5D;
        font-family: "Satoshi";
    }

    header .mcontainer.sub-menu .table nav > ul > li > a.sub-label {
        margin-bottom: 6px;
    }

    .mobil-menu {
        display: none;
    }

    .mcontainer.clearfix.mobil {
        display: none;
    }
}

/* MOBIL menü */

@media (max-width: 767px) {
    
    .teruleti-nav {
        display: none;
        position: absolute;
        top: 50px;
        top: 65px;      
        z-index: 100;
        padding-left: 70px;
    }

    .teruleti-nav.active {
        display: block;
    }
    span.menu-button {
        position: absolute;
        right: 0px;
        font-size: 24px;
        padding: 21px;
    }

    .teruleti-nav .container {
        display: block;
        background: #E2E2E2;
    }

    header nav {
        height: auto;
    }

    header nav ul {
        padding: 0;
    }

    header nav ul li {
        width: 100%;        
    } 

    header nav ul.teruleti-col1 > li > a,  header nav ul.teruleti-col2 > li > a {        
        border-bottom: 1px solid #E74550;
        font-size: 16px;
        line-height: 45px;
        width: 100%;
    }     
 
    .teruleti-col1 {
        margin-bottom: 0;
    }
    
    .teruleti-col1 li {
        display: inline-block;
    }   
    
    .teruleti-col1 li a {
        color: #000;
    }

    .teruleti-col2 li a {
        color: #000;
    }
    
    .teruleti-col1 > li > a, .teruleti-col2 > li > a {
        text-transform: uppercase;
        padding: 8px 8px 8px 12px;
        display: inline-block;
    }
    
    .teruleti-col2 li {
        display: inline-block;
    }
    
    .teruleti-col2 li a {
        display: inline-block;
    }
    
    .teruleti-col2 {
        margin-bottom: 0;
    }
    .teruleti-nav .container {
        display: block;
        padding: 0;
    }
    
    .hidden-xs {
        display: none;
    }

    header .mcontainer {
        padding-top: 19px;
        padding-bottom: 18px;
    }

    header .mcontainer.sub-menu {
        background-color: #E2E2E2;
        border-bottom: 1px solid #E74550;
        padding-top: 11px;
        padding-bottom: 11px;
    }

    .sub-menu li {
        line-height: 30px;
    }

    header .mcontainer.sub-menu .table {
        padding-top: 0;
        padding-bottom: 0;
    }   

    header .mcontainer.sub-menu .table nav > ul > li > a {
        margin-bottom: 0;
    }

    .desktop-menu {
        display: none;
    }

    .close-icon {
        display: none;
    }

    .menu-button.open .hamburger-icon {
        display: none;
    }

    .menu-button.open .close-icon {
        display: inline;
    }

    .menu-button.open {
        background-color: #E2E2E2;        
    }

    .mcontainer.clearfix.desktop {
        display: none;
    }

    .col-left {
        justify-content: normal;
    }    

    .felirat {
        text-align: left;
        margin-left: 8px;
        width: 180px;
        font-size: 9px;
        line-height: 1.2;
        align-self: flex-end;
    }
}

@media (max-width: 1030px) {
    header .mcontainer {
        max-width: 900px;
    }

    .teruleti-nav.desktop-menu .container {
        width: 900px;
    }    
}

@media (max-width: 920px) {
    header .mcontainer {
        max-width: 100%;
    }

    .col-right img {
        max-width: 100%;
    }

    .teruleti-nav .container {
        max-width: 750px;
    }    
}