/* Fonts */
        @font-face {
            font-family: 'OpenSansLight';
            src: url('en_fonts/OpenSans-Light-webfont.eot');
            src: url('en_fonts/OpenSans-Light-webfont.eot?#iefix') format('embedded-opentype'),
                 url('en_fonts/OpenSans-Light-webfont.woff') format('woff'),
                 url('en_fonts/OpenSans-Light-webfont.ttf') format('truetype'),
                 url('en_fonts/OpenSans-Light-webfont.svg#OpenSansLight') format('svg');
            font-weight: normal;
            font-style: normal;

        }

        @font-face {
            font-family: 'OpenSansLightItalic';
            src: url('en_fonts/OpenSans-LightItalic-webfont.eot');
            src: url('en_fonts/OpenSans-LightItalic-webfont.eot?#iefix') format('embedded-opentype'),
                 url('en_fonts/OpenSans-LightItalic-webfont.woff') format('woff'),
                 url('en_fonts/OpenSans-LightItalic-webfont.ttf') format('truetype'),
                 url('en_fonts/OpenSans-LightItalic-webfont.svg#OpenSansLightItalic') format('svg');
            font-weight: normal;
            font-style: normal;

        }

        @font-face {
            font-family: 'OpenSansRegular';
            src: url('en_fonts/OpenSans-Regular-webfont.eot');
            src: url('en_fonts/OpenSans-Regular-webfont.eot?#iefix') format('embedded-opentype'),
                 url('en_fonts/OpenSans-Regular-webfont.svg#OpenSansRegular') format('svg');
            font-weight: normal;
            font-style: normal;

        }

        @font-face {
            font-family: 'OpenSansItalic';
            src: url('en_fonts/OpenSans-Italic-webfont.eot');
            src: url('en_fonts/OpenSans-Italic-webfont.eot?#iefix') format('embedded-opentype'),
                 url('en_fonts/OpenSans-Italic-webfont.woff') format('woff'),
                 url('en_fonts/OpenSans-Italic-webfont.ttf') format('truetype'),
                 url('en_fonts/OpenSans-Italic-webfont.svg#OpenSansItalic') format('svg');
            font-weight: normal;
            font-style: normal;

        }

        @font-face {
            font-family: 'OpenSansSemibold';
            src: url('en_fonts/OpenSans-Semibold-webfont.eot');
            src: url('en_fonts/OpenSans-Semibold-webfont.eot?#iefix') format('embedded-opentype'),
                 url('en_fonts/OpenSans-Semibold-webfont.svg#OpenSansSemibold') format('svg');
            font-weight: normal;
            font-style: normal;

        }

        @font-face {
            font-family: 'OpenSansSemiboldItalic';
            src: url('en_fonts/OpenSans-SemiboldItalic-webfont.eot');
            src: url('en_fonts/OpenSans-SemiboldItalic-webfont.eot?#iefix') format('embedded-opentype'),
                 url('en_fonts/OpenSans-SemiboldItalic-webfont.woff') format('woff'),
                 url('en_fonts/OpenSans-SemiboldItalic-webfont.ttf') format('truetype'),
                 url('en_fonts/OpenSans-SemiboldItalic-webfont.svg#OpenSansSemiboldItalic') format('svg');
            font-weight: normal;
            font-style: normal;

        }

        @font-face {
            font-family: 'OpenSansBold';
            src: url('en_fonts/OpenSans-Bold-webfont.eot');
            src: url('en_fonts/OpenSans-Bold-webfont.eot?#iefix') format('embedded-opentype'),
                 url('en_fonts/OpenSans-Bold-webfont.woff') format('woff'),
                 url('en_fonts/OpenSans-Bold-webfont.ttf') format('truetype'),
                 url('en_fonts/OpenSans-Bold-webfont.svg#OpenSansBold') format('svg');
            font-weight: normal;
            font-style: normal;

        }

        @font-face {
            font-family: 'OpenSansBoldItalic';
            src: url('en_fonts/OpenSans-BoldItalic-webfont.eot');
            src: url('en_fonts/OpenSans-BoldItalic-webfont.eot?#iefix') format('embedded-opentype'),
                 url('en_fonts/OpenSans-BoldItalic-webfont.woff') format('woff'),
                 url('en_fonts/OpenSans-BoldItalic-webfont.ttf') format('truetype'),
                 url('en_fonts/OpenSans-BoldItalic-webfont.svg#OpenSansBoldItalic') format('svg');
            font-weight: normal;
            font-style: normal;

        }

        @font-face {
            font-family: 'OpenSansExtrabold';
            src: url('en_fonts/OpenSans-ExtraBold-webfont.eot');
            src: url('en_fonts/OpenSans-ExtraBold-webfont.eot?#iefix') format('embedded-opentype'),
                 url('en_fonts/OpenSans-ExtraBold-webfont.woff') format('woff'),
                 url('en_fonts/OpenSans-ExtraBold-webfont.ttf') format('truetype'),
                 url('en_fonts/OpenSans-ExtraBold-webfont.svg#OpenSansExtrabold') format('svg');
            font-weight: normal;
            font-style: normal;

        }

        @font-face {
            font-family: 'OpenSansExtraboldItalic';
            src: url('en_fonts/OpenSans-ExtraBoldItalic-webfont.eot');
            src: url('en_fonts/OpenSans-ExtraBoldItalic-webfont.eot?#iefix') format('embedded-opentype'),
                 url('en_fonts/OpenSans-ExtraBoldItalic-webfont.woff') format('woff'),
                 url('en_fonts/OpenSans-ExtraBoldItalic-webfont.ttf') format('truetype'),
                 url('en_fonts/OpenSans-ExtraBoldItalic-webfont.svg#OpenSansExtraboldItalic') format('svg');
            font-weight: normal;
            font-style: normal;

        }


        @font-face {
            font-family: 'OpenSansCondensedLight';
            src: url('en_fonts/OpenSans-CondLight-webfont.eot');
            src: url('en_fonts/OpenSans-CondLight-webfont.eot?#iefix') format('embedded-opentype'),
                 url('en_fonts/OpenSans-CondLight-webfont.woff') format('woff'),
                 url('en_fonts/OpenSans-CondLight-webfont.ttf') format('truetype'),
                 url('en_fonts/OpenSans-CondLight-webfont.svg#OpenSansCondensedLight') format('svg');
            font-weight: normal;
            font-style: normal;

        }

        @font-face {
            font-family: 'OpenSansCondensedLightItalic';
            src: url('en_fonts/OpenSans-CondLightItalic-webfont.eot');
            src: url('en_fonts/OpenSans-CondLightItalic-webfont.eot?#iefix') format('embedded-opentype'),
                 url('en_fonts/OpenSans-CondLightItalic-webfont.woff') format('woff'),
                 url('en_fonts/OpenSans-CondLightItalic-webfont.ttf') format('truetype'),
                 url('en_fonts/OpenSans-CondLightItalic-webfont.svg#OpenSansCondensedLightItalic') format('svg');
            font-weight: normal;
            font-style: normal;

        }

        @font-face {
            font-family: 'OpenSansCondensedBold';
            src: url('en_fonts/OpenSans-CondBold-webfont.eot');
            src: url('en_fonts/OpenSans-CondBold-webfont.eot?#iefix') format('embedded-opentype'),
                 url('en_fonts/OpenSans-CondBold-webfont.woff') format('woff'),
                 url('en_fonts/OpenSans-CondBold-webfont.ttf') format('truetype'),
                 url('en_fonts/OpenSans-CondBold-webfont.svg#OpenSansCondensedBold') format('svg');
            font-weight: normal;
            font-style: normal;
        }


        /* Spark 2.0 Styles */

        html, body {
            font-family: 'OpenSansRegular', 'Arial' !important;
        }

        *, *:before, *:after {
            -moz-box-sizing: border-box;
            -webkit-box-sizing: border-box;
            box-sizing: border-box;
        }

        .locationPin {
            z-index: 100001;
        }
        .locationPin img {
            width: 24px;
        }

        .locationPinH {
            z-index: 100001;
        }
        .locationPinH img {
            width: 24px;
        }

        .locationRange {
            z-index: 100000;
        }
    
        /* Center fix */
        .outer-center {
            float: right;
            right: 50%;
            position: relative;
        }
        .inner-center {
            float: right;
            right: -50%;
            position: relative;
        }
        .clear {
            clear: both;
        }

        /* info bar */
        .info-bar {
            position: absolute;
            top: 10px;
            left: 10px;
            padding: 5px;

            border-radius: 3px;
            background-color: #1f1f1f;

            color: #efefef;
        } 
        
            .info-bar .closest-strike-label {
                font-size:11px;
                min-width:160px;
            }
            .info-bar .closest-strike-disatnce-container {
                font-family: "OpenSansSemibold", 'Arial' !important;
                margin-top:5px;
                font-size: 20px;
            }
                .info-bar .closest-strike-disatnce-container .closest-strike-dot {
                    width: 12px;
                }
                .info-bar .closest-strike-disatnce-container .closest-strike-distance {
                    font-family: "OpenSansSemibold", 'Arial' !important;
                    margin-right: 5px;
                }
            .info-bar .safety-message {
                margin-top: 5px;
                font-size: 13px;
            }


        /*zoom options */
        .zoom-bar {
            position: absolute; 
            font-size: 14px;
            display:none;
            margin-top: 2px;
        }
        .zoom-container{
            background-color:#F0F0F0;
        }
        .zoom-container .zoom-option
        {
            padding: 10px;
            text-align: center;
            cursor:pointer;
            background-color:#1F1F1F;
            color:#ffffff;

            border-bottom: 1px solid #262626;
        }
        .zoom-container .zoom-option:hover
          {
             background: #242424;
          }
        /* action bar */
        .action-bar {
            position: absolute;
            bottom: 10px;
            box-sizing: border-box;

            width: 100%;
        }
            .action-bar .button-container {
            
            }
            .action-bar .action-button {
                float: left;
                padding: 7px;
                width: 50px;
                height: 50px;
                padding: 12px;

                background: #1f1f1f;
                color: #fff;

                border-right: 1px solid #262626;

                cursor: pointer;
                text-align:center;
            }
                .action-bar .action-button.timer {
                    padding-top: 17px;
                    font-family: "OpenSansSemibold", 'Arial' !important;
                }
                .action-bar .action-button:hover {
                    background: #242424;
                }
               
                 
                .action-bar .action-button.first {
                    border-top-left-radius: 3px;
                    border-bottom-left-radius: 3px;
                }
                .action-bar .action-button.last {
                    border-top-right-radius: 3px;
                    border-bottom-right-radius: 3px;

                    border-right: none;
                }
                .action-bar .action-button img {
                    max-width: 25px;
                    max-height: 25px;
                }
                .about-panel {
                    position: absolute;
                    top: 0;
                    left: 0;
                    right: 0;
                    bottom: 0;
                    padding: 10px;

                    background: #fff;

                    display: none;
                    z-index:1000;
                }
            .about-panel .close-button {
                position: absolute;
                top: 5px;
                right: 5px;
                width: 30px;
                height: 30px;
                padding: 7px;

                background-color: #1f1f1f;

                cursor: pointer;
            }
                .about-panel .close-button img {
                    width: 15px;
                }
            .about-panel .title {
                font-size: 22px;
            }
            .about-panel .text-panel {
                font-size: 12px;
                margin-top: 15px;
                padding: 10px 0;
                line-height: 15px;
                border-top: 1px solid #bcbcbc;
                border-bottom: 1px solid #bcbcbc; 
                overflow-y: auto;
                position:absolute;
                bottom:70px;
                top:40px;
            }
            .about-panel .action-panel {
                margin-top: 10px; overflow: auto;position:absolute;bottom:10px;
            }

 


            
        /* http://meyerweb.com/eric/tools/css/reset/ 
           v2.0 | 20110126
           License: none (public domain)
        */

        html, body, div, span, applet, object, iframe,
        h1, h2, h3, h4, h5, h6, p, blockquote, pre,
        a, abbr, acronym, address, big, cite, code,
        del, dfn, em, img, ins, kbd, q, s, samp,
        small, strike, strong, sub, sup, tt, var,
        b, u, i, center,
        dl, dt, dd, ol, ul, li,
        fieldset, form, label, legend,
        table, caption, tbody, tfoot, thead, tr, th, td,
        article, aside, canvas, details, embed,
        figure, figcaption, footer, header, hgroup,
        menu, nav, output, ruby, section, summary,
        time, mark, audio, video {
            margin: 0;
            padding: 0;
            border: 0;
            font-size: 100%;
            font: inherit;
            vertical-align: baseline;
        }
        /* HTML5 display-role reset for older browsers */
        article, aside, details, figcaption, figure,
        footer, header, hgroup, menu, nav, section {
            display: block;
        }

        body {
            line-height: 1;
            background-color: #020202;
            padding: 0;
            margin: 0;
            font-family: Arial,Helvetica,sans-serif;
            overflow-x: hidden;
        }

        ol, ul {
            list-style: none;
        }

        blockquote, q {
            quotes: none;
        }

            blockquote:before, blockquote:after,
            q:before, q:after {
                caption-side content: '';
                content: none;
            }

        table {
            border-collapse: collapse;
            border-spacing: 0;
        }
   

        
        html body {
            width: 100%;
            height: 100%;
            background-color: #020202;
            overflow: hidden;
            font-family: "Helvetica Neue",HelveticaNeue,"Helvetica-Neue",Helvetica,"BBAlpha Sans",sans-serif;
            font-weight: normal;
        }

        .fifty {
            width: 49.9%;
        }

        .left {
            float: left;
        }

        .right {
            float: right;
        }

        .brown {
            background-color: brown;
        }

        .yellow {
            background-color: yellow;
        }

        .green {
            background-color: green;
        }

        .lightgreenradial {
            background-color: #006828;
        }

        .lightgreenradialex {
           background-image1:url(images/SparkDuracell.png);
           background-size: 100% 100%; background-repeat:no-repeat;
        }

        .lightgreenradial1 {
            background: #006828; /* Old browsers */
            background: -moz-radial-gradient(center, ellipse cover, #00822C 0%, #7db9e8 100%); /* FF3.6+ */
            background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,#1e5799), color-stop(50%,#2989d8), color-stop(51%,#207cca), color-stop(100%,#7db9e8)); /* Chrome,Safari4+ */
            background: -webkit-radial-gradient(center, ellipse cover, #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%); /* Chrome10+,Safari5.1+ */
            background: -o-radial-gradient(center, ellipse cover, #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%); /* Opera 12+ */
            background: -ms-radial-gradient(center, ellipse cover, #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%); /* IE10+ */
            background: radial-gradient(ellipse at center, #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%); /* W3C */
            filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00822C', endColorstr='#004B23',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
        }

        .blue {
            background-color: blue;
        }

        .orange {
            background-color: orange;
        }

        .red {
            background-color: red;
        }

        .fullhigh {
            height: 100%;
        }

        .fullhigh1 {
            height: 100%;
        }

        .fullwidth {
            width: 100%;
        }

        .relative {
            position: relative;
        }

        .absolute {
            position: absolute;
        }

        .lefttop {
            top: 0;
            left: 0;
        }

        .displaynone {
            display: none;
        }

        /*CARD LAYOUT*/
        .cardlayout {
            position1: relative;
        }

        div.cardlayout div.cardlayoutitem {
            width: 100%;
            height: 100%;
            position1: absolute;
            left: 0px;
            top: 0px;
            display: none;
        }

        div.cardlayout div.cardlayoutitemselected {
            display: block;
        }

        .reset_table,
        .reset_table table tr,
        .reset_table tr td,
        .reset_table table tbody,
        .reset_table table thead,
        .reset_table table tfoot,
        .reset_table table tr th,
        .reset_table table tfoot tr tf {
            margin: 0;
            padding: 0;
            background: none;
            border: none;
            border-collapse: collapse;
            border-spacing: 0;
            background-image: none;
        }


        
        .pobuttonsmall {
            padding: 10px 10px 10px 10px;
            background-color: #5DAC5B;
            background: #006e2e; /* Old browsers */
            background: -moz-linear-gradient(top, #4082F0 0%, #3162D1 50%, #3162D1 100%); /* FF3.6+ */
            background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#4082F0), color-stop(100%,#3162D1)); /* Chrome,Safari4+ */
            background: -webkit-linear-gradient(top, #4082F0 0%,##3162D1 50%,#3162D1 100%); /* Chrome10+,Safari5.1+ */
            background: -o-linear-gradient(top, #4082F0 0%,##3162D1 50%,#3162D1 100%); /* Opera 11.10+ */
            background: -ms-linear-gradient(top, #4082F0 0%,#3162D1 50%,#3162D1 100%); /* IE10+ */
            background: linear-gradient(to bottom, #4082F0 0%,#3162D1 50%,#3162D1 100%); /* W3C */
            filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4082F0', endColorstr='#3162D1',GradientType=0 ); /* IE6-9 */
            color: white;
            font-size: 12px;
            font-weight: bold;
            margin: 10px auto 10px 10px;
            -webkit-border-radius: 10px;
            -moz-border-radius: 10px;
            border-radius: 10px;
            text-align: center;
        }

        #popupcont {
            background-color: #020202;
            display: none;
            position: absolute;
            left: 0px;
            right: 0px;
            top: 0px;
            bottom: 0px;
            z-index: 20000;
            width: 100%;
            height: 100%;
        }

        #msgboxcont {
            background-color: #1f1f1f;
            display: none;
            position: absolute;
            left: 50%;
            top: 50%;
            z-index: 30000;
            width: 80%;
            max-width:300px;
            margin-left:-150px;
            margin-top:-100px;
             
        }

        .content {
            background-color:#E8EAEF;color:#575757
        }

            .content p {
                margin: 1em;
                line-height: 1.1em;
            }

        .fixedtop {
            position: fixed;
            top: 0px;
        }

        .popuptitle {
            color: white;
            margin: 15px;
            font-weight: 600;
        }

        .popupfooter {
            color: white;
        }

        .fixedbottom {
            position: fixed;
            bottom: 0px;
            color: white;
            background-color: #020202;
            width: 100%;
        }
         .absolutebottom50 {
            position: absolute;
            bottom: 0px;
            color: white;
            background-color: #020202;
            width: 100%;
        }

         

        .height80 {
            height: 80%;
        }

        .verticalscroll {
            overflow-y: scroll;
        }

        .noscroll {
            position: fixed!important;
        }
           .sparkinfopanel {
            opacity: 1;
            background-color:white; 
        }
         .sparkinfopaneld10 {
            opacity: 0.9;
            background-color: #343434;
            color: white;
        }

    .leaflet-control.leaflet-control-attribution.leaflet-compact-attribution {
        position: relative;
        bottom: 53px;
    }
#infopanel, .flip {
    font-size: 12px;
    font-weight: 800;
    margin: 5px;
    position: absolute;
    right: 5px;
    bottom: 43px;
    width: 340px;
    background: white;
    padding: 3px;
}
#infopanel {
    display: none;
}
#infobutton, .flip {
    display: none;
}
.infobutton {
    text-decoration: none;
    font-size: 16px;
    font-weight: 800;
    border: 4px solid #f5f5f5;
    margin: 5px;
    border-radius: 13px 13px 13px 13px;
    position: absolute;
    right: 5px;
    bottom: 33px;
    color: white;
    cursor: hand;
    height: 20px;
    width: 20px;
    padding-top: 0px;
    padding-right: 4px;
    font-weight: 700;
}
.backbutton {
    font-size: 12px;
    cursor: hand;
    font-weight: 800;
    border: 1px solid #202020;
    margin: 15px;
    border-radius: 13px 13px 13px 13px;
    padding-left: 6px;
    padding-right: 6px;
}