/* General Styling */


body {

	font-family: 'Raleway', sans-serif;
	margin: 0px;
	background-color: #ffffff; 
	
}
 
/* Header Tags Styling */


h1 { 

	font-family: 'Raleway', sans-serif;
	font-size: 30px;
	color: #808080;
	padding: 15px 10px 15px 0px;
	display: block;
	font-weight: normal; 

}
 
h1#intro { 

	font-family: 'Raleway', sans-serif;
	font-size: 50px; 
	color: #ffffff;  
	padding: 150px 10px 15px 0px;
	display: block; 
	font-weight: normal;  
	margin: 0; 
	text-align: center;  
	text-shadow: 0px 0px 10px #101010;     
    
}


h2{ 
 
	font-family: 'Raleway', sans-serif;
	font-size: 14px;
	color: #303030;
	display: block;
 
}

h3{

	font-size: 18px;
	background-color: #fff;
	color: #858585;
	padding: 10px 10px 10px 10px;
	border-bottom: 1px solid #efefef;
	display: block;
	margin-bottom: 25px;

}


/* Horizontal Rules Styling */


hr.light {

	border: 0;
	width: 90%;
	color: #dbdbdb;
	background-color: #dbdbdb;
	height: 1px;

}



/* Clearing Floats Styling */


.clear {

	clear: both;

}



/* Lists Styling */


ul li{

	font-size: 18px;
	color: #808080;
	
}



/* Image Styling */ 


img.style {

	padding: 10px 10px 10px 10px;
    box-shadow: 0 0 20px rgba(0,0,0,0.4);
	margin: 5px;
 
}

img.right-align {

	float: right;
	padding: 10px 10px 10px 10px;
    box-shadow: 0 0 20px rgba(0,0,0,0.4);
	margin-left: 10px;

}


/* This centers all the page content */

#wrap {

	width: 80%;
	height: 100%;
	margin: 0 auto;
	background-color: #ffffff;
	margin-bottom: 30px;
 
}  
 


/* Header Styling */

#header {

	width: 100%;  
	height: 140px;  
	/*background-color: #385F70;      */
	background-color: #4883A5; 
	padding: 0px 0px 0px 0px;   
	text-align: center; 
	border-top: 5px solid #4883A5; 
	border-bottom: 5px solid #4883A5;  
   
}   
 


/* Intro-Area2 Styling (For every page except the homepage)*/

#intro-area {

	width: 100%;
	height: 399px; 
	background-image: url('images/banner.jpg');  
    background-position: center center;
    background-size: 100%; 
    background-repeat: no-repeat; 
	margin: 0;    

} 

#intro-area-banner {

	width: 1000px; 
	height: 30px;
	margin: auto;
	padding-top: 10px;

}




img.bg {
  /* Set rules to fill background */
  min-height: 100%;
  min-width: 1000px;
	 
  /* Set up proportionate scaling */
  width: 100%;
  height: auto;
	
  /* Set up positioning */
  position: fixed;
  top: 0;
  left: 0; 
}  

@media screen and (max-width: 1024px) { /* Specific to this particular image */
  img.bg { 
    left: 50%;
    margin-left: -500px;   /* 50% */
  }
} 



/* Main_Content Styling (WITHOUT SIDEBAR)*/


#main-content {

	width: 100%; 
	background-color: #ffffff;
	
}

#main-content p {

	color: #606060;
	font-size: 16px;

}

#main-content a {

	color: #628fcc;
	font-size: 16px;
	text-decoration: none;
	padding: 1px 3px 1px 3px;

}

#main-content a:hover {

	background-color: #628fcc;
	color: #ffffff;
	font-size: 16px;
	text-decoration: none;

}


#main-left {

	width: 40%; 
	float: left;
	margin: 0px 0px 20px 0px;
	
}

#main-right {
 
	width: 60%;    
	float: left;
	margin: 0px 0px 20px 0px;
	
}

.content_white {

	width: 100%;    
	height: 100%;
	background-color: #ffffff;
	
}

.content_grey {
	 
	width: 100%;    
	height: 100%;  
	background-color: #f7f7f7; 
	border-top: 1px solid #cccccc;
	border-bottom: 1px solid #cccccc;

}

.content_blue { 
	 
	width: 100%;    
	height: 100%;  
	background-color: #E1ECF2;   
 
}

.content_center {
 
	width: 80%;    
	height: 100%;   
	padding: 40px 0px 60px 0px;  
	margin: auto;

}

.content_center p {

	color: #606060;
	font-size: 18px; 
	letter-spacing: 0.2px;	

}

/* Main_Content Styling (WITH SIDEBAR)*/


#main-content2 {

	width: 750px;
	background-color: #ffffff;
	float: right;
	
}

#main-content2 p {

	color: #606060;
	font-size: 16px;

}

#main-content2 a {

	color: #8552bc;
	font-size: 16px;
	text-decoration: none;
	padding: 1px 3px 1px 3px;

}

