/*
Theme Name: Smile Beautiful
Theme URI: http://www.smilebeautiful.co.uk
Description: Theme designed for Smile Beautiful
Author: Karl Wills
Author URI: http://www.karl-wills.com
*/


/*
.d88888b             oo dP              888888ba                               dP   oo .8888b          dP 
88.    "'               88              88    `8b                              88      88   "          88 
`Y88888b. 88d8b.d8b. dP 88 .d8888b.    a88aaaa8P' .d8888b. .d8888b. dP    dP d8888P dP 88aaa  dP    dP 88 
      `8b 88'`88'`88 88 88 88ooood8     88   `8b. 88ooood8 88'  `88 88    88   88   88 88     88    88 88 
d8'   .8P 88  88  88 88 88 88.  ...     88    .88 88.  ... 88.  .88 88.  .88   88   88 88     88.  .88 88 
 Y88888P  dP  dP  dP dP dP `88888P'     88888888P `88888P' `88888P8 `88888P'   dP   dP dP     `88888P' dP 
oooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooo
*/

/* 	----- CSS Reset	----- */
@import "style/css/reset.css";


/*	----- General Body Styling	----- */

body {background: #e5edff url(style/images/bodybg.jpg) repeat-x; color: #444343; font-size: 62.5%; font-family: 'Lucida Sans', 'Trebuchet MS', Verdana, Sans-Serif; margin: 0; padding: 0 0 30px 0;}


/*	----- WordPress Specific	----- */
.alignright, a .alignright {float:right; margin: 5px 0 20px 20px; padding: 5px; background: #f5f4f4; border: 1px solid #d4d4d4; position: relative; z-index: 800;}
.alignleft, a .alignleft {float:left; margin: 5px 20px 20px 0; padding: 5px; background: #f5f4f4; border: 1px solid #d4d4d4;}
.aligncenter, a .aligncenter {display: block; margin-left: auto; margin-right: auto; padding: 5px; background: #f5f4f4; border: 1px solid #d4d4d4;}


/* ----- Clear Fixes ----- */

.clearfix:after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; }
.clearfix { display: inline-block; }
html[xmlns] .clearfix { display: block;}
* html .clearfix {height: 1%;}

.clearleft {clear: left;}
.clearright {clear: right;}
.clearboth {clear: both;}


/*	----- Feature Page Images	----- */
.feature {padding: 5px; background: #f5f4f4; border: 1px solid #d4d4d4;}


/*	----- Flash Video	----- */
.video {margin-bottom: 20px;}


/*	----- Page & Content Wrappers	----- */
#page-wrap {width: 940px; padding: 0 10px; margin: 0 auto;}
#page-content-wrap {width: 900px; overflow: hidden;  margin-top: 30px; clear: both; background: #fff; -moz-border-radius: 5px; -webkit-border-radius: 5px; border: 1px solid #d7dce7; padding: 25px 20px; float: left; margin-bottom: 30px;}

/*	----- Default Typography ----- */
a {color: #385cb2; text-decoration: none; outline: none;}
a:hover {text-decoration: underline; color: #4568bd;}
a:visited {color: #224393;}

#page-content-wrap a {text-decoration: underline;}
#page-content-wrap a:hover {text-decoration: none;}

p, ul {font-size: 1.2em; line-height: 1.75em; margin-bottom: 20px;}
h1 {clear: both; font-size: 2.3em; margin-bottom: 35px; margin-top: 15px;}
h2 {font-size: 1.9em; margin-bottom: 18px;}
h3 {font-size: 1.6em; margin-bottom: 18px;}
h4 {font-size: 1.4em; margin-bottom: 15px;}
input, select, th, td {font-size: 1.2em;}

ul, ol {margin-bottom: 20px;}
ul li {list-style: inside disc;}
ol li {list-style: inside decimal;}
dt, dd {font-size: 1.2em;}
dd {margin: 10px 0 20px 0;}
li li, li p, td p, blockquote p {font-size: 0.8333em;}
li ul {margin-top: 10px;}


/*	----- Default Buttons	----- */
.button {background: #ffda83 url(style/images/button-overlay.png) repeat-x top; display: inline-block; padding: 5px 10px 6px; color: #4a380d; text-decoration: none; line-height: 1; -moz-border-radius: 5px; -webkit-border-radius: 5px; text-shadow: 0 1px 1px  #fff; position: relative; font-size: 1.4em; border: 1px solid #b2944a;}

.button:hover {background: #fcdf9c; text-decoration: none; color: #4a380d;}

/*	----- Button Colours	----- */
.button.blue {background-color: #385cb2; border: 1px solid #3255a8; color: #fff; text-shadow: 0 1px 1px #1c3a80;}
.button.blue:hover {background: #4569c0;}

/*	----- Button Sizes	----- */
.button.small {font-size: 1.1em; background-image: none;}
.button.medium {font-size: 1.3em; background-image: none;}
.button.large {font-size: 1.4em; padding: 8px 14px 9px;}

/*	----- Form Input Buttons	-----*/
.gform_footer .button {background-color: #385cb2; font-size: 1.1em; background-image: none; display: inline-block; padding: 5px 10px 6px; color: #fff; text-decoration: none; line-height: 1; -moz-border-radius: 5px; -webkit-border-radius: 5px; text-shadow: 0 1px 1px #1c3a80; position: relative; font-size: 1.1em; border: 1px solid #3255a8; width: 95px!important; -moz-box-shadow: none !important; -webkit-box-shadow: none !important box-shadow: none !important; margin-top: 10px;}
.gform_footer .button:hover {background: #4569c0; cursor: pointer;}

/*	----- Header, Top Navigation & Dropdowns ----- */
#header-wrap {width: 100%;}
#header {width: 940px; position: relative; z-index: 7000; /* IE Z-Index Fix */ height: 78px; margin: 0 auto;}
a#logo-home {width: 244px; height: 78px; overflow: hidden; display: block; float: left; text-indent: -9999px; background: url(style/images/logo-main.png) no-repeat top;}

ul#header-nav {background: url(style/images/navsprite.jpg); width: 609px; float: right; margin-right: 20px; }
ul#header-nav li {float: left; display: inline; list-style: none; position: relative; background-image: none; padding: 0; margin: 0;}
ul#header-nav li a {text-indent: -9999px; height: 46px; float: left;}
ul#header-nav li .sub {position: absolute; top: 45px; left: 0; background: #284793; float: left; z-index: 1000; padding: 10px; -moz-border-radius-bottomright: 5px;
-khtml-border-radius-bottomright: 5px;-webkit-border-bottom-right-radius: 5px; -moz-border-radius-bottomleft: 5px; -khtml-border-radius-bottomleft: 5px; -webkit-border-bottom-left-radius: 5px;}
ul#header-nav .sub ul {list-style: none; margin: 0; padding: 0; width: 220px; float: left;}
ul#header-nav .sub ul li { width: 100%; /*--Override parent list item--*/ color: #fff; font-size: 12px; line-height: 16px;}
ul#header-nav .sub ul li a {float: none; text-indent: 0; /*--Override text-indent from parent list item--*/ height: auto; /*--Override height from parent list item--*/ padding: 9px 5px 9px 17px; display: block; text-decoration: none; color: #fff; background: url(style/images/sub-link-arrow.jpg) no-repeat left center;}
ul#header-nav .sub ul li a:hover {color: #ffda83; text-decoration: underline;}

.home-page {width: 70px;}
.home-page:hover {background: url(style/images/navsprite.jpg) 0px -46px no-repeat;}
.about {width: 170px;}
.about:hover {background: url(style/images/navsprite.jpg) -70px -46px no-repeat;}
.services {width: 95px;}
.services:hover {background: url(style/images/navsprite.jpg) -240px -46px no-repeat;}
.consultation {width: 180px;}
.consultation:hover {background: url(style/images/navsprite.jpg) -335px -46px no-repeat;}
.contact {width: 93px;}
.contact:hover {background: url(style/images/navsprite.jpg) -515px -46px no-repeat;}

/*	----- Service button hover state when dropdown is in use	----- */
.active {background: url(style/images/navsprite.jpg) -240px -46px no-repeat;}


/*	----- Home Page Specific Styles	----- */
.home #content {width: 578px; clear: both; background: #fff; -moz-border-radius: 5px; -webkit-border-radius: 5px; border: 1px solid #d7dce7; padding: 25px 20px; float: left; margin-bottom: 30px;}
.home #content h2 {border-bottom: none !important; padding-bottom: 0!important;}

#home-intro-container {width: 100%; height: 304px; background: url(style/images/introbg.jpg) repeat-x top; margin: 20px 0 20px 0; position: relative;}
#home-intro {clear: both; width: 940px; position: relative; height: 304px; margin: 0 auto; position: relative;}
#home-intro .slider {position: relative; top: 3px;}
#home-intro .slider img {background: #d8e3fe;}

.slider {float: left; width: 380px; height: 304px; background: none;}
.intro-text {float: right; font-size: 1.2em; width: 540px; margin-left: 20px; position: relative; top: 40px; z-index: 900;}
.intro-text p {line-height: 22px; font-size: 1em;}
.intro-text h1 {margin-top: 0; color: #385cb2; font-size: 3.1em; margin-bottom: 15px;}
.intro-text p span {font-size: 1.3em; color: #385cb2; font-weight: bold;}
.intro-text a.button {color: #4a380d !important; font-size: 1.2em;}


/*	----- Page Content Areas	----- */
.page-template-page-about-php #content, .page-template-page-contact-us-php #content {float: left; width: 560px; padding: 0; margin-right: 20px;}
#content ul li {list-style: none; padding-left: 15px; background: url(style/images/list-item-bg.jpg) no-repeat left center; margin-bottom: 10px;}
#content h2, #content h3, #content h4 {padding-bottom: 10px; border-bottom: 1px solid #d4d4d4;}

.page-child #sidebar .quick-contact textarea, .page-child #sidebar .quick-contact input {
border: 1px solid #e5e5e5; -moz-box-shadow:none!important; box-shadow: none!important; -webkit-box-shadow: none!important; border: 1px solid #e1e1e1;}

/*	----- Service Sub Pages ----- */
.page-child #content {clear: both; width: 560px; float: left; margin-right: 20px;}


/*	----- Before & After Images	----- */
.image-container { width: 220px; overflow: hidden; float: left; margin-right: 20px;}


/*	----- Flash Before and After Images ----- */
.before-after-flash {float: left; margin-right: 20px;}


/*	---- Sidebar & Items	----- */
#sidebar {float: right; width: 280px; padding: 0 20px;}
h3#telephone {margin-right: 20px; display: block; font-size: 2.2em; color:#385cb2; margin-bottom: 20px; }
#sidebar ul li {list-style: none;}
#sidebar ul {font-size: 1.1em;}
.item {margin-bottom: 20px;}
#sidebar .item {background: #f3f3f3; padding: 15px; -moz-border-radius: 5px; -webkit-border-radius: 5px;}
#sidebar .item p {font-size: 1.1em; margin-bottom: 15px;}

/*	----- Home Page Sidebar & Items	----- */
.home #sidebar {width: 300px; padding: 0!important;}
.sidebar-item {float: right; width: 258px; padding: 20px; -moz-border-radius: 5px; -webkit-border-radius: 5px; border: 1px solid #d7dce7; background: #fff; margin-bottom: 20px;}
.sidebar-item p {font-size: 1.1em; line-height: 20px;}

ul.home-sidebar-services li {margin-bottom: 15px; background: url(style/images/list-item-bg.jpg) no-repeat 0 7px; padding-left: 15px; list-style: none outside;}

.quick-contact li {list-style: none; padding: 0; float: left; }
.quick-contact label {font-size: 11px !important;}
.quick-contact textarea, .quick-contact input {font-family: 'Lucida Sans', 'Trebuchet MS', Verdana, Sans-Serif; color:#696969; font-size: 1.1em; width: 240px; padding: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; border: 1px solid #e5e5e5; -moz-box-shadow: inset 0 0 15px #e5edff; box-shadow: inset 0 0 15px #e5edff; -webkit-box-shadow: inset 0 0 15px #e5edff; margin-bottom: 12px;}
.quick-contact textarea {height: 140px;}
.gfield_required {color: red; padding-left: 2px;}
.gfield_error {color: red; padding: 8px 0 8px 0;}


/*	----- Frequntly Asked Questions Styles	----- */

#faq dt {cursor: pointer; list-style: none; padding-left: 15px; background: url(style/images/list-item-bg.jpg) no-repeat left center; margin-bottom: 10px; color: #385cb2;}
#faq dt:hover {text-decoration: underline;}
#faq dd {padding-left: 15px; line-height: 1.75em;}


/*	----- Contact Us Page Styles	----- */
#gform_2 li {background: none !important; font-size: 12px !important; padding-left: 0!important;}
#gform_2 .button {color: #fff;}
ul#contact {margin: 10px 0 20px 0; padding: 0;}
address p {margin: 0; padding: 0;}


/*	----- Sitemap ----- */
.page-item-6 {background-image: none!important;}


/*	----- Footer ----- */
#footer {clear: both; width: 900px; height: 38px; background: url(style/images/footerbg.jpg) no-repeat; padding: 10px 20px 10px 20px; }
#footer p {margin: 0; padding: 0; font-size: 1.1em; float: left; line-height: 17px;}
#footer ul {float: right; font-size: 1.1em; margin: 10px 0 0 0;}
#footer ul li {list-style: none; display: inline;}
#footer ul li a {margin-left: 12px;}