html, body {
    margin: 0;
    height: 100%;
    font-size: 16px;
    font-family: "Sintony", Sans-serif;
    
}
body.hide-overflow {
    overflow: hidden;
}
.logo img {height: 70px;margin-top: 2.5px;}
.head-title{    padding-top: 0px;font-size: 2.1vw;
        font-family:Josefin Sans light;
        line-height: 70px;}
.head-menu  label.btn:after{
     content:attr(data-title);
         position: absolute;
    bottom: -12px;
    left: 0px;
    width: 100%;
    font-size: 14px;
}
      #btconference img {}
.head-menu  label{position:relative;min-width: 95px}
label[for='btconference']{
    padding-top: 0px;
    margin-top: -14px;
}
.head-menu label:hover {
  color:#d9ae5f;
}
.head-menu label:active {
  color:#d9ae5f;
}
#footer { 
        /* border-top: 1px solid rgba(255, 215,0, 0.1); */
   /* box-shadow: 0px -9px 13px -1px rgba(25,25,0,0.95 );*/
    
    height: 25px;
    width: 100%;
    background-color: rgb(45,45,45);
    background-color: rgba(45,45,45,1);
    position: fixed;
    bottom: 0;
    left: 0;
    z-index: 1000;
    color: rgb(255,215,0);
    color: rgba(255,215,0,0.25);
    font-size: 0.9em;
    line-height: 25px;
    padding-left:2%;
}


.mybody{ background-color: #F1F1F1;
	 /*  background: url('../img/fond.jpg') top;*/
        height:100%;
        width:100%;
        background-attachment:fixed;
        bottom:75px;
	       
        }

