/* ---- ---- ---- ---- ---- ---- ----

Colewhite Website Template - v1.2

Copyright 2018 Synergy 8 https://www.synergy8.com/

We'd love to see you re-brand and work with this template on both
personal and commercial projects.

It's not necessary to leave attribution in the website footer, but it's certainly
appreciated! We love to see "Website & Marketing Powered by Synergy 8".

This work is licensed under the Creative Commons Attribution 3.0 Australia License.
To view a copy of this license, visit http://creativecommons.org/licenses/by/3.0/au/

The above copyright notice and this permission notice must be included in all copies or substantial portions of the Software.

CSS has been grouped below:

1. TYPOGRAPHY
2. CORE SECTION STRUCTURE
3. SECTION BACKGROUNDS
4. HEAD / HERO AREA
5. ICON STYLING
6. POST ARTICLE STYLING
7. TESTIMONIAL STYLING
8. NICHE AREA STYLING
9. CALL TO ACTION  SECTION
10. SIDEBAR
11. FOOTER AREA
12. FORM STYLES
13. Other

 ---- ---- ---- ---- ---- ---- ---- */


 /* ---- ---- ---- ---- ---- ---- ---- */
 /*       1. TYPOGRAPHY                */
 /* ---- ---- ---- ---- ---- ---- ---- */

 h1, h2, h3, {
 	margin-top: 30px;
 }
 h2 {
 	font-weight: 300;
 }

 big {
 	font-size: 21px;
 }

 blockquote {
 	font-style: italic;
 	color: #999;
 	margin:30px 0 30px;
 }

 .crumbs {
	 color: #AAA;
 }


/* ---- ---- ---- ---- ---- ---- ---- */
/*      2. CORE SECTION STRUCTURE     */
/* ---- ---- ---- ---- ---- ---- ---- */

section {
	padding-top: 55px;
	padding-bottom: 55px;
}

/* title / breadcrumb section on general layout pages */
#contentHeader {
  border-top: 3px solid #555;
  border-bottom: 3px solid #AAA;
  background: #191919;
  padding-top: 20px;
  padding-bottom: 20px;
}

#contentHeader h1 {
	margin-top: 5px;
	color: #EEE;
}

/* Main Content Block */
.maincontent { }

/* General Page Content Area */
.contentWrapper {
    padding-top: 36px;
    padding-bottom: 26px;
}

/* ---- ---- ---- ---- ---- ---- ---- */
/*      3.  SECTION BACKGROUNDS       */
/* ---- ---- ---- ---- ---- ---- ---- */

.gray-bg {
	background-color: #EAEAEC;
}

.dark-bg {
	background-color: #171717;
	color: #EAEAEC;
}
.dark-bg h1, .dark-bg h2, .dark-bg h3, .dark-bg h4, .dark-bg h5, .dark-bg big {
	color: #EAEAEC
}

/* ---- ---- ---- ---- ---- ---- ---- */
/*      4.  HEAD  / HERO AREA         */
/* ---- ---- ---- ---- ---- ---- ---- */

.section-overlay {
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, .65);
	min-height: 400px;
	padding-top: 140px;
	padding-bottom: 140px;
}

#head {
	background: #323232;
	background-size: cover;
  background-position: center;
	text-align: center;
	color: #FFF;
	text-shadow: 2px 2px 2px rgba(0,0,0,0.6);
	font-weight: 300;
}

#head h1 { color: #FFF;}
#head big {	font-size: 21px; color: #FFF;}
#head p {	margin-bottom: 25px;}

#head .btn {
	margin-bottom:10px;
	text-shadow: none;
	box-shadow: none; -webkit-box-shadow: none; -moz-box-shadow: none;
}
#head .btn-default {
	background: transparent;
	color: rgba(255,255,255,.65);
	border: 2px solid rgba(255,255,255,0.2);
	border-radius: 0;
}
#head .btn-default:hover, #head .btn-default:focus {
	color: rgba(255,255,255,.8);
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
	background: transparent;
	border: 2px solid rgba(255,255,255,0.6);
}
#head .btn-default:active, #head .btn-default.active {
	color: #fff;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
	background: transparent;
	border: 2px solid rgba(255,255,255,0.6);
}

@media (max-width: 767px) {
	#head { min-height:420px; }
	.section-overlay { min-height: 485px; padding-top: 104px;}
}

/* ---- ---- ---- ---- ---- ---- ---- */
/*           5. ICON STYLING          */
/* ---- ---- ---- ---- ---- ---- ---- */

.circle-icon {
    -webkit-border-radius: 50%;
    border-radius: 50%;
    color: #ffffff;
    background-color: #444;
    border: 2px solid #292929;
    padding: 14px; /* Somewhere between 14px and 28px works well */
    font-size: 31px;
    text-align: center;
}

/* ---- ---- ---- ---- ---- ---- ---- */
/*       6. POST ARTICLE STYLING      */
/* ---- ---- ---- ---- ---- ---- ---- */

.blog-item {
    background: #fff;
    border: 1px solid rgba(170, 167, 167, 0.32);
    margin-bottom: 25px;
}
.blog-item .blog-entry {
    padding: 20px;
}
.blog-entry h3 {
    margin-top: 0;
    margin-bottom: 10px;
}
.blog-entry span.date {
    color: #292929;
    margin-bottom: 10px;
    display: block;
}

