@import url('https://fonts.googleapis.com/css?family=Poppins:100,200,300');


#SymptomCheckerDiv {
position:absolute;
top:0px;
margin-left:auto;
margin-right:auto;
width:594px;
height:356px;
background-repeat:no-repeat;
background-color:#229BD0; /*VARIABLE*/
padding:0px 0px 0px 0px;
font-family:Helvetica, Arial, Sans-serif;
font-size:12px;
z-index:1;
color:#777777;
box-sizing: content-box;
border-collapse: separate;
box-shadow: -1px 1px 5px #222222;
border-radius:3px;
line-height:normal;
}

#SympChkrTitle {
position:relative;
display:inline-block;
margin:4px 0px 0px 0px;
color:white;
font-family: 'Poppins', sans-serif;
font-weight:100;
font-size:34px;
text-align:center;
letter-spacing:4px;
padding:0px 0px 0px 52px;
width:80%;
float:left;
height:24px;
}

#bodyGraphic {
left:21px;
top:67px;
position:absolute;
display: block;
margin:0px 0px 0px 0px;
width:275px;
height:256px;
background-repeat:no-repeat;
padding-left:0px;
padding-top:12px;
text-align:center;
border-radius:2px;
}

#bodyGraphic h1 {
text-align:left;
display:block;
width:200px;
font-family: 'Poppins', sans-serif;
font-weight:300;
font-size:18px;
font-weight:300;
letter-spacing:4px;
margin-left:32px;
line-height:120%;
color:#000000;
}

#bodyGraphic ul {
position:absolute;
left:-12px;
top:48px;
text-align:left;
list-style:none;
float: left;
}

#bodyGraphic ul li {
font-size:16px;
margin:18px 0px 0px 0px;
padding:0px;
list-style:none;
background-image:none;
}

#bodyGraphic a {
text-decoration:none;
color:#555555;
font-weight:bold;
font-size:16px;
margin:0px;
padding:0px;
}

#bodyGraphic a:hover {
color:#777777;
text-decoration:underline;
}

#bodyPartSetter {
font-family:Helvetica, Arial, Sans-serif;
width:158px;
height:32px;
font-weight:400;
font-size:14px;
background-color:#036896; /*VARIABLE*/
padding:4px;
margin-top:0px;
color:#FFFFFF;
border:solid 0px #000000;
border-radius:3px;
}

#bodyPartSetter select, #bodyPartSetter option {
background-color:#036896; /*VARIABLE*/
color:#FFFFFF;
}

#bodyLabel p{
margin:0px 0px 8px 0px;
}

#bodyLabel a{
color:#FFFFFF;
}

#closer {
position:relative;
float:right;
width:21px;
height:18px;
background-color:#036896; /*VARIABLE*/
margin:0px 0px 0px 0px;
cursor:pointer;
color:white;
font-family: 'Poppins', sans-serif;
font-weight:100;
font-size:14px;
text-align:center;
padding:0px 0px 0px 0px;
border-radius:3px;
line-height:18px;
}


#closer::after {
	position:relative;
content:"X";
}

#closer:hover {
background-color:#229BD0; /*VARIABLE*/
}


#relatedLinksDiv {
position:relative;
display:block;
width:253px;
height:274px;
overflow:hidden;
float:right;
margin:34px 21px 0px 0px;
}

#relatedLinks {
font-size:14px;
position:relative;
background-color:#036896; /*VARIABLE*/
overflow-x:hidden;
overflow:auto;
margin:0px;
padding:3px 3px 15px 3px;
height:264px;
border-radius:2px;
}

#relatedArticlesLabel {
position:relative;
width:243px;
margin:0px 0px 0px 0px;
padding:0px;
text-align: center;
font-family: 'Poppins', sans-serif;
font-weight:200;
font-size:21px;
letter-spacing:4px;
}

#relatedArticlesLabel h1 {
position: :relative;
margin:0px 0px 0px 0px;
color:#FFFFFF;
font-size: 16px;
font-weight: 400;
padding:0px;
}

#relatedLinks p {
color:#e0e0ff;
text-align:left;
margin:6px 0px 4px 4px;
padding:0px 0px 5px 0px;
width:210px;
}

#relatedLinks p a {
font-family:Helvetica, Arial, Sans-serif;
font-weight:400;
color:#FFEEFD;
text-decoration:none;
}

#relatedLinks p a:hover {
text-shadow: 0 0 8px #FFFFFF;
}

#SymptomCheckerVisibilitySetter {
position:relative;
top:12px;
font-size:14px;
text-align:center;
display:block;
height:32px;
width:90%;
margin-left:auto;
margin-right:auto;
margin-bottom:32px;
background-color:#036896; /*VARIABLE*/
color:#FFFFFF; 
text-decoration:none;
cursor:pointer;
padding:5px 0px 0px 0px;
}

#SymptomCheckerVisibilitySetter:hover {
background-color:#229BD0;
}

#SymptomCheckerVisibilitySetter::after {
position:relative;
content:"Symptom Checker";
}

#SC_VsbltySttr {
cursor:pointer;
}


/*### MOBILE HAND-HELD ###*/
@media only screen and (max-width:600px) {
	#SymptomCheckerDiv {
	position:absolute;
	margin:0px auto 0px auto;
	top:8px;
	left:2%;
	width:97%;
	height:586px;
	padding:0px 0px 0px 0px;
	font-size:14px;
	}

	#SympChkrTitle {
	position:relative;
	display:block;
	margin:0px auto 0px auto;
	font-size:21px;
	padding:0px 0px 0px 0px;
	width:90%;
	float:none;
	height:24px;
	}

	#bodyGraphic {
	position:relative;
	left:0px;
	top:12px;
	display:block;
	margin:0px auto 0px auto;
	width:90%;
	height:236px;
	background-color:white;
	background-position: 28% -20px;
	}

	#bodyGraphic h1 {
	width:100%;
	}

	#bodyGraphic ul {
	position:absolute;
	left:-12px;
	top:48px;
	text-align:left;
	list-style:none;
	float: left;
	}

	#bodyGraphic ul li {
	font-size:16px;
	margin:18px 0px 0px 0px;
	padding:0px;
	list-style:none;
	background-image:none;
	}


	#bodyPartSetter {
	width:148px;
	}


	#closer {
	position:relative;
	margin:-21px 0px 0px 0px;
	}

	#relatedLinksDiv {
    position: relative;
    display: block;
    width: 90%;
    height: 238px;
    overflow: hidden;
    float: none;
    margin: 21px auto 0px auto;
	}

	#relatedArticlesLabel {
	width:90%;
	margin:0px auto 0px auto;
	font-weight:200;
	font-size:21px;
	letter-spacing:4px;
	}
}