@font-face {
    font-family: rought;
    src: url(/front/fonts/rought.otf);
}
.rought {font-family: rought !important;font-size: 96px;color: #fff;}
html, body {font-family: 'Sofia Pro', sans-serif;background: #000;overflow-x: hidden;}
body.white {background: #E9E9E9}
body.blank {padding-top: 150px;}
.table-content{display: table; width: 100%; height: 100%;}
.table-cell-content{display: table-cell; vertical-align: middle; text-align: center;}
.disp-block {display: block !important;}
.disp-ib {display: inline-block !important;}
* {outline: 0 !important; text-decoration: none !important;}
.justify-content-center {display: flex;justify-content: center;}
.align-items-center {display: flex;align-items: center;}
.align-items-flex-end {display: flex;align-items: flex-end;}
.s-margin {margin: auto auto !important;max-width: 1800px;flex: 1;padding:0 50px;}
.fl-r {float: right;}
.mt30 {margin-top:30px;}
.mt50 {margin-top:50px;}
.mt70 {margin-top:70px;}
.my-10 {margin: 10px 0;}
.my-20 {margin: 20px 0;}
.my-30 {margin: 30px 0;}
.my-40 {margin: 40px 0;}
.my-50 {margin: 50px 0;}
.p0 {padding: 0;}
.m0 {margin: 0;}
.mt0 {margin-top: 0;}
.mb0 {margin-bottom: 0;}
.h-fix {height: 100%;}
video {width: 100%;min-height: 250px;object-fit: cover}
.img-box {position: relative;overflow: hidden;  width: 100%; background-position: center center; background-repeat: no-repeat; background-size: cover !important;}
.img-box.logo{margin-top: 1.5rem !important;}
.img-box::after {content: ''; display: block;padding-bottom: 100%;}
.img-box.flw::after {padding-bottom: 50%;}
.mobile-visible {display: none !important;}
p.smalltext {font-size: 18px;color: #000;font-weight: 250;}
p.smalltext.white {color: #fff;}
p.standart-text {font-size: 24px;color: #000;font-weight: 500;letter-spacing: 3px;}
p.standart-text.white {color: #fff;}
p.medium-text {font-size: 36px;font-weight: 900;color: #000;letter-spacing: 3px}
p.medium-text.white {color: #fff;}
.fw250 {font-weight:250 !important;}
.fw300 {font-weight:300 !important;}
.fw400 {font-weight:400 !important;}
.fw500 {font-weight:500 !important;}
.fw600 {font-weight:600 !important;}
.fw700 {font-weight:700 !important;}
.fw800 {font-weight:800 !important;}
.fw900 {font-weight:900 !important;}
.text-italic {font-style: italic;}
p.big-text {font-size: 52px;font-weight: 300;color: #000;}
p.big-text.white {color: #fff;}
a.black-link {color: #000 !important;font-weight: 400;}
a.button,button.button {font-size: 16px;color: #fff !important;font-weight: 400;padding: 16px 30px;border:1px solid #FE0000;border-radius: 15px;margin-top: 10px;transition: all .4s;margin-bottom: -30px;}
a.button:hover ,button.button:hover {background: #fe0000;}
header {position: absolute;top: 0;left: 0;z-index: 2;padding-top: 30px;width: 100%;}
header ul{display: inline-block;list-style: none;padding:0;margin:0;margin-right: 50px;}
header ul li {float: left;margin: 0 5px;}
header ul li a{font-size: 18px;color: #fff !important;font-weight: 300;padding: 20px 20px;border-radius: 20px; transition: all .4s;display: inline-block;}
header ul li a:hover{background: #ff0000;}
header ul li a.this-page{background: #ff0000;}
ul.platforms {position: absolute;right: 20px;margin-right: 0;margin-top: 18px;}
ul.platforms li{display: flex;align-items: center;justify-content: center;float: left;margin: 0 5px;}
ul.platforms li a{padding: 5px;border-radius: 100px;}
ul.platforms li a:hover{background: #ff0000;}
ul.platforms li a img{height: 17px;width: 17px}


#fyc .fyc-content {background: #000;}
#fyc .fyc-content *{color: #fff !important;}


#home .home-slider .swiper-slide {height: 100vh;max-height: calc(100vh - 80px);display: flex;align-items: center;justify-content: flex-end;flex-direction: column;padding-bottom:150px;}
#home .home-slider p.slide-big-text {font-size: 60px;color: #ff0000;font-weight: 500;letter-spacing: 7px;margin-top: 150px;}
#home .home-slider p.slide-small-text {font-size: 30px;color: #fff;font-weight: 300;}
.swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction {bottom: 30px;}
.swiper-pagination-bullet {background: none;border: 1px solid #fff;width: 15px;height: 15px;}
.swiper-pagination-bullet-active {background: none;border: 2px solid #fff;}
#home .music-player {background: #000;height: 80px;display: flex;align-items: center;}
#home .music-player .buttons {display: flex;align-items: center;justify-content: center;padding: 0 50px;}
#home .music-player .buttons .button{display: flex;flex: 1;align-items: center;justify-content: center;cursor: pointer;}
.music-play-pause img.play{display: inherit}
.music-play-pause img.pause{display: none}
.music-play-pause.paused img.pause{display: inherit}
.music-play-pause.paused img.play{display: none}
#home .music-player p.music_name {display: flex;align-items: flex-start;justify-content:center;flex-direction: column;margin-left: 10px;font-size: 12px;color: #fff;font-weight: 500;text-align: left;margin-bottom: 0;}
#home .music-player p.music_name span{font-weight: 300;}
.albums .items {max-width: 100%;}
.albums .items .item {position: relative;}
.albums .items .item .overlay {position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: rgba(0,0,0,.75);display: flex;align-items: flex-start;flex-direction: column;justify-content: space-between;border: 1px solid #ff0000;opacity: 0;transition: all .4s;}
.albums .items .item:hover .overlay {opacity: 1;}
.albums .items .item .overlay p.album_name {margin: 0;font-size: 50px;color: #fff;font-weight: 900;
    padding: 10px 18px;}
.albums .items .item .overlay a{padding: 35px;color: #fff !important;font-weight:500;font-size: 24px; }
.albums .items {display: flex;align-items: center;flex-wrap: nowrap;}
.albums .items.bottom {justify-content: flex-end;}
.albums .items .item {margin: 0 30px;}
.albums .items .item > img {height: 35vh;}

#last-clip p.standart-text {color: #fff;}
#last-clip p.smalltext {color: rgba(255,255,255,0.5);}
.player {position: relative;background:#000;}
.player-controls {width: 50%;display: flex;align-items: center;position: absolute;bottom: 50px;left: 50%;transform: translateX(-50%);}
.player-controls input[type=range] {background-color: rgba(255,255,255,.5) !important;margin: 0 20px;}
.player-controls a#btnPlayPause img.play{display: inherit}
.player-controls a#btnPlayPause img.pause{display: none}
.player-controls a#btnPlayPause.pause img.pause{display: inherit}
.player-controls a#btnPlayPause.pause img.play{display: none}

.highlighted-films .item img{max-height: 300px;object-fit: contain;}

#contact ul.platforms {position: relative;display:inline-block;}
#contact a.mail {color: #fff !important;font-size: 16px;display: flex;justify-content: center;}
#contact a.mail img {margin-right: 15px;}

footer ul.platforms {margin-top: 0;}
#about_page .smalltext {line-height:35px;}



#fyc .fyc-home {height: 560px;background: #000 url(/front/images/fyc-home-back.jpg) center center no-repeat;background-size: cover;display: flex;align-items: center;justify-content: center;}
#fyc .fyc-home p.red-big-text {font-size: 60px;color: #ff0000;font-weight: 500;letter-spacing: 7px;margin-top: 150px;}
#fyc .fyc-home p.small-text {font-size: 30px;color: #fff;font-weight: 300;}
.album_link {
    font-size: 22px;
    text-align: center;
    line-height: 44px;
    text-decoration: none;
    color: white;
    background-color: #cc4331;
    border-radius: 4px;
    margin-top: -22px;
    margin-left: -62px;
    text-shadow: 0 -1px -1px #af3a2a;
    -moz-box-shadow: 0 4px 0 #af3a2a, 0 5px 5px 1px rgba(0, 0, 0, 0.4);
    -webkit-box-shadow: 0 4px 0 #af3a2a, 0 5px 5px 1px rgba(0, 0, 0, 0.4);
    box-shadow: 0 4px 0 #af3a2a, 0 5px 5px 1px rgba(0, 0, 0, 0.4);
    -moz-transition: all 0.15s ease-in-out;
    -o-transition: all 0.15s ease-in-out;
    -webkit-transition: all 0.15s ease-in-out;
    transition: all 0.15s ease-in-out;
    font-size:27px;transition: all .4s;color:#fff !important;padding:8px 60px;background:#ff0000;border-radius:300px;
    margin-top:30px;

    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.album_link svg {margin-right:15px;height:auto !important;width:30px;fill:#fff;transition:all .4s;}
.album_link:hover {
    background-color : #000;
    text-shadow: 0 -1px -1px #c4402f;
    -moz-box-shadow: 0 4px 0 #000, 0 5px 5px 1px rgba(0, 0, 0, 0.4);
    -webkit-box-shadow: 0 4px 0 #000, 0 5px 5px 1px rgba(0, 0, 0, 0.4);
    box-shadow: 0 4px 0 #000, 0 5px 5px 1px rgba(0, 0, 0, 0.4);
}
.album_link:active {
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
}

#fyc .fyc-content .album_link p{margin:0;color:#fff;}
#fyc .career p.date {font-size: 76px;color: #a1a1a1;font-weight: 200;margin-right: 50px;margin-bottom: 0;}
#fyc .career .career-items .career-item {margin: 50px 0;}
#fyc .career .career-items .career-item:nth-child(even) p.date{order: 2;margin-right: 0;margin-left: 50px;}
#fyc .discography .item {margin-bottom: 30px;}
button.owl-prev {position: absolute;left: -40px;top: 50%;transform: translateY(-65%);font-size: 34px !important;}
button.owl-next {position: absolute;right: -40px;top: 50%;transform: translateY(-65%);font-size: 34px !important;}
#fyc .awards .item {border-top: 1px solid #eaeaea;padding: 10px 0;}
#fyc .awards .item:first-child {border:0;}
#fyc .awards .item p {margin: 0;}
.gallery-items {display: flex;flex-wrap: wrap;}
.gallery-item {float: left;max-width: calc(20% - 30px);margin: 15px;position: relative;overflow: hidden;flex: 0 0 33.333333%;display: flex;flex-direction: row;align-items: center;}
.gallery-item a img{object-fit: cover;
    width: 100%;
    object-position: top;}
.gallery-item .overlay {position: absolute;top: 0;left: 0;width: 100%;height: 100%;display: flex;align-items: center;justify-content: center;z-index: 2;background: rgba(0,0,0,.5);transition: all .4s;opacity: 0;z-index: 1;}
.gallery-item .overlay img{width: 30px;filter:invert(1);}
.gallery-item:hover .overlay {opacity: 1;}
#fyc .social-media img {width: 100%;max-height:250px;object-fit: cover;object-position: top center;}
#fyc .social-media p.big-text {font-size: 42px;}

#fyc.home p{color: #fff !important;}
#fyc.home tr td{color: #fff !important;border-color: rgba(255,255,255,.5)}
#fyc .awards .item {border-color: rgba(255,255,255,.13) }
.owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev {color: #fff !important;}
.owl-carousel .owl-nav button.owl-next span, .owl-carousel .owl-nav button.owl-prev span {color: #fff !important;}


@media screen and (min-width: 1800px){
    .albums .items .item .overlay p.album_name {font-size: 50px;}
    .s-margin {padding: auto 100px;}
    video {min-height: 350px}
    iframe {min-height: 350px}
    .highlighted-films .item img {max-height: 430px;}
}

@media screen and (max-width: 800px)
{
    .my-10 {margin: 10px 0;}
    .my-20 {margin: 10px 0;}
    .my-30 {margin: 10px 0;}
    .my-40 {margin: 10px 0;}
    .my-50 {margin: 20px 0;}
    .mt50 {margin-top:30px;}
    a.black-link {margin-bottom: 20px;display: inline-block;font-size: 12px;}
    .s-margin {padding: 0 10px;}
    .mobile-hidden {display: none !important;}
    .mobile-visible {display: block !important;}
    .outer-menu{display: block !important; top: 40px !important;}
    #home .home-slider .swiper-slide p.slide-big-text {font-size: 30px;}
    #home .home-slider .swiper-slide p.slide-small-text {font-size: 16px;padding: 0 30px;font-weight: 300;}
    a.button, button.button {padding: 10px 30px;}
    #home .music-player {height: auto;padding: 15px 0;}
    #home .home-slider .swiper-slide {padding-bottom: 100px;}
    .music-player .row.align-items-center {display: block;}
    #home .home-slider .swiper-slide {max-height: calc(100vh - 170px)}
    #home .music-player .buttons .button{margin: 0px 10px;}
    #home .music-player input[type=range] {margin: 15px 0;}
    .rought {font-size: 56px;margin-top: 20px;margin-bottom: 30px;}
    .albums .items {display: block;transform: none !important;margin: 0 !important;}
    .albums .items .item {margin-bottom: 30px;}
    .albums .items .item > img{width: 100%;height: auto !important;}
    .albums .items .item .overlay p.album_name {font-size: 40px;}
    .albums .items .item .overlay a {padding: 20px;}
    .gallery-items .gallery-item {flex: 0 0 50%;max-width:100%;margin: 0;padding: 15px;}
    footer p.smalltext.white{margin:0;text-align: center;margin-top: 10px;margin-bottom: 30px;padding: 0 10px;}
    footer .col-md-6 {text-align: center;}
    footer ul.platforms {position: relative;display: inline-block;padding: 0;right: 0;margin-right: 0 !important;margin-top: 18px !important;}
    header ul li a {padding: 10px 20px;}
    body.blank {padding-top: 80px;}
    p.smalltext {font-size: 16px;line-height: 25px;}
    #fyc .fyc-home p.red-big-text {font-size: 30px;}
    #fyc .fyc-home p.small-text {font-size: 20px;}
    #fyc .fyc-home {height: 70vh}
    p.standart-text {font-size: 16px;margin-top: 20px;margin-bottom: 20px;}
    .justify-content-center {display: block;}
    .justify-content-center img{margin: 20px 0;}
    #fyc .career .career-items .career-item {margin:15px 0;align-items: normal;flex-direction: column;}
    #fyc .career .career-items .career-item p.date {margin: 0 !important;order: 1 !important;}
    .align-items-center {display: block;}
    p.medium-text {font-size: 22px;}
    .medium-text a.black-link {margin-bottom: 0;}
    .discography p.standart-text {margin-top: 0;}
    button.owl-prev {left: -20px}
    button.owl-next {right: -17px}
    .col-md-3 .player {margin-bottom: 30px;}
    #fyc iframe {margin-bottom: 30px;}
    #fyc .awards .item {border-color: #d2d2d2;}
    #fyc .gallery-items .gallery-item {padding: 0 15px;}
    #fyc p.big-text {font-size: 30px;}
    body.white footer p{color: #000 !important;}
    body.white footer ul.platforms li a img{filter: brightness(0);}
    .music_name_cont {display: flex;}
    #gallery img{margin: 0 !important;}
    #gallery .col-md-12 {padding: 0;}
    #gallery .container-fluid {padding: 0;}
    #fyc #gallery .gallery-item {margin: 5px;padding: 0;flex: 1 0 47%}
    #fyc #gallery .gallery-items {margin: 0 10px;}
    .outer-menu .menu ul.platforms {right: auto;bottom: 40px;flex-direction: column;}
    #fyc .fyc-content .album_link {
        font-size: 9px;
        display: flex;
        margin: 0;
        padding: 0px 10px;
        margin-top:30px;}
    #fyc .fyc-content .album_link svg {display:none;}
    .listen-spotify img{max-width:40%; margin-bottom:20px;}
    #home .albums .item {max-width: 44%;margin: 0;display: inline-block;margin-right: 15px;margin-bottom: 15px;}
    #home .albums .item:nth-child(odd) {margin-left: 15px;}
    #home .albums .item:nth-child(even) {margin-right: 0;}
    #home .albums .items .item .overlay p.album_name {font-size: 18px;}
    #home .albums .items .item .overlay a {padding: 10px;font-size: 14px;}
    #home .albums .items .item .overlay a img {height: 10px;}


}






input[type=range] {
    margin: auto;
    pointer-events: none;
    outline: none;
    padding: 0;
    width: 100%;
    height: 2px;
    background-color: #222;
    background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #087af5), color-stop(100%, #087af5));
    background-image: -webkit-linear-gradient(#fff, #fff);
    background-image: -moz-linear-gradient(#fff, #fff);
    background-image: -o-linear-gradient(#fff, #fff);
    background-image: linear-gradient(#fff, #fff);
    background-size: 50% 100%;
    background-repeat: no-repeat;
    border-radius: 10px;
    cursor: pointer;
    -webkit-appearance: none;
    /* track */
    /* thumb */ }
input[type=range]::-webkit-slider-runnable-track {
    box-shadow: none;
    border: none;
    background: transparent;
    -webkit-appearance: none; }
input[type=range]::-moz-range-track {
    box-shadow: none;
    border: none;
    background: transparent; }
input[type=range]::-moz-focus-outer {
    border: 0; }
input[type=range]::-webkit-slider-thumb {
    width: 10px;
    height: 10px;
    border: 0;
    background: white;
    border-radius: 100%;
    box-shadow: 0 1px 2px 0px #000;
    -webkit-appearance: none; }
input[type=range]::-moz-range-thumb {
    width: 10px;
    height: 10px;
    border: 0;
    background: white;
    border-radius: 100%;
    box-shadow: 0 1px 2px 0px #000; }



.outer-menu {position: fixed;right: 80px; 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: 60px; 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;background: #000;}
.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;}



