/*
 *  
 *  Custom Styles & Structure Sheets
 *  Authored By: Christian Bowyer, Napkin Inc.
 *  
 * 
 */


/* Imports */

@font-face {
	font-family: 'judson';
	src: url('../fonts/Judson-Bold.ttf') format('truetype');
	font-weight: bold;
}


/* Generic DOM */

body {
	font-family: "Century Gothic", "Vernada", Arial;
	position: relative;
	background-color: #ffffff;
	color: #000000;
	float: none;
	height: auto;
}

body *::selection {
	background: #ba2019;
	color: #FFFFFF;
}

body *::-moz-selection {
	background: #ba2019;
	color: #FFFFFF;
}

h1 {
	color: #ba2019;
	font-size: 65px;
	font-family: 'judson';
}

#loader {
        z-index: 99999999;
        width: 25px; 
        height: 25px;
        position: fixed;
        opacity: 0;
}

.modal-body {
       overflow-y: scroll;
       max-height: 350px;
}

.title {
	-o-transition: color 1s ease;
	-ms-transition: color 1s ease;
	-moz-transition: color 1s ease;
	-webkit-transition: color 1s ease;
	transition: color 1s ease;
}

.title, .title:visited {
	color: #ba2019;
	text-decoration: none;
}

.title:hover {
	color: #000000;
	text-decoration: none;
}

a {
	color: #000000;
	text-decoration: none;
	
	-o-transition: color 0.5s ease;
	-ms-transition: color 0.5s ease;
	-moz-transition: color 0.5s ease;
	-webkit-transition: color 0.5s ease;
	transition: color 0.5s ease;
}

a:hover {
	color: #ba2019;
	text-decoration: underline;
}

a:visited {
	color: #000000;
}

#contentWrapper {
	height: auto;
	zoom: 1;
	filter: alpha(opacity=0);
	opacity: 0;
	
	-o-transition: opacity 2s ease;
	-ms-transition: opacity 2s ease;
	-moz-transition: opacity 2s ease;
	-webkit-transition: opacity 2s ease;
	transition: opacity 2s ease;
}

header, footer {
	border-bottom: 4px solid #ba2019;
	width: 100%;
	max-width: 100%;
}

header {
	margin-bottom: 0;
	margin-top: 5px;
}

#headerInner {
	max-width: 80%;
	height: auto;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	background-image: url("../img/header-bg.jpg");
	background-repeat: no-repeat;
	background-position: 90px top;
	background-size: 170px;
}

#mobileHeaderInner {
	max-width: 95%;
	height: auto;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	position: relative;
}

#mobileHeaderInner * { text-align: center; }

#headerInner h1 {
	padding-top: 50px;
}

#headerInner p {
	float: none; 
	text-align: center; 
	font-family: 'judson'; 
	width: 100%;
}

footer {
	position: relative;
	margin-bottom: 40px;
}

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




/* Nav Bar */

#mainLogo {
	float: left;
	max-width: 25%;
}

#largeNavBar {
	background-color: #ffffff;
	border: 0;
	margin-bottom: 0;
}

#largeNavBar .navbar-links {
	width: 80%;
	height: auto;
	margin-left: auto;
	margin-right: auto;
}

#largeNavBar .navbar-links li {
	color: #000000;
	color: rgba(0, 0, 0, 0.8);
	list-style: none;
	text-decoration: none;
	float: left;
	margin-top: 5px;
	margin-bottom: 5px;
	width: 25%;
	text-align: center;
	font-size: 18px;
}

#largeNavBar .navbar-links li a:hover {
	color: #ba2019;
}

#largeNavBar .dropdown-menu {
	max-width: 250px;
}

#largeNavBar .dropdown-menu li  {
	width: 100%;
}

#largeNavBar .dropdown-menu li a:focus {
	outline-color: #ba2019;
}


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


/* Modals */

