@charset "utf-8";

/* CSS Document */

/* v1.0 | 20080212 */

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, caption, tbody, tfoot, thead{
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align:middle;
	background: transparent;
}

body {
	line-height: 1.2em;
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
}
.blue{
background-color:#0D2A70;
	}

ol, ul {
	list-style: none;
}

blockquote, q {
	quotes: none;
}

blockquote:before, blockquote:after, q:before, q:after {
	content: '';
	content: none;
}

/* remember to define focus styles! */
:focus {
	outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
	text-decoration: none;
}

del {
	text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
}

p {
	font-size:	12px;
	line-height:1.2em;
}

tr, td{
	
}

#textual_content_area li{
	font-size:	14px;
	color:#fff;	
	list-style-type:circle;
	list-style-position:inside;
}

h1, h2, h3, h4{
	margin-bottom:15px;
	font-weight:normal;
} 

p {
	margin-bottom:10px;
	font-weight:normal;
}

#wrapper {
	width:1014px;
	margin:0 auto 20px auto;
}

/*Header Area*/

#header {
	height:189px;
	background:#FFF;
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
}

#logo {
	width:395px;
	height:189px;
	float:left;
}

#header_content {
	float:right;
	width:515px;
	margin-right:45px;
	overflow:hidden;
}

#header_contact {
}

#header_contact h2 {
	font-size:14px;
	margin-bottom:5px;
	color:#ad8b57;
}

#header_content p {
	color:#0d2970;
}

.contact_block {
	margin-top:45px;
	width:280px;
	float:left;
}

.phone_number {
	margin-top:5px;
	font-size:16px;
}

#header_shop {
	margin-top:35px;
	float:right;
	width:195px;
}

#header_shop p {
	color:#ad8b57;/*Menu Area*/
	
	
}

#left_menu {
	width:395px;
	height:50px;
	float:left;
}

#left_menu ul {
}

#left_menu li {
	float:left;
	display:block;
	white-space:nowrap;
	position:relative;
	z-index:1;
}

#left_menu a, #left_menu a:visited {
	display:block;
	text-align:center;
	height:35px;
	vertical-align:middle;
	font-size:12px;
	text-decoration:none;
	background:#ad8b57;
	color:#fff;
	border-right:1px solid #CCC;
	padding:15px 0 0 0;
}


#left_menu a:hover, #left_menu ul ul a:hover {
	color:#ad8b57;
	background:#fff;
}

/* a hack so that IE5.5 faulty box model is corrected */

.right_menu {
	width:619px;
	height:50px;
	float:left;
	position:relative;
	
}

.right_menu ul {
	padding:0;
	margin:0;
	list-style-type:none;
}

.right_menu ul ul {
}

.right_menu li {
	float:left;
	display:block;
	white-space:nowrap;
	position:relative;
	z-index:1;
}

.right_menu ul li a, .right_menu ul li a:visited {
	display:block;
	text-align:left;
	height:45px;
	vertical-align:middle;
	font-size:12px;
	text-decoration:none;
	background:#3e6bb2;
	color:#fff;
	border-left:1px solid #CCC;
	padding:5px 0 0 20px;
}

/* a hack so that IE5.5 faulty box model is corrected */

* html .right_menu a, * html .right_menu a:visited {
}

/* style the second level background */
.right_menu ul ul a.drop, .right_menu ul ul a.drop:visited {
	background:#3e6bb2 url(http://www.cssplay.co.uk/menus/breadcrumbs/grey-arrow.gif) no-repeat 130px center;
}

/* style the second level hover */
.right_menu ul ul a.drop:hover {
	background:#3e6bb2 url(http://www.cssplay.co.uk/menus/breadcrumbs/blue-arrow.gif) no-repeat 130px center;
}

.right_menu ul ul :hover > a.drop {
	background:#3e6bb2 url(http://www.cssplay.co.uk/menus/breadcrumbs/blue-arrow.gif) no-repeat 130px center;
}

/* style the third level background */

.right_menu ul ul ul a, .right_menu ul ul ul a:visited {
	background:#0D2A70;
}

/* style the third level hover */
.right_menu ul ul ul a:hover {
	background:#0D2A70;
}

.right_menu ul ul li {
	width:180px;
}

.right_menu ul li ul li a, .right_menu ul li ul li a:visited {
	display:block;
	text-align:left;
	height:25px;
	vertical-align:middle;
	font-size:12px;
	text-decoration:none;
	background:#fff;
	color:#0D2A70;
	padding:0px 0 0 20px;
	padding-top:5px;
	border-left:0px;
}

.right_menu ul li ul li a:hover, .right_menu ul li ul li a:visited:hover {
	display:block;
	text-align:left;
	height:25px;
	vertical-align:middle;
	font-size:12px;
	text-decoration:none;
	background:#3e6bb2;
	color:#fff;
	padding:0px 0 0 20px;
	padding-top:5px;
}