.mybody>.panel-body {background-color: #F1F1F1}
   .logo svg{width: 100%; height: 100px;fill:white}
    .logo svg g{fill:white;}
    ._headpict h1 {text-align:center;color:white;margin-left: auto;font-family: garamond;font-weight: 300;
    background-color: rgba(127,127,127,0.5);margin-top: 0px;}
    .headpict img 
        {margin: 10px;
             box-shadow: 0px 0px 5px 3px #222,0px 0px 1px 3px #fff,0px 0px 4px 6px black,0px 0px 15px 9px gray
        }
    .right_head {color:white;font-family: garamond;padding: 10px;text-align: center;margin-top: 10px;}
    .right_head h5 {font-weight: 300;font-size: 16pt;text-transform: capitalize;}
    .right_head span {font-size: 8pt;color:white}
    .degr 
        {
            background: linear-gradient(to bottom, rgba(255,255,255,0.25) 0%,rgba(208,208,208,0.35) 4%,rgba(89,89,89,0.25) 100%);); 
            background: -moz-linear-gradient(bottom, rgba(255,255,255,0.25) 0%,rgba(208,208,208,0.35) 4%,rgba(89,89,89,0.25) 100%); /* FF3.6-15 */
            background: -webkit-linear-gradient(bottom, rgba(255,255,255,0.25) 0%,rgba(208,208,208,0.35) 4%,rgba(89,89,89,0.25) 100%); /* Chrome10-25,Safari5.1-6 */
            
            border:solid 1px #222;
            border-top:none;
            border-bottom:none;
            color:white!important;
            filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6848484', endColorstr='#00000000',GradientType=0 );/* IE6-9 */
    }
        
    .degr a {color: white!important;}
    .fil_info
        { margin: 15px;
        
        padding: 5px;
        line-height: 3.0em; height: 3.0em;
        
       }
       .fil_info li {font-size: 14pt!important;font-family: avenir-book!important;font-weight: 400;}
    .bt_toggle{box-shadow: 0px 0px 5px 1px white; height: 3.5em;}
    .bt_toggle:hover{box-shadow: 0px 0px 10px 2px #d9ae5f;}
    .nobg{background-color: transparent!important;}
    .nobrd{border:none!important}
   #mainmenu .btn:hover:not(#date),.degr li a:hover 
        {
        border-bottom: 6px solid #d9ae5f;
        }
    .nav-tabs li {
        
    }
    .btn.active 
        { box-shadow: none;
       }
    #mainmenu .active:not(#date) {border-bottom: 6px solid #d9ae5f; box-shadow: none!important;}
    #mainmenu label.btn {border-bottom: 6px solid transparent; box-shadow: none!important;}
    .btn.degr.active{color:white;} 
  #news .new:not(.day):not(.myaccount)  
        {
        min-height: 480px;
        margin-top: 20px;
        background-color: rgb(255,255,255);
       
      /*  box-shadow: 2px 2px 10px 1px #333;*/
        }
    .new p {text-align:justify ;}
    .art-title .the-title:hover,.view_24h5p .art-title:hover,.view_24hcustom .art-title:hover, .view_hcsemaine .art-title:hover{color:#d9ae5f;}
    .degr{font-size: 0.95em!important;}
    .opened{background-color: white;box-shadow: 1px 1px 2px 0px #d9ae5f;padding-bottom: 1%;padding-right: 1%}
    .opened h5{font-family: "Oswald", Sans-serif;font-weight: 700;font-size: 20px;}
    .article{font-family: "Sintony", Sans-serif;font-size: 16px;line-height: 30px;}
    .art-title{line-height: 1.5em;font-family: "Oswald",Sans-serif;font-size: 20px;font-weight:700;}
    .content-art{margin-bottom: 0.5em;}
    .content-art h5{margin-top: 0px;}
    .art-head h4{font-family: avenir-book;font-size:1.1em!important;line-height: 1.5em;}
  /*  .art-head span
        {
        font-family: helvetica;
        font-size:0.80em!important;
        width: 12%;
        background-color: rgba(127,127,127,0.5)!important;
        color:#333
        }*/
    .art-head
        {padding-top: 0px;
        margin-bottom: 10px;
        z-index: 100;
        }
    .pays,.rubrique
        {
        text-align: center;
        font-size: 14px;
        font-family: "Sintony", Sans-serif;
        line-height: 1.5em;
        margin-bottom: 0px;
        }
    .rubrique{font-weight:700!important;}
    .art-left{padding-left: 0px;padding-right: 5px;}
    .art-left p{text-align: center;}
     .mline:before,.mline:after
{
         content: "";
    position: absolute;
    height: 6px;
    border-bottom: 2px solid #737373;
   
    top: 6px;
    width: 30%;
    
    display: block;
} 
      .mline:before{right: 57%;
  margin-right: 15px}
      .mline:after{left: 60%;
  margin-left: 15px;}
  .panel-heading{border: none;}
  @media only screen and (device-width: 768px) {
    .checkbox_pref label, #my24form td .btn-primary{font-size:0.82em!important} 
    #my24form td .btn-primary span {display: none;}
  /* For general iPad layouts */
}
 
@media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:portrait) {
  /* For portrait layouts only */
  
  }  


@media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:landscape) {
  /* For landscape layouts only */
}
  @media screen and (min-width: 760px){
      .header{ background-color: #323232;color: #f1f1f1;}
      .header .title {
     font-family:"Oswald", sans-serif;
    color:white;
    padding-left:5%;
 padding-right:5%;
 font-weight: bold;
    
    
}
  
  }
  .config .nav .active a{
    margin-right: 0px;
   /* background: linear-gradient(to bottom, rgba(255,255,255,0.25) 0%,rgba(208,208,208,0.35) 4%,rgba(89,89,89,0.25) 100%);
    background: -moz-linear-gradient(bottom, rgba(255,255,255,0.25) 0%,rgba(208,208,208,0.35) 4%,rgba(89,89,89,0.25) 100%);
    background: -webkit-linear-gradient(bottom, rgba(255,255,255,0.25) 0%,rgba(208,208,208,0.35) 4%,rgba(89,89,89,0.25) 100%); 
    */
   
    border-bottom: 1px solid #444;
  
    }
  /*.config {background-color:  #010E18!important}*/
  .config .tab-pane.active {border:1px solid white;margin-top: -1px;padding: 5px;border-top: none;border-radius: 3px 3px 3px 3px;}
  .config .well 
        {
        background: linear-gradient(to bottom, rgba(255,255,255,0.25) 0%,rgba(208,208,208,0.35) 4%,rgba(89,89,89,0.25) 100%);
        background: -moz-linear-gradient(bottom, rgba(255,255,255,0.25) 0%,rgba(208,208,208,0.35) 4%,rgba(89,89,89,0.25) 100%); /* FF3.6-15 */
        background: -webkit-linear-gradient(bottom, rgba(255,255,255,0.25) 0%,rgba(208,208,208,0.35) 4%,rgba(89,89,89,0.25) 100%); /* Chrome10-25,Safari5.1-6 */
         
        color:white
        }
  .config {min-height: initial;padding-bottom: 10px;}
  .config .tab-content {
    background: rgba(89,89,89)
    background: rgba(89,89,89,0.25)}
  .degr li a:hover{color:#333!important}
  #mainmenu{padding: 0px;margin-top: 5px;border-bottom:2px solid #d9ae5f}
  #mainmenu img {height: 40px;}
  .dates img{

     left: 50%; 
    position: relative;
    top: -9px;}
  
  #mainmenu .gt.btn-sm {margin-top: 0px;}
      .btn.gt .button__badge {
        background-color: #fa3e3e;
        border-radius: 11px;
        color: white;
        padding: 1px 5px;
        font-size: 8px;
        position: relative;
        top: -11px;
        right: 13px;
        padding-left: 4px;
        padding-right: 4px;
    
    }
  
  
@media (min-width: 768px)  {
    #mainmenu img {
        height: 40px;
        }
    #mainmenu .gt.btn-sm {margin-top: 0px;}
    	.btn.gt .button__badge {
    background-color: #fa3e3e;
    border-radius: 11px;
    color: white;
    padding: 2px 7px;
    font-size: 11px;
    position: relative;
    top: -10px;
    right: 10px;
    padding-left: 7px;
    padding-right: 7px;

    
}
}
#mainmenu .gt.btn-sm {padding:5px}
#mainmenu .gt.btn-sm {padding: 10px 5px 10px 5px;margin-left:3%!important;margin-right:0px!important}
.dates{margin-left: -6%;}
.dates img{
    position: relative;
    left: 50%;
    top:50%}
    
@media (max-width: 768px)  {

}
@media (min-width: 992px) {
  .col-md-11 {
      width: 100%!important;
  }
} 
    
    
   .tg img {height: 48px;}
  #mainmenu label.btn {padding-top: 0px;padding-bottom:0px}
  
  #mentions .modal-content,#cgu .modal-content,#contactUs .modal-content{
      background-color: white!important}
  #mentions button span, #cgu button span,#contactUs button span{color:#333}
  .legalnotice p:first-letter {margin-left:20px}
  .legalnotice li {margin-bottom: 0.5em;}
  .legalnotice p ,#mentions .modal-body li {font-size: 10pt;
    font-family: tahoma;text-align: justify;}
    .legalnotice h5{font-size: 11pt;font-family: tahoma;;
                    text-decoration: underline
    /* background-color: rgb(180,120,0);
    background-color: rgba(255,215,0,0.15);
    background: linear-gradient(to right, rgba(255,215,0,0.3) 0%,rgba(255,215,0,0) 75%);*/
    width: 100%;}
   .legalnotice .bxshad{text-align: center;
    box-shadow: 0px 0px 2px 2px rgba(255,215,0,0.5);
    padding: 9px;
    background-color: rgb(180,120,0);
    background-color: rgba(255,215,0,0.15);}
    /*.view_24h1p .opened .article:first-letter
    {font-size:150%;Border:1px solid silver;padding:5px;padding-bottom:2px;color:white;background-color:#376092;font-family:avenir-book!important}
    
    */
    .view_24h1p .opened .article{Line-height:30px;}
  /*  #my24form table label.degr{padding-left: 2.5%;padding-right:2.5%}*/
    .checkbox_pref label{background-color: #444;}
    .checkbox_pref{padding-left: 1%;padding-right:1%}
   /* #my24form table thead th {border-top: 2px solid  #ddd;}*/
    #my24form table {border:1px solid  #ddd;border-collapse:separate}
    #my24form table {border-radius: 4px;}
    #my24form table  tr th:first-child {border-left:none;}
    #my24form table  tr th:last-child,#my24form table  tr td:last-child  {border-right:none;}
    #my24form table  tr:last-child td,#my24form table  tr:last-child th  {border-bottom:none;}
    
    /** menu */
    #mainmenu .dropdown>button{margin-left:0px}
    .info .panel-body {padding-top:0px}
    #mainmenu .form-group label{margin-right:0px;}
    #date {
        display: inline-block; 
        position: relative;
        top: 15px;
        height: 17px;
        font-size: 10px;
        padding-top: 0px;
        }
     .dates .dropdown-menu{
        background-color: rgba(60,60,60,0.5);
        margin-left: auto;
        margin-top: 16px;
        width: 70%;
        margin-right: auto;
        font-size: 11px;
        min-width: 60%;
        left: 30%;
        }   
    .dates .dropdown-menu li a {padding: 3px 10px;font-size: 12px;}
    
        
    #fake h5{font-size: 0.75em;}
    .content-art.opened .art-title .glyphicon-chevron-down{display:none}
    .content-art:not(.opened) .art-title .glyphicon-chevron-up{display:none}
    .no-forcetouch div { background-color: red; }
    .degr .marquee li a:hover{color:white!important;cursor: pointer;}

    .view_map .new {box-shadow: none!important;}
    
    /* page config */
    .config.new {background-color: transparent!important;box-shadow: none!important;}
    #config .nav-tabs li,#config .nav-tabs li.active {color:white;background-color: #383E42;}
    
    #config .nav-tabs li a{font-size:18px; text-transform:uppercase; color: white;background-color: transparent!important;border:none;padding-top: 5px;padding-bottom: 5px;font-family: "Oswald", Sans-serif;}
    #config .tab-pane.active {border: none;color:#d9ae5f}
    #config .nav-tabs li.active a{border: none;color:#d9ae5f!important}
    #config .nav-tabs { border: none;}
    #config .nav-tabs li{padding-right: 15px;padding-left: 15px;}
    #config .tab-content {
            background-color: #383E42;
            margin-left: -15px;
            padding-left: 10px;
            padding-right: 10px;
            margin-right: 15px;
            padding-top:0px;
            }
    #config .well,#my24form .well {color:#333;background: none;background-color: white!important;}
    .btn-success, .btn-success:hover {
        background-color:#d9ae5f;border-color:#d9ae5f;color:white;font-weight: bold;border-radius: 24px 24px 24px 24px;
        }
    .btn-success.disabled, .btn-success:disabled, .btn-success.disabled:hover,.btn-success:disabled:hover {
        background-color:#d9ae5f;border-color:d9ae5f;color:#333;font-weight: bold;
        
        }
        
        
        
    .btn-success:active ,.btn-success:hover, .btn-success:hover:active ,.btn-success:focus {
            background-color:#d9ae5f!important;
            border-color:d9ae5f;color:#333;
            font-weight: bold;
         
    }
    #mysendconfig table {   margin-left: 40%;    margin-right: 20%;    width: 30%;}
    #mysendconfig table caption {color:#333;text-align: center;}
    #mysendconfig table .c1{}
    #mysendconfig table .c2{width: 20px;}
    #mysendconfig table tr:first-child td {border-top: none;}
    .btn.degr {background:none;color: #999999!important;background-color:white;border-radius: 24px; border:1px solid #999999;}
    .btn.degr.active{background:none;background-color:#d9ae5f;color:white!important;    border: 1px solid #d9ae5f;}
    .btn.degr.hover{background:none;background-color:#d9ae5f;color:white!important;    border: 1px solid #d9ae5f;}
    #my24form {color:#333}
    #my24form table {background-color:white}
    #my24form table  td ,#my24form table th {border:none;border-left: 1px solid #ddd;}
    #my24form table th {text-align: center;}
    #my24h>.col-md-12,#my24form>.col-md-12  {padding: 0px;
        padding-top: 5px;
        margin-bottom: -5px;
        }
    #contactus {padding-top: 15px;}
    #contactus  .well,#mysendconfig .well,#myaccount .well {margin-bottom: 10px;}
    .rubrique-tab {
        border-bottom: 2px solid #d9ae5f;
        text-align: left;
        padding: 0px!important;
        }
    .rubrique-tab span {font-style: normal;
      color: white;
      Background-color: #d9ae5f;
      border-bottom: 0px solid #d9ae5f;
      padding: 3px 20px 7px 20px;
      font-family: "Oswald", Sans-serif;
      line-height: 40px;
      font-size: 20px;
        }
    h4.pays {margin-top: 0px;}
    
    .view_24h5p .art-head,.view_24hcustom .art-head,.view_24hfull .art-head{padding-top:0px}
   /* .view_24h5p  img{    box-shadow: 0px 10px 52px 0px #eee;}*/
    
    
    /* favoris */
    .favoris-container{border:1px solid #333}
    .favoris-button .btn:not(#empty_trash),.folder.btn{background-color: #F1F1F1;border-color: #777;border-radius:7px 7px 0px 2px;color:#333;font-weight: 600;}
    .folder.btn.active {background-color:#d9ae5f ;}
    .folder .badge {background-color: #333;color:white}
    .folder .form-control {padding:5px}
    
    .favoris-button .btn#empty_trash {
 /*   margin-top: -60px;
    margin-right: 30px;*/
    }
    
    .dropzone{    box-shadow: 0px 0px 10px 1px orange inset;}
        
    
  /** search page */      
    #criteria .btn {font-family: helvetica;font-weight: 500;letter-spacing: 1px;}    
    #criteria label {font-family: helvetica;font-weight: 600;}   
    #criteria>.col-md-6:nth-child(1) {padding-left:5px;}
    #criteria>.col-md-6:nth-child(2) {padding-right:5px!important;}
    #criteria>.col-md-6:nth-child(5) {padding-right:5px!important;} 
    #criteria>.col-md-6.form-group {margin-bottom: 0px;}


.modal-center-vertical {text-align: center;}
@media screen and (min-width: 768px) { 
    .guest .header {
    min-width: 1360;
    overflow-x: auto;
    }
  .modal-center-vertical:before {
    display: inline-block;
    vertical-align: middle;
    content: " ";
    height: 100%;
  }
}

.modal-dialog-center-vertical {
  display: inline-block;
  text-align: left;
  vertical-align: middle;
}
    #news.view_config {padding-left: 45px;}
    [for="bthcsemaine"] {width:72px}
    [data-target="#conferences"] img{padding-bottom:5px;height: 53px!important;}
    
    
    .dates img{bottom: 13px;}
    .j_actif {font-size: 12px;}
    
       .todel,.fulldelete{box-shadow:0px 0px 10px 1px orangered inset!important}
       .torestore{box-shadow:0px 0px 10px 1px #5cb85c inset!important}
     .favoris-button .glyphicon {font-size:11px}
     #fav_tabs {    padding-left: 0;}
     .newfolder.form-group{margin-bottom: 0px;}
     .trash_div .btn {
    background-color: #333;color:white;
    border-color: #000;}
      .trash_div .btn .badge{
       background-color:transparent!important;
       color:white!important;
       text-shadow:none;
       font-weight:500;font-size:1em;
     }
           .scrtabs-tab-scroll-arrow,.scrtabs-tab-container ,.scrtabs-tabs-fixed-container {height:4em!important;}
       
       .scrtabs-tab-scroll-arrow span {font-size:4em;}
       .scrtabs-tab-scroll-arrow {width:auto!important}
     .art-head label.custom-checkbox {
         line-height: initial;
             margin-bottom: 0px;
     }
   .art-head label.custom-checkbox .checkmark {   top:0px}
   .view_24h1p .art-head label.custom-checkbox .checkmark,.view_hcsemaine .art-head label.custom-checkbox .checkmark{top:17px}
   
   
 @media (min-width: 768px)  {
    .head-title{    
       padding-top: 0px;font-size: calc(11px + 0.8vw);
    }
    .btn.tg i,.btn.tg span {
        font-size:14px
    }
 .btn.tg img{height:37px}    
  .title{
    padding-top: 1.5em;}
        body.guest{
    background-color: hsla(38, 9%, 88%, 0.25);}
   .guest .title {font-family: "Oswald", Sans-serif;font-weight: 600;font-size: 24px;padding-top:0px;line-height:  70px}     
  .guest #footer  {box-shadow: none; 
    height: 40px;}    
  
  .guest .logo img {    margin-top: 1px!important;}
}
@media only screen 
and (min-device-width : 300px) 
and (max-device-width : 812px) 
{
  

   .head-title{
   padding-top: 0px;
   font-size: 69%;
   }
   #contact_form{
  height: calc(100% - 150px);
    overflow: scroll;
   }
   
.btn.tg i,.btn.tg span {font-size:14px}

.container-fluid .btn.gt,  .container-fluid .btn.tg {
        background-color: #aaa!important;
        color:white;
        border-radius: 24px!important;
        font-size:3vh;
        }

    
   
    .container-fluid .btn.tg {padding: 1vh; width: 86%;text-align: center;}
 
      .container-fluid .col-sm-12 .btn.tg {width: 93%;}
    .container-fluid .sep {height: 2vh;}

.header {
    font-size: 1em;
    height: 75px;
    background-color: #323232;
    position: fixed;
    z-index: 200;
    width: 100%;
}

.header .title {
     font-family:Josefin Sans light;
    color:white;
    padding-left:5%;
 padding-right:5%;
 font-weight: bold;
 font-size: 17px;
    
    
}


.guest .header .title {font-family: "Oswald", Sans-serif;font-weight: 600;line-height: 14px;
    padding-top: 16px;
font-size: 20px}

 .logo img {max-height: 19vh;}
.title{height: 80%;
    padding-top: 3%;
}

body.guest {background-image: url('/img/accueil05-2.jpg');
background-repeat: no-repeat;
    background-position: -200px -36px;
    background-size: auto 100%;

}
.guest #footer {height:50px;box-shadow: none}
.guest #footer span {font-style:italic;color:silver;padding-left: 75px;}

   }
   
   .damier {padding-top:40px;padding-bottom: 50px;}
   .damier img{height: auto;max-width: 100%}
   .damier .no-pad div{padding:0}
   .damier button:hover img ,.damier a:hover img {filter: hue-rotate(183deg) invert(89%) brightness(1.6);}
   .damier button {padding:0;border:none}
   
   /* conseil :hue-rotate(69deg) invert(157%) brightness(1.0);*/
   
   /* head title destop font-size 3em*/
   
   #inscription_ok,#newsletter_ok {background-color:white!important;
    border-color:#ddd!important;
    color:#333!important;
   }
   
   span.biblio_picto {
    float: left;
   
   }
   
   #desabonnement:after {content:'|'}
   label.btn.tg.btn-sm.active::after {
    color: #d9ae5f}
   
   #saveparams{
      background-color: #d9ae5f;
    border-color: #d9ae5f;
    color: white;
    font-weight: bold;
    border-radius:24px;    
       
   }  
   
   .art-left .custom-checkbox:hover:after,.content-art .custom-checkbox:hover:after {
    content: 'Cliquez pour ajouter à la bibilithèque';
    font-size: 0.5em;
    position: absolute;
    width: 163px;
    border: 1px solid silver;
    background-color: rgba(255,255,255,0.85);
    z-index: 10000;
    padding: 10px;
        
   }
   
   .view_24h5p .art-head label.custom-checkbox .checkmark,
   .view_24hcustom .art-head label.custom-checkbox .checkmark,
   .view_24hfull .art-head label.custom-checkbox .checkmark
   {
       top:17px;}
   
  .view_24h5p  .art-head  .opened  label.custom-checkbox .checkmark,
     .view_24hcustom .art-head  .opened  label.custom-checkbox .checkmark,
     .view_24hfull .art-head  .opened  label.custom-checkbox .checkmark
   {
       top:17px;}
   
   
   #list_invites li ,#list_filleuls li {text-align: left;}
   
   
   .view_24h1p .art-left .pays,.view_hcsemaine .art-left .pays,.view_favoris .art-left .pays{padding-top: 6px;font-size:20px;font-weight:700!important;color:#d9ae5f;font-family: "Oswald", Sans-serif;}
     [for='bthcsemaine'] img{padding-left:7px;}
     
     #mysendconfig .checkmark {top:0px;}
     
     #footer a:hover ,#logout span:hover{color:#EEB315}
     
     .head-title {
        display: none!important;
    }
     @media only screen and (min-width: 990px) {
    .head-title {
        display: inline-block!important;
        
    }
    .view_24h1p .art-left{width: 10%}
    
}
.head-menu{min-width:450px;text-align: right ;width: 40%;
  margin-left: 10%;}
.head-menu img {height: 37px}
.head-menu .fa-2x{font-size: 15px}
 .view_24h1p .art-left{min-width: 16px;
  width: 15%;
  padding-bottom: 20px;}