/*Managing item visibility in a Listgroup item*/
.nopadding {
   padding: 0 !important;
   margin: 0 !important;
}

  div.opera.list-group.list-reduced a.list-group-item.inactive{
     display:none;
  }
  div.opera.list-group.list-reduced a.list-group-item.active{
     display:bock !important;
  }

  div.opera.list-group.list-extended a.list-group-item{
     display:bock;
  }

  /*Bar Chart*/
      .bar { fill: steelblue; }

    /*#mapid { height: 560px; width:880px;}*/
        li.dropdown-header{ 
          font-weight: 650;
          color: #6faf9a; 
        }
        .section-relation div{
          border-bottom: 1px #e8d7b5 solid;
          padding: 2px 0px 2px 0px;
        }
        .toto{
            font-size: 3.0 rem ;
            color:#666;
            font-family: "oswald";
            padding: 0px 0px ;
            border: #bbb 0px solid;
        }

        .toto.info{
            background-color: #f9f9d3;
            color: #165879;
        }
        .toto.success{
            background-color: #cce8cc;
            color: #086335;
        }

        .toto.warning{
            background-color: #fdd09b;
            color: #654007;
        }
         .toto.error{
            background-color: #f9dfd3;
            color: #c30f2f;
            
        }   
        .toto.title {
            font-size: 1.85vh !important; /*20px*/
            font-weight: 700;
        }  

        .section-summary{
          background-color: #f9f9d3;
        }
        #mapid { top: 51px; bottom: 5px; }
        .map-sticky {
            position: fixed;
            top: 51px;
            left: 0px;
           /* -webkit-transform: translateY(-50%);
            -ms-transform: translateY(-50%);
            transform: translateY(-50%);*/
        }

        .panel-sticky {
            position: fixed;
            top: 54px;
            bottom : 1.39vh;
            right:1.39vh;
            background-color: #fff;
            padding:0px !important;
            border: 1px solid #aaa;
           /* -webkit-transform: translateY(-50%);
            -ms-transform: translateY(-50%);
            transform: translateY(-50%);*/
        }

        .map-sticky.layout_5_7  {  width : 41vw !important; }
        .panel-sticky.layout_5_7 {  width : 57vw !important; }

        .map-sticky.layout_6_6  {  width : 49vw !important; }
        .panel-sticky.layout_6_6 {  width : 49vw !important; }

        .map-sticky.layout_7_5  {  width : 57vw !important; }
        .panel-sticky.layout_7_5 {  width : 41vw !important; }

        .map-sticky.layout_8_4  {  width : 66vw !important; }
        .panel-sticky.layout_8_4 {  width : 32vw !important; }

        .map-sticky.layout_9_3  {  width : 74vw !important; }
        .panel-sticky.layout_9_3 {  width : 24vw !important; }




        .capturing_cursor{
            cursor: crosshair;
        }
        .query_location_cursor{
            cursor: help;
        }
        .map_cursor_crosshair {
            cursor : crosshair ;
        }

        .map_cursor_defaut {
            cursor : pointer ;
        }
        .map_cursor_grabbing {
            cursor : grabbing ;
        }
     /* capturing_cursor   query_distance_cursor */

        .table-sticky {
            position: fixed;
            bottom: 0.93vh;
            height: 35%;
            left:1.39vh;
            right:1.39vh;
           /* -webkit-transform: translateY(-50%);
            -ms-transform: translateY(-50%);
            transform: translateY(-50%);*/
        }

        .awesome-marker i {
            font-size: 18px;
            margin-top: 8px;
    }


    .pane-header {
        display: flex;
        flex-direction: column;
        justify-content: center;
        top:0px;
        height:3.70vh;
        line-height: 0.93vh;
        width: 100%;
        background-color: #555;
    }

    .pane-subheader {
        display: flex;
        padding: 4px;
        width: 100%;
        background-color: #10a3af;
        color: #fff;
    }
    .pane-subheader b {
        color: #0f155e;
    }
    .pane-header span:first-child{
        font-size: 1.2rem; float: left;
        color:#ddd;
        left:0px;   margin-left:0.5rem;
        text-align: left;
    }
    
    .enveloppe {
        position:absolute;
        width:100%;
        background-image: linear-gradient(#27bf55, #222);
        /*background-color: #27bf55 ;*/
        top:3.70vh;
        bottom:0px;
        overflow-y: auto;
        color:#f9f91a ;
    }
    .enveloppe-light {
        position:absolute;
        width:100%;
        background-color: #f9f9d3 ;
        top:3.70vh;
        bottom:0px;
        overflow-y: auto;
        color:#ead518 ;
    }

    .enveloppe-dark {
        position:absolute;
        width:100%;
        background-color: #222 ;
        top:3.70vh;
        bottom:0px;
        overflow-y: auto;
        color:#ddd ;
    }

    .enveloppe-sticky {
        position: absolute;
        width: 100%;
        background-color: #f9f9d3;
        top: 3.7vh;
        bottom: 0px;
        overflow-y: hidden ;
        color: #ead518;
    }

    #error-box {
        position: absolute;
        width: 40%;
        height: 25%;
        margin-top: 34vh;
        padding: 0px;
        margin-left: 50vh;
        transform: translate(-50%,-50%);
        background-color: #7fc594;
        overflow-y: auto;
        border: 1px #555 solid;
    }

    .close-bttn, #close-details {
        color: #FA5858;
        text-decoration: none;
        font-size: 2rem;
        text-align: right;
        line-height: 1.5rem;
        position: absolute;
        top: 0px;
        right:0px;
        margin: 5px 0.93vh;
        font-size:1.5rem;
 }


