.fssopen, .fssopen body { /* class added to HTML element when full screen slider is open to hide potential body scrollbars */
width: 100%; height: 100%; top: 0; left: 0; margin: 0; overflow: hidden;
}
.fullscreenslider {
position: fixed; left: 0; top: 0; width: 100%; height: 100%; z-index: 2000; font-size: 16px; /* base font size */ visibility: visible; overflow: hidden;
}
.slidewrapper { /* wrapper DIV that surrounds the ARTICLE elements inside .dd_fullscreenslider */
width: 100%; height: 100%; position: absolute; top: 0; left: 0; -webkit-transform: translate3d(0, 0, 0); /* to prevent flickering in iOS */ -moz-transition: -moz-transform 0.5s; /* actual duration controlled by script */ -webkit-transition: -webkit-transform 0.5s; transition: transform 0.5s;
}
.fssnav { /* UL list dynamically added by script for Slider navigation */
list-style: none; margin: 0; position: absolute; top: 50%; /* vertically center menu */ right: 80px; /* distance from right edge of screen */ transform: translateY(-50%); /* vertically center menu */
}
.fssnav li {
margin-bottom: 15px;
}
.fssnav li a {
text-decoration: none; border: 2.5px solid #225378; /* border color of nav links */ opacity: 0.8; border-radius: 50%; width: 16px; /* dimensions of nav links */ height: 16px; display: block; position: relative; text-indent: -500px; outline: none; overflow: hidden;
}
.fssnav li a::after { /* create "fill" element inside A */
content: ""; position: absolute; width: 100%; height: 100%; top: 100%; left: 0; background: #2c3e50; /* color of "fill" element */ opacity: 0.9; transition: top 0.5s; /* transition for "fill up" effect */
}
.fssnav .selected a::after {
top: 0; /* fill up selected A element from bottom to top */
}
.fullscreenslider .slide { /* CSS for each slide */
width: 100%; height: 100%; display: block; font-family: 'Droid Sans', sans-serif; /* Use google font */ font-size: 60px; color: #2c3e50; overflow: hidden; -webkit-box-sizing: border-box; /* include padding/ border as part of declared menu width */ -moz-box-sizing: border-box; z-index: 1000; background: white; -webkit-transform: translate3d(0, 0, 0); /* to prevent flickering in iOS */
}
.fullscreenslider .slide h2 { /* H2 Header inside each slide */
font-size: 3em; margin: 0; line-height: 1.1em; letter-spacing: 3px;
}
.fullscreenslider .slide .scrollable { /* Assign this class to elements within a slide that should be scrollable */
overflow: auto;
}
.fullscreenslider .slide {
background: white;
}
.fullscreenslider .closex { /* Large x close button inside Slider */
width: 50px; height: 50px; overflow: hidden; display: block; position: fixed; cursor: pointer; text-indent: -1000px; opacity: 0.8; z-index: 1001; top: 5px; right: 3px;
}
.fullscreenslider .closex::after { /* render large x inside close button */
content: ""; display: block; position: absolute; width: 100%; height: 6px; background: white; /* color of x button */ top: 50%; margin-top: -3px; -ms-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); transform: rotate(-45deg);
}
.fullscreenslider .closex::after { /* render large cross inside close button */
-ms-transform: rotate(-135deg); -webkit-transform: rotate(-135deg); transform: rotate(-135deg);
}
.bio-text {
margin-top: 30%; font-size:30px; line-height: 40px;
}