/* -------------------------------------------------- 
   Icon
-------------------------------------------------- */

/* Navigation Icons */
.nav-a-customers img { background-position: -363px -86px; }
.nav-a-customers.active img { background-position: -405px -86px; }
.nav-a-device img { background-position: 0px -117px; }
.nav-a-device.active img { background-position: -42px -117px; }
.nav-a-version img { background-position: 0px -159px; }
.nav-a-version.active img { background-position: -42px -159px; }
.nav-a-brandkey img { background-position: 0px -285px; }
.nav-a-brandkey.active img { background-position: -42px -285px; }

/* Content Icons */
.versions-small-icon { background-position: -234px -345px; }
.details-icon { background-position: -155px -241px; }
.tl-icon { background-position: -155px -174px; }
.versions-small-icon { background-position: -234px -345px; }
.downloads-icon { background-position: -155px -208px; }
.details-icon { background-position: -155px -241px; }
.sig-icon { background-position: -155px -106px; }
.devices-icon { background-position: -155px -140px; }
.downloads-icon { background-position: -155px -208px; }
.check-icon { background-position: -155px -275px; }

.edit-small-icon { background-position: -235px -321px; opacity: 0.7; /* background-position: -235px -294px; */}
.edit-small-icon:hover { opacity: 1;}
.edit-small { position: relative; top: 4px; }
.watch-link:hover { background-position: -296px -34px; }
.watch-link { background-position: -330px 0px; }

.edit-link:hover { background-position: -296px 0px; }
.edit-link { background-position: -263px -34px; }

.close-link:hover { background-position: -262px -170px; }
.close-link { background-position: -262px -137px; }
.l-icon.close { position: absolute; right: 15px; top: 0px; }

img.OK  { /* background: #30a030; */ background-position: -239px -127px; }
img.WARNING{ /* background:#f0f030; */ background-position: -239px -104px; }
img.FAIL { /* background:#f03030; */ background-position: -239px -83px; }

/* -------------------------------------------------- 
   Customize List
-------------------------------------------------- */

.l_v2 .lhead_v2 span {
    color: #fff;
    background-color: #009EE0;
}
.lrank2_v2 li {
    box-shadow: inset 4px 0 0 #009EE0;
    -webkit-transition: all 0.15s linear;
    -moz-transition: all 0.15s linear;
    -o-transition: all 0.15s linear;
    transition: all 0.15s linear;
}
.lrank2_v2 li.grey {
    box-shadow: inset 4px 0 0 #f2f2f2;
    -webkit-transition: all 0.15s linear;
    -moz-transition: all 0.15s linear;
    -o-transition: all 0.15s linear;
    transition: all 0.15s linear;
}
.lrank2_v2 li .l-load-content:hover, .lrank2_v2 li .l-load-content.l-marker {
    background-color: #f2f2f2;
}
.lrank3_v2 li {
    box-shadow: inset 4px 0 0 #f6f6f6;
}

.lrank2_v2 li .db {
    padding-left: 80px;
}
.ltime_v2 {
    position: absolute;
    top: 11px;
    left: 0;
    padding-left: 10px;
}

.bulk-snippet {
    padding: 3px 15px;
}

#small-dialog {
    background: white;
    padding: 20px 30px;
    text-align: left;
    max-width: 400px;
    margin: 40px auto;
    position: relative;
}

.l-settings li {
    box-shadow: none;
}
.lrank3_v2.l-edit {
    margin-top: 2px;
}

.l-props li {
    box-shadow: none;
}

.sw-type {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
}
.sw-type .big, .sw-type .small {
    display: inline-block;
    width: 100%;
    text-align: center;
}
.sw-type .big {
    font-family: 'Open Sans', 'Helvetica', Helvetica, Arial, sans-serif;
    font-weight: 300;
    font-size: 44px;
    line-height: normal;
}
.sw-type .small {
    font-size: 14px;
    line-height: normal;
}

.group .lhead_v2 span {
    min-width: 70px;
}

.group.DEV .lhead_v2 span {
    
}

@media only screen and (max-width: 767px) { 
    .l-load-content, .lrank3_v2.l-edit li {
        padding-right: 55px;
    }
    .l-load-content .l-icon {
        position: absolute;
        right: 15px;
        bottom: 0px;
        width: 33px !important
    }
    .lrank3_v2.l-edit {
        margin-left: 15px;
    }
}

/* -------------------------------------------------- 
   Bulk Update
-------------------------------------------------- */

.abort-bulkedit-link {
    max-width: 37%;
    line-height: 20px;
    direction: initial;
}

/* -------------------------------------------------- 
   Encrypt
-------------------------------------------------- */

