/*   
Theme Name: Claims 4 Negligence
Description: Claims 4 Negligence 2014 Responsive
Author: Lava Design Studio
Author URI: http://www.lavadesignstudio.co.uk
Version: 1
*/


/* ------------- "generic" styles */

:focus { outline: 0; }

* {
	margin: 0;
  	padding: 0;
	border: 0;
}

body {
	background:#fff;
	font-family:Arial, Helvetica, sans-serif; font-size:14px;
	color:#666;
}

a {text-decoration: none; color: #000000;}
a:hover {text-decoration: underline;}

p {margin-bottom: 15px; line-height: 22px;}


h1 {
	color: #4497c5;
	font-size: 28px;
	font-weight: normal;
	margin-top: 5px;
	margin-bottom: 10px;
	font-family: 'vag_thin';
	}

h2 {
	color: #4497c5;
	font-size: 22px;
	font-weight: normal;
	margin-top: 5px;
	margin-bottom: 10px;
	font-family: 'vag_thin';
	}

h3 {
	color: #4497c5;
	font-size: 18px;
	font-weight: normal;
	margin-top: 5px;
	margin-bottom: 10px;
	font-family: 'vag_thin';
	}
	
.breadcrumbs {
	margin: 0px 0px 10px 0px;
	}	
	
@font-face {
    font-family: 'vag_bold';
    src: url('font/vag_bold.eot');
    src: url('font/vag_bold.eot?#iefix') format('embedded-opentype'),
         url('font/vag_bold.woff') format('woff'),
         url('font/vag_bold.ttf') format('truetype'),
         url('font/vag_bold.svg') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'vag_thin';
    src: url('font/vag_thin.eot');
    src: url('font/vag_thin.eot?#iefix') format('embedded-opentype'),
         url('font/vag_thin.woff') format('woff'),
         url('font/vag_thin.ttf') format('truetype'),
         url('font/vag_thin.svg') format('svg');
    font-weight: normal;
    font-style: normal;
}	

/* ------------- "wrapper" styles */

div#wrapper {
	margin: 0 auto;
	max-width: 960px;
	min-width: 250px;
	padding-left: 20px;
	padding-right: 20px;
	}
	
/* ------------- "header" styles */
	
div#header {
	position: relative;
	height: 90px;
	max-width: 960px;
	}
	
div#logo {
	display: block;
	position: absolute;
	top: 20px;
	left: 0px;
	width: 233px;
	height: 50px;
	}
	
div#callusfreeon {
		float: right;
		width: 349px;
		height: 113px;
		background: url(images/callusfreeon.png);
		margin-top: 6px;
		}
	

/* ------------- "top_nav" styles */
	
div#top_nav_container {
	height: 41px;
	width: 100%;
	clear: both;
	margin-bottom: 12px;
	background: url(images/nav_bg.png) repeat-x;
	border: 1px solid #ccc;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	}	
	
ul#top_nav {
	float: left;
	height: 41px;
	}
	
					ul#top_nav li {
						float: left;
						display: inline;
					}
				
					ul#top_nav li a {
						text-decoration: none;
						float: left;
						display: block;
						color: #333;
						height: 41px;
						font-size: 16px;
						padding-left: 13px;
						padding-right: 13px;
						line-height: 40px;
						border-right: 1px solid #ccc;
					}

					ul#top_nav li a.highlighted {
						margin-top: -1px;
						margin-left: -1px;
						text-decoration: none;
						float: left;
						display: block;
						color: #9e4418;
						height: 41px;
						font-size: 16px;
						padding-left: 13px;
						padding-right: 13px;
						line-height: 40px;
						text-shadow: 1px 1px 0px #ffffff;
       				 	filter: dropshadow(color=#ffffff, offx=1, offy=1);
						background: #ffe45e;
						border-left: 1px solid #ffaf00;
						border-right: 1px solid #ffaf00;
						border-top: 1px solid #ffaf00;
						border-bottom: 1px solid #ffaf00;
					}	
					
					ul#top_nav li a.highlighted:hover {background: #ffaf00;}				
	
					
/* ------------- "mob_nav" styles */	

div#mob_nav_container {
	display: none;
	background: #eee;
	width: 100%;
	margin-bottom: 20px;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	overflow: hidden;
	}	
	
	ul#mob_nav {
		
		}	
		
		ul#mob_nav li {
			list-style-type: none;
		}		
		
			ul#mob_nav li a {
			display: block;
			height: 35px;
			line-height: 35px;
			padding-left: 20px;
			border-bottom: 1px solid #ddd;
		}	
		
		ul#mob_nav li a:hover {
			background: #ddd;
			text-decoration: none;
			}
		
		ul#mob_nav li:last-child a {border: 0px;}	
		
		
