/* ---------------------------------
			layout
   --------------------------------- */

body {
	background-color: #86A0C8;
	margin: 0px;
	padding: 0px;
	font-family: Arial, Helvetica, sans-serif;
}
.top-bar {																/* top white bar containing logo */
	background-color: #FFFFFF;
	height: 100px;
	width: 100%;
}
.logo-bar {
	text-align: left;
	width: 800px;
	background-image: url(http://www.channelferries.co.uk/images/top-bar-bg.jpg);
	height: 67px;
}
.nav-bar {																
	background-image: url(http://www.channelferries.co.uk/images/nav-bar-bg.jpg);
	background-repeat: no-repeat;
	height: 34px;
	width: 800px;
}
.spacer-bar {															/* spacer bar above tabs to add space */
	height: 8px;
	width: 700px;
}
.nav-table {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	text-transform: capitalize;
	height: 25px;
	line-height: 15px;
}
.nav-td {																/* blue line seperator between tabs */
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #b4c6e0;
}
.nav-td:hover {
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #b4c6e0;
	background-color: #E0E6EF;
	text-decoration: none;
}
.blue-line {															/* blue line across page under tabs */
	background-color: #1F4B9E;
	height: 20px;
	width: 100%;
}
.page-bg {
	background-color: #FFFFFF;
	padding: 10px;
	width: 780px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #5B5B5B;
}
.page-body {															/* text container for page body */
	width: 760px;
	text-align: left;
	padding-top: 0px;
	padding-bottom: 0px;
}
.footer {
	background-image: url(http://www.channelferries.co.uk/images/footer-bg.jpg);
	background-repeat: no-repeat;
	background-position: bottom;
	height: 65px;
	width: 800px;
	text-align: left;
	margin: 0px;
	padding: 0px;
	background-color: #1E4B9E;
}
.light-blue-hr {
	background-color: #86A0C8;
	height: 3px;
	width: 770px;
}

                                                                    /* strap line*/
#strap {
	width:752px;
	height:93px;
	background-image:url(../images/strap.jpg);
	background-repeat:no-repeat;
	padding-bottom:4px;
	
}

#strap-text {
	text-align:left;
	width:750;
	padding:32px 10px 10px 42px;
}







                                                                    /* tabbed forms*/

#tab_form {
	float:left;
	margin: 5px auto 0px auto;
	width:342px;
	padding:1px;
}

#tab {
	float:left;
	padding:1px;	
}

ul.tabs {
	
	margin:0px; padding:0px;
}

ul.tabs li {
	
	list-style:none;
	display:inline;
}

ul.tabs li a {
	background-color:#fff;
	color:#1F4B9E;
	padding:8px 14px 8px 14px;
	text-decoration:none;
	font-size:12px;
	font-family:Arial,Helvetica,sans-serif;
	font-weight:bold;
	border:1px solid #B4C6E0; 
}
ul.tabs li a:hover {
	background-color:#E0E6EF;
	border-color:#B4C6E0;
	text-decoration:underline;
}
ul.tabs li a.active {
	background-color:#1F4B9E;
	color:#fff;
	border:1px solid #B4C6E0; 
	border-bottom: 1px solid #1F4B9E;
}

.content {
	background-color:#FFFFFF;
	padding:1px;
	border:1px solid #B4C6E0; 	
}

#content_2, #content_3 { 
	display:none; 
}

ul.tabs {
	
	margin:0px; padding:0px;
	margin-top:5px;
	margin-bottom:8px;
}

#routemap {
float:left;
padding:8px;
}

#routemap2 {
float:right;
padding:8px;
}

.box-headertab {															/* blue box header bar */
	height: 25px;	
	width: 187px;
	text-align: left;
	margin: 0px;
	padding: 0px 0px 0px 0px;
	background-color: #1F4B9E;
	color: #FFFFFF;
	font-weight: bold;
	font-size: 16px;
	line-height: 24px;
	font-family: "Gill Sans", Arial, Helvetica, sans-serif;
}

