/*------------------------------Slide Navigation-------------------------*/
#slidenav{position:absolute;bottom:50px;right:50px;display:block;z-index:1}
#slidenav.navhid{display:none}
#slideshd{position:absolute;top:0;left:0;display:block;height:300px;width:100%;z-index:1;background:url(../images/bg-header.png) repeat-x top left}

.panes,.panes div.bgImage{top:0;left:0;height:100%;width:100%;padding:0;margin:0;display:block}
.panes{position:relative;overflow:hidden;min-width:720px;min-height:550px;z-index:0}
.panes div.bgImage{position:absolute;background-position:center center;background-repeat:no-repeat;-webkit-background-size:cover;-moz-background-size:cover;-o-background-size:cover;background-size:cover}

a.backward,a.forward{position:fixed;top:0;width:75px;height:100%;cursor:pointer;display:block;background-position:center center;background-repeat:no-repeat;background-size:10px 30px;-moz-opacity:0;-khtml-opacity:0;opacity:0;visibility:hidden}
a.backward{left:0;background-image:url(../images/bt-left.png)}
a.backward:hover{background-image:url(../images/bt-left-over.png);background-color:rgba(255,255,255,.4)}
a.forward{right:0;background-image:url(../images/bt-right.png)}
a.forward:hover{background-image:url(../images/bt-right-over.png);background-color:rgba(255,255,255,.4)}
a.backward.show,a.forward.show{-moz-opacity:1;-khtml-opacity:1;opacity:1;visibility:visible}

.slidetabs{position:relative;float:left}
.slidetabs a{width:20px;height:20px;float:left;margin:0 0 0 10px;display:block;font-size:1px;background:rgba(51,51,51,.6);cursor:pointer}
.slidetabs a:first-child{margin-left:0}
.slidetabs a:hover{background:rgba(51,51,51,1)}
.slidetabs a.current{background:rgba(255,255,255,.4)}
.slidetabs a.current:hover{background:rgba(255,255,255,1)}

/* transition */
a.backward,a.forward,a.backward:hover,a.forward:hover,
.slidetabs a,.slidetabs a:hover,
.slidetabs a.current,.slidetabs a.current:hover
{transition:all .5s;-moz-transition:all .5s;-webkit-transition:all .5s;-o-transition:all .5s}

@media (max-width:768px){
#slideshd{top:80px;display:none}
#slidenav,#slidenav.navhid{right:auto}
.panes{min-width:100px;margin-top:80px}
#slidenav{bottom:initial;margin:45px 10% 0;width:80%;text-align:center}
.slidetabs{float:none;display:inline-block}
a.backward,a.forward{position:absolute;bottom:auto;margin-top:30px;height:50px;width:10%;-moz-opacity:1;-khtml-opacity:1;opacity:1;visibility:visible}
}

@media (max-width:768px) and (orientation: portrait){
.panes{min-height:50vh;height:50vh}
#slidenav,a.backward,a.forward{top:50vh}
}

@media (max-width:768px) and (orientation: landscape){
.panes{min-height:100vh;height:100vh}
#slidenav,a.backward,a.forward{top:100vh}
}

@media (max-width:480px){
#slidenav{margin-top:48px}
.slidetabs a{width:15px;height:15px;margin-left:13px}
}