.hidden {
    display: none;
}
.leaflet-editbox{
   background-color: #a7dcd9f5;
   padding: 4px 4px !important;
   color: #ddd!important;
   min-width: 300px
    
}
.leaflet-infobox-1{
   background-color: #235855f5 !important;
   padding: 4px 4px !important;
   color: #444!important;
   min-width: 250px
}
.leaflet-infobox-1 .txt-hyp span{
    cursor: help; 
    font-style: italic;
    font-weight: bold;
}

.leaflet-infobox-1 .txt-smll{
   color: #fff!important;
   font-size: 12px;
}
.leaflet-infobox-1 .txt-xsmll{
   color: #10f7b7!important;
   font-size: 11px;
}
.leaflet-infobox-1 .txt-med{
   color: #fff!important;
   font-size: 13px;
}
.leaflet-infobox-1 .txt-big{
   color: #ffe212!important;
   font-size: 0.85 !important; 
   font-weight: bold;
}
.leaflet-infobox-1 .txt-ita{
    font-style: italic;
}

.leaflet-infobox-3{
   background-color: #f5f5f5 !important;
   border-top : solid 1px  #aaa;
   border-bottom : solid 1px  #aaa;

   padding: 4px 4px !important;
   color: #444!important;
}

.leaflet-popup-content {
    margin: 3px 3px !important;
    line-height: 1.4;
}

.badge {
    padding: .25em .4em;
    font-size: 85% !important;
    font-weight: 700;
    border-radius: .55rem !important;
}

.form-enveloppe{

    background-color:#ececec ;
    padding: 0.93vh;
}   
    /*
    .property-table-wrapper {
        position: fixed;
        width: 300pt;
        height: 400pt;
        bottom : 1.39vh;
        left : 1.39vh;
    }*/

.section-relation {
    background-color: #fff;
}


.lds-ellipsis {
  display: inline-block;
  position: relative;
  width: 64px;
  height: 64px;
}
.lds-ellipsis div {
  position: absolute;
  top: 27px;
  width: 11px;
  height: 11px;
  border-radius: 50%;
  background: #fff;
  animation-timing-function: cubic-bezier(0, 1, 1, 0);
}
.lds-ellipsis div:nth-child(1) {
  left: 6px;
  animation: lds-ellipsis1 0.6s infinite;
}
.lds-ellipsis div:nth-child(2) {
  left: 6px;
  animation: lds-ellipsis2 0.6s infinite;
}
.lds-ellipsis div:nth-child(3) {
  left: 26px;
  animation: lds-ellipsis2 0.6s infinite;
}
.lds-ellipsis div:nth-child(4) {
  left: 45px;
  animation: lds-ellipsis3 0.6s infinite;
}
@keyframes lds-ellipsis1 {
  0% {
    transform: scale(0);
  }
  100% {
    transform: scale(1);
  }
}
@keyframes lds-ellipsis3 {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(0);
  }
}
@keyframes lds-ellipsis2 {
  0% {
    transform: translate(0, 0);
  }
  100% {
    transform: translate(19px, 0);
  }
}



