/*

My Custom CSS
=============

Author:  Ciuski

*/


/* --------------------------------------
   Colors
   --------------------------------------
	blue: #005aa4;
	red: #c6161d;


/* --------------------------------------
   Global / Debug
   -------------------------------------- */

/* show MD columns 
.col-md-1, .col-md-2, .col-md-3, .col-md-4,
.col-md-5, .col-md-6, .col-md-7, .col-md-8,
.col-md-9, .col-md-10, .col-md-11, .col-md-12  { border: solid 1px #000;} */

/* show SM columns 
.col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4,
.col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8,
.col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12  { border: solid 1px #ff0000;} */

/*.container { max-width: 974px; }*/


.nopadding { padding: 0; }

.noleft { padding-left: 0;}
.noright { padding-left: 0;}

ul, li {
	list-style-type: none;
	margin: 0;
	padding: 0;
}

.widthauto {
	width: 100%;
	height: auto;
}

.container-fluid {
	padding: 0;
}
/* --------------------------------------
   Mobile Header
   -------------------------------------- */
   
#mobile-header, #mobile-footer {
	background-color: #c6161d;
	padding: 10px;
	color: #FFF;
	text-shadow: 1px 1px 0px black;
	font-size: 16px;
	display: none;
}

 
#mobile-header li a, #mobile-footer a {
	color: #FFF;
	text-decoration: none;
	padding-right: 10px;
	display: block;
}

#mobile-header li a {
	float: left;
	margin-bottom: 5px;
	
}
#responsive-menu-button {
	display: block;
	float: left;

}

#mobile-header .glyphicon, #mobile-footer .glyphicon {
	background-color: rgba(0, 0, 0, 0.50);
	padding: 7px;
	border-radius: 2px;
	text-shadow: none;
	margin-right: 5px;
}

#mobile-footer {
	text-align: center;
	color: #fff;
}



/* --------------------------------------
   header
   -------------------------------------- */

body {
	background-image: url(../images/bg-footer.jpg);
}

header { 
	background-image: url(../images/bg-header.jpg);
	
}

header #banner {
	padding: 15px 0;
}

#left {
	text-align: center;
	padding-top: 40px;
}

#left #logo img {
	width: 242px;
	margin: 0 auto;
	margin-bottom: 20px;
}
#logo img {
	max-width: 180px !important;
	margin: 0 auto;
	margin-bottom: 0px;
}


.btn-red {
	background-color: #c6161d;
	color: #fff;
	text-shadow: 1px 1px 0px #000;	
	font-size: 24px;
	border-radius: 10px;
	box-shadow: 0px 0px 5px #000;
}
.btn-red a {
	color: #fff;
}
.btn-red:hover {
	background-color: #c6161d;
	color: #fff;
	box-shadow: 0px 0px 5px #000;

}

#social-icons {
	margin-top: 10px;
	font-style: italic;
	font-weight: bold;
}



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

#street {
	background-image: url(../images/bg-street.png);
	background-repeat: repeat-y;
	background-position: right top;

}

#content {
	background-image: url(../images/bg-content.jpg);	
	position: relative;
	z-index: -1;
}


#content #main p {
	color: #464646;
}

#content #main ul {
	margin-bottom: 15px;
}

#content a {
	text-decoration: underline;
	color: #005aa4;
}
#content a:hover {
	text-decoration: none;
}

#content li {
	list-style-type: disc;
	margin-left: 17px;
}

#main p {
	line-height: 1.5em;
}


 
small {
	font-size: 12px;
	text-align: left;
	font-style: italic;
 }



footer {
	padding-bottom: 40px;
	color: #fff;
	text-shadow: 1px 1px 0px black;
}



footer a {
	color: #fff;
	text-decoration: underline;	
}

footer a:hover {
	text-decoration: none;
	color: #fff;
}

footer .credits, footer .credits a 
{
	margin-top: 20px;
	color: #92a2b0;
	font-size: 12px;
	text-transform: capitalize;
 }

footer #map {
	border: 8px solid #fff;
	box-shadow: 0px 0px 5px #000;
	margin-bottom: 15px;
}
 





/* --------------------------------------
   TYPOGRAPHY
   -------------------------------------- */
   
h1, h2, h3, h4, nav a, #buckets h4, #call-action, blockquote {
	font-family: 'Montserrat', sans-serif;
}



h1 {
	margin-top: 0px;
	margin-bottom: 10px;
	line-height: normal;
	font-size: 20px;
	color: #005aa4;
	margin-top: 40px;
}

h2 {
	margin-bottom: 10px;
	line-height: normal;
	font-size: 14px;
	color: #005aa4;

}


h3 {
	font-size: 18px;
	margin-bottom: 10px;
	margin-top: 40px;
}