.txt-enc {
    display: inline-block;
    direction: initial;
    font-family: 'Helvetica', Helvetica, Arial, sans-serif;
    font-weight: normal;
    font-size: 14px;
    color: #999;
}

@media only screen and (max-width: 767px) { 
    .btn-enc {
        margin-left: 0px !important;
        margin-bottom: 20px !important;
    }
}

/* -------------------------------------------------- 
   Select Inputs
-------------------------------------------------- */
.l-selector .selector {
    padding: 2px 6px 0px 6px;
    height: 22px;
    background-position: right -531px !important;
    margin-bottom: 0px;
    line-height: 22px;
}

.l-selector select {
    height: 22px !important;
}
.l-selector .selector span {
    color: #666 !important;
}


/* -------------------------------------------------- 
   Timeline Elm
-------------------------------------------------- */

.tl_v2 { list-style-type: none; }
.tl_v2 li {
    position: relative;
    top: 0;
    left: 0; 
    background: transparent url('../img/tl-bg.jpg') center center repeat-y;
} 

.tl-line {
    position: relative;
    top: 0px;
    left: 0px;
}

.tl-time_v2 .tl-time-format {
    font-family: 'Open Sans', 'Helvetica', Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 16px;
    color: #999;
}

.tl-data {
    padding: 0 20px 20px 20px !important;
    font-family: 'Open Sans', 'Helvetica', Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 16px;
    color: #666;
    background-color: #f2f2f2;
    word-wrap: break-word;
    -webkit-border-radius: 2px !important;
    -moz-border-radius: 2px !important;
    -ms-border-radius: 2px !important;
    -o-border-radius: 2px !important;
    border-radius: 2px !important; 
}

.tl-data span {
    font-family: 'Helvetica', Helvetica, Arial, sans-serif;
    font-weight: normal;
    font-size: 14px;
    display: block;
    margin-top: 18px;
    text-decoration: none !important;
    color: #999;
}

.tl-arrow-left_v2 {
    position: absolute;
    top: 0px;
    left: -1px;
    width: 19px;
    height: 36px;
    z-index: 1;
}
.tl-arrow-right_v2 {
    position: absolute;
    top: 0px;
    right: -2px;
    width: 19px;
    height: 36px;
    z-index: 1;
}

.tl-more {
    position: absolute;
    left: 50%;        
    margin-left: -15px;
    width: 30px;
    height: 28px;
    overflow: hidden;
    background-position: -155px 4px;
    z-index: 0;
}
.tl-more.top { top: 0px; }
.tl-more.bottom { bottom: 0px; }
.tl-end {
    position: absolute;
    left: 50%;
    bottom: 0px;
    margin-left: -40px;
    width: 80px;
    height: 2px;
    overflow: hidden;
    background-color: #f2f2f2;
}

.tl-edit-icon_v2 { background-position: -41px -456px; }
.tl-plus-icon_v2 { background-position: 0px -456px; }
.tl-arrow-left_v2 { background-position: -89px -204px; }
.tl-arrow-right_v2 { background-position: -89px -242px; }

/*
.tl_v2 li:hover .tl-arrow-left_v2 { background-position: -89px -278px; }
.tl_v2 li:hover .tl-arrow-right_v2 { background-position: -89px -315px; }
.tl_v2 li:hover .tl-plus-icon_v2 { background-position: -154px -26px; }
.tl_v2 li:hover .tl-edit-icon_v2 { background-position: -154px -66px; }
.tl_v2 li:hover .tl-time-format { color: #333; }
.tl_v2 li:hover .tl-data {
    -webkit-box-shadow: inset 1px 1px 0px #009EE0, inset -1px -1px 0px #009EE0;
    -moz-box-shadow: inset 1px 1px 0px #009EE0, inset -1px -1px 0px #009EE0; 
    -o-box-shadow: inset 1px 1px 0px #009EE0, inset -1px -1px 0px #009EE0;
    -ms-box-shadow: inset 1px 1px 0px #009EE0, inset -1px -1px 0px #009EE0;
    box-shadow: inset 1px 1px 0px #009EE0, inset -1px -1px 0px #009EE0;        
}
.tl_v2 li:hover .tl-time-format { color: #333; }
*/