a.mob_menu_btn	{
	display: none;
	position: absolute;
	top: 28px;
	right: 15px;
	background: #ccc;
	width: 38px;
	height: 38px;
	cursor: pointer;
	background: url(images/mob_menu_btn.png);
	background-position: 0px 0px;
	}
	
	a.mob_menu_btn.display {
		background: url(images/mob_menu_btn.png);
		background-position: 0px -38px;
		}	
		
					

@media only screen
	and (max-width : 1000px) {
		ul#top_nav li a {font-size: 14px;}
		ul#top_nav li a.highlighted {font-size: 14px;}
	}			
	
@media only screen
	and (max-width : 900px) {
		ul#top_nav li a {font-size: 12px;}
		ul#top_nav li a.highlighted {font-size: 12px;}
	}		
	
@media only screen
	and (max-width : 818px) {
		div#top_nav_container {display: none;}
		a.mob_menu_btn { display: block;}
	}	
			
@media only screen
	and (min-width : 818px) {
		div#mob_nav_container {display: none!important;}
	}	
				
					
/* ------------- "banner" styles */				
					
div#banner {
	position: relative;
	float: right;
	width: 100%;
	max-width: 960px;
	min-height: 280px;
	margin-bottom: 20px;
	background: url(images/call_girl.png) no-repeat #3774a2;
	background-position: 48% 26px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
	}	
	
	div#callusnow {
		position: relative;
		margin-top: 25px;
		margin-left: 30px;
		float: left;
		width: 270px;
		background: #fff;
		-webkit-border-radius: 14px;
		-moz-border-radius: 14px;
		border-radius: 14px;
		padding: 15px;
		}	
		
		div#callusnow p {
			font-family: 'vag_thin';
			font-size: 24px;
			line-height: 26px;
			color: #3774a2;
			}	
			
			div#callusnow p strong {font-family: 'vag_bold'; font-weight: normal;}
			
		div#callusnow p span {
			float: left;
			font-size: 32px;
			color: #ffa100;
			margin-bottom: 15px;
			font-family: 'vag_bold'; font-weight: normal;
			}	
			
		span.bubble_left {
			width: 25px;
			height: 17px;
			display: block;
			position: absolute;
			top: 100px;
			left: 328px;
			background: url(images/bubble_left.png);
			}	
			
		span.bubble_right {
			width: 25px;
			height: 17px;
			display: block;
			position: absolute;
			top: 80px;
			right: 335px;
			background: url(images/bubble_right.png);
			}		
			
				
@media only screen
	and (max-width : 860px) {
	div#banner {background: #3774a2;}
	}	

	
	
	
ul.banner_bullets {
		float: left;
		width: 92%;
		min-height: 30px;
		margin-bottom: 20px;
		background: #eee;
		padding-left: 4%;
		padding-right: 4%;
		padding-top: 10px;
		padding-bottom: 3px;
		-webkit-border-radius: 8px;
		-moz-border-radius: 8px;
		border-radius: 8px;
		overflow: hidden;
		text-align: center;
		}
		
		ul.banner_bullets p {font-family: 'vag_thin'; font-size: 24px; color: #333; line-height: 28px; margin-bottom: 27px; font-weight: normal;}
		ul.banner_bullets p strong {font-family: 'vag_bold'; font-weight: normal;}
		
		ul.banner_bullets li {
			display: inline-block;
			list-style-type: none;
			background: url(images/banner_tick.png)no-repeat;
			background-position: 0px 5px;
			height: 30px;
			line-height: 30px;
			color: #333;
			font-size: 18px;
			padding-left: 30px;
			margin-right: 20px;
			margin-bottom: 8px;
			font-family: 'vag_thin';
			}	
					
@media only screen
	and (max-width : 850px) {
		ul.banner_bullets {}
		ul.banner_bullets li {}
	}				
		
					
/* ------------- "claim_form" styles */					

form#claimnow {
	float: right;
	margin-top: 25px;
	margin-right: 30px;
	width: 278px;
	padding: 15px;
	background: #fff;
	-webkit-border-radius: 14px;
	-moz-border-radius: 14px;
	border-radius: 14px;
	}
	
	form#claimnow p {
			font-family: 'vag_thin';
			font-size: 24px;
			color: #3774a2;
			margin-bottom: 20px;
		}
		
		form#claimnow p strong {font-family: 'vag_bold'; font-weight: normal;}
	
	form#claimnow input {
		width: 255px;
		height: 27px;
		background: #fff;
		padding: 5px 10px 5px 10px;
		margin-bottom: 8px;
		-webkit-border-radius: 6px;
		-moz-border-radius: 6px;
		border-radius: 6px;
		border: 1px solid #ccc;
	   -moz-box-shadow:    inset 0 0 7px #ddd;
	   -webkit-box-shadow: inset 0 0 7px #ddd;
	   box-shadow:         inset 0 0 7px #ddd;
		}	
		
	form#claimnow input:focus {
		border: 1px solid #75a7ea;
		-moz-box-shadow:    inset 0 0 7px #75a7ea;
	   -webkit-box-shadow: inset 0 0 7px #75a7ea;
	   box-shadow:         inset 0 0 7px #75a7ea;
		}	
		
	form#claimnow select {
		width: 319px;
		height: 37px;
		background: url(images/form_input_bg.png);
		padding: 9px;
		margin-bottom: 10px;
		}	
		
		form#claimnow button#submit_button {
			margin-top: 7px;
			width: 279px;
			height: 60px;
			background: url(images/sign_up.png) top repeat-x #8ec307;
			cursor: pointer;
			-webkit-border-radius: 6px;
			-moz-border-radius: 6px;
			border-radius: 6px;
			}
			
			form#claimnow button#submit_button:hover {
				background-position: 0px -60px;
				}
				
			p#details_secure {
				position: absolute;
				width: 210px;
				bottom: -1px;
				left: 70px;
				color: #fff;
				}	
				
			span.keptsafe {
				clear: both;
				display: block;
				width: 170px;
				height: 35px;
				background: url(images/padlock.png) left no-repeat;
				padding-left: 35px;
				font-size: 12px;
				padding-top: 3px;
				}	
	

	
