/*
Theme Name: Mark Csele Custom Theme
Theme URI: http://wordpress.org/
Description: Blank Theme from default Template
Author: Christina Csele
Version: 1.0
Tags: blank
Text Domain: blanktheme
*/

/*	Global Colours
Green: #36802D;
Blue: #1F75FE;
*/

/* Reset All */

* {
	margin: 0px;
	padding: 0px;
}

header,
body {
	background-color: #36802D;
}

.main {
	background-color: #fff;
}

.row .columns {
	font-family: Open Sans, sans-serif;
	font-size: 15px;
	line-height: 20px;
	text-align: left;
}

a img {
	border: none;
}

/* Basic Content Styles */
h1, 
h2, 
h3 {
	font-family: 'Abel', sans-serif;
}

h1 {
	margin-bottom: 20px;
	font-size: 45px;
	line-height: 50px;
	color: #666;
}

h2 {
	margin-bottom: 15px;
	color: #1F75FE;
	font-size: 30px;
	line-height: 35px;
	padding-top: 10px;
}

h3 {
	margin-bottom: 10px;
	color: #36802D;
	font-size: 20px;
	line-height: 25px;
}

p, 
.main ul, 
.main ol, 
table {
	margin-bottom: 15px;
}

.main ul li,
.main ol li {
	
}

.main ul {
	padding-left: 15px;	
}

.main ol {
	padding-left: 20px;	
}

a {
	text-decoration: none;
	color: #1F75FE;	
}

a:hover {
	text-decoration: underline;	
}

ul.block-grid {
	margin-left: 0px !important;
	margin-right: 0px !important;
}

.section {
	padding: 15px 0;
}

.section:first-of-type {
	padding-top: 100px;
}

.section:last-of-type {
	padding-bottom: 100px;
}

body.error404 .main,
body.search .main {
	padding: 50px 0;
}

body.error404 .main {
	background-image: url(images/404.png);
	background-repeat: no-repeat;
	background-position: 90% bottom;
	min-height: 590px;
}

/* End Content Styles */

/* =Header
-------------------------------------------------------------- */
header {
	padding: 20px 0;
}

img.banner {
	display: block;
	width: 100%;
	max-width: 100%;
}

header form {
	float: right; 
}

body.error404 .main form input,
header form input {
	border: 0px;
	line-height: 20px;
	font-size: 15px;
	border-radius: 0;
	padding: 5px 10px;
}

body.error404 .main form input {
	border: 1px solid #666;
}

/* =Menu
-------------------------------------------------------------- */
nav {
	/*background: #333;*/
	display: block;
	margin: 30px auto 0;
	width: 695px;
	float: right;
	position: relative;
	z-index: 9999;
	min-height: 42px;
	height: auto !important;
	height: 42px;
	*zoom: 1;
}

nav li {
	float: left;
	position: relative;
	list-style: none;
}

nav a {
	color: #FFFFFF;
	display: block;
	line-height: 42px;
	padding: 0 16px;
	font-size: 15px;
	text-transform: uppercase;
	text-decoration: none;
}

nav ul ul {
	box-shadow: 0px 3px 3px rgba(0,0,0,0.2);
	-moz-box-shadow: 0px 3px 3px rgba(0,0,0,0.2);
	-webkit-box-shadow: 0px 3px 3px rgba(0,0,0,0.2);
	display: none;
	position: absolute;
	top: 42px;
	left: 0;
	float: left;
	width: 180px;
	z-index: 99999;
	padding: 5px;
	background-color: #666;
}
nav ul ul ul {
	left: 100%;
	top: -5px;
	background-color: #666;
}

nav ul li:hover > ul {
	display: block;
}

nav ul ul a {
	padding: 5px 10px;
	font-size: 12px;
	line-height: 1.8em;
	min-width: 170px;
}

nav li:hover > a,
nav ul li.current_page_item > a,
nav ul li.current-menu-ancestor > a,
nav ul li.current-menu-item > a,
nav ul li.current-menu-parent > a,
* html nav ul li.current_page_item a,
* html nav ul li.current-menu-ancestor a,
* html nav ul li.current-menu-item a,
* html nav ul li.current-menu-parent a,
* html nav ul li a:hover {
	background-color: #1F75FE;
	text-decoration: none;
}

ul ul .menu-item-has-children {
	width: 175px;
}

