/*
Theme Name: Home Heat Services Responsive
Theme URI: http://localhost/homeheatservices.co.uk
Description: A custom WordPress theme for Home Heat Services
Author: Steve Smith
Author URI: http://localhost/
Version: 1.0
Tags: custom

License: GNU General Public License v2.0
License URI: http://www.gnu.org/licenses/gpl-2.0.html

This theme was built on WP 4.1
*/

/* 	CONTENTS
 	========
	1. BODY AND BASIC FONTS
 	2. HEADER
 	3. NAVIGATION
 	4. SLIDER
 	5. CONTENT
 	5.1 General
 	5.2 Front Page
 	5.3 Testimonials
 	6. FOOTER


 */

 /* COLOR VALUES
    ============
    darkorange #FF8C00

 */

 @import url('../HHS Responsive/bootstrap/css/bootstrap.css'); 
/*@import url('../bootstrap/css/bootstrap-responsive.css'); */

 /* ======================
   1. BODY AND BASIC FONTS
   ======================= */

body {
	font-size: 16px;
	background-color: #000;
	color: #333;
	font-family: 'Open Sans', sans-serif;
	padding-bottom: 50px;
	font-weight: 400;
	/*line-height: 1.5em;*/
}

h1, h2, h3, h4, h5 {
	color: DarkOrange;
	font-weight: 400;
}

p {
	line-height: 24px;
}

a {
	text-decoration: none;
	color: DarkOrange;
	transition: color 0.5s ease-in-out;
   	-moz-transition: color 0.5s ease-in-out;
   	-webkit-transition: color 0.5s ease-in-out;
}

a:hover {
	color:#333;
	text-decoration: none !important;
	transition: color 0.5s ease-in-out;
   	-moz-transition: color 0.5s ease-in-out;
   	-webkit-transition: color 0.5s ease-in-out;
}

.fa {
	padding-right: 5px;
}

.orange {
	color: DarkOrange !important;
}

ul {
	/*list-style-position: inside ;*/
	padding-left: 20px;
	/*margin-right: 50px;*/
	line-height: 24px;
}

li {
	padding-left: 5px;
}


 /* ======================
   2. HEADER
   ======================= */

#top-bar {
	width:100%;
	height:20px;
	background-color: DarkOrange;
}

.header-background {
	width: 100%;
	background-image:url(css/css-images/subtle_carbon.png);
	background-repeat: repeat-x repeat-y;
	border-bottom: 3px solid DarkOrange;
	padding-top: 10px;
}

.header-contact-container p {
	color: Silver;
	font-size: 18px;
	text-align: center;
	line-height: 40px;
	margin-top: 10px;
	/*padding-top: 10px;*/
	padding-bottom: 10px;
	/*border-color: #666;*/
	/*border-bottom:  1px solid;*/
	/*border-top:  1px solid;*/
}

.header-contact-container .fa {
	color: DarkOrange;
}

.mobile-header {
	padding-right: 20px;
}

.header-contact-container a {
	color:Silver;
}

.header-contact-container a:hover {
	color:DarkOrange;
}

@media (min-width: 768px) {

	.header-background {
		padding-bottom: 10px;
	}

	.header-contact-container p {
		font-size: 20px;
		text-align: right;
		border: none;
		margin-top: 0px;
		padding-bottom: 0px;
	}

}

 /* ============
   3. NAVIGATION
   ============= */

/* X-SMALL - DEFAULT */

img.centre-logo {
	margin-left: auto;
	margin-right: auto;
}

.navbar {
	margin-top: 0px;
	background: transparent;
	border: none;
}

.navbar-toggle {
	position: relative;
	float: none;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	/*margin-right: 15px;*/
	padding: 9px 10px;
	margin-top: 15px;
	border-radius: 0;
}

.navbar-default .navbar-toggle {
	border-color: Silver;
	color: Silver;
	background-color: #333
}

.navbar-toggle .fa {
	color: Silver
}

.navbar-default .navbar-toggle:hover {
	border-color: DarkOrange;
	color: DarkOrange;
	background-color: #333
}

.navbar-default .navbar-toggle:hover .fa {
	color: DarkOrange;
}

.nav-pills > li {
	padding-left: 0px;
}

.navbar-collapse {
	padding-right: 0;
	padding-left: 0;
}

.navbar-default .navbar-collapse {
	border-color: DarkOrange
}

.nav-pills > li a {
	border-radius: 0;
	display: block;
	color: Silver;
	text-align: center;
	background-color: #333;
	padding: 10px 0px;
	transition: background-color 0.5s ease-in-out;
  	-moz-transition: background-color 0.5s ease-in-out;
  	-webkit-transition: background-color 0.5s ease-in-out;
}

.nav-pills > li a:hover, .nav-pills > li.current-menu-item a, .nav-pills > li.current_page_parent a {
	text-decoration:none;
	background-color: DarkOrange;
	color: White;
}

/*SMALL*/

@media (min-width: 768px) {

	img.centre-logo {
	margin-left: 0;
}

	.navbar {
		margin-top: 30px;
		margin-bottom: 10px;
	}

	.nav-pills > li {
		padding-left: 10px;
	}

	.nav-pills > li a{
		padding: 10px 10px;
	}

}

/*MEDIUM*/

