@font-face {
    font-family:'homestead';
    src: url(../metagoat/fonts/Homestead-Regular.woff) format("woff"), 
         url(../metagoat/fonts/Homestead-Regular.ttf) format("truetype");
    font-style: normal;
}

html{background-color:#24282d;}

h3.standalone{font-family:'Ethnocentric';color:#fff;text-align:center;font-size:1.6em;}

.metagoat{display:flex;position:relative;background-repeat:no-repeat;background-size:cover;}

.metagoat .inner{display:flex;position:relative;width:100%;max-width:1200px;margin:0 auto;padding:0 20px}

.metagoat .inner h1.logoSF{position:absolute;top:20px;left:20px;width:200px;height:55px;background-image:url('../img/snaifunLogoOutline.png');background-position:left center;background-repeat:no-repeat;background-size:contain;margin:0;padding:0;}
.metagoat .inner .blockMG{display:flex;}
.metagoat .inner .blockMG .text{color:#fff;}
.metagoat .inner .blockMG .text h2.logoMG{background-image:url('../met4go4ts/mglogo.png');background-position:left center;background-repeat:no-repeat;background-size:contain;padding:0;}
.metagoat .inner .blockMG .text p{max-width:500px;font-size:1.2em;line-height:1.6em;font-weight:400;}
.metagoat .inner .blockMG .text p.special{margin-top:50px;}
.metagoat .inner .blockMG .text a.cta{width:280px;text-align:center;font-family:'Ethnocentric';color:#24282D;font-size:1.4em;display:inline-block;padding:10px 20px;border-radius:16px;background: linear-gradient(180deg, #FFBA00 0%, #FF8303 74.29%),linear-gradient(93.61deg, #FFDC83 11.69%, #D64D00 95.15%);margin-top:20px;}
.metagoat .inner .blockMG .text a.cta2{width:280px;text-align:center;font-family:'Ethnocentric';color:#fff;font-size:1.4em;display:inline-block;padding:10px 20px;border-radius:16px;background: linear-gradient(180deg, #393939 0%, #000 74.29%);margin-top:10px;}



.metagoat:after{content:'';position:absolute;bottom:0;display:block;width:100%;height:100px;background:#24282d;clip-path: polygon(100% 0, 0% 100%, 100% 100%);}




.block-container{max-width:1200px;margin:0 auto 40px;padding:2px;border-radius:16px;}
.block-container .inner{display:flex;flex-flow:column;background-color:#1D2125;border-radius:16px;}
.block-container .inner > .separator{margin-top:-60px;margin-bottom:-50px;display:block;height:150px;background-image:url('../met4go4ts/section_separator.png');background-position:center center;background-repeat:no-repeat;background-size:contain;}


.row1{padding:0 10px;background-image:url('../met4go4ts/row1.jpg');background-position:right top;background-repeat:no-repeat;}
.row1 .block-container{background:linear-gradient(257.13deg, #52FF00 1.93%, #00A880 51.2%, #1400FF 97.49%);}

.row2{padding:0 10px;}
.row2 .block-container{background:linear-gradient(94.07deg, #F79400 1.76%, #FA00FF 54.2%, #FF2323 103.45%);}

.row3{padding:0 10px;}
.row3 .block-container{background:linear-gradient(97.87deg, #00DDEB 9.96%, #FF00FC 51.87%, #575EFF 90.42%);}




.section01{display:flex;align-items:center;padding-top:40px;}
.section01 header{flex:1;padding:40px;}
.section01 header .number{font-family:'Ethnocentric';color:#D4D4D4;font-size:4em;}
.section01 header h3{font-family:'Ethnocentric';font-size:1.7em;line-height:1em;color:#fff;margin:0;}
.section01 header h3 strong{display:block;color:#FF8303;}
.section01 header .separator{display:block;height:50px;background-image:url('../met4go4ts/header_separator.png');background-position:center center;background-repeat:no-repeat;background-size:contain;}
.section01 header p{color:#F5F5F5;line-height:1.4em;}
.section01 figure img{width:100%;}

.section02{display:flex;align-items:center;margin-bottom:-10px;}
.section02 header{flex:1;padding:40px;}
.section02 header .number{font-family:'Ethnocentric';color:#D4D4D4;font-size:4em;}
.section02 header h3{font-family:'Ethnocentric';font-size:1.7em;line-height:1em;color:#fff;margin:0;}
.section02 header h3 strong{display:block;color:#FF8303;}
.section02 header .separator{display:block;height:50px;background-image:url('../met4go4ts/header_separator.png');background-position:center center;background-repeat:no-repeat;background-size:contain;}
.section02 header p{color:#F5F5F5;line-height:1.4em;}
.section02 figure{flex:2;}
.section02 figure img{width:100%;}

.section03{display:flex;align-items:center;}
.section03 header{flex:1;padding:40px;}
.section03 header .number{font-family:'Ethnocentric';color:#D4D4D4;font-size:4em;}
.section03 header h3{font-family:'Ethnocentric';font-size:1.7em;line-height:1em;color:#fff;margin:0;}
.section03 header h3 strong{display:block;color:#FF8303;}
.section03 header .separator{display:block;height:50px;background-image:url('../met4go4ts/header_separator.png');background-position:center center;background-repeat:no-repeat;background-size:contain;}
.section03 header p{color:#F5F5F5;line-height:1.4em;}
.section03 figure{flex:2;}
.section03 figure img{width:100%;}

.section04{display:flex;align-items:center;margin-bottom:-10px;}
.section04 header{flex:1;padding:40px;}
.section04 header .number{font-family:'Ethnocentric';color:#D4D4D4;font-size:4em;}
.section04 header h3{font-family:'Ethnocentric';font-size:1.7em;line-height:1em;color:#fff;margin:0;}
.section04 header h3 strong{display:block;color:#FF8303;}
.section04 header .separator{display:block;height:50px;background-image:url('../met4go4ts/header_separator.png');background-position:center center;background-repeat:no-repeat;background-size:contain;}
.section04 header p{color:#F5F5F5;line-height:1.4em;}
.section04 header .prices{margin-top:30px;}
.section04 header .prices img{width:100%;}
.section04 figure{flex:2;}
.section04 figure img{width:100%;}

.sectionDownload{display:flex;padding-top:30px;}
.sectionDownload header{flex:1;padding:40px;}
.sectionDownload header h3{font-family:'Ethnocentric';font-size:2.4em;line-height:1em;color:#fff;margin:0 0 10px;}
.sectionDownload header .sn4ifunlogo{width:200px;height:30px;margin-bottom:20px;background-image:url('../img/snaifunLogoOutline.png');background-position:left center;background-repeat:no-repeat;background-size:contain;}
.sectionDownload header .separator{display:block;height:50px;background-image:url('../met4go4ts/header_separator.png');background-position:center center;background-repeat:no-repeat;background-size:contain;}
.sectionDownload header p{color:#F5F5F5;line-height:1.4em;margin:30px 0;}
.sectionDownload header .stores{display:flex;}
.sectionDownload header .stores img{max-height:48px;}

.sectionDownload figure{flex:1;margin:0;}
.sectionDownload figure img{width:100%;}

@media screen and (max-width:579px){

    .section01, .section02, .section03, .section04, .sectionDownload{flex-flow:column;}

    .sectionDownload{align-items:center;}

    .section01{padding-top:10px;}

    .section01 header, .section02 header, .section03 header, .section04 header, .sectionDownload header{padding:20px;}
    .section01 figure, .section02 figure, .section03 figure, .section04 figure{margin:20px;}

    

    .metagoat{height:700px;background-image:url('../met4go4ts/cover_mobile.jpg');background-position:right center;}
    .metagoat .inner .blockMG .text h2.logoMG{width:280px!important;height:30px;margin:0 0 10px;}
}

@media screen and (min-width:580px){

    .sectionDownload{align-items:flex-end;}

    .section02 header, .section04 header{order:2;}
    .section02 figure, .section04 figure{order:1;}

    

    .metagoat{height:700px;background-image:url('../met4go4ts/cover_desktop.jpg');background-position:right center;}
    
}

@media screen and (max-width:767px){

    .metagoat .inner .blockMG{flex-flow:column;justify-content:center;margin-bottom:100px;margin-top:60px;}
    
    .metagoat .inner .blockMG .text p{font-size:0.9em;padding-right:60px;}

    .desktop{display:none;}
    .mobile{display:block;}
} 

@media screen and (min-width:768px){

    .metagoat .inner{display:flex;align-items:center;}
    .metagoat .inner .blockMG .text{flex:1;}
    

    .desktop{display:block;}
    .mobile{display:none;}
} 

@media screen and (max-width:1023px){

    .metagoat .inner .blockMG .text h2.logoMG{width:500px;height:50px;margin:0 0 10px;}

    .sectionDownload header .stores{flex-flow:column;align-items:center;}
    .sectionDownload header .stores a + a{margin-top:10px;}

} 

@media screen and (min-width:1024px){

    .metagoat .inner .blockMG .text h2.logoMG{width:980px;height:100px;margin:0 0 20px;}

    .sectionDownload header .stores{}
    .sectionDownload header .stores a + a{margin-left:10px;}
}