html, body {font-family: 'Montserrat', sans-serif;overflow-x: hidden;scroll-behavior: smooth;/* padding-bottom: 45px; */}
a {text-transform: none !important;outline: none !important;text-decoration: none !important}
h1.head {font-size: 74px;margin: 80px 0;color: transparent;font-weight: 800;-webkit-text-stroke: 1px #fff;}
h1.head.m-none {margin: 0;}
h1.head span {color: #fff;display: block;font-size: 50px;}
p.text {font-size: 18px;color: #000;font-weight: 300;}
.mobile-visible{display: none;}
p {margin: 0;}
.container-fluid {width: 100%;max-width: 2500px}
/* width */
::-webkit-scrollbar {width: 5px;}
/* Track */
::-webkit-scrollbar-track {background: rgba(0, 1, 6, 0.9);}
/* Handle */
::-webkit-scrollbar-thumb {background: linear-gradient(90deg, #000 0%, #ddd 100%);border-radius: 100px;}

.s-margin {padding: 0 140px;}
.flx {display: flex;align-items: center;justify-content: center;}



header {display: flex;align-items: center;justify-content:space-between;height: 100px;background: rgba(196, 196, 196, 0.08);padding: 0 140px;position: absolute;top: 0;left: 0;width: 100%;z-index: 2;transition: all .4s;}
header.active {position: fixed;background: rgb(0 0 0 / 89%);z-index: 999;}
header ul {padding: 0;margin: 0;list-style: none;}
header ul li {margin-right: 40px;float: left;}
header ul li:last-child {margin-right: 0 !important;}
header ul li a {font-size: 20px;color: #fff !important;font-weight: 500;}
header img {max-width: 300px;}


#home {background: #000 url(../images/home-back.jpg) center center no-repeat;background-size: cover;height: 130vh;display: flex;align-items: flex-end;justify-content: flex-start;padding-bottom: 10%;}
#home p.text {color: #fff;margin: 30px 0;line-height: 180%;margin-top: 50px;text-shadow: 3px 3px 33px #000;background: #0000009c;}


#home .uls {display: inline-flex;align-items: center;justify-content: flex-start;margin-top: 30px;}
#home .uls ul{display: flex;align-items: center;justify-content: center;position: relative;margin-right: 30px;}
#home .uls ul:first-child{padding-left: 0;}
#home .uls ul::after {content: '';width: 1px;height: 150%;right: -40px;background: #fff;position: absolute;}
#home .uls ul:last-child::after {display: none;}
#home .uls ul li {margin-right: 40px;list-style: none;}
#home .uls ul li:last-child {margin-right: 0;}
#home .uls ul li a {transition: all .4s;display: inline-block;}
#home .uls ul li a:hover {transform: scale(1.3);}
#home .home-diskografi {margin-top: 50px;}
#home .home-diskografi .item {position: relative;border-radius: 30px;border: 1px solid rgba(255,255,255,.2);overflow:hidden;cursor: pointer;}
#home .home-diskografi .item iframe {width: 100%;height: 250px !important;}
#home .home-diskografi .item .overlay {position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: rgba(0,0,0,.8) url(../images/icons/play-button.svg) center center no-repeat; background-size: 40%;transition: all .4s;}
#home .home-diskografi .item.active .overlay {opacity: 0;visibility: hidden;}


#grup-uyeleri {background: rgba(0, 1, 6, 0.87);padding-bottom: 140px;}
#grup-uyeleri .item {font-size: 34px;color: #fff;font-weight: 300;text-align: center;}
#grup-uyeleri .item img {margin-bottom: 36px;border-radius: 30px;width: 100%;filter: grayscale(1);}

#references {background: rgb(33 34 38 / 94%);padding-bottom: 80px;}

#discography {background: #000106;padding-bottom: 150px;}
#discography .item {margin-bottom: 30px;border-radius: 30px;overflow:hidden;}
#discography .item iframe  {width: 100%;height: 250px !important;}

#galeri {background: #000106;padding-bottom: 150px;}
#galeri .item {position: relative;margin-bottom: 30px;border-radius: 30px;overflow: hidden;}
#galeri .item img{width: 100%;}
#galeri .item .overlay {border-radius:30px;position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: rgba(0,0,0,.8) url(../images/icons/zoom.svg) center center no-repeat; background-size: 50px;transition: all .4s;transform: scale(0);opacity: 0;z-index: 1;}
#galeri .item:hover .overlay {transform: scale(1);opacity: 1;}
#galeri .item a {position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index: 2;}

















#contact {/* margin-top: 100px; */background: rgb(33 33 38);}
#contact .content {margin: 0 90px;/* background: rgba(196, 196, 196, 0.2); */padding: 120px 80px;display: flex;align-items: center;filter: brightness(0) invert(1);}
#contact .content ul {padding: 0;margin: 0;list-style: none;}
#contact .content ul li {display: flex;font-size: 24px;color: #000;font-weight: 300;margin-bottom: 30px;align-items: center;}
#contact .content ul li:last-child {margin-bottom: 0 !important;}
#contact .content ul li img{margin-right: 10px;}
#contact .content p.copy {font-size: 24px;color: #000;font-weight: 300;margin-top: 0 !important;}
#contact .content p.copy strong{display: block;margin-top: 10px;font-weight: 600;}
@media screen and (max-width: 768px)
{
    .mobile-visible {display: block;}
    .mobile-hidden {display: none;}
    header {justify-content: flex-start;padding: 0 30px;}
    .outer-menu{display: block !important; top: 40px !important;}
    .outer-menu .menu > div > div > ul > li {line-height: 40px !important;}
    .outer-menu .menu > div > div > ul > li > a {font-size: 24px !important;}
    .s-margin {padding: 0 15px;}
    #anasayfa  {align-items: flex-start;justify-content: flex-start;padding-top: 150px;}
    #anasayfa .allura {font-size: 54px;line-height: 33px;text-align: center;}
    #anasayfa .allura br {display: none;}
    #anasayfa .allura span {padding-left: 20px;}
    #anasayfa .slide-norm-text {font-size: 16px;margin-top: 10px;padding-left: 80px;}
    #anasayfa .line {padding: 40px 0;}
    #anasayfa .uls ul li {margin-right: 15px;}
    #anasayfa .uls ul li img{height: 16px}
    #anasayfa .medium-text {font-size: 14px;}
    #anasayfa .uls {flex-direction: column;align-items: flex-start;margin-top: 10px;}
    #anasayfa .uls ul::after {height: 100%;right: -30px;display: none;}
    #anasayfa .uls ul {padding-left: 0;margin-top: 5px;}
    #anasayfa {height: 90vh;}
    #anasayfa .bulent-serttas {right: -60px;height: 60vh;}
    h1.head {font-size: 24px;margin: 40px 0;}
    #hakkimda img {margin-bottom: 30px;}
    #hakkimda p.text {font-size: 16px;line-height: 200%;}
    #videolar .item iframe {height: 190px;}
    #contact .content {margin: 0;padding: 40px 0;flex-direction: column;}
    #contact .content ul li {font-size: 14px;}
    #contact .content p.copy {font-size: 14px;margin-bottom: 60px;padding-top: 30px;margin-top: 15px;}
    #contact .content ul li img {height: 30px;margin-right: 20px;}
    #contact .content ul li {margin-bottom: 15px;}
    #contact .form {padding: 50px 20px;}
    #contact .form p {font-size: 14px;}
    #contact form input {width: 100%;margin-right: 0 !important;padding: 5px 0;font-size: 14px;}
    #contact form input::placeholder {font-size: 14px;}
    #contact form textarea::placeholder {font-size: 14px;}
    #contact .form p strong {font-size: 18px;}
    #contact form button {margin-top: 30px;font-size: 14px;padding: 6px 25px;}
    html, body {/* padding-bottom: 15px; */}
    #home p.text {line-height: 140%;margin: 10px 0;max-width: 100%;font-size: 10px;}
    #home .uls ul li {margin-right: 15px;}
    #home .uls ul li img {height: 20px;}
    h1.head.m-none {margin-top: 50px;}
    #home .home-diskografi .item iframe {height: 150px;}
    #home .home-diskografi .item .overlay {background-size: 50px;}
    img.logo {max-width: 200px;}
    #grup-uyeleri .item img {margin-bottom: 10px;}
    #grup-uyeleri .item {font-size: 24px;margin-bottom: 30px;}
    h1.head span {font-size: 18px;}
    #galeri {padding-bottom: 50px;}
    #discography {padding-bottom: 50px;}
    #grup-uyeleri {padding-bottom: 50px;}
    header {padding: 0 25px;}
    #home .home-diskografi {margin-top: 20px;}
    #home {padding-bottom: 20%;}
    h1.head {-webkit-text-stroke: 0.4px #fff;letter-spacing: 2px;color: #fff;}
    #contact {/* margin-top: 30px; */}
    #contact .content p.copy {margin-bottom: 0;}



}









.outer-menu {position: absolute; right: 76px; z-index: 1; display: none; margin-top: -11px; transition:margin .3s;}
.outer-menu .checkbox-toggle {position: absolute; top: 0; left: 0; z-index: 2; cursor: pointer; width: 60px; height: 60px; opacity: 0;}
.outer-menu .checkbox-toggle:checked + .hamburger > div {-webkit-transform: rotate(135deg); transform: rotate(135deg);}
.outer-menu .checkbox-toggle:checked + .hamburger > div:before, .outer-menu .checkbox-toggle:checked + .hamburger > div:after {top: 0; -webkit-transform: rotate(90deg); transform: rotate(90deg);}
.outer-menu .checkbox-toggle:checked + .hamburger > div:after {opacity: 0;}
.outer-menu .checkbox-toggle:checked ~ .menu {pointer-events: auto; visibility: visible;}
.outer-menu .checkbox-toggle:checked ~ .menu > div {-webkit-transform: scale(1); transform: scale(1); -webkit-transition-duration: .75s; transition-duration: .75s;}
.outer-menu .checkbox-toggle:checked ~ .menu > div > div {opacity: 1; -webkit-transition: opacity 0.4s ease 0.4s; transition: opacity 0.4s ease 0.4s;}
.outer-menu .checkbox-toggle:hover + .hamburger {}
.outer-menu .checkbox-toggle:checked:hover + .hamburger > div {-webkit-transform: rotate(225deg); transform: rotate(225deg);}
.outer-menu .hamburger {position: absolute; top: 0; left: 0; z-index: 1; width: 60px; height: 40px; padding: .5em 1em; cursor: pointer; -webkit-transition: box-shadow 0.4s ease; transition: box-shadow 0.4s ease; -webkit-backface-visibility: hidden; backface-visibility: hidden; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;}
.outer-menu .hamburger > div {position: relative; -webkit-box-flex: 0; -ms-flex: none; flex: none; width: 100%; height: 2px; background: #FEFEFE; -webkit-transition: all 0.4s ease; transition: all 0.4s ease; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;}
.outer-menu .hamburger > div:before, .outer-menu .hamburger > div:after {content: ''; position: absolute; z-index: 1; top: -10px; left: 0; width: 100%; height: 2px; background: inherit; -webkit-transition: all 0.4s ease; transition: all 0.4s ease;}
.outer-menu .hamburger > div:after {top: 10px;}
.outer-menu .menu {position: fixed; top: 0; left: 0; width: 100%; height: 100%; pointer-events: none; visibility: hidden; overflow: hidden; -webkit-backface-visibility: hidden; backface-visibility: hidden; outline: 1px solid transparent; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;}
.outer-menu .menu > div {width: 100%; height: 100%; color: #FEFEFE; background: rgba(0, 0, 0, 0.9); -webkit-transition: all 0.4s ease; transition: all 0.4s ease; -webkit-box-flex: 0; -ms-flex: none; flex: none; -webkit-transform: scale(0); transform: scale(0); -webkit-backface-visibility: hidden; backface-visibility: hidden; overflow: hidden; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;}
.outer-menu .menu > div > div {text-align: center; max-width: 90vw; max-height: 100vh; opacity: 0; -webkit-transition: opacity 0.4s ease; transition: opacity 0.4s ease; overflow-y: auto; -webkit-box-flex: 0; -ms-flex: none; flex: none; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;}
.outer-menu .menu > div > div > ul {list-style: none; padding: 0 1em; margin: 0; display: block; max-height: 100vh; overflow: hidden;}
.outer-menu .menu > div > div > ul > li {padding: 0; margin: 1em; font-size: 24px; display: block; text-align: center; width: 100%; padding: 0; margin: 0; line-height: 50px;}
.outer-menu .menu > div > div > ul > li > a {/*--0%-100% border bottom actived----position: relative;*/ display: inline; cursor: pointer; color:#fff; -webkit-transition: color 0.4s ease; transition: color 0.4s ease;}
.outer-menu .menu > div > div > ul > li > a:hover {color: #e5e5e5; text-decoration: none;}
.outer-menu .menu > div > div > ul > li > a:hover:after {width: 100%;}
.outer-menu .menu > div > div > ul > li > a:after {content: ''; position: absolute; z-index: 1; bottom: -0.15em; left: 0; width: 0; height: 2px; background: #e5e5e5; -webkit-transition: width 0.4s ease; transition: width 0.4s ease;}