@font-face {
    font-family: MyriadPro;
    src: url(../include/fonts/MyriadPro-Regular.otf);
    font-weight: normal;
}
@font-face {
    font-family: Avenir;
    src: url(../include/fonts/Avenir-Light.otf);
    font-weight: normal;
}
@font-face {
    font-family: AvenirMedium;
    src: url(../include/fonts/Avenir-Medium.otf);
}

html { overflow-x: hidden; }

* { margin: 0; padding: 0; }
body { font-family: MyriadPro; overflow-x: hidden; background: #98999c url(../images/body-bg.jpg) repeat-x; color: #373737; font-size: 16px; }
a { text-decoration: none; color: #00658f; }
p { line-height: 1.3em;  margin: 0 0 20px 0; }
h1, h2, h3, h4, h5 { color: #f46022;  }
h1 { font-size: 30px; color: #373737; margin-bottom: 15px; }
h2 { text-transform: uppercase; font-size: 19px; margin-bottom: 10px; }
h3 { margin-bottom: 6px; }
td { padding: 5px; vertical-align: top; }
img.centered { display: block; margin: 15px auto 25px auto; }
input[type=text], input[type=password], input[type=submit], textarea, button { padding: 3px; }
#content-left ul, #content-left li { margin: 0 0 15px 25px; padding-left: 10px; }
#content-left ul { margin: 0 0 25px 0; }
hr { margin: 25px 0; border: 1px solid #f0f0f0; }
.orange { color: #f46022; }
.orange-button { background: #f46022; color: white !important; padding: 6px 10px; display: block; float: left; font-weight: normal; border-radius: 6px; }
.pdf-link { background: url(../images/pdf-icon.jpg) no-repeat top left; padding: 15px 0 15px 55px; display: block; }
.pdf-link:hover { text-decoration: underline; }
.image-right { float: right; margin: 0 0 10px 10px; }
.on-mobile { display: none; }
.on-desktop { display: block; }
.alignleft { float: left; }
.alignright { float: right; }

#page {
	-webkit-transition: all 0.3s ease; transition: all 0.3s ease; position: relative; z-index: 101; 
	-o-transform: translate(0%, 0px);
	-webkit-transform: translate(0%, 0px);
	transform:translate(0%, 0px);
	width: 100%;
}

label.error { color: red; margin-left: 5px; float: none!important; width: auto!important; display: block; }

.wrapper { width: 1000px; margin: 0 auto; }

.google-ad { margin: 0 0 15px 0; }

#slider { clear: both; width: 100%; margin-bottom: 0; }
#slider div, #slider div img { height: 320px; }
#mobile-menu { display: none; }
#top-bar { background: #f37621; height: 43px; border: 1px solid #DB5900; border-width: 1px 0; color: white; z-index: 100; display: none; }
#header {  }
#header img { padding: 56px 8px 10px 8px; background: url(../images/logo-bg.jpg) repeat-x; border: 1px solid black; margin: 15px 0 10px 0; width: 288px; }
#header .wrapper { position: relative; }
#header .wrapper div { float: right; font-family: Avenir; text-transform: uppercase; color: #f37621; margin: 91px 0 0 0; }

#header #menu { font-family: Avenir; color: #c9cacc; position: absolute; top: 123px; right: 0; background: #00658f; border-radius: 7px; overflow: hidden; }
#header #menu li { list-style-type: none; float: left; margin: 0; padding: 10px 10px; font-size: 10px; }
#header #menu a { font-size: 14px; color: white; padding: 0 8px 5px 8px	; font-weight: normal; font-family: Arial }
#header #menu li.active { background: #f17a20; }

#content { background: white; }
#container { background: white;}
#content-left { width: 680px; float: left; margin-right: 0px; padding: 10px; margin-top: 15px; background: white; }
#content-left.full { width: 100%; }
#content-left img { max-width: 100%; }
#content-right { width: 270px; float: left; padding: 15px 15px 50px 15px; margin-top: 15px; border-width: 2px 0 0 0; font-family: Avenir; background: white; }

#content-right #news a { color: #f37621; }
#content-right #news h2 { font-size: 16px; border-bottom: 1px solid silver; padding-bottom: 10px; margin-bottom: 10px; }
#content-right #news { margin-top: 25px;}
#content-right #products { margin-bottom: 10px; }

#content-left.home-content { margin-top: 0; border: 0; }
#all-designs { display: block;  margin-bottom: 25px; }

.home-content div.item { clear: both; margin: 0 0 30px 0; overflow: auto;}
.home-content div.item img { float: left; width: 36.7647%; }
.home-content div.item .text { float: right; width: 60.2941%; }
.home-content div.item .orange-button { float: right; margin: 0px 0 0 0; }


.home-details p { margin-bottom: 10px; }
.home-details #main-image { margin: 0 0 15px 0; }
.home-details .col-left { width: 60%; float: left; box-sizing: border-box; padding: 0 15px 0 0; }
.home-details .col-right { width: 40%; float: left; box-sizing: border-box; }
.home-details b { font-size: 19px; }
.enquire-button {
	color: white; background: #00658f url(../images/button-right-arrow.png) no-repeat right; display: inline-block; padding: 8px 15px; border-radius: 5px; padding-right: 55px;
	margin: 0 0 15px 0; }
}
.enquire-button:hover { background-color: #046C98; }

.news { border-bottom: 1px dotted silver;  margin: 0 0 10px 0; padding: 10px 0; }
.news:last-child { border: 0; }
.news h2 { font-size: 20px; }

#faq-scroll { height: 200px; overflow: hidden; 	position: relative; font-size: 18px; }
#faq-scroll div.faqItem { margin: 0 0 10px 0; padding: 0 0 10px 0; border-bottom: 1px solid #f0f0f0; }
#faq-scroll div.inner { position: absolute; left: 0; top: 0; }
#faq-scroll div.faqItem p { font-size: 18px; }

#gallery a { margin: 10px 10px 15px 10px; display: block; float: left; text-align: center; width: 130px; height: 160px;}
#gallery a img { border: 1px solid #789; padding: 5px; border-radius: 5px; display: block; margin: 0 auto; margin-bottom: 8px; }
.gallery { margin: 0 15px 10px 0px; }

#footer { background: #212121; padding: 15px; color: white; text-align: center; }
#footer a { color: white; padding: 0 5px; }

.design { width: 100%; margin: 0 0 20px 0; clear: both; overflow: hidden; line-height: 19px; }
.design .design-image { float: left; margin: 0 10px 0 0; width: 345px; }
.design .contents { float: right; width: 320px; }
.design h2 { color: #333333; font-size: 18px; }
.design p { color: #666; margin-bottom: 10px; }
.design a { color: #2D9FCE; }
.design .price { color: #666; float: none; font-weight: bold; }	
.design .icons img { vertical-align: top; }

#contact-form .field { margin: 0 0 10px 0; overflow: auto; }
#contact-form .field label { width: 36%; float: left;  }
#contact-form input[type="text"], #contact-form textarea, #contact-form div.text-field, #contact-form select  { font:13px Arial; box-sizing:border-box;  width: 63%; float: left; border: 1px solid #c1c1c1; padding: 5px; }

#contact-form label.error { margin-left:0px; padding:5px;  box-sizing:border-box; font:13px Arial; background:#FFE8E9; float:left !important; margin-bottom:15px; }
#contact-form div.text-field { border: 0; padding: 5px 0; }
#contact-form textarea { height: 70px; }
#contact-form input[type="submit"] { border: 0; padding: 5px 10px;}
#contact-form .full label { width: 100%; padding-bottom: 5px; }
#contact-form .full select { margin-left: 25%; }

#contact-form .orange-button { float:right; font-size:18px; padding:8px 20px; text-transform:uppercase; margin-top:20px;  }
.err_msg { display:block; width:100%;  padding:5px;  box-sizing:border-box; color:#990000; font:15px Arial; background:#FFE8E9;  margin-bottom:15px; text-align:center; }
.msg_thk_nw { display:block; width:100%;  padding:5px;  box-sizing:border-box; color:#006600; font:15px Arial; background:#EDFCEB;  margin-bottom:15px; text-align:center; }

#design-details #images { margin: 0 0 15px 0; overflow: auto; }
#design-details #images #main { width: 470px; float: left; display: block; }
#design-details #images #thumbnails { width: 200px; float: right;}
#design-details #images #thumbnails img { margin-bottom: 10px; border: 1px solid silver; cursor: pointer; }
#design-details #images #thumbnails .orange-button { margin: 0 auto; display: block; width: 105px; float: none; }

.capch { float:left; width:100%; margin-top:20px; }
.g-recaptcha { float:left; }