/*
Color Palette

Body:
background: #f9f9f9;
color: #333;
Main Content BG: #f9f9f9;

Menu Trigger:
Background: #efefef;
Text Color: #4d4d4d;

Off Canvas Nav
Background: #292929;
Links: #a9b5b7;

Link Color: #197BB8;
Link Hover: #0D537F;
Subheader: #6f6f6f;

DC Green: #2bb673
DC Hover Green: #1f915a

Scrolling BG 1: #000;
Scrolling BG 2: #197BB8;
Scrolling BG 3: #f9f9f9;
*/

/* <textEditor> */
.boxLinkWhite {
	padding: 10px 20px;
	border: solid 2px #AFAFAF;
	color: #AFAFAF;
	margin: 1rem .3125rem;
	display: inline-block;
	}
.boxLinkBlack {
	padding: 10px 20px;
	border: solid 2px #000;
	color: #000;
	margin: 3rem .3125rem 2rem;
	display: inline-block;
	}
.boxLinkGreen {
	padding: 10px 20px;
	border: solid 2px #2bb673;
	color: #2bb673;
	margin: 3rem .3125rem 2rem;
	display: inline-block;
	}
.subheader {
	color: #6f6f6f;
	margin-bottom: 1.25rem;
	font-size: .875rem;
	}
.strikethrough {
	text-decoration: line-through;
}
.strokethrough-gray {
	text-decoration: line-through;
	color: #919191;
}
/* </textEditor> */

/* Hover states for text editor */
.boxLinkWhite {
	border: solid 2px #fff;
	color: #fff;
	}
a.boxLinkWhite:hover {
	background: #fff;
	color: #2bb673;
	}
a.boxLinkBlack:hover {
	background: #000;
	color: #fff;
	}
a.boxLinkGreen:hover {
	background: #2bb673;
	color: #fff;
	}



/* ---------------------------------------------------------------- Google Fonts */

/* Adding Google Fonts */
@font-face {
	font-family: Montserrat;
	src: url(../Montserrat-Light.ttf);
	font-weight: normal;
	}
@font-face {
	font-family: Montserrat;
	src: url(../Montserrat-Regular.ttf);
	font-weight: 500;
	}
@font-face {
	font-family: Montserrat;
	src: url(../Montserrat-Bold.ttf);
	font-weight: bold;
	}


/* ---------------------------------------------------------------- Base Styles */

html, body {height: 100%;} 

/* Fix list style on menu */
.lcms_toolbar, .lcms_toolbar_user_nav, .lcms_toolbar_session {list-style: none;}

/* Make LCMS Form wrapper 100% to match HTML and Body */
#frm {height: 100%;}

/* Font Smoothing for Everything */
html * {-webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;}

/* Adding In Border Box with Webkit and Moz */
html {-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}

/* Fix LCMS toolbar */
.lcms_toolbar_nav_switch {-webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box;}

body {
	font-family: Montserrat, "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
	background: #f9f9f9;
	color: #333;
	}

/* ---------------------------------------------------------------- LCMS Adjustments */
.lcms-context-pagebar {
	width: 300px;
}
.templateChooser {
	width: 270px;
}
.templateChooser p select {
	width: 270px;
}


.blogList .postFeaturedImage {
    margin-bottom:10px
}

.blogList ul {
    padding: 0;
    margin: 0;
    list-style:none;
}

.blogList ul li {
    list-style: none;
    clear:both;
}

.blogList .postTitle {
    clear:none;
}


/* ---------------------------------------------------------------- Type Resets */
 /* Default Link Styles */
a {
	color: #2bb673; /*dc green*/
	line-height: inherit;
	text-decoration: none;
	}
	a:hover,
	a:focus {
		color: #1f915a;
		}
/* Default header font and weight */
h1, h2, h3, h4, h5, h6 {
	font-family: Montserrat, "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
	font-weight: 700;
	}

.h1, h1 {
    font-size: 2.5rem;
    line-height: 1.4;
    margin-top: 0;
    margin-bottom:.5rem
}

