/* seo 4 hp */

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

* {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;}

body {
	font-family: 'PT Sans', 'sans-serif';
	background-color: #1E1414;
	background-image: url(images/bgimage.png);
	background-repeat: no-repeat;
	background-position: center 500px;}

/* header */

header {
	padding:25px 0 15px 0;}
#welcome .ask-user em {
    color: #FFFFFF;
    font-size: 14px;}
#welcome .signupWrap {
    display: none;}
#welcome .login,
#welcome #signInBtn {
    background-color: #4D4D47;
    background-image: none;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;}
#welcome .login:hover,
#welcome #signInBtn:hover {
    background-color: #9FA09A;}
.dropdownContainer, #welcome .dropdownContainer {
    background-color: #4D4D47;
    background-image: none;
}
#signinDropdownContainer .account-tools LI, 
#signinDropdownContainer .account-tools LI:last-child {
    border-color: #CCCCCC;}
#signinDropdownContainer .account-tools A:hover {
    color: #FD7D00;
    text-decoration: none;}

/* visual */

#visual {
	position: relative;
    background-size: cover;
	width: 100%;
	min-height: 432px;
	border-radius: 10px;
}
.real_user {
	font-size: 14px;
	color: #fff;
	position: absolute;
	padding: 10px;
	border-radius: 10px;
	background-color: #fff;
	background-color: rgba(255,255,255,.12);
	left: 10px;
	bottom: 10px;}

/* form */

#formHolder {
	background-color: #a2a19a;
	background-color: rgba(255,255,255,.4);
	border-radius: 0 10px 10px;
	max-width: 370px;
	width: 100%;
	float: right;
	margin: 1em 1em 0 0;
	-webkit-box-shadow: 2px 2px 1px rgba(0,0,0,.15);
	-moz-box-shadow: 2px 2px 1px rgba(0,0,0,.15);
	box-shadow: 2px 2px 1px rgba(0,0,0,.15);}
#hpformnew {
	padding: 10px;}
#formHolder h3 {
    background-position: left top;
    background-repeat: no-repeat;
    background-image: url(images/form-header.png);
    height: 81px;
    padding: 5px 20px;
    text-align: right;
    border-radius: 0 10px 0 0;
    position: relative;
    font-weight: 700;
    /*font-size: 32px;*/
    font-size: 28px;
    line-height: 90%;
    color: #fff;
    margin: 0;}
    #formHolder h3 strong {
    	color: #000;}
    #formHolder h3 span {
    	font-size: 15px;
    	font-weight: 400;
    	text-transform: uppercase;}
#formHolder h3:before {
	content: "";
	display: block;
	background-image: url(images/ribbon.png);
	width: 86px;
	height: 132px;
	position: absolute;
	left: -86px;
	top: 0;}
#hpformnew label {
    color: #FFFFFF;
    font-size: 14px;
    font-weight: 700;}
.formLEFT {
    float: left;
    width: 90px;}
.formRIGHT {
	width: 250px;
    float: left;}
.genderBox {
    clear: both;
    padding: 0.2em;}
FORM .row {
    padding: 0.2em;}
FORM .row.selectMenus {
    padding: 0;}
.birthdayWrapper {
    white-space:nowrap;}
.genderBox:after {
    clear: both;
    content: "";
    display: block;}
#hpformnew input, #hpformnew select {
	border: none;
    box-shadow: 2px 2px 0 rgba(166, 166, 166, 0.55) inset;
    font-size: 14px;
    padding: 4px;
    width: 100%;}
#hpformnew select.birthday_month {
    width: 41%;}
#hpformnew select.birthday_day, #hpformnew select.birthday_year {
    width: 28%;}
.disclaimer {
	margin-bottom: 10px;
    color: #fff;
    font-size: 11px;
    font-style: italic;}