.modal .modal-dialog {
	background-color: #ffffff;
	border-color: #000000;
	border-color: rgba(0, 0, 0, 0.8);
	border-width: 4px;
	border-style: solid;
}

.modal-header h4 {
	color: #ba2019;
	font-family: "Judson-Bold", "Century Gothic", "Vernada", Arial;
}

.btn.btn-default {
	background-color: #ba2019;
	color: #ffffff;
}

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


/* Main Slider */

#focalSlider {
	margin-top: 5%;
	margin-bottom: 0;
}

#focalSlider .glyphicon {
	font-size: 30px;
}

#innerSliderWrapper {
	width: 100%;
	height: 100%;
	border-left: 4px solid #ba2019;
	position: relative;
}

.item a {
	display: inline-block;
	width: 95%;
        position: relative;
        top: 50%;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
}

#sliderDots.carousel-buttons {
	position: absolute;
	top: 10%;
	left: -220px;
	padding: 0;
	margin-bottom: 0;
	
	-o-transform: rotate(90deg);
	-ms-transform: rotate(90deg);
	-moz-transform: rotate(90deg);
	-webkit-transform: rotate(90deg);
	transform: rotate(90deg);
	
	-o-transition: top 1s ease, left 1s ease;
	-ms-transition: top 1s ease, left 1s ease;
	-moz-transition: top 1s ease, left 1s ease;
	-webkit-transition: top 1s ease, left 1s ease;
	transition: top 1s ease, left 1s ease;
	
}

#sliderDots.carousel-buttons .active {
	background-color: #ba2019; 
}

#sliderDots.carousel-buttons li {
	border: 2px solid #ba2019;
	display: inline-block;
	width: 11px;
	height: 11px;
	margin: 1px;
	border-radius: 10px;
	cursor: pointer;
	background-color: #000 \9;
	background-color: rgba(0, 0, 0, 0);
	list-style: none;
	text-align: center;
}


#mobileSliderDots.carousel-buttons {
	padding: 5px;
	margin-bottom: 0;
	margin-top: 25px;
	text-align: center;
}

#mobileSliderDots.carousel-buttons .active {
	background-color: #ba2019; 
}

#mobileSliderDots.carousel-buttons li {
	border: 2px solid #ba2019;
	display: inline-block;
	width: 10px;
	height: 10px;
	margin: 1px;
	border-radius: 10px;
	cursor: pointer;
	background-color: #000 \9;
	background-color: rgba(0, 0, 0, 0);
	list-style: none;
	text-align: center;
}

.item {
	text-align: center;
	height: 100%;
}

.item:before {
    content: ' ';
    display: inline-block;
    vertical-align: middle;
}

.sliderImageLink:active, .sliderImageLink:focus {
	outline: 0;
	text-decoration: none;
}

.item img {
	display: inline-block !important;
    vertical-align: middle;
    box-shadow: -1px 0 10px #000000;
}

.left.carousel-control i {
	color: #ba2019;
	outline: 0;
	text-decoration: none;
	opacity: 1;
	filter: alpha(opacity=1);
	
	-o-transform: rotate(-90deg);
	-ms-transform: rotate(-90deg);
	-moz-transform: rotate(-90deg);
	-webkit-transform: rotate(-90deg);
	transform: rotate(-90deg);
	
	-o-transition: color 1s ease;
	-ms-transition: color 1s ease;
	-moz-transition: color 1s ease;
	-webkit-transition: color 1s ease;
	transition: color 1s ease;
}


.left.carousel-control i:hover {
	color: #000000;
	font-size: 31px !important;
}

.left.carousel-control:hover, .left.carousel-control:focus {
	outline: 0;
	color: #000000;
	text-decoration: none;
	opacity: 1;
	filter: alpha(opacity=1);
}

.right.carousel-control i {
	color: #ba2019;
	outline: 0;
	
	-o-transform: rotate(90deg);
	-ms-transform: rotate(90deg);
	-moz-transform: rotate(90deg);
	-webkit-transform: rotate(90deg);
	transform: rotate(90deg);
	
	-o-transition: color 1s ease;
	-ms-transition: color 1s ease;
	-moz-transition: color 1s ease;
	-webkit-transition: color 1s ease;
	transition: color 1s ease;
}