.box-headertab2 {															/* blue box header bar */
	height: 25px;	
	width: 187px;
	text-align: left;
	margin: 0px;
	padding: 0px 0px 0px 0px;
	background-color: #1F4B9E;
	color: #FFFFFF;
	font-weight: bold;
	font-size: 16px;
	line-height: 24px;
	font-family: "Gill Sans", Arial, Helvetica, sans-serif;
	}
	

	

/* ---------------------------------
			typography
   --------------------------------- */
   
   
   h1 {
	font-family: "Gill Sans", Arial, Helvetica, sans-serif;
	font-size: 18px;
	font-weight: bold;
	color: #1F4B9E;
}
  h2 {
	font-family: "Gill Sans", Arial, Helvetica, sans-serif;
	font-size: 18px;
	font-weight: bold;
	color: #1F4B9E;
}

  h3 {
	font-family: "Gill Sans", Arial, Helvetica, sans-serif;
	font-size: 15px;
	font-weight: bold;
	color: #1F4B9E;
}
  .boldblue {
	font-family: "Gill Sans", Arial, Helvetica, sans-serif;
	font-size: 18px;
	font-weight: bold;
	color: #1F4B9E;
}

  .boldblue2 {
	font-family: "Gill Sans", Arial, Helvetica, sans-serif;
	font-size: 25px;
	font-weight: bold;
	color: #FF0600;
}



/* ---------------------------------
			links
   --------------------------------- */


a:link {
	color: #1F4B9E;
	text-decoration: none;
}
a:visited {
	color: #1F4B9E;
	text-decoration: none;
}
a:hover {
	color: #1F4B9E;
	text-decoration: underline;
}
.footer-links {
	padding: 15px 8px 8px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	text-transform: capitalize;
	color: #FFFFFF;
	text-align: center;
}
.footer-links :link {
	color: #FFFFFF;
}
.footer-links :hover {
	color: #CDD9ED;
}
.footer-links :visited {
	color: #FFFFFF;	
}
.button_on {															/* changes selected tab colour according to page url */
	background-color: #1F4B9E;
	color: #FFFFFF;
	height: 26px;
	line-height: 26px;
}
.button_on :link {
	background-color: #1F4B9E;
	color: #FFFFFF;
	height: 26px;
	line-height: 26px;
}
.button_on :visited {
	background-color: #1F4B9E;
	color: #FFFFFF;
	height: 26px;
	line-height: 26px;
}
.button_off {
	color: #1F4B9E;
}


/* ---------------------------------
			boxes & form layout
   --------------------------------- */
   
   	
.box-header {															/* blue box header bar */
	height: 25px;	
	width: 260px;
	text-align: left;
	margin: 0px;
	padding: 0px 0px 0px 8px;
	background-color: #1F4B9E;
	color: #FFFFFF;
	font-weight: bold;
	font-size: 16px;
	line-height: 24px;
	font-family: "Gill Sans", Arial, Helvetica, sans-serif;
}

.box-header2 {															/* blue box header bar */
	height: 25px;	
	width: 295px;
	text-align: left;
	margin: 0px;
	padding: 0px 0px 0px 8px;
	background-color: #1F4B9E;
	color: #FFFFFF;
	font-weight: bold;
	font-size: 16px;
	line-height: 24px;
	font-family: "Gill Sans", Arial, Helvetica, sans-serif;
}

.white-form-bg {														/* iframe container */
	background-color: #FFFFFF;
	padding: 0px;
	width: 98%;
	height: 234px;
	margin: 3px;
	text-align: center;
}
.small-form-table {
	border: 1px solid #CCCCCC;
	color: #1F4B9E;
	font-size: 11px;
	line-height: 30px;
	text-transform: capitalize;
}
.clear-button {
	padding: 3px;
	border: 1px solid #B2B2B2;
	color: #848484;
	font-size: 11px;
	background-color: #CCCCCC;
	margin-top: 8px;
	margin-left: 35px;
}
.submit-button {
	padding: 3px;
	border: 1px solid #6C82A3;
	color: #FFFFFF;
	font-size: 11px;
	background-color: #1F4B9E;
	margin-top: 8px;
}
.formfield {
	padding: 3px;
	border: 1px solid #FF6600;
	color: #999999;
	font-size: 11px;
	background-color: #EE9E01;
}
.divider {
	background-color: #CCCCCC;
	height: 1px;
	margin: 8px;
	width: 90%;
}



