/* === the dark full screen background, which appears on form pop-up === */
#background-on-popup {
    z-index: 9999;
    position: fixed;
    display: none;
    height: 100%;
    width: 100%;
    background: #000000;
    top: 0px;
    left: 0px;
}

/* === The X-mark from the top-right corner of the pop-up form, from which you can close the box === */
div.close {
    background: url("../images/closebox.png") no-repeat scroll 0 0 transparent;
    cursor: pointer;
    float: right;
    height: 16px;
    top: 10px;
    right: 10px;
    position: relative;
    width: 16px;
}

/* ==== Sign-In and Register Tabs ==== */
#sign-in-tab, #register-tab {
	cursor: pointer;
}

/* ==== Wrapper of the forms ==== */
#sign-in-form {
	max-width: 480px;
	min-width: 280px;
	width: 100%;
	margin-top: 10px;
	margin-bottom: 20px;
	position: fixed;
	display: none;
	left: 50%;
    top: 10%;
	margin-left: -240px;
    border-radius: 3px;
    z-index: 99999; background:#FFF;
}
#Doc-Speaks-pop, #Diet-Corner-pop, #Chairman-pop, #todayMessage-pop, #feedback-form {
	max-width: 640px;
	min-width: 280px;
	width: 100%;
	margin-top: 20px;
	margin-bottom: 20px;
	position: fixed; background:#fff;
	display: none;
	left: 45%;
    top: 10%;
	margin-left: -240px;
    border-radius: 3px;
    z-index: 99999;
}
#p1-pop, #p2-pop, #p3-pop, #p4-pop, #p5-pop, #p6-pop, #p7-pop, #p8-pop, #p9-pop, #p10-pop, #p11-pop, #p12-pop {
	max-width: 640px;
	min-width: 280px;
	width: 100%;
	margin-top: 20px;
	margin-bottom: 20px;
	position: fixed; background:#fff;
	display: none;
	left: 45%;
    top: 10%;
	margin-left: -240px;
    border-radius: 3px;
    z-index: 99999;
}

