@charset "utf-8";
/* CSS Document */
.container {
    padding-right: 0;
    padding-left: 0;
    margin-right: auto;
    margin-left: auto
    }
.col-centered {
    float: none;
    margin: 0 auto
    }
.logo {
    margin-top: 10px
    }
.text-trails {
    color: #fff;
    font-size: 14px;
    padding-top: 25px
    }
#top-banner {
    background-color: #000
    }
/*=========================================*/
h2 {
    font-size: 16px;
    line-height: 24px;
    /*   background-color: #000;*/
    color: #000;
    font-family: Verdana, Geneva, sans-serif;
    letter-spacing: 0.2em
    }
/*=========================================*/
#middle-banner {
    background-color: #c00
    }
.navbar-default {
    min-height: 32px !important;
    /* max-height:32px;*/
    background-color: #ccc;
    background-image: none;
    background-repeat: no-repeat;
    font-size: 12px;
    font: 100%/1.4 Verdana, Arial, Helvetica, sans-serif
    }
.navbar-nav > li > a {
    padding-top: 6px !important;
    padding-bottom: 6px !important
    }
footer {
    bottom: 0;
    width: 100%;
    background-color: #ccc;
    padding-top: 12px;
    padding-bottom: 12px;
    margin-bottom: 0;
    margin-top: 30px;
    font-size: 0.9em
    }
@media (max-width: 767px) {
    #myCarousel {
        height: 250px
        }
    #slide1 {
        background: url(../img/carousel/slide-1-250px.jpg) top center no-repeat
        }
    #slide2 {
        background: url(../img/carousel/slide-2-250px.jpg) top center no-repeat
        }
    #slide3 {
        background: url(../img/carousel/slide-3-250px.jpg) top center no-repeat
        }
    .carousel-caption {
        position: absolute;
        top: 100px;
        text-align: center;
        color: white;
        visibility: hidden
        }
    }
/* Landscape phone to portrait tablet */
@media (min-width: 768px) and (max-width: 1199px) {
    #myCarousel {
        height: 300px
        }
    #slide1 {
        background: url(../img/carousel/slide-1-300px.jpg) top center no-repeat
        }
    #slide2 {
        background: url(../img/carousel/slide-2-300px.jpg) top center no-repeat
        }
    #slide3 {
        background: url(../img/carousel/slide-3-300px.jpg) top center no-repeat
        }
    .carousel-caption {
        position: absolute;
        top: 100px;
        text-align: center;
        color: white
        }
    }
/* Large desktop */
@media (min-width: 1200px) {
    #myCarousel {
        height: 400px
        }
    #slide1 {
        background: url(../img/carousel/slide-1.jpg) top center no-repeat
        }
    #slide2 {
        background: url(../img/carousel/slide-2.jpg) top center no-repeat
        }
    #slide3 {
        background: url(../img/carousel/slide-3.jpg) top center no-repeat
        }
    .carousel-caption {
        position: absolute;
        top: 150px;
        text-align: center;
        color: white
        }
    }
.carousel-indicators {
    color: black
    }
.hero {
    background-color: #ccc;
    padding: 20px;
    margin: 20px
    }
/*added to keep type away from sides in xs view */
.row {
    margin-left: 0;
    margin-right: 0
    }
.center-block {
    margin-left: auto;
    margin-right: auto;
    display: center
    }
/*took out for now>>>
.list-studios {
display:inline;
}
*/
.col-lg-3:nth-child(4n+1) {
    clear: left
    }
.pagination {
    position: relative;
    margin: auto
    }
/*#webapp29002pagination {
  margin-:auto!important;
  margin-right:auto!important;
  margin-top:50px;
   
}*/
.pag-current {
    display: inline;
    position: relative;
    float: left;
    padding: 6px 12px;
    margin-left: -1px;
    line-height: 1.428571;
    color: #fff;
    text-decoration: none;
    background-color: #337ab7;
    border: 1px solid #ddd
    }
#webapp29002pagination {
    padding-bottom: 20px
    }
.event-well {
    height: 300px;
    min-height: 20px;
    padding: 19px;
    margin-bottom: 20px;
    background-color: #f5f5f5;
    border: 1px solid #e3e3e3;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05)
    }
.embed-container {
    position: relative;
    height: 0;
    overflow: hidden;
    padding-bottom: 30%;
    /* This will give you a 16 x 9 sized ratio */
    }
.embed-container > iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
    }
/*.dropdown-toggle:active, .open .dropdown-toggle {
    background:#FFF !important; 
    color:#000 !important; 
}*/
.navbar-toggle {
    margin-top: -60x
    }
.col-lg-3:nth-child(4n+1) {
    clear: left
    }
/*for the height of the web app items so they flow properly*/
.col-height {
    min-height: 230px
    }
/*for the colour of the end of the carousel when wide*/
.carousel-control.right {
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0) 0, rgba(145, 155, 168, 1) 100%);
    background-repeat: repeat-x;
    left: auto;
    right: 0
    }
.carousel-control.left {
    background-image: linear-gradient(to right, rgba(145, 155, 168, 1) 0, rgba(0, 0, 0, 0) 100%);
    background-repeat: repeat-x
    }
/*for the width of the Manitoulin Island ad rotator*/
.btn-wide {
    width: 200px
    }