@import 'https://fonts.googleapis.com/css?family=Roboto:300,400,700';

@media screen {
	body {background:#4d0737; width:100%; padding:0; margin:0; font-family: 'Roboto', sans-serif; font-family:1em; color:#fff; font-weight:300; line-height:1.2; position:relative;}
	.row {position:relative;}
	.column {position:relative;}
	p {line-height:1.2; margin:0;}
	
	header {background:#4d0737; position:relative; padding:0; margin:0; width:100%; z-index:1;}
	footer {background:#4d0737; position:relative; padding:40px 0; margin:0;}
	
	.content {position:relative; padding:0; margin:0;}
	.visual {background-repeat: no-repeat; background-position: center 80px; background-image:url(../images/custom/visual-top.jpg); background-size:100% auto;  background-attachment:fixed; background-color:#020313;}
	.visual::before {background: rgba(0,0,130,0.15); content:''; width: 100%; height: 100%; position: absolute; left:0; top:0; box-shadow: 0 0 100px rgba(0,0,0,0.8) inset;}
	.logo {padding:5px 0 0;}
	.logo img {max-width:300px;}
	.slogan {color:#fff; padding:45px 0 0 0px; font-size:20px; margin:0; text-transform: uppercase; font-family: 'Roboto';}
	
	.sign-in {position:absolute; right:16px; bottom:-2px;}
	.link-login {color:#fff; display:block; border-radius:6px; -moz-border-radius:6px; -webkit-border-radius:6px; -o-border-radius:6px; font-family: 'Roboto', sans-serif; font-weight:300; font-size:16px; line-height:38px; padding:0 25px; text-transform: uppercase;} 
	.link-login:hover,.link-login:focus {color:#fff;} 

	.let-me-look {display:none; cursor: pointer; outline:none; text-transform: uppercase; color:#fff;margin:260px auto 3em; width:70%;font-family:'Roboto', sans-serif; font-weight:700;text-align:center; box-shadow:0 4px 0px rgba(0,0,0,0.1); background:#e60477;  line-height: 1.4;  border: none; font-size: 22px; padding: 15px 0;  border-radius: 4px;  -moz-border-radius: 4px; -webkit-border-radius: 4px;}
	.let-me-look:hover,.let-me-look:focus {color:#fff; text-decoration:none;background:#e60477;}	
 
	.welcome-content {background:#242C35 url(../images/wetwall.jpg); padding:70px 0;} 
	.welcome {color:#242C35; font-weight:300; overflow:hidden; padding:0 135px;}
	.welcome p {font-size:20px; color:#eee; margin:0 0 25px;}
	.welcome h3 {font-size:30px; color: rgb(182, 0, 104); font-weight:400; padding:25px 0 15px; font-family: 'Roboto', sans-serif; text-transform:uppercase;}
	.mobile-pic {float:left; display:none;}


	.visual2 {background:url(../images/custom/visual-bottom.jpg) no-repeat center bottom #fff; background-size:100% auto; background-attachment:fixed; box-shadow:0 5px 0px rgba(0,0,0,0.3) inset, 0 -5px 0px rgba(0,0,0,0.3) inset;}
	
	.reg-form {max-width:356px; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; -o-border-radius:5px;margin:0 auto; padding:0;}
	.reg-form-top {position:relative; float:right; background:rgb(182, 0, 104); margin:3em 0 3em;}
	.reg-form-bottom {margin:150px auto 100px;}
	.reg-title {color:#666;  font-family: 'Roboto', sans-serif; text-align:center; font-size:28px; font-weight:700; margin:0;}
	.reglink {background:#e60477;padding:14px 40px; font-size:22px; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; -o-border-radius:5px; font-family: 'Roboto', sans-serif; font-weight:400; box-shadow:0 4px 0px rgba(0,0,0,0.1);color:#fff;text-transform:capitalize;margin:140px auto 100px;display:inline-block; min-width:240px;}	
	.reglink:hover,.reglink:focus {color:#fff;}	

	.policy-popup {display:none; width:48%; position:fixed; top:18%; left:50%; margin-left:-24%; height:500px; background:#fff; z-index:1003; padding:20px; box-shadow:0 0 5px rgba(0,0,0,0.6);}
	.policy-popup iframe {border:none; overflow-y:scroll;}
	.policy-popup .close-popup {position:absolute; right:10px; top:5px; color:#222; font-family: "Alegreya Sans SC",sans-serif; font-size: 18px;  font-weight: 600;}
	.javascript-notification {width:100%; color:#fff; background:#000; text-align:center; font-size:20px; line-height:2;}
	
	.footerLinks {padding:20px 0 20px;}
	.footerLinks ul {text-align:center; margin:0; padding:30px 0 0px;}
	.footerLinks li {display:inline-block; margin:0 10px;}
	.footerLinks li a {text-decoration:none; color:#fff; font-size:1em;}
	.footerLinks li a:hover {text-decoration:underline;}
	.notification-message {font-size:12px; text-align:center; color:gray; margin:10px 0;}
	
	.footer-logo img{display:block;margin:0 auto; max-width:280px;}

	.form .label {background:none;}
	label {line-height:normal;}
}


@media only screen and (max-width: 75.063em) { /*1200*/
	.visual {background-size:140% auto; background-position:left center;}
	.welcome {padding:0 35px 1px 20px;}
}
@media only screen and (max-width: 64.063em) { /*1024*/
	.visual {background-size:155% auto;}
	.visual2 { background-position: center center;  background-size: auto 100%;}
	.reg-form-top {margin:1.5em 0;}
}
@media only screen and (max-width: 62.063em) { /*980*/
	.visual {background-size:170% auto;}
	.reg-form-top {margin:1em 0;}

	.welcome h3 {font-size: 24px;}
}

@media only screen and (max-width: 50.063em) { /*768*/
	.visual {background-size:185% auto;}
	.profile {width:25%;}
	.policy-popup {left:3%; width:94%; margin:0;}		
	.slogan { max-width: 300px; padding: 10px 10px 0;}
	.link-login {padding:0 30px;}
	.reg-form-top {margin:1em auto; float:none; background:rgba(182, 0, 104,0.85);}
	.welcome {padding:0 20px 1px 20px;}	
}

@media only screen and (max-width: 40.063em) { /*640*/
	.visual {background-size:220% auto; background-position:10% 0px; background-attachment:scroll;}
	.slogan { max-width: none; padding:0 10px;}
	.reg-form-top {background:rgba(182, 0, 104,0.8)}
	.link-login { padding: 0 20px; font-size: 16px; line-height: 34px;}
}

@media only screen and (max-width: 30.063em) { /*480*/
	.visual {background-position: 10% 0px;background-size:255% auto;}                                            
	header {padding:0px 0 5px;}
	.slogan {max-width: 100%;padding: 5px 10px 0; font-size:14px;}
	
	.reg-form {width:100%;}
	.reg-form-top {display:none;}

	.let-me-look {display:block; margin: 220px auto 140px;}
	.reg-title {font-size:24px;}
	.reglink {width:70%;}
	.logo img {max-width:180px;}
	.policy-popup {height:350px;}
}

@media only screen and (max-width: 25.063em) { /*400*/
	.visual {background-position: 10% 0px;background-size:280% auto;}  
	
	.let-me-look {margin: 180px auto 160px;}	
	.link-login { font-size: 14px; line-height: 28px;  padding: 0 10px;}

	.reglink{font-size:20px;padding:14px 25px; width:100%;}
	.joinbutton {padding:0; width:94%;}
}
@media only screen and (max-width: 22.563em) { /*360*/
	.visual {background-size:320% auto;}  
}