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

ul.profiles li, input, select, button {box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; white-space:normal;}

body {
    background:#c9ad91 url("images/pagebg.png") top center repeat-x;
    font-family:'PT Sans', Arial;
}
.hpWrapper {
    width:980px;
    margin:auto;
}

/* HEADER 
---------------------------------------------------*/
header {
    margin:20px 0;
    border:none;
}
.ask-user {
	color:#563122;
}
#welcome .register {
	display:none;
}
#welcome a.login,
#welcome a.login:hover,
.submitButton {
	background-color:#4E2A1D;
    color:#fff !important;
}
.signupWrap {
	display:none;
}
.dropdownContainer {
    background:#5C3324 !important;
}
.submitButton {
	background:#D6D5D3 !important;
    color:#222 !important;
    text-shadow:1px 1px 0 #eee !important;
}
#welcome .dropdownContainer .account-tools li {
    border:none;
}
#welcome .dropdownContainer button {
    border:none; 
    border-radius:2px; 
    font-weight:bold; 
    color:#fff}

/* TOP TITLE & ORNAMENT
---------------------------------------------------*/
.ornament {
	position:absolute;
	width:980px;
	margin-top:40px;
	height:139px;
	background: url("images/bgornaments.png") center center no-repeat;
}
.hpTitle {
	width:500px;
	margin:0 auto 30px auto;
	color:#563122;
	font-family:'Sofia', cursive, Arial;
	font-size:42px;
	line-height:46px;
	text-align:center;
	text-shadow:1px 1px 1px #fff;
}
.hpImage {
	position:absolute;
    *position: relative;
	z-index:1;
	width:980px;
	height:600px;
	margin:auto;
}


/* BOXES
---------------------------------------------------*/
.hpBox {
	margin:auto;
	padding:30px;
	background:#4e2a1d;
	border-radius:10px;
	border:1px solid #30180E;
    box-shadow:0 1px 0 #816053 inset;
}
.hpBox h3 {
	color:#f4efea;
	text-align:center;
	text-shadow:1px 1px 0 #402319;
}
.hpLine {
	width:100%;
	height:2px;
	margin:10px 0;
	background: url('images/hpline.png') center top repeat-x;
}

/* FORM
---------------------------------------------------*/
.hpForm {
	width: 662px;
	margin:500px auto 20px auto;
	color:#f4efea;
	text-shadow:1px 1px 0 #402319;
    *margin-top: 0;
    position: relative;
    z-index: 2;
}
.hpForm #hpformnew label {
	font-size:12px;
}
.hpForminner {
	width:470px;
	margin:auto;
}
.hpForm #hpformnew button,
#registerMultiStepContainer form button {
	width:100%;
	padding:9px;
	/*background:#eee url("images/buttonbg.png") center center repeat-x;*/
	background-color: #eee;
    background-image: linear-gradient(#EEEDEB, #C9C7C6);
	color:#3c2017;
    text-transform:uppercase;
    font-family:'PT Sans', Arial;
    line-height:28px;
    font-weight:normal;
    font-size:28px;
	text-shadow:1px 1px 1px #fff;
	border-radius:8px;
    white-space:normal;
}
.hpForm .allfields {
	background:#fff url("images/formfieldbg.png") center center repeat-x;
	border:none;
	border-radius:2px;
	padding:6px;
	font-size: 1.4em;
}
.hpForm select.allfields {
    padding:4px 6px;
}
.hpForm .row {
    float:left;
	width:46%;
	clear:none;
	padding-right:4% !important;
}
.disclaimer {
    font-size:11px;
}
.disclaimer a {
    color:#FFE7A5;
}
#form_signup_cross_regs_sponsors a {
    color: #fff;
    text-decoration: underline;
}
.genderBox {
	width:100% !important;
}
.genderBox select {
	width:100% !important;
}
.menuLooking {
	padding-top:6px;
}
.hpForm .buttonRow {
	clear:both;
	float:none;
	width:370px;
	margin:auto !important;
	padding-top:20px !important;
}


/* FEATURED MEMBERS
---------------------------------------------------*/
.hpMembers {
    background:#4e2a1d url("images/bgornaments3.png") center 10px no-repeat;
}
.hpMembers .hpLine {
    width:94%;
    margin:10px auto;
}
.profileInfo, UL.profiles.short LI .profileInfo {
    color:#f4efea;
    font-size:14px;
    text-align: center;
}
.profileInfo span.age {
	border:none !important;
	padding:0;
	background:none !important;
	color:inherit;
}
UL.profiles.short {
    text-align:center;
}
UL.profiles.short > LI {
    display:inline-block;
	width:125px; 
	margin:0 10px 15px 10px;
    border-radius:10px;
    overflow:hidden;
}
UL.profiles.short .thumbnail, 
UL.profiles.short .imgProtection IMG {
	width:120px;
	height:120px !important;
border-radius:6px;
	overflow:hidden;
    border:None;
}
.force_info .gender {
    color:#fff; 
    text-shadow:1px 1px 2px rgba(0,0,0,.6);
}
UL.profiles .username {
    margin-bottom:0;
}
.hpMembers .username a {
	color:#00b78e;
}
UL.profiles.short LI .profileInfo P .location {
    font-size:11px; 
    opacity:.65;}


/* Form Fix */
.genderBox { 
    width:49%; 
    display:inline-block; 
    }
    
FORM input[type="text"], FORM input[type="number"], FORM input[type="tel"], 
FORM input[type="password"], FORM input[type="email"], FORM textarea { 
    width:100%; 
    display:block; 
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box; 
    }

