/*
Theme Name: Young Health Custom Theme
Theme URI: younghealth.co.uk
Description: custom theme
Version: 1.1
Author: youth media
Tags: mantle color, variable width, two columns, widgets

*/

html, body, ul, ol, li, p,td, h1,h2,h3,h4,h5,h6,form,fieldset,a,div,img { 
margin:0; padding:0; border:0;  }
a { outline:none; }

/*global HTML structure tags*/
body
{
	font-family: Arial,Verdana,Sans-serif;
	color: #333;
	font-size:0.8em;
	text-align:center;
	background:#EDECE6 url(/wp-content/themes/younghealth/images/bg.jpg) repeat-x left top;
padding-top:5px;
}

#wrapper {
margin-right: auto;
margin-bottom: 12px;
margin-left: auto;
border-top:6px solid #EEEBD7;
border-bottom:6px solid #EEEBD7;
width:760px;
height:auto;
background-color:#EEEBD7;
position: relative;
}

#wrap-inner {
margin:0px 6px;
width:auto;
height:auto;
text-align:left;
background-color:#FFF;
}

.gutter { padding:6px; }
.gutter2 { padding:12px; }

#head-logo2{
height:100px;
border-bottom:6px solid #EEEBD7;
}

#head-logo2 img
{
   height: 100px;
}

#head-search {
width:auto;
color:#FFFFFF;
font-size:.9em;
font-weight:bold;
text-align:left;
border-bottom:6px solid #EEEBD7;
padding: 10px 6px 6px 6px;
height: 30px;
}

#main-content {
width:auto;
background:#FFFFFF url(/wp-content/themes/younghealth/images/white.gif) top right repeat-y !important;
}

#main-inner {
}
#feature-links {
clear:both;
width:100%;
background-color:#FFFFFF;
}
#nav-footer {
text-align:center;
width:auto;
background-color:#D3DCDA;
padding:10px 0;
font-size:x-small;
color:#333333;
}
#footer-copyright {
text-align:center;
width:auto;
background-color:#FFFFFF;
padding:10px 0;
font-size:.9em;
}
#footer {
width:auto;
height:50px;
}

/* main content inner divs */

#main-left {
float:left;
width:154px;
background-color:#D3DCDA;
}

#main-right {
float:right;
text-align:left;
width:580px;
background:#FFFFFF !important;
}

/* elements */
#nav-footer a {
color:#333333;
}

#head-logo img {
margin:4px 0 0 6px;
}

#main-left img {
padding-bottom:6px;
}


/* other */
.clearfloat {
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}

/* head png */
#overlay {
position:absolute;
left:50%;
top:11px;
width:374px;
height:100px;
text-align:right;
z-index:9;
overflow:hidden;
}

#channelhead {
width:126px;height:auto;
}


/* navigation */

ul#navigation,ul#navigation ul {
list-style:none;
margin:0 0 10px 0;
}

ul#navigation li {
width:136px;
}

ul#navigation li a {
display:block;
width:100%;
text-decoration:none;
color:#FFFFFF;
padding:4px 2px;
}

ul#navigation li a:hover {
background-color:#999999 !important;
}

.subnav li a{
width:auto;
border-bottom:dashed;
border-bottom-color:#FFFFFF;
border-bottom-width:1px;
list-style:none;
background-color: #666666;
font-size:.9em;
}

#nav-footer ul {
list-style:none;
}

#nav-footer li {
display:inline;
}


#searchbox {
color:#333333;
padding-bottom:10px !important;
}
#searchbox .srch {
width:90%;
}


ul,ol {
list-style:outside;
margin:0 0 .6em 30px;

}

#youtube img {
margin:0 5px 5px 0;
height:auto;
cursor:pointer !important;
}

#youtube #youtubevideo {
width:425px;
height:344px;
border:1px solid #999999;
background-color:#DDDDDD !important;
margin-bottom:12px;
}

/* input fields in header */
#head-search label {
margin-right:5px !important;
}

#head-search .what {
width:200px;
padding-right:2px !important;
}

#head-search .where {
width:200px;
padding-right:2px !important;
background-color:#EEEEEE !important;
}

#head-search .postcode {
width:60px;
background-color:#EEEEEE !important;
}

/**************** CSS FOR THE GET ACTIVE JAVASCRIPT DRAG & DROP QUIZ *****************************/

