body {
    margin:0px;
/*font-family: 'Open Sans', sans-serif;*/
/*font-family: 'Nunito', sans-serif;*/
font-family: 'Montserrat', sans-serif;
    color:#424546;
    font-size:17px ;  letter-spacing:0.10px;
    background:#fff;
  
    }
html {
  scroll-behavior: smooth;
}
a, a:hover, a:focus {
 color:inherit; text-decoration:none
}
b {
 font-weight:500 !important
}
h4 {
 font-weight:600
}
.btn {
 border-radius:0px
}
.btn-dark {
 background:#c4c4c4
}
header {
  background:#dfdfdf;  padding-top:10px; padding-bottom:10px; color:#333; transition:0.40s;
}
/*.sticky-header header {
 position:fixed; top:0px; left:0px; right:0px;z-index:1000
}
.sticky-header .banner { position:absolute; top:-100vh
}
.sticky-header .page-container {
     padding-top:300px
}
    .sticky-header .menu-col {
       position:fixed; top:120px
    }*/
header h3 {
    margin-top:10px
}
.logo-box img {
 max-width:100%
}
.banner {
 display:none;
}
.banner img {
 width:100%;
}
.menu-col {
 padding-left:0px;
}
.menu-container {
  background:#f5f7f7;  margin-top:30px; width:90%
}
    .menu-container ul {
     list-style-type:none; padding-left:0px
    }
     .menu-container li {
      padding:10px 20px; border-bottom:solid 1px #dfdfdf; font-weight:600; font-size:15px;
    }
        .menu-container li:hover { 
            background:#dfdfdf
        }
           .menu-container li.active {
        background:#dfdfdf
    }
.page-content {
 margin-top:30px;padding-bottom:50px
}

.alt-banner img {
    width:90%
}
    .btn-menu {
display:none
}

.sm-icon {
 text-align:right
}
footer {
 padding:15px; background:#dcdddd
}
.footer-logo img {
      max-width:90%
    }
