/*
Theme Name: uglywaifu
Theme URI: https://wordpress.org/themes/twentytwentythree
Author: jameshost.me
*/
@import url('https://fonts.googleapis.com/css2?family=Pangolin&family=Quicksand:wght@300;400;600&display=swap');

*{
	margin: 0;padding: 0;
	font-family: Pangolin, sans-serif;
	color: #272727;
}

*::-webkit-scrollbar {
  width: 6px;
}
 
*::-webkit-scrollbar-track {
/*  box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);*/
/*  border-radius: 3px;*/
	background: #fff;
}
*::-webkit-scrollbar-thumb {
  background-color: #bbb;
/*  outline: none;*/
  border-radius: 5px;
}
a{
	color: #457fa3;
}

html{min-height: 100%;}
body{min-height: 100%;}
.clearfix:after{
	display: table;
	content: '';
	clear: both;
}
div.container{
	width: 1300px;
	margin: 0 auto;
	max-width: 90%;
}
div.banner{
	background: #4aa0d8 url('imgs/bg-colors/blue.jpg') no-repeat;
	background-size: cover;
	display: block;
	margin-top: -135px;
	padding-top: 135px;
/*	padding-top: 30px;*/
	width: 100%;
}
div.header{
	padding-top: 30px;
}
a.logo{
	display: inline-block;
}
a.logo img.logo{
	max-width: 100%;
}
.menu{
	float: right;
	font-size: 22px;
}

#connect-btn,
#disconnect-btn{
		font-size: 20px;
    padding: 5px 35px 4px 10px;
    border: 2px solid #ffffff;
    border-radius: 6px;
    color: #fff;
    background: #E096C7;
    position: relative;
		display: inline-block;
		text-transform: lowercase;
		cursor: pointer;
		font-weight: 400;
}
#connect-btn span,
#disconnect-btn span{ color: #fff }
#connect-btn:after,
#disconnect-btn:after{
	content: '';
	position: absolute;
	right: 10px;
	top:50%;
	transform: translateY(-50%);
	width: 12px;
	height: 20px;
	background: url('imgs/ethereum.png') no-repeat;
	background-size: contain;
}
#connect-btn:hover,
#disconnect-btn:hover{
	opacity: 0.85;
}
	#disconnect-btn .hover-text{ display: none; }
	#disconnect-btn:hover .hover-text{
		display: inline-block;
		color: #FFF;
	}
	#disconnect-btn:hover .hide-hover{
		display: none;
	}

ul.main-menu{
	list-style: none;
	display: inline-block;
	margin-top: 12px;
}
ul.main-menu > li{
	float: left;
}
.menu a{
	text-decoration: none;
	padding:5px;
	margin:0 0 0 15px;
	text-transform: lowercase;
	color:#272727;
}
.menu .social{
	float: right;
	margin-left: 20px;
}
.menu .social a{
	display: inline-block;
	position: relative;
	height: 16px;
	width: 16px;
	top:5px;
}
.menu a.twitter{
	background: url('imgs/twitter.png') no-repeat;
	background-size: contain;
}
.menu a.discord{
	background: url('imgs/discord.png') no-repeat center center;
	background-size: contain;
	width: 20px;
}
.menu a.contact{
	background: url('imgs/mail.png') no-repeat;
	background-size: contain;
	display: none;
}
.menu a.opensea{
	background: url('imgs/opensea.png') no-repeat;
	background-size: contain;
}
.penelope{
	background: url('imgs/penelope.png') no-repeat 60% bottom;
	background-size: contain;
	width: 50%;
	height:530px;
	float: left;
}
.banner-text{
	float: left;
	width: 50%;
}
.banner-text h1{
	display: inline-block;
	font-size: 120px;
	line-height: 150px;
	font-weight: 400;
	color:#fff;
	background: url('imgs/kitty-ghosts.png') no-repeat top right;
	background-size: contain;
	padding:50px 90px 0 0;
	animation-name: kittyghost;
	animation-duration: .7s;
	animation-iteration-count: infinite;
	animation-direction: alternate;
}
@keyframes kittyghost {0%{padding:50px 90px 0 0;}100%{padding:50px 93px 0 0;}}

.banner-text p{
	font-family: 'Quicksand';
	font-weight: 300;
	font-size: 42px;
	line-height: 55px;
	color: #fff;
	max-width: 510px;
	margin-top: 10px;
}
.banner-text span.wen{
	background: #E096C7;
	border: 5px solid #FFFFFF;
	border-radius: 5px;
	font-weight: 400;
	font-size: 42px;
	line-height: 52px;
	color:#fff;
	padding:10px 30px 5px;
	margin-top:40px;
	display: inline-block;
	cursor: pointer;
	position: relative;
	z-index: 2;
	animation-name: bgcolorparty;
	animation-duration: 1.2s;
	animation-iteration-count: infinite;
	animation-direction: normal;
}
a.cta-opensea{
		font-size: 30px;
    padding: 15px 15px 10px;
    border: 5px solid #ffffff;
    border-radius: 5px;
    color: #fff;
    background: #E096C7;
    text-decoration: none;
    position: relative;
		z-index: 2;
		margin-top:40px;
		display: inline-block;

}
a.cta-opensea:hover{
	animation-name: bgcolorparty;
	animation-duration: 1.2s;
	animation-iteration-count: infinite;
	animation-direction: normal;
}