/* ---- ---- ---- ---- ---- ---- ---- */
/*      7. TESTIMONIAL  STYLING       */
/* ---- ---- ---- ---- ---- ---- ---- */

.testimonial-author img {
	max-width:55px;
	float: left;
  margin-right: 10px;
}

/* ---- ---- ---- ---- ---- ---- ---- */
/*      8. NICHE AREA  STYLING        */
/* ---- ---- ---- ---- ---- ---- ---- */

.niche-item {
	background: #094056;
	margin-top: 15px;
}
.niche-item::after {
	content: "";
	clear: both;
	display: block;
}
.niche-image {
	float: left;
	width: 40%;
}
.niche-text {
	float: right;
	padding: 5px 10px;
	width: 60%;
}

@media (max-width: 1199px) {
	.niche-image, .niche-text { width:auto;}
}
@media (max-width: 991px) {
	.niche-image { width: 40%;}
	.niche-text { width: 60%;}
}
@media (max-width: 546px) {
	.niche-image, .niche-text { width:auto;}
}

/* ---- ---- ---- ---- ---- ---- ---- */
/*    9. CALL TO ACTION  SECTION      */
/* ---- ---- ---- ---- ---- ---- ---- */

.call-to-action {
	background: #000;
	color: #FFF;
}
.call-to-action h1 {
	margin-top: 0;
	color: #FFF;
}
.call-to-action p{
	color: #8a8989;
}
.btn-cta{
	margin-top: 15px;
}


/* ---- ---- ---- ---- ---- ---- ---- */
/*          10. SIDEBAR               */
/* ---- ---- ---- ---- ---- ---- ---- */

.sidebar {
	padding-top:36px;
	padding-bottom:30px;
}
.sidebar .widget {
	margin-bottom:20px;
}
.sidebar h1, .sidebar h2, .sidebar h3, .sidebar h4 {
    background: #333;
    padding: 10px;
    color: #fff;
    font-size: 18px;
    margin: 20px 0 10px;
}

.sidebar-nav ul{
	margin: 0;
	padding: 0;
}
.sidebar-nav ul li{
	list-style: none;
}
.sidebar-nav ul li a {
    display: block;
    margin-bottom: 1px;
    background: #eee;
    padding: 7px 10px 7px 10px;
}
.sidebar-nav ul li:first-child a {
    background: #333;
    color: #fff;
    font-size: 18px;
}

.news-box h5 {
    font-weight: 800;
		margin-top: 0;
}
.news-box h5 span {
    display: block;
    text-transform: uppercase;
    color: #111;
    margin-top: 2px;
}


/* ---- ---- ---- ---- ---- ---- ---- */
/*      11.  FOOTER  AREA             */
/* ---- ---- ---- ---- ---- ---- ---- */

.footerTop {
	background: #232323;
	padding: 30px 0 0 0;
	font-size: 14px;
	color: #999;
}
.footerTop a { color: #ccc; }
.footerTop a:hover { color: #fff; }

footer .widget { margin-bottom:30px; }
footer h4 {
	font-size: 17px;
	font-weight: bold;
	color: #EEE;
	margin: 0 0 20px;
	border-bottom: 1px solid #333;
	padding-bottom: 10px;
}

footer .social-icons a{
	background: #FFF;
	color: #333;
	font-size: 16px;
	height: 35px;
	width: 35px;
	line-height: 35px;
	border-radius: 100%;
	display: block;
	text-align: center;
	text-decoration: none;
	border: 1px solid #000;
}
footer .social-icons a:hover{
	color: #000;
}

.footerBottom {
	background: #191919;
	padding: 15px 0;
	color: #777;
	font-size: 12px;
}
.footerBottom a { color: #aaa; }
.footerBottom a:hover { color: #fff; }
.footerBottom p { margin: 0; }


/* ---- ---- ---- ---- ---- ---- ---- */
/*     FORM STYLES                    */
/* ---- ---- ---- ---- ---- ---- ---- */

input[type=text],input[type=email],input[type=password],textarea {
	padding: 6px 8px;
	border: 1px solid #cccccc;
	border-radius: 1px;
	transition: box-shadow 0.1s;
	box-sizing: border-box;
}

input[type=text]:focus,input[type=email]:focus,input[type=password]:focus,textarea:focus,select:focus {
	box-shadow: 0 0 5px rgba(27, 109, 169, 0.3);
	border: 1px solid rgba(27, 109, 169, 0.5);
	outline: none;
}

select {
	padding: 5px 3px 5px 5px;
	border: 1px solid #cccccc;
}

input[type=checkbox],input[type=radio] {
	width: 15px;
	height: 16px;
	margin-right: 0.5em;
	margin-top: 0px;
	vertical-align: text-top;
}

small input[type=checkbox],small input[type=radio] {
	width: 14px;
	height: 14px;
}

.checkbox-inline, .radio-inline {
	padding-left: 0px;
}

button[type=submit] {
	outline: none;
	background: #428bca;
	border: 1px solid #428bca;
	color: #fff;
	padding: 10px 25px 10px 25px;
	border-radius: 3px;
	margin: 2px;
	cursor: pointer;
}

/* ---- ---- ---- ---- ---- ---- ---- */
/*     OTHER / HELPERS                */
/* ---- ---- ---- ---- ---- ---- ---- */

img { max-width:100%; }