/* 

STYLE SHEET FOR Dsvid Gamble Mediation
Created by Webfooted Designs
www.webfooteddesigns.co.uk

ToC

	1. defaults
	2. structure
	3. links and navigation
	4. fonts
	5. images

Notes

*/

/* source-sans-pro-regular - latin */
@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 400;
  src: local(''),
       url('../fonts/source-sans-pro-v19-latin-regular.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('../fonts/source-sans-pro-v19-latin-regular.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/* source-sans-pro-italic - latin */
@font-face {
  font-family: 'Source Sans Pro';
  font-style: italic;
  font-weight: 400;
  src: local(''),
       url('../fonts/source-sans-pro-v19-latin-italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('../fonts/source-sans-pro-v19-latin-italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/* source-sans-pro-700 - latin */
@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 700;
  src: local(''),
       url('../fonts/source-sans-pro-v19-latin-700.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('../fonts/source-sans-pro-v19-latin-700.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/* source-sans-pro-700italic - latin */
@font-face {
  font-family: 'Source Sans Pro';
  font-style: italic;
  font-weight: 700;
  src: local(''),
       url('../fonts/source-sans-pro-v19-latin-700italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('../fonts/source-sans-pro-v19-latin-700italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}





/* --------- 1. defaults  --------- */

* {
		margin: 0;
		padding: 0;
		}

body {
		background: #cfedf2 url(../images/bgtile.jpg);
		}
		
/*  --------- 2. structure  --------- */

#wrapper {
		width: 980px;
		margin: 0 auto;
		}
		
#branding {
		
		margin: 5px auto 0 auto;
		background-color: #3C4A5E;
		text-align: center;
		padding: 5px 0;
		}
		
#content {
		background: #ffffff;
		border-top-left-radius: 20px;
		border-top-right-radius: 20px;
		-moz-border-radius-topleft: 20px;
		-moz-border-radius-topright: 20px;
		}
		
.contentlist {
		font-size: 1.8em;
		margin-left: 53px;		
		}
		
.contentlist li {
		margin-bottom: 20px;
		}
		
#testimonials {
		background: #317785 url(../images/testimonialsbg.png) no-repeat;		
		height: 207px;
		margin: 25px 0 30px 0;
		padding: 50px 0 0 20px;
		}
		
.quote {
		width: 450px;
		float: left;		
		color: #ffffff;
		margin-right: 30px;		
		}
		
.rightquote {
		margin-right: 0; /* the right margin isn't needed here */
		}
		
#contactdetails {
		text-align: center;
		margin-bottom: 40px;
		}
		
.contactdark {
		color: #000000;
		}
		
#footer {
		background-color: #384a5f;
		text-align: center;
		padding: 10px 0 10px 0;
		-webkit-box-shadow: 0 -5px 5px 0 rgba(211, 211, 211, 1);
		-moz-box-shadow: 0 -5px 5px 0 rgba(211, 211, 211, 1);
		box-shadow: 0 -5px 5px 0 rgba(211, 211, 211, 1);
		margin-top: 20px;
		clear: both;
		}
		
#credit {
		text-align: right;
		}


/* ---------- 3. links and navigation ---------- */

#skiplink {
		position: absolute;
		left: -9999px;
		}

a {	
		color: #666666;
		text-decoration: none;
		}
		
#footer a {
		color: #ffffff;
		}
		
a:hover {
		text-decoration: underline;
		}
			
		
.contactdark a {
		color: #000000;
		}

#navigation {
		height: 60px;		
		padding: 0 0 0 50px;
		background-color: #317785;
		font-size: 2em;
		margin-bottom: 35px;
		background-image:
		-moz-linear-gradient(top, rgba(50, 120, 134, 1), /* for mozilla browsers */
		rgba(68, 131, 144, 1) 50%,
		rgba(49, 119, 133, 1) 50%,
		rgba(49, 119, 133, 1));	
		background-image: 
		-webkit-gradient(linear, 0% 0%, 0% 100%, /* Safari & Chrome */
		from(#327886), 
		color-stop(0.50, #448390), 
		color-stop(0.50, #317785), 
		to(#317785));
		background-image:
		-o-linear-gradient(top, rgba(50, 120, 134, 1), /* Opera */
		rgba(68, 131, 144, 1) 50%,
		rgba(49, 119, 133, 1) 50%,
		rgba(49, 119, 133, 1));  
		background-image:  /* W3C syntax */
		linear-gradient(180deg, 
		#327886, 
		#448390 50%, 
		#317785 50%, 
		#317785);
		-webkit-box-shadow: 0 5px 5px 0 rgba(211, 211, 211, 1);
		-moz-box-shadow: 0 5px 5px 0 rgba(211, 211, 211, 1);
		box-shadow: 0 5px 5px 0 rgba(211, 211, 211, 1);
		}

#navigation a {
		color: #ffffff;
		display: block;
		float: left;
		height: 40px;
		vertical-align: middle;
		padding: 20px 25px 0 25px;
		text-decoration: none;				
		border-right: 1px solid #5b919c;
		}
		
#navigation .firstlink {		
		padding-left: 0;
		}
	
		
#navigation .lastlink {
		border-right: none;
		}

#navigation ul {
		list-style: none;
		}

#navigation li {
		float: left; /* this is applied to the li as well for compatibility with earlier versions of IE (7 and earlier) */
		}
		