.disclaimer a {
    color: #7A0D0C;}
FORM button[type="submit"],
button.next,
#formHolder .slaveReg {
    color: #fff;
	border: none;
	text-transform: uppercase;
	text-align: center;
	display: inline-block;
	font-size: 1.6em;
    padding: .5em 1.2em;
    line-height: 1em;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
	font-family: 'PT Sans', 'sans-serif';
    border-radius: 10px;
    background-color: #af1414;
    background-image: none;
    background-image: -webkit-gradient(linear, 0 100%, 0 0, from(#770d0c), to(#b01414));
    background-image: -webkit-linear-gradient(bottom, #770d0c, #b01414);
    background-image: -moz-linear-gradient(bottom, #770d0c, #b01414);
    background-image: -o-linear-gradient(bottom, #770d0c, #b01414);
    background-image: linear-gradient(bottom, #770d0c, #b01414);
    box-shadow: none;
    white-space: normal;
}
    
#hpformnew FORM button[type="submit"] {
	margin-left: 90px;
	font-size: 2.6em;
	/*padding: 0.2em;*/
	width: 250px;}

#formHolder .slaveReg {
    width: 90%;
    display: block; 
    font-size: 2.6em;
    float: none;
    margin: 1em auto;
}
FORM button[type="submit"]:hover,
button.next:hover,
#formHolder .slaveReg:hover {
	background-color: #770d0c;
	text-decoration: none;
	color: #fff;
    background-image: none;
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#770d0c), to(#b01414));
    background-image: -webkit-linear-gradient(#770d0c, #b01414);
    background-image: -moz-linear-gradient(#770d0c, #b01414);
    background-image: -o-linear-gradient(#770d0c, #b01414);
    background-image: linear-gradient(#770d0c, #b01414);
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
	border: none;
	padding: 0.5em 1.2em;
}

/* profiles */

#profiles {
    margin-top: 30px;
	text-align: center;}
#profiles > h2,
#browse-links > h3 {
    color: #A9AAAA;
    font-size: 30px;
    font-weight: 700;
    text-align: center;
    text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.7);}
UL.profiles {
    margin: 0;
    text-align: center;}
UL.profiles.short LI {
    margin: 5px;
    width: 180px;}
UL.profiles.short .thumbnail, .thumbnail {
	border-color: #342b2a;
    border: 2px solid rgba(255, 255, 255, 0.1);
    border-radius: 10px;}
UL.profiles .profileListThumbnail .owner-media-count {
    background-color: #ad1313;
    background-color: rgba(172, 19, 19, 0.8);
    border: medium none;
    border-radius: 0 7px;
    margin-left: 0.1em;}
UL.profiles .profileListThumbnail .owner-media-count A {
    color: #FFFFFF;}
ul.profiles .username,
ul.profiles-full .username {
    font-size: 18px;
    font-weight: bold;
    text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.75);}
.username > a {
    color: #AD1313;}
UL.profiles.short LI .profileInfo {
    text-align: center;}
.username > a:hover {
    color: #F87B00;
    text-decoration: none;}
UL.profiles.short LI .profileInfo P .location {
    color: #FFFFFF;
    font-size: 12px;}

#profiles > a {
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	color: #fff;
	text-shadow: 0 1px 1px rgba(0,0,0,.75);
	font-weight: 700;
	font-size: 24px;
	display: inline-block;
	margin: 2em;
    padding: 0.5em 1.2em;
	background-color: #ab5400;
	background-image: -webkit-gradient(linear, 0 100%, 0 0, from(#ab5400), to(#ff7e00));
	background-image: -webkit-linear-gradient(bottom, #ab5400, #ff7e00);
	background-image: -moz-linear-gradient(bottom, #ab5400, #ff7e00);
	background-image: -o-linear-gradient(bottom, #ab5400, #ff7e00);
	background-image: linear-gradient(bottom, #ab5400, #ff7e00);}
#profiles > a:hover {
	background-color: #ff7e00;
	background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ab5400), to(#ff7e00));
	background-image: -webkit-linear-gradient(#ab5400, #ff7e00);
	background-image: -moz-linear-gradient(#ab5400, #ff7e00);
	background-image: -o-linear-gradient(#ab5400, #ff7e00);
	background-image: linear-gradient(#ab5400, #ff7e00);
	text-decoration: none;
	color: #fff;}

/* footer */

#footer {
    color: #FFFFFF;
    padding: 0;}
#footer h2, #footer h3, #footer h4, #footer h5 {
    color: #F5F5F5;
    font-weight: 700;}
#footer a, #footer ul li a, #browse-links a {
    color: #ad1313;
    text-decoration: none;
    font-size: 1.1em;
}
#footer a:hover, #footer ul li a:hover, #browse-links a:hover {
    color: #FD7D00;
    text-decoration: underline;
}
#footer ul li {
    border: none;
}
.not-logged #footer .links {
    border-color: #494141;
}


@media (max-width:980px) { 
    #browse-links li {width:33% !important; border:none !important;}
    #visual #formHolder h3 { font-size: 24px; text-align: left; }
}
@media (max-width:680px) { #browse-links li {width:50% !important;}}
@media (max-width:480px) { #browse-links li {width:100% !important;}}

/* m.rancic,25.04.2014. */
@media screen and (min-width:2000px) { .wrapper { max-width: 980px; } }
.browser-internet-explorer-8 UL.profiles.short LI, .browser-internet-explorer-8 UL.profiles.thumbView LI { width: 180px; }
.browser-internet-explorer-8 .real_user {
    background: transparent;
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#1EFFFFFF,endColorstr=#1EFFFFFF)"; 
    /* IE8 */    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#1EFFFFFF,endColorstr=#1EFFFFFF);   
    /* IE6 & 7 */      zoom: 1;
}

#c-Home p.inputError {
    font-size: 1.15em;
    color: #fff; 
}
.regGeoLocationContainer #form_signup_city_name {
    font-size: 1.3em;
    color: #fff;
}
#registerMultiStepContainer FORM #form_signup_cross_regs_sponsors input { float: none; }
#registerMultiStepContainer FORM #form_signup_cross_regs_sponsors label {
    font-size: 0.8em;
    margin-bottom: 0;
    text-align: left;
    font-style: italic;
}
.browser-safari #registerMultiStepContainer FORM SELECT { line-height: 2em; }
/* 30.11.2015. */
#footer .legal P { font-size: 1.2em; }
.custom-footer { padding-bottom: 0; }

#signinDropdownContainer .blockLabels INPUT[type="text"], 
#signinDropdownContainer .blockLabels INPUT[type="password"] { 
    border-radius: 0;
    font-family: 'PT Sans', 'sans-serif'; }
/**/


/* mediaqueries */

@media screen and (max-width: 640px) {
	.wrapper {
		width:auto; max-width: 320px;}
	footer#footer {
 	   padding: 0;}
 	footer .wrapper {
 	   padding: 2%;}
	#customImage {
	    background-size: cover;
	    border-radius: 10px;
	    height: 250px;
	    width: 100%;}
	#formHolder {
	    border-radius: 10px;
	    position: relative;
	    right: auto;
	    width: 100%;}
	#formHolder h3 {
	    border-radius: 10px 10px 0 0;
	    font-size: 27px;
	    height: auto;}
	#formHolder h3:before {
	    display: none;}
	.formLEFT {
	    width: 80px;}
	.formRIGHT {
	    width: 210px;}
	#hpformnew FORM button[type="submit"] {
	    margin-left: 80px;
	    width: 100%;}
	UL.profiles.short LI {
	    width: 150px;}
	#hp_profile_5 {
	    display: none;}
}
@media screen and (min-width: 640px) and (max-width: 980px) {
	.wrapper {
		width:auto; max-width: 640px;}
	#customImage {
	    border-radius: 10px;
	    width: 100%;}
	#formHolder {
	    border-radius: 10px;
	    width: 300px;}
	#formHolder h3 {
	    border-radius: 10px 10px 0 0;
	    height: auto;
	    font-size: 26px;}
	.formLEFT {
	    width: 80px;}
	.formRIGHT {
	    width: 190px;}
	#hpformnew FORM button[type="submit"] {
	    font-size: 20px;
	    margin-left: 80px;
	    width: 190px;}
	.disclaimer {
	    line-height: 120%;}
	#formHolder h3:before {
	    display: none;}
}