@keyframes bgcolorparty {
	0%    {		background: #fda2fd;	} /*pink*/
	19%   {		background: #fda2fd;	} /*pink*/
	20%   {		background: #87d97c;	} /*green*/
	39%   {		background: #87d97c;	} /*green*/
	40%   {		background: #fed95d;	} /*yellow*/
	59%   {		background: #fed95d;	} /*yellow*/
	60%   {		background: #aa83db;	} /*purple*/
	79%   {		background: #aa83db;	} /*purple*/	
	80%   {		background: #3dd7bb;	} /*turquoise*/
	100%  {		background: #3dd7bb;	} /*turquoise*/
}
@media(max-width:1400px){
	.penelope{height: 420px;}
	.banner-text h1{font-size: 80px; line-height: 100px;}
	.banner-text p{ font-size: 32px; max-width: 400px; margin-top:0;}
	.banner-text span.wen{font-size: 32px;margin-top:30px;}
}
@media(max-width:1080px){
	a.logo{width: 150px;} 
	.penelope{height: 380px;}
	.banner-text h1{font-size: 60px; line-height: 80px;}
	.banner-text p{ font-size: 28px; max-width: 380px; line-height: 40px;}
	.banner-text span.wen{font-size: 32px;margin-top:30px;padding:5px 20px 2px;}

	#connect-btn{font-size: 18px;margin-right: 10px;}
	.menu{font-size: 18px;}

}

@media(max-width:820px){
	div.header .container{text-align: center;}
	div.banner{ margin-top: -100px; padding-top: 100px; }
	.banner .container{text-align: center;}
	a.logo{width: 100px;margin:10px 0;}
	.menu{ float: none;}
	.menu ul.main-menu{position: absolute;left: 50%;transform:translateX(-50%);top: 100px;font-weight: 400;}
	.menu a{margin:3px;}
	.menu .social{float: none;position: absolute;top: 20px;right: 20px;}
	.menu a.opensea, .menu a.twitter,.menu a.contact{width: 10px; height:10px; top:9px;}
	.menu a.discord{width: 14px; height:11px; top:9px;}

	div.header .container,
	.banner-content{display: flex;flex-wrap:wrap; justify-content: initial; }
	.banner-content{ padding-top: 50px; }
	.penelope{width: 100%; background-position: bottom center;order:2; height: 250px; margin-top: 30px;}
	.banner-text{width: 100%; order:1}
	.banner-text h1{font-size: 40px; line-height: 80px;padding:25px 55px 0 0;animation: none;}

	.banner-text p{ font-size: 24px; max-width: 320px; line-height: 36px;margin: auto;}
	.banner-text span.wen{font-size: 32px;margin-top:30px;padding:5px 20px 2px;}
		a.cta-opensea{font-size: 24px;margin-top:30px;}
}

@media(max-width: 520px){
	.menu a.opensea, .menu a.twitter,.menu a.contact{width: 10px; height:10px; top:9px;}
	.menu a.discord{width: 14px; height:10px; top:9px;}
}

@media(max-width:400px){
	.menu{font-size: 16px;font-weight: 700;}
	.banner-text p{ font-size: 22px;max-width: 300px;}
}

/****y tho****/
.y-tho{
	background: #fd9ffd url('imgs/bg-colors/pink.jpg') no-repeat;
	background-size: cover;
	display: block;
	width: 100%;
	position: relative;
}
.y-tho .container{
	position: relative;
	padding: 30px 0 140px;
}
.y-tho h2{
	font-size: 80px;
	font-weight: 400;
	padding: 30px 0;
}
.y-tho ul{
	font-size: 42px;
	list-style-type: none;
	columns: 2;
    -webkit-columns: 2;
    -moz-columns: 2;
    max-width: 800px;
    position: relative;

}
.y-tho ul li{position: relative;padding: 15px 0 15px 80px;}
.y-tho ul li:before{
	content: '';
	height: 50px;
	width: 50px;
	background: url('imgs/check272727.png') no-repeat;
	background-size: contain;
	position: absolute;
	left: 0px;
	top:50%;
	transform: translateY(-50%);
}

@media(min-width: 821px){ /* fix safari on ipad/bigger screens so list items are balanced*/
	.y-tho ul li { display: inline-block; }
	.y-tho ul li:last-child:nth-child(2) { display: block;}
}

.y-tho ul:after{ /*doggo*/
	content: '';
	position: absolute;
	background: url('imgs/doggo.png') no-repeat 0px 0px;
	background-size: contain;
	bottom: -240px;
	left: -10px;
	height: 220px;
	width: 300px;
	/*animation-name: doggo;
	animation-duration: 1s;
	animation-iteration-count: infinite;
	animation-direction: alternate;*/
}
@keyframes doggo{0%{transform: rotate(-1deg);}100%{transform: rotate(1deg);}}
.y-tho .dizzy-drooloor{
	position: absolute;
	background: url('imgs/dizzy-drooloor.png') no-repeat 0px 180px;
	background-size: contain;
	bottom: 0;
	right: 10%;
	height: 800px;
	width: 580px;
}
@media(max-width:1800px){.y-tho .dizzy-drooloor{right: 8%;}}
@media(max-width:1700px){.y-tho .dizzy-drooloor{right: 6%;}}
@media(max-width:1600px){.y-tho .dizzy-drooloor{right: 0;}}
@media(max-width:1400px){
	.y-tho h2{font-size: 52px;}
	.y-tho ul{font-size: 36px;}
	.y-tho ul li{padding: 15px 0 15px 70px;}
	.y-tho ul li:before{height: 40px;width: 40px;}
	.y-tho .dizzy-drooloor{background-position: 50px 180px; height: 740px; width: 530px;}
}
@media(max-width:1300px){
	.y-tho .container{padding: 20px 0 120px}
	.y-tho h2{padding: 20px 0;}
	.y-tho ul{font-size: 30px; max-width: 600px;}
	.y-tho ul li{position: relative;padding: 15px 0 15px 60px;}
	.y-tho ul li:before{height: 30px;width: 30px;}
	.y-tho ul:after{ /*doggo*/ width: 250px;}
	.y-tho .dizzy-drooloor{background-position: 0px 180px; height: 670px; width: 460px;}
}
@media(max-width:1080px){
	.y-tho .container{padding: 20px 0 100px}
	.y-tho h2{font-size:42px;}
	.y-tho ul{font-size:28px;max-width: 520px;}
	.y-tho ul li{padding: 10px 0 10px 50px;}
	.y-tho ul:after{ /*doggo*/ width: 220px;height: 140px;bottom: -150px;}
	.y-tho .dizzy-drooloor{height: 590px; width: 380px;}
}
@media(max-width:980px){.y-tho .dizzy-drooloor{background-position: 50px 180px; }}
@media(max-width:900px){.y-tho .dizzy-drooloor{background-position: 100px 160px; height: 570px; width: 370px;}}
@media(max-width:820px){
	.y-tho h2{font-size: 36px;}
	.y-tho .container{padding: 20px 0 100px 10%;max-width: 80%;}
	.y-tho ul{columns: 1;-webkit-columns: 1;-moz-columns: 1;font-size: 24px;}
	.y-tho ul li{padding: 5px 0 5px 50px;}
	.y-tho .dizzy-drooloor{background-position: 0px 100px; height: 530px; width: 370px;}
}
@media(max-width:680px){
	.y-tho .container{padding: 20px 0 60px 5%;max-width: 85%;}
	.y-tho ul:after{ /*doggo*/ width: 180px;height: 110px;bottom: -115px;left:24px;}
	.y-tho .dizzy-drooloor{height: 480px; width: 300px;background-position: 0px 100px;}
}
@media(max-width:580px){
	.y-tho ul:after{ /*doggo*/ width: 180px;height: 110px;bottom: -115px;left:24px;}
	.y-tho .dizzy-drooloor{height: 480px; width: 300px;background-position: 70px 100px;}
}
@media(max-width:500px){.y-tho .container{padding: 20px 0 60px 0;max-width: 90%;}}
@media(max-width:470px){
	.y-tho .container{padding: 20px 0 60px 0;max-width: 90%;}
	.y-tho h2{padding: 10px 0;}
	.y-tho ul{font-size:20px;max-width: 320px;}
	.y-tho ul:after{ /*doggo*/ width: 140px;height: 90px;bottom: -95px;left:22px;}
	.y-tho .dizzy-drooloor{height: 410px; width: 245px;background-position: 55px 100px;}
}
@media(max-width:400px){.y-tho .dizzy-drooloor{height: 400px; width: 240px;background-position: 115px 100px;}}


/****Gallery preview****/
.gallery-preview{
	background: #fd9ffd url('imgs/bg-colors/white.jpg') no-repeat;
	background-size: cover;
	display: block;
	width: 100%;
}
.gallery-preview .container{
	padding: 30px 0 140px;
}
.gallery-preview h2{
	font-size: 80px;
	font-weight: 400;
	padding: 30px 0;
	text-align: right;
}
.gallery-preview ul.gallery {
	list-style-type: none;
	width: 102%;
	margin:0 -1%;
}
.gallery-preview ul.gallery li{
	float: left;
	width: 18%;
	padding: 10px 1%;
}
.gallery-preview ul.gallery li img{
	max-width: 100%;
}
@media(max-width:1400px){.gallery-preview h2{font-size: 52px;} .gallery-preview .container{padding: 30px 0 110px;}}
@media(max-width:1080px){.gallery-preview h2{font-size: 42px;} .gallery-preview .container{padding: 30px 0 70px;}}
@media(max-width:820px){
	.gallery-preview .container{padding: 30px 0 40px;}
	.gallery-preview h2{font-size: 36px; text-align: center;}
	.gallery-preview ul.gallery li{
		float: left;
		width: 46%;
		padding: 10px 2%;
	}
}

/****Special thanks****/
.special-thanks{
	background: #fed85c url('imgs/bg-colors/yellow.jpg') no-repeat;
	background-size: cover;
	display: block;
	width: 100%;
}
.special-thanks .container{
	padding: 30px 0 100px;
}
.special-thanks h2{
	font-size: 80px;
	font-weight: 400;
	padding: 30px 0 20px;
}
.special-thanks p{
	font-size: 42px;
	font-family: Quicksand, sans-serif;
	font-weight: 300;
	max-width: 1150px;
	margin: 0 0 20px 0;
}
.special-thanks p.click{font-family: Pangolin, sans-serif;}

.special-thanks .t-shirts{
	width: 1040px;
	max-width: 100%;
	margin:0 auto;
}
.special-thanks a{
	width: 520px;
	height: 420px;
	max-width: 50%; 
	display: block;
	position: relative;
	float: left;
}

a.baecafe-shirt{
	background: url('imgs/baecafe-shirt.png') no-repeat;
	background-size: contain;
	top:30px;
}
a.uwucrew-shirt{
	background: url('imgs/uwu-shirt.png') no-repeat;
	background-size: contain;
	top:-60px;
}

@media(max-width:1400px){
	.special-thanks h2{font-size: 52px;} 
	.special-thanks .container{padding: 30px 0 110px;}
	.special-thanks p{font-size: 32px; max-width: 920px;}
}
@media(max-width:1080px){
	.special-thanks h2{font-size: 42px;} 
	.special-thanks .container{padding: 30px 0 70px;}
	.special-thanks p{font-size: 28px; max-width: 820px;}
	.special-thanks .t-shirts{margin-top: 50px;}
	.special-thanks a{height: 360px;}

}
@media(max-width:820px){
	.special-thanks .container{padding: 30px 0 40px;}
	.special-thanks h2{font-size: 36px; text-align: center;}
	.special-thanks p{font-size: 24px; max-width: initial;text-align: center;margin:0 5% 20px;}
	.special-thanks p.click{font-size: 22px;}
	.special-thanks .t-shirts{margin-top: 80px;}
	.special-thanks a{height: 280px;}

}
@media(max-width:500px){
	.special-thanks p{margin:0 3% 20px;}
	.special-thanks a{height: 140px;}
}


/****footer****/

.footer{
	background: #333 url('imgs/bg-colors/black.jpg') no-repeat;
	background-size: cover;
	display: block;
	width: 100%;
	text-align: center;
	padding: 30px 0;
}
.footer p{
	font-size: 18px;
    color: #eee;
    font-family: Quicksand, sans-serif;
    font-weight: 300;
}
.footer p a{color: #eee;}

@media(max-width:820px){
	.footer p{font-size: 14px;}
}


/****WALLET FORM****/
#walletForm{
	display: none;
	width: 900px;
	max-width: 100%;
	height: 600px;
	position: fixed;
	z-index: 9;
	top:50%;
	left:50%;
	transform: translate(-50%,-50%);
	background: #fd9ffd url('imgs/bg-colors/white.jpg') no-repeat;
	background-size: cover;
	padding: 40px;
}
#walletForm.show{display: block;} 
#walletForm span.form-h3{
	font-size: 60px;
	position: relative;
	top:-10px;
	display: block;
}
#walletForm span.close{
	position: absolute;
	top:40px;right: 40px;
	height:40px;width: 30px;
	background: url('imgs/x-close.png') no-repeat;
	background-size: contain;
	cursor: pointer;
}
#walletForm .lside{
	font-weight: 400;
	float: left;
	line-height: 1;
}
#walletForm p{
	font-family: Quicksand, sans-serif;
	font-weight: 300;
	font-size: 24px;
	max-width:400px;
	padding: 10px 0 20px;
}

#walletForm .froggo{
	width: 378px;
	height: 378px;
	background: url('imgs/wen-happy-waifu-froggo.png') no-repeat;
	background-size: contain;
	position: absolute;
	bottom: 0;
	left: 40px;
	z-index: -1;
}
#walletForm form{
	float: left;
	max-width:400px;
	font-size: 32px;
	padding: 0 0 0 7%;
	position: relative;
	top:-30px;
}
#walletForm form a{
	color: #3C9BD8;
}
#walletForm form input[type="text"],
#walletForm form input[type="email"]{
	width: 280px;
	height: 45px;
	padding: 4px 10px 2px;
	margin: 8px 0 5px;
	font-size: 24px;
	border: 5px solid #272727;
	border-radius: 5px;
}
#walletForm form input::placeholder{
	color: #a2a2a2;
}
#walletForm form ol li span.note{font-size: 18px;display: block;}
#walletForm form ol li span.note span.red{color: #BB3B3B;}

#walletForm form ol li{
	margin: 0 0 30px 0; 
	position: relative;
}
#walletForm form input[type="submit"],
#walletForm form div.btn{
	color: #fff;
	background: #E096C7;
	border: 5px solid #FFFFFF;
	border-radius: 5px;
	font-size: 42px;
	padding:8px 30px 5px; 
	cursor: pointer;
	-webkit-appearance: none;
}

