html, body{padding:0;margin:0;width: 100%;height: 100%;font-family: 'Titillium Web';}
*{box-sizing:border-box;}
a{color: inherit;}
.wrapper{width: 100%;max-width: 1400px;margin: auto;padding: 0 30px;}
#burger{display: none;}
.anima{transition: ease-out .5s}
.hideme{transform: translateY(20px);opacity: 0;}
.delay01{transition-delay: .2s;}
.delay02{transition-delay: .4s;}
.delay03{transition-delay: .6s;}
.delay04{transition-delay: .8s;}
.delay05{transition-delay: 1s;}
.delay06{transition-delay: 1.2s;}
.mobileNav{display: none;}
section{position: relative;}
header{
	position: absolute;
	top: 80px;
	left: 0;
	width: 100%;
	z-index: 999;
}
header nav{
	display: flex;
	align-items: center;
	justify-content: space-between;
}
header nav ul li{
	font-size: 30px;
	display: inline-block;
	font-weight: 700;
	margin-right: 30px;
	transition: ease-out .4s;
}
header nav ul li:hover{color: #fe9bd3;text-decoration: underline;}
header nav ul li .lang{color: #7c7c7c;text-decoration: underline;}
header nav .right{display: flex;align-items: center;}
header nav .right .rrss{margin-right: 22px;}
header nav .right .rrss svg{width: 44px;transition: ease-out .4s;}
header nav .right .rrss:hover svg{fill: #fe9bd3}
header nav .btnwallet{
	background: #ffc406;
	color: #fff;
	font-weight: 700;
	font-size: 22px;
	border-radius: 40px;
	padding: 10px 20px;
	transition: ease-out .4s;
	position: relative;
}
header nav .btnwallet:hover{background-color: #fe9bd3;}
header nav .btnwallet:before{content: 'Connect ';}
@media (min-width: 1100px){
	header nav .btnwallet:hover:after{
		content: 'Coming Soon';
		background: #000;
		width: 100%;
		text-align: center;
		position: absolute;
		padding: 10px 0;
		left: 50%;top: 50%;
		transform: translate(-50%,-50%);
		white-space: nowrap;
		background: #ffc406;
		border-radius: 40px;
	}
}
section#hero{
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	padding: 75px 0 45px;
}
section#hero .logo-hero{
	margin-bottom: 100px;
	max-width: 28vw;
	width: 300px;
}
section#hero h1{font-size: 41px;}
section#hero small{font-size: 29px;}
section#hero p{font-size: 26px;line-height: 1.5;color: #6e6e6e;text-align: center;max-width: 880px;margin:20px auto;}
section#hero .discrod{
	display: flex;
	align-items: center;
	justify-content: center;
	margin-top: 40px;
	white-space: nowrap;
	font-size: 26px;
	font-weight: 700;
	color: #fff;
	height: 60px;
	padding: 0 26px;
	background-color: #fe9bd3;
	border-radius: 50px;
	transition: ease-out .4s;
	position: relative;
}
section#hero .discrod:hover{
	background: #ffc406;
}
section#hero .discrod svg{width: 50px;margin-left: 10px;}
section#elephants .owl-dot{display: none;}
#detail{background: #ff0002;}
.grid{display: flex;}
.grid .image{width: 40%;}
.grid .texto{width: 60%;}
#detail .image img{display: block;width: 100%;}
#detail .texto{
	color: #fff;
	display: flex;
	align-items: flex-start;
	justify-content: center;
	flex-direction: column;
	padding-right: 12%;
	padding-top: 40px;
	padding-bottom: 40px;
}
#detail .texto h3{font-size: 37px;font-weight: 700;margin-bottom: 26px;}
#detail .texto p{font-size: 25px;line-height: 1.5;font-weight: 300;margin-bottom: 40px;}
#detail .texto ul{width: 100%;}
#detail .texto ul li{
	font-size: 29px;
	color: #fe9bd3;
	border-bottom: 2px solid #fe9bd3;
	padding: 6px 0;
}
#about .video{
	padding: 80px 0;
	background-image: url(../img/bg_video.jpg);
	background-size: cover;
	text-align: center;
	background-position: center;
}
#about .video h2{
	font-size: 44px;
	font-weight: 700;
	margin-bottom: 50px;
}
#about .video .vimeo{
	position: relative;
	max-width: 80%;
	margin: auto;
	padding-top: 45%;
}
#about .video .vimeo iframe{
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;left: 0;
}
#about .milo-lockett{
	background: #4ae7e8;
	padding: 60px 0 130px;
	align-items: center;
}
#about .milo-lockett .image{padding: 0 7vw 0 6vw;}
#about .milo-lockett .image .avatar{
	width: 100%;
	padding-top: 100%;
	border-radius: 100%;
	background-size: cover;
	background-position: center;
	position: relative;
}
#about .milo-lockett .image .avatar .firma{
	position: absolute;
	max-width: 140px;
	right: 20%;
	top: 84%;
}
#about .milo-lockett .texto{
	color: #fff;
	display: flex;
	align-items: flex-start;
	justify-content: center;
	flex-direction: column;
	padding-right: 12%;
}
#about .milo-lockett .texto h3{font-size: 37px;font-weight: 700;margin: 30px 0;color: #383d36}
#about .milo-lockett .texto p{font-size: 30px;line-height: 1.4;font-weight: 300;margin-bottom: 40px;color: #fb2da2;}
#about .milo-lockett .texto .rrss{display: flex;align-items: center;}
#about .milo-lockett .texto .rrss svg{width: 60px;fill: #fb2da2;margin-right: 20px;transition: ease-out .4s;}
#about .milo-lockett .texto .rrss svg:hover{fill: #ffc406;}
#about .marquee{
	padding-top: 5px;
}
#about .marquee .owl-dot{display: none;}
#about .illusMilo .image img{display: block;margin: auto;position: relative;top: 10px;max-width: 290px;transform: translateX(60px);}
#about .illusMilo .texto{
	color: #000000;
	padding: 100px 20px;
	max-width: 1120px;
	width: 100%;
	margin: auto;
}
#about .illusMilo .texto p{
	margin: 40px;
	font-size: 26px;
	line-height: 1.4;
}
#about .illusMilo .texto p.pink{
	color: #f731a4;
	font-size: 30px;
}
#about .stripYellow{
	background: #ffc406;
}
#about .stripYellow .stripGrey{
	width: 100%;font-size: 25px;
	color: #686868;
	text-align: center;
	background: #eeeeee;
	padding: 6px 0;
}
#about .stripYellow .wrap{
	max-width: 1400px;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 160px;
	margin: auto;
	padding: 0 20px;
}
#about .stripYellow .wrap img{display: block;max-width: 50%;}
#uniqueArt {
	background: #4ae7e8;
	padding: 100px 0;
}
#uniqueArt h2{    
	font-size: 44px;
    font-weight: 700;
    margin-bottom: 50px;
    text-align: center;
}
#uniqueArt .images img{height: 380px;}
#uniqueArt p{
    margin: 40px auto;
    font-size: 26px;
    line-height: 1.4;
    max-width: 1020px;
}
#physical {
	background: #c4d90e;
	padding: 100px 0;
}
#physical h2{    
	font-size: 44px;
    font-weight: 700;
    margin-bottom: 50px;
    text-align: center;
}
#physical .images img{height: 380px;}
#physical p{
    margin: 40px auto;
    font-size: 26px;
    line-height: 1.4;
    max-width: 1020px;
}
#about #properties{
	padding: 80px 0;
	background-image: url(../img/bg-elefante.jpg);
	background-size: cover;
	background-position: center;
}
#properties h2{
	font-weight: 700;
	text-align: center;
	font-size: 44px;
	margin-bottom: 34px;
}
#properties .wrapper .mid{
	width: 50%;
	display: flex;
	flex-wrap: wrap;
	align-items: stretch;
	justify-content: space-between;
}
#properties .wrapper .card{
	font-size: 30px;
	color: #fff;
	line-height: .9;
	padding: 26px;
	border-radius: 20px;
	background-color: rgba(0,0,0,0.3);
	text-transform: uppercase;
	width: calc(50% - 4px);
	margin: 5px 0;
	font-weight: 600;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-start;
}
#properties .wrapper .card span{font-size: 1.8em;}
#properties .wrapper .card h4{margin-bottom: 12px;color: #ffc406;width: 100%;}
#properties .wrapper .card.alto{height: 170px;}
#properties .wrapper .card.alto h4{max-width: 180px;;}
#properties .wrapper .card.full{width: 100%;}
#properties .wrapper .card.alto h4{color: #fb2da2;}
#properties .wrapper .card.yellow{background-color: #ffc406;}
#properties .wrapper .card.purple{background-color: #fe9bd3;}
#properties .wrapper .card.pink{background-color: #f41d6d;}
section#roadmap{
	background-image: url(../img/bg-roadmap.jpg);
	background-size: cover;
	background-position: center;
	background-color: #fe9bd3;
	padding: 80px 0;
}
section#roadmap h2{
	font-weight: 700;
	text-align: center;
	font-size: 44px;
	margin-bottom: 60px;
}
section#roadmap .numItem{
	display: flex;
	align-items: stretch;
	justify-content: flex-end;
}
section#roadmap .numItem .num{
	font-weight: 300;
	font-size: 76px;
	min-width: 210px;
	display: flex;
	position: relative;
	color: #fb2da2;
}
section#roadmap .numItem .text:before{
	content: '';
	top: calc(50% + 70px);right: calc(100% - 16px);
	transform: translateY(-50%);
	width: 24px;height: 24px;
	border-radius: 100%;
	border: 4px solid #fe9bd3;
	background: #ff7357;
	position: absolute;
	z-index: 1;
}
section#roadmap .numItem .text img{
/*	max-width: 160px;
	max-height: 160px;*/
	position: absolute;
	top: 40%;
	right: calc(100% + 10px);
}
section#roadmap .numItem .text.iconRight img{	
	right: auto;
	left: calc(100% + 10px);
}
section#roadmap .numItem .text{
	border-left: 2px solid #FFF;
	padding-left: 30px;
	font-size: 26px;
	line-height: 1.2;
	color: #fff;
	padding-top: 150px;
	width: calc(100% - 200px);
	position: relative;
}
section#roadmap .numItem:first-child .text{padding-top: 0;}
section#roadmap .numItem:first-child .text:before{top: 50%}
section#roadmap .wrapper{max-width: 900px;}
section#masonry{
	display: flex;
	align-items: stretch;
	flex-wrap: wrap;
	display: none;
}
section#masonry .cardElephant{
	width: 20%;
	padding-top: 20%;
	background-size: cover;
	background-position: center;
}
/*section#carruselEle .owl-item{width: 20vw !important;}*/
section#carruselEle .item{
	padding-top: 100%;	
	background-size: cover;
	background-position: center;
}
section#carruselEle .eleCarr2, 
section#carruselEle .eleCarr2 .item{transform: scaleX(-1);}
section#carruselEle .owl-dots{display: none;}
section#team{
	padding: 80px 0 40px;
}
section#team h2{
	font-weight: 700;
	text-align: center;
	font-size: 44px;
	margin-bottom: 90px;
}
section#team .flex{
	align-items: center;
	justify-content: center;
	display: flex;
	flex-wrap: wrap;
	max-width: 1280px;
	margin: auto;
}
section#team .space{width: 100%;height: 1px;}
section#team .flex .team{
	font-size: 20px;
	text-align: center;
	color: #757575;
	line-height: 1.3;
	font-weight: 600;
	margin: 25px 0px;
	width: 320px;
}
section#team .flex .team h5{font-weight: 400;color: #000;margin-top: 18px;font-size: 24px;color: #fc52b0;}
section#team .flex .team .avatar{
	width: 180px;
	padding-top: 180px;
	margin: auto;
	border-radius: 100%;
	background-size: cover;
	background-position: center;
	display: block;
	position: relative;
}
section#team .flex .team .avatar:hover:after{
	content: '';
	position: absolute;
	left: 0;top: 0;
	width: 100%;
	height: 100%;
	background-image: url(../img/ico-link.svg);
	background-repeat: no-repeat;
	background-size: 40px auto;
	background-position: center;
	background-color: rgba(0, 0, 0, .50);
	border-radius: 100%;
}
section#team .logos{
	display: flex;
	align-items: center;
	justify-content: center;
	margin-top: 80px;
}
section#team .logos img{max-height: 50px;}
section#team .logos i{
	height: 70px;
	width: 2px;
	display: block;
	background: #000;
	margin: 0 40px;
}
footer{
	padding: 40px 0;
	background: #4ae7e8;
	color: #FFF;
}
footer .wrapper{
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 18px;
}
footer .wrapper:first-child{margin-bottom: 40px;}
footer .wrapper .left{
	padding-right: 40px;
	border-right: 2px solid #fff;
}
footer .wrapper .left img{width: 176px;}
footer .wrapper .right{
	display: flex;
	align-items: center;
	padding-left: 40px;
}
footer .wrapper .right svg{width: 36px;margin-right: 20px;fill: #fff}
footer .wrapper .links{width: 356px;display: flex;margin-left: 20px;}
footer .wrapper .links a{margin: 0 30px;white-space: nowrap;}
footer .wrapper small{padding-right: 50px;border-right: 2px solid #fff;}

@media (max-width: 800px){
	#burger{
		width: 40px;
		display: flex;
		flex-direction: column;
		height: 40px;
		align-items: flex-start;
		justify-content: center;
	}
	#burger i{margin: 5px 0;}
	#burger:before, #burger:after, #burger i{
		content: '';
		width: 100%;
		height: 3px;
		background: #000;
		display: block;
		border-radius: 2px;
	    position: relative;
	    z-index: 1;
	}
	#burger:before{width: 70%;}
	#burger:after{width: 90%;}
	.wrapper{padding: 0 20px;}
	.mobileNav{display: block;}
	header nav .btnwallet:before{content: '';}
	header nav .btnwallet{    
		font-size: 18px;
	    border-radius: 40px;
	    padding: 6px 15px;
	}
	header{
		top: 0;
		position: fixed;
		z-index: 999;
		padding: 30px 0 20px;
	}
	header nav{
		display: flex;
		flex-direction: row-reverse;
	}
	header nav .right .rrss{display: none;}
	.mobileNav .right{justify-content: center;}
	.mobileNav .right .rrss{display: initial;}
	header nav .left{
		position: absolute;
		width: 100%;
		left: 0;top: 0;
		height: 100vh;
		background: #fff;
		padding-top: 100px;
		display: none;
	}
	header nav .left ul li{display: block;margin: 40px 0;text-align: center;font-size: 30px;}
	section#hero{padding: 22px 0 26px;}
	section#hero p{font-size: 14px;padding: 0 20px;line-height: 1.4;}
	section#hero .logo-hero{max-width: 44vw;margin-bottom: 22px;}
	section#hero h1{font-size: 22px;}
	section#hero small{font-size: 18px;}
	section#hero .discrod{
		font-size: 20px;
		margin-top: 30px;
		height: 50px;
	}
	section#hero .discrod svg{width: 30px;margin-left: 20px;}
	#detail{flex-direction: column;}
	#detail .image{width: 100%;}
	#detail .texto{
		width: 100%;
		padding: 0 20px;
		margin: 0;
		transform: translateY(-50px);
	}
	#detail .texto h3{font-size: 30px;}
	#detail .texto p{font-size: 20px;}
	#detail .texto ul li{font-size: 20px;}
	#about .video{padding: 50px 0;}
	#about .video h2{font-size: 30px;margin-bottom: 30px;}
	#about .video .vimeo{margin: 0 20px;max-width: 100%;padding-top: 50%;}
	#about .milo-lockett{flex-direction: column;padding: 50px 0;}
	#about .milo-lockett .image{width: 70%;margin-bottom: 50px;}
	#about .milo-lockett .image .avatar .firma{max-width: 90px;right: 10px;}
	#about .milo-lockett .texto h3{font-size: 30px;}
	#about .milo-lockett .texto{
		width: 100%;
		padding: 0 20px;
		margin: 0;
	}
	#about .milo-lockett .texto p{font-size: 20px;}
	#about .marquee .imageMarquee img{max-height: 17vh;}
	#about .illusMilo{padding: 50px 0 0px;align-items: flex-end;}
	#about .illusMilo .texto{padding-right: 20px;padding-top: 0;padding-bottom: 60px;}
	#about .illusMilo .texto p, #about .illusMilo .texto p.pink{margin: 0;margin-bottom: 20px;font-size: 20px;}
	#about .stripYellow {padding: 0px 0 30px;}
	#about .stripYellow .stripGrey{margin-bottom: 20px;}
	#about .stripYellow strong{font-size: 18px;margin-bottom: 20px;}
	#about .stripYellow .wrap img{
	    margin: 10px 10px;
	    max-width: 100%;
	}
	#about .stripYellow .wrap img:last-child{transform: translateX(-12%);}
	#about .stripYellow .wrap{flex-direction: column;}
	#about #properties{padding: 50px 0;background-position: -100% center;}
	#properties h2{font-size: 30px;}
	#properties .wrapper > .mid{width: 100%;}
	#properties .wrapper .card{
		padding: 18px;
		font-size: 16px;
	}
	#properties .wrapper .card.alto{height: 120px;}
	#uniqueArt{padding: 50px 0;}
	#uniqueArt h2{font-size: 30px;}
	#uniqueArt p{font-size: 20px;}
	#uniqueArt .images img{height: 280px;width: auto !important;}
	#physical{padding: 50px 0;}
	#physical h2{font-size: 30px;}
	#physical p{font-size: 20px;}
	#physical .images img{height: 280px;width: auto !important;}
	section#carruselEle{display: none;}
	section#masonry{display: flex;}
	section#masonry .cardElephant{
		width: 50%;
		padding-top: 50%;
	}
	section#masonry .cardElephant:nth-child(4), 
	section#masonry .cardElephant:nth-child(8){display: none;}
	section#roadmap{padding: 50px 0;}
	section#roadmap h2, section#team h2{font-size: 30px;margin-bottom: 30px;}
	section#roadmap .numItem {margin-top: 0px;}
	section#roadmap .numItem .num{font-size: 50px;}
	section#roadmap .numItem .text{font-size: 18px;margin-left: 16px;border-width: 2px;width: calc(100% - 90px);}
	section#roadmap .numItem .text img{width: 100px;bottom:auto;top: 50%;transform: translateY(-50%);}
	section#roadmap .numItem .text{padding-top: 60px;}
	section#roadmap .numItem:not(:first-child) .text img{top: calc(50% + 30px);}
	section#roadmap .numItem .text.iconRight img{right: calc(100% + 10px);left: auto;}
	section#team{padding: 50px 0;}
	section#team .space{display: none;}
	section#team .flex .team{width: 50%;padding: 0 16px;font-size: 16px;}
	section#team .flex .team h5{font-size: 20px;}
	section#team .flex .team .avatar{width: 120px;padding-top: 120px;}
	section#team .logos i{min-width: 1px;margin: 0 10px;width: 1px;height: 40px;}
	section#team .logos img{max-height: 30px;}
	section#team .logos i:nth-child(6),
	section#team .logos img:nth-child(5){display: none;}
	footer .wrapper{
		flex-direction: column;
		align-items: center;
	}
	footer .wrapper .left,
	footer .wrapper small{padding: 0;border: 0;margin-bottom: 20px;}
	footer .wrapper .links{width: auto;margin: 0;}
	.marquee .owl-carousel .item img{max-height: 280px;width: auto !important;}
}
@media (min-width: 2000px){
	section#carruselEle .owl-item{width: 16.66vw !important;}
}