nav a.menu-link {
   display:  none;
   background: #1F75FE;
   padding-top: 6px;
   padding-bottom: 35px;
   height: 42px;
   line-height: 33px;
   text-transform: uppercase;
   width: 100%;
   color: #FFFFFF;
   font-weight: bold;
   text-decoration: none;
   text-align: left;
   font-size: 15px;
   padding-left: 15px;
}

.menu:before,
.menu:after {
    content: " "; 
    display: table; 
}

.menu:after {
    clear: both;
}

.menu-link:after {
	content: url( images/menu.png );
	right: 20px;
	top: 6px;
	position: absolute;
}


/* =Page styles
-------------------------------------------------------------- */
.quickLinks h2 {
	color: #666;
	text-transform: uppercase;
}

.quickLinks {
	background-color: #eee;
}

.quickLinks .column {
	padding: 0 20px 40px;
}

.quickLinks .column .imgWrap {
	background-size: cover;
	background-position: center;
	padding: 20px;
}

.quickLinks .column a {
	display: block;
	text-decoration: none;
	border: 1px solid #fff;
	padding: 50px 20px;
	background-color: rgba(0,0,0,0.3);
	text-align: center;
	text-transform: uppercase;
	color: #fff;
	font-weight: 700;
	font-size: 25px;
	line-height: 30px;
}

.quickLinks .column a:hover {
	background-color: rgba(31,117,254, 0.4)
}

.greenBar {
	background-color: #36802D;
}

.blueBar {
	background-color: #1F75FE;
}

.codeBlock {
	background-color: #333;
}

.greyBar {
	background-color: #EEE;
}

.codeBlock .row .columns {
	color: #fff;
	font-family: 'PT Mono';
}

.greenBar p,
.greenBar h2,
.greenBar h3,
.greenBar ul,
.greenBar ol,
.greenBar table,
.greenBar,
.blueBar p,
.blueBar h2,
.blueBar h3,
.blueBar ul,
.blueBar ol,
.blueBar table,
.blueBar {
	color: #fff;
}

.blueBar table {
	background-color: #fff;
}

.blueBar table tr td {
	color: #000;
}

.blueBar a,
.greenBar a {
	color: #fff;
	text-decoration: underline;
}

.blueBar a:hover,
.greenBar a:hover {
	text-decoration: none;
}

.collapseRow .column,
.staticGal .column {
	padding: 0 10px 20px;
}

a.photo {
	display: block;
	height: auto;
	width: 100%;
	text-align: center;
	vertical-align: middle;
	position: relative;
	background-color: #1F75FE;
}

a.photo img {
	margin: auto;
	width: 100%;
	display: block;
}

a.photo:hover img {
	opacity: 0.5;
	cursor: pointer;
}

.mfp-wrap,
.mfp-bg {
	z-index: 99999;
}

.accordianWrap {
	background-color: #eee;
}

.accordianWrap h3 {
	background-color: #36802D;
	position: relative;
	padding: 10px 45px 10px 20px;
	color: #fff;
	text-transform: uppercase;
}

.accordianWrap h3:hover {
	background-color: #1F75FE;
	cursor: pointer;
}

.accordianWrap h3:after {
	content: "+";
	position: absolute;
	right: 20px;
	top: 50%;
	margin-top: -15px;
	font-size: 30px;
	color: #fff;
	padding-left: 10px;
}

.accordianWrap h3.open:after {
	content: '-';
}

.collapseRow {
	padding: 20px;
	background-color: #fff;
	margin-bottom: 20px;
}

.cpt {
	background-color: #eee;
	padding: 20px;
	margin-bottom: 20px;
}

.cpt img.size-featimg {
	float: right;
	padding-left: 30px;
	padding-bottom: 15px;
}

a.readmore {
	display: inline-block;
	background-color: #1F75FE;
	color: #fff;
	padding: 10px 20px;
	text-transform: uppercase;
}

a.readmore:hover {
	text-decoration: none;
	background-color: #36802D;
}

.backBar .row .columns {
	text-align: right;
}

.backBar a {
	display: inline-block;
	background-color: #1F75FE;
	color: #fff;
	padding: 10px 20px;
	text-transform: uppercase;
}

.backBar a:hover {
	text-decoration: none;
	background-color: #36802D;
}

.cpt-main-content {
	padding-bottom: 30px;
}