#walletForm form span.m{
	position: absolute;
	top: 50%;right: 50px;
	transform: translateY(-50%);
}

#walletForm li:nth-of-type(3) span.m{top: 56%}
#walletForm li:nth-of-type(4) span.m{top: 68%}

#walletForm form span.success{
	width: 30px;
	height: 30px;
	right: 45px;
	background: url('imgs/check-green.png') no-repeat;
	background-size: contain;
}
#walletForm form span.fail{
	width: 18px;
	height: 24px;
	background: url('imgs/x-red.png') no-repeat;
	background-size: contain;
}
#walletForm .submit-message{
	font-size: 24px;
    width: 195px;
    position: absolute;
    bottom: 10px;
    right: 0px;
}
#walletForm .message-success{
    color: #66AD71;
}
#walletForm .message-fail{
    color: #BB3B3B;
}
#overlay{
	display: none;
	backdrop-filter: blur(8px);
	position: fixed;
	z-index: 3;
	top: -100%;left: -100%;bottom: -100%;right: -100%;
	animation-name: bgcolorparty2;
	animation-duration: 2.4s;
	animation-iteration-count: infinite;
	animation-direction: normal;
}
@keyframes bgcolorparty2 {
	0%    {		background: rgba(253, 162, 253, .5);	} /*pink*/
	15%   {		background: rgba(253, 162, 253, .5);	} /*pink*/
	20%   {		background: rgba(135, 217, 124, .5);	} /*green*/
	35%   {		background: rgba(135, 217, 124, .5);	} /*green*/
	40%   {		background: rgba(254, 217, 93, .5);	    } /*yellow*/
	55%   {		background: rgba(254, 217, 93, .5);	    } /*yellow*/
	60%   {		background: rgba(170, 131, 219, .5);	} /*purple*/
	75%   {		background: rgba(170, 131, 219, .5);	} /*purple*/	
	80%   {		background: rgba(61, 215, 187, .5);	    } /*turquoise*/
	95%   {		background: rgba(61, 215, 187, .5);		} /*turquoise*/
	100%  {		background: rgba(253, 162, 253, .5);	} /*pink*/
}
#overlay .washout{
	position: absolute;
	top: 0;left: 0;bottom: 0;right: 0;
	background: rgba(100,100,100,.5);
}
#overlay.show{
	display: block;
}