.alt-footer {
    background:#333; padding:15px; font-size:12px; font-weight:500
}
 .organization-logo { text-align:right
    }
    .copyright-col {  padding-top:15px
}
.footer-btn {
    padding-top:15px; padding-bottom:15PX
}
.gallery img {
  height:100px;
}
.page-title {
 padding-bottom:15px;  margin-bottom:25px; border-bottom:solid 1px #dfdfdf}
@media (max-width:992px) {
    .logo-box {
    text-align:center; padding-bottom:10px; padding-top:10px;
    }
    .menu-col {
 padding-left:0px !important; padding-right:0px !important;  padding-top:5px
}
 .menu-container {
  background:#f5f7f7;  margin-top:0px; width:100%;display:none;
}
 .alt-banner img {
    width:100%; display:none
}
    .btn-menu {
     background:#c5c5c5; text-align:center; padding:10px 7px; cursor:pointer; display:block
    }
}
@media (max-width:768px) {
    .header-title h3 {
        font-size:18px

    }
    .sm-icon {
 text-align:center; padding-top:15px; padding-bottom:15px
}
    .footer-logo {
     text-align:center
    }
    .organization-logo { text-align:center
    }
    .copyright-col { text-align:center
}
}

.header {
    padding: 10px;
    position: relative;
    top: 10px;
    z-index: 900;
    width: 100%;
    display: flex;
    justify-content: center;
}

.navbar {
    background-color: RGBA(255, 255, 255, 0.9);
    padding-left: 20px;
    padding-right: 20px;
    /*border: solid 1px #ccc; border-radius:10px;*/
}

.navbar-collapse {
    justify-content: center
}


.sticky-scroll .navbar {
    border: none;
}


.dilSecenekleri {
    position: absolute;
    right: 20px;
    top: 0px;
    background-color: RGBA(255,255,255,0.9);
    border: solid 1px #ccc;
    border-radius: 0px 0px 10px 10px;
    padding: 10px;
    z-index: 1000;
    font-size: 12px;
}

.sticky-scroll > .dilSecenekleri {
    border-width: 0px;
    border-radius: unset;
    padding: unset;
    top: 29px;
    background: none;
}


.dilSecenegi {
    display: block;
    padding-top: 10px;
    padding-bottom: 10px;
}

.dilSecenegi:not(:last-child) {
    border-bottom: solid 1px #ccc;
}

.dilSecenegi.active {
    font-weight: bold;
    color: #ff6a00
}

.sticky-scroll .dilSecenekleri .dilSecenegi {
    transition: all 0.5s;
    display: inline;
}

.sticky-scroll .dilSecenekleri .dilSecenegi:not(:last-child) {
    border-bottom: none;
}

.sticky-scroll .dilSecenekleri .dilSecenegi:not(:last-child)::after {
    content: " | ";
    color: #ccc;
}


.sticky-top {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    /*background-color: #f8f9fa;*/ /* Background color for the sticky header */
    z-index: 100; /* To ensure the sticky header is above other elements */
    transition: background-color 0.5s; /* Transition for style change */
}

.sticky-scroll {
    background-color: #fff;
    border-bottom: solid 1px #ccc;
}


/*.banner { margin-top:-77px;}*/


.social-icons img {
    height: 32px;
}

@media all and (min-width:0px) and (max-width: 1024px) {

    .menu { width:100%; }
    .navbar-nav { margin-top:50px; }
    .social-icons { margin-top: 30px; padding-left:0px !important;}
}




html{
    --black-bg: black;
    --black-txt: black;
    --black-o: 0, 0, 0;
    --white-bg: #766a62;
    --main-white-bg: #f8f4f2;
    --main-white-bg-txt: #766a62;
    --main-white-bg-txt-o: 117, 105, 97;
    --white-txt: white;
    --white-o: 255, 255, 255;

    --transition-2s-ease: all .2s  ease;
    --transition-3s-ease: all .3s  ease;
    --transition-4s-ease: all .4s  ease;
    --transition-5s-ease: all .5s  ease;
}



/* LEFT NAV */
body:has(.left-nav):not(.v2){ padding-left: 80px;}
body:has(.left-nav).v2{ padding-top: 80px;}
.left-nav{ height: 100vh; position: fixed; left: 0; top: 0; z-index: 20; backdrop-filter: blur(7px);}
.left-nav .show{ transition: var(--transition-4s-ease) .1s; background-color: rgba(var(--black-o), .7); z-index: 11; position: relative; height: 100%; width: 80px; border-right: 1px solid rgba(var(--white-o), .3); display: flex; align-items: center; justify-content: space-between; padding: 30px 0; flex-direction: column;}
/* .left-nav.open .show{ background-color: var(--white-bg);} */
.left-nav .show .top{ cursor: pointer; display: flex; flex-direction: column; align-items: center;}
.left-nav .show .top .icon{ font-size: 22px; position: relative; display: flex; align-items: center; justify-content: center; width: 24px; height: 24px; color: var(--white-txt);}
.left-nav .show .top .icon svg{ transition: var(--transition-2s-ease); position: absolute; opacity: 0;}
.left-nav .show .top .icon .bar{ display: flex; flex-direction: column;}
.left-nav .show .top .icon .bar > span{ display: inline-block; margin-bottom: 6.3px; width: 25px; border: .75px solid var(--white-txt); height: 0; border-radius: 3px;}
.left-nav .show .top .icon .bar > span.short{ margin-left: 0px; width: 17px; transition: var(--transition-2s-ease);}
.left-nav .show .top:hover .icon .bar > span.short{ margin-left: 8px;}
.left-nav .show .top .icon .open{ opacity: 1;}
.left-nav.open .show .top .icon .open{ opacity: 0;}
.left-nav.open .show .top .icon .close{ opacity: 1;}
.left-nav .show .top .txt{ font-size: 15px; height: 52px; position: relative; writing-mode: vertical-lr; text-orientation: mixed; transform: rotate(180deg); display: flex; align-items: center;}
.left-nav .show .top .txt > span{ transition: var(--transition-2s-ease); opacity: 0; position: absolute; top: -1px;}
.left-nav .show .top .txt > span.open{ opacity: 1;}
.left-nav.open .show .top .txt > span.open{ opacity: 0;}
.left-nav.open .show .top .txt > span.close{ opacity: 1;}
.left-nav .show .top .icon,
.left-nav .show .top .txt{ transition-delay: .25s; color: var(--white-txt);}
.left-nav.open .show .top .icon,
.left-nav.open .show .top .txt{ user-select: none; color: var(--white-txt);}
/* .left-nav .show .middle{} */
.left-nav .show .middle .img-area{ position: relative; width: 50px; height: 50px; display: flex; align-items: center; justify-content: center;}
.left-nav .show .middle .img-area > img{ transition-delay: .25s; transition: var(--transition-2s-ease); opacity: 1; position: absolute; width: 100%;}
/*.left-nav .show .middle .img-area > img.light{ opacity: 1;}
.left-nav.open .show .middle .img-area > img.light{ opacity: 0;}*/
.left-nav .show .middle .img-area > img.dark{ opacity: 0;}
/* .left-nav .show .bottom{} */
.left-nav .show .bottom .social{ display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 17px;}
.left-nav .show .bottom .social > a{ font-size: 17px; transition-delay: .25s; color: var(--white-txt);}
.left-nav.open .show .bottom .social > a{ color: var(--white-txt);}

.left-nav .menu{ transition: var(--transition-5s-ease); padding-left: 130px; display: flex; align-items: center; z-index: 10; width: 430px; height: 100vh; background-color: rgba(var(--black-o), .85); position: fixed; top: 0; left: -500px; backdrop-filter: blur(5px); z-index: -1;}
.left-nav.open .menu{ left: 0; box-shadow: 0 0 30px 0 rgba(var(--black-o), .15);}
.left-nav .menu .links{ display: flex; flex-direction: column; gap: 25px; width: 100%; max-width: 280px;}
.left-nav .menu .links > div{ overflow: hidden; width: 100%;}
.left-nav .menu .links > div a{ transition: all .2s ease; text-decoration: none; color: var(--white-txt);}
.left-nav .menu .links > div span{ cursor: pointer; position: relative; display: flex; width: 100%; align-items: center;}
.left-nav .menu .links > div span.more::after{ transition: all .2s ease; content: '\f107'; display: inline-block; font-family: 'FONT AWESOME 5 FREE'; font-weight: 900; font-size: 20px; margin-left: 20px; right: 0; top: 12px; transform: rotate(0); color: var(--white-txt);}
.left-nav .menu .links .open > span.more:after{ transform: rotate(-180deg);}
.left-nav .menu .links > div span a{ font-weight: 400; font-size: 22px; color: var(--white-txt);} 
.left-nav .menu .links > div > div{ transition: all .2s ease; display: flex; flex-direction: column; padding-left: 20px;}
.left-nav .menu .links > div > div > div > div{ transition: all .2s ease; padding-left: 15px;}
.left-nav .menu .links > div > div a{ display: flex; font-weight: 400; font-size: 20px; padding: 3px 0;} 
/* .left-nav .menu .links > div{ transform: translate(-10px, -10px); opacity: 0; transition: padding .2s ease, color .2s ease, transform .6s ease, opacity .6s ease;}
.left-nav.open .menu .links > div{ transform: translate(0, 0); opacity: 1;}
.left-nav .menu .links > div:nth-child(1){ transition-delay: 0s, 0s, .2s, .2s;}
.left-nav .menu .links > div:nth-child(2){ transition-delay: 0s, 0s, .4s, .4s;}
.left-nav .menu .links > div:nth-child(3){ transition-delay: 0s, 0s, .6s, .6s;}
.left-nav .menu .links > div:nth-child(4){ transition-delay: 0s, 0s, .8s, .8s;}
.left-nav .menu .links > div:nth-child(5){ transition-delay: 0s, 0s, 1s, 1s;} */
.left-nav .menu .links a.active{ color: var(--white-txt);}
.left-nav .menu .links a:hover{ padding-left: 10px; color: var(--white-txt);}

body.v2 .left-nav .menu .links a:hover{ padding-left: 0;}
body.v2  .left-nav.open .menu{ box-shadow: none;}


.right-nav{ z-index: 20; height: fit-content; width: fit-content; display: flex; flex-direction: column; gap: 0; padding: 0; position: fixed; right: 50px; top: 0; align-items: center;}
body.v2 .right-nav{ top: 80px;}
.right-nav .languages{ border-radius: 0 0 10px 10px; padding: 10px; width: 45px; height: fit-content; display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 5px; background-color: #fff; box-shadow: 0 0 15px 0 rgba(var(--black-o), .05);}
.right-nav .languages > :is(a, span){ cursor: pointer; font-size: 13px; color: rgba(var(--black-o), .7); transition: var(--transition-2s-ease); letter-spacing: 1px;}
.right-nav .languages > :is(a, span):hover{ color: var(--black-txt);}
.right-nav .languages > :is(a, span).active{ pointer-events: none; color: var(--black-txt); letter-spacing: 1px;}
.right-nav .languages > .line{ display: inline-block; width: 25px; height: 0; border: .5px solid rgba(var(--black-o), 1); border-radius: 3px;}
.right-nav .languages > .line:last-child{ display: none;}

/* .main-contact-us{ z-index: 20; width: 100px; display: flex; justify-content: center; position: absolute; right: 0; top: 130px;} */
.main-contact-us{ z-index: 20; width: 35px; display: flex; justify-content: center;}
.main-contact-us a{ padding: 6px 8px 16px; margin-top: -5px; gap: 5px; transition: var(--transition-2s-ease); font-size: 13px; text-decoration: none; color: rgba(var(--black-o), 1); display: flex; flex-direction: column; align-items: center; justify-content: center; background-color: #fff; border-radius: 0 0 10px 10px; box-shadow: 0 10px 15px 0 rgba(var(--black-o), .05);}
/* .main-contact-us a:hover{ color: var(--white-txt);} */
.main-contact-us a .icon{}
.main-contact-us a .icon img{ width: 16px; filter: brightness(0);}
.main-contact-us a .txt { writing-mode: vertical-lr; text-orientation: mixed; transform: rotate(180deg); display: flex; align-items: center; justify-content: center; letter-spacing: .5px;}



/* body:not(.v2).light .left-nav .show{ background-color: rgba(var(--white-o), .75); border-color: rgba(var(--black-o), .1); backdrop-filter: blur(5px);}
body:not(.v2).light .left-nav .show .top .icon,
body:not(.v2).light .left-nav .show .top .txt,
body:not(.v2).light .left-nav.open .show .top .icon,
body:not(.v2).light .left-nav.open .show .top .txt,
body:not(.v2).light .left-nav .menu .links > div span a,
body:not(.v2).light .left-nav .show .bottom .social > a,
body:not(.v2).light .left-nav.open .show .bottom .social > a{ color: var(--black-txt);}
body:not(.v2).light .left-nav .menu{ background-color: rgba(var(--white-o), .85); backdrop-filter: blur(5px);}
body:not(.v2).light .left-nav .show .top .icon .bar > span{ border-color: var(--black-txt);} */
body:not(.v2).light .left-nav .show{ background-color: rgba(var(--white-o), .75); border-color: rgba(var(--black-o), .1); backdrop-filter: blur(5px);}
body:not(.v2).light .left-nav .show .top .icon,
body:not(.v2).light .left-nav .show .top .txt,
body:not(.v2).light .left-nav.open .show .top .icon,
body:not(.v2).light .left-nav.open .show .top .txt,
body:not(.v2).light .left-nav .menu .links > div span a,
body:not(.v2).light .left-nav .show .bottom .social > a,
body:not(.v2).light .left-nav.open .show .bottom .social > a{ color: var(--black-txt);}
body:not(.v2).light .left-nav .menu{ background-color: rgba(var(--white-o), .95); backdrop-filter: blur(5px);}
body:not(.v2).light .left-nav .show .top .icon .bar > span{ border-color: var(--black-txt);}


body.v2 .left-nav{ height: 80px; width: 100%; background-color: rgba(var(--black-o), .7);}
body.v2 .left-nav .show{ height: 80px; width: 100%; flex-direction: row; width: 100%; max-width: 1320px; padding: 0 10px; margin-inline: auto; background-color: transparent; border: none;}
body.v2 .left-nav .show .top{ display: none;}
body.v2 .left-nav .show .bottom .social{ flex-direction: row;}
body.v2 .left-nav .menu{ height: fit-content; width: fit-content; padding-left: 0; backdrop-filter: unset; position: static; background-color: transparent;}
body.v2 .left-nav .menu .links{ flex-direction: row; gap: 10px 25px; max-width: unset; flex-wrap: wrap;}
body.v2 .left-nav .menu .links > div{ overflow: visible; width: fit-content;}
body.v2 .left-nav .menu .links > div span a{ font-size: 16px; white-space: nowrap;}

body.v2.light .left-nav{ background-color: #fff; box-shadow: 0 0 15px 0 rgba(var(--black-o), .1);}
body.v2.light .left-nav .show .top .icon .bar > span{ border-color: #000;}
body.v2.light .left-nav .show .top .icon,
body.v2.light .left-nav .show .top .txt,
body.v2.light .left-nav .menu .links > div span a,
body.v2.light .left-nav .show .bottom .social > a{ color: #000;}






@media screen and (max-width: 960px) {
    body:has(.left-nav):not(.v2){ padding: 0;}
    body:has(.left-nav){ padding-top: 60px !important;}

    .left-nav .show .middle .img-area{ width: 40px; height: 40px; transform: translateX(13px);}
    
    .left-nav{ width: 100%; z-index: 30; height: 60px !important;}
    .left-nav .show{ height: 100% !important; width: 100%; flex-direction: row; padding: 0 10px; z-index: 30;}
    .left-nav .show .top{ flex-direction: row; padding-top: 5px; display: flex !important;}
    .left-nav .show .bottom .social{ flex-direction: row;}
    .left-nav .show .top .icon, .left-nav .show .top .txt{ transform: unset; text-orientation: unset; writing-mode: unset;}
    .left-nav .show .top .txt > span.open{ top: 50%; transform: translateY(calc(-50% - 3.5px)); left: 10px;}
    .left-nav .show .top .txt > span.close{ top: 50%; transform: translateY(calc(-50% - 0px)); left: 10px;}
    .left-nav .menu{ padding: 70px 20px 30px !important; width: 100% !important; height: auto !important; left: 0 !important; transform: translateY(-100%) !important; top: 0 !important; position: fixed !important; background-color: rgba(var(--black-o), .85) !important;}
    body.light .left-nav .menu{ background-color: rgba(var(--white-o), .95) !important;}
    .left-nav .menu .links{ max-width: unset !important; flex-direction: column !important; gap: 15px !important;}
    .left-nav.open .menu{ transform: translateY(0) !important; box-shadow: 0 0 50px 0 rgba(var(--black-o), .75);}
    .left-nav .show .middle{ transform: translateX(40px);}
    .left-nav .show .bottom .social > a{ font-size: 14px;}
    .left-nav .menu .links > div{ width: 100% !important;}
    .left-nav .menu .links > div span a{ font-size: 18px !important; padding: 1px 0;}
    .left-nav .menu .links > div span.more::before{ font-size: 15px; top: 6px;}
    .left-nav .menu .links > div > div a{ font-size: 14px;}
    .left-nav .menu .links a{ width: 100%;}
    .left-nav .menu .links a:hover{ padding-left: 0; color: var(--black-txt);}

    .left-nav.open .show .middle .img-area > img.dark{ opacity: 0;}
    .left-nav.open .show .middle .img-area > img.light{ opacity: 1;}
    .left-nav.open .show .middle .img-area > img{ opacity: 1;}

    .right-nav{ top: 60px !important; right: 15px;}
    .main-contact-us a{ padding: 6px 8px 8px;}
    .main-contact-us a .txt{ display: none;}

}