.h2, h2 {
    font-size: 2rem;
    line-height: 1.4;
    margin-top: 0;
    margin-bottom:.5rem
}

.h3, h3 {
    font-size: 1.1875rem;
    line-height: 1.4;
    margin-top: 0;
    margin-bottom:.5rem
}

.h4, h4 {
    font-size: 1.125rem;
    line-height: 1.4;
    margin-top: 0;
    margin-bottom:.5rem
}

.h5, h5 {
    font-size: 1.0625rem;
    line-height: 1.4;
    margin-top: 0;
    margin-bottom:.5rem
}

.h6, h6 {
    font-size: 1rem;
    line-height: 1.4;
    margin-top: 0;
    margin-bottom:.5rem
}

@media print, screen and (min-width: 40em) {
    .h1, h1 {
        font-size:3rem
    }

    .h2, h2 {
        font-size:2.5rem
    }

    .h3, h3 {
        font-size:1.9375rem
    }

    .h4, h4 {
        font-size:1.5625rem
    }

    .h5, h5 {
        font-size:1.25rem
    }

    .h6, h6 {
        font-size:1rem
    }
}

.main-content h3,
.main-content h4 {
	margin-bottom: 1rem;
}

.callout {
    border: none;
}

/* ---------------------------------------------------------------- Main Content */
/* ----------------------------------All content needs to be inside main-content */

.main-content {
	/* min-height and z-index so main element completely covers the off-canvas menu */
	min-height: 100%;
	position: relative;
	background-color: #f9f9f9;
	z-index: 2;
	/* Force Hardware Acceleration in WebKit */
	-webkit-transform: translateZ(0);
	-webkit-backface-visibility: hidden;
	-webkit-transition-property: -webkit-transform;
	-moz-transition-property: -moz-transform;
	transition-property: transform;
	-webkit-transition-duration: 0.4s;
	-moz-transition-duration: 0.4s;
	transition-duration: 0.4s;
	}
	.main-content.menu-is-open {
		/* translate to show the off-canvas menu */
		-webkit-transform: translateX(-260px);
		-moz-transform: translateX(-260px);
		-ms-transform: translateX(-260px);
		-o-transform: translateX(-260px);
		transform: translateX(-260px);
		}
/* Homepage has a class of cover-page on the body*/
.cover-page .main-content, .cover-page{
	height: 100%;
	}

/* Page Headers from Inside */
.page-header {
	padding: 10em 0 2em;
	margin-bottom: 5rem;
	background: #2bb673;
	text-align: center;
	}
	.page-header h1 {
		color: #fff;
		}
/* Header Photo from Inside Advanced*/
.header-photo {
	position: relative;
	margin-top: 5rem;
	margin-bottom: 3.75rem;
	background: #2bb673;
	min-height: 10.5rem; /*200px*/
	}
.header-photo .imageElement img {
    	
    }
.header-photo .fade .imageElement img {
	opacity: 0.7;
	filter: alpha(opacity=70); /* For IE8 and earlier */
    }
/* Header Photo in Admin View*/
.lcms_AdminView .header-photo {
	min-height: 16.25rem;
	}
@media only screen and (min-width: 768px) {
  .header-photo {
	  margin-top: 6.25rem;
  }
}
/* Header Photo Text class ----- when is this used? */
.header-photo-text {
	z-index: 3;
	position: absolute;
	left: 50%;
	top: 50%;
	bottom: auto;
	right: auto;
	-webkit-transform: translateX(-50%) translateY(-50%);
	-moz-transform: translateX(-50%) translateY(-50%);
	-ms-transform: translateX(-50%) translateY(-50%);
	-o-transform: translateX(-50%) translateY(-50%);
	transform: translateX(-50%) translateY(-50%);
	width: 90%;
	max-width: 768px;
	text-align: center;
	color: #fff;
	text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
	}
.header-photo-text h1,
.header-photo-text h2,
.header-photo-text h3 {
	color: #fff;
	/*text-transform: uppercase;
	letter-spacing: 4px;*/
	}