/* ---------- 4. fonts ---------- */

html {
		font-size: 100%;
		}

body {
		font-size: 62.5%;
		font-family: 'Source Sans Pro', sans-serif;
		color: #666666;
		}

h1, h2, h3, h4, p, ul {
		}

h1 {
		margin: 0 0 25px 35px;
		font-size: 3em;
		color: #1c7d83;
		}

h2 {
		margin: 25px 0 25px 35px;
		font-size: 3em;
		color: #1c7d83;
		clear: right;
		}
		
h3 {
		margin: 15px 0 5px 35px;
		font-size: 2em;
		color: #1c7d83;
		clear: right;
		}		
		
#contactdetails h2 {
		margin: 0;		
		}

h3 {
		}
		
h4 {
		}

p {
		font-size: 1.8em;
		margin: 0 35px 10px 35px;		
		line-height: 1.5em;
		}
		
#branding p {
		color: #317785;
		font-size: 3em;
		}
		
#testimonials p {
		font-size: 2.2em;
		line-height: 1.2em;
		}
		
.quotecredit {
		color: #000000;
		font-size: 1.8em !important;
		}
		
#contactdetails p {
		font-size: 2.2em; 
		}
		
#footer p {
		color: #ffffff;
		font-size: 1.2em;
		margin-bottom: 0;
		}
		
#footer p#footercontacts {
		color: #ffffff;
		font-size: 1.2em;
		width: 520px;
		margin: 0 auto;
		}	

#contentul {
		font-size: 1.8em;
		margin: 20px 0 20px 60px;
		}
		
#contentul li {
		line-height: 1.5em;
		}

/* ---------- 5. images ---------- */

a img {
		border: none;
		}
		
.mainphoto {
		float: right;
		margin: 0 15px 20px 15px;
		padding-left: 15px;
		border-left: 1px solid #d8d7d8;
		}
		
#contactdetails img {
		margin-right: 5px;
		vertical-align: middle;
		}
		
.footerlogo {		
		float: left;
		margin-right: 10px;
		}
		
p.pdf {
		padding-left: 40px;
		background: url(../images/pdficon_large.png) no-repeat;
		height: 32px;
		margin-left: 40px;
		}
		
#awards {
		float: left;
		margin-left: 150px;
	}		
		

/* ---------- 6. tables ---------- */	

table {
		font-size: 1.8em;
		margin: 35px;
		width: 880px;
		border-collapse: collapse;
		}
		
th, td {
		vertical-align: top;
		padding: 5px;
		text-align: left;
		width: 25%;
		border: 1px solid #d8d7d8;
		}
		

/* ---------- 6. form ---------- */			
		
form {
		font-size: 1.6em;
		width: 430px;
		
		}
		
form p {
		font-size: 0.8em;			
		}
		
form fieldset {
		position: relative;		
		border: none;
		margin-bottom: 0;
		background-color: #EAEDF0;
		padding: 30px 10px 10px 10px;
		margin-top: -10px;
		}
		
form legend {
		position: absolute; /* absolutely positioned due to the various ways the browsers place the legend by default */
		top: 0;
		left: 10;
		font-weight: bold;		
		color: #4b4243;
		}
		
form label {
		display: block;
		float: left;
		width: 150px;
		clear: left;
		text-align: left;
		}
		
form div {
		margin-bottom: 10px;
		}
		
form input {
		padding: 2px;
		width: 200px;
		}	

#submit {
		margin-top: 10px;
		text-align: right;
	}		
	
#mandatory {
		text-align: right;
	}	
	
#contactdiv {
		float: left;
		margin-bottom: 50px;
	}	

#contactform {
		float: right;
		margin-right: 35px;
	}	
	
.warning {
		color: #C00000;
		}