#dragScriptContainer{	/* BIG DIV containing HTML needed for the entire script */
		width:550px;
		margin:0 auto;
		height:220px;
		margin-top:20px;
		padding:3px;
		-moz-user-select:no;
		overflow:hidden;
		background-color:#FFF;
		
	}
	#questionDiv{	/* Big div for all the questions */
		float:left;
		height:200px;
		width:300px;
		padding:2px;
		visibility:hidden;	/* Initial state  - Don't change this */
	}
	#answerDiv{	/* Big div for all the answers */
		float:right;
		height:200px;
		width:150px;
		border:1px solid #FFF;
		padding:2px;	
		visibility:hidden; /* Initial state  - Don't change this */
	}
	
	#questionDiv div,#answerDiv div,#dragContent div{	/* General rules for small divs - i.e. specific questions and answers */
		width:145px;
		height:20px;
		line-height:20px;		
		float:left;
		margin-right:2px;
		margin-bottom:2px;
		text-align:center;
	}
	
	#dragContent div{	/* Drag content div - i.e. specific answers when they are beeing dragged */
		border:1px solid #000;
	}
	
	#answerDiv .dragDropSmallBox{	/* Small answer divs */
		border:1px solid #000;
		cursor:pointer;
	}
	
	#questionDiv .dragDropSmallBox{	/* Small answer divs */
		border:1px solid #000;
		cursor:pointer;
		background-color: #FF9966;
	}
	
	#questionDiv div div{	/* DIV after it has been dragged from right to left box */
		margin:0px;
		border:0px;
		padding:0px;
		background-color:#FFF;
		cursor:pointer;
	}
	#questionDiv .destinationBox{	/* Small empty boxes for the questions - i.e. where answers could be dragged */
		border:0px;
		background-color:#DDD;
		width:147px;	/* Width of #questionDiv div + 2 */
		height:22px;
		
	
		
	}
	#questionDiv .correctAnswer{	/* CSS indicating correct answer */
		background-color:#009933;
		color:#fff;
		border:1px solid #000;
	}
	#questionDiv .wrongAnswer{	/* CSS indicating wrong answer */
		background-color:#CC0000;
		color:#fff;
		border:1px solid #000;
	}

	#dragContent div{
		background-color:#FFF;
	}

	#questionDiv .dragContentOver{	/* Mouse over question boxes - i.e. indicating where dragged element will be appended if mouse button is relased */
		border:1px solid #F00;
	}
	
	#answerDiv.dragContentOver{	/* Mouse over answer box - i.e. indicating where dragged element will be appended if mouse button is relased */
		border:1px solid #F00;
	}
	
	/* NEVER CHANGE THIS */
	#dragContent{
		position:absolute;
		display:none;
	}	
	
#survey_div{
	background-color: #D0D3FF;
	margin: 5px 5px 15px 5px;
	padding: 5px;
}

.pds-pd-link{
	display:none !important;
}

/*********************CSS for contraception-choices page***************************************/

#LARCS-table {
	border-collapse: collapse;
}

#LARCS-table #td-emergency-pecentage{
	padding: 0px; 
	vertical-align:top;
}

#LARCS-table #td-emergency-pecentage div{
	padding:5px;
}

#LARCS-table #td-emergency-content{
	padding: 0px; 
}

#LARCS-table #td-emergency-content table{
	border-collapse:collapse; 
	border-style:hidden; 
	height: 250px;
}

#clinic-opentime-table {
	border-collapse: collapse;
	width: 100%;
}

#clinic-opentime-table .td-open-time{
	height: 50px;
	width: 106px;
}

#clinic-opentime-table td{
	border-color: #a50021;
}

#clinic-opentime-table  th{
	background-color: #a50021;
	text-align: center;
}

#clinic-opentime-table .td-colspan{
	padding: 0px;
	vertical-align: top;
}

#clinic-opentime-table .td-colspan table{
	border-collapse: collapse;
	border-style: hidden;
	width: 100%;
	height: 100px;
	padding: 0px;
}

#clinic-opentime-table .td-colspan .td-open-time{
	height: 50px;
	width: 106px;
}

#clinic-opentime-table .td-colspan .td-contact-number{
}

#clinic-opentime-table .td-colspan .td-appointments{
	background-color: #f2dcdb;
}
