﻿/* Designed by RTBWizards.com
 * Customized by: Richard Bruer
 * Colors Used: #26374f (very dark), #476794 (dark), #809bc2 (medium), #c4d1e3 (light)
 *
  1. General Rules
  2. Typography
  3. Classes using Font Awesome
  4. Lists
  5. Paragraphs
  6. Horizontal Rules and Clears
  7. Miscellaneous Classes
  8. Buttons
  9. Font Icon Styles
 10. Layout Rules
 11. Header Area
 12. Site Name Area
 13. Main Navigation
 14. Section Blocks
 15. Footer Area
 16. Contact Form
 17. Image Styles
 18. Ticker Block
 19. Carousel
 20. Accordion Block
 21. Media Queries
*/

/* 1. ========== GENERAL RULES ========== */
html {height: 101%;}
header, figure, figcaption, footer, nav, article, section, aside {display: block;}
body {
	background: #ffffff;
	font-family: 'Open Sans', Verdana, Helvetica, sans-serif;
	font-size: 1.0em;
	color: #000000;
	margin: 0;
	padding: 0;
	line-height: 1.5em;
	height: 100%;
	min-width:300px;
}
blockquote {
	font-size: .95em;
	color: #777777;
	margin: 2px 40px;
	padding: 12px 12px 12px 40px;
	text-align: left;
	line-height: 1.4em;
	border-left: 3px double #c4d1e3;
	border-right: 3px double #c4d1e3;
	position: relative;
}
blockquote:before {
	position: absolute;
	font-family: 'FontAwesome';
	font-size: 30px;
	color: #c4d1e3;
	top: 12px;
	left: 5px;
	content: "\f10d";
}
blockquote p {padding: 0; margin: 0;}
blockquote strong {color: #777777; font-size: 1.4em; font-weight: normal; letter-spacing: -1px;}
blockquote.leftside {
	float: left;
	display: block;
	width: 30%;
	margin: 5px 2% 10px 0;
	border-left: none;
	border-right: 3px double #c4d1e3;
}
blockquote.rightside {
	float: right;
	display: block;
	width: 30%;
	margin: 5px 0 10px 2%;
	padding-right: 0;
	border-left: 3px double #c4d1e3;
	border-right: none;
}
fieldset {
	width: auto;
	border: 1px solid #cccccc;
	border-radius: 10px;
	padding: 20px 30px;
	margin: 20px auto;
}
legend {
	color: #476794;
	font: 30px 'Oswald', Verdana, Helvetica, sans-serif;
	padding: 0 10px;
	margin: 0 0 0 -10px;
}
table {
	padding: 0;
	border-collapse: collapse;
	font-size: 100%;
	width: 100%;
}

/* 2. ============= TYPOGRAPHY ============ */
a {
	color: #809bc2;
	text-decoration: underline;
	outline: none;
	font-weight: bold;
}
a:hover {
	color: #919191;
	text-decoration: underline;
	font-weight: bold;
}
h1 {
	font: 44px 'Poiret One', Verdana, Helvetica, sans-serif;
	color: #476794;
	margin: 0.3em 0;
	text-align: left;
}
h2 {
	font: 36px 'Oswald', Verdana, Helvetica, sans-serif;
	color: #476794;
	margin: 0.3em 0;
	text-align: left;
}
h3 {
	font: 32px 'Oswald', Verdana, Helvetica, sans-serif;
	color: #333333;
	margin: 0.3em 0;
	padding: 1px 0 0 0;
	text-align: left;
	font-variant: small-caps;
	letter-spacing: 1px;
}
h4 {
	font: 24px 'Oswald', Verdana, Helvetica, sans-serif;
	color: #476794;
	margin: 0.3em 0;
	position: relative;
	text-align: left;
	letter-spacing: 1px;
	overflow: hidden;
}
h5 {
	font: 24px 'Oswald', Verdana, Helvetica, sans-serif;
	color: #333333;
	margin: 0.3em 0;
	text-align: left;
}
h6 {
	font: 18px 'Oswald', Verdana, Helvetica, sans-serif;
	color: #333333;
	margin: 0.3em 0;
	letter-spacing: 1px;
	text-align: left;
	text-transform: uppercase;
	border-bottom: 1px solid #333333;
}
.alternate1 {
	font: 32px 'Oswald', Verdana, Helvetica, sans-serif;
	color: #476794;
	margin: 0.3em 0;
	text-align: center;
	position: relative;
	overflow: hidden;
}
.alternate1:before, .alternate1:after {
	border-bottom: 1px solid #c4d1e3;
	content: "";
	display: inline-block;
	height: .20em;
	position: relative;
	vertical-align: middle;
	width: 50%;
	margin-bottom: .25em;
}
.alternate1:before {
	right: 0.4em;
	margin-left: -50%;
}
.alternate1:after {
	left: 0.4em;
	margin-right: -50%;
}
.alternate2 {
	font: 26px 'Oswald', Verdana, Helvetica, sans-serif;
	color: #333333;
	margin: 0.3em 0;
	padding: 1px 0 0 0;
	text-align: center;
	position: relative;
	border-top: 1px solid #aaaaaa;
	border-bottom: 1px solid #aaaaaa;
	font-variant: small-caps;
	letter-spacing: 1px;
}
.alternate2:before, .alternate2:after {
	content: "\2022";
	display: inline-block;
	font-size: 26px;
	height: 26px;
	position: relative;
	vertical-align: middle;
	margin-top: -10px;
	margin-bottom: 16px;
	color: #809bc2;
}
.alternate2:before   {right: 0.4em;}
.alternate2:after    {left: 0.4em;}

/* 3. ===== CLASSES USING FONT AWESOME ICONS ===== */
.comment {position: relative; padding: 0 0 5px 35px;}
.comment:before {position: absolute; font-family: 'FontAwesome'; content: "\f086"; top: 0; left: 0; font-size: 26px;}
.email {position: relative; padding: 0 0 5px 25px;}
.email:before {position: absolute; font-family: 'FontAwesome'; content: "\f0e0"; top: 0; left: 0; font-size: 18px;}
.home {position: relative; padding: 0 0 5px 25px;}
.home:before {position: absolute; font-family: 'FontAwesome'; content: "\f015"; top: 0; left: 0; font-size: 20px;}
.hours {position: relative; padding: 0 0 5px 25px;}
.hours:before {position: absolute; font-family: 'FontAwesome'; content: "\f017"; top: 0; left: 0; font-size: 20px;}
.phone {position: relative; padding: 0 0 5px 25px;}
.phone:before {position: absolute; font-family: 'FontAwesome'; content: "\f095"; top: 0; left: 0; font-size: 20px;}
.noicon {padding: 0 0 5px 25px;}
.newsAuthor {position: relative; color: #666666; text-align: right; font-size: 0.90em; letter-spacing: 1px; padding: 0 20px 10px 0; margin-top: -2px;}
.newsAuthor:before {position: absolute; font-family: 'FontAwesome'; content: "\f044"; top: 0; right: 0;}
.newsDate {position: relative; color: #666666; text-align: right; font-size: 0.90em; letter-spacing: 1px; padding: 0 20px 10px 0; margin-top: -2px;}
.newsDate:before {position: absolute; font-family: 'FontAwesome'; content: "\f073"; top: 0; right: 0;}

/* 4. ============== LISTS ============ */
ul {margin: 10px 0 20px 10px; padding: 0 0 0 15px;}
ul li a {color: #809bc2; text-decoration: none; font-weight: bold; padding: 0;}
ul li a:hover {color: #919191; text-decoration: underline;}
ol.leadingzero {background: none; list-style-position: outside; list-style-type: decimal-leading-zero;}
ul.list1 li {list-style-type: none; position: relative; margin-left: -10px; padding-left: 20px;}
ul.list1 li:before {position: absolute; font-family: 'FontAwesome'; font-size: 14px; top: 0; left: 0; content: "\f0a9";}
ul.list1 li ul {margin-top: 0; margin-bottom: 0;}
ul.list2 li {list-style-type: none; position: relative; margin-left: -10px; padding-left: 10px;}
ul.list2 li:before {position: absolute; font-family: 'FontAwesome'; font-size: 14px; top: 0; left: 0; content: "\f0da";}
ul.list2 li ul {margin-top: 0; margin-bottom: 0;}
ul.list3 li {list-style-type: none; position: relative; margin-left: -10px; padding-left: 15px;}
ul.list3 li:before {position: absolute; font-family: 'FontAwesome'; font-size: 14px; top: 0; left: 0; content: "\f101";}
ul.list3 li ul {margin-top: 0; margin-bottom: 0;}

/* 5. ============== PARAGRAPHS ============ */
.left {text-align: left;}
.center {text-align: center;}
.right {text-align: right;}
.small {font-size: 0.85em;}
.wide {letter-spacing: 3px;}
.onsale {color: #999999; text-decoration: line-through; margin-bottom: 0; padding-bottom: 0;}
.lead {font-size: 1.2em; line-height: 1.2em; font-variant: small-caps; padding-top: 10px; padding-bottom: 5px; }
p.bulleted {margin-top: 0; margin-bottom: 0; margin-left: 20px;}
p.bulleted:before {content: "• ";}

/* 6. ========== HORIZONTAL RULES AND CLEAR FLOATS ========== */
hr {background-color: #cccccc; border: none; color: #cccccc; height: 1px; clear: both;}
hr.fancy {
	overflow: visible;
	width: 90%;
	padding: 0;
	border: none;
	border-top: 1px solid #aaaaaa;
	color: #aaaaaa;
	text-align: center;
	margin: 20px auto;
	clear: both;
}
hr.fancy:after {
	content: "\2022  \2022  \2022";
	display: inline-block;
	position: relative;
	top: -0.35em;
	font-size: 2em;
	padding: 0 0.5em;
	color: #809bc2;
	background: white;
}
hr.noshow {background-color: transparent; border: none; color: #ffffff; height: 0; clear: both; visibility: hidden;}
.clearfix:before, .clearfix:after, .group:before, .group:after, .container:before, .container:after {display: table; content: "";}
.clearfix:after, .container:after, .group:after {clear: both;}
hr.three-quarter {width: 75%}
hr.half {width: 50%}
hr.quarter {width: 25%}

/* 7. =========== MISCELLANEOUS =========== */
.color1 {color: #26374f;}
.color2 {color: #476794;}
.color3 {color: #809bc2;}
.color4 {color: #c4d1e3;}
.shadow {text-shadow: 3px 3px 6px rgba(0, 0, 0, 0.5);}
.alignleft {float: left; padding: 0; margin: 0;}
.alignright {float: right; padding: 0; margin: 0;}
.socialmedia {text-align: left; letter-spacing: 4px;}
.dropcap {overflow: hidden;}
.dropcap:first-letter {
	color: #476794;
	display: block;
	float: left;
	font: 50px/48px Georgia, Garamond, serif;
	padding: 6px 4px 0 0;
}
.bignumber {
	color: #476794;
	border: 1px solid #476794;
	display: block;
	float: left;
	font: normal 30px/50px Garamond, Georgia, serif;
	margin: 5px 10px 5px 0;
	text-align: center;
	text-transform: uppercase;
	height: 50px;
	width: 50px;
	border-radius: 50%;
}
.showcode {
	font-family: "Courier New", Courier, monospace;
	font-size: 0.9em;
	background-color: #f5f5f5;
	border-radius: 3px;
	border: 1px dotted #cccccc;
	color: #f00000;
	vertical-align: middle;
	padding: 1px 4px;
}
.scroll-to-top {
	display: none;
	position: fixed;
	bottom: 20px;
	right: 10px;
	z-index: 5;
	width: 30px;
	height: 30px;
	padding: 6px 8px 10px 8px;
	text-align: center;
	text-decoration: none;
	background-color: #666666;
	border-radius: 5px;
	border-radius: 50%;
}
.scroll-to-top:hover {
	text-decoration: none;
	background-color: #809bc2;
}
.scroll-to-top a, .scroll-to-top a:hover {
	color: #ffffff;
	text-decoration: none;
}
.google-maps {
	position: relative;
	padding-bottom: 50%;
	height: 0;
	width: 95%;
	margin: auto;
	overflow: hidden;
	background-color: #dddddd;
	border: 1px solid #aaaaaa;
}
.google-maps iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100% !important;
	height: 100% !important;
}
.team {
   margin: 65px 5px 25px 5px;
   background-color: #c4d1e3;
   border: 1px solid #809bc2;
   padding: 70px 5px 5px 5px;
   border-radius: 5px;
   position: relative;
}
.team p {
   margin: 0;
   text-align: center;
}
.team p.name {
   text-transform: uppercase;
   letter-spacing: 2px;
   padding: 0;
}
.team p.title {
   font-variant: small-caps;
   padding: 0 0 10px 0;
}
.team-photo {
   height: 120px;
   width: 120px;
   top: -60px;
   left: 50%;
   margin-left: -60px;
   position: absolute;
}
.team-photo img {
   border-radius: 50%;
   border: 1px solid #809bc2;
   padding: 3px;
   background-color: #ffffff;
}
.wow {opacity: inherit;}
a.lightbox {text-decoration: none;}

/* 8. ========== BUTTONS ========== */
.btn {
	border: 1px solid transparent;
	border-radius: 4px;
	display: inline-block;
	font-size: 14px;
	font-weight: normal;
	margin-bottom: 0;
	padding: 4px 12px;
	text-align: center;
	vertical-align: middle;
	white-space: nowrap;
}
.btn-main {
	background-color: #f8f8f8;
	background: linear-gradient(#f8f8f8, #d8d8d8);
	border-color: #d8d8d8;
	color: #333333;
	font-weight: normal;
	text-decoration: none;
}
.btn-main:hover {
	background-color: #222222;
	background: linear-gradient(#555555, #222222);
	border-color: #222222;
	color: #ffffff;
	font-weight: normal;
	text-decoration: none;
}
.btn-color {
	background-color: #809bc2;
	background: linear-gradient(#809bc2, #476794);
	border-color: #476794;
	color: #ffffff;
	font-weight: normal;
	text-decoration: none;
}
.btn-color:hover {
	background-color: #222222;
	background: linear-gradient(#555555, #222222);
	border-color: #222222;
	color: #ffffff;
	font-weight: normal;
	text-decoration: none;
}
.btn-cart {
	position: relative;
	background-color: #809bc2;
	background: linear-gradient(#809bc2, #476794);
	border-color: #476794;
	color: #ffffff;
	font-weight: normal;
	text-decoration: none;
	padding-right: 30px;
}
.btn-cart:before {
	position: absolute;
	font-family: 'FontAwesome';
	content: "\f07a";
	top: 5px;
	right: 12px;
}
.btn-cart:hover {
	background-color: #222222;
	background: linear-gradient(#555555, #222222);
	border-color: #222222;
	color: #ffffff;
	font-weight: normal;
	text-decoration: none;
}

/* 9. ======== FONT ICON STYLES ======== */
.icon-shadow {text-shadow: 1px 2px 3px rgba(0, 0, 0, 0.3);}

.iconcircle {
	width: 120px;
	height: 120px;
	color: #ffffff;
	background-color: #476794;
	border-radius: 50%;
	line-height: 120px;
	box-shadow: 0 0 0 4px #476794 inset, 0 0 0 5px rgba(255, 255, 255, 0.5) inset;
}

/* 10. ======== LAYOUT RULES ======== */
.container {
   padding: 0;
   margin: 0 auto;
   width: 1240px;
}
.inside {
   width: 96%;
	padding: 0 2%;
}
.row1, .row2, .row3 {
	width: 100%;
}
.photoblockcontainer {
	padding: 0;
	margin: -180px auto 10px auto;
	width: 1100px;
}
.photoblock {
	position: relative;
	width: 92%;
	height: auto;
	padding: 10px 10px 5px 10px;
	text-align: center;
	margin: 0 auto;
	background-color: #ffffff;
	box-shadow: 0 0 5px rgba(0, 0, 0, 0.4);
	box-sizing: border-box;
}
.photoblock:before, .photoblock:after {
   z-index: -1; 
   position: absolute; 
   content: "";
   bottom: 15px;
   left: 10px;
   width: 50%; 
   top: 80%;
   max-width: 40%;
   background: rgba(0, 0, 0, 0.1); 
   box-shadow: 0 20px 10px rgba(0, 0, 0, 0.5);
   transform: rotate(-3deg);
}
.photoblock:after {
   transform: rotate(3deg);
   right: 10px;
   left: auto;
}
div.photoblock > img {
	width: 1080px;
}
.photoblock .caption {
	position: absolute;
	bottom: 12%;
	left: 0; right: 0; margin-left: 15px; margin-right: 15px;
	text-align: center;
	color: #ffffff;
	font: 40px 'Oswald', Verdana, Helvetica, sans-serif;
	text-shadow: 1px 1px 3px rgba(25, 25, 25, 0.4);
}
.pageTitle {
	text-align: center;
	padding: 30px 0;
}
.pageTitle h1 {
	text-align: center;
	margin: 0;
	padding: 0;
	font-size: 48px;
}
div.urgent-announcement h2.alternate1, .urgent-announcement p {
	color: red;
}
div.urgent-announcement h2.alternate1:before, div.urgent-announcement h2.alternate1:after {
	border-bottom: 1px solid red;
}	
div.urgent-announcement a {
	color: red;
	text-decoration: none;
}
div.urgent-announcement hr {
	color: red;
	background-color: red;
}
.meeting-times {
	min-height: 120px;
	}
div.sermon {
	border: 1px solid #cccccc;
	padding: 5px 10px;
	margin: 0 0 10px 0;
	border-radius: 10px;
	}
div.sermons-container {
	margin: 10px auto;
	min-width: 300px;
	max-width: 750px;
}
div.sermon-buttons-div {
	float: left;
	width: 72px;
}
.sermon-button {
	display: inline-block;
	width: 55px;
	min-height: 26px;
	text-decoration:none;
	color: #476794;
	text-align: center;
	padding: 4px;
	border: 1px #aaaaaa solid;
	border-radius: 3px;
	margin: 0 4px 0 0;
}
.sermon-button-text {
	font-size: 12px;
}
.sermon a:hover, .sermon a:link, .sermon a:visited, .sermon a:active {
	text-decoration:none;
}
.sermon-title {
	font-size: 16px;
	float: left;
	width: auto;
	padding: 5px 0 0 0;
}
.sermon audio {
	display: block;
	margin: 0;
	min-width: 250px;
	width: 100%;
	vertical-align: middle;
}
fieldset.sermon-archives {
	margin: 10px auto;
	min-width: 238px;
	max-width: 688px;
}
fieldset.sermon-archives legend {
	margin: 0 0 -10px -10px;
}
fieldset.sermon-archives h4 {
	margin: 0.3em 12px;
}
fieldset.sermon-archives a {
	color: #476794;
	text-decoration: none;
	font-weight: normal;
}
hr.book-hr {width: 80%; margin: 0 auto 20px auto;}
div.book-info img {width: 150px; float: left; margin: 5px 10px 10px 0;}
div.book-info p {margin: 10px 0;}

/* 11. ======== HEADER AREA ======== */
header {
	background-color: #000000;
	background: linear-gradient(#476794, #809bc2);
	margin: 0 0 0 0;
	padding: 20px 0;
	border-bottom: 1px solid rgba(255, 255, 255, 0.8);
	box-shadow: 0 0 40px rgba(0, 0, 0, 0.6);
}
header.homepage {
	background-color: #476794;
	background: linear-gradient(#476794, #809bc2);
	margin: 0 0 0 0;
	padding: 20px 0;
	border-bottom: 1px solid rgba(255, 255, 255, 0.6);
	box-shadow: 0 0 40px rgba(0, 0, 0, 0.8);
	height: auto;
}
.headerextender {
	clear: both;
	height: 180px;
}

/* 12. ======== LOGO/SITE NAME AREA ======== */
.logo {
	float: left;
	width: 400px;
	margin-left: 2%
}
.brand {
	font: 34px 'Poiret One', Verdana, Helvetica, sans-serif;
	color: #ffffff;
	text-align: center;
	margin: 0;
	padding: 0;
}
.brand .fa {font-size: 80%; padding-right: 3px;}

.brand a, .brand a:hover {
	color: #ffffff;
	text-decoration: none;
	font-weight: normal;
}
.slogan {
   color: #ffffff;
   font-size: 14px;
   padding-left: 0px;
   text-align: center;
}
.slogan span {display:inline-block;}

/* 13. ======== MAIN NAVIGATION AREA ======== */
nav {
	width: auto;
	margin-right: 2%;
	padding: 5px 0 0 0;
	list-style: none;
	text-align: right;
	height: 48px;
	color: #ffffff;
	box-sizing: border-box;
	text-transform: uppercase;
	float: right;
}
/* === NON-MOBILE TOP LEVEL === */
ul.slimmenu {list-style-type: none; margin: 10px 0 0 0; padding: 0; width: 100%; text-align: right; font-size: 12px;}
ul.slimmenu li {}
ul.slimmenu > li {margin-right: 0;}
ul.slimmenu li a {letter-spacing: 1px; color: #ffffff; font-size: 12px; font-weight: normal; padding: 12px 10px 12px 18px}
ul.slimmenu li a:hover {color: #c4d1e3; text-decoration: none;}

/* === NON-MOBILE SUB LEVELS === */
ul.slimmenu li ul li {width: 200px; background-color: #666666; text-align: left;} /*was background-color: #809bc2;*/
ul.slimmenu li ul li a {letter-spacing: normal; color: #ffffff; padding: 12px 10px;}
ul.slimmenu li ul li a:hover {background-color: #809bc2; color: #ffffff; border-radius: 0; } /*was background-color: #809bc2;*/
ul.slimmenu li ul li ul li {text-align: left;}

/* === FOR MOBILE === */
.menu-collapser {border-radius: 0; color: #ffffff;}
.collapse-button {background-color: #476794; box-shadow: 0 0 5px #26374f inset; border: 1px solid rgba(255, 255, 255, 0.4);}
.collapse-button:hover, .collapse-button:focus {background-color: #809bc2; box-shadow: 0 0 5px #476794 inset;}

/* === MOBILE TOP LEVEL === */
ul.slimmenu.collapsed li {background: #666666;}
ul.slimmenu.collapsed li a {letter-spacing: normal; color: #ffffff; padding: 12px 10px;} /* added letter-spacing: normal; padding: 12px 10px; */
ul.slimmenu.collapsed li a:hover {background-color: #809bc2; color: #ffffff; border-radius: 0; text-decoration: none;}
ul.slimmenu.collapsed li .sub-collapser > span {color: #ffffff; /* arrow color */}
ul.slimmenu.collapsed li .sub-collapser > span:hover {color: #809bc2; /* hover arrow color */}

/* === MOBILE SUB LEVELS === */
ul.slimmenu.collapsed li ul li {background: rgba(255, 255, 255, 0.20);}
ul.slimmenu.collapsed li ul li a {color: #ffffff; padding: 12px 10px;}
ul.slimmenu.collapsed li ul li a:hover {background-color: #809bc2; color: #ffffff;}
ul.slimmenu.collapsed li ul li ul li {background: rgba(255, 255, 255, 0.05);}
ul.slimmenu.collapsed li ul li ul li a {color: #ffffff;}
ul.slimmenu.collapsed li ul li ul li a:hover {background-color: #809bc2; color: #ffffff;}

/* === stuff you won't need to edit === */
ul.slimmenu li {position: relative; display: inline-block; text-align: center;}
ul.slimmenu > li:first-child {border-left: 0;}
ul.slimmenu > li:last-child {margin-right: 0;}
ul.slimmenu li ul li:last-of-type {border-bottom: none;}
ul.slimmenu li ul {margin: 0; list-style-type: none;}
ul.slimmenu li .sub-collapser {visibility: hidden; position: absolute; right: 0; top: 0; width: 0; height: 100%; text-align: center; z-index: 999; cursor: pointer;}
ul.slimmenu li > ul {display: none; position: absolute; right: 0; top: 100%; z-index: 999; padding-left: 0; box-shadow: 0 2px 3px rgba(0, 0, 0, 0.3);}
ul.slimmenu li > ul > li ul {display: none; position: absolute; left: 100%; top: 0; z-index: 999; width: 100%; white-space: normal; padding-left: 0;}
ul.slimmenu li a {display: block; font-family: 'Open Sans', sans-serif; transition: background-color 0.2s ease-out;}
ul.slimmenu li ul li a:hover {text-decoration: none;}

.menu-collapser {width: 96%; margin: 0 2%; position: relative; text-align: right; height: 48px; line-height: 48px; padding: 0 8px; 	box-sizing: border-box;}
.collapse-button {position: absolute; right: 12px; top: 10px; width: 40px; background-repeat: repeat-x; border-radius: 4px; color: #ffffff; padding: 7px 10px;
	cursor: pointer; font-size: 14px; text-align: center; box-sizing: border-box;} /* was top: 50%; transform: translate(0, -50%); */
.collapse-button .icon-bar {background-color: #ffffff; box-shadow: 0 1px 0 rgba(0, 0, 0, 0.25); border-radius: 1px 1px 1px 1px; display: block; height: 2px;
	width: 18px; margin: 2px 0;}
ul.slimmenu.collapsed {list-style-type: none; margin: 0 1%; padding: 0; width: 98%; text-align: left;}
ul.slimmenu.collapsed li {border-left: none; display: block; width: 100%; box-sizing: border-box; z-index: 999; text-align: left;}
ul.slimmenu.collapsed li .sub-collapser {position: absolute; right: 0; top: 10px; width: 40px; height: 48px; text-align: center; z-index: 999; cursor: pointer; visibility: visible;}
ul.slimmenu.collapsed li .sub-collapser > span{font-size: 18px; display: inline-block; vertical-align: middle;}
ul.slimmenu.collapsed li ul li ul {display: none; position: relative; left: 0; top: 0; z-index: 999; width: 100%; white-space: normal; padding-left: 0;}
ul.slimmenu.collapsed li > ul {display: none; position: relative; width: 100%; box-shadow: none;}
ul.slimmenu.collapsed li a {display: block; box-sizing: border-box;}
ul.slimmenu.collapsed li ul li {display: block; width: 100%; box-sizing: border-box; z-index: 999; text-align: left; border-bottom: 0;}
ul.slimmenu.collapsed li ul li a {padding-left: 20px; display: block; box-sizing: border-box;}
ul.slimmenu.collapsed li ul li ul li {display: block; width: 100%; box-sizing: border-box; z-index: 999; text-align: left;}
ul.slimmenu.collapsed li ul li ul li a {padding-left: 30px;}

/* 14. ======== SECTION BLOCKS ======== */
.group {margin: 10px 0; clear: both;}

.contentBox2a {float: left; width: 48%; padding: 0; margin: 0 2% 0 0;}
.contentBox2b {float: left; width: 48%; padding: 0; margin: 0 0 0 2%;}

.contentBox3a {float: left; width: 31.33333%; padding: 0; margin: 0 2% 5px 0;}
.contentBox3b {float: left; width: 31.33333%; padding: 0; margin: 0 1% 5px 1%;}
.contentBox3c {float: left; width: 31.33333%; padding: 0; margin: 0 0 5px 2%;}

.contentBox4a {float: left; width: 23.5%; padding: 0; margin: 0 1% 0 0;}
.contentBox4b, .contentBox4c {float: left; width: 23.5%; padding: 0; margin: 0 1% 0 1%;}
.contentBox4d {float: left; width: 23.5%; padding: 0; margin: 0 0 0 1%;}

.sidebarLeft {float: left; width: 31.3333%; padding: 0; margin: 0 2% 0 0;}
.contentRight {float: right; width: 64.666%; padding: 0; margin: 0 0 0 2%;}

.sidebarRight {float: right; width: 31.3333%; padding: 0; margin: 0 0 0 2%;}
.contentLeft {float: left; width: 64.666%; padding: 0; margin: 0 2% 0 0;}

.colorbox {
   width: 94%;
   padding: 10px 3%;
   margin: 10px 0;
   background-color: #809bc2;
   color: #ffffff;
   box-shadow: inset 0 0 50px #476794, 0 10px 20px -10px rgba(0, 0, 0, 0.5);
   border-radius: 8px;
   text-align: center;
}
.colorbox h3 {color: #ffffff; text-align: center;}

.callbox {
   color: #ffffff;
	padding: 2px 3%;
	background-color: #222222;
	background: linear-gradient(#555555, #222222);
	text-align: center;
	margin: 15px 0;
	box-shadow: 0 0 0 4px #222222 inset, 0 0 0 5px rgba(255, 255, 255, 0.4) inset;
	border-radius: 12px;
}
.callbox * {color: #ffffff; border-color: #ffffff;}

/* 15. ======== FOOTER AREA ======== */
footer {
	width: 100%;
	color: #222222;
	font-size: 0.90em;
	line-height: 1.4em;
	padding: 10px 0 0 0;
	margin: 3px 0 0 0;
}
footer a {
	color: #809bc2;
}
footer a:hover {
	color: #515151;
}
footer ul {
	list-style-type: none;
	line-height: normal;
	position: relative;
	margin: 0 0 10px 0;
	padding: 0;
}
footer ul li {
	list-style-type: none;
	position: relative;
	margin: 0 20px 0 0;
	padding: 4px 0 2px 15px;
}
footer ul li:before {
	position: absolute;
	font-family: 'FontAwesome';
	color: #809bc2;
	top: 6px;
	left: 0;
	content: "\f101";
}
footer ul li a {
	color: #515151;
	text-decoration: none;
	font-weight: bold;
	letter-spacing: 2px;
}
footer ul li a:hover {
	color: #809bc2;
}
footer h5 {
	color: #222222;
	text-align: left;
	letter-spacing: 2px;
	font: 22px 'Oswald', Verdana, Helvetica, sans-serif;
}
footer .comment:before, footer .home:before, footer .hours:before, footer .email:before, footer .phone:before {
	color: #555555;
}
.footerbottom {
	padding: 5px 0 10px;
}
.footerbottom a.footer-name {
	font: 30px 'Poiret One', Verdana, Helvetica, sans-serif;
	color: #476794;
	text-decoration: none;
	font-weight: normal;
	margin: 0;
	padding: 0;
}
.footerbottom a.footer-name:hover {
	color: #476794;
}
.copyright {
	letter-spacing: 3px;
	text-align: center;
	color: #444444;
	font-size: 0.85em;
	margin: 0;
	padding: 0;
}
.designed {color: #888888 !important; text-align: center; letter-spacing: 1px; font-size: 10px;
	font-size: 0.75em; margin: 0; padding: 15px 0 0 0;}
.designed a {color: #888888 !important; font-weight: normal; text-decoration: none;}
.designed a:hover {color: #888888 !important; font-weight: normal; text-decoration: none;}

/* 16. ======== CONTACT FORM ======== */
form.contactform {
	width: 99%;
	text-align: left;
}
.contactform label {
	width: 99%;
	text-align: left;
	font-style: italic;
	display: block;
	margin-bottom: 4px;
}
.contactform input {
	width: 99%;
	border: 1px #cccccc solid;
	background-color: #f5f5f5;
	padding: 5px;
	margin-bottom: 10px;
	color: #000000;
}
.contactform textarea {
	width: 99%;
	border: 1px #cccccc solid;
	background-color: #f5f5f5;
	padding: 5px;
	resize: none;
	color: #000000;
}
.contactform .submit {
	width: 100px;
	margin: 10px 0 20px 0;
	cursor: pointer;
	color: #444444;
	font: 16px 'Oswald', Verdana, Helvetica, sans-serif;
	font-weight: normal;
	padding: 2px 18px;
	text-decoration: none;
	background-color: #f8f8f8;
	background: linear-gradient(#f8f8f8, #d8d8d8);
	border: solid 1px #d8d8d8;
	border-radius: 5px;
}
.contactform .submit:hover {
	text-decoration: none;
	color: #ffffff;
	background-color: #809bc2;
	background: linear-gradient(#809bc2, #476794);
	border: solid 1px #476794;
	border-radius: 5px;
}
/* 17. ======== IMAGE STYLES ======== */
img {border: none; max-width: 100%; box-sizing: border-box;}
.img-border {border: 1px #555 solid;}
.img-curved {border-radius: 6px;}
.img-frame {background: #ffffff; border: 1px #aaa solid; padding: 4px;}
.img-shadow {margin: 5px 0; box-shadow: 0 10px 15px -9px rgba(0, 0, 0, 0.5);}
.img-round {border-radius: 50%;}
.img-small {max-width: 150px; height: auto;}
.img-portfolio {margin: 6px 4px; box-shadow: 0 0 5px rgba(0, 0, 0, 0.3), 0 10px 15px -5px rgba(0, 0, 0, 0.5); max-width: 120px;}

.img-left {margin: 5px 10px 0 0; float: left;}
.img-left-shadow {margin: 5px 10px 0 0; float: left; box-shadow: 0 10px 15px -9px rgba(0, 0, 0, 0.5);}
.img-rotate-left {margin: 20px; transform: rotate(-4deg);}

.img-right {margin: 5px 0 0 10px; float: right;}
.img-right-shadow {margin: 5px 0 0 10px; float: right; box-shadow: 0 10px 15px -9px rgba(0, 0, 0, 0.5);}
.img-rotate-right {margin: 20px; transform: rotate(4deg);}

/* 18. ======= TICKER ======== */
.news {
	width: 96%;
	margin: 25px 2% 40px;
	position: relative;
   color: #ffffff;
	background-color: #222222;
	background: linear-gradient(#555555, #222222);
	text-align: center;
	box-shadow: 0 0 0 4px #222222 inset, 0 0 0 5px rgba(255, 255, 255, 0.4) inset;
	border-radius: 12px;
}
.news:before, .news:after {
  z-index: -1; 
  position: absolute; 
  content: "";
  bottom: 15px;
  left: 20px;
  width: 50%; 
  top: 80%;
  max-width: 50%;
  background: rgba(0, 0, 0, 0.1); 
  box-shadow: 0 20px 10px rgba(0, 0, 0, 0.3);
  transform: rotate(-3deg);
}
.news:after {
  transform: rotate(3deg);
  right: 20px;
  left: auto;
}
ul#ticker {list-style: none outside none; margin: 0; padding: 10px 0 10px 0;}
#ticker li {margin: 0; background: none; padding: 0;}
#ticker * {color: #ffffff; border-color: #ffffff;}
#ticker .content {padding: 25px 35px; text-align: left; min-height: 300px;}

/* 19. ======= CAROUSEL ======== */
.carousel {
	width: 98%;
	height: auto;
	margin: 0 auto 30px;
	padding: 8px 30px;
	text-align:center;
	position: relative;
	box-sizing: border-box;
}

.slick-slider {position: relative; display: block; width: 98%; margin: 0 auto; box-sizing: border-box;}
.slick-list {position: relative; display: block; overflow: hidden; margin: 0; padding: 0;}
.slick-list:focus {outline: none;}
.slick-list.dragging {cursor: pointer; cursor: hand;}
.slick-slider .slick-track, .slick-slider .slick-list {transform: translate3d(0, 0, 0);}
.slick-track {position: relative; top: 0; left: 0; display: block;}
.slick-track:before, .slick-track:after {display: table; content: '';}
.slick-track:after {clear: both;}
.slick-loading .slick-track {visibility: hidden;}
.slick-slide {display: none; float: left; height: 100%; min-height: 1px;}
[dir=rtl] .slick-slide {float: right;}
.slick-slide img {display: block;}
.slick-slide.slick-loading img {display: none;}
.slick-initialized .slick-slide {display: block;}
.slick-loading .slick-slide {visibility: hidden;}
.slick-vertical .slick-slide {display: block; height: auto; border: 1px solid transparent;}
.slick-arrow.slick-hidden {display: none;}
/* Image styling */
.slick-slide img {margin: 6px; padding: 5px; background: #ffffff; box-shadow: 0 0 5px rgba(0, 0, 0, 0.4); border-radius: 5px; max-width: 190px; height: auto;}
/* Arrows */
.slick-prev, .slick-next {font-size: 0; line-height: 0; position: absolute; top: 50%; display: block; width: 22px; height: 22px; padding: 0; margin-top: -10px;
    cursor: pointer; color: transparent; border: none; outline: none; background: transparent;}
.slick-prev:hover, .slick-prev:focus, .slick-next:hover, .slick-next:focus {color: transparent; outline: none; background: transparent;}
.slick-prev:hover:before, .slick-prev:focus:before, .slick-next:hover:before, .slick-next:focus:before {opacity: 1;}
.slick-prev.slick-disabled:before, .slick-next.slick-disabled:before {opacity: .25;}
.slick-prev:before, .slick-next:before {font-family: 'FontAwesome'; font-size: 22px; line-height: 1; opacity: .75; color: #476794;}
.slick-prev {left: -25px;}
.slick-prev:before {content: '\f0a8';}
.slick-next {right: -25px;}
.slick-next:before {content: '\f0a9';}
/* Dots */
.slick-slider {margin-bottom: 30px;}
.slick-dots {position: absolute; bottom: -45px; display: block; width: 100%; padding: 0; list-style: none; text-align: center;}
.slick-dots li {position: relative; display: inline-block; width: 20px; height: 20px; margin: 0 5px; padding: 0; cursor: pointer;}
.slick-dots li button {font-size: 0; line-height: 0; display: block; width: 20px; height: 20px; padding: 5px; cursor: pointer; color: transparent; border: 0; outline: none; background: transparent;}
.slick-dots li button:hover, .slick-dots li button:focus {outline: none;}
.slick-dots li button:hover:before, .slick-dots li button:focus:before {opacity: 1;}
.slick-dots li button:before {font-family: 'slick'; font-size: 20px; line-height: 20px; position: absolute; top: 0; left: 0; width: 20px; height: 20px; content: '•'; text-align: center; opacity: 1.0; color: #c4d1e3;}
.slick-dots li.slick-active button:before {opacity: 1.0;  color: #476794;}

/* 20. ======= ACCORDION CONTENT ======== */
#acc dl {
	position: relative;
	width: 100%;
	color: #000;
	padding: 0;
	margin: 0 auto;
}
#acc dt {
	position: relative;
	margin: 0 0 3px 0;
	padding: 4px 4px 4px 20px;
	text-align: left;
	font: 22px 'Oswald', Verdana, Helvetica, sans-serif;
	color: #333;
	background-color: #f8f8f8;
	background: linear-gradient(#f8f8f8, #d8d8d8);
	cursor: pointer;
	border: 1px solid #d8d8d8;
	border-radius: 6px;
	text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.1);
}
#acc dt:before {
	position: absolute;
	font-family: 'FontAwesome';
	content: "\f107";
	top: 4px;
	right: 10px;
	font-size: 30px;
	background-color: transparent;
}
#acc dt:hover {
	color: #ffffff;
	background-color: #222;
	background: linear-gradient(#555, #222);
	border: 1px solid #222;
	text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.3);
	transition: all 0.4s ease 0.0s;
}
#acc dd {
	width: 94%;
	padding: 5px 2% 10px;
	margin: 0 auto;
	border-top: none;
}

/* 21. ===================== MEDIA QUERIES =========================== */
/* =================================================================== */

/* ===== SMALL DEVICE 01 ========= */
@media screen and (max-width: 320px) {
	/* THE FOLLOWING LINE IS FOR DEBUGGING PURPOSES ONLY. REMOVE BEFORE FINAL PUBLISHING.
   .brand a:after {font-family: 'Open Sans', Verdana, Helvetica, sans-serif; font-size: 10px; content: " S1"; position: absolute; top: 30px; right: 5px;} */
   .container {width: 98%; margin: 0 auto; box-sizing: border-box;}
   .photoblockcontainer {width: 98%; margin: -100px auto 10px auto;}
   .photoblock .caption {font-size: 16px;}
   .slick-dots li {display: none;}
   .logo {width: auto; margin: 0 2%; float: none; text-align: center; box-sizing: border-box;}
   .brand {font-size: 28px; text-align: center;}
   .slogan {padding-left: 0; text-align: center;}
   nav {width: 100%; float: none; text-align: center; box-sizing: border-box;}
   .menu-collapser {width: 200px; margin: 0 auto; padding: 0 0 0 40px; text-align: left;}
   .collapse-button {right: 40px;}
   ul.slimmenu.collapsed {width: 200px; margin: 0 auto;}
   .headerextender {clear: both; height: 100px;}
   fieldset img {max-width: 180px; height: auto;}
   blockquote.leftside, blockquote.rightside {visibility: hidden; display: none;}
   .contentBox2a, .contentBox2b, 
   .contentBox3a, .contentBox3b, .contentBox3c, 
   .contentBox4a, .contentBox4b, .contentBox4c, .contentBox4d {
   	width: 98%; margin: 1%; padding: 0;}
   .sidebarLeft, .sidebarRight {width: 98%; margin: 1%; padding: 0;}
   .contentRight, .contentLeft {width: 98%; margin: 1%; padding: 0;}
   .meeting-times {min-height: 0;}
}

/* ===== SMALL DEVICE 02 ===== */
@media screen and (min-width: 321px) and (max-width: 480px) {
	/* THE FOLLOWING LINE IS FOR DEBUGGING PURPOSES ONLY. REMOVE BEFORE FINAL PUBLISHING.
   .brand a:after {font-family: 'Open Sans', Verdana, Helvetica, sans-serif; font-size: 10px; content: " S2"; position: absolute; top: 30px; right: 5px;} */
   .container {width: 98%; margin: 0 auto; box-sizing: border-box;}
   .photoblockcontainer {width: 98%; margin: -100px auto 10px auto;}
   .photoblock .caption {font-size: 16px;}
   .logo {width: auto; margin: 0 2%; float: none; text-align: center; box-sizing: border-box;}
   .brand {font-size: 28px; text-align: center;}
   .slogan {padding-left: 0; text-align: center;}
   nav {width: 100%; float: none; text-align: center; box-sizing: border-box;}
   .menu-collapser {width: 200px; margin: 0 auto; padding: 0 0 0 40px; text-align: left;}
   .collapse-button {right: 40px;}
   ul.slimmenu.collapsed {width: 200px; margin: 0 auto;}
   .headerextender {clear: both; height: 100px;}
   blockquote.leftside, blockquote.rightside {visibility: hidden; display: none;}
   .contentBox2a, .contentBox2b, 
   .contentBox3a, .contentBox3b, .contentBox3c, 
   .contentBox4a, .contentBox4b, .contentBox4c, .contentBox4d {
   	width: 98%; margin: 1%; padding: 0;}
   .sidebarLeft, .sidebarRight {width: 98%; margin: 1%; padding: 0;}
   .contentRight, .contentLeft {width: 98%; margin: 1%; padding: 0;}
   .meeting-times {min-height: 0;}
}

/* ===== SMALL DEVICE 03 ===== */
@media screen and (min-width: 481px) and (max-width: 623px) {
	/* THE FOLLOWING LINE IS FOR DEBUGGING PURPOSES ONLY. REMOVE BEFORE FINAL PUBLISHING.
   .brand a:after {font-family: 'Open Sans', Verdana, Helvetica, sans-serif; font-size: 10px; content: " S3"; position: absolute; top: 30px; right: 5px;} */
   .container {width: 98%; margin: 0 auto; box-sizing: border-box;}
   .photoblockcontainer {width: 98%; margin: -140px auto 10px auto;}
   .photoblock .caption {font-size: 22px;}
   .logo {width: auto; margin: 0 2%; float: none; text-align: center; box-sizing: border-box;}
   .slogan {padding-left: 0; text-align: center;}
   nav {width: 100%; float: none; text-align: center; box-sizing: border-box;}
   .menu-collapser {width: 200px; margin: 0 auto; padding: 0 0 0 40px; text-align: left;}
   .collapse-button {right: 40px;}
   ul.slimmenu.collapsed {width: 200px; margin: 0 auto;}
   .headerextender {clear: both; height: 140px;}
   blockquote.leftside, blockquote.rightside {visibility: hidden; display: none;}
   .contentBox2a, .contentBox2b, 
   .contentBox3a, .contentBox3b, .contentBox3c, 
   .contentBox4a, .contentBox4b, .contentBox4c, .contentBox4d {
   	width: 98%; margin: 1%; padding: 0;}
   .sidebarLeft, .sidebarRight {width: 98%; margin: 1%; padding: 0;}
   .contentRight, .contentLeft {width: 98%; margin: 1%; padding: 0;}
   .meeting-times {min-height: 0;}
}

/* ===== MID DEVICE 01 ======= */
@media screen and (min-width: 624px) and (max-width: 669px) {
	/* THE FOLLOWING LINE IS FOR DEBUGGING PURPOSES ONLY. REMOVE BEFORE FINAL PUBLISHING.
   .brand a:after {font-family: 'Open Sans', Verdana, Helvetica, sans-serif; font-size: 10px; content: " M1"; position: absolute; top: 30px; right: 5px;} */
   .container {width: 98%; margin: 0 auto; box-sizing: border-box;}
   .photoblockcontainer {width: 592px; margin: -140px auto 10px auto;}
	.photoblock .caption {font-size: 30px;}
   .logo {width: auto; margin: 0 2%; float: none; text-align: center; box-sizing: border-box;}
   .slogan {padding-left: 0; text-align: center;}
   nav {width: 100%; float: none; text-align: center; box-sizing: border-box;}
   .menu-collapser {width: 200px; margin: 0 auto; padding: 0 0 0 40px; text-align: left;}
   .collapse-button {right: 40px;}
   ul.slimmenu.collapsed {width: 200px; margin: 0 auto;}
   .headerextender {clear: both; height: 140px;}
   blockquote.leftside, blockquote.rightside {visibility: hidden; display: none;}
   .contentBox2a, .contentBox2b, 
   .contentBox3a, .contentBox3b, .contentBox3c {
   	width: 98%; margin: 1%; padding: 0;}
   .contentBox4a, .contentBox4b, .contentBox4c, .contentBox4d {width: 48%; margin: 1%; padding: 0;}
   .sidebarLeft, .sidebarRight {width: 98%; margin: 1%; padding: 0;}
   .contentRight, .contentLeft {width: 98%; margin: 1%; padding: 0;}
   .meeting-times {min-height: 0;}
}

/* ===== MID DEVICE 02 ======= */
@media screen and (min-width: 670px) and (max-width: 768px) {
	/* THE FOLLOWING LINE IS FOR DEBUGGING PURPOSES ONLY. REMOVE BEFORE FINAL PUBLISHING.
   .brand a:after {font-family: 'Open Sans', Verdana, Helvetica, sans-serif; font-size: 10px; content: " M2"; position: absolute; top: 30px; right: 5px;} */
   .container {width: 98%; margin: 0 auto; box-sizing: border-box;}
   .photoblockcontainer {width: 90.7%;}
	.photoblock .caption {font-size: 30px;}
   .menu-collapser {width: 200px; margin: 0 0 0 auto; padding: 0 65px 0 0;}
   ul.slimmenu.collapsed {width: 200px; margin: 0 0 0 auto;}
   blockquote.leftside, blockquote.rightside {visibility: hidden; display: none;}
   .contentBox3a, .contentBox3b, .contentBox3c {width: 98%; margin: 1%; padding: 0;}
   .contentBox4a, .contentBox4b, .contentBox4c, .contentBox4d {width: 48%; margin: 1%; padding: 0;}
   .sidebarLeft, .sidebarRight {width: 98%; margin: 1%; padding: 0;}
   .contentRight, .contentLeft {width: 98%; margin: 1%; padding: 0;}
}

/* ===== MID DEVICE 03 ======= */
@media screen and (min-width: 769px) and (max-width: 800px) {
	/* THE FOLLOWING LINE IS FOR DEBUGGING PURPOSES ONLY. REMOVE BEFORE FINAL PUBLISHING.
   .brand a:after {font-family: 'Open Sans', Verdana, Helvetica, sans-serif; font-size: 10px; content: " M3"; position: absolute; top: 30px; right: 5px;} */
   .container {width: 98%; margin: 0 auto; box-sizing: border-box;}
   .photoblockcontainer {width: 682px;}
	.photoblock .caption {font-size: 30px;}
   .menu-collapser {width: 200px; margin: 0 0 0 auto; padding: 0 65px 0 0;}
   ul.slimmenu.collapsed {width: 200px; margin: 0 0 0 auto;}
   blockquote.leftside, blockquote.rightside {visibility: hidden; display: none;}
   .contentBox3a, .contentBox3b, .contentBox3c {width: 98%; margin: 1%; padding: 0;}
   .contentBox4a, .contentBox4b, .contentBox4c, .contentBox4d {width: 48%; margin: 1%; padding: 0;}
   .sidebarLeft, .sidebarRight {width: 98%; margin: 1%; padding: 0;}
   .contentRight, .contentLeft {width: 98%; margin: 1%; padding: 0;}
}

/* ===== LARGE DEVICE 01 ===== */
@media screen and (min-width: 801px) and (max-width: 1024px) {
	/* THE FOLLOWING LINE IS FOR DEBUGGING PURPOSES ONLY. REMOVE BEFORE FINAL PUBLISHING.
	.brand a:after {font-family: 'Open Sans', Verdana, Helvetica, sans-serif; font-size: 10px; content: " L1"; position: absolute; top: 30px; right: 5px;} */
	.container {width: 98%;	margin: 0 auto;}
	.photoblockcontainer {width: 87.1%;}
	.photoblock .caption {font-size: 30px;}
	.menu-collapser {width: 200px; margin: 0 0 0 auto; padding: 0 65px 0 0;}
	ul.slimmenu.collapsed {width: 200px; margin: 0 0 0 auto;}
}

/* ===== LARGE DEVICE 02 ===== */
@media screen and (min-width: 1025px) and (max-width: 1279px) {
	/* THE FOLLOWING LINE IS FOR DEBUGGING PURPOSES ONLY. REMOVE BEFORE FINAL PUBLISHING.
   .brand a:after {font-family: 'Open Sans', Verdana, Helvetica, sans-serif; font-size: 10px; content: " L2"; position: absolute; top: 30px; right: 5px;} */
   .container {width: 98%; margin: 0 auto;}
   .photoblockcontainer {width: 87.1%;}
}