@media(max-width:1080px){
	#walletForm{width: 580px;height: 400px;padding: 30px;}
	#walletForm span.form-h3{font-size: 42px;}
	#walletForm p{font-size: 20px;max-width: 220px;padding: 5px 0 20px;}
	#walletForm form {max-width: 240px; padding: 0 0 0 10%;top:-38px;}
	#walletForm form ol li{ margin: 0 0 15px 0;}
	#walletForm ol{font-size: 24px;}
	#walletForm .froggo{width: 200px;height: 200px;} 
	#walletForm .submit-message{font-size: 16px; width: 152px; right: -70px;}

	#walletForm form input[type="text"],
	#walletForm form input[type="email"]{width: 200px;height:35px;font-size: 20px;}
	#walletForm form input[type="submit"]{font-size: 28px; padding: 8px 25px 5px;}  
	#walletForm form ol li span.note { font-size: 16px;}
	#walletForm form span.m{right: -20px;}
	#walletForm form span.success{width:22px;height:22px;right: -25px;}
	#walletForm form span.fail{width:15px;height:18px;}
	#walletForm span.close{top: 20px;right: 20px;height: 30px;width: 20px;}
}
@media(max-width:700px){
/*	#walletForm{width: 280px;height: 500px;padding: 15px;}*/
/*	#walletForm span.form-h3{font-size: 30px;top:-5px}*/
	#walletForm p{font-size: 14px;max-width: 290px;padding: 0 0 5px;}
	#walletForm form {max-width: 290px; padding: 0 0 0 10%;top:10px;}
	#walletForm ol{font-size: 16px;}
	#walletForm form ol li{ margin: 0 0 5px 0;}
	#walletForm span.close{top: 13px;right: 13px;height: 20px;width: 15px;}
	#walletForm .submit-message{width: 145px; right: initial; left: 30px; bottom: -50px;}

 
	#walletForm form input[type="text"],
	#walletForm form input[type="email"]{width: 190px;font-size: 16px;}
	#walletForm form input[type="submit"]{font-size: 24px;padding: 8px 20px 5px;}
	#walletForm form ol li span.note { font-size: 13px;}
/*	#walletForm .froggo{width: 160px;height: 160px; right: -10px; left: auto;} */
	#walletForm form span.m{right: 5px;}
	#walletForm form span.success{right: 0px;} 
 

}


/** WALLET CHECKER PAGE for Phase 2 allowlist **/
.wallet-checker-form h1{
	font-size:48px;
}
.wallet-checker-form span{
	font-size: 32px;
}
.wallet-checker-form p.use{
	color: #fff;
	font-size: 24px;
	font-family: Quicksand, sans-serif;
	max-width: 80vw;
	width: 600px;
	padding: 30px 0;
}
.wallet-checker-form{
	text-align: center;
	min-height: calc(100vh - 300px);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	padding-bottom: 250px;
	background: url('imgs/dizzy-drooloor.png') no-repeat center bottom;
	background-size: 230px;
}
.wallet-checker-form input[type="text"]{
	width: 320px;
	max-width: 80vw;
	height: 45px;
	padding: 4px 10px 2px;
	margin: 0 0 20px 0;
	font-size: 24px;
	border: 5px solid #272727;
	border-radius: 5px;
}
.wallet-checker-form input[type="submit"]{
	color: #fff;
	background: #E096C7;
	border: 5px solid #FFFFFF;
	border-radius: 5px;
	font-size: 28px;
	padding:8px 30px 5px; 
	cursor: pointer;
	-webkit-appearance: none;
}
.wallet-checker-form h2{
	font-size: 24px;
	position: relative;
    background: #eee url(imgs/bg-colors/white.jpg) no-repeat;
    background-size: cover;
    padding: 40px 40px 40px 80px;
}
.wallet-checker-form h2:before{
	content: '';
    position: absolute;
    width: 30px;
    height: 30px;
    left: 35px;
    top:50%;
	transform: translateY(-50%);
}
.wallet-checker-form h2.found:before{
    background: url(imgs/check-green.png) no-repeat;
    background-size: contain;
}
.wallet-checker-form h2.not-found:before{
    background: url(imgs/x-red.png) no-repeat;
    background-size: contain;
}
@media(max-width:800px){
	.wallet-checker-form h2{font-size: 20px;max-width: 240px;}
	.banner .wallet-checker-form h1{font-size:32px;}
	.banner .wallet-checker-form p.use{font-size:20px;}
	.banner .wallet-checker-form span{font-size: 24px;}
}