/* ---------------------------------
			columns layout
   --------------------------------- */
   
   
.blue-column {
	background-color: #FFFFFF;
	padding: 1px;
	float: left;
	height: 180px;
	margin: 10px 3px 4px 4px;
	width: 180px;
	text-align: left;
	background-image: url(../images/column-bg.gif);
}


/* ---------------------------------
			hidden Div
   --------------------------------- */
   

.results_nav {
	height: 22px;
	width: 765px;
	border: 1px solid #80B7E9;
	padding-top: 3px;
	padding-left: 8px;
	margin-top: 3px;
	margin-bottom: 0px;
	padding-bottom: 0px;
	background-color: #EBF1F4;
	text-align: left;
	text-decoration: none;
	font-size: 13px;
	font-family: "Gill Sans", Arial, Helvetica, sans-serif;
	font-weight: bold;
	line-height: 19px;
}
.results_box {
	width: 765px;
	border-top: 0px none;
	border-right: 1px solid #80B7E9;
	border-bottom: 1px solid #80B7E9;
	border-left: 1px solid #80B7E9;
	padding-top: 8px;
	padding-left: 8px;
	padding-bottom: 1px;
	font-size: 11px;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: normal;
}


/* ---------------------------------
			FAQ styles
   --------------------------------- */
   

.faqcontainer {
	width: 95%;
}
.faq_box {
	background-color: #EDEDED;
	text-align: left;
	padding: 8px;
	width: 100%;
	border: 1px solid #CCCCCC;
	line-height: 25px;
	font-weight: bold;
}
.answers_box {
	text-align: left;
	padding: 8px;
	width: 100%;
	border-top: 1px none #CCCCCC;
	border-right: 1px solid #CCCCCC;
	border-bottom: 1px solid #CCCCCC;
	border-left: 1px solid #CCCCCC;
}



/* ---------------------------------
			popup
   --------------------------------- */
   
   
   .popup-header {
	text-align: left;
	width: 590px;
	background-image: url(../images/popup-header.jpg);
	height: 74px;
}
   .popup-title {
	text-align: left;
	width: 590px;
	background-image: url(../images/popup-button-bg.jpg);
	height: 26px;
	font-size: 16px;
	font-weight: bold;
	color: #1F4B9E;
	line-height: 26px;
	text-transform: capitalize;
}
.popup-page {
	background-color: #FFFFFF;
	padding: 10px;
	width: 570px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #5B5B5B;
	text-align: left;
}
.popup-footer {
	background-image: url(../images/popup-footer.jpg);
	background-repeat: no-repeat;
	background-position: bottom;
	height: 15px;
	width: 590px;
	text-align: left;
	margin: 0px;
	padding: 0px;
	background-color: #1E4B9E;
}
   
 /* ---------------------------------
			freight page
   --------------------------------- */
   
#freight {
	width:750px;
	height:2840px;
	padding:1px;	
}

#country {
	text-align:left;
}

#location {
	height:15px;
	width:100px;
	float:left;
	padding:2px;
	margin:10px;
	text-align:center;
}

#overflow {
	padding-left:250px;
	width:750px;
    
}

#locationover {
	float:left;
	height:15px;
	width:100px;
	padding:2px;
	margin:10px;
}

#euro {
	width:775px;
	text-align:left;
	}
	
#eurolinks {
	float:left;
	width:300px;
	margin-right:20px;
	text-align:left;
	border-style:solid;
	border-width:3px;
	border-color:#1F4B9E;
	}