/** Stage container **/

.connected-carousels .stage 
{width: 950px;
 height: 500px;
 margin: 0px auto;
 position: relative;}

.connected-carousels .photo-credits 
{position: relative;
 font-family: 'Teko';
 left: 20px;
 bottom: 117px;
 font-size: 50px;
 color: #fff;
 text-shadow: 2px 2px 0px rgba(0, 0, 0, 1.0);
 opacity: 1.0;}

.connected-carousels .photo-credits2
{position: relative;
 font-family: 'Teko';
 left: 20px;
 bottom: 170px;
 font-size: 50px;
 color: #ff6003;
 text-shadow: 2px 2px 0px rgba(0, 0, 0, 1.0);
 opacity: 1.0;}

.connected-carousels .photo-credits a {
    color: #fff;
}

/** Navigation container **/

.connected-carousels .navigation 
{width: 950px;
 height: 60px;
 margin: 0px auto;
 position: relative;
 bottom: -15px;
 text-align: left;
 background-color:rgba(0,0,0,0.5);
 -webkit-border-radius: 0px 0px 20px 20px;
    -moz-border-radius: 0px 0px 20px 20px;
         border-radius: 0px 0px 20px 20px;}

/** Shared carousel styles **/

.connected-carousels .carousel {
    overflow: hidden;
    position: relative;
}

.connected-carousels .carousel ul {
    width: 10000em;
    position: relative;
    list-style: none;
    margin: 0;
    padding: 0;
}

.connected-carousels .carousel li {
    float: left;
}

/** Stage carousel specific styles **/