#Scan-Schedule-Pop {
	max-width: 480px;
	min-width: 280px;
	width: 100%;
	margin-top: 20px;
	margin-bottom: 20px;
	position: fixed; background:#fff;
	display: none;
	left: 50%;
    top: 10%;
	margin-left: -240px;
    border-radius: 3px;
    z-index: 99999;
}
.pcontent { width:100%; height:480px; overflow-y: scroll; overflow-x: hidden;  }
#p11-pop > .pcontent, #p10-pop > .pcontent, #p9-pop > .pcontent, #p7-pop > .pcontent, #p6-pop > .pcontent, #p2-pop > .pcontent { min-height:320px; overflow:auto; padding-bottom:10px; }
/* .pcontent::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); border-radius: 10px; background-color: #F5F5F5; }
.pcontent::-webkit-scrollbar { width: 12px; background-color: #F5F5F5; }
.pcontent::-webkit-scrollbar-thumb { border-radius: 10px; -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3); background-color: #D62929; }

.pcontent::-moz-scrollbar-track { -moz-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); border-radius: 10px; background-color: #F5F5F5; }
.pcontent::-moz-scrollbar { width: 12px; background-color: #F5F5F5; }
.pcontent::-moz-scrollbar-thumb { border-radius: 10px; -moz-box-shadow: inset 0 0 6px rgba(0,0,0,.3); background-color: #D62929; }

.pcontent::scrollbar-track { box-shadow: inset 0 0 6px rgba(0,0,0,0.3); border-radius: 10px; background-color: #F5F5F5; }
.pcontent::scrollbar { width: 12px; background-color: #F5F5F5; }
.pcontent::scrollbar-thumb { border-radius: 10px; box-shadow: inset 0 0 6px rgba(0,0,0,.3); background-color: #D62929; }
*/
.pcontent p { font-size:14px; line-height:20px; margin:10px 10px; display: block; /*display:inline-block;*/ text-align:justify; color:#717171; }
.pcontent img { display:table; margin:5px auto; }
.pcontent img.cm-img { width:98%; display:table; }
.pcontent h6 { font-size:15px; color:#ea6426; margin:10px; }
.pcontent ul { margin:0 10px 20px; font-size:14px; line-height:20px; }
.pcontent ul li { margin:10px 0 10px 15px; list-style:square; color:#717171; }
.pcontent ul li b { font-weight:bold; }
#Doc-Speaks-pop > h5, #Diet-Corner-pop > h5, #Chairman-pop > h5, #todayMessage-pop > h5, #Scan-Schedule-Pop > h5, #sign-in-form > h5, #feedback-form > h5 { font-size:20px; color:#018d75; line-height:25px; margin:10px 0 0 10px; border-bottom:1px solid #eee; padding-bottom:5px; }
#p1-pop > h5, #p2-pop > h5, #p3-pop > h5, #p4-pop > h5, #p5-pop > h5, #p6-pop > h5, #p7-pop > h5, #p8-pop > h5, #p9-pop > h5, #p10-pop > h5, #p11-pop > h5, #p12-pop > h5 { font-size:20px; color:#018d75; line-height:25px; margin:10px 0 0 10px; border-bottom:1px solid #eee; padding-bottom:5px; }

#Doc-Speaks-pop > p, #Diet-Corner-pop > p, #Chairman-pop > p, #todayMessage-pop  > p, #Scan-Schedule-Pop > p, #feedback-form > p { font-size:14px; line-height:20px; margin:10px; display:inline-block; text-align:justify; color:#717171; }
#Doc-Speaks-pop > p b, #Diet-Corner-pop > p b, #Chairman-pop > p b, #todayMessage-pop > p b, .pcontent p b { font-weight:bold; }
#Doc-Speaks-pop > p strong, #Diet-Corner-pop > p strong, #Chairman-pop > p strong, #todayMessage-pop > p strong, .pcontent p strong { font-weight:bold; }
#Scan-Schedule-Pop > h6 { font-size:16px; color:#414040; line-height:20px; text-align:center; margin:15px 10px; }
#Scan-Schedule-Pop > form > div { display:table; margin:10px auto; }
#Scan-Schedule-Pop > form select { height:25px; line-height:25px; border:1px solid #ababab; background:#fff; padding:0 7px; float:left; margin:5px 8px; }
#Scan-Schedule-Pop > form input[type="submit"] { width:203px; height:28px; line-height:24px; font-size:15px; color:#fff; background:#e86326; border:1px solid #ca4000; margin:10px auto; display:table; transition:all ease 0.5s; }
#Scan-Schedule-Pop > form input[type="submit"]:hover, section#content article#cright #cal form input[type="submit"]:focus { background:#13af94; border:1px solid #068771; cursor:pointer; }
#Scan-Schedule-Pop > p.presult { text-align:center; font-weight:bold; display:inherit; }
#Scan-Schedule-Pop > p.presult b { color:#e86326; }
#register-form {
	max-width: 480px;
	min-width: 250px;
	width: 100%;
	margin-top: 20px;
	margin-bottom: 20px;
	position: absolute;
	display: none;
	left: 50%;
	top: 2%;
	margin-left: -240px;
    border-radius: 3px;
    z-index: 99999;
}

/* ==== The form section styling of elements ==== */
#form-section {
	border-radius: 3px;
	background: #fff; /* here you can change the background color of the form */
	padding: 30px;
}

#form-section li {
	list-style: none;
}

#form-section label span {
	cursor: pointer;
	color: #333;
	display: block;
	margin: 5px 0;
	font-size: 15px;
}

.left-column { /* left column from the two column input row */
	float: left;
	width: 48%;
}

.right-column { /* right column from the two column input row */
	width: 48%;
	float: right;
}

@media (max-width: 380px) { /* takes care of the responsive behavior of the two column inputs */
	.left-column {
		width: 100%;
	}

	.right-column {
		width: 100%;
	}
}
@media (max-width: 768px) { 
#sign-in-form, #register-form, #Doc-Speaks-pop, #Diet-Corner-pop, #Chairman-pop, #todayMessage-pop, #Scan-Schedule-Pop, #feedback-form { left:40%; top:1%; }
#p1-pop, #p2-pop, #p3-pop, #p4-pop, #p5-pop, #p6-pop, #p7-pop, #p8-pop, #p9-pop, #p10-pop, #p11-pop, #p12-pop { left:40%; top:1%; }
}
@media (max-width: 640px) { 
#sign-in-form, #register-form, #Doc-Speaks-pop, #Diet-Corner-pop, #Chairman-pop, #todayMessage-pop, #Scan-Schedule-Pop, #feedback-form, #p1-pop, #p2-pop, #p3-pop, #p4-pop, #p5-pop, #p6-pop, #p7-pop, #p8-pop, #p9-pop, #p10-pop, #p11-pop, #p12-pop { left:0; width:100%; margin:0; top:1%; }
}