/**404 page **/

.page-404{
	text-align: center;
	min-height: calc(100vh - 360px);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	padding-bottom: 300px;
	background: url('imgs/dizzy-drooloor.png') no-repeat center bottom;
	background-size: 300px;
}
.page-404 h1{
	font-size: 60px;
}
.page-404 p{
	font-size: 24px;
	color: #fff;
	padding-top: 30px;
}
.page-404 p a{
	font-size: 24px;
	color: #2f566e;
}
@media(max-width:800px){.page-404{background-size: 220px;}.page-404 h1{font-size: 42px;}}


/* mint popup */
#walletForm.mint{
	max-width: 900px;
	width: calc(90vw - 40px);
    min-height: 315px;
    height: initial;
}
	#walletForm.mint .froggo{
		width: 300px;
		height: 300px;
	}
	#walletForm.mint span.form-h3{
		top: initial;
		text-align: center;
	}
	#walletForm.mint span.form-h3.go-left{
		text-align: left;
	}
	
	.mint-box{
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		width: 100%;
		height: 100%;
		margin-top: 25px;
		text-align: center;
	}
		#walletForm.mint .mint-box form.connect-box{
			display: none;
			padding: 0;
		}
			#walletForm.mint .mint-box a.connect,
			#walletForm form div.btn{
				display: inline-block;
				color: #fff;
				background: #E096C7;
				border: 5px solid #FFFFFF;
				border-radius: 5px;
				font-size: 40px;
				padding:8px 10px 5px; 
				cursor: pointer;
				-webkit-appearance: none;
				text-decoration: none;
			}
			#walletForm form div.btn.disabled{
				background-color: #e3e3e3;
				cursor: initial;
				pointer-events: none;
			}

		.mint-box iframe{
			width: 100%;
			height: 97%;
			border: none;
		}

		#walletForm.mint .mint-box form{
			top: 0;
			box-sizing: border-box;
		}
			#walletForm form.mint-form{
				display: none;
				max-width: 250px;
				padding: 0;
			}
				#walletForm form.mint-form .supply{
					display: inline-block;
					margin-bottom: 10px;
				}
				#walletForm form.mint-form .mint-fields{
					max-width: 100%;
					width: 180px;
					margin: 0 auto;
					box-sizing: border-box;
				}
					#walletForm form.mint-form .mint-fields input,
					#walletForm form.mint-form .mint-fields div.btn{
						display: inline-block;
						width: 100%;
						box-sizing: border-box;
					}
				#walletForm form.mint-form input[type=submit]{
					width: 100%;
				}
				#walletForm.mint .mint-box form input[type=number]{
					display: inline-block;
					width: 100%;
					margin-bottom: 15px;
					padding: 0 10px;
					font-size: 48px;
					border: 5px solid #272727;
					background: #FFF;
					appearance: none;
					-webkit-appearance: none;
					box-sizing: border-box;
					border-radius: 3px;
				}
				input[type=number]::-webkit-inner-spin-button, 
				input[type=number]::-webkit-outer-spin-button {  
					opacity: 1;
				}

		#walletForm.mint .mint-box .response{
			display: none;
			width: 350px;
			max-width: 100%;
		}
			#walletForm.mint .mint-box .response span{
				display: inline-block;
				width: 100%;
				font-size: 32px;
				line-height: 1.25;
			}
				#walletForm.mint .mint-box .response .success,
				#walletForm.mint .mint-box .response .fail,
				#walletForm.mint .mint-box .response .full,
				#walletForm.mint .mint-box .response .minting{
					display: none;
					font-size: 42px;
				}
				.mint-text-spinny{
					animation-name: spin;
					animation-duration: 5000ms;
					animation-iteration-count: infinite;
					animation-timing-function: linear; 
				}
				@keyframes spin {
					from {
						transform:rotate(0deg);
					}
					to {
						transform:rotate(360deg);
					}
				}
					#walletForm.mint .mint-box .response .green{ color: #66AD71; }
					#walletForm.mint .mint-box .response .red{ color: #BB3B3B; }

				a.success-link {
				    font-size: 24px;
				    padding: 10px 10px;
				    border: 5px solid #ffffff;
				    border-radius: 5px;
				    color: #fff;
				    background: #E096C7;
				    text-decoration: none;
				}

@media(max-width: 940px){
	#walletForm.mint .froggo{
		left: 0;
	}
}
@media(max-width: 850px){
	#walletForm.mint .froggo{
		width: 250px;
		height: 250px;
		right: -10px;
		left: auto;
	}
}
@media(max-width: 768px){

	#walletForm.mint .froggo{
		width: 160px;
		height: 160px;
		right: -10px;
		left: auto;
	}
}
@media(max-width: 575px){

	#walletForm.mint{
		padding-bottom: 150px;
	}

	#walletForm.mint .froggo{
		width: 160px;
		height: 160px;
		right: initial;
		left: calc(50% - 80px);
	}
	.mint-box{
		max-width: 100%;
	}
}



#walletForm.schedule{
	height: 500px;
	padding: 40px 40px 30px;
}
	#walletForm.schedule span.form-h3{
		line-height: 1;
	}
	#walletForm.schedule .froggo{
		left: 0;
	}
	.schedule-box{
		max-width: 50%;
/*		width: 300px;*/
		margin: 0 0 0 auto;
		font-size: 32px;
	}
		.schedule .phase{
			display: inline-block;
			width: 100%;
		    padding-bottom: 20px;
		}
		.schedule .phase:last-child{
			padding-bottom: 0;
		}
		.phase-title{
			display: inline-block;
			width: 100%;
			font-size: 25px;
		}
		.phase-date{
			display: inline-block;
			width: 100%;
			font-size: 30px;
		}
		.clock{
		    font-size: 16px;
		    color: #606060;
		}
			.clock span{
				font-size: 16px;
			    color: #606060;
			}