@media (min-width: 992px) {

	.navbar {
		margin-top: 30px;
		margin-bottom: 10px;
	}

	.nav-pills > li {
		padding-left: 30px;
	}

	.nav-pills > li a{
		padding: 10px 20px;
	}

}

/*LARGE*/

@media (min-width: 1200px) {

	.navbar {
		margin-top: 30px;
		margin-bottom: 10px;
	}

	.nav-pills > li {
		padding-left: 30px;
		font-size: 18px;
	}

	.nav-pills > li a{
		padding: 10px 25px;
	}

}

/* ==========
   4. SLIDER
   ========== */

.full-width {
   	width: 100%;
   	background-color:#fff;
   	padding-top: 20px;
   	padding-bottom: 20px;
}

/*?????*/
.accreditations-box {
	border: 1px solid #ccc;
	background-color: White;
	height:331px;
	padding: 5px;
}

@media (max-width: 768px) {

	.accreditations-box {
		height:100%;
		padding:10px;
	}

}

@media (min-width: 768px) {

	.accreditations-box {
		height:216px;
		padding:10px;
	}

}

@media (min-width: 992px) {

	.accreditations-box {
		height:283px;
	}

}

@media (min-width: 1200px) {

	.accreditations-box {
		height:345px;
	}

}

.accreditations-box-sidebar {
	border: 1px solid #ccc;
	background-color: White;
	/*height:331px;*/
	padding: 5px;
	margin-bottom: 20px;
}


/* ===========
   5. CONTENT
   =========== */

/*5.1 General*/

#content-wrapper { /*Includes the Footer Accreditation*/
	width: 100%;
	background-color: White;
	background-image:url(css/css-images/brushed_alu.png);
	padding-bottom: 20px;
	border-bottom: 3px solid DarkOrange;
}

.content {
	padding-top: 20px;
	padding-bottom: 20px;
}

.content-main-box {
	margin-bottom: 20px;
}

@media (min-width: 992px) {

	.content-main-box {
		margin-bottom: 0px;
	}

}

.content-side-box {
	margin-bottom: 20px;
}

.content-side-box.last, .content-main-box.last {
	margin-bottom: 0;
}

.box-content {
	margin-bottom: 10px;
}

.content-side-box h2 {
	font-size:24px;
	line-height: 32px;
	/*margin-top:11px;*/
}

@media (min-width: 768px) {

p.contact {
	line-height: 28px;
	font-size: 16px;
}

}

p.contact {
	line-height: 28px;
	font-size: 15px;
}

/*5.2 Front Page and some general*/

.front-page-box, .content-main-box, .content-side-box {
	border: 1px solid #ccc;
	background-color: White;
	padding: 0px 20px 10px 20px;
}

.front-page-box {
	margin-bottom: 20px;
}

.front-page-box.last-front-page-box {
	margin-bottom: 0px;
}

@media (min-width: 992px) {

	.front-page-box {
		margin-bottom: 0px;
	}

}

/*5.3 Testimonials*/

.testimonial-container {
	margin-bottom: 20px;
}

.testimonial-container p, .sidebar-testimonial p {
	margin-bottom: 0px;
}

.testimonial-container p.from, .front-page-box p.from {
	color:DarkOrange;
	font-style: italic;
}

.sidebar-testimonial p.from  {
	font-size: 0.9em;
	font-style: italic;
	margin-bottom: 10px;
}

.front-page-box p.from {
	color: inherit
}

/*FOOTER IMAGES*/

#footer-images-wrapper {
	width:100%;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	background-color: White;
	/*height:100px;*/
}

#footer-images-wrapper img {
	margin-left: auto;
	margin-right: auto
}

.back-to-top {
	margin-bottom: 20px;
}

/* ===========
   6. FOOTER
   =========== */

#footer-background {
	background-color: #000;
	/*float:left;*/
	width:100%;
}

#footer-container {
	padding:20px 0 30px 0;
	color:Silver;
}

#footer-container a {
	color: Silver
}

#footer-container a:hover {
	color: DarkOrange
}

.footer-col {
	padding: 0px 20px 10px 20px;
}

.footer-col.footer-contact {
	text-align: center;
	line-height: 24px;
}

@media (min-width: 768px) {

	.footer-col.footer-contact {
		text-align: left;
		line-height: 24px;
	}

}

ul.footer-pages {
	list-style: none;
	padding-left: 0;
}

ul.footer-pages li {
	padding-bottom: 5px;
	line-height: 18px;
	padding-left: 0
}

ul.footer-pages li a {
	color:Silver;
	text-decoration: none
}

ul.footer-pages li a:hover {
	color:DarkOrange;
}

ul.footer-pages li.current_page_item a, ul.footer-pages li.current_page_parent a  {
	color:DarkOrange !important;
}

.site-by {
	text-align: center;
	border-top: 1px solid #333;
	padding-top:20px;
	font-size: 14px;
}

.mobile-contact-details {
	margin-bottom:10px;
	text-align: center;
}

.mobile-contact-details p {
	margin-bottom: 0;
}

.header-contact-container a.social-media-links .fa, .accreditations-box a.social-media-links .fa{
	color:Silver !important;
}

.accreditations-box a.social-media-links .fa{
	color:#333 !important;
}


.header-contact-container a.social-media-links:hover .fa, .accreditations-box a.social-media-links:hover .fa{
	color:DarkOrange !important;
}