@media only screen
	and (max-width : 760px) {
		div#callusnow {
			background: none;
			width: 100%;
			text-align: center;
			color: #fff;
			margin: 20px 0px 20px 0px;
			padding: 0;
			}
		div#callusnow p {color: #fff;}
		div#callusnow p span {float: none;}
		span.bubble_left {display: none;}
		span.bubble_right {display: none;}		
		
		form#claimnow {
			float: none;
			clear: both;
			background: none;
			width: 400px;
			margin: 20px auto;
			text-align: center;
			color: #fff;
			padding: 0;
			}
		form#claimnow p {color: #fff;}	
		form#claimnow input {border: 0px;}	
		form#claimnow input:focus {border: 0px;}
		span.keptsafe {margin: auto;}	
		}	


@media only screen
	and (max-width : 450px) {
		div#callusnow {margin: 0px; width: 90%;padding: 5%;}
		form#claimnow { width: 90%;padding: 5%;}
		}
		
@media only screen
	and (max-width : 356px) {
		div#callusnow p {font-size: 20px;}
		form#claimnow p {font-size: 20px;}
		form#claimnow input {width: 90%;}
		form#claimnow button#submit_button {width: 100%;}
		form#claimnow button#submit_button img {width: 96%; height: auto;}
		div#logo {width: 175px; margin-top: 8px;}
		div#logo img {width: 100%; height: auto;}
		}		








.certainfield {
	display: none
}	

form#claimnow_big {
	position: relative;
	font-size: 14px;
	margin-bottom: 50px;
	}
	
form#claimnow_big label {
	font-size: 12px;
	margin-bottom: 2px;
	display: block;
	}	



form#claimnow_big input {
	width: 164px;
	padding: 8px;
	height: 17px;
	background: #f4f4f4;
	background-position: 0 -941px;
	text-indent: 3px;
	color: #666;
	margin-right: 2px;
	margin-bottom: 15px;
	font-size: 13px;
	border: 1px solid #ddd;
	}



form#claimnow_big textarea {
	width: 344px;
	padding: 8px;
	height: 234px;
	background: #f4f4f4;
	text-indent: 3px;
	color: #666;
	margin-right: 2px;
	margin-bottom: 10px;
	font-size: 13px;
	border: 1px solid #ddd;
	}

		

button#submit_button_big {
	position:relative;
	padding-left: 15px;
	padding-right: 15px;
	height: 40px;
	cursor: pointer;
	background: url(images/sign_up.png);
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	color: #fff;
	font-family: 'vag_bold';
	font-size: 20px;
	}
	
	button#submit_button_big:hover {
		background: url(images/sign_up.png);
		background-position: 0px -60px;
		}
	
@media only screen
	and (max-width : 450px) {
		form#claimnow_big input {width: 90%; border: 1px solid #ddd;}
		form#claimnow_big textarea {width: 90%; border: 1px solid #ddd;}
		button#submit_button_big {width: 96%;}
		}		
		
		
/* ------------- "sidebar" styles */


div#sidebar {
	width: 210px;
	float: right;
	}
	