@media(max-width: 1080px){
	#walletForm.schedule{
		height: initial;
		width: calc(90vw - 80px);
	}
		#walletForm.schedule .froggo{
			width: 300px;
			height: 300px;
		}
		#walletForm .lside p{
			max-width: initial;
		}

}
@media(max-width: 700px){
	#walletForm.schedule{
		padding: 30px 15px 150px;
		width: calc(95vw - 30px);
	}
		#walletForm.schedule span.form-h3{
			text-align: center;
		}
		#walletForm .lside{
			width: 100%;
		}
			#walletForm .lside p{
				width: 100%;
				text-align: center;
				font-size: 20px;
			}
		.schedule-box{
			max-width: initial;
			width: 270px;
			margin: 0 auto;
		}
		#walletForm.schedule .froggo{
			width: 150px;
			height: 150px;
			left: calc(50% - 75px);
		}
}
@media(max-width: 424px){
	.phase-date{
		font-size: 26px;
	}
}


/* GALLERY */

.main.gallery{
	background: #eee url('imgs/bg-colors/white.jpg') no-repeat;
	background-size: cover;
		margin-top: -135px;
	padding-top: 135px;
}
.main.gallery > .container{position: relative;}
.main.gallery h1{
	padding: 100px 0 0;
	font-size: 80px;
	font-weight: 400;
}
.main.gallery h2{display: none;}
.close-modal-filters{display: none;}
.section.gallery{
	display: inline-block;
	width: 100%;
	margin: 30px 0;
}

.search-box{
	display: flex;
	flex-direction: row;
	justify-content: flex-end;
}
	.search-box form[name=search-nfts]{
		display: flex;
		flex-direction: row;
	}
		.search-box form[name=search-nfts] input{
			display: flex;
			flex-direction: column;
			font-size: 16px;
	    border: 2px solid #272727;
	    padding: 3px 10px 3px;
	    border-radius: 5px 0 0 5px;
	    box-sizing: border-box;
		}
		.search-box form[name=search-nfts] button{
			display: flex;
			flex-direction: column;
			font-size: 16px;
	    padding: 3px 10px 3px;
	    border: 2px solid #ffffff;
	    border-radius: 0 5px 5px 0;
	    color: #fff;
	    background: #E096C7;
	    text-decoration: none;
	    position: relative;
	    height: initial;
	    width: initial;
	    text-transform: lowercase;
	    cursor: pointer;
	    font-weight: 400;
		}
.gallery-filters{
		display: inline-block;
    float: left;
    width: 13%;
    margin-top: 1.2%;
    padding: 0 10% 0 0;
}
	.gallery-filters .filters-btn-box{
		display: inline-block;
		width: 100%;
		float: left;
		text-align: center;
	}
	.clear-filters.btn{
/*			padding: 5px 15px;*/
			font-size: 18px;
			cursor: pointer;
			display: inline-block;
			margin-top: 15px;
		}
		.gallery-results{
			font-size: 18px;
			float: right;
			margin-right:2%;
			margin-top: 15px;

		}
	.selected-filters{
		display: inline-block;
		width: 100%;
		min-height: 50px;
		float: left;
		margin: 0 -5px;
	}
		.selected-filters .show-filter{
			position: relative;
			display: none;
			float: left;
			margin: 5px;
			font-size: 16px;
			line-height: 1;
			border: 1px solid #e3e3e3;
			background: #dedede;
   	 	padding: 10px 26px 10px 10px;
    	border-radius: 3px;
		}
		.selected-filters .show-filter.selected{ display: inline-block; }
		.selected-filters .show-filter .show-filter-close{
			position: absolute;
			top: 45%;
			transform: translateY(-50%);
			right: 5px;
			display: inline-block;
			width: 12px;
			height: 12px;
			padding: 2px;
			color: #cd2b36;;
			font-style: normal;  
			border-radius: 50%;
			cursor: pointer;
			transition: all .2s;
		}
		.selected-filters .show-filter .show-filter-close:hover{ opacity:.7; }
	.gallery-filters .filters-inner{
		display: inline-block;
		width: 100%;
	}
	.gallery-filters .filter{
		display: inline-block;
		width: 100%;
		float: left;
	}
	.gallery-filters	.filter:last-of-type { /*hide the bio filter from menu*/
    display: none;
}
		.gallery-filters .filter .name{
			position: relative;
			display: inline-block;
			width: 100%;
			padding-right: 30px;
			font-size: 30px;
			cursor: pointer;
			text-transform: lowercase;
		}
		.gallery-filters .filter span.name:after {
	    content: '+';
	    position: absolute;
	    right: 0;
		}
		.gallery-filters .filter span.name.open:after {
			content: "–";	
		}

		.gallery-filters .filter .dropdown-box{
			display: none;
		/*max-height: 175px;*/
		/*overflow-x:hidden;*/
		/*overflow-y:auto;*/

			padding: 10px 0;
		}

		

			.gallery-filters .filter ul.attributes{
				padding-left: 25px;
				list-style-type: none;
			}
				.gallery-filters .filter ul.attributes li{
					position: relative;
					padding: 4px 0 4px 3px;
					font-size: 18px;
					line-height: 1.4;
					cursor: pointer;
					text-transform: lowercase;
				}
				.gallery-filters .filter ul.attributes li i{
					position: absolute;
					top: calc(50% - 10px);
					left: -25px;
					height: 16px;
					width: 16px;
					border:2px solid #272727;
					background: #fff;
					border-radius: 3px;
				}
				.gallery-filters .filter ul.attributes li.selected i:after{
					content: '';
					position: absolute;
					top:0;right: 0;bottom: 0;left: 0;
					background: url('imgs/check272727.png') no-repeat;
					background-size: contain;
				}


.section.gallery .pagination{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	width: 100%;
	margin-top: 30px;
	justify-content: space-between;
}
	.section.gallery .pagination .pagi,
	.section.gallery .seperator{
		display: none;
		float: left;
		margin: 0;
		padding: 5px 2%;
		font-size: 32px;
		cursor: pointer;
/*		transition: all .2s;*/
	}
	.section.gallery .pagination .pagi.prev,
	.section.gallery .pagination .pagi.next{ display: inline-block; }

	.section.gallery .pagination .pagi:hover{ opacity: .7; }
	.section.gallery .pagination .pagi.selected{ opacity: 0; cursor: initial; }
	.section.gallery .pagination .pagi.hidden{ display:none; }
