/**
Status Display items
 */
div.blade-status div.blade-display div.display-wrapper img{
    margin-left:10%;
    margin-bottom:15px;
    height:300px;
}

div.blade-status div.blade-display div.display-wrapper .status-icon{

    color:green;

    position: absolute;
    top:0.2em;
    left:0.15em;

    stroke: white;
    stroke-width: 20;

}
div.blade-status div.blade-display div.display-wrapper .status-icon.problem{

    color:#e70000;

}


div.blade-status h2, div.blade-status h3{

}
div.blade-status div.status-display .row{
    padding-top:6px;
}
div.blade-status div.status-display .row > div{
    padding-bottom:6px;
}

div.blade-status .modal-body h1{
    font-size:30px !important;
    margin-bottom:0px;

}

div.blade-status div.status-display h3{
    font-size: 11px;
}

div.blade-status div.status-display h2{
    vertical-align: bottom;
    font-size:16px;
}

div.blade-status div.status-display a {
    color:inherit;
}

div.blade-status{
    margin-top:20px;
}

div.blade-status .problem {
    color:#e70000;
}



/**
Modal styling
 */
.modal-content{
}

.modal-content, .modal-content *{
    transition: 100ms;
}

.modal-body{
    padding-top:19px;
    padding-right:15px;
    padding-bottom:30px;


}

.modal h5{
    font-weight:normal;
    text-transform: uppercase;
    font-size:11px;
    margin-top:11px;
    margin-bottom:0px;
}
.modal h1{
    margin-top:3px;
    font-size:30px;
    line-height:30px;
    margin-bottom:11px;
}



@media (max-width: 370px) {
    .modal-content h1{
        font-size:27px;
    }

}

@media (max-width: 359px) {
    .modal-content h1{
        font-size:25px;
    }

}



/**
Styling for within the troubleshooter carousel.
 */

#carousel-generic{
    padding-bottom:20px;
    margin:0 auto;
    margin-top:18px;
}

.carousel-indicators{
    position:relative;
    bottom:-10px;
}


#carousel-generic .carousel-inner .item{
    height:100%;
}

#carousel-generic .item-inset {
    text-align:center;
    max-height:65vh;
    overflow-y:auto;
}


#carousel-generic .item-inset h2{

    text-align:center;
    vertical-align: center;
    width:90%;
    font-size:16px;
    margin:auto;
    margin-top:11px;
}

#carousel-generic .item-inset p{

    vertical-align: center;
    padding-top:5px;
    margin:auto;
    display:block;

    top: 466px;
    left: 23px;
    width: 276px;
    text-align: center;
    font: 12px Century Gothic;
    letter-spacing: 0;
    color: #3E3B38;
    opacity: 1;
}

@media (min-width: 767px) {
    #carousel-generic .item-inset p{
        font-size:13px;
    }

}




#carousel-generic .item-inset img{
    border-radius: 50%;
    object-fit: cover;
    height:215px;
    width:215px;
    margin:auto;
}
#carousel-generic .item-inset.video .play-icon{
    color:white;
    position:absolute;
    text-align:center;
    vertical-align: center;
    height:0;
    width:0;
    top:70px;
    left:50%;
}
#carousel-generic .item-inset.video .play-icon svg{
    display:block;
    margin-left:-43.25px;
}

#carousel-generic .item-inset iframe{

    flex: max-content;
    width:80%;
    margin-left:10%;
    min-height:300px;
}

#carousel-generic .item-inset a.btn{
    border-radius:10px;
    margin-top:8px;
    height:auto;
    width:auto;

}



#carousel-generic .carousel-control.right,
#carousel-generic .carousel-control.left{
    font-size:0.5em;
    height:100%;
    background-image:none;
    width:10%;
    margin-left:-15px;
    color:lightgrey;

}


#carousel-generic .carousel-control.left svg,
#carousel-generic .carousel-control.right svg{
    display:block;
    position:relative;
    top:90px;
    font-size:30px;
    width:100%;
    margin:0 auto;
    color:grey;
}