.right_menu ul ul li a {
	padding:0px;
}

/* hide the sub levels and give them a positon absolute so that they take up no room */
.right_menu ul ul {
	position:absolute;
	height:0;
	top:50px;
	left:0;
	width:180px;
	visibility: hidden;
}

/* another hack for IE5.5 */
* html .right_menu ul ul {
	top:50px;
	t\op:50px;
}

/* position the third level flyout menu */
.right_menu ul ul ul {
	left:150px;
	top:-1px;
	width:180px;
	border-left: 1px solid #d4d8bd;
}

/* position the third level flyout menu for a left flyout */
.right_menu ul ul ul.left {
	left:-150px;
}

/* style the table so that it takes no ppart in the layout - required for IE to work */
.right_menu table {
	position:absolute;
	top:0;
	left:0;
	border-collapse:collapse;
	;
}

/* style the second level links */
.right_menu ul ul a, .right_menu ul ul a:visited {
	background:#d4d8bd;
	color:#000;
	height:auto;
	padding:15px 10px;
	width:180px;
	border-width:0 1px 1px 1px;
}

/* yet another hack for IE5.5 */
* html .right_menu ul ul a, * html .right_menu ul ul a:visited {
	width:180px;
	w\idth:150px;
}

/* style the top level hover */
.right_menu a:hover, .right_menu ul ul a:hover {
	color:#0D2A70;
	background:#fff;
}

.right_menu :hover > a, .right_menu ul ul :hover > a, .right_menu ul li a:hover{
	color:#0D2A70;
	background:#fff;
}

/* make the second level visible when hover on first level list OR link */
.right_menu ul li:hover ul, .right_menu ul a:hover ul {
	visibility:visible;
}

/* keep the third level hidden when you hover on first level list OR link */
.right_menu ul :hover ul ul {
	visibility:hidden;
}

/* make the third level visible when you hover over second level list OR link */
.right_menu ul :hover ul :hover ul {
	visibility:visible;
}


/* right menu WHEN USED ON WHITE PAGES*/

.right_menu_white {
	width:619px;
	height:50px;
	float:left;
	position:relative;
	
}

.right_menu_white ul {
	padding:0;
	margin:0;
	list-style-type:none;
}

.right_menu_white ul ul {
}

.right_menu_white li {
	float:left;
	display:block;
	white-space:nowrap;
	position:relative;
	z-index:1;
}

.right_menu_white ul li a, .right_menu_white ul li a:visited {
	display:block;
	text-align:left;
	height:45px;
	vertical-align:middle;
	font-size:12px;
	text-decoration:none;
	background:#0d2a70;
	color:#fff;
	border-left:1px solid #CCC;
	padding:5px 0 0 20px;
}

/* a hack so that IE5.5 faulty box model is corrected */

* html .right_menu_white a, * html .right_menu_white a:visited {
}

/* style the second level background */
.right_menu_white ul ul a.drop, .right_menu_white ul ul a.drop:visited {
	background:#0d2a70 url(http://www.cssplay.co.uk/menus/breadcrumbs/grey-arrow.gif) no-repeat 130px center;
}

/* style the second level hover */
.right_menu_white ul ul a.drop:hover {
	background:#3e6bb2 url(http://www.cssplay.co.uk/menus/breadcrumbs/blue-arrow.gif) no-repeat 130px center;
}

.right_menu_white ul ul :hover > a.drop {
	background:#3e6bb2 url(http://www.cssplay.co.uk/menus/breadcrumbs/blue-arrow.gif) no-repeat 130px center;
}

/* style the third level background */

.right_menu_white ul ul ul a, .right_menu_white ul ul ul a:visited {
	background:#0d2a70;
}

/* style the third level hover */
.right_menu_white ul ul ul a:hover {
	background:#3e6bb2;
}

.right_menu_white ul ul li {
	width:180px;
}

.right_menu_white ul li ul li a, .right_menu_white ul li ul li a:visited {
	display:block;
	text-align:left;
	height:25px;
	vertical-align:middle;
	font-size:12px;
	text-decoration:none;
	background:#0d2a70;
	color:#fff;
	padding:0px 0 0 20px;
	padding-top:5px;
	border-left:0px;
}

.right_menu_white ul li ul li a:hover, .right_menu_white ul li ul li a:visited:hover {
	display:block;
	text-align:left;
	height:25px;
	vertical-align:middle;
	font-size:12px;
	text-decoration:none;
	background:#3e6bb2;
	color:#fff;
	padding:0px 0 0 20px;
	padding-top:5px;
}

.right_menu_white ul ul li a {
	padding:0px;
}

/* hide the sub levels and give them a positon absolute so that they take up no room */
.right_menu_white ul ul {
	position:absolute;
	height:0;
	top:50px;
	left:0;
	width:180px;
	visibility: hidden;
}