@media (max-width: 480px) { /* takes care of the responsive behavior of the pop-up forms */
	#register-form, #sign-in-form, Doc-Speaks-pop, #Diet-Corner-pop, #Chairman-pop, #todayMessage-pop, #Scan-Schedule-Pop, #feedback-form, #p1-pop, #p2-pop, #p3-pop, #p4-pop, #p5-pop, #p6-pop, #p7-pop, #p8-pop, #p9-pop, #p10-pop, #p11-pop, #p12-pop {
		margin-left: 0;
		left: 0;
	}
	#sign-in-form, #register-form, #Doc-Speaks-pop, #Diet-Corner-pop, #Chairman-pop, #todayMessage-pop, #Scan-Schedule-Pop, #feedback-form, #p1-pop, #p2-pop, #p3-pop, #p4-pop, #p5-pop, #p6-pop, #p7-pop, #p8-pop, #p9-pop, #p10-pop, #p11-pop, #p12-pop { top:0%; }
	#Doc-Speaks-pop, #Diet-Corner-pop, #Chairman-pop, #todayMessage-pop, #Scan-Schedule-Pop, #feedback-form, #p1-pop, #p2-pop, #p3-pop, #p4-pop, #p5-pop, #p6-pop, #p7-pop, #p8-pop, #p9-pop, #p10-pop, #p11-pop, #p12-pop { left:0; margin:0; width:100%; }
	.pcontent { height:430px; }
	
	#p11-pop > .pcontent, #p10-pop > .pcontent, #p9-pop > .pcontent, #p7-pop > .pcontent, #p6-pop > .pcontent, #p2-pop > .pcontent { height:480px; overflow-y: scroll; overflow-x: hidden; padding-bottom:10px; }
	
}

/* ==== Inputs and Buttons of the form, with hover and focus behavior ==== */
#form-section input { /* here you can change the properties of the input fields */
	width: 100%;
	border: 1px solid #ccc;
	margin: 0 0 5px;
	padding: 8px;
	border-radius: 3px;
	font-size: 12px;
	padding-right: 25px;
	color: #333;
}

#form-section .rating input { /* here you can change the properties of the input fields */
	width: auto !important;
	border: 1px solid #ccc;
	margin: 0 0 5px;
	padding: 8px;
	border-radius: 3px;
	font-size: 12px;
	padding-right: 25px;
	color: #333;
}

#form-section textarea { /* here you can change the properties of the input fields */
	width: 100%; font-family: 'euphemiaregular';
	border: 1px solid #ccc;
	margin: 0 0 5px;
	padding: 8px;
	border-radius: 3px;
	font-size: 12px;
	padding-right: 25px;
	color: #333;
}

#form-section select { /* here you can change the properties of the input fields */
	width: 100%; font-family: 'euphemiaregular';
	border: 1px solid #ccc;
	margin: 0 0 5px;
	padding: 8px;
	border-radius: 3px;
	font-size: 12px;
	padding-right: 25px;
	color: #333;
}
#form-section input:hover {
	border: 1px solid #666;
	-webkit-transition: border-color 0.2s ease-in-out;
	-moz-transition: border-color 0.2s ease-in-out;
	-o-transition: border-color 0.2s ease-in-out;
	-ms-transition: border-color 0.2s ease-in-out;
	transition: border-color 0.2s ease-in-out;
}

#form-section button[type="submit"] { /* here you can change the properties of the submit button */
	cursor: pointer;
	width: 100%;
	height: 36px;
	line-height: 36px;
	border: none;
	color: #FFF;
	margin: 20px 0 5px;
	border-radius: 3px;
	display: block;
	font-size: 14px;
	background: #068771;
	-webkit-box-shadow: 0 4px 0 #037562;
	box-shadow: 0 4px 0 #037562;
}

#form-section button[type="submit"]:hover {
	background-color: #037562;
	-webkit-transition: background 0.3s ease-in-out;
	-moz-transition: background 0.3s ease-in-out;
	-o-transition: background 0.3s ease-in-out;
	-ms-transition: background 0.3s ease-in-out;
	transition: background 0.3s ease-in-out;
}

#form-section input:focus {
	outline: 0;
	border: 1px solid #666;
}

#form-section input.facebook-login { 
	cursor: pointer;
	width: 100%;
	height: 36px;
	border: none;
	background: #466ab5;
	-webkit-box-shadow: 0 4px 0 #3c5a9a;
	box-shadow: 0 4px 0 #3c5a9a;
	color: #FFF;
	margin: 20px 0 5px;
	border-radius: 3px;
	padding: 0px;
	font-size: 14px;
}

#form-section input.facebook-login:hover {
	background-color: #3c5a9a;
	-webkit-transition: background 0.3s ease-in-out;
	-moz-transition: background 0.3s ease-in-out;
	-o-transition: background 0.3s ease-in-out;
	-ms-transition: background 0.3s ease-in-out;
	transition: background 0.3s ease-in-out;
}

