/* ############ icomoon icon fonts CSS ############ */

@font-face{font-family: 'icomoon';font-weight: normal;font-style: normal;src: url('icomoon.eot?-qkv88o');src: url('icomoon.eot?#iefix-qkv88o') format('embedded-opentype'), url('icomoon.ttf?-qkv88o') format('truetype'), url('icomoon.woff?-qkv88o') format('woff'), url('icomoon.svg?-qkv88o#icomoon') format('svg');}
[class^='icon-'],[class*=' icon-']{font-family: 'icomoon';font-weight: normal;font-style: normal;font-variant: normal;line-height: 1;text-transform: none;speak: none;
    /* Better Font Rendering =========== */
    -webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;}
.icon-spinner:before{content: '\e600';}
.icon-cancel-circle:before{content: '\e604';}
.icon-cross:before{content: '\e601';}
.icon-arrow-left:before{content: '\e602';}
.icon-arrow-right:before{content: '\e603';}

/* ############ Start of responsive gallery CSS ############ */

div.rthumbnail{/* style for thumbsnail DIVs that appear initially on the page */
    display: inline-block;margin: 0;padding: 0;}
div.rthumbnail div.rcaption{display: none;}
div.responsivegallery{position: fixed;z-index: 1000;top: 0;right: 0;bottom: 0;left: 0;display: none;/* style for responsive gallery UI */
    width: 100%;height: 100%;}
div.responsivegallery:before{position: absolute;z-index: -1;top: 0;left: 0;display: block;width: 100%;height: 100%;/* gallery overlay */
    content: '';cursor: zoom-out;opacity: .8;background: black;}
div.responsivegallery div.galleryinner{position: absolute;top: 0;left: 0;width: 100%;height: 100%;margin: auto;text-align: center;vertical-align: middle;white-space: nowrap;}
div.responsivegallery div.galleryinner:before{display: inline-block;height: 100%;/* technique to vertical align elements */
    content: '';vertical-align: middle;}
div.responsivegallery div.figurearea{position: relative;z-index: 1000;display: inline-block;max-width: 100%;vertical-align: middle;}
div.responsivegallery div.figurearea.isvideo{width: 90%;}

/* video container CSS */

.jkvideocontainer *{-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;width: 100%;}
.jkvideowrapper{position: relative;
    /* 16:9 ratio. See https://css-tricks.com/NetMag/FluidWidthVideo/Article-FluidWidthVideo.php */
    height: 0;padding-bottom: 56.25%;}
.jkvideowrapper iframe{position: absolute;z-index: 10;top: 0;left: 0;width: 100%;height: 100%;}

/* figure CSS */

div.responsivegallery figure{display: block;margin: 0;padding: 0;-webkit-transition: opacity .5s;-moz-transition: opacity .5s;transition: opacity .5s;opacity: 0;box-shadow: 0 0 15px rgba(0, 0, 0, .6);}
div.responsivegallery figure img{line-height: 0;display: block;width: 100%;max-width: 100%;height: auto;-webkit-user-select: none;-moz-user-select: none;user-select: none;border: 0;-khtml-user-select: none;}

/* Caption CSS */

div.responsivegallery div.figurearea .thecaption{font-size: 1.1em;position: absolute;bottom: 0;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;width: 100%;padding: 5px;text-align: left;white-space: normal;}
div.responsivegallery div.figurearea.isvideo .thecaption{position: relative;}
div.responsivegallery div.figurearea .thecaption:before{position: absolute;top: 0;left: 0;display: block;width: 100%;height: 100%;/* caption overlay */
    content: '';opacity: .8;background: white;}
div.responsivegallery div.figurearea .thecaption div.captioninner{position: relative;overflow: hidden;padding: 3px;color: black;}
div.responsivegallery div.figurearea .thecaption div.captioninner span.counter{font-size: .9em;font-weight: bold;line-height: 100%;line-height: 40px;display: block;float: right;width: 40px;height: 100%;height: 40px;text-align: center;color: white;border-radius: 50%;background: #2d2d2d;box-shadow: 0 0 3px gray;}
div.responsivegallery div.close{font-size: 35px;position: absolute;z-index: 1000;top: 10px;right: 10px;width: 55px;height: 55px;padding: 5px;cursor: pointer;-webkit-transition: background .3s;-moz-transition: background .3s;transition: background .3s;color: white;border-radius: 55px;background: black;box-shadow: 0 0 5px rgba(0, 0, 0, .6);opacity: 1;    filter: alpha(opacity=100);}
div.responsivegallery div.close:hover{background: darkred;}
div.responsivegallery div.close span{line-height: 55px;}
div.responsivegallery div.leftnav,div.responsivegallery div.rightnav{font-size: 50px;line-height: 55px;position: absolute;z-index: 1000;top: 50%;left: 5px;width: 50px;height: 50px;margin-top: -25px;cursor: pointer;text-align: center;color: black;border-radius: 50px;background: white;}
div.responsivegallery div.rightnav{right: 5px;left: auto;}
div.responsivegallery div.loadingdiv,div.responsivegallery div.errordiv{position: absolute;z-index: 1000;top: 50%;left: 50%;display: none;width: 100px;height: 100px;margin-top: -50px;margin-left: -50px;text-align: center;opacity: .6;border-radius: 10px;background: black;}
div.responsivegallery div.loadingdiv span,div.responsivegallery div.errordiv span{font-size: 3em;line-height: 90px;vertical-align: middle;color: red;}
div.responsivegallery div.loadingdiv span{font-size: 3.5em;display: inline-block;/* rotating loading DIV */
    -webkit-animation: rotate 2s linear infinite;animation: rotate 2s linear infinite;color: white;}
@-webkit-keyframes rotate{0%{-webkit-transform: rotate(0deg);}
    100%{-webkit-transform: rotate(360deg);}}
@keyframes rotate{0%{transform: rotate(0deg);}
    100%{transform: rotate(360deg);}}
div.responsivegallery div.leftnav:hover,div.responsivegallery div.rightnav:hover{color: black;background: white;}
@media screen and (max-width: 480px){/* CSS when screen width is 480px or less */
    div.responsivegallery div.leftnav,div.responsivegallery div.rightnav{font-size: 40px;line-height: 45px;width: 40px;height: 40px;margin-top: -20px;text-align: center;color: black;border-radius: 40px;}}
