html {}
body {font-family:'Roboto',sans-serif;
/*  background img comes from MODx template variable */
  background-position:center 0;
  background-repeat:no-repeat;
  background-attachment:fixed;
  background-color:#a8c8d7;
  background-size:auto;
}
div.page-content {
  margin:0 auto;
  max-width:1000px;
  padding:0 20px 0px 20px;
}
nav.navbar-default {
  background-color:white;
  opacity:1;
/*  filter: alpha(opacity=80); */ /* IE8 and lower */ 
  border:3px solid #aaa;
  border-radius:0px;
  -moz-border-radius:0px;
  -webkit-border-radius:0px;
  border-top-left-radius:25px;
  -moz-border-top-left-radius:25px;
  -webkit-border-top-left-radius:25px;
}
ul.navbar-nav {text-align:center;margin-left:auto;margin-right:auto;margin-top:-4px;}
ul.navbar-nav li {display:inline-block;}
ul.navbar-nav li.active a {background-color:white !important;color:#906 !important;font-weight:bold;}
/* background-color:#d7e8f0 !important; */
ul.navbar-nav li a:hover {color:#906 !important;}
ul.navbar-nav li a {margin-top:10px;padding:0px 10px 5px 10px;font-size:0.9em;}
div.maincontent {
  background-color: rgba(255,255,255,1.0);
  padding:20px;
  margin-bottom:20px;
}
.shadow {
  border:3px solid #aaa;
  -webkit-box-shadow: 0px 0px 5px 0px #999;
  -moz-box-shadow: 0px 0px 5px 0px #999;
  box-shadow: 0px 0px 5px 0px #999;
}
div.prodsample-container {position:relative;}
div.prodsamples {
  opacity:1.0 !important;
  filter: alpha(opacity=100); /* IE8 and lower */
  position:absolute;
}
div.prodsamples img.opaque {opacity:1.0 !important;}
div.logos {
  width:100%;
  position:relative;
  margin:30px 0 30px 0;
}
img#logo-basic {display:none;}
img#logo-notext {display:inline;}

ul.flags img {
  padding-top:4px;
  width:24px;
}
table#resellerst td {padding-right:30px;padding-left:10px;text-indent:-10px;}
div.thumbnail-caption {
	margin-top:8px;
	padding:6px;
	text-align:center;
	background-color:#444;
	color:white;
}
div.thumbnail-caption a {color:white;font-size:1.1em;}
button.btn-runway {background-color:#444;color:white;}
button.btn-runway:hover {background-color:#444;color:#ddd;}
ul.horizontalmenu {width:90%;margin:0 0 20px 0;padding:0;}
ul.horizontalmenu li {display:inline;padding-right:30px;}
ul.horizontalmenu li span.separ {padding:0 0px 0 30px;color:#777;}
ul.horizontalmenu a {text-decoration:none; color:#777;}
ul.horizontalmenu a.selected {font-weight:bold; color:#444;}


/* CUSTOMIZE THE CAROUSEL
-------------------------------------------------- */

/* Carousel base class */
.carousel {
  margin-bottom: 30px;
}
/* Since positioning the image, we need to help out the caption */
.carousel-caption {
/*  z-index: 10; */
  bottom:none;
  top:0;
}
.carousel-caption p {
  font-size:1.2em;
  text-shadow:none;
	padding:6px;
	text-align:center;
	background-color:#444;
	color:white;
}

/* Declare heights because of positioning of img element */
.carousel .item {
   height: 600px; 
  background-color: transparent;
}
.carousel-inner > .item > img {
  position: absolute;
  top: 60px;
  left: 20%;
  margin-left:-15%;
  height: 600px;
}
/* remove gradients */
.carousel-control.left, .carousel-control.right {
    background-image: none
}
.carousel-control span {
    font-size: 100px; 
    margin-top: -50px;
    color: #000;
}
/* Media rules */

@media only screen and (min-width: 320px) {
  div.prodsamples { display:none;}
}
@media only screen and (min-width: 480px) {
  div.prodsamples        { display:block;width:240px;top:0px;right:0px; }
  img#logo-basic {display:inline;}
  img#logo-notext {display:none;}
  .carousel-inner > .item > img {
    left: 30%;
  }
}
@media (min-width: 768px) {
  .footer {border:1px solid green;}
  div.prodsamples        { display:block;width:100%;top:0px;right:0px; }
  .carousel-inner > .item > img {
    left: 50%;
  }
}
@media (min-width: 992px) {
  ul.navbar-nav li {font-size:1.2em;}
}
@media (min-width: 1200px) {
  body {background-size:cover;}
}