@media only screen and (max-width: 767px) { 
    .tl_v2 li { background: transparent url('../img/tl-bg.jpg') 13px center repeat-y; }
    .tl-line { position: absolute; text-align: left !important; }
    .tl-time_v2 {
        padding: 20px 20px 0px 20px !important;
        margin-left: 70px;
        text-align: left  !important;
        background-color: #f2f2f2;
        border-top-right-radius: 2px !important;
        -moz-border-radius-topright: 2px !important;	
        -webkit-border-top-right-radius: 2px !important;
    }
    .tl-data { 
        margin-left: 70px;
        border-top-right-radius: 0px !important;
        -moz-border-radius-topright: 0px !important;	
        -webkit-border-top-right-radius: 0px !important;

        border-top-left-radius: 0px !important;
        -moz-border-radius-topleft: 0px !important;	
        -webkit-border-top-left-radius: 0px !important;
    }
    .tl-arrow-left_v2 { background-position: -89px -242px; }
    .tl-line { width: 69px !important; }
    .tl-arrow-left_v2 { left: 52px; }
    .tl-more { left: 10px; margin-left: 0px; }
    .tl-end {
        left: 1px;
        margin-left: 0px;
        width: 40px;
    }
    .tl-line.top { top: 30px; }
    
    /*
    .tl_v2 li:hover .tl-arrow-left_v2 { background-position: -89px -315px; }
    .tl_v2 li:hover .tl-data {
        -webkit-box-shadow: inset 1px 0px 0px #009EE0, inset -1px -1px 0px #009EE0;
        -moz-box-shadow: inset 1px 0px 0px #009EE0, inset -1px -1px 0px #009EE0;
        -o-box-shadow: inset 1px 0px 0px #009EE0, inset -1px -1px 0px #009EE0;
        -ms-box-shadow: inset 1px 0px 0px #009EE0, inset -1px -1px 0px #009EE0;
        box-shadow: inset 1px 0px 0px #009EE0, inset -1px -1px 0px #009EE0;        
    }
    .tl_v2 li:hover .tl-time_v2 {
        -webkit-box-shadow: inset 1px 1px 0px #009EE0, inset -1px 0px 0px #009EE0;
        -moz-box-shadow: inset 1px 1px 0px #009EE0, inset -1px 0px 0px #009EE0;
        -o-box-shadow: inset 1px 1px 0px #009EE0, inset -1px 0px 0px #009EE0;
        -ms-box-shadow: inset 1px 1px 0px #009EE0, inset -1px 0px 0px #009EE0;
        box-shadow: inset 1px 1px 0px #009EE0, inset -1px 0px 0px #009EE0;  

    }
    */
}

/* -------------------------------------------------- 
   Version/ device show legend
-------------------------------------------------- */
.legend {
    font-family: 'Open Sans', 'Times', 'Helvetica', Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 16px;
    color: #999;
} 

/* -------------------------------------------------- 
   Error Label
-------------------------------------------------- */

.p-error {
    background-color: #c60f13 !important;
}
.p-error p {
    padding-top: 6px;
    padding-left: 53px;
    color: #fff;
}

/* -------------------------------------------------- 
   Table
-------------------------------------------------- */

.result-icons { padding: 0px 9px; }
.result-icons img { margin: 9px 0px 5px 0px !important; }

@media only screen and (max-width: 767px) {
    .result-icons img { margin: 0px 0px -3px 0px !important; }
}


/* -------------------------------------------------- 
   Table
-------------------------------------------------- */

pre {
    padding: 20px 40px;
    color: #666;
    background-color: #f2f2f2;
    overflow-x: auto;
    border: #ccc 1px solid;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    -ms-border-radius: 2px;
    -o-border-radius: 2px;
    border-radius: 2px;
}

/* -------------------------------------------------- 
   MODAL BOX FOR MORE CONTENT
    *  Description: views/elements/scripts/js-standard.php 
    *  Status: Development
-------------------------------------------------- 

html, body {
    height: 100%;
}

.no-scroll-desktop {
    position:fixed;
    overflow-y:hidden;
    width: 100%;
}
.no-scroll-desktop .page {
    overflow-y:hidden;
    padding-right: 16px; IE
    padding-right: 15px; Opera
}

.no-scroll-desktop #my-modal-content-overlay {
    position: absolute;
    z-index: 100;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.45);
    overflow-y: scroll;
}

.no-scroll-desktop #my-modal-content {
    margin: 0 auto;
    width: 30%;
    background-color: #fff;
}

.no-scroll-mobile, .no-scroll-mobile .page {
    overflow:hidden;
}

.no-scroll-mobile #my-modal-content-overlay {
    position: relative;
    z-index: 100;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.6);
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;
}

.no-scroll-mobile {
    position:fixed;
    width: 100%;
    z-index: 100;
}
.no-scroll-mobile #my-modal-content-overlay {
    position:fixed;
    width: 100%;
    z-index: 101;
}

#my-modal-content {
    margin: 0 auto;
    width: 30%;
    background-color: #fff;
}
*/