@font-face {
    font-family: 'DINBlack';
    src: url('../fonts/DINBlack.eot');
    /* IE9 Compat Modes */
    src: url('../fonts/DINBlack-1.eot') format('embedded-opentype'), /* IE6-IE8 */
    url('../fonts/DINBlack.woff2') format('woff2'), /* Super Modern Browsers */
    url('../fonts/DINBlack.woff') format('woff'), /* Pretty Modern Browsers */
    url('../fonts/DINBlack.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../fonts/DINBlack.svg') format('svg');
    /* Legacy iOS */
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'DINBold';
    src: url('../fonts/DINBold.eot');
    /* IE9 Compat Modes */
    src: url('../fonts/DINBold-1.eot') format('embedded-opentype'), /* IE6-IE8 */
    url('../fonts/DINBold.woff2') format('woff2'), /* Super Modern Browsers */
    url('../fonts/DINBold.woff') format('woff'), /* Pretty Modern Browsers */
    url('../fonts/DINBold.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../fonts/DINBold.svg') format('svg');
    /* Legacy iOS */
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'DINLight';
    src: url('../fonts/DINLight.eot');
    /* IE9 Compat Modes */
    src: url('../fonts/DINLight-1.eot') format('embedded-opentype'), /* IE6-IE8 */
    url('../fonts/DINLight.woff2') format('woff2'), /* Super Modern Browsers */
    url('../fonts/DINLight.woff') format('woff'), /* Pretty Modern Browsers */
    url('../fonts/DINLight.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../fonts/DINLight.svg') format('svg');
    /* Legacy iOS */
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'DINMedium';
    src: url('../fonts/DINMedium.eot');
    /* IE9 Compat Modes */
    src: url('../fonts/DINMedium-1.eot') format('embedded-opentype'), /* IE6-IE8 */
    url('../fonts/DINMedium.woff2') format('woff2'), /* Super Modern Browsers */
    url('../fonts/DINMedium.woff') format('woff'), /* Pretty Modern Browsers */
    url('../fonts/DINMedium.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../fonts/DINMedium.svg') format('svg');
    /* Legacy iOS */
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'DINRegular';
    src: url('../fonts/DINRegular.eot');
    /* IE9 Compat Modes */
    src: url('../fonts/DINRegular-1.eot') format('embedded-opentype'), /* IE6-IE8 */
    url('../fonts/DINRegular.woff2') format('woff2'), /* Super Modern Browsers */
    url('../fonts/DINRegular.woff') format('woff'), /* Pretty Modern Browsers */
    url('../fonts/DINRegular.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../fonts/DINRegular.svg') format('svg');
    /* Legacy iOS */
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'DINUltraLight';
    src: url('../fonts/DINUltraLight.eot');
    /* IE9 Compat Modes */
    src: url('../fonts/DINUltraLight-1.eot') format('embedded-opentype'), /* IE6-IE8 */
    url('../fonts/DINUltraLight.woff2') format('woff2'), /* Super Modern Browsers */
    url('../fonts/DINUltraLight.woff') format('woff'), /* Pretty Modern Browsers */
    url('../fonts/DINUltraLight.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../fonts/DINUltraLight.svg') format('svg');
    /* Legacy iOS */
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'DINHeavy';
    src: url('../fonts/DINHeavy.eot');
    /* IE9 Compat Modes */
    src: url('../fonts/DINHeavy-1.eot') format('embedded-opentype'), /* IE6-IE8 */
    url('../fonts/DINHeavy.woff2') format('woff2'), /* Super Modern Browsers */
    url('../fonts/DINHeavy.woff') format('woff'), /* Pretty Modern Browsers */
    url('../fonts/DINHeavy.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../fonts/DINHeavy.svg') format('svg');
    /* Legacy iOS */
    font-weight: normal;
    font-style: normal;
}


/* DEFAULT SETTINGS */

html {
    scroll-behavior: smooth !important;
}

html,
body {
    height: 100%;
    font-family: 'DINRegular';
}

button,
textarea,
input:focus {
    outline: none !important;
    box-shadow: none !important;
}

a {
    transition: all .2s ease-in-out;
}

.font-black{
    font-family: 'DINBlack';
}

.font-bold{
    font-family: 'DINBold';
}

