/* Coded By : Darren Lynch / darren@designfresh.co.uk / Design Fresh Ltd */

/* --- GLOBAL STYLES --- */
body { font-size:12px; line-height:16px; font-family: 'Raleway', Arial, Helvetica, Verdana, sans-serif; margin:0; padding:0; min-width:330px; background:#dddddd url(../images/bodyBg.gif) repeat; color:#000000; text-align:left;}
img { display:block; border:0; }
p { padding:0; margin:0; }
address { font-style:normal;}

/* --- TOP LINKS --- */
#topBarContainer {background: #dcb000 url(../images/topBarContainerBg.gif) repeat;}
#topBar { max-width:1200px; margin:0 auto; padding: 9px 0; font-family: 'Open Sans', Arial, Helvetica, Verdana, sans-serif; font-size:14px; color:#ffffff;}
#telephoneEmail { float:right; margin-right:15px;}
#iconTelephone { background:url(../images/iconTelephone.png) 0px 0px no-repeat; height:17px; padding: 2px 0 0 24px; float:left; margin-right:30px;}
#iconEmail { background:url(../images/iconEmail.png) 0px 3px no-repeat; height:17px; padding: 2px 0 0 26px; float:left;}
#iconEmail a { color:#ffffff; font-weight:400; text-decoration:none;}
#iconEmail a:hover { text-decoration: underline;}

@media screen and (max-width: 730px){
#topBar { font-size:12px;}
#iconTelephone { height:18px; padding: 1px 0 0 24px; float:left; margin-right:20px;}
#iconEmail { height:18px; padding: 1px 0 0 24px; float:left;}
}

@media screen and (max-width: 450px){
#topBar { font-size:11px;}
#iconTelephone { margin-right:10px;}
}

/* --- HEADER / LOGO / TELEHONE --- */
#headerContainer { background:#000000 url(../images/headerContainerBg.gif) repeat; }
#header { max-width:1200px; margin:0 auto; position:relative; z-index:10000;}
#header #logo { float:left; margin-left:15px; padding:15px 0;}
#header #logo a { float:left; font-size:16px; color:#ffffff; font-weight:700; font-family: 'Open Sans', Arial, Helvetica, Verdana, sans-serif; }
#header #logo img { float:left;}
#header #logo .logotext { float:left; padding: 15px 0 0 15px;}
#header #logo .large { font-size: 30px; line-height:34px; font-weight: 700; display:block;}
#header #logo .small { font-size: 15px; line-height:18px; font-weight: 400; display:block; padding:0 0 0 1px;}


@media screen and (max-width: 600px){
#header #logo .logotext { width:140px; padding: 8px 0 0 15px;}
#header #logo .large { font-size: 26px; line-height:30px;}
#header #logo .small { font-size: 13px; line-height:18px; padding:0 0 0 0px;}

}

/* --- TOP NAV --- */
.slicknav_menu { display:none;}
#topNavContainer {}
#topNav { max-width:800px; padding: 0; position:relative; float:right; font-family: 'Open Sans', Arial, Helvetica, Verdana, sans-serif; }
#topNav ul { padding: 48px 0 0 0; margin:0; list-style:none; float:left;}
#topNav ul li { display:inline; float:left; padding-right:20px; position:relative;}
#topNav ul li.last { padding-right:15px;}
#topNav ul li a { display:inline; float:left; padding:0; color:#ffffff; text-decoration:none; font-weight:700; font-size:17px; text-transform:uppercase;}
#topNav ul li a:hover, #topNav ul li.active a { color:#dfb614; text-decoration:none;}

/* --- TOP NAV - RESPONSIVE --- */
@media screen and (max-width: 1150px){
#topNav ul li { padding-right:18px;}
#topNav ul li a {  font-size:16px;}
}

@media screen and (max-width: 1050px){
.slicknav_menu { display:block;}
#topNavMenu { display:none;}
}

@media screen and (max-width: 880px){
}

@media screen and (min-width: 881px){
#topNavMenu .dropit-submenu li a { font-size:14px; text-transform:uppercase; background:#282828; width:250px; color:#ffffff !important; padding: 12px 15px; box-sizing: border-box; border-top:1px solid #000000;}
#topNavMenu .dropit-submenu { padding:0;  border-left:1px solid #000000;  border-right:1px solid #000000;  border-bottom:1px solid #000000;}
#topNavMenu .dropit-submenu li a:hover { color:#dfb614 !important;}
.dropit .dropit-submenu { position: absolute; top: 30px; left: -15px; z-index: 1000; display: none; list-style: none; padding: 0;	margin: 0; width:200px;}
.dropit .dropit-open .dropit-submenu { display: block; }
.dropit-submenu { background:#000000;}
}

/* ----- HOME BANNER - SEE FLEXSLIDER.CSS FOR ADDITIONAL STYLES INC. RESPONSIVE STYLES ----- */
#homeBannerContainer {}
#homeBannerContainer .flexslider { max-width:100%; position: relative;}

/* ----- HOME BOXES ----- */
#homeBoxes { width:100%; max-width:1200px; margin: 30px auto 0 auto; padding: 0 15px; box-sizing:border-box; display:table; border-collapse:separate; color:#ffffff;}
#homeBoxes a { color:#ffffff; font-weight:normal; text-decoration:none;}
#homeBoxes a:hover { text-decoration:underline;}
.homeBox { display:table-cell; width:24%; box-sizing:border-box; margin-bottom:30px;}
.homeBoxText {}
.homeBoxText .title { font-size:22px; line-height:26px; font-weight:700px; text-transform:uppercase;}
.homeBoxText p { padding-top:10px; font-size:13px; line-height:18px; }
.spacer { width:2%;}
#getInTouch { background: #dcb000 url(../images/topBarContainerBg.gif) repeat; padding:20px 25px 20px 25px;}
#getInTouch .homeBoxText { background: url(../images/iconSpeechBubble.png) 100% 4px no-repeat;}

#inhouseCourier { background:url(../images/inhouseCourierBg.jpg) repeat; position:relative;}
#inhouseCourier .homeBoxText { background: url(../images/iconArrow.png) 100% 5px no-repeat;}
#inhouseCourier .homeBoxText .title { font-size:18px; line-height:20px;}
#inhouseCourier .homeBoxText p { padding-top:0px;}
#inhouseCourier .homeBoxText a { display:block;}
#inhouseCourier .opacity { background: url(../images/opacityBg.png) repeat; position:absolute; bottom:0px; left:0px; width:100%; padding:10px 15px; box-sizing:border-box;}

#testimonials { width:48%; background: #454545 url(../images/testimonialsBg.gif) repeat; padding:20px 25px 20px 25px;}
#testimonials .homeBoxText { background: url(../images/iconSpeechMarks.png) 100% 4px no-repeat;}
#testimonials .homeBoxText p { font-style:italic;}

@media screen and (max-width: 1000px){
.homeBoxText .title { font-size:18px; line-height:26px;}
#inhouseCourier .homeBoxText .title { font-size:15px; line-height:20px;}
#getInTouch { padding:10px 15px 20px 15px;}
.homeBox { width:28%;}
#testimonials { padding:10px 15px 20px 15px; width:40%;}
#testimonials .homeBoxText p { font-size:12px; line-height:16px;}
}

@media screen and (max-width: 800px){
.homeBox { width:100% !important; display:block; margin-bottom:20px;}
.spacer { display:none;}
#inhouseCourier { background:none;}
#inhouseCourier .opacity { position:static;}
#testimonials { margin-bottom:0px;}
}

/* ----- CONTENT AND COLUMNS ----- */
#contentContainer { width:100%; max-width:1200px; margin: 30px auto 0 auto; padding: 0 15px; box-sizing:border-box;}
#content { margin:0 auto; position: relative; }
#content #leftCol { float:left; width:74%; margin-right:2%;  background:#ffffff;}
#content #leftCol .padding  { padding:35px;}
#content #rightCol { float:left; width:24%;}

@media screen and (max-width: 1000px){
#content #leftCol { width:68%; margin-right:2%;}
#content #rightCol { width:30%;}
}

@media screen and (max-width: 800px){
#contentContainer { margin-top:20px;}
#content #leftCol { width:100%; margin-right:0; float:none;}
#content #rightCol { width:100%; float:none;}
#content #leftCol .padding  { padding: 30px;}
#content #rightCol .padding { }
}

/* --- TWITTER FEED --- */
#twitterFeed { color:#ffffff; background: #1d1d1d url(../images/twitterBg.gif) repeat;  padding: 20px 20px 10px 20px; height:auto !important; height:260px; min-height:260px;}
#twitterFeed h3 { background: url(../images/iconTwitterBird.png) 100% 0px no-repeat;  font-size:18px; line-height:22px; padding-bottom:10px; color:#ffffff; text-transform:none; border-bottom:1px solid #4a4a4a;}

@media screen and (max-width: 800px){
#twitterFeed { margin-top:20px;}
}

/* ----- QUICK ENQUIRY ----- */
#callBack { width:100%; float:right; margin-top:20px;}
#callBack .title h3 { font-size: 18px; line-height:26px; padding-bottom:10px; border-bottom:1px solid #e4e4e4; margin-bottom:10px; background:url(../images/iconCallBack.png) 100% 0px no-repeat;}
#callBackFormContainer { padding: 15px 20px 20px 20px; background:#ffffff;}
#callBack p { padding: 0 0 20px 0; font-size:13px;}
#callBack p.success { color: green;}
#callBack fieldset { width:100%;}
#callBack .textInput { width:92%; padding: 7px 4%; float:left; font-family: 'Open Sans', Arial, Helvetica, Verdana, sans-serif; margin: 0 0 8px 0; background:#e4e4e4; border:none; font-size:13px; line-height:18px;}
#callBack .textareaInput { width:92%; padding: 7px 4%; float:left; font-family: 'Open Sans', Arial, Helvetica, Verdana, sans-serif; margin: 0 0 8px 0; background:#e4e4e4; border:none; font-size:13px; line-height:18px;}
#callBack label  { display:block; font-family: 'Open Sans', Arial, Helvetica, Verdana, sans-serif; font-weight:bold; padding-bottom:3px;}
#callBack label span { font-weight:normal; color:#dcb000; float: right;}
#callBack li.submit { background:none;}
#callBack .error { font-weight:normal; font-size:13px;}
#callBack .error .errors { display:block; padding-top:6px; padding-bottom:20px; color:#000;}
#callBack .btnSubmit { margin: 0; float:right; cursor:pointer; background:#dfb614; color:#ffffff; font-family: 'Open Sans', Arial, Helvetica, Verdana, sans-serif; width:79px; height:32px; border: none; padding:5px 15px; line-height:18px; font-size:11px; text-transform:uppercase; font-weight:bold; cursor:pointer; display:block;}
#callBack .btnSubmit:hover { background:#d4aa04; }
#callBack .requiredlist span { }
#callBack .confirmemail {width:1px; height:1px; border:none; background:#ffffff; display:none; position: absolute; left: -9999px;}

@media screen and (max-width: 1000px){
#callBack .title h3 { font-size: 16px; line-height:26px;}
}

@media screen and (max-width: 800px){
#callBack {  float:none;}
}

/* ----- QUICK ENQUIRY ----- */
#enquiry { width:100%;  margin-top:10px;}
#enquiry .title h3 { font-size: 18px; line-height:26px; padding-bottom:10px; border-bottom:1px solid #e4e4e4; margin-bottom:10px; }
#enquiry h3 { font-size: 18px; line-height:26px; padding-bottom:0px; padding-top:10px;}
#enquiryFormContainer { padding:0 0 20px 0; background:#ffffff;}
#enquiry p { padding: 0 0 20px 0; font-size:13px;}
#enquiry p.success{ padding-top: 20px; color: green; font-weight: bold; }
#enquiry fieldset { width:100%;}
#enquiry .textInput { width:100%; padding: 7px 7px; box-sizing:border-box; float:left; font-family: 'Open Sans', Arial, Helvetica, Verdana, sans-serif; margin: 0 0 8px 0; background:#e4e4e4; border:none; font-size:13px; line-height:18px;}
#enquiry .selectInput { width:100%; padding: 7px 7px; box-sizing:border-box; float:left; font-family: 'Open Sans', Arial, Helvetica, Verdana, sans-serif; margin: 0 0 8px 0; background:#e4e4e4; border:none; font-size:13px; line-height:18px;}
#enquiry .textareaInput { width:100%; padding: 7px 7px; box-sizing:border-box; float:left; font-family: 'Open Sans', Arial, Helvetica, Verdana, sans-serif; margin: 0 0 8px 0; background:#e4e4e4; border:none; font-size:13px; line-height:18px; overflow:auto;}
#enquiry label  { display:block; font-family: 'Open Sans', Arial, Helvetica, Verdana, sans-serif; font-weight:bold; padding-bottom:3px;}
#enquiry label span { font-weight:normal; color:#dcb000; float:right;}
#enquiry li.submit { background:none;}
#enquiry .error { font-weight:normal; font-size:13px;}
#enquiry .error .errors { display:block; padding-top:6px; padding-bottom:20px; color:#000;}

#enquiry .btnSubmit { margin: 0; float:right; cursor:pointer; background:#dfb614; color:#ffffff; font-family: 'Open Sans', Arial, Helvetica, Verdana, sans-serif; width:79px; height:32px; border: none; padding:5px 15px; line-height:18px; font-size:11px; text-transform:uppercase; font-weight:bold; cursor:pointer; display:block;}
#enquiry .confirmemail {width:1px; height:1px; border:none; background:#ffffff; display:none; position: absolute; left: -9999px;}
#enquiry .btnSubmit:hover { background:#d4aa04; }
#enquiry .requiredlist span { }

@media screen and (max-width: 1000px){
#enquiry .title h3 { font-size: 16px; line-height:26px;}
}

@media screen and (max-width: 800px){
#enquiry {  float:none;}
}

/* --- TABLES --- */
table { width:100%; border-collapse:separate; margin-bottom:25px;  border-left:1px solid #e5e5e5;}
table th { text-align:center; border:1px solid #dcb000; background:#dcb000; color:#ffffff; font-size:14px; line-height:18px; padding:7px 11px; font-family: 'Open Sans', Arial, Helvetica, Verdana, sans-serif; }
table td { text-align:center; border-bottom:1px solid #e5e5e5; border-right:1px solid #e5e5e5; background:#ffffff; color:#444444; font-size:13px; line-height:16px; padding:6px 11px; font-family: 'Open Sans', Arial, Helvetica, Verdana, sans-serif; }

@media screen and (max-width: 800px){
table th { font-size:11px; line-height:16px; padding:7px 4px; }
table td { font-size:10px; line-height:14px; padding:6px 4px;}
}


/* --- FOOTER --- */
#footerContainer {  background:#000000 url(../images/headerContainerBg.gif) repeat; margin-top:30px;}
#footer { width:100%; max-width:1200px; margin: 0 auto; padding: 20px 15px; box-sizing:border-box; font-family: 'Open Sans', Arial, Helvetica, Verdana, sans-serif; font-size:12px; line-height:18px;}
#footer { color:#ffffff;}
#footer a { color:#dcb000;}
.footerText { float:left; width:70%;}
.footerDesigner { float:left; width:30%; text-align:right;}

@media screen and (max-width: 800px){
#footer { font-size:11px;}
.footerText, .footerDesigner { float:none; width:100%; text-align:center;}
}

/* --- GENERAL CLASSES --- */
.clear { clear:both;}

/* --- HEADINGS & PARAGRAPHS --- */
h1, h2, h3, h4, h5, h6 { margin:0; padding:0; font-size:12px; line-height:16px; font-weight:700; text-transform:uppercase;}
.text { font-size:14px; line-height:22px;}
.text a { color:#fa9300; font-weight:600;}
.text h1 { font-size: 26px; line-height:30px; padding: 0 0 0 15px; margin-bottom:25px; display:block; border-left:9px solid #dcb000;}
.text h2 { font-size: 23px; line-height:29px; padding-bottom:20px;}
.text h3 { font-size: 20px; line-height:26px; padding-bottom:20px;}
.text h4 { font-size: 18px; line-height:24px; padding-bottom:20px;}
.text h5 { font-size: 16px; line-height:22px; padding-bottom:20px;}
.text h6 { font-size: 14px; line-height:20px; padding-bottom:20px;}
.text p { padding-bottom:20px;}
.text ul { margin:0; padding: 0 0 25px 0; list-style:none; line-height:24px;}
.text ul li { background: url(../images/bullet.gif) 12px 9px no-repeat; padding: 0 0 0 30px;}
.text ul ul { padding: 5px 0 5px 10px;}
.text ol { margin:0; padding: 0 0 25px 24px; list-style:decimal;}
.text ol ol { padding: 5px 0 5px 10px; list-style:lower-latin;}
.text strong { font-weight:600;}
.justifyleft { float:left; margin: 3px 20px 20px 0; max-width:45%; height:auto;}
.justifyright { float:right; margin: 3px 0 20px 40px; max-width:45%; height:auto;}
.fullwidth { width:100%; height:auto;}

@media screen and (max-width: 730px){
.text { font-size:13px; line-height:20px;}
.text h1 { font-size: 20px; line-height:26px;}
.text h2 { font-size: 20px; line-height:26px;}
.justifyleft { margin: 3px 15px 20px 0; max-width:35%; height:auto;}
.justifyright { margin: 3px 0 20px 15px; max-width:35%; height:auto;}
}

@media screen and (max-width: 400px){
.justifyleft { float:none; margin: 3px 0 20px 0; width:100%; max-width:100%; height:auto;}
.justifyright { float:none; margin: 3px 0 20px 0; width:100%; max-width:100%; height:auto;}
}

/* ----- LINKS ----- */
a { color:#000000; font-weight:bold; text-decoration:underline; }
a:hover { text-decoration:none; }
a:focus, a:hover, a:active { outline:none;}

/* ----- FORMS ----- */
form { padding:0; margin:0; }
fieldset { padding:0; margin:0; border:0px none; display:inline; }
legend { padding:0; margin:0; display:none; }
textarea, input, select { font:12px; font-family:Arial, Helvetica, Verdana, sans-serif;}
input:focus, textarea:focus, select:focus { outline: none;}