blockquote {
	color: #333;
	font-style: italic;
}

.photoGallery.section {
	padding-top: 0px;
}

.mfp-bottom-bar{
	background-color: #fff;
	text-align: center;
	padding: 10px;
}

.mfp-title {
	color: #1F75FE;
}

.mfp-figure small {
	color: #333;
	padding-top: 5px;
}

img.mfp-img {
	max-height: 700px !important;
}

.paginateMe .page-numbers {
	display: inline-block;
	color: #fff;
	background-color: #1F75FE;
	padding: 5px;
}

.paginateMe .page-numbers.current,
.paginateMe .page-numbers:hover {
	text-decoration: none;
	background-color: #36802D;
}

iframe {
	display: block;
	margin: 0 auto 15px;
	max-width: 100%;
}

a.popup:hover img {
	opacity: 0.6;
	border-color: #1F75FE;
}

a.popup img {
	border-bottom: 5px solid #36802D;
	border-top: 5px solid #36802D;
}



/* =Footer
-------------------------------------------------------------- */
footer {
	padding: 50px 0;
}

footer .row .columns a,
footer .row .columns {
	color: #fff;
	text-align: center;
	font-size: 13px;
	line-height: 15px;
}


footer .row .columns a {
	text-decoration: underline;
}

footer .row .columns a:hover {
	text-decoration: none;
}

/* =Clearfix
-------------------------------------------------------------- */
.clearfix:after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
}

.clearfix { 
	display: inline-block; 
}

* html .clearfix { 
	height: 1%; 
}

.clearfix { 
	display: block; 
}

/* =Auxilary Pages
-------------------------------------------------------------- */
body.search .entry-utility,
body.search .entry-meta {
	display: none;
}

body.blog .row.pagination {
	padding: 15px 0;
}

body.blog .row.pagination .columns {
	text-align: center;
}

/* =Images
-------------------------------------------------------------- */
.main img {
	margin: 0;
	max-width: 100%;
}

.entry-content img {
	max-width: 1200px;
}

.main .alignleft,
.main img.alignleft {
	display: inline;
	float: left;
	margin-right: 24px;
	margin-top: 4px;
}

.main .alignright,
.main img.alignright {
	display: inline;
	float: right;
	margin-left: 24px;
	margin-top: 4px;
}

.main .aligncenter,
.main img.aligncenter {
	clear: both;
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.main img.alignleft,
.main img.alignright,
.main img.aligncenter {
	margin-bottom: 12px;
}

.wp-caption img {
	display: block;
}

.wp-caption-text {
	background-color: #eee;
	font-style: italic;
	font-size: 13px;
	line-height: 15px;
	padding: 10px;
	text-align: center;
	display: inline-block;
	margin-bottom: 15px;
	width: 100%;
}

.greyBar .wp-caption-text {
	background-color: #fff;
}	


/* =Widget Areas
-------------------------------------------------------------- */
.widget-area ul {
	list-style: none;
	margin-left: 0;
}

.widget-area ul ul {
	list-style: square;
	margin-left: 1.3em;
}

.widget_search #s {/* This keeps the search inputs in line */
	width: 100%;
}

.widget_search label {
	display: none;
}

.widget-container {
	margin: 0 0 18px 0;
}

.widget-title {
	color: #222;
	font-weight: bold;
}

.widget-area a:link,
.widget-area a:visited {
	text-decoration: none;
}

.widget-area a:active,
.widget-area a:hover {
	text-decoration: underline;
}

.widget-area .entry-meta {
	font-size: 11px;
}

.searchBar {
	background-color: #eee;
	padding: 10px 20px;
	margin-bottom: 30px;
	text-transform: uppercase;
}

.searchBar h2 span {
	color: #36802D;
	text-transform: none;
}

/* =Table Styles
-------------------------------------------------------------- */
table thead tr th {
	border-left: 1px solid #D3D3D3;
	padding: 10px 10px;
}

table {
	border-spacing: 0px;
	border-top: 1px solid #D3D3D3;
	border-right: 1px solid #D3D3D3;
	width: 100%;
}

table tr td {
	padding: 10px 10px;
	border-left: 1px solid #D3D3D3;
	border-bottom: 1px solid #D3D3D3;
}

table tr.shaded td {
	background-color: #EEEEEE;
}