.font-light{
    font-family: 'DINLight';
}

.font-medium{
    font-family: 'DINMedium';
}

.font-regular{
    font-family: 'DINRegular';
}

.font-ultra-light{
    font-family: 'DINLight';
}

.font-heavy{
    font-family: 'DINHeavy';
}

.hh-100 {
    height: 100vh;
    min-height: 500px;
}

.hh-100-ekip {
    height: 600px;
    min-height: 500px;
}

.font-size-14{
    font-size: 14px !important;
}

.font-size-18{
    font-size: 18px !important;
}

/* DEFAULT SETTINGS */

.bg-color-home{
    background-color: #b4ad92;
}
.bg-color-home p{
    color: #f3eedc;
    font-size: 16px;
    letter-spacing: 6px;
}
.bg-color-home .bottom-text{
    position: absolute;
    bottom: 100px;
    left: 0px;
    right: 0px;
}

.hamburger{
    position: absolute;
    top: 7%;
    left: 5%;
    z-index: 101;
}
.hamburger-inner-page{
    position: absolute;
    top: 7%;
    left: inherit;
    z-index: 101;
}
.hamburger-box{
    width: 36px;
}
.hamburger-inner.dark-burger, .hamburger-inner.dark-burger::before, .hamburger-inner.dark-burger::after{
    background-color: #000 !important;
}
.hamburger-inner, .hamburger-inner::before, .hamburger-inner::after{
    width: 36px;
    background-color: #FFF;
}
.hamburger.is-active .hamburger-inner, .hamburger.is-active .hamburger-inner::before, .hamburger.is-active .hamburger-inner::after{
    background-color: #c7cbcb;
}
.hamburger .menu-text{
    position: absolute;
    top: 30px;
    left: 2px;
    color: #f3eedc;
    font-size: 12px;
}
.hamburger.is-active .menu-text{
    display: none;
}

.maanaa-logo{
    padding: 0 80px;
}
.btn-language{
    position: absolute;
    right: 20px;
    top: 9%;
    color: #FFFFFF;
    font-size: 22px;
}
.btn-language:hover{
    text-decoration: none;
    color: #f3eedc;
}

.maanaa-menu{
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    z-index: 100;
    height: 100vh;
    display: none;
}
.maanaa-menu.active{
    display: inline;
}
.maanaa-menu, .maanaa-menu .row{
    min-height: 100vh;
}
.maanaa-menu .drop-menu-item{
    transition: all .2s ease-in-out;
}

.maanaa-menu ul.drop-menu > li{
    margin: 15px 0 !important;
}
.maanaa-menu ul.drop-menu > li:last-child{
    margin: 0 0 !important;
}
.maanaa-menu ul > li > .list-item{
    font-size: 30px;
    color: #cdd1d1;
    font-family: 'DINLight';
    display: block;
}
.maanaa-menu ul > li > .list-item:hover{
    text-decoration: none;
    color: #697577;
}
.maanaa-menu ul > li > .list-item.active{
    text-decoration: none;
    color: #697577;
}

.maanaa-menu ul ul{
    position: absolute;
    margin-top: -100px;
    left: 220px;
    z-index: 15;
    padding: 0 0 0 70px;
    display: none;
}
.maanaa-menu ul ul.drop-sub-menu-02{
    position: absolute;
    margin-top: -100px;
    left: 530px;
    z-index: 15;
    padding: 0 0 0 50px;
    display: none;
}
.maanaa-menu ul ul.active{
    display: inherit !important;
}
.maanaa-menu ul ul li{
    padding:4px 0;
}
.maanaa-menu ul ul li .list-item{
    font-size: 16px;
    color: #cdd1d1;
    font-family: 'DINMedium';
    display: block;
}





.maanaa-menu .maanaa-bg-image{
    background-color: #FFFFFF;
    background-image: url(../img/manaa-menu-bg.jpg);
    background-position: left center;
    background-repeat: no-repeat;
}
.maanaa-menu .maanaa-title{
    color: #697577;
    letter-spacing: 2px;
}

.maanaa-card{
    color: #FFFFFF;
    align-items: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    font-size: 300px;
    transition: background-color 1s;
}
.maanaa-card::before{
    position: absolute;
    top: 0; right: 0; bottom: 0; left: 0;
    background-color: inherit;
    content: ' ';
}

