/*
 Theme Name:     Coderra 2017
 Description:    Coderra 2017
 Author:         David Proctor
 Author URI:     http://www.coderra.co.uk
 Version:        1.0
*/
/*--------------------------------------------------------------------------
	//	UNIVERSAL
--------------------------------------------------------------------------*/ 

@font-face {
  font-family: 'LarishNeueSemibold-Regular';
  src: url('fonts/LarishNeueSemibold-Regular.eot?#iefix') format('embedded-opentype'),  url('fonts/LarishNeueSemibold-Regular.otf')  format('opentype'),
	     url('fonts/LarishNeueSemibold-Regular.woff') format('woff'), url('fonts/LarishNeueSemibold-Regular.ttf')  format('truetype'), url('fonts/LarishNeueSemibold-Regular.svg#LarishNeueSemibold-Regular') format('svg');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'HKGrotesk-Light';
  src: url('fonts/HKGrotesk-Light.eot?#iefix') format('embedded-opentype'),  url('fonts/HKGrotesk-Light.otf')  format('opentype'),
	     url('fonts/HKGrotesk-Light.woff') format('woff'), url('fonts/HKGrotesk-Light.ttf')  format('truetype'), url('fonts/HKGrotesk-Light.svg#HKGrotesk-Light') format('svg');
  font-weight: normal;
  font-style: normal;
}

html, body {height:100%;font-family: 'HKGrotesk-Light';}

h1, h2, h3, h4, h5, h6 {font-family: 'LarishNeueSemibold-Regular';}
h4.mb0 {margin-bottom: 0;}


/*--------------------------------------------------------------------------
	//	LAYOUT BUILDER
--------------------------------------------------------------------------*/ 

.element_carousel .carousel {margin-left: -15px;margin-right: -15px;}
.element_carousel .carousel-caption {top: 50%;transform: translateY(-50%);bottom: initial;-webkit-transform-style: preserve-3d;-moz-transform-style: preserve-3d;transform-style: preserve-3d;}

.spacer {clear:both;}

.element_accordion .panel-heading a:active, .element_accordion .panel-heading a:focus, .element_accordion .panel-heading a:hover {text-decoration:none;}
.element_accordion .panel-heading {display: block;position: relative;padding: 15px;text-decoration: none;}
.element_accordion .panel-heading > a:after {content: "\f067"; /* fa-plus */font-family: 'FontAwesome';position: absolute;right: 15px;top:15px;font-size:15px;}
.element_accordion .panel-heading > a[aria-expanded="true"]:after {content: "\f068"; /* fa-minus */right: 15px;top:15px;font-size:15px;}

.row.pad-none, .pad-none {padding: 0 0;}
.row.pad-xs, .pad-xs {padding: 10px 0;}
.row.pad-sm, .pad-sm {padding: 25px 0;}
.row.pad-md, .pad-md {padding: 50px 0;}
.row.pad-lg, .pad-lg {padding: 100px 0;}
.row.pad-xl, .pad-xl {padding: 150px 0;}

.container-fluid {padding-left:0; padding-right:0;}

.content-wrapper a {text-decoration:underline;}

.row {padding: 25px 0; margin-right:0; margin-left:0;}
.nopad {padding:0;}
.row-padding {padding-top:50px; padding-bottom:50px;}
.grid-item {margin-bottom: 30px;}
.panel-default {border-color: transparent;}

