.seaside-slider {
color:#000;
background-color:#1C1C1C;
border:#000000 solid 1px;
}

.seaside-slider section nav ul li a {
color:inherit;
font-size:10px;
text-decoration:none;
display:block;
}

/*
Viewport
---------------------------------------------------------------------------------------------------- */

.seaside-slider > .viewport {
background-color:#ffffff;
}



/*
Slides
---------------------------------------------------------------------------------------------------- */

.seaside-slider .slides > section {
background-color:#fff;
-moz-box-sizing:border-box;
-webkit-box-sizing:border-box;
-ms-box-sizing:border-box;
box-sizing:border-box;
}

.seaside-slider .slides > section .content {
padding:5px;
}



/*
Navigation
---------------------------------------------------------------------------------------------------- */

.seaside-slider > nav {
height:30px;
position:relative;
text-align:center;
}


/*
Prev and next
---------- */

.seaside-slider > nav .prev,
.seaside-slider > nav .next {
width:0;
height:0;
position:absolute;
top:0;
margin:7px 0 0 0;
padding:0;
background:none;
border:solid 8px;
cursor:pointer;
display:block;
}

.seaside-slider > nav .prev {
left:3px;
border-color:transparent #FFFFFF transparent transparent;
}

.seaside-slider > nav .next {
right:3px;
border-color:transparent transparent transparent #FFFFFF;
}

.seaside-slider > nav .prev:before,
.seaside-slider > nav .next:before {
width:40px;
height:30px;
position:absolute;
top:-14px;
display:block;
content:"";
}

.seaside-slider > nav .prev:before {
left:-10px;
}

.seaside-slider > nav .next:before {
right:-10px;
}


/*
Slide selectors
---------- */

.seaside-slider > nav ul {
height:30px;
margin:0;
padding:0;
display:inline-block;
}

.seaside-slider > nav ul li {
width:16px;
height:4px;
position:relative;
margin:14px 0 0 0;
background-color:#2D2D2D;
vertical-align:top;
display:inline-block;
cursor:pointer;
z-index:99;
-moz-transition:background-color 0.3s;
-webkit-transition:background-color 0.3s;
-o-transition:background-color 0.3s;
-ms-transition:background-color 0.3s;
transition:background-color 0.3s;
}

.seaside-slider > nav ul li:first-child {
border-top-left-radius:5px;
border-bottom-left-radius:5px;
}

.seaside-slider > nav ul li:last-child {
border-top-right-radius:5px;
border-bottom-right-radius:5px;
}

.seaside-slider > nav ul li:before {
width:100%;
height:30px;
margin:-14px 0 0 0;
display:block;
content:"";
}

.seaside-slider > nav ul li + li {
margin-left:1px;
}

.seaside-slider > nav ul li.current {
background-color:#FFFFFF;
border-radius:5px;
cursor:default;
z-index:0;
-moz-transition:all 0.5s;
-webkit-transition:all 0.5s;
-o-transition:all 0.5s;
-ms-transition:all 0.5s;
transition:all 0.5s;
}

.seaside-slider > nav ul li.current,
.seaside-slider.slide-right > nav ul li.current {
-moz-transform:rotate(-90deg);
-webkit-transform:rotate(-90deg);
-o-transform:rotate(-90deg);
-ms-transform:rotate(-90deg);
transform:rotate(-90deg);
}

.seaside-slider.slide-left > nav ul li.current {
-moz-transform:rotate(90deg);
-webkit-transform:rotate(90deg);
-o-transform:rotate(90deg);
-ms-transform:rotate(90deg);
transform:rotate(90deg);
}



/*
Full width
---------------------------------------------------------------------------------------------------- */

.seaside-slider.full-width {
-moz-box-sizing:border-box;
-webkit-box-sizing:border-box;
-ms-box-sizing:border-box;
box-sizing:border-box;
}



/*
Fullscreen
---------------------------------------------------------------------------------------------------- */

.seaside-slider.fullscreen {
-moz-box-sizing:border-box;
-webkit-box-sizing:border-box;
-ms-box-sizing:border-box;
box-sizing:border-box;
}

.seaside-slider.fullscreen > nav {
width:100%;
position:absolute;
bottom:0;
padding:0 0 10px 0;
opacity:0;
-moz-transition:opacity 1.5s 2s ease-in-out;
-webkit-transition:opacity 1.5s 2s ease-in-out;
-o-transition:opacity 1.5s 2s ease-in-out;
-ms-transition:opacity 1.5s 2s ease-in-out;
transition:opacity 1.5s 2s ease-in-out;
}

.seaside-slider.fullscreen > nav:hover,
.seaside-slider.fullscreen > nav:focus {
opacity:1;
-moz-transition:opacity 0.5s ease-in-out;
-webkit-transition:opacity 0.5s ease-in-out;
-o-transition:opacity 0.5s ease-in-out;
-ms-transition:opacity 0.5s ease-in-out;
transition:opacity 0.5s ease-in-out;
}



/*
Captions
---------------------------------------------------------------------------------------------------- */

.seaside-slider section > figure {
position:relative;
margin:0;
overflow:hidden;
display:inline-block;
}


.seaside-slider section > figure a img {
border:none;
}

.seaside-slider section > figure img,
.seaside-slider section > figure video {
position:relative;
display:block;
}

.seaside-slider section > figure figcaption {
width:100%;
position:absolute;
bottom:0;
padding:5px 10px 5px 10px;
font-size:13px;
text-align:center;
line-height:1.5;
background-color:#000000;
background-color:rgba(0,0,0,0.7);
border-top:#000000 solid 1px;
overflow:hidden;
-moz-box-sizing:border-box;
-webkit-box-sizing:border-box;
-ms-box-sizing:border-box;
box-sizing:border-box;
opacity:0;
-moz-transform:translateY(100%);
-webkit-transform:translateY(100%);
-o-transform:translateY(100%);
-ms-transform:translateY(100%);
transform:translateY(100%);
-moz-transition:all 0.3s ease-in-out;
-webkit-transition:all 0.3s ease-in-out;
-o-transition:all 0.3s ease-in-out;
-ms-transition:all 0.3s ease-in-out;
transition:all 0.3s ease-in-out;
color:#ffffff;
}

.seaside-slider section > figure figcaption a{
    color:#ffffff;
    text-decoration:none;
}

html:not(.js) .seaside-slider section > figure figcaption,
.seaside-slider section.current > figure figcaption {
opacity:1;
-moz-transform:none;
-webkit-transform:none;
-o-transform:none;
-ms-transform:none;
transform:none;
-moz-transition:all 0.7s ease-in-out;
-webkit-transition:all 0.7s ease-in-out;
-o-transition:all 0.7s ease-in-out;
-ms-transition:all 0.7s ease-in-out;
transition:all 0.7s ease-in-out;
}