h4 {
	font-size: 110%;
	padding-bottom: 10px;
}

h5 {
	font-size: 90%;	
}



/* --------------------------------------
   Navbar Horizontal with Dropmenu
   -------------------------------------- */

#navigation {
	background-image: url(../images/bg-nav.jpg);
	background-repeat: repeat-x;
	background-position: left top;
}


nav {
	padding: 0;
	list-style: none;
	list-style-type: none;
 }

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

nav li a {
	color: #fff;
	text-decoration: none;
	display: block;
	font-size: 18px;
	text-transform: uppercase;
	padding: 15px;
	font-family: 'PT Sans Narrow', sans-serif;

}

nav .last a {
	padding-right: 0px;
}	


nav li a:hover, nav li li a:hover  { 
	color: #fff;
	text-decoration: underline; 
	}

nav li ul li {float: none; position: relative;  }

nav li ul {
	position: absolute; top:55px; left:0; display: none; width:200px;
	z-index: 600;
	border-bottom-width: 3px;
	border-bottom-style: solid;
	border-bottom-color: #0c50a0;
	margin: 0px;
	padding: 0px;

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

nav li ul li a {
	font-size: 12px;
	text-align: left;
	line-height: 15px;
	padding-top: 8px;
	padding-bottom: 8px;
	padding-left: 10px;
	color: #FFF;
	float: none;
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #898989;
	background-color: rgba(0, 0, 0, 0.9);
	text-transform: uppercase;
	font-family: arial;
	
	}


.current_page_item > a, .current_page_item a:hover {
	color: #66bd2b;
} 


nav li ul li ul {
position: absolute; top:0px; left:200px; display: none; width:300px;
}




   
   
/* --------------------------------------
   Carousel
   -------------------------------------- */

.carousel { 
	margin-top: 10px;
	background-color: #fff;
	padding: 3px;
	border: 1px solid #ccc;
	box-shadow: 0px 0px 5px black;
}

.carousel-caption {
	padding: 0px;
    right: 0;
    left: auto;
    top:  80%;
    bottom: auto;
    width: 100%;
    background: black;
	padding-left: 15px;
	text-align: center;
	background: rgba(0, 0, 0, 0.70);
}

.carousel-caption h4 {
	font-size: 24px;
	line-height: normal;
	text-shadow: 0 1px 2px rgba(0,0,0,.6);
	font-style: italic;
	margin-bottom: 0;
}


/*
  Bootstrap Carousel Fade Transition (for Bootstrap 3.3.x)
  CSS from:       http://codepen.io/transportedman/pen/NPWRGq
  and:            http://stackoverflow.com/questions/18548731/bootstrap-3-carousel-fading-to-new-slide-instead-of-sliding-to-new-slide
  Inspired from:  http://codepen.io/Rowno/pen/Afykb 
*/
.carousel .carousel-inner .item {
  opacity: 0;
  transition-property: opacity;
}

.carousel .carousel-inner .active {
  opacity: 1;
}

.carousel .carousel-inner .active.left,
.carousel .carousel-inner .active.right {
  left: 0;
  opacity: 0;
  z-index: 1;
}

.carousel .carousel-inner .next.left,
.carousel .carousel-inner .prev.right {
  opacity: 1;
}

.carousel .carousel-control {
  z-index: 2;
}

/*
  WHAT IS NEW IN 3.3: "Added transforms to improve carousel performance in modern browsers."
  Need to override the 3.3 new styles for modern browsers & apply opacity
*/
@media all and (transform-3d), (-webkit-transform-3d) {
    .carousel .carousel-inner > .item.next,
    .carousel .carousel-inner > .item.active.right {
      opacity: 0;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
    .carousel .carousel-inner > .item.prev,
    .carousel .carousel-inner > .item.active.left {
      opacity: 0;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
    .carousel .carousel-inner > .item.next.left,
    .carousel .carousel-inner > .item.prev.right,
    .carousel .carousel-inner > .item.active {
      opacity: 1;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
}


   
/* --------------------------------------
   Buckets
   -------------------------------------- */


/*==================================================
=            Bootstrap 3 Media Queries             =
==================================================*/


/* Large Devices, Wide Screens */
@media only screen and (max-width : 1200px) {


}
/* Medium Devices, Desktops */
@media only screen and (max-width : 992px) {


}

/* Small Devices, Tablets  - */
@media only screen and (max-width : 768px) {

#logo img {	margin: 0 auto; width: 300px;}
#mobile-header, #mobile-footer { display: block; }
nav { display: none; }
#street { background-image: none; }
.carousel-caption h4 { font-size: 15px;}


}

/* Extra Small Devices, Phones */ 
@media only screen and (max-width : 480px) {
	


}

/* Custom, iPhone Retina */ 
@media only screen and (max-width : 320px) {
    
}