div.claimtypes {
	width: 190px;
	float: left;
	padding: 0px 10px 10px 10px;
	margin-bottom: 8px;
	border: 1px solid #d9d9d9;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
	}
	
	div.claimtypes ul li {
			padding: 7px 0px 7px 0px;
			list-style-type: none;
			border-bottom: 1px dashed #ccc;
			}
			
		div.claimtypes ul li:last-child {border-bottom: none;}
			
		div.claimtypes ul li a {text-decoration: none; color: #666;}
		div.claimtypes ul li a:hover {text-decoration: underline; color: #666;}
		
		div.claimtypes ul li.title a {
			color: #4497c5;
			}
	
div.claim_amounts a {
	width: 190px;
	float: left;
	padding: 0px 10px 10px 10px;
	margin-bottom: 8px;
	text-decoration: none;
	border: 1px solid #d9d9d9;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
	}
	
	span.clickhere {
		width: 124px;
		height: 39px;
		display: block;
		background: url(images/basesprite.png);
		background-position: 0 -808px;
		}
	
	div.claim_amounts a:hover > span.clickhere {background: url(images/basesprite.png) 0px -847px;}
	
	span.body {float: right; height: 110px; width: 54px; margin-top: -25px; display: block; background: url(images/basesprite.png); background-position: 0 -150px;}
	span.news {float: right; background-position: 0 -1421px; width: 40px; height: 32px; display: block;}
	
		
div.latestnews {
	width: 190px;
	float: left;
	padding: 0px 10px 10px 10px;
	margin-bottom: 8px;
	border: 1px solid #d9d9d9;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
	}
	
	div.latestnews ul li {
			padding: 7px 0px 7px 0px;
			list-style-type: none;
			border-bottom: 1px dashed #ccc;
			}
			
			div.latestnews ul li:last-child {border-bottom: none;}

			div.latestnews h3 a {color: #4497c5;}
			div.latestnews h3 a:hover {text-decoration: underline;}
			
		ul.headlines {
			margin-top: 10px;
			}
		
/* ------------- "main_content" styles */				
			
div#main_content {
	width: 100%;
	background: url(images/maincontent_bottom.png) no-repeat bottom;
	background-color: #fff;
	float: left;
	}
	
	div#main_content h2 {color: #4497c5; font-size: 24px; margin-bottom: 10px;}
	
	div#main_body {
		float: left;
		width: 74%;
		}
	
	div#main_body li {
	margin-left: 14px;
	padding: 0px 0px 8px 0px;
	}
	
	div#main_body li.calc {
	margin-left: 0px;
	padding: 0px;
	}

	

	div#main_body ul {
	padding: 0px 0px 12px 0px;
	}
	


@media only screen
	and (max-width : 920px) {
		div#main_body {width: 70%;}
		}	
		
@media only screen
and (max-width : 820px) {
	div#main_body {width: 68%;}
	}		
	
@media only screen
and (max-width : 750px) {
	div#main_body {width: 60%;}
	}		
	
@media only screen
and (max-width : 630px) {
	div#main_body {width: 100%;}
	div#sidebar {margin-top: 20px; width: 100%;}
	div.claimtypes {width: 100%; padding: 0px; border: 0px;}
	div.claimtypes h3 {border-bottom: 1px solid #eee; padding-bottom: 8px;}
	div.claimtypes ul {margin-bottom: 15px;}
	div.claim_amounts {width: 100%;}
	div.claim_amounts a {width: 94%; padding: 3%; margin-top: 20px;}
	}			
	
	
		
/* ------------- "footer" styles */					
	
div#footer {
	margin-top: 10px;
	margin-bottom: 15px;
	float: left;
	clear: both;
	width: 100%;
	max-width: 960px;
	height: 45px;
	background: #f3f3f3;
	border: 1px solid #ccc;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	}
	
	div#footer p {
		float: left;
		max-width: 400px;
		font-size: 12px;
		line-height: 45px;
		text-indent: 10px;
		}
	
	ul#nav_bottom {
	float: right;
	margin-right: 20px;
	}
	
					ul#nav_bottom li {
					float: left;
					display: inline;
					}
				
					ul#nav_bottom li a {
						padding: 0px 10px 0px 10px;
						line-height: 45px;
						text-decoration: none;
						float: left;
						overflow: hidden;
						display: block;
						font-size: 12px;
					}
					
					ul#nav_bottom li a:hover {text-decoration: underline;}
	
	p.smallprint {clear: both; max-width: 500px; margin: 10px auto; text-align: center; font-size: 12px;}
	
	p.regulation {text-align: center; font-size: 12px; color: #bbb; line-height: 16px; margin-bottom: 20px;}
	
	
@media only screen
	and (max-width : 650px) {
		ul#nav_bottom {display: none;}
		}		
	
	
	
	
	
	
	
	
	
	