.connected-carousels .carousel-stage {
    width: 950px;
    height: 500px;
    top: 75px;
    border-left: 0px solid rgba(255,255,255,0.3);
    border-right: 0px solid rgba(255,255,255,0.3);
    -webkit-border-radius: 0px 0px 20px 20px;
       -moz-border-radius: 0px 0px 20px 20px;
            border-radius: 0px 0px 20px 20px;
    -webkit-box-shadow: 0 0 0px #999;
       -moz-box-shadow: 0 0 0px #999;
            box-shadow: 0 0 0px #999;}

.parallelogram 
{position: relative;
 width: 300px;
 height: 500px;
 transform: skew(160deg);
 background: #16c6f2;
 opacity: .6;
 top:-576px;
 left: 550px;}

.parallelogram2 
{position: relative;
 width: 300px;
 height: 500px;
 transform: skew(160deg);
 background: #FB6003;
 opacity: .6;
 top:-576px;
 left: 550px;}

table
{position: relative;
 top: 175px;
 border: 4px solid #ffffff;
 border-collapse: collapse;
 width: 280px;
 margin: auto;}

th
{position: relative;
 text-align: center;
 font-family: 'Teko';
 font-weight: bold;
 background: #c1c1c1;}

td
{position: relative;
 border: 4px solid #ffffff;
 text-align: center;
 font-family: 'teko';
 font-size: 40px;
 font-weight: bold;}
 
td:nth-child(1) {text-align: left; padding-left: 10px;}
th:nth-child(1) {text-align: left; padding-left: 10px;}

h5
{font-family: 'Sriracha', cursive;}

h6
{position: relative;
 font-weight: 40px;
 left: 10px;}
/** Navigation carousel specific styles **/

.connected-carousels .carousel-navigation /** Edit this width for connected slide width**/
{height: 60px;
 width: 920px; /** Change this by increments of 92 until you reach 920px **/
 left: 15px;
 border: 0px solid #fff;
 display: inline-block;
 -webkit-border-radius: 0px 0px 0px 0px;
    -moz-border-radius: 0px 0px 0px 0px;
         border-radius: 0px 0px 0px 0px;
 -webkit-box-shadow: 0 0 0px #999;
    -moz-box-shadow: 0 0 0px #999;
         box-shadow: 0 0 0px #999;}

.connected-carousels .carousel-navigation li 
{cursor: pointer;}

.connected-carousels .carousel-navigation li img 
{display: block;
 opacity: .55;
 padding: 5px;
 -webkit-border-radius: 10px 10px 10px 10px;
    -moz-border-radius: 10px 10px 10px 10px;
         border-radius: 10px 10px 10px 10px;}

.connected-carousels .carousel-navigation li img:hover 
{opacity: 1.0;  
 transition: .5 ease;}

.connected-carousels .carousel-navigation li.active img 
{opacity: 1.0;  
 transition: .5 ease;}

/** Stage carousel controls **/

.connected-carousels .prev-stage
{position: absolute;
 top: 200px;
 height: 50px;
 width: 80px;
 left: 0px;
 cursor: pointer;
 background: url("img/prev_hover6.png");
 transition: .2s ease;
 opacity: .3;}

.connected-carousels .next-stage 
{position: absolute;
 top: 200px;
 height: 50px;
 width: 80px;
 right: -10px;
 cursor: pointer;
 background: url("img/next_hover5.png");
 transition: .2s ease;
 opacity: .3;}

.connected-carousels .prev-stage 
{left: -10px;}

.connected-carousels .next-stage 
{right: -10px;}

.connected-carousels .prev-stage:hover
{display: block;
 cursor: pointer;
 opacity: 1.0;}

.connected-carousels .next-stage:hover
{display: block;
 cursor: pointer;
 opacity: 1.0;}

.connected-carousels .prev-stage.inactive,
.connected-carousels .next-stage.inactive 
{transition: .2s ease;
 opacity: .3;}

.connected-carousels .prev-stage span,
.connected-carousels .next-stage span 
{display: none;
 position: absolute;
 top: 50%;
 width: 30px;
 height: 30px;
 text-align: center;
 background: #4E443C;
 color: #fff;
 text-decoration: none;
 text-shadow: 0 0 1px #000;
 font: 24px/27px Arial, sans-serif;
 -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
         border-radius: 30px;
 -webkit-box-shadow: 0 0 2px #999;
    -moz-box-shadow: 0 0 2px #999;
         box-shadow: 0 0 2px #999;}

.connected-carousels .prev-stage span 
{left: 20px;}

.connected-carousels .next-stage span 
{right: 20px;}

.connected-carousels .prev-stage:hover span,
.connected-carousels .next-stage:hover span 
{display: block;}

/** Navigation carousel controls **/

.connected-carousels .prev-navigation
{display: block;
 position: absolute;
 width: 10px;
 height: 40px;
 background: #ff6003;
 color: #fff;
 text-decoration: none;
 text-shadow: 0 0 1px #000;
 font: 16px/38px Arial, sans-serif;
 -webkit-border-radius: 20px 0px 0px 20px;
    -moz-border-radius: 20px 0px 0px 20px;
         border-radius: 20px 0px 0px 20px;
    -webkit-box-shadow: 0 0 2px #999;
       -moz-box-shadow: 0 0 2px #999;
            box-shadow: 0 0 2px #999;}

.connected-carousels .next-navigation 
{display: block;
 position: absolute;
 width: 10px;
 height: 40px;
 background: #ff6003;
 color: #fff;
 text-decoration: none;
 text-shadow: 0 0 1px #000;
 font: 16px/38px Arial, sans-serif;
 -webkit-border-radius: 0px 20px 20px 0px;
    -moz-border-radius: 0px 20px 20px 0px;
         border-radius: 0px 20px 20px 0px;
    -webkit-box-shadow: 0 0 2px #999;
       -moz-box-shadow: 0 0 2px #999;
            box-shadow: 0 0 2px #999;}

.connected-carousels .prev-navigation 
{left: 5px;
 top: 10px;
 text-indent: 2.5px;}

.connected-carousels .next-navigation 
{right: 5px;
 top: 10px;
 text-indent: 2.5px;}

.connected-carousels .prev-navigation.inactive,
.connected-carousels .next-navigation.inactive 
{opacity: .65;
 cursor: default;}