.right.carousel-control i:hover {
	color: #000000;
	font-size: 31px !important;
}

.right.carousel-control:hover, .right.carousel-control:focus {
	outline: 0;
	color: #000000;
	text-decoration: none;
	opacity: 1;
	filter: alpha(opacity=1);
}

.leftMobileCarouselControl i {
	font-size: 30px;
	padding: 10px;
	color: #ba2019;
	outline: 0;
	text-decoration: none;
	opacity: 1;
	filter: alpha(opacity=1);
	
	-o-transform: rotate(-90deg);
	-ms-transform: rotate(-90deg);
	-moz-transform: rotate(-90deg);
	-webkit-transform: rotate(-90deg);
	transform: rotate(-90deg);
	
	-o-transition: color 1s ease;
	-ms-transition: color 1s ease;
	-moz-transition: color 1s ease;
	-webkit-transition: color 1s ease;
	transition: color 1s ease;
}


.leftMobileCarouselControl i:hover {
	color: #000000;
	font-size: 31px !important;
}

.leftMobileCarouselControl:hover, .leftMobileCarouselControl:focus {
	outline: 0;
	color: #000000;
	text-decoration: none;
	opacity: 1;
	filter: alpha(opacity=1);
}

.rightMobileCarouselControl i {
	font-size: 30px;
	color: #ba2019;
	outline: 0;
	padding: 10px;
	
	-o-transform: rotate(90deg);
	-ms-transform: rotate(90deg);
	-moz-transform: rotate(90deg);
	-webkit-transform: rotate(90deg);
	transform: rotate(90deg);
	
	-o-transition: color 1s ease;
	-ms-transition: color 1s ease;
	-moz-transition: color 1s ease;
	-webkit-transition: color 1s ease;
	transition: color 1s ease;
}

.rightMobileCarouselControl i:hover {
	color: #000000;
	font-size: 31px !important;
}

.rightMobileCarouselControl:hover, .rightMobileCarouselControl:focus {
	outline: 0;
	color: #000000;
	text-decoration: none;
	opacity: 1;
	filter: alpha(opacity=1);
}

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


/* Text Slider */

#textSlider {
	margin-top: 30px;
	margin-bottom: 50px;
}

#textSlider .item h3 {
	max-width: 80%;
	margin-left: auto;
	margin-right: auto;
}

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



/* News Page */

.panel-title {
	background-color: #ba2019;
	color: #ffffff;
	font-size: 22px;
}

.panel-default > .panel-heading {
	background-color: #ba2019;
	border-color: #ba2019;
}

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


/* Media Queries */

@media (min-width: 1px) {
        #headerInner {
                max-width: 100%;
                margin: 0;
                background-position: 0px top;
        }
	#headerInner h1 a {
		font-size: 55px;	
	}
}
@media (min-width: 430px) {
	#headerInner {
                max-width: 85%;
                margin-left: auto;
                margin-right: auto;
                background-position: 0px top;
        }
}
@media (min-width: 520px) {
       #headerInner h1 a {
                font-size: 64px;
       }
}
@media (min-width: 575px) {
	#headerInner h1 a {
                font-size: 75px;
        }
        #headerInner {
                background-position: 50px top;
        }
}
@media (min-width: 650px) {
	#headerInner {
                max-width: 70%;
        }
}
@media (min-width: 950px) {
	#headerInner {
                max-width: 90%;
                background-position: 10px top;
        }
}
@media (min-width: 1060px) {
	#headerInner {
                max-width: 85%;
        }
}

@media (min-width: 1201px) {
	#headerInner {
                max-width: 80%;
                background-position: 60px top;
        }
}

@media (min-width: 1360px) {
	#headerInner {
                background-position: 105px top;
        }
}

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