.header-photo-text h1 {
	
	}
@media only screen and (min-width: 768px) { /*640*/
	.header-photo-text h1 {
		font-size: 3.25rem; /*64px*/
	}
}


/* ---------------------------------------------------------------- Fixed and Scrolling Backgrounds */

/*Change all headings to white in fixed backgrounds */
.fixed-bg h1, .fixed-bg h2, .fixed-bg h3, .fixed-bg h4 {
	color: #fff;
	}
.fixed-bg {
	position: relative;
	min-height: 80%;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
	z-index: 2;
	}
    @media only screen and (max-width: 768px) { /*640*/
        .fixed-bg {
            min-height: 100%;
        }
    }

.fixed-bg .vertical-align {
	position: absolute;
	left: 50%;
	top: 50%;
	bottom: auto;
	right: auto;
	z-index: 1;
	width: 90%;
	max-width: 768px;
	text-align: center;
	color: white;
		-webkit-transform: translateX(-50%) translateY(-50%);
		-moz-transform: translateX(-50%) translateY(-50%);
		-ms-transform: translateX(-50%) translateY(-50%);
		-o-transform: translateX(-50%) translateY(-50%);
		transform: translateX(-50%) translateY(-50%);
	}
.fixed-bg.bg-1 .vertical-align {
	top: 50%;
	max-width: 1100px;
	}

/* Fix image bleeding on small screens */
.fixed-bg .vertical-align img {
    margin-bottom: 0;
    }
    @media only screen and (max-width: 320px) { /*640*/
        .fixed-bg .vertical-align img {
            margin-bottom: -50px;
            }
        }

/* Billboard Text with Intro Class on H1 */
.fixed-bg h1.intro {
	font-weight: 700;
    font-size: 2.5rem;
	margin-bottom: 1.5rem;
	}

/* BG 1*/
.fixed-bg.bg-1 {
	background-image: url(../img/bg_intro3.jpg);
	min-height: 40%;
	margin-top: 80px;
	}
     @media only screen and (max-width: 768px) { /*640*/
        .fixed-bg.bg-1 {
            min-height: 50%;
        }
    }
	/*Make shorter for logged in users*/
	.lcms_AdminView .fixed-bg.bg-1 {
		min-height: 45%;
		}
    .adminBarPresent .lcms_AdminView .fixed-bg.bg-1 {
        min-height: 60%;
    }
/* BG 2*/
.fixed-bg.bg-2 {
	background-image: url("../img/presets-bg.jpg");
	}
.fixed-bg.bg-3 {
	background-image: url("../img/bg_intro3.jpg");
	}

@media only screen and (min-width: 768px) {
	.fixed-bg h1,
	.fixed-bg h2 {
    	font-size: 2.25rem;
  		}
	.fixed-bg h1.intro {
		font-size: 3.5rem;
		}
	}
@media only screen and (min-width: 1170px) {
  .fixed-bg {
  	/* Make the background fixed for large screens */
    background-attachment: fixed;
	}
  .fixed-bg h1,
  .fixed-bg h2 {
    font-size: 3rem;
	}
  .fixed-bg h1.intro {
	font-size: 4.5rem;
	}
}

/* Container for Scrolling Background */
.section-wrap {
	width: 90%;
	margin: 2.5rem auto 5rem; /* 40px */
	}
	.section-wrap::after {
		content: '';
		display: table;
		clear: both;
		}

