@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,700&subset=latin-ext');
@import url('https://fonts.googleapis.com/css?family=Rubik:700&subset=latin-ext');

@media screen {
	html {position:relative; width:100%;}
	body {font:400 1em 'Open Sans', sans-serif; padding:0; margin:0; background:#282828; height:100%; width:100%; position:relative;}
	.visual {position:relative; background-origin: padding-box; background-clip: border-box; background-image:url(../images/visual4.jpg); background-repeat:no-repeat; background-position: center top; background-color:#0c0b1c; background-size:100% auto;}

    .holder {position:relative;}
	.row {position:relative; max-width:62em;}
    a:focus {outline:none;}

	input[type="checkbox"], input[type="radio"] {margin:0 5px 0 0!important; vertical-align:middle;}

	div#lightbox {background:rgba(0,0,0,0.6); position:absolute; left:0; width:100%; top:0; height:100%; min-height:100%; display:none; z-index:255;}
	
	header {padding:12px 0; background:#fff;}
	.logo {text-align:left; position:relative; padding:0; top:0; left:0; color:#444; z-index:10;}
	.logo img {}	
	
	.let-me-in {display:none; cursor: pointer; outline:none; text-transform: uppercase; padding:17px 0; color:#fff; margin:20px auto 0; width:70%;
	border-radius:30px;  -moz-border-radius: 30px; -webkit-border-radius: 30px;  font-family:'Open Sans', sans-serif; font-weight:700;font-size:24px;
	background:#1E7C1E; text-align:center; box-shadow:0 1px 1px rgba(0,0,0,0.5);}
	.let-me-in:hover,.let-me-in:focus {color:#fff; text-decoration:none; background:#0f9b00;}
	
	.loginlink {display:block; margin:0; padding:8px 45px 8px 17px; text-align:left; background:url(../images/login.png) no-repeat 85% center; color:#353535; font-size:16px; text-decoration:none; position:absolute; right:0; bottom: 5px; border:1px solid #bababa; border-radius:20px; -moz-border-radius:20px; -webkit-border-radius:20px; -o-border-radius:20px; font-family:'Open Sans',sans-serif;}
	.loginlink:hover {outline:none; text-decoration:none; color:#353535;}

    div.Registration {padding:0; position:relative; z-index:256; width:370px;}
	
	.reg-arrow {position:absolute; top:-28px; right:35px; z-index:100;}
	
	.slogan-title {color:#ffcc00; font-weight:bold; text-transform:uppercase; font-family:'Rubik',sans-serif; line-height:1; font-size:44px; margin:0; padding:25px 0 0; text-shadow:0 1px 1px rgba(0,0,0,0.6);}
    h1.slogan {position:relative; line-height:1.1; margin:0; color:#fff; font-weight:400; font-size:20px; text-align:left; font-family:'Open Sans',sans-serif; width:40%;}
	
	.welcomecontent {position:relative; margin: 0; font-weight:400; line-height: 1.3; background: url(../images/wall.jpg) no-repeat; padding:74px 0 90px;}
	
	.textblock {padding:0; text-align: center;}	
	.textblock h3 {color:#db2d8f; font-size:46px; text-transform:uppercase; font-weight:bold; font-family:'Rubik',sans-serif; text-align:center; margin:0; padding:0;}
	.textblock h4 {color:#292929; font-size:20px; text-transform:uppercase; font-weight:700; font-family:'Open Sans',sans-serif; text-align:center; margin:0 100px; padding:0;}
	.trans-community {background:#ffcc00; color:#292618; padding:35px 35px 50px; font-family:'Open Sans',sans-serif; font-size:16px; line-height:1.4; text-align:justify; border-radius:5px; -o-border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; margin:0 60px; font-weight:700; box-shadow:0 1px 1px rgba(0, 0, 0, 0.5); position:relative;}

	.registrationlink {border-radius:30px; -webkit-border-radius:30px; -moz-border-radius:30px; -o-border-radius:30px; color: #fff; display: inline-block; font-size: 20px; margin:0; padding: 17px 70px; text-transform: uppercase; text-decoration:none; outline:none; background:#db2d8f; font-family:'Open Sans',sans-serif; font-weight:700; line-height:1; position:absolute; left:34%; bottom:-26px; text-align:center;}
	.registrationlink:hover {text-decoration:none; color:#fff;}	
	.registrationlink:focus {color:#fff;}	

	.frontpagecontent {background-image: url(../images/visual2.jpg); background-size:100% auto; position:relative; padding:110px 0 60px; background-position:center center; background-attachment: fixed; text-align:center; background-repeat:no-repeat;}
	.frontpagecontent h3 {color:#fff; font-size:52px; font-family:'Rubik',sans-serif; text-align:left; text-transform:uppercase; line-height:1.1; text-shadow:0 1px 1px rgba(0,0,0,0.6); margin:0 0 10px; padding:0;}
	.frontpagecontent h5 {font-size:18px; color:#fff; font-family:'Open Sans',sans-serif; text-align:left; width:60%; margin:0; padding:0;}	
	.tryit {margin:100px 0 0 110px; width:150px; font-size:22px; font-family:serif; text-align:right; padding:0; position:relative;color:#fff; line-height:1;}
	.tryit img {position:absolute; top:-45px; right:-70px;}
	.frontpagecontent .registrationlink {padding:17px 60px; bottom:60px; left:38%;}
	
	.frontpagemembers {position:relative; margin: 0; font-weight:400; line-height: 1.3; background: url(../images/wall2.jpg); padding:74px 0 90px; text-align:center;}
	.frontpagemembers h4 {color:#fff; font-family:'Open Sans',sans-serif; text-align:center; font-size:22px; font-weight:400; margin:0 0 7px; padding:0;}
	.frontpagemembers h2 {color:#fff; font-family:'Rubik',sans-serif; text-align:center; text-transform:uppercase; font-size:42px; font-weight:bold; margin:30px 0 0; padding:0; text-shadow:0 1px 1px rgba(0,0,0,0.7);}
	.new-members {color:#db2d8f; font-weight:bold; text-transform:uppercase; font-family:'Rubik',sans-serif; font-size:50px; background:rgba(255,255,255,0.8); padding:8px 0 7px; display:inline-block; margin:0 auto; border-radius:3px; -o-border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px; line-height:1; text-align:center; width:260px;}
	
	.frontpagereviews {background:#f3f3f3; padding:100px 0 140px; position:relative; margin: 0;}
	.frontpagereviews h3 {font-size:54px; color:#4e4e4e; font-family:'Rubik',sans-serif; text-align:center; text-transform:uppercase; font-weight:bold; line-height:1.1; margin:0 0 120px;}
	.review {position:relative; margin:0 20px 0 180px;}
	.photo-review {position:absolute; left:-170px; top:-40px; z-index:2;}
	.text-review {z-index:1; border:1px solid #d1d1d1; color:#676767; background:#fff; padding:40px 30px 30px 165px; font-family:'Open Sans',sans-serif; font-style:italic; font-weight:400; font-size:15px; line-height:1.5; text-align:justify; margin:45px 0 0; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; -o-border-radius:10px;}
	.sign-review {text-transform:uppercase; text-align:center; padding:12px 0 0; color:#db2d8f; font-style:normal; font-size:14px;}
	.name-review {position:absolute; left:-250px; top:-75px; font-size:24px; font-family:serif; font-weight:700; color:#db2d8f; font-style:italic;}
	.arrow-review {position:absolute; right:35px; top:40px;}
	
	footer {background:#282828; padding:110px 0;}
	footer .column:nth-of-type(2) {border:none;border-right:1px solid #535353; border-left:1px solid #535353;}
	
	.footerLinks {padding:0;}
	.footerLinks ul {text-align:left; margin:0; padding:0px 0 45px 50px;}
	.footerLinks li {display:inline-block; margin:0 0 7px; display:block;}
	.footerLinks li a {text-decoration:none; color:#777; display:block; text-transform:uppercase; font-family:'Open Sans',sans-serif; font-weight:400;}
	.footerLinks li a:hover {text-decoration:underline;}
	.notification-message {font-size:11px; text-align:justify; color:#444; margin:0; padding:10px 50px 30px 0;}
	
	.social-buttons {padding: 3px 0 0 50px;}
	
	.policy-popup {display:none; width:48%; position:fixed; top:18%; left:50%; margin-left:-24%; height:450px; background:#fff; z-index:999; padding:0; 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:30px; top:3px; color:#222;  font-size: 18px;  font-weight: 600;}
	.policy-content h3 {font-size:22px;}
	.policy-content h4 {font-size:18px;}
	.usc {background:#e9e9e9;}
	.javascript-notification {width:100%; color:#fff; background:#000; text-align:center; font-size:20px; line-height:2;}
	
}

@media only screen and (max-width: 87.563em) {
	
}	
@media only screen and (max-width: 80.063em) {
	.visual {background-size:auto 100%;}
	.loginlink {right:15px;}
}	
@media only screen and (max-width: 64.063em) {
	.name-review {left: -170px; top:-115px;}

	.frontpagecontent h3 {font-size:42px;}
	.frontpagecontent {padding:70px 0 40px;}
	.tryit {margin:70px 0 0 60px;}
	.textblock h4 {font-size:18px;}
	.textblock h3 {font-size:40px;}
	.registrationlink {left:30%;}
	.frontpagereviews {padding:70px 0 100px;}
	.frontpagereviews h3 {font-size:46px;}
	.notification-message {padding:10px 30px 30px 0;}
	.footerLinks ul {padding:0 0 45px 30px;}
	.social-buttons {padding:3px 0 0 30px;}
	footer {padding:70px 0 50px;}
	h1.slogan {width:42%;}

	div.Registration form {width:100%;}
}
@media only screen and (max-width: 50.063em) {	
	.policy-popup {left:3%; width:94%; margin:0;}	
	.visual {background-position:65% top;}
	h1.slogan {width:50%;}
	.frontpagecontent h3 {font-size:36px;}
	.frontpagereviews h3 {font-size:40px;}	
}
@media only screen and (max-width: 48.063em) {
	div.Registration {width:62%;}	
	.notification-message {padding:10px 20px 30px 0;}
	.footerLinks ul {padding:0 0 45px 20px;}
	.social-buttons {padding:3px 0 0 20px;}	
}
@media only screen and (max-width: 44.063em) {

}
@media only screen and (max-width: 40em) {
	.slogan-title {text-align:center;}
	h1.slogan {text-align:center; width:94%; margin:0 auto;}
	.textblock h4 {margin:0;}
	.registrationlink {left:24%;}
	.frontpagecontent .registrationlink {left:38%;}
	div.Registration {width:90%; margin-left:5%;}	
	.text-review {padding:30px 30px 20px 55px; margin:0;}
	.photo-review {top:15px; width:200px;}
	.name-review {top:-63px;}
	.frontpagereviews h3 {margin:0 0 80px;}
	.frontpagemembers h2 {font-size:34px;}
	.frontpagecontent {background-size:300% auto;}
}
@media only screen and (max-width: 39.99em) {
	.notification-message {padding:10px 30px 30px;}
	footer .column:nth-of-type(2) {border:none;}
	.logo-gray {margin:0 0 0 30px;}
	.footerLinks ul {padding:0 0 45px 30px;}
	.social-buttons {padding:3px 0 0 30px;}		
}
@media only screen and (max-width: 30.063em) {
	div.Registration {margin-left:3%; width:94%;}
	.policy-popup {height:350px;}
	.trans-community {margin:0;}
	.textblock h3 {font-size:36px;}
	.textblock h4 {font-size:16px;}
	.tryit {margin:70px 0 0;}
	.frontpagecontent .registrationlink {left:42%;}
	.frontpagereviews {padding:50px 0 60px;}
	.frontpagereviews h3 {font-size:32px;}
	.review {margin: 0 20px 0 130px;}
	.photo-review {width:170px; left:-125px;}
	.name-review {left:-120px; font-size:20px; top:-48px;}
	.arrow-review {top:25px;}
	.frontpagemembers {padding:50px 0;}
	.frontpagemembers h2 {font-size:28px;}
	.let-me-in {display:block;}
	.Registration {display:none;}
	.visual {min-height:500px;}
	.slogan-title {padding:15px 0 0;}
    h1.slogan {margin:120px 0 0; 
	-webkit-transition: margin 0.4s ease;
    -moz-transition: margin 0.4s ease;
    -o-transition: margin 0.4s ease;
    transition: margin 0.4s ease;}	
}
@media only screen and (max-width: 25.063em) {
	.visual {background-position:70% top;}	
	div.Registration {margin-left:0; width:100%;height:auto;}
	.slogan-title {font-size:32px;}
	.slogan {font-size:18px;}
	.textblock h3 {font-size:26px;}
	.textblock h4 {font-size:14px;}
	.welcomecontent {padding:50px 0 90px;}
	.trans-community {padding:25px 25px 50px;}	
	.registrationlink {left: 10%;width: 80%;}
	.frontpagecontent h3 {font-size:26px;}
	.tryit {text-align:left;}
	.tryit img {right:35px;}
	.frontpagecontent .registrationlink {left:42%; width:56%; padding:17px 0;}
	.review {margin:0;}
	.photo-review {left:auto; top:auto; width:200px; display:block; margin:0 auto; position:relative;}
	.name-review {left:0;}
	.text-review {padding:20px 15px 20px 15px;}	
	.frontpagemembers h2 {font-size:30px;}
	h1.slogan {font-size:18px;}
	.frontpagemembers h4 {font-size:18px;}
}

@media only screen and (max-width: 20.063em) {
	.slogan-title {font-size:30px;}
	.slogan {font-size:17px;}
}