/* Add here all your css styles (customizations) */
/*sticky footer*/
#arrow{
    color:#fff;
    position:relative;
    z-index: 1;
    background-color: #222;
    height: 40px;
}
#arrow:after{
    content:"";
    position:absolute;
    height:0;
    width:0;
    left:100%;
    top:0;
    border:20px solid transparent;
    border-left: 20px dotted #222;
    border-style: solid;
}
.sticky {height: 40px;}
.sticky .row p {margin-top: 12px; color: #fff;}
.upgrade {background-color: #328904; height: 40px;}
.upgrade>p {text-align: center; margin-left: 10px;}

/*others*/
.cell-background {background-color: #f9f9f9;}
.background-red {background-color: #f00;}
.height-34 {height: 34px;}
.height-65 {height: 65px;}
.updatePeriod td {vertical-align: middle !important;}
.margin-tb-0 {margin-top: 0 !important; margin-bottom: 0px !important;}
.padding-tb-5 {padding-top: 5px !important; padding-bottom: 5px !important;}
#sms-timeline .form-control {height: auto;}
#gps .table>tbody>tr>td {padding: 6px; border-top: transparent;}
.tab-v1 .nav.nav-tabs {    background: #ffffff;
                           border-bottom: 1px solid #D9D9D9;
                           border-width: 1px 0;
                           font-size: 12px;
                           padding-bottom: 1px;}

.custom-nav{
    text-align: center;
}
.custom-nav li{
    /*    padding-top: 6px;
        padding-bottom: 5px;*/
}


.custom-nav a {
    margin-right: 0px !important;
    color: #838082;
    padding: 10px 20px !important;
    border-right: 1px solid #EFEFEF !important;

}
.custom-nav li:last-child a{
    border:none !important;
}


.hor_1 li {display: inline-block; margin-right: 10px; font-weight: bold;}
.hor_1 li:hover {cursor: pointer; color: #000;}
.childName {text-align: center; font-size: 22px; color: #333;}
.log-h4 {font-size: 15px; line-height: 22px; margin-bottom: 0px; font-style: normal; font-weight: 600; font-family: 'Trebuchet MS', sans-serif; color: #034A68;}
.features-h3 {font-family: 'Trebuchet MS', sans-serif; color: #034A68; font-size: 20px;}
.p-block {text-align: center; padding: 10px 0 10px;}
.header .navbar-nav > li > a {text-transform: none; font-weight: bold; font-family: "Trebuchet MS", Helvetica, sans-serif; color: #0E2B4A; padding: 9px 25px 9px 15px;}
.content-sm {padding-top: 20px; padding-bottom: 20px;}
.si {float: left; padding-right: 10px;}
.si-h3 {font-size: 17px; padding-bottom: 0; padding-left: 0; color: #21406B; font-family: "Century Gothic",Geneva,Arial,Helvetica,sans-serif; font-style: italic;}
.tab-h4 {font-weight: bold; font-size: 17px; padding-bottom: 0; padding-left: 0; color: #21406B; font-family: "Century Gothic",Geneva,Arial,Helvetica,sans-serif;}
.title-box-how {padding: 0px; border-bottom: 0px;}
.tab4-h4 {color:#00447F; font-size:15px; font-weight: bold;}


/*COMMON CLASSES*/
/*.h1 {font-size: 22px; font-style: normal; font-weight: 600; line-height: 0; margin-bottom: 52px; color: #034A68; font-family: 'Trebuchet MS', sans-serif;}*/
.wh-auto {width: auto !important; height: auto !important;}
/*width*/
.width-full {width: 100%;}


/*MARGIN & PADDING*/
.margin-left-0 {margin-left: 0px;}

.margin-top-20 {margin-top: 20px !important;}
.p-0{padding:0px;}
.padding-right-4 {padding-right: 4px;}
.padding-right-10 {padding-right: 10px;}
.padding-top-10 {padding-top: 10px;}
.p-t-10{padding-top: 10px;}


/*==NEW SCREENS==*/
@media (max-width: 400px) {
    #reportrange span{display: none;}
    #reportrange {padding: 5px 10px !important;}

}
.timeline-v2 {
    padding: 0;
    list-style: none;
    position: relative;
}
.timeline-v2 > li {
    position: relative;
}
.timeline-v2 > li .cbp_tmicon {
    left: auto;
    float: right;
    position: relative;
    margin: -55px 5px 0 0px;
}
.timeline-v2 > li .cbp_tmicon {
    top: 22px;

    width: 10px;
    height: 10px;


    box-shadow: 0 0 0 4px #f3f3f3;
    -webkit-font-smoothing: antialiased;
}
.timeline-v2 > li .cbp_tmtime {
    width: 100%;
    position: relative;
    padding: 0 0 20px 0;
}
.equal-height-column {
    height: auto !important;
}
.timeline-v2 > li .cbp_tmtime span:first-child {
    color: #999;
    font-size: 14px;
    line-height: 0.9;
}
.timeline-v2 > li .cbp_tmtime span {
    text-align: left;
}
.timeline-v2 > li .cbp_tmtime span {
    top: 9px;
    display: block;
    text-align: right;
    position: relative;
}
.timeline-v2 > li .cbp_tmtime span {
    text-align: left;
}
.timeline-v2 > li .cbp_tmlabel {
    padding: 1em;
    font-weight: 400;
    margin: 0 0 30px 0;
}
.timeline-v2 > li  .cbp_tmlabel:first-child {
    background: red;
}
.timeline-v2 > li .cbp_tmlabel:not(:first-child)::after {
    left: 20px;
    top: -20px;
    right: auto;
    border-bottom-color: #f3f3f3;

    border-right-color: transparent;
}
.custom_cbp_tmlabel{
    padding: 1em;
    font-weight: 400;
    margin: 0 0 30px 0;
    color: #fff;
    padding: 10px 12px 20px;
    background: #f3f3f3;
    line-height: 1.4;
    clear: both;
    position: relative;


}
.timeline-v2 > li .cbp_tmlabel:first-of-type::after {
    left: 20px;
    top: -20px;
    right: auto;

    border-bottom-color: red;
    border-right-color: transparent;
}


.timeline-v2:before {
    /* top: 0; */
    /* bottom: 0; */
    /* left: 22%; */
    width: 0px; 
    content: '';
    background: #fff;
    position: absolute;
    /* margin-left: -14px; */
}
.timeline-body hr{
    margin: 10px 4px;
}
#sel-device{
    width: 140px;
    background: #154AAA;
    color: white;
    border: 1px solid white;
}
#sel-device:focus,#sel-device:active,#sel-device:visited,#sel-device:hover{
    outline: white;
    border: 1px solid white;
}
.tab-v1 .nav-tabs > .active > a, .tab-v1 .nav-tabs > .active > a:hover, .tab-v1 .nav-tabs > .active > a:focus {
    background: whitesmoke;
    color: #154aaa;
}
.tab-v1 .nav-tabs > li > a:hover {
    background: white;
    color: #838082;
}
/*==END NEW SCREENS==*/


#overview .panel-default,#gps .panel-default{
    border: none;
    -webkit-box-shadow: 0 0px 0px rgba(0,0,0,.05);
}


.alert-info {
    color: #3E4946;
    background-color: #F3F8FC;
    border-color: #F3F8FC;
}
.inmplayer-trigger{
    z-index: 100 !important;
}
.inmplayer-launcher-topic{
    z-index: 2 !important;
}
.custom-badge-device{
    cursor: pointer;
}
.custom-badge-device span{
    right: 10px;margin-top: -5px;position: absolute;
}

.widget-box-overlay {
    background-color: rgba(0, 0, 0, 0.3);
    bottom: -1px;
    left: -1px;
    min-height: 100%;
    position: absolute;
    right: -1px;
    text-align: center;
    top: -1px;
    z-index: 999;
}
.widget-box-overlay > .loading-icon {
    left: 0;
    position: relative;
    right: 0;
    text-align: center;
    top: 20%;
}
.white {
    color: #fff;
}
.alert,.header-messages{    box-shadow: 0px 0px 4px 3px #c1c1c1;font-size: 14px;}
.font-18{
    font-size: 18px;
}
.rules-h5{
    font-weight: bold; color: #386a8b;
}
.rules-h4{
    border-bottom: 1px solid #f1f1ef;padding-bottom: 5px;    color: #386a8b;
}
#saveSettings.disabled{
        color: rgba(0,0,0,.26);
}
.message-span{
    padding-right:5px
}
.tab-pane.active .tag-box{
    cursor: pointer;
}
.alert{margin: 5px;}
.panel-default{overflow: hidden;}
.navbar-fixed-bottom.sticky{ display: none;}
.z-index { z-index: 999; }
.delete-selected-logs{
    color:#c9302c;cursor: pointer;
}
.delete-pictures-logs{
    position: relative;
    top: 5px;
}
.title-name span{
    display: block;
    margin-left: 60px;
    font-weight: normal;
}