.header{padding: 15px 0 15px 0; background:#fff;}
.header p {margin-bottom:0;}
.header h1, .header h2 {margin-top:0;font-weight: normal;}
.header h2 {color:#333333;font-size:20px;}
.header a:hover {text-decoration:none;}

/* This class is added on scroll */
.fixed {position: fixed; top: 0; z-index: 1; width:100%;}

.navbar a {text-decoration:none !important;}
.navbar a:hover {background:transparent !important; background-image:none!important;}
.navbar {margin-bottom:0;background-color:transparent; border-color:transparent;background-image:none;box-shadow:none;}
.navbar-collapse.collapse {padding-left: 0px;margin-left: 0px;}
.navbar .navbar-nav {display: inline-block;float: none;vertical-align: top;}
.navbar .navbar-collapse {text-align: center;}
.navbar-nav>li>a {padding-top: 23px;padding-bottom: 22px;}
.nav-logo-img img {width: 200px !important;}

.social-links .fa {margin-right:10px;}

.navbar-default li a:focus, .navbar-default li a:active, .navbar-default li a:visited {background:transparent; background-image:none; color: #000;}


.sidebar ul {margin-bottom:0;}
.sidebar {margin-top: 20px;}

.excerpt-inner {padding:25px;}


.dropdown-menu>.active>a, .dropdown-menu>.active>a:focus, .dropdown-menu>.active>a:hover, .navbar .navbar-nav .open .dropdown-menu > .active > a, .navbar .navbar-nav .open .dropdown-menu > .active > a:hover, .navbar .navbar-nav .open .dropdown-menu > .active > a:focus,.navbar-default .navbar-nav .open .dropdown-menu>li>a, .dropdown-menu {background-color:#ac0a06; background-image:none;color:#fff;}

.post-content ol, .post-content ul {margin:20px 0;}

/*--------------------------------------------------------------------------
	//	IMAGES
--------------------------------------------------------------------------*/ 

.img-holder {height:450px;position:relative;-webkit-background-size: cover; -moz-background-size: cover;-o-background-size: cover;background-size: cover; background-position:top center;}
.img-inner {position:absolute; width:100%; height:100%;opacity: 0;-webkit-transition: 0.6s;transition: 0.6s; padding:20px;border: 3px solid #eee;}
.img-inner:hover {background-color:rgba(59, 184, 120, 0.6); opacity:1;}
.img-center {margin:0 auto;}

img.nav-logo {max-width: 250px;padding: 10px;}


/*--------------------------------------------------------------------------
	//	POST CONTENT
--------------------------------------------------------------------------*/ 

.meta-data {border-top: 1px solid #ddd;border-bottom: 1px solid #ddd;margin: 20px 0;padding: 10px 0; font-weight:400;}
.meta-space {margin-right:20px;}


/*--------------------------------------------------------------------------
	//	SIDEBARS
--------------------------------------------------------------------------*/ 


.sidebar li {line-height:2;}
.sidebar ul {padding-left: 20px;}


/*--------------------------------------------------------------------------
	//	FOOTER
--------------------------------------------------------------------------*/ 

.footer ul { padding-left:20px; list-style:none; }
.footer li { margin-bottom:10px; }
.prefooter .fa {margin: 0 15px;}

/*--------------------------------------------------------------------------
	//	NAVIGATION
--------------------------------------------------------------------------*/ 

/*
ul.menu-main-menu .fa {float: left;vertical-align: middle;margin-top: 18px;color: #3bb878;}
.navbar-nav {float:right;}
.navbar-default {background:#333;border-bottom: 4px solid #ddd;padding:15px 0;}
.navbar-default .navbar-nav>li>a {color:#ffffff;background-color:transparent;font-size: 18px;}
.navbar-default .navbar-nav>li#menu-item-1321 a{color:#3bb878;}
.navbar-default .navbar-nav>li>a:hover,
.navbar-default .navbar-nav>li>a:focus {color:#3bb878;background-color:transparent;}
.navbar-default .navbar-nav>.active>a {color:#3bb878;background-color:transparent;border-bottom:3px solid #3bb878;}
.navbar-default .navbar-nav>.active>a:hover,
.navbar-default .navbar-nav>.active>a:focus,
.navbar-default .navbar-nav>.current-menu-ancestor>a:hover,
.navbar-default .navbar-nav>.current-menu-ancestor>a:focus,
.navbar-default .navbar-nav>.current_page_parent>a:focus,
.navbar-default .navbar-nav>.current_page_parent>a:hover, .navbar-default .navbar-nav>.open>a, .navbar-default .navbar-nav>.open>a:focus, .navbar-default .navbar-nav>.open>a:hover {color:#3bb878;background-color:transparent;}
a.navbar-brand img {height: 35px;margin-top: -5px;}
.navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .active > a {background-image:none;}
.nav .open>a, .nav .open>a:focus, .nav .open>a:hover {border-color:#333;}
.dropdown-menu>.active>a, .dropdown-menu>.active>a:focus, .dropdown-menu>.active>a:hover {color:#3bb878;background-color:transparent;background-image:none;}
.dropdown-menu {background:#333;border-left: 4px solid #ddd;border-right: 4px solid #ddd;border-bottom: 4px solid #ddd; border-top:0;}
.dropdown-menu li a {color:#ffffff;}
.dropdown-menu li a:hover {color:#3bb878;}
.navbar-nav>li>.dropdown-menu {margin-top:15px;}
/*

/*--------------------------------------------------------------------------
	//	MASONRY STYLES
--------------------------------------------------------------------------*/

.masonry-brick a {text-decoration:none;}
.masonry-brick .panel {background:#2D372D;padding-bottom: 30px; }
.masonry-brick .panel:hover {background:#000;border:4px solid #3bb878;}
.masonry-brick .panel h4 {color: rgba(255, 178, 23, 0.9);}


/*--------------------------------------------------------------------------
	//	EMBEDS
--------------------------------------------------------------------------*/

.embed-container {position: relative; padding-bottom: 56.25%;height: 0;overflow: hidden;} 
.embed-container iframe,.embed-container object,.embed-container embed { position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
.map-embed-container {position: relative;height: 0;overflow: hidden;width: 100%;height: 450px;margin-left: 0;margin-right: 0;}
.map-embed-container iframe, .map-embed-container object, .map-embed-container embed {position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
.map-overlay {background:transparent; position:absolute; height:100%; width:100%; left:0; right:0; top:0; bottom:0;z-index:999;}


/*--------------------------------------------------------------------------
	//	PAGINATION
--------------------------------------------------------------------------*/

.pagination {display: inline-block;padding-left: 0;margin: 0 0 20px 0;border-radius: 4px;background: transparent;border: 3px solid #ddd;padding: 10px;}
.pagination>.active>a, .pagination>.active>span, .pagination>.active>a:hover, .pagination>.active>span:hover, .pagination>.active>a:focus, .pagination>.active>span:focus {background-color: #dabd56;border-color: #ddd;}

.post-navigation {border-top: 1px solid #ddd;border-bottom: 1px solid #ddd;margin: 20px 0;padding: 10px 0;}
.post-navigation a {color:#fff;}
.post-navigation a:hover {color:#000; text-decoration: none;}

.pagination>li>a, .pagination>li>span {color:#555;}
.pagination>.active>a, .pagination>.active>span, .pagination>.active>a:hover, .pagination>.active>span:hover, .pagination>.active>a:focus, .pagination>.active>span:focus {background:#ac0a06;border-color:#ac0a06;}


/*--------------------------------------------------------------------------
	//	CSS EFFECTS
--------------------------------------------------------------------------*/

.underline {text-decoration:underline; margin-bottom:10px !important;}
.drop-shadow {position: relative;padding: 1em;margin: 2em 10px 4em;background: #fff;-webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;-moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;-webkit-box-shadow: 5px 5px 7px rgba(33,33,33,.7);box-shadow: 5px 5px 7px rgba(33,33,33,.7);-moz-transition: -moz-transform .15s linear;-o-transition: -o-transform .15s linear;-webkit-transition: -webkit-transform .15s linear;}
.drop-shadow.lifted {}
.lifted {margin: 30px auto;-moz-border-radius: 4px;margin-top: -10px;}
.lifted:before, .lifted:after {bottom: 15px;left: 10px;width: 50%;height: 20%; max-width: 300px;max-height: 100px;-webkit-box-shadow: 0 15px 10px rgba(0, 0, 0, 0.7);-moz-box-shadow: 0 15px 10px rgba(0, 0, 0, 0.7);box-shadow: 0 15px 10px rgba(0, 0, 0, 0.7);-webkit-transform: rotate(-3deg);-moz-transform: rotate(-3deg);-ms-transform: rotate(-3deg);-o-transform: rotate(-3deg);transform: rotate(-3deg);}
.drop-shadow:before, .drop-shadow:after {content: "";position: absolute;z-index: -2;}

.trans20 {opacity: 0.2;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0.2)";}
.trans40 {opacity: 0.4;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0.4)";}
.trans60 {opacity: 0.6;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0.6)";}
.trans80 {opacity: 0.8;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0.8)";}

.transwhite {background-color: #fff;background-color: rgba(255,255,255,0.5);}

.vertical-align {display: -webkit-box;display: -moz-box;display: -ms-flexbox;display: -webkit-flex;display: flex;-webkit-box-pack: center;-moz-box-pack: center;-ms-flex-pack: center;-webkit-justify-content: center;justify-content: center;-webkit-box-align: center;-moz-box-align: center;-ms-flex-align: center;-webkit-align-items: center;align-items: center;}

.square {width: 50vw;height: 50vw;}

/*--------------------------------------------------------------------------
	//	COMMENT SECTION
--------------------------------------------------------------------------*/

p.nocomments {display:none;}
.comment-section {margin:50px 0;}
.comment-title {padding:20px;}
.comments {position: relative;  background:#fff;  -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1);  box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1); padding:0; margin-bottom:35px;  border-radius: 3px;  -webkit-box-sizing: border-box;  -moz-box-sizing: border-box;  -ms-box-sizing: border-box;  box-sizing: border-box;}
#thecomments {margin-top: 0;}
#thecomments h2.comment-title { color:#fff; background:#65686B; font-size:18px; padding:12px; position: relative;}
#thecomments h2.comment-title:after {  top: 100%;  left: 10%;  border: solid transparent;  content: " ";  height: 0;  width: 0;  position: absolute;  pointer-events: none;  border-color: rgba(196, 71, 71, 0);  border-top-color: #403e3f;  border-width: 5px;  margin-left: -5px;}
#addcomments {margin-top: 0;} 
ol.commentlist, ol.pingbacklist, .commentspagination, .nocomments, #addcomments { margin: 0;  padding: 0 20px;}
.comments ol {padding-left: 15px !important;}
#addcomments {padding-bottom:10px; padding-top:10px;}
.commentlist .comment-body{ padding: 0; margin: 0;  position: relative;    border-top: 0;}
.comment-body .reply{ margin-top:15px;}
ol.commentlist li, ol.pingbacklist li{  margin-top:20px;  list-style: none;    padding: 20px 0;     background:#fff;  border-bottom: 1px solid #e9e9e9;}
ol.commentlist li ul.children {margin-bottom: 0px !important;    margin-top: 25px !important;}
ol.commentlist li ul.children li{ border-bottom: 0; padding-left: 20px  !important; margin: 10px 0; border-left:1px solid #e8e8e8;}
ol.commentlist li ul.children comment-body{ padding: 15px 0 5px;  margin: 10px 0 0; position: relative;}
ol.commentlist img.avatar, ol.pingbacklist img.avatar { margin-right:20px; float:left; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%;}
ol.commentlist .comment-author, ol.pingbacklist .comment-author { line-height: 25px; border:0; width:100%; }
.comment-author {margin-bottom:0;}
.comment-body cite.fn{  font-style: normal;   color: #000;}
.comment-time{  font-size: 12px;  font-style: normal;    color: #ccc;}
.commentmetadata {  clear: both;    padding: 0;    margin: 0;}
.commentmetadata a{ margin: 0;  color: #000;    text-decoration: underline;}
.comment-body p{  margin: 5px; padding:0 10px;}
.comment-body .comment-author.vcard{  margin: 0;}
.comment-body ul, .comment-body ol {padding:0; margin:0;}
.comment-body ul li, .comment-body ol li {padding:7px 0; margin:0; border:0;}
.comment-body ul li ul, .comment-body ol li ol {padding:7px 0 7px 7px; margin:0; border:0;}
#reply-title { margin:10px 0; padding:0 0 5px; font-weight:normal; font-size:26px; line-height:1.3; display: block; margin-bottom:-2px; font-weight: 700;}
form#commentform textarea {min-height:150px;}
#thecomments .btn {padding:2px 10px;}


/*--------------------------------------------------------------------------
	//	RESPONSIVE STYLES
--------------------------------------------------------------------------*/

@media (max-width:1200px){
.header h1 {font-size:32px;}
.header h2 {font-size:20px;}
	
}

@media (max-width:997px){
.container.widemob {width:100%;}
}
@media (max-width:991px){
.header .container {width:100%;}
h1 {font-size: 32px;}
h2 {font-size: 28px;}
h3 {font-size: 24px;}
h4 {font-size: 20px;}
h5 {font-size: 16px;}
h6 {font-size: 12px;}
html, body, p {font-size: 12px;}
}

@media (min-width: 768px) and (max-width: 991px) {
}


@media (min-width: 768px){
}

@media (max-width:767px){
.center-mob {text-align:center !important;}
.navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:focus, .navbar-default .navbar-nav>.active>a:hover {color: #fff;background-color: #ac0a06; background-image: none;}

@media (max-width:600px){
}

@media (max-width:465px){

h1 {font-size: 28px;}
h2 {font-size: 24px;}
h3 {font-size: 20px;}
h4 {font-size: 16px;}
h5 {font-size: 12px;}
h6 {font-size: 8px;}
html, body, p {font-size: 12px;}

.header h1 {font-size:20px;}
.header h2 {font-size: 14px;}
}