/* miSlider Core Styles ========================================== */ /* Version: 0.1.12 */ /* Resets */ .mis-stage, .mis-slider, .mis-slide, .mis-container, .mis-container * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; margin: 0; padding: 0; } .mis-stage, .mis-slider { position: relative; overflow: hidden; } .mis-stage { width: 100%; text-align: center; height: 500px !important; max-height: 100% !important; } .mis-slider { list-style: none; overflow: visible; height: 100%; margin-top: 0; } /* Set slide width and padding */ .mis-slide { width: 100%; height: auto; padding: 0; display: block; position: relative; float: left; overflow: visible !important; } .mis-slider .scroll_caption { display:none; opacity:0; -webkit-transition: opacity 0.2s ease-in; -moz-transition: opacity 0.2s ease-in; -ms-transition: opacity 0.2s ease-in; -o-transition: opacity 0.2s ease-in; transition: opacity 0.2s ease-in; } .mis-current .scroll_caption { display: block; position: absolute; top: 94%; right:-110%; width: 950px; opacity:1; -webkit-transition: opacity 0.2s ease-in; -moz-transition: opacity 0.2s ease-in; -ms-transition: opacity 0.2s ease-in; -o-transition: opacity 0.2s ease-in; transition: opacity 0.2s ease-in; } .js .mis-slide { display: none; opacity: 0; } .mis-slide.mis-current { z-index: 100; display: block; } /* Slide container - inserted around the contents of each slide by the plugin */ .mis-container { display: block; width: auto; height: auto; border: 0; } /* Style list navigation */ .mis-nav-list { position: absolute; bottom: .5em; width: 100%; margin: 0 auto; /* center it */ z-index: 300; padding: 0; display:none; } .mis-nav-list li { display: inline-block; margin: 0 .25em; } .mis-nav-list li a { display: block; width: 11px; height: 11px; text-indent: 100%; /* Replace text */ overflow: hidden; white-space: nowrap; border: 1px solid #eee; border-radius: 7px; /* Make items round */ opacity: .3; -webkit-box-shadow: inset 0 0 2px #333; box-shadow: inset 0 0 2px 2px #333; margin: 0 3px; } .mis-nav-list li.mis-current a, .mis-nav-list li a:hover { background: #333; } .mis-nav-buttons { display: block; position: absolute; height: 0; top: 0; opacity:1 !important; z-index: 200; } .mis-nav-buttons a { position: absolute; color: #eee; font-size: 0; /* Hide for browser except Android */ line-height: .01; /* 0 is inconsistent in Opera */ font-weight: bold; text-decoration: none; text-indent: -9999px; /* Hide for Android */ transition: all 0.3s ease; } .mis-nav-buttons a:hover { color: #333; transition: all 0.3s ease; } .mis-nav-buttons a.mis-next { left: auto; right: 0; } .mis-nav-buttons a.mis-prev { left: 0; } .mis-nav-buttons a.mis-prev:before, .mis-nav-buttons a.mis-next:after { content: "\2039"; /* left single angle quote */ display: block; font-size: 80px; text-indent: 0; } .mis-nav-buttons a.mis-next:after { content: "\203A"; /* right single angle quote */ } .scroll_caption h3 { font-family: 'robotolight'; font-size:28px; color: #1879a9; } .scroll_caption .job { width:100%; display:block; font-family: 'robotolight'; font-size:14px; color: #818181; padding:10px 0 20px; 0; } .scroll_caption .desc { width:100%; display:block; font-family: 'robotolight'; font-size:18px; color: #333333; line-height:35px; } figure, body { margin: 0; padding: 0; } h1, #wrapper > figure > figcaption { text-align: center; } #wrapper > figure > figcaption { margin: 1em; } .demo h1, .demo #wrapper > figure > figcaption { color: #fff; } .mis-slider li figcaption { font-weight: 500; } .main { width: 80%; margin: 2em auto; /*display: block;*/ } div.main pre { font-size: 1.1em; overflow: auto; max-height: 500px; background-color: #fff; padding: 0 1em 1em; } @media screen and (min-width: 1200px) { .main { width: 50%; } }