#carousel-generic .carousel-control.left{
    left:0;
}

#carousel-generic .carousel-control.right{
    right:-15px;
}

.modal button.close{
    position:fixed;
    color:black;
    top:3px;
    right: 11px;
    text-shadow:none;
}


/**
Cookie Consent styling
 */

body.site-action-cookie-gate div.content{
    margin-top:-80px;
}

body.site-action-cookie-gate div.content img#striped-logo{
    margin:0 auto;
}


.cookie-consent{
    color:white;
    background-color:#212120;
}

.cookie-consent .btn-default{
    color:white;
    background-color:#212120;
    border-color:white;

}

/**
Age gate styling
 */
body.site-action-age-gate div.content{

}

body.site-action-age-gate div.content img#striped-logo{
    margin:0 auto;
    margin-top:-110px;
    max-width:140px;
}






/**
Signup Process styling
 */
@media (max-width:768px) {
    .center-mobile {
        text-align: center;
        padding: 0 10px 10px 10px;
    }

    .center-mobile h1:first-of-type {
        margin-top: 10px;
    }
}







/**
Settings menu styling.
 */

body.settings-action-index h5{
    vertical-align: text-top;
    margin-top:0px;
    margin-bottom:0px;
}

body.settings-action-index .main-window .row{
    padding-top:0px;
    margin-top:10px;
    margin-bottom:15px;

}


body.settings-action-index .main-window .row.option h5{
    margin:0px;
    color:rgb(68,68,68);
    font-weight:bold;
    line-height:18px;
    font-size:16px;
}

body.settings-action-index .main-window .row.option a svg{
    width:80%;
    color:rgb(0,134,68);
}


body.settings-action-index .main-window .row.option svg.fa-lock{
    width:80%;
    color:grey;
}

body.settings-action-index .main-window .row.option div.edit-icon{
    padding-right:0px;
    width:12%;
}


/**
Blade Support Stylings
 */

.blade-support h1{
    padding-top:0px;
    margin-top:0px;
    font-size:30px;
    line-height:26px;
}

.blade-support h6{
    margin-top:10px;
}

.blade-support video{
    margin-top:5px;
}

/**
Blade History Styling
 */

body.blade-action-history .dropdown{
    height:35px;
}

body.blade-action-history .dropdown button.dropdown-toggle{
    border:none;
    background-color:white;
}

body.blade-action-history .dropdown h1{
    margin:0px;
}

body.blade-action-history .dropdown h1 span{
    font-weight:normal;
}

body.blade-action-history .dropdown .btn-default.active.focus,
body.blade-action-history .dropdown .btn-default.active:focus,
body.blade-action-history .dropdown .btn-default.active:hover,
body.blade-action-history .dropdown .btn-default:active.focus,
body.blade-action-history .dropdown .btn-default:active:focus,
body.blade-action-history .dropdown .btn-default:active:hover,
body.blade-action-history .dropdown .open > .btn-default.dropdown-toggle.focus,
body.blade-action-history .dropdown .open > .btn-default.dropdown-toggle:focus,
body.blade-action-history .dropdown .open > .btn-default.dropdown-toggle:hover{
    background-color: white !important;
    border:none !important;
}


body.blade-action-history div.history-pan{

    width:100%;
    z-index:99999999999;
}

body.blade-action-history div.history-pan a{
    display: block;
    position:absolute;
    color:lightgrey;
    top:150px;
}

body.blade-action-history div.history-pan a.pan-backward{

    left:-20px;
}


body.blade-action-history div.history-pan a.pan-forward{

    right:-20px;
}

body.blade-action-history .time-nav a h5{
    color:grey;
}

body.blade-action-history .time-nav a.active h5{
    color:rgb(0,134,68);
}

body.site-action-age-gate h1{
    margin-top:50px;
    font-size:45px;
    text-transform: capitalize;
}

.blade-scan-qr input{
    font-weight:bold;
    color:black;
}

.blade-scan-qr input::placeholder{
    font-weight:normal;
}