/*============================= Page Personlization Starts ===============================*/



#header h1,
#header h2,
#header p {
	margin-left:2%;
	padding-right:2%;
}
.divider {display: none;}
.smaller { font-size:80%; }
.cutsheet {padding-left: 5px;cursor:pointer;font: 11px/15px Arial, Helvetica, sans-serif;}
.cutsheet a {display: block; padding: 15px 10px; margin-bottom: -10px}
.cutsheet b {display: block; margin-left:  40%; margin-top: -25px;font: 9px/15px Arial, Helvetica, sans-serif;}
.more-info ul{
	text-align: center;
	text-decoration-line: none;
}
.more-info ul li{margin-right: 20%;}
.design ul {
	height: 100px;
	text-decoration-line: none;
	margin-left: -10%
}

#help ul li{
	float:right;
	display:block
	position:relitive;
	margin-right:20px;
	padding-top:3px;
}
#help ul li a {font 12px/18px Arial, Helvetica, sans-serif;color: #0E7AB0;text-decoration:none;}
#wrapper3 {
	margin:.5%;
	clear:left;
	float:left;
	width:99%;
	overflow:hidden;
	background:#f3f1f1; 
	font: 12px/15px Arial, Helvetica, sans-serif;
	color:#384749;
	}
#wrapper3 h2{
	background-color: #d7d5d5;
	padding-left: 10px;
	padding-top:5px;
	height: 20px;
	margin: 3px 6px;	
}

#wrapper3 p{
	margin:10px;
}
#wrapper3 li {
	margin-left:5%;
	display: block;
	margin-bottom: 10px;
	text-decoration: none;
}
#wrapper3 ul li {
	
	position: relitive;
	top: 20px;
	display: inline-block;
}
#wrapper3 ul li a {
	float: right;
	position: relitive;
	padding-top:2px;;
	text-decoration: none;
	display: inline-block;
	font: 12px/15px Arial, Helvetica, sans-serif;
	font-weight: bold;
	color:#384749;
}
/* Start of Column CSS */
#container4 {
	border: 2px solid #373737;
	clear:left;
	float:left;
	width:99.5%;
	overflow:hidden;
	background:#fff; /* column 4 background colour */
}
#container4 h3{
	background-color: #E1E1E1;
	color: #686868;
	text-align: center;	
	padding-left: 6px;
	height: 22px;
	padding-top:5px;
	margin-left:2px;
	margin-rignt: 1px;
	border-right: 2px solid white;
	border-left: 2px solid white;
	border-bottom: 2px solid black;
	
}
#container3 {
	clear:left;
	float:left;
	width:100%;
	position:relative;
	right:25%;
	background:#fff; /* column 3 background colour */
	border-right: 2px solid #373737;
}
#container2 {
	clear:left;
	float:left;
	width:100%;
	position:relative;
	right:25%;
	background:#fff; /* column 2 background colour */
	border-right: 2px solid #373737;
}
#container1 {
	float:left;
	width:100%;
	position:relative;
	right:25%;
	background:#fff; /* column 1 background colour */
	border-right: 2px solid #373737;
}
#col1 {
	float:left;
	width:25%;
	position:relative;
	left:75%;
	overflow:hidden;
}
#col1 img{width: 98%;padding-left:2px}
#col1 p {height: 150px;}
#col1 ul li a{color: #384749;text-decoration: none;}
#col1 h2 {
	color: #686868;
	font: 14px/22px Arial, Helvetica, sans-serif;
	height: 22px;
	padding-top: 2px;
	text-align: center;

	margin-bottom: 10px;
}
#col2 {
	float:left;
	width:25%;
	position:relative;
	left:75%;
	overflow:hidden;
}
#col2 img{width: 98%;padding-left:2px;}
#col2 p {height: 150px;}
#col2 ul li a{color: #384749;text-decoration: none;}
#col2 h2 {
	color: #686868;
	font: 14px/22px Arial, Helvetica, sans-serif;
	height: 22px;
	padding-top: 2px;
	text-align: center;

	margin-bottom: 10px;
}
#col3 {
	float:left;
	width:25%;
	position:relative;
	left:75%;
	overflow:hidden;
}
#col3 img{width: 98%;padding-left:2px;}
#col3 p {height: 150px;}
#col3 ul li a{color: #384749;text-decoration: none;}
#col3 h2 {
	color: #686868;
	font: 14px/22px Arial, Helvetica, sans-serif;
	height: 22px;
	padding-top: 2px;
	text-align: center;

	margin-bottom: 10px;
}
#col4 {
	float:left;
	width:25%;
	position:relative;
	left:75%;
	overflow:hidden;
}
#col4 img{width: 98%;padding-left:2px;}
#col4 p {height: 150px;}
#col4 ul li a{color: #384749;text-decoration: none;}
#col4 h2 {
	color: #686868;
	font: 14px/22px Arial, Helvetica, sans-serif;
	height: 22px;
	padding-top: 2px;
	text-align: center;

	margin-bottom: 10px;
}  
.more-info {color: #13AC99}
/*============================= Responsive Media 780px ===============================*/
@media screen and (max-width: 780px) {
#col1 p {height: 200px;}
#col2 p {height: 200px;}
#col3 p {height: 200px;}
#col4 p {height: 200px;}
#container3 {
	clear:left;
	float:left;
	width:100%;
	position:relative;
	right:0%;
	border-right: 2px solid #373737;
}
#container2 {
	clear:left;
	float:left;
	width:100%;
	position:relative;
	right:0%;
	background:#fff; /* column 2 background colour */
	border-right: 2px solid #373737;
}
#container1 {
	float:left;
	width:100%;
	position:relative;
	right:50%;
	background:#fff; /* column 1 background colour */
	border-right: 2px solid #373737;
}	
	