.hpForm FORM .row { padding:0.25em 0; }
.hpForm FORM SELECT { padding:0.25em; }

.hpForm FORM .birthday_month { width:36%; display:inline-block; }
.hpForm FORM .birthday_day { width:25.5%; display:inline-block; }
.hpForm FORM .birthday_year { width:35%; display:inline-block; }

.menuLooking { padding-top:3px; }

/* */

/* FOOTER
---------------------------------------------------*/
#footer {
	color:#eee;
	text-shadow:1px 1px 0 rgba(0, 0, 0, .15);
}
#footer p {
	font-size:14px;
}
#footer a, #footer ul li a, .browse-links a {
	color:#553222 !important;
	text-shadow:none;
	font-size: 14px;
}
#footer a:hover, #footer ul li a:hover, .browse-links a:hover {
    text-decoration: underline;
}
#footer .custom-footer a {
    font-size: 16.8px;
    color: #444 !important;
    text-shadow: 1px 1px 0 rgba(0, 0, 0, .15);
    text-decoration: underline;
}
#footer .custom-footer a:hover {
    text-decoration: none;
}
#footer UL LI {
	border:none;
}
.disclaimer {padding-bottom:7px;}

#footer .legal p, #footer h2, #footer h5 {
    color: #eee;
}

/* Real Member Box */

.real_user { 
    background-color: rgb(78,42,29);
    background-color: rgba(78,42,29,0.7);
    color: #FFF;
    font-size: 1.4em;
    position: absolute; 
    padding: 0.7em;
    right: 16%; 
    bottom: 25%; 
    -webkit-border-radius: 3px;
    border-radius: 3px;
    z-index: 4;
}

/* */


/* m.rancic,10.10.2013. */
.browser-internet-explorer-8 UL.profiles.short > LI { width: 120px; }
.browser-internet-explorer-8 UL.profiles.short LI .profileInfo P .location { color: #F4EFEA; }
/* 11.07.2014. */
#welcome a.login:hover { background: #673726 !important; }
.submitButton:hover, .hpForm #hpformnew button:hover, #registerMultiStepContainer form button:hover { 
	background-color: #ddd;
    background-image: linear-gradient(#e6e5e2, #c1bebd); 
}
/* 07.08.2015. */
#signinDropdownContainer .blockLabels input[type="text"], #signinDropdownContainer .blockLabels input[type="password"] { border: 1px solid #fff; }
.regGeoLocationContainer #form_signup_city_name { font-size: 1.25em; }
#registerMultiStepContainer FORM #form_signup_cross_regs_sponsors label {
    font-size: 0.8em;
    margin-bottom: 0;
}
#registerMultiStepContainer FORM #form_signup_cross_regs_sponsors input { float: none; }
.browser-safari #registerMultiStepContainer FORM SELECT { line-height: 2em; }
#registerMultiStepContainer .error a {color: red; text-decoration: underline;}
/* 12.Feb.2016. */
#welcome .ask-user { font-size: 1.3em; }
#footer .custom-footer p { color:#444; }
.custom-footer { padding-bottom: 1em; border-bottom: 1px dotted #eee; }
UL.profiles.short LI:hover .thumbnail { box-shadow: none; }
/**/


/* RESPONSIVE 
---------------------------------------------------*/
@media (max-width:890px) and (min-width:610px) {#hp_profile_6 {display:none;}}
@media (max-width:750px) and (min-width:610px) {#hp_profile_5 {display:none;}}

@media (max-width:980px) {
.hpImage {max-width:95%;}
.ornament {display:none;}

.hpWrapper,
.hpForm,
.hpForminner,
.hpTitle,
.hpImage,
.hpBox {
    float:none; 
	width:100%;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;}

.hpWrapper {padding:0 10px;}
.hpMembers {background-size:97%;}
.hpForm {max-width:650px;}
.hpForminner {max-width:500px;}

}

@media (max-width:750px) {}


@media (max-width:500px) {
.hpMembers {background-image:none;}
.hpImage { 
	background-position: center top !important; 
	background-size:100% !important;}
.hpTitle {
    font-size:34px; 
    line-height:36px;}
.hpForm {
    margin-top:250px;}
.hpForminner {max-width:300px; padding:0 10px;}
.hpForm .row {
    float:none; 
    width:100% !important; }
.hpBox {
    padding-left:15px; 
    padding-right:15px;}
    
UL.profiles.short {
	margin-left:0;
	padding:0 !important;

	margin:auto;
}
UL.profiles.short > LI {
	width:100px; 
    margin:5px 2px;
	border-radius:10px;
	overflow:hidden;
}
UL.profiles.short .thumbnail, .imgProtection IMG {
	width:100px;
	height:100px !important;
	border-radius:10px;
	overflow:hidden;
}
    
UL.profiles .username { font-size: 1.1em; }
}

@media (max-width:360px) {
.hpMembers {padding:20px 10px !important;}

UL.profiles LI .profileInfo h4.username { font-size: 1em; }
}

/* Milutin 25.07.2013 */
.hpForm FORM .selectMenus { padding-bottom:0; }

/* cis dec.2014 */
ul.profiles li, input, select, button {box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; white-space:normal;}
.birthdayWrapper {white-space:nowrap;}
#registerMultiStepContainer #progress-info {font-size:1.3em; line-height:2.5em;}

/* GEO form fix */
#c-Home .select2-container--default .select2-selection--single { 
	height: inherit;
	border: 1px solid #fff;
	border-radius: 0.25em;
	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: .4em 20px .4em .7em;
	color: #222;
	text-shadow: none;
}
#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;
}