@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700|PT+Sans:400,700|Roboto:100,300,400,500,700|Montserrat:200,300,400,500,600|Dancing+Script:400,600|Poppins:300,400|Playfair+Display:300,400&display=swap');


@import url('/css/animate.min.css');
@import url('/css/all.css');


*, :before {margin:0; padding:0; box-sizing:border-box; outline:none; border:0; vertical-align0:middle;}

body {font:400 15px/1 'Open Sans', 'Segoe UI', Arial, sans-serif; color:#000000; background-color:#fff;}

.display_none {display:none}
.flex {display:flex;}

.center {max-width:1350px; margin:0 auto;}

html, body {height:100%; width:100%;}
a {text-decoration:none; color:#0066CC;}
ul {list-style:none;}
.red {border:1px solid red;}

.bt {cursor:pointer; -webkit-touch-callout:none; -webkit-user-select: none; -khtml-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none; -webkit-tap-highlight-color:transparent;}


header {height:120px; width:100%; background-color:#fff; border-bottom:1px solid #E1E1E1; position: fixed; z-index:10; top:0; left:0; transition: height .1s ease}
header > section {display:flex;  height:100%;  justify-content: space-between; align-items: center;}
header > section nav {flex:1; }
header > section nav ul {display:flex; justify-content: space-around;}
header > section nav ul li {font:300 1rem 'Poppins'; cursor:pointer;}
header.fix {height:50px; border:0; box-shadow: 0 3px 20px -10px rgba(0,0,0,0.75);}

.header_fixed {height:120px;}


.slide_big {display:flex; justify-content:space-between; align-items:center; margin-top:4vh}
.slide_big > article {padding-right:1vw}
.slide_big h2 {font:600 4rem/1 "Dancing Script";}
.slide_big p {font:300 1rem/2 "Poppins"; color:#0A0A0A; margin-top:2vh}
.slide_big > div img {box-shadow: 29px 29px 141px -34px rgba(0,0,0,0.75);}

.logo-nft-x {width:222px; height:45px;}
.logo-nft-x > div {width:100%; height:100%; background:url('/images/sait/Art_logo.svg') 0 0 no-repeat; background-size:auto; animation0: rubberBand 1.5s; /* animation: flip 1s;  */}

@media (min-width: 100px) { /* Для ПК  */
     /*  Firefox,  цвет ползунка, цвет полосы скроллбара,  толщина*/
    .niceScroll {scrollbar-color:transparent transparent; scrollbar-width:thin; transition: all .2s ease; overflow:auto;}
    .niceScroll:hover, .select_list {scrollbar-color:rgba(178, 178, 178, 0.6) transparent;}


    /* полоса прокрутки (скроллбар) */
    .niceScroll::-webkit-scrollbar {width:7px; /* ширина для вертикального скролла */  background-color:transparent; height:7px; /*высота для горизонтального скролла */}
    .niceScroll::-webkit-scrollbar-thumb {background-color:transparent; border-radius:10px; box-shadow:none;}
    .niceScroll:hover::-webkit-scrollbar-thumb  {background-color:rgba(178, 178, 178, 0.6); transition: all .2s ease}
    .niceScroll::-webkit-scrollbar-thumb:hover {background-color:rgba(178, 178, 178, 0.8);}
}

/* Slider */
#scroll_collections {text-align:center; margin:8vh auto 0;}
#scroll_collections h2 {font:300 4rem/1 "Playfair Display";}

.slider_nft_x {display:flex; width:100%; margin:0 auto; align-items: center; overflow-y:hidden; overflow-x:auto; padding-bottom: 10px;}
.slider_nft_x li {position:relative; flex:0 0 250px; width:250px; height:250px; overflow:hidden; margin:2vh; margin-right:3vh; box-shadow: 10px 10px 20px -4px rgba(0,0,0,0.75);}
.slider_nft_x li img {width:100%; height:100%; object-fit:cover; transition: all .4s ease;}
.slider_nft_x li:hover img {transform: scale(1.2);}

.slider_nft_x li div {position:absolute; display:flex; justify-content:center;  flex-direction:column;  top:0; left:0; right:0; bottom:0; background-color:rgba(0, 0, 0, 0.7); color:#fff; margin:10px; border:5px solid #fff; text-align:left; padding: 0 3px 0 15px; opacity: 0; transition:opacity .4s ease;}
.slider_nft_x li div p {margin-top:10px; line-height:1.4}

.slider_nft_x li:hover div { opacity: 1;}

.slider_nft_x img { pointer-events: none;}
.cursor_grabbing {cursor: grabbing !important;}


/*  */

.center > h2:after, .aboutus > h1:after {content:""; display:block; background-color:#B89D4F; height:70px; width:1px; margin:1vh auto;}

.slider_button {text-align:center; margin:20px 0 8vh;}
.slider_button i {width:70px; height:50px; border:1px solid #B89D4F; margin:0 2px; color:#B89D4F; font-size:23px; line-height:48px}

.slider_content {max-width:1000px}
.slider_content > aside {display:none}
.slider_content > aside.active {display:inherit;}

.slider_content h3 {font:300 5rem/1 "Playfair Display"; text-align: center; margin-bottom:8vh}

.slider_content section { display:flex; justify-content: center; align-items:center; margin-top:50px;}
.slider_content section:nth-of-type(even) { flex-direction: row-reverse;}

.slider_content section > div {padding-left:5vw}
.slider_content section:nth-of-type(even) div { padding-left:0; padding-right:5vw}

.slider_content img {flex:1 1 100%; max-width:440px; height:390px; object-fit: cover; box-shadow: 29px 29px 141px -34px rgba(0,0,0,0.75);}


.slider_content b {font-family: 'Poppins'; font-weight: 300; text-transform: uppercase; color:#B89D4F}
.slider_content b:after {content:""; display:inline-block; background-color:#B89D4F; height:1px; width:200px; margin-left:2vh; vertical-align: middle;}
.slider_content h4 {font:400 3rem 'Playfair Display'; letter-spacing: -0.05em; margin:30px 0;}
.slider_content p {font-size:1.1rem; line-height:2}

.aboutus {margin-top:8vh}
.aboutus section {display:flex; justify-content: space-between;}
.aboutus h1 {font:300 4rem/1 "Playfair Display"; text-align:center;}
.aboutus section > span img {width:300px}
.aboutus section > div {color: #b89e4f; font-size: 1.25rem; line-height: 1.75;}
.aboutus section > p {font-size: 1.25rem; line-height: 1.75;}
.aboutus section > div, .aboutus section > p {flex:1 1 30%; padding:0 1vw; }

.space { margin-top:8vh}

.space h2 {font:300 3rem/1 "Playfair Display"; text-align:center;}

.space div {display:flex; justify-content: space-between; align-items: center;}

.space > div p {padding:0 0 0 2vw; font-size: 1.25rem; line-height: 1.75;}

footer {background-color: #1F242C; color:#FFFFFF; margin-top:100px; font:400 1rem "Open Sans", serif; padding:0 2vw;}
footer a {color:#2AEEE4}
.footer_top  {border-bottom: 1px solid #282F39; display:flex; justify-content: space-between; align-items: center; height:80px}
.footer_top ul {flex:1; display:flex; justify-content: space-between; padding-right:5vw}
.footer_top ul li, .footer_top ul li a {text-transform: uppercase; font-size:0.9rem; color:#fff}
.button_up {display:inline-block; color:#FFF; text-transform: uppercase; font-size: .75em;  vertical-align: middle; background-color:#2AEEE4; border-radius:20px; padding:10px 13px}
.button_up  i {margin-right:10px; font-size:16px;}

.footer_bottom ul {display:flex; justify-content: space-between; padding:2rem 0 4rem; font:300 0.8rem "Open Sans"; align-items: center; }
.footer_bottom .social a {font-size:40px; color:#FFFFFF;}

.footer_bottom li p span:after {content:"@"; }


@media (min-width: 801px) {
    .mobile {display:none;}
}


/* Для мобильного */
@media (max-width: 800px) {

    body { overflow-x: hidden;}
    .no_mobile, .moon .close {display:none !important;}

    header, .header_fixed {height:50px;}

    article p {padding:0 6px}


    .slide_big {display: initial; text-align:center;}
    .slide_big h2 {font-size:40px; margin-top:20px;}
    .slide_big > div img {width:100%; object-fit:cover; object-position:center top;}

    #scroll_collections {margin-top:40px}
    #scroll_collections h2 {font-size:40px;}
    .center > h2::after, .aboutus > h1::after {height: 40px;}

    .slider_content h3 {font-size:40px; margin-bottom: 30px;}
    .slider_content span {display:block; line-height:1.4;text-align: justify; }

    .slider_content section {display: initial;}
    .slider_content section div {padding:0;}
    .slider_content h4 {font-size:40px;}
    .slider_content img {display: block; margin:20px auto; max-width:100%; object-fit:cover; object-position:center top;}
    .slider_content p { text-align: justify;}
    .slider_content b {display:block; text-align:center;}
    .slider_content b::after {margin-left:0; width:100%}
    .slider_content section:nth-of-type(2n) div {padding-right:0}

    .slider_content aside {padding:0 9px}

    .aboutus h1 {font-size:40px;}


    .aboutus section {flex-flow: wrap;}
    .aboutus section > div { flex: 1 1 100%;}
    .aboutus section > span {width:100%; text-align:center; padding-top:20px;}

    .space div {display: initial;}
    .space img {width:100%}
    .space > div p {font-size:16px;}


    footer {padding:20px 10px 10px; position:relative; text-align:center;}
    .button_up {border-radius:15px 15px 0 0; position:absolute; right:10px; top:-38px; height:38px;}
    .footer_top {margin-top:20px}
    .footer_top ul {display:initial; columns: 2; padding:0 0 35px 0;}
    .footer_top ul li {line-height:2}
    .footer_bottom ul {display: initial}
    .footer_bottom img {margin:20px 0 10px;}
    .footer_bottom .privacy {margin:10px 0}

}

.menu_mobile_bt {display:flex; align-items: center; position:fixed; top:10px; right:20px; z-index:15; height:38px; color:#000000; }
.menu_mobile_bt span {font-size:34px; width:40px; line-height:1; height:100%; }
.menu_mobile_bt b {font-size:15px; font-weight:400; margin:0 0 5px 5px;}

.menu_mobile_bt i {transition: all .3s ease; color:#000000}

.menu_mobile_bt i:nth-of-type(2) { opacity: 0; color:#fff;}

.menu_mobile_bt.active i:nth-of-type(1) {transform: rotate(-45deg); color:#fff; opacity:0; transform-origin: center center; transition: all .3s ease}
.menu_mobile_bt.active i:nth-of-type(2) {transform: rotate(-45deg); opacity:1; transform-origin: center center; transition: all .3s ease}
.menu_mobile_bt.active b {color:#fff;}


.menu_mobile  {position: fixed;  top:0;  width:100%; height:120%; background-color:#363950; padding:15px 0 20px 0; z-index:4;}


.menu_mobile > div {width:100%; height:100vh; justify-content: center; align-items:center; }
.menu_mobile li {margin-bottom:30px;}
.menu_mobile li a, .menu_mobile li {color:#fff; font: 400 24px/30px "Montserrat"; text-decoration:none;}
.menu_mobile li i {font-size:22px; width:24px; color:#fff; margin-right: 10px;}