/* another hack for IE5.5 */
* html .right_menu_white ul ul {
	top:50px;
	t\op:50px;
}

/* position the third level flyout menu */
.right_menu_white ul ul ul {
	left:150px;
	top:-1px;
	width:180px;
	border-left: 1px solid #d4d8bd;
}

/* position the third level flyout menu for a left flyout */
.right_menu_white ul ul ul.left {
	left:-150px;
}

/* style the table so that it takes no ppart in the layout - required for IE to work */
.right_menu_white table {
	position:absolute;
	top:0;
	left:0;
	border-collapse:collapse;
	;
}

/* style the second level links */
.right_menu_white ul ul a, .right_menu_white ul ul a:visited {
	background:#d4d8bd;
	color:#000;
	height:auto;
	padding:15px 10px;
	width:180px;
	border-width:0 1px 1px 1px;
}

/* yet another hack for IE5.5 */
* html .right_menu_white ul ul a, * html .right_menu_white ul ul a:visited {
	width:180px;
	w\idth:150px;
}

/* style the top level hover */
.right_menu_white a:hover, .right_menu_white ul ul a:hover {
	color:#fff;
	background:#3e6bb2;
}

.right_menu_white :hover > a, .right_menu_white ul ul :hover > a, .right_menu_white ul li a:hover{
	color:#fff;
	background:#3e6bb2;
}

/* make the second level visible when hover on first level list OR link */
.right_menu_white ul li:hover ul, .right_menu_white ul a:hover ul {
	visibility:visible;
}

/* keep the third level hidden when you hover on first level list OR link */
.right_menu_white ul :hover ul ul {
	visibility:hidden;
}

/* make the third level visible when you hover over second level list OR link */
.right_menu_white ul :hover ul :hover ul {
	visibility:visible;
}




/*Content Area*/


#main_background {
	background-color:#001d68;
	background-image:url(Images/blue_bg.jpg);
	background-repeat:no-repeat;
	background-position:top left;
	min-height:550px;
}

#white_background {
	background-color:#fff;
	background-image:url(Images/white_bg.jpg);
	background-repeat:no-repeat;
	background-position:top left;
	min-height:550px;
	padding-left:50px;

}

#left_rotating {
	width:395px;
	float:left;
}

#textual_content_area {
	float:left;
	margin-left:60px;
	margin-top:45px;
	width:460px;
}

#textual_content_area h1 {
	color:#ad8b57;
	font-size:24px;
}

#textual_content_area p {
	color:#FFFFFF;
	font-size:14px;
}

#textual_content_area p bold {
	font-size:20px;
	color:#ad8b57;
}

.clear {
	clear:both;
	width:100%;
	height:10px;
}


/*For white pages*/

#left_textual_content_area {
	float:left;
	margin-left:25px;
	margin-top:45px;
	width:325px;
	margin-left:-25px;
	height:255px;
}

#left_textual_content_area h1 {
	color:#ad8b57;
	font-size:24px;
}

#left_textual_content_area p {
	color:#0d2970;
	font-size:14px;
}

#left_textual_content_area p bold {
	font-size:20px;
	color:#ad8b57;
}

.door_block{
	float:left;
	margin-left:50px;
	margin-top:45px;
	width:250px;

}

.door_block_top{
height:40px;
width:250px;
background:url(Images/door_block_top.jpg);
color:#fff;
}

.door_block_top h2{
padding:10px 10px 10px 10px;}


.door_block_inside{
border:1px solid #001e67;
min-height:210px;
color:#001e67;
padding:10px 10px;
}

.door_thumb{
float:left;
margin:0px 10px 0px 5px;
}

.door_text{
	font-size:11px;
}

.door_options{
font-size:10px;	
}



/*For product Pages*/
#left_image_content_area {
	float:left;
	margin-left:25px;
	margin-top:45px;
	width:325px;
	margin-left:-25px;
	text-align:center;
}

.door_information_block{
	float:left;
	margin-left:50px;
	margin-top:45px;
	width:570px;

}

.door_information_block h1 {
	color:#ad8b57;
	font-size:24px;
}

.door_information_block h2 {
	color:#0d2970;
	font-size:16px;
}

.door_information_block p {
	color:#0d2970;
	font-size:14px;
}


.door_information_block p bold {
	font-size:20px;
	color:#ad8b57;
}

.door_purchase_block {
	float:left;
	width:570px;
	margin-top:20px;
}

.door_purchase_block_top{
height:30px;
width:560px;
background:url(Images/door_purchase_block_top.jpg);
color:#fff;
padding-top:10px;
padding-left:10px;
}
.door_purchase_block_inside{
border:1px solid #001e67;
color:#001e67;
padding:10px 10px;
}

.important_information{
width:300px;	
}


.important_information p{
font-size:11px;}