/* Scrolling Background */
.scrolling-bg {
	text-align: center;
	position: relative;
	padding: 5rem 0 5rem;
	line-height: 1.4;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
	z-index: 2;
	}
	@media only screen and (min-width: 768px) {
		.scrolling-bg {
			padding: 3rem 0 rem;
			/*font-size: 20px;*/
			/*font-size: 1.25rem;*/
			/*line-height: 2;*/
			}
		}
    .scrolling-bg.left-align {
        text-align: left;
        }
	.scrolling-bg.no-shadow {
		box-shadow: none;
		border: 1px solid #ccc;
		border-width: 1px 0 0;
		}
	.scrolling-bg.color-1 {
		background-color: #000000;
		color: #fff;
		}
		.scrolling-bg.color-1 p,
		.scrolling-bg.color-1 h1,
		.scrolling-bg.color-1 h2,
		.scrolling-bg.color-1 h3,
		.scrolling-bg.color-1 h4 {
			color: #fff;
			}
	.scrolling-bg.color-2 {
		/* green */
		background-color: #222;
		color: #fff;
		}
		.scrolling-bg.color-2 h1,
		.scrolling-bg.color-2 h2,
		.scrolling-bg.color-2 h3,
		.scrolling-bg.color-2 h4,
		.scrolling-bg.color-2 h5,
		.scrolling-bg.color-2 h6 {
			color: #fff;
			}
	.scrolling-bg.color-3 {
		/* gray on white */
		background-color: #f9f9f9;
		color: #333;
		}

.center-column {
	max-width: 700px;
	margin-left: auto;
	margin-right: auto;
}

/* ---------------------------------------------------------------- Product Pages */

/* ---------------------------------------------------------------- Product Grid */
/* Blog with special class of product-grid */
.product-grid {
	margin-bottom: 2rem;
	margin-top: 3rem;
	}
.product-detail-page .product-grid {
	margin-bottom: 0;
	margin-top: 0;
	}
.prodict-grid .blogList ul,
.product-grid .blogList ul li {
    list-style: none;
}
.product-grid .blogList .postThumb {
	width: 100%;
	float: none;
	margin-bottom: 0;
    box-shadow: 0px 2px 3px rgba(0, 0, 0, .1);
	}
.product-grid .blogList .postThumb+.postContent {
	margin: 0;
	}
.product-grid .blogList .postThumb+.postContent h2.postTitle {
	font-size: 1rem;
	text-align: center;
	}

.product-grid .blogList .postContent .postTitle,
.product-grid .blogList .postContent .postBody,
.product-grid .blogList .postContent .postInfo {
	display: none;
	}
	/*Return product names for Admins*/
	.adminBarPresent .lcms_AdminView .product-grid .blogList .postContent .postTitle {
		display: block;
		}

/* Making Image Element Thumbnails Match */

.product-grid .photoGalleryElement .thumbnail .thumbContents {
	padding: 0;
	background: none;
	border: none;
	}
.product-grid .photoGalleryElement .thumbnail {
	margin: 0px;
	border: none;
	box-shadow: none;
	-webkit-box-shadow: none;
	
	}
/* Fix the LCMS issue adding 1px to the front of the element */
.photoGalleryElement:before,
.photoGalleryElement:after {
	display: block;
}
/*
.product-grid .photoGalleryElement .thumbnail .thumbscontents a img { };

.product-grid .photoGalleryElement .thumbnail {
	margin-right: 0px;
	margin-bottom: 0px;
	}
.product-grid .thumbnail {
	border: 0px;
	box-shadow: 0px;
	}
.product-grid .photoGalleryElement .thumbnail .thumbContents {
	padding: 0;
	background: transparent;
	border: 0;
	margin: 0;
	}
*/


/* ---------------------------------------------------------------- Product Detail Page */
/* Class of product-detail-page to target*/
.product-detail-page {
	padding-top: 100px;
}
@media only screen and (min-width: 768px) {
	.product-detail-page {
		padding-top: 140px;
    }
}
/* Hiding Everything? */
.product-detail-page .post__featured-image,
.product-detail-page h2.post__title,
.product-detail-page .postViewInfo,
.product-detail-page .post__back {
	display: none;
    }
    .adminBarPresent .lcms_AdminView .product-detail-page h2.post__title {
        display: block;
        font-size: 14px;
        }
/*Set a max value on the image slider height */
.product-detail-page .orbit-image {
    max-height: 433px;
}

.button.success {
    background-color: #2bb673;
    color: #fff;
    }
    .button.success:focus, .button.success:hover {
        background-color: #1f915a;
    }