/* custom footer tweak */
#footer {margin-bottom:100px}
#footer a:hover {color:#eee !important;}
#footer .custom-footer {border-bottom:1px dotted #777;}
#footer .custom-footer P, #footer p {font-size:16px; color:#eee;}
#footer .custom-footer h2 {font-size:28px; margin-bottom:15px;}

/* cis dec.2014 */
#registerMultiStepContainer #progress-container {font-size:16px; text-align:center;}
#registerMultiStepContainer .error {clear:both; font-size:13px;	padding:3px 5px; background:#BB2E02; color:#fff;}
#registerMultiStepContainer .error a {color: #fff; text-decoration: underline;}

/* CIS jan 2018. */
#footer P { color:rgba(255,255,255,.5); }
#footer .custom-footer p { color:#eee; }

/* form last step fix */
#registerMultiStepContainer #form_signup_cross_regs_sponsors, .disclaimer { color: #fff; }
#registerMultiStepContainer #form_signup_cross_regs_sponsors a { color: #fff; text-decoration: underline; }
.not-authorized .dialogBox a:hover { color:#111; }

/* GEO form fix */
#c-Home .select2-container--default .select2-selection--single { 
	height: inherit;
	border-radius: 0;
	border-color: #fff;
	box-shadow: 0.13em 0.13em 0.13em rgba(0, 0, 0, 0.07) inset;
}
#c-Home .select2-container--default .select2-selection--single .select2-selection__rendered { 
	height: inherit;
	line-height: normal;
	text-align: left;
	padding: .5em 20px .5em .7em;
}
#c-Home .select2-container--default .select2-selection--single .select2-selection__arrow {
	height: 100%;
}
#c-Home #registerMultiStepContainer #form_signup_city .label-select {
	margin: 0;
}
#c-Home #registerMultiStepContainer #form_signup_city_name {
	float: left;
	width: 100%;
	font-size: 1.3em;
	color: #fff;
}