.maanaa-card .left-title{
    position: absolute;
    left: 30px;
    top: 40px;
}
.maanaa-card:hover .left-title{
    color: #FFF;
    text-decoration: none;
    
}
.maanaa-card .right-title{
    position: absolute;
    right: 30px;
    top: 40px;
}
.maanaa-card:hover .right-title{
    color: #FFF;
    text-decoration: none;
    
}
.maanaa-card .title{
    font-size: 18px;
    writing-mode: vertical-rl;
    text-orientation: mixed;
    letter-spacing: 2px;
}
.maanaa-card .numbers{
    z-index: 10;
}


.maanaa-card2{
    color: #000;
    align-items: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    font-size: 300px;
    transition: background-color 1s;
}
.maanaa-card2::before{
    position: absolute;
    top: 0; right: 0; bottom: 0; left: 0;
    background-color: inherit;
    content: ' ';
}

.maanaa-card2 .left-title{
    position: absolute;
    left: 30px;
    top: 40px;
}
.maanaa-card2:hover .left-title{
    color: #FFF;
    text-decoration: none;
    
}
.maanaa-card2 .right-title{
    position: absolute;
    right: 30px;
    top: 40px;
}
.maanaa-card2:hover .right-title{
    color: #FFF;
    text-decoration: none;
    
}
.maanaa-card2 .title{
    font-size: 18px;
    writing-mode: vertical-rl;
    text-orientation: mixed;
    letter-spacing: 2px;
}
.maanaa-card2 .numbers{
    z-index: 10;
}


.ekibimiz-card{
    color: #000;
    align-items: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    font-size: 300px;
    transition: background-color 1s;
    height: 400px
}
.ekibimiz-card::before{
    position: absolute;
    top: 0; right: 0; bottom: 0; left: 0;
    background-color: inherit;
    content: ' ';
}

.ekibimiz-card .left-title{
    position: absolute;
    left: 30px;
    top: 40px;
}
.ekibimiz-card:hover .left-title{
    color: #FFF;
    text-decoration: none;
    
}
.ekibimiz-card .right-title{
    position: absolute;
    right: 30px;
    top: 40px;
}
.ekibimiz-card .right-title2{
    position: absolute;
    right: 48px;
    top: 40px;
}
.ekibimiz-card:hover .right-title{
    color: #FFF;
    text-decoration: none;
    
}
.ekibimiz-card:hover .right-title2{
    color: #FFF;
    text-decoration: none;
    
}
.ekibimiz-card .title{
    font-size: 18px;
    writing-mode: vertical-rl;
    text-orientation: mixed;
    letter-spacing: 0px;
}
.ekibimiz-card .numbers{
    z-index: 10;
}


.ekibimiz-card-short{
    color: #000;
    align-items: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    font-size: 300px;
    transition: background-color 1s;
    height: 350px
}
.ekibimiz-card-short::before{
    position: absolute;
    top: 0; right: 0; bottom: 0; left: 0;
    background-color: inherit;
    content: ' ';
}

.ekibimiz-card-short .left-title{
    position: absolute;
    left: 30px;
    top: 40px;
}
.ekibimiz-card-short:hover .left-title{
    color: #FFF;
    text-decoration: none;
    
}
.ekibimiz-card-short .right-title{
    position: absolute;
    right: 30px;
    top: 40px;
}
.ekibimiz-card-short .right-title2{
    position: absolute;
    right: 48px;
    top: 40px;
}
.ekibimiz-card-short:hover .right-title{
    color: #FFF;
    text-decoration: none;
    
}
.ekibimiz-card-short:hover .right-title2{
    color: #FFF;
    text-decoration: none;
    
}
.ekibimiz-card-short .title{
    font-size: 18px;
    writing-mode: vertical-rl;
    text-orientation: mixed;
    letter-spacing: 0px;
}
.ekibimiz-card-short .numbers{
    z-index: 10;
}



.iletisim-card{
    color: #000;
    align-items: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    font-size: 300px;
    transition: background-color 1s;
    height: 130px
}
.iletisim-card::before{
    position: absolute;
    top: 0; right: 0; bottom: 0; left: 0;
    background-color: inherit;
    content: ' ';
}