.greyBar table tr.shaded td {
	background-color: #fff;
}

table thead tr.shaded th,
table thead tr th,
table thead tr.shaded td,
table thead tr td {
	background-color: #36802D !important;
	color: #FFFFFF;
	font-weight: bold;
	text-transform: uppercase;
	font-size: 22px;
	line-height: 30px;
	font-family: 'Abel', sans-serif;
}

table.No-Style-Table,
table.No-Style-Table tr td,
table.No-Style-Table tr.shaded td {
	border: 0px !important;
	padding: 0px !important;
	background-color: transparent !important;
}

/* =MEDIA QUERIES
-------------------------------------------------------------- */
@media only screen and (max-width: 1240px) {
	.section,
	header,
	footer,
	body.search .main,
	body.error404 .main {
		padding-left: 20px;
		padding-right: 20px;
	}
}

@media only screen and (max-width: 1124px) { 
	header .row .columns {
		display: block;
		width: 100% !important;
	}

	header .row .columns.large-4 {
		text-align: center;
		padding-bottom: 15px;
	}

	header form {
		float: left;
		text-align: center;
		margin-top: 6px;
	}

	nav {
		margin-top: 0px;
	}
}

@media only screen and (max-width: 1024px) { /*  MEDIUM GRID BREAK  */
	
}

@media only screen and (max-width: 960px) {
	header form {
		float: none;
		margin-bottom: 10px;
	}

	/* Override other menu code */
	nav ul li:hover > ul {
		display: none;
	}
	
	nav ul ul {
		top: 0px;
		position: relative;
		float: none;
		display: none !important;
	}

	nav li {
		height: auto; /* override for menu height issue */
		/* set list item height */
		min-height: 36px; 
		height: auto !important;
		height: 36px;
	}

	/*mobile menu */
	.active {
        display: block !important;
    }

    .menu > li {
        float: none !important;
    }

    .menu > li > .menu-item-has-children {
   		background-image: none; 
    }

    .menu-item-has-children {
    	width: 100%;
    }

    nav ul li {
    	margin-bottom: 0px !important;
    	border-bottom: 1px solid #666;
    }

    .menu li .more {
        background-image: url(images/list.png);
        background-repeat: no-repeat;
        background-position: 50% 50%;
        float: right;
      	width: 20%;
		border-left: 1px solid rgba(255,255,255,.3);
		padding: 8px 15px;
        cursor: pointer;
    	z-index: 200;
        position: relative;
    }

   .menu li .more:before {
		content: "";
		background: rgba(0,0,0,.3);
		width: 1px;
		display: block;
		position: absolute;
		top: 0;
		bottom: 0;
  		left: -2px;
    }

    ul.menu {
    	border-top: 4px solid #666;
    }
    
    .menu ul {
        display: block;
        width: 100%;
        z-index: 9999999;
    }
   	
   	.menu > li.hover > ul, 
   	.menu li li.hover ul {
        position: static;
        display: block !important; /* Show Menu Fix */
    }
    
    nav a {
    	width: 100%;
    	padding: 0px;
    	text-align: left;
    	padding-left: 15px;
    	line-height: 35px
    }

    nav ul ul ul li a {
		padding-left: 45px;
	}

    nav ul ul,
    nav ul ul li {
    	width: 100%;
    }

    nav ul ul {
    	padding: 0px !important;
    }

    nav ul ul li {
    	float: none;
    }
    nav {
   		width:100% !important;
   	}

   	nav ul ul ul {
		left: 0;
		top: 0;
	}
}

@media only screen and (max-width: 850px) {
	body.error404 .main .row.mainContent {
		background-color: rgba(255,255,255,0.5);
		padding: 50px 20px;
		min-height: 590px;
	}

	body.error404 .main {
		padding: 0px;
	}

}	

@media only screen and (max-width: 780px) {
	img.alignleft,
	img.alignright,
	.main .alignright, 
	.main .alignleft,
	.main img.alignleft,
	.main img.alignright,
	.cpt img.size-featimg  {
		margin: 0 auto 15px;
		display: block;
		float: none;
		padding: 0px;
		max-width: 100%;
	}


}	

@media only screen and (max-width: 640px) { /*  SMALL GRID BREAK  */
	.footer span.pipe {
		display: none;
	}

	.footer span.design {
		display: block;
	}
}