#main-content2 a:hover {

	background-color: #8552bc;
	color: #ffffff;
	font-size: 16px;
	text-decoration: none;

}


/* Directory Listings Styling */

img.supplier {

	float: left;
	padding: 10px 20px 10px 20px;
  

}

#main-content2 p.supplier {  

	color: #606060;
	font-size: 13px;

}

#main-content2 a.supplier {

	color: #8552bc;
	font-size: 13px;
	text-decoration: none;
	padding: 1px 3px 1px 3px;

}

#main-content2 a:hover.supplier {

	background-color: #8552bc;
	color: #ffffff;
	font-size: 13px;
	text-decoration: none;

}

/* Sidebar Styling */


#sidebar {

	width: 250px;
	background-color: #ffffff; 
	float: left;
	
}

#sidebar p {

	color: #606060;
	font-size: 16px;

}

#sidebar a {

	color: #989898;
	font-size: 16px;
	text-decoration: none;
	padding: 10px 10px 10px 10px;
	display: block;
	background-color: #ffffff;
	margin-right: 20px;

}

#sidebar a:hover {

	background-color: #f2f2f2;
	color: #989898;
	font-size: 16px;
	text-decoration: none;

}

#sidebar h2 {

	font-size: 18px;
	color: #909090;
	padding: 15px 10px 15px 10px;
	display: block;
	font-weight: normal;
	background-color: #ffffff;
	margin-right: 30px;
	margin-top: 21px;

}





/* Footer Styling */

#footer {

	height: 30px;
	width: 100%; 
	background-color: #698A9E;  
	border-bottom: 5px solid #cccccc;
	padding: 15px 15px 0px 10px;
	color: #ffffff; 
	font-size: 12px; 
	margin-top: 30px;
 
}
 
#footer p{

	color: #ffffff; 
	font-size: 12px; 

}

#footer a{

	text-decoration: none;
	font-size: 15px;
	color: #808080;
	background-color: inherit;
	font-size: 12px;
	padding: 2px 5px 2px 5px;

}

#footer a:hover{

	background-color: #dbdbdb;
	color: #505050;

}





 

/* Form Styling */

form.regular {

	font-size: 14px; 
	color: #505050; 
	margin: 20px 0px 20px 0px; 

} 

input.regularButton {

	width: 130px; 
	height: 35px;
	border: 1px solid #b7b7b7;
	font-size: 13px;
	color: #303030; 
	background-color: #e5e5e5;
	cursor: pointer;

}

input.regularButton:hover {

	background-color: #cccccc;

}
 
input.regular {

	display: block;
	width: 90%;
	height: 40px;
	border: 1px solid #b7b7b7;
	padding: 0px 0px 0px 0px;
	font-size: 16px;
	color: #808080;

}

textarea.regular { 

	font-family: arial; 
	width: 100%;
	height: 200px; 
	border: 1px solid #b7b7b7;
	padding: 10px 0px 0px 0px;
	font-size: 16px;
	color: #808080;

}






/* Table Styling */


table.contactForm {

	font-size: 16px;
	color: #808080;

}


table#openingTimes {

	color: #606060;
	font-size: 16px; 

}


table.default {
	width: 100%;
	font-size: 16px;   
	color: #505050;  
	border: 1px solid #cccccc;
	border-collapse: collapse;
	vertical-align: middle;
	/*line-height: 40px;*/
} 

tr.header {
	width: 100%;   
	color: #ffffff;       
	background-color: #4883A5;     
	border-bottom: 1px solid #76ABCC;  
	height: 100%; 
}  
 
tr.white {
	width: 100%; 
	background-color: #ffffff;
	/*border-bottom: 1px solid #e5e5e5; */
	height: 100%; 
	/*box-shadow: 0px 0px 15px #999999;*/ 
} 

tr.grey {
	width: 100%;     
	background-color: #e5e5e5; 
	height: 100%; 
} 

td.left_header {
	float: left;
	width: 69%;   
	text-align: center; 
	padding: 10px 0px 10px 0px;
}  
  
td.center_header {
	float: left; 
	width: 15%; 
	text-align: center;
	padding: 10px 0px 10px 0px;
	border-left: 1px solid #70A2C1; 
}

td.right_header {
	float: left;
	width: 15%;  
	text-align: center;
	border-left: 1px solid #70A2C1;  
	padding: 10px 0px 10px 0px; 
}

td.left {
	float: left;
	width: 69%;   
	text-align: center;
	padding: 10px 0px 10px 0px;
	/*box-shadow: 0px 0px 5px #606060; */
}  
 
td.center {
	float: left; 
	width: 15%; 
	text-align: center;
	padding: 10px 0px 10px 0px;
	border-left: 1px solid #cccccc;
	/*box-shadow: 0px 0px 5px #cccccc;*/
}

td.right {
	float: left;
	width: 15%; 
	text-align: center;
	border-left: 1px solid #cccccc;
	padding: 10px 0px 10px 0px;
	/*box-shadow: 0px 0px 5px #cccccc;*/
}