.iletisim-card .left-title{
    position: absolute;
    left: 30px;
    top: 40px;
}
.iletisim-card:hover .left-title{
    color: #FFF;
    text-decoration: none;
    
}
.iletisim-card .right-title{
    position: absolute;
    right: 30px;
    top: 40px;
}
.iletisim-card .right-title2{
    position: absolute;
    right: 48px;
    top: 40px;
}
.iletisim-card:hover .right-title{
    color: #FFF;
    text-decoration: none;
    
}
.iletisim-card:hover .right-title2{
    color: #FFF;
    text-decoration: none;
    
}
.iletisim-card .title{
    font-size: 18px;
    writing-mode: vertical-rl;
    text-orientation: mixed;
    letter-spacing: 0px;
}
.iletisim-card .numbers{
    z-index: 10;
}






.mask-30:hover{
    background-color: rgba(79,97,130,.7);
    text-decoration: none;
    color: #FFF;
}
.mask-19:hover{
    background-color: rgba(101,54,43,.7);
    text-decoration: none;
    color: #FFF;
}
.mask-47:hover{
    background-color: #d8b56c91;
    text-decoration: none;
    color: #FFF;
}

.mask-ekip:hover{
    background-color: rgba(0,0,0,.1);
    text-decoration: none;
    color: #000;
}


.gallery-card{
    color: #FFFFFF;
    align-items: center;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    text-align: center;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    font-size: 16px;
    letter-spacing: 1px;
}
.gallery-card .gallery-padding{
    padding-bottom: 10vh;
}
.gallery-card .gallery-padding a{
    color: #FFFFFF;
}

.floor-plan{
    background-color: #adb6b7;
    color: #FFFFFF;
    align-items: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    background-position: center right;
    background-repeat: no-repeat;
    background-size: 85% auto;
    font-size: 18px;
}
.floor-plan a{
    color: #FFFFFF;
    letter-spacing: 3px;
    text-decoration: underline;
}
.floor-plan a:hover{
    color: rgb(224, 224, 224);
    text-decoration: none;
    text-decoration: underline;
}
.floor-plan .left-title{
    position: absolute;
    left: 30px;
    top: 40px;
}
.floor-plan .right-title{
    position: absolute;
    right: 30px;
    top: 40px;
}
.floor-plan .title{
    font-size: 14px;
    writing-mode: vertical-rl;
    text-orientation: mixed;
    letter-spacing: 2px;
}
.floor-plan .info{
    position: absolute;
    bottom: 10vh;
    letter-spacing: 2px;
    font-size: 10px;
}






.maps{
    color: #697577;
    align-items: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}

.maps a.click-me{
    color: #697577;
    text-decoration: underline;
    font-size: 22px;
    letter-spacing: 2px;
}
.maps a.click-me:hover{
    text-decoration: underline;
    color: #a1b4b8;
}


.maps .link-mail{
    font-size: 20px;
    letter-spacing: 2px;
}
.maps .link-mail a{
    color: #697577;
    text-decoration: underline;
    font-size: 20px;
}
.maps .link-mail a:hover{
    text-decoration: underline;
    color: #a1b4b8;
}

.maps address{
    letter-spacing: 1px;
    font-size: 20px;
}



.intro-video{
    color: #97a2a4;
    align-items: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}
.intro-video .h5{
    letter-spacing: 2px;
}
.intro-video medium{
    letter-spacing: 2px;
    font-size: 12px;
}
.intro-video .play-button{
    position: absolute;
    justify-content: center;
    text-align: center;
}
.intro-video .play-button img{
    transition: transform .3s;
}
.intro-video .play-button:hover img{
    transform: scale(1.2);
}