.gallery-right{
	float: left;
	width: 77%;
}
.nft-gallery{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
/*	width: 75%;*/
	transition: all .2s;
}
	.nft-gallery .nft{
		display: none;
		flex-direction: column;
		width: 21%;
		padding:2%;
	}
	.nft-gallery .nft.show{ display: flex; }
	.nft-gallery .nft .image{
		position: relative;
		width: 100%;
		height: 0;
		padding-bottom: 100%;
		background-size: contain;
		background-position: center;
		background-repeat: no-repeat;
	}
		.nft-gallery .nft .image a{
			position: absolute;
			top: 0;
			left: 0;
			display: inline-block;
			width: 100%;
			height: 100%;
		}
	.nft-gallery .nft .image.lazy{ background-image: none!important; }

	.nft-gallery .nft .data{
		position: fixed;
		top: 50%;right: 50%;bottom: 50%;left: 50%;
		transform: translate(-50%,-50%);
		max-height: 95vh;
		height: 450px;
		width: 900px;
		z-index: 4;
		display: none;
		background: #fd9ffd url('imgs/bg-colors/white.jpg') no-repeat;
	background-size: cover;
	}
	.nft-gallery .nft .data .nft-big-img{
		width: 450px;
		height: 450px;
		float: left;
		background-size: contain;
	}


	.nft-gallery .nft .data .data-right{
		display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
	}


	.nft-gallery .nft .data .data-right .attribute .twitter{
    background: url(imgs/twitter.png) no-repeat;
    background-size: contain;
    height: 20px;
    width: 20px;
    margin: 5px 0;
    display: block;
	}
	.nft-gallery .nft .data .data-right .attribute .artist-site{
    background: url(imgs/site.png) no-repeat;
    background-size: contain;
    height: 20px;
    width: 20px;
    margin: 5px 0;
    display: block;
	}
	.data-right .att-stat{
		display: flex;
		flex-direction: column;
		overflow-y: auto;
	}

	.name-status-box{
		margin: 0 20px;
	}

	.data-right .uglystatus,
	.data-right .uglyhandle{
		margin: 0 20px;
		line-height: 30px;
	}
	.data-right .edit-status,
	.data-right .submit-status,
	.data-right .tweet a{
    color: #457fa3;
    text-decoration: underline;
    font-size: 14px;
    cursor: pointer;
	}
	.data-right .edit-status,
	.data-right .submit-status{ margin-right: 5px; }
	.data-right .tweet{ margin-left: 5px; }

	.name-status-box span:first-child{ margin-left: 0; }


	.new-status,
	.new-handle{
		margin: 0 20px;
	}
	.new-status input,
	.new-handle input{
		padding: 5px;
    border-radius: 4px;
    max-width: 100%;
	}
	.data-right .uglystatus:before,
	.data-right .new-status:before{
		content: 'Status: ';
	}
	.data-right .uglyhandle:before,
	.data-right .new-handle:before{
		content: 'Name: ';
	}
	.nft-gallery .nft .data .name{
		float: left;
    font-size: 32px;
    margin: 20px;
    display: block;
	}

		.nft-gallery .nft .data .attributes{
			float: left;
	    font-size: 16px;
	    margin: 0px 20px 20px;

		}
			.nft-gallery .nft .data .attributes .attribute{
				display: block;
				margin-bottom: 3px;
			}

				.nft-gallery .nft .data .link-btn a.link-opensea{
					font-size: 20px;
				    padding: 10px 10px;
				    border: 5px solid #ffffff;
				    border-radius: 5px;
				    color: #fff;
				    background: #E096C7;
				    text-decoration: none;
				    margin: 20px;
				    display: inline-block;
				}
	.mobile-filter-button{
		display: none;
	}
	.nft-gallery.nft-table .nft.show .image{
		cursor: pointer;
	}


@media(max-width:960px){
	.nft-gallery .nft .data{
		width: 800px;
	}
}
@media(max-width:850px){
	.nft-gallery .nft .data{
		width: 300px;
		height: 600px;
	}
	.nft-gallery .nft .data .nft-big-img{
		width: 300px;
		height: 300px;
	}
	.nft-gallery .nft .data .data-right{
		float: left;
		height: 300px;
    width: 100%;
	}
	.nft-gallery .nft .data .name{font-size: 24px;}
	.nft-gallery .nft .data .attributes{font-size: 16px;}
	.data-right .att-stat{margin: 0 15px 0 0;}
	.data-right .link-btn{text-align: center;}
}



	.modal-filter-bg,
	.modal-nft-bg{
		backdrop-filter: blur(8px);
  	top: 0;right: 0;bottom: 0;left: 0;
  	background: rgba(255,255,255,0.65);
  	z-index: 3;
		position: fixed;
		display: none;
	}
	.modal-filter-bg{
  	background: rgba(255,255,255,0.85);
	}

	.close-modal-nft-data{
		font-size: 54px;
		cursor: pointer;
		position: absolute;
    right: 20px;
    top: 5px;
	}



@media(max-width:820px){
	.nft-gallery .nft{width: 29.3%;}
	.gallery-right{width: 100%;}
	.main.gallery h1{font-size: 60px;}

	.mobile-filter-button{
		display: block;
		background: url('imgs/filter.png') no-repeat;
		background-size: contain;
		height: 40px;
		width: 40px;
		cursor: pointer;
		position: absolute;
		right: 0;
		top: 124px;
	}

	.gallery-filters,
	.selected-filters,
	.filters-btn-box,
	.main.gallery h2,
	.close-modal-filters{
  	z-index: 3;
		position: fixed;
		display: none;
	}

	.selected-filters{
		top: 70px;right: 20px;left: 20px;
		width: auto;
		overflow-y: auto;
    height: 100px;
    margin: 0 0 0 -5px;
	}
	.filters-btn-box{
		top: 165px;right: 20px;left: 20px;
	}
	.gallery-results{
		margin-right: 0;
	}
	.gallery-filters{
		top: 210px;
    left: 20px;
    right: 20px;
    bottom: 20px;
    overflow-y: auto;
    width: auto;
	}
	.gallery-filters .filter .name{
		font-size: 24px;
	}
	.main.gallery h2{
    top: 20px;
    left: 20px;
    font-size: 30px;
	}
	.close-modal-filters{
		font-size: 36px;
		top:10px;right: 20px;
	}



}

/*COMMUNITY ART*/