/*dtFilter component section

*/
.dt-filter-on, .dt-filter-on a {
    font-weight: bold;
    color: blue;
}

.dropdown-menu {
    font-size: 12px;
}


#pane-03-coord-section{
    position:absolute ;
    bottom: 0px;
}

.leaflet-popup-content-wrapper { 
    border-radius : 0px !important;
}

#main-datatable2 tbody tr {  
  cursor: pointer;
}
table.dataTable  tbody tr{
    cursor : pointer;
}
table.simpleTable tr{
    cursor : pointer;
}

/* set a link disabled : */
a.disabled-link,
a.disabled-link:visited ,
a.disabled-link:active,
a.disabled-link:hover {
    background-color:#d9d9d9 !important;
    color:#aaa !important;
}

/**
 * Class to make a div as a scrollable container */

.header-static {
    display: block;
    position: absolute;
    min-height: 60px;
    top: 25px;
    width: 100%;
    padding-right: 5%;
}

 .scrolling-container {
    display: block;
    position: absolute;
    min-height: 50px;
    top: 65px;
    bottom: 5px;
    overflow-y: auto;
    width: 97%;
    /*overflow-x: scroll;*/
}

.opera-style .form-control{
    height: 30px;
    padding: 3px 6px;
    font-size: 11px;
    line-height: 1.42857143;
    color: #555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #999;
    border-radius: 3px;

}
/* setting for toolbar icon embed in LeaflLet mapObjects */
.opera-style.btn-group-sm>.btn, .btn-sm {
    padding: 1px 2px;
    font-size: 12px;
    line-height: 1.5;
    border-radius: 3px;
}

.fa-stack {
    position: relative;
    display: inline-block;
    width: 2em;
    height: 1.7em;
    line-height: 2em;
    vertical-align: text-top;
}
.fa-1xl {
  font-size: 1.5em;
}
.fa-stack-1xl {
  position: absolute;
  left: 0;
  width: 100%;
  text-align: center;
}
.fa-stack-1xl {
  font-size: 1.5em;
}
.fa-stack-2x {
  font-size: 2em;
}
.opera-style .text-danger {
    color: #f93a27;
}
.opera-style .text-muted {
    color: #333;
}

.opera-style .dataTables_wrapper .dataTables_paginate .paginate_button {

    text-decoration: none !important;
    cursor: pointer;
    color: #d9edf7 !important;
    color: #d9edf7 !important;
    border: 1px solid #777;
    border-radius: 2px;
}
.opera-style .dataTables_wrapper .dataTables_paginate .paginate_button.current {

    color: #444 !important;
    border: 1px solid #777;
}
.opera-style .dataTables_wrapper .dataTables_info {
    color: #fcf8e3;
}


/* STYLES FOR LAYOUT RATIO SELECTION */
.layout-button-frame { 
  display: block; 
  position: relative;
  background-color: #eee;
  width: 180px; height:26px;
  border: solid 1px #eee; 
  padding:2px ;
  margin: 10px;
}
.layout-button-frame .button-wrapper { 
  display: inline-block; 
  border: solid 1px #444; 
  width : 26px;
  height: 12px; 
  margin: 2px;
  cursor: pointer;
}

.layout-button-frame .button-wrapper div { 
  position: static; 
  height : 12px;
  display: inline-block ; 
  float: left;
  margin : 0px
}
.layout-button-frame .clabel {
  position: relative;
  left: 2px; top: -4px;
  color: #eee; 
  text-shadow: 1px 1px 1px black;
  font-size: 9px;
  font-weight: bold;
  font-family: arial;
}
.layout-button-frame .cb  { background-color: #555;}
.layout-button-frame .cw  { background-color: #fff;}
.layout-button-frame .ws0 {  width:  0px; border-style: none;}
.layout-button-frame .w12 {  width: 24px;}
.layout-button-frame .w11 {  width: 22px;}
.layout-button-frame .w10 {  width: 20px;}
.layout-button-frame .w09 {  width: 18px;}
.layout-button-frame .w08 {  width: 16px;}
.layout-button-frame .w07 {  width: 14px;}
.layout-button-frame .w06 {  width: 12px;}
.layout-button-frame .w05 {  width: 10px;}
.layout-button-frame .w04 {  width:  8px;}
.layout-button-frame .w03 {  width:  6px;}
.layout-button-frame .w02 {  width:  4px;}
.layout-button-frame .w01 {  width:  2px;}