.slider{
    color: #97a2a4;
    background-color: #fff;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    font-size: 14px;
}
.slider .left-title{
    position: absolute;
    left: 30px;
    top: 40px;
}
.slider .title{
    font-size: 14px;
    writing-mode: vertical-rl;
    text-orientation: mixed;
    letter-spacing: 2px;
    z-index: 100;
}
.slider .slider-title{
    color: #000;
    letter-spacing: 0px;
    font-size: 24px;
}
.slider p{
    color: #97a2a4;
    font-size: 16px;
    font-family: 'DINMedium';
    letter-spacing: 0px;
    padding: 0 30px 16px
}
.slider .bx-wrapper{
    border: 0;
    box-shadow: none;
    background-color: inherit;
    margin-bottom: 0px;
}
.slider .bx-controls{
    position: absolute;
    bottom: 70px;
    width: 100%;
}
.slider .bx-item{
    padding: 0 50px;
    height: 100vh;
}
.slider .bx-wrapper .bx-pager.bx-default-pager a {
    background: #dce5e6;
    width: 7px;
    height: 7px;
}
.slider .bx-wrapper .bx-pager.bx-default-pager a:hover, .bx-wrapper .bx-pager.bx-default-pager a.active, .bx-wrapper .bx-pager.bx-default-pager a:focus{
    background: #97a2a4 !important;
}

.slider .slider-pager{
    position: absolute;
    bottom: 30px;
    color: #97a2a4;
    font-size: 16px;
    font-family: 'DINMedium';
    left: 0px;
    right: 0px
}
.slider .slider-pager a{
    color: #97a2a4;
    padding: 0 10px
}
.slider .slider-pager a.active{
    font-family: 'DINBlack' !important;
}
.slider .slider-pager a:hover{
    text-decoration: none;
}

header{
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    min-height: 765px;
    height: 100vh;
}
header.short{
    height: 400px !important;
    min-height: 300px !important;
}

header.shortextra{
    height: 200px !important;
    min-height: 200px !important;
}

header a{
    color: #FFFFFF;
    font-size: 22px;
}
header a:hover{
    color: #f3eedc;
    text-decoration: none;
}
header .title{
    font-size: 32px;
    color: #FFFFFF;
    letter-spacing: 2px;
}

header .number{
    font-size: 260px;
    line-height: 245px;
    color: #FFFFFF;
    letter-spacing: 2px;
}

header .language-dark{
    color: #000 !important;
}

.reason{
    background-color: #fff;
}


.inner-body .text-title-color{
    color: #000;
}
.inner-body .text-color{
    color: #58686b;
}

.inner-body .light-button{
    width: 118px;
    height: 118px;
    background-color: #f7f7f7;
    display: inline-block;
    color: #697577;
    font-size: 12px;
}
.inner-body .light-button:hover{
    text-decoration: none;
    color: #b4ad92;
}
.inner-body .light-button .light-button-img{
    height: 70%;
}
.inner-body .light-button .light-button-text{
    height: 30%;
}




footer{
    min-height: 230px;
    font-size: 12px;
    color: #909b9e;
    line-height: 16px;
}
footer .row{
    min-height: 230px;
}
footer .row .contact{
    font-size: 16px;
}
footer .row .contact a{
    color: #909b9e;
}
footer .row .contact a:hover{
    color: #b4ad92;
    text-decoration: none;
}
footer .row .contact a i{
    font-size: 20px;
}
footer .row ul li{
    padding-bottom: 2px;
    margin-top: 8px;
    font-size: 14px;
}
footer .row ul li a:hover{
    text-decoration: none;
    color: #b4ad92;
}




@media (max-width: 575.98px) {
    .maanaa-card .numbers{
        font-size: 50vw !important;
    }
    header .title{
        font-size: 8vw;
    }
}

@media (min-width: 576px) and (max-width: 768px) {}

@media (max-width: 768px) {
    .maanaa-menu ul ul{
        position: relative;
        margin-top: inherit;
        left: inherit;
        padding: 0;
    }
    .maanaa-menu ul ul.drop-sub-menu-02{
        position: relative;
        margin-top: inherit;
        left: inherit;
        padding: 0;
    }
    .hamburger{
        left: 2% !important;
        top: 3% !important;
    }
}

@media (max-width: 992px) {
    .intro-video .intro-mobile{
        padding: 300px 0;
    }
    .mobile-hidden{
        display: none !important;
    }
    footer{
        margin-top: 100px;
    }
    .inner-body .border-right{
        border: none !important;
    }
    .floor-plan .info{
        bottom: 3vh;
    }
    header .number{
        font-size: 30vw;
    }
}

@media (min-width: 992px) {
    .desktop-hidden{
        display: none !important;
    }
}

@media (max-width: 1200px) {}

@media (min-width: 768px) and (max-width: 991.88px) {}

@media (min-width: 992px) and (max-width: 1200px) {}