@media (max-width:1400px){
    .container{
        max-width: 1170px;
    }
}


@media screen and (min-device-width: 1200px) and (max-device-width: 1600px) 
	and (-webkit-min-device-pixel-ratio: 2) and (min-resolution: 192dpi)  {

    .container{
        max-width: 960px;
    }
    .nft-lottery{
        gap: 20px;
    }
    .nft-lottery li{
        padding: 10px 20px;
    }

    .project ul{
        width: 90%;
        margin: 0 5%;
    }
	
	p{
		font-size: 14px;
		line-height: 16px;
	}
	
	.text-large{
		font-size: 18px;
		line-height: 20px;
	}
	
	h1{
		font-size: 42px;
		line-height: 48px;
	}
	
	h3{
		font-size: 20px;
		line-height: 24px;
	}
	.text-upper{
		margin: 0px;
	}
	
	.text-small{
		font-size: 14px;
		line-height: 16px;
	}
	.roadmap ul li p{
		font-size: 14px;
		line-height: 22px;
	}
	
	.future video {
		max-width: 400px;
		margin: 0px auto;
	}
		
	.project-feature video{
		width: 200px;
	}
		
	.f-col h2{
		font-size: 18px;
		line-height: 20px;
	}	
	
	.roadmap-image{
			width: 80%;
			margin: 0px auto;
	}	
	img.nft-pool{
    width: 100%;
	max-width: 400px;
}
		
	.hero .hero-content{
    min-width: 500px;
}

}



@media (max-width:980px){
    .container{
        max-width: 90%;
    }
}



@media (max-width:768px){
    section,
    section .container,
    section .container-wide{
        height: inherit;
        flex-direction: column;
    }

    .core .container-wide,
    .introducing .container-wide,
    .roadmap .container-wide,
    .future .container-wide.main-content{
        flex-direction: column-reverse;
    }

    section{
        padding-top: 50px;
    }

    .w-50{
        width: 100%;
    }

    h1{
        font-weight: 600;
        font-size: 32px;
        line-height: 42px;
    }
    header{

    }

    #nav-icon{
        display: block;
    }

    header .nav{
        position: fixed;
        right: -100vw;
        width: 100%;
        height: 100%;
        top: 0;
        background: #000;
        transition: right .4s;
        padding-top: 10px;
        z-index: 2;
        margin-top: 0;
    }
    header .logo img{
        width: 260px;
    }
    header .nav.open{
        right: 0;
    }

    header .nav li{
        display: block;
        margin: 20px 0;
        text-align: center;
    }

    header .nav li a:not(.btn){
        display: block;
        padding: 30px;
        font-size: 24px;
    }

    header .nav li.social-links a{
        display: inline-block;
        padding: 30px 10px;
    }

    header .nav li.social-links a img{
        width: 30px;
    }
	
	.hero-video-mobile{
		display: block!important;
	}
	

	.hero .container-wide{
		height: 100vh;
	}
	
	.hero-video-mobile{
		position: absolute;
	}
	
	
    .hero .hero-content{
        text-align: center;
        width: 100%;
        min-width: inherit;
        padding-top: 150px;
    }

	
	section.hero {
		padding-top: 0px;}
	
	
	.hero-video{
		display: none;
	}
	

    .features ul,
    .nft-guaranteed,
    .nft .nft-top,
    .project ul{
        flex-direction: column;
    }

    .features ul li{
        text-align: center;
        margin-top: 50px;
    }
    .features ul li img{
        left: 50%;
        transform: translateX(-50%);
    }

    .core,
    .introducing,
    .nft{
        text-align: center;
    }
    .core ul li{
        text-align: left;
    }
    .nft-top h2{
        justify-content: center;
    }

    .nft-lottery{
        flex-direction: column;
    }

    .nft-cards li,
    .nft-guaranteed li{
        text-align: center;
    }

    .nft-guaranteed li:after{
        width: 100%;
        height: 1px;
        bottom: -15px;
        right: inherit;
        top: inherit;
    }

    .nft-pool{
        margin: 30px 0;
    }

    .nft-lottery-cond{
        justify-content: center;
    }

    .nft-guaranteed .nft-lottery-cond div{
        padding: 0;
    }

    .project ul li:after{
        display: none
    }

    .roadmap ul{
        margin-top: 50px;
    }
    .roadmap ul li:before,
    .roadmap ul li:after{
        display: none;
    }

    .future{
        text-align: center;
    }
    .future .container-wide.main-content{
        margin-top: 0;
    }

    footer{
        margin-top: 50px;
        position: relative;
    }

    .footer-social a{
        display: block;
        margin-bottom: 10px;
    }

    .footer-nav{
        margin-top: 10px;
        margin-bottom: 20px;
    }
    .footer-contact{
        margin-top: 10px;
    }
    .footer-nav li{
        padding: 10px 0;
        display: inline-block;
    }
	
	.future video {
		width: 100%;
   		margin-bottom: 20%;
	}
	
	
	
	
}