.side-97 {
	float: left;
	padding-top: 200px;
	font-size: 25px;
	text-align: left;
	line-height: 50px;

}

.page-id-97 {
	background-image: url(imgs/wen-happy-waifu-froggo.png);
	background-repeat: no-repeat;
	background-position: 0px bottom;
  background-size: 460px;

}

.cm-gallery-box {
	padding: 10px 2px 15px 15px;
}

.cm-gallery-box1 {
	padding: 40px 5px 15px 15px;
}

.cm-gallery-box4 {
	padding: 5px 5px 30px 15px;
}

.box97 {
	margin-left: 417px;
}

.cm-items {
  margin: 5px;
  border: 1px solid #ccc;
  align-self: left;
  width: 22%;
  display: inline-block;
  }

.cm-items:hover {
  border: 1px solid #777;
}

.cm-items img {
  width: 100%;
  height: auto;
}

.desc {
  padding: 5px;
  text-align: center;
}

.next-button-container {
	
	padding: 10px 5px 40px 15px;
	margin-left: 60%;

}

#next-button{
	min-width: 80px;
	height: 30px	;
	border: none;
	font-size: 20px;
}

#next-button:hover {
	border: solid lightpink;
	border-radius: 10px;

}

.hidden-side {
	display: none;
}

@media(max-width:1100px){
	.box97 {margin-left: 417px;}
	.cm-items {width: 22%;}
	.next-button-container {margin-left: 67%;}
	.side-97 {padding-top: 100px;}
}

@media(max-width:1023px){
	.box97 {margin-left: 5%;}
	.cm-items {width: 45%;}
	.next-button-container {margin-left: 44%;}
	.side-97 {display: none;}
	.hidden-side 
	{display: block;
		padding-top: 1%;
	font-size: 25px;
	text-align: center;
	line-height: 50px;
margin-top: 1px;
}
	
	.page-id-97 {background-position: center bottom;
		background-size: 392px;
	}
	.hidden-side-parag {
		padding-bottom: 400px;

	}
}


	/* .side-97 {display: none;}
	.hidden-side 
	{padding-top: 200px;
	font-size: 25px;
	text-align: left;
	line-height: 50px;}
	} */
	
/* CONTACT */

.main.contact{
	background: #eee url('imgs/bg-colors/white.jpg') no-repeat;
	background-size: cover;
		margin-top: -135px;
	padding-top: 135px;
}
.main.contact > .container{
	position: relative;
	background: url('imgs/contact-froggo.png') no-repeat;
	background-position: 0px bottom;
	background-size: 460px;
}
.main.contact h1{
	padding: 100px 0 0;
	font-size: 80px;
	font-weight: 400;
}
.section.contact{
	display: inline-block;
	width: 100%;
	margin: 30px 0;
}
.section.contact .left {
	float: left;
	width: 50%;
  padding: 0 0px 30px 0px;
  box-sizing: border-box;
}
.section.contact .left p{
	font-size: 32px;
  padding-bottom: 20px;
}
.section.contact .left p.small-p{font-size: 24px;}
a.contact-email{
	padding-left: 30px;
	position: relative;
	line-height: 36px;
	color: #457fa3;
}

a.contact-email:before{
	content:'';
	height: 24px;
	width: 24px;
	position: absolute;
	left: 0;
	top:50%;
	transform: translateY(-50%);
	background: url('imgs/mail.png') no-repeat;
	background-size: contain;
}

.section.contact form{
	float:left;
	width: 50%;
}
.section.contact form ::placeholder{
		font-size: 24px;
		color: #a1a1a1;
}
.section.contact form input,textarea{
	font-size: 24px;
	width: 100%;
	border: 5px solid #272727;
	padding: 15px 20px 10px;
	border-radius: 5px;
	margin-bottom: 30px;
	height: 60px;
	box-sizing: border-box;
}
.section.contact form textarea{
	height: 350px;
	padding-top: 20px;
}
.section.contact form input[type="submit"]{
		font-size: 30px;
    padding: 15px 50px 10px;
    border: 5px solid #ffffff;
    border-radius: 5px;
    color: #fff;
    background: #E096C7;
    text-decoration: none;
    position: relative;
		display: inline-block;
		height: initial;
		width: initial;
		text-transform: lowercase;
		cursor: pointer;
		font-weight: 400;
}
.section.contact form input[type="submit"]:hover{
	animation-name: bgcolorparty;
	animation-duration: 1.2s;
	animation-iteration-count: infinite;
	animation-direction: normal;
}

.contact span.wpcf7-not-valid-tip{
    color: #BB3B3B;
    margin-top: -20px;
    padding-bottom: 20px;
    font-size: 18px;
}

.contact .wpcf7 form.invalid .wpcf7-response-output, 
.contact .wpcf7 form.unaccepted .wpcf7-response-output, 
.contact .wpcf7 form.payment-required .wpcf7-response-output,
.contact .wpcf7 form.sent .wpcf7-response-output{
	padding: 0px 30px 0px 40px;
  border:none;
  background: none;
  margin: 0 0 30px;
  font-size: 18px;
  color: #BB3B3B;
  position: relative;
}
.contact .wpcf7 form.sent .wpcf7-response-output{
  color: #66AD71;
}
.contact .wpcf7 form.invalid .wpcf7-response-output:after,
.contact .wpcf7 form.unaccepted .wpcf7-response-output:after,
.contact .wpcf7 form.payment-required .wpcf7-response-output:after{
	content: '';
	position: absolute;
	left: 5px;
	top:50%;
	transform: translateY(-50%);
	width: 18px;
	height: 24px;
	background: url('imgs/x-red.png') no-repeat;
	background-size: contain;
}
.contact .wpcf7 form.sent .wpcf7-response-output:after{
	content: '';
	position: absolute;
	left: 0px;
	top:50%;
	transform: translateY(-50%);
	width: 30px;
	height: 30px;
	background: url('imgs/check-green.png') no-repeat;
	background-size: contain;
}

@media(max-width:1220px){
	.section.contact .left p{ font-size: 30px; }
	.section.contact .left p.small-p{ font-size:20px; }
}
@media(max-width:1140px){
	.main.contact > .container{
		background-position: center bottom;
		background-size: 300px;
	}
 	.section.contact{
		margin-bottom: 320px;
	}
	.section.contact .left{
		float:none;
		margin:0 auto;
		width: 100%;
	}
	.section.contact form{
		float: none;
		margin:0 auto;
		width: 100%;
	}

}

@media(max-width:580px){
	.section.contact .left p{ font-size: 24px; }
}