/* ==========================================================================
   Author's custom styles
   ========================================================================== */

body {background: url(../img/bg.jpg) repeat-x white 0 0 fixed; font-family: Oswald;}
.myheader {box-shadow: 0 0 3px #666; background: white; margin-bottom:15px}
.myheader .navbar {margin-bottom:0;}
.box {background: white; padding: 15px; margin-bottom: 20px; border-radius: 4px 4px 4px 4px;-moz-border-radius: 4px 4px 4px 4px;-webkit-border-radius: 4px 4px 4px 4px;}
.box ul li {color:#0093D6; list-style: circle; }
.box ul li p{color:#333;}
h1, h2, h3, h4, h5 { font-family: Oswald;}
p,li {font-weight: 300;}
strong {font-weight: 400; }
.jumbotron {position: relative; overflow: hidden; min-height: 400px; background: white;}
.jumbotron h1, .jumbotron p{position: relative; z-index:1000}
.jumbotron .cycle-slideshow {position: relative; z-index:0; left:0; top:0; width: 250%; margin: 0 -10px -10px -10px}
.jumbotron .cycle-slideshow img{width: 100%}
.box h2 {background: #28A5DE; color: white; text-shadow: 1px 1px 1px #999; padding: 15px; margin: -15px -15px 15px -15px; border-bottom: 4px solid #69BDE3; border-radius: 4px 4px 0 0;}
.box h2 a {color: white; display: block}
.flag {float: left; vertical-align: middle; font-size: 25px}
.flag-img {float: left; margin-right: 10px; margin-left: 0}
.navbar .navbar-nav > .active > a {border-radius: 4px 4px 4px 4px;-moz-border-radius: 4px 4px 4px 4px;-webkit-border-radius: 4px 4px 4px 4px;}
#links a.thumbnail {margin-bottom: 10px; }
.vent-showtime {background:#fafafa; float: left; padding: 20px 0 0 0; width: 100%;}
.vent-showtime ul li {font-size: 16px;}
.footer .box {
        /* Fallback for web browsers that doesn't support RGBa */
        background: rgb(255, 255, 255) transparent;
        /* RGBa with 0.6 opacity */
        background: rgba(255, 255, 255, 0.4);
        /* For IE 5.5 - 7*/
        filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#ffffff, endColorstr=#ffffff);
        /* For IE 8*/
        -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#ffffff, endColorstr=#ffffff)";
}
button.close {padding: 0 8px; font-size: 35px;}
.label {font-family: Verda, Arial, sans; padding:2px 4px; font-size: 12px;}
.modal-header .close {margin-top: -7px;}
/*shop items*/
.cart-img {max-height: 150px; max-width: 150px;}
.shop .thumbnail  {margin-bottom: 30px;position: relative;}
.shop .thumbnail-home  {margin-bottom: 10px;}
.cart-total {font-weight: 700; color: red;}
table {font-weight: 300;}
form label{font-weight: 300;}
.form-group {margin-bottom: 5px;}
.caption .description {float: left; height: 8em}
.caption .prices {float: left;}
.caption .price {color: red; font-weight: 400}

.caption .btn-buy {float: right;}

/* Extra small devices (phones, up to 480px) */
/* No media query since this is the default in Bootstrap */
.jumbotron h1{
        font-size: 36px; 
        margin-top:15px; 
        transition: 600ms;
        -webkit-transition: 600ms; /* Safari */
}
.jumbotron  {padding: 10px}
.navbar-brand {float: left; margin: 0;width: 258px;display:block;
        transition: 600ms;
        -webkit-transition: 600ms; /* Safari */
}
.langs {margin: 0 auto 10px auto; 
        transition: 600ms;
        -webkit-transition: 600ms; /* Safari */	
}
#cart-btn a{color:#fff;}

.shop .caption .btn-buy {float: none; position: absolute; bottom: 10px; right: 10px;}
.shop .caption h4 {min-height: 2em}

/*NAVBAR*/
.navbar {
    background:transparent;
    box-shadow: none;
}
.navbar-default {
    background:transparent;
    border:none;
}
.slide .thumbnail img{width: 350px; height: 350px;max-width:100%}
.slide .thumbnail .caption {height: auto;}

/* validation */
    .help-block{font-weight: 300; font-size: 13px;}
    
/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) { 
        .jumbotron h1{font-size: 36px; margin-top:80px}
        .jumbotron {min-height: 395px;}
        .jumbotron .container {width: 40%; margin-left: 60%;}
        .langs {margin: 0 auto;width: auto;display:inline-block; margin-top: 20px;}
        .navbar-brand {float: left; margin: 0;width: auto;display:inline-block;}	
        .shop .thumbnail > img {float: left; margin: 0;}


        .jumbotron h1, .jumbotron p{position: relative; z-index:1000}
        .jumbotron .cycle-slideshow {position: absolute; z-index:0; left:0; top:0; width: auto; margin: 0}
        .jumbotron .cycle-slideshow img{width: auto}	
        .navbar-nav > li > a {padding: 13px;}
}

/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) {
        .jumbotron h1{font-size: 42px; margin-top: 90px}
        .jumbotron .container {width: 50%; margin-left: 50%;}		
        .caption .description {float: none;}
        .thumbnail .caption {height: 36em;}
        #myModal .modal-dialog {width: 940px;}
}

/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
        .home-row .box {min-height:655px;}
        .jumbotron h1{font-size: 52px; margin-top: 120px}
        .jumbotron p{font-size:26px;}
        .jumbotron {min-height: 395px}
        .jumbotron .container {width: 60%; margin-left: 40%;}
        .flag-img {float: left; margin-right: 10px; margin-left: 25px}
        .caption .description {float: left;}
        .thumbnail .caption {height: 15em;}
        .shop .thumbnail > img {float: none; margin:0 auto;max-height:350px}
}