@charset "UTF-8";
/* CSS Document */

/****************** nav  ******************/
.navbar {
    background-color:rgba(255, 255, 255, 0.5);
 /**  background-color:transparent;
   background: transparent;**/

}

.navbar .nav-main {
    background-image: url("../pics/bg-main-logo.png");
    background-position: top left;
	height:90px;
	z-index:-99;
}

.navbar-sub {
	height:90px;
	background-color:#eee}

.navmain-menu {
	position:absolute;
	z-index:999;
	top:120px;
}

.navmain-menu li {
	list-style:none;
}


.navmain-menu > li  a {
	background-color:rgba(74, 149, 203, 0.8)!important;
	color:#fff;
	width:260px;
	padding:10px;
	font-size:1.2em;
	text-transform:uppercase;
}


.navmain-menu > li > a:hover {
	background-color:rgba(50, 50, 50, 0.9)!important;;
}


@media only screen and (min-width: 769px) and (max-width: 979px) {
.carousel,  .item, .active {height: 400px;}
.carousel-inner {height: 400px;}
.navmain-menu {top:70px;}
.navmain-menu > li  a {padding:5px;}
}
	

@media only screen and (min-width: 480px) and (max-width: 768px) {
.carousel,  .item, .active {height: 400px;}
.carousel-inner {height: 400px;}
.navbar .nav-main {	height:70px;}
.navmain-menu {top:70px;}
.navmain-menu > li  a {width:200px; padding:5px;}
}


@media only screen and (max-width: 480px) {
.carousel,  .item, .active {height: 350px;}
.carousel-inner {height: 350px;}
.navbar .nav-main {	height:70px;}
.navmain-menu {top:50px;}
.navmain-menu > li  a {width:150px; padding:8px; font-size:1em;}
}


/****************** background slider ******************/


.carousel,
.item,
.active {
    height: 500px;
	z-index:9;
}

.carousel-inner {
    height: 500px;
	margin-top:-120px;
}

/* Background images are set within the HTML using inline CSS, not here */

.fill {
    width: 100%;
    height: 100%;
    background-position: top;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
}