.product-detail-page .product-title {
    margin-top: 2rem;
    margin-bottom: 1rem;
    text-align: center;
}
.product-detail-page .product-cat {
    text-align: center;
}

.product-detail-page .orbit-container {
/*    box-shadow: 0px 2px 3px rgba(0, 0, 0, .1);*/
    outline: none;
}
.product-detail-page .main-details {
    text-align: center;
}

/* ---------------------------------------------------------------- Article Grid */

/* Display Blog Posts on Homepage as Blocks */
.article-grid .postFeaturedImage {
    display: none;
    }

    @media only screen and (min-width: 1024px) {
            .article-grid .postFeaturedImage {
                display: block;
                }
            .article-grid .postThumb {
                display: none;
                }
            }


/* ---------------------------------------------------------------- Blogs */

/*Hide RSS Badge*/
.rss {
	display: none;
    }

/* Read More Button */
span.readMore {
	display: block;
    margin-top: 1rem;
    }
    span.readMore a {
        /*background: #2bb673;*/
        color: #2bb673;
        padding: 10px 16px;
        text-decoration: underline;
        }
        span.readMore a:hover {
                /*background: #222;*/
                color: #222;
                }

/* Post Date and Comment Line */
.postInfo {
	/*font-size: 13px;*/
}

.post__featured-image {
    margin-bottom: 20px;
}


/* ---------------------------------------------------------------- Blog - with class of entry-content */

.entry-content .blogList {
    margin-top: 3rem;
}
.entry-content .blogList > ul,
.entry-content .blogList > ul > li {
    list-style: none;
}

.entry-content .postBody,
.entry-content .post__body,
.entry-content .post__title,
.entry-content .postFeaturedImage,
.entry-content .postTitle,
.entry-content .postViewInfo,
.entry-content .post__back,
.entry-content .post__comments,
.entry-content .postInfo {
    max-width: 700px;
    margin: 0 auto;
    }
.entry-content .postTitle {
    margin-bottom: 1rem; 
    }
.entry-content h2.postTitle,
.entry-content h2.post__title {
    font-size: 2rem;
    }
/*Move blog detail content down below header*/
.entry-content .post__content {
    margin-top: 100px;
    }
/* Increase margin and line height */
.entry-content .post__content p,
.entry-content .postContent p {
    margin: 1em auto;
    line-height: 2;
}
.entry-content .post__content p img,
.entry-content .postFeaturedImage {
    margin-top: 1.5em;
    margin-bottom: 1.5em;
}

.entry-content .postBody {
    margin-bottom: 2rem;
    padding-bottom: 2rem;
    border-bottom: 1px solid #A1A1A1;
}
.entry-content .blogList li:last-child .postBody {
    border: none;
	margin-bottom: 0;
	padding-bottom: 0;
}
@media (min-width: 40em){
    .entry-content h2.post__title {
        font-size: 3rem;
    }
}

@media (min-width: 1100px){
    
    .entry-content .post__content p,
    .entry-content .postContent p {
        font-size: 1.125rem;
        }
    
    /*Make Images and iFrames larger than text column */
    .entry-content .post__content p img {
        max-width: 800px;
        position: relative;
        left: -50px;
        }
    .entry-content .post__content .post__featured-image {   
        }
    .entry-content .postFeaturedImage {
        max-width: 800px;
    }

}

/* ---------------------------------------------------------------- Comments */
.entry-content a.comment--number {
    font-size: .6em;
    color: #595959;
}
.entry-content a.comment--title {
    color: #333;
}
dt.userComment a.comment--title {
    color: #2bb673;
}
dd.comment dl dt.userComment,
dd.comment--alternate dl dt.userComment {
    color: #2bb673;
}
dd.comment dl dt.userComment span.comment--date,
dd.comment--alternate dl dt.userComment span.comment--date {
    color: #333;
}

/* ---------------------------------------------------------------- Footer */
.footer {
	margin-top: 100px;
	}
	.cover-page .footer {
		margin-top: 0;
		}
.footer p {
    font-size: .875rem;
    color: #777;
}