#col1 {
	float:left;
	width:50%;
	position:relative;
	left:50%;
	overflow:hidden;
}	

#col2 {
	float:left;
	width:50%;
	position:relative;
	left:50%;
	overflow:hidden;
}	

#col3 {
	float:left;
	width:50%;
	position:relative;
	left:50%;
	overflow:hidden;
}	

#col4 {
	float:left;
	width:50%;
	position:relative;
	left:50%;
	overflow:hidden;
}

}

/*============================= Responsive Media 480px ===============================*/
@media screen and (max-width: 478px) {
#title-long {display:none;}
#title-short {display:block;}	
.cutsheet1 ul li b a {font: 16px/30px Arial, Helvetica, sans-serif;}
#cutsheet2 ul li b a {font: 16px/30px Arial, Helvetica, sans-serif;}
#cutsheet3 ul li b a {font: 16px/30px Arial, Helvetica, sans-serif;}
#cutsheet4 ul li b a {font: 16px/30px Arial, Helvetica, sans-serif;}
.divider {display: block; margin-left: 2%; height: 10px;}
.design ul {padding-left: 10%;}
#container3 {
	clear:left;
	float:left;
	width:99.2%;
	position:relative;
	right:0%;
	border-right: 2px solid #373737;
}
#container2 {
	clear:left;
	float:left;
	width:100%;
	position:relative;
	right:0%;
	background:#fff; /* column 2 background colour */
	border-right: 2px solid #373737;
}
#container1 {
	float:left;
	width:99.5%;
	position:relative;
	right:100%;
	background:#fff; /* column 1 background colour */
	border-right: 2px solid #373737;
}	
#col1 p {height: 80px;}
#col2 p {height: 80px;}
#col3 p {height: 80px;}
#col4 p {height: 80px;}	
#col1 {
	float:left;
	width:100%;
	position:relative;
	left:100%;
	overflow:hidden;
}	
#col2 {
	float:left;
	width:100%;
	position:relative;
	left:100%;
	overflow:hidden;
}	
	
#col3 {
	float:left;
	width:100%;
	position:relative;
	left:100%;
	overflow:hidden;
}	
#col4 {
	float:left;
	width:100%;
	position:relative;
	left:100%;
	overflow:hidden;
}	


}