#form-section input.google-login {
	cursor: pointer;
	width: 100%;
	height: 36px;
	border: none;
	background: #c7362f;
	-webkit-box-shadow: 0 4px 0 #aa251f;
	box-shadow: 0 4px 0 #aa251f;
	color: #FFF;
	margin: 20px 0 5px;
	border-radius: 3px;
	font-size: 14px;
	padding: 0px;
}

#form-section input.google-login:hover {
	background-color: #aa251f;
	-webkit-transition: background 0.3s ease-in-out;
	-moz-transition: background 0.3s ease-in-out;
	-o-transition: background 0.3s ease-in-out;
	-ms-transition: background 0.3s ease-in-out;
	transition: background 0.3s ease-in-out;
}

#form-section label.rem-me {
	font-size: 12px;
}

/* === The section numbering from the registration form === */
#form-section p {
	padding-bottom: 10px;
	margin: 15px 0px;
	font-size: 15px;
	font-weight: bold;
	border-bottom: 1px dashed #2D3538;
}

span.register-numbering {
	padding: 3px 12px;
	background-color: #ca0900;
	color: #fff;
	margin-right: 10px;
	border-radius: 3px;
}

span.register-numbering-text {
	color: #333;
}

div.loader {
    background: url("../images/loading.gif") no-repeat scroll 0 0 transparent;
    height: 32px;
    width: 32px;
    display: none;
    z-index: 9999;
    top: 40%;
    left: 50%;
    position: absolute;
    margin-left: -10px;
}

/* ==== Placeholder customization ==== */
::-webkit-input-placeholder {
	color: #888;
}

:-moz-placeholder {
	color: #888;
}

::-moz-placeholder {
	color: #888;
}

:-ms-input-placeholder {
	color: #888;
}
/* ==== End of placeholder customization ==== */

/* === HTML5 validation styles === */
#form-section input:required:valid {
	background: #fff url(../images/valid-icon.png) no-repeat 99% 50%;
	background-position: right 6px center;
}

#form-section input:focus:invalid {
	background: #fff url(../images/invalid-icon.png) no-repeat 99% 50%;
	background-position: right 6px center;
}

/* === Custom checkbox (Remember me checkbox) === */

#checkbox li {
	margin-top: 10px;
	border-radius: 4px;
	position: relative;
	display: inline-block;
	border: 1px solid #2D3538;
	top: 5px;
}

#checkbox li:hover {
	border: 1px solid #666;
	-webkit-transition: border-color 0.2s ease-in-out;
	-moz-transition: border-color 0.2s ease-in-out;
	-o-transition: border-color 0.2s ease-in-out;
	-ms-transition: border-color 0.2s ease-in-out;
	transition: border-color 0.2s ease-in-out;
}

#checkbox li input {
	display: none;
}

#checkbox label {
	font-size: 14px;
	margin-left: 6px;
	color: #333;
}

#checkbox .selected {
	background-color: #333;
}

#checkbox .selected span.unchecked-state {
	display: none;
}

span.unchecked-state {
	display: block;
	width: 18px;
	height: 18px;
	color: #fff;
	cursor: pointer;
	background-color: #fff;
	border-radius: 3px;
}

span.checked-state {
	display: none;
	width: 18px;
	height: 18px;
	cursor: pointer;
	background-color: #ca0900;
	background-image: url(../images/checkmark-icon.png);
	background-repeat: no-repeat;
	background-position: 50% 50%;
	border-radius: 3px;
}

#checkbox li.selected span.checked-state {
	display: block;
}

/* ==== HTML5 Custom Validation Bubble for Chrome ===== */
::-webkit-validation-bubble-message {
	background-color: #E5534E;
	font-size: 14px;
	top: -4px;
	left: 0px;
	width: auto;
	margin: 0;
	border: none;
	text-align: left;
	display: block;
	padding: 6px;
	border-radius: 3px;

	-webkit-box-shadow: none;
	box-shadow: none;
	text-indent: -22px;
}

::-webkit-validation-bubble-message > div > div + * {
	font-size: 16px;
	line-height: 32px;
	font-family: sans-serif;
	color: #000;
}

::-webkit-validation-bubble-icon {
	background-color: transparent;
	padding: 0px;
	text-indent: 0px;
	display: inline-block;
	position: relative;
	background-image: none;
	background-repeat: none;

	-webkit-background-size: 100%;
	-moz-background-size: 100%;
	background-size: 100%;
	float: left;
}

::-webkit-validation-bubble-arrow {
	background-color: transparent;
	border: none;
	position: absolute;
	top: 5px;
	color: #E5534E;
}

::-webkit-validation-bubble-arrow:before {
	position: absolute;
	content: "\25E4";
} 

/* ==== End of validation bubbles customization ==== */