/* CSS
================================================== */ 

*
{
    outline: 0;
}

html,body
{
    top: auto;
}

.mr{
    margin-right: 5px;
}

/* ONLY ON PHONE */
@media (max-width: 400px) {
    #footPage{
        color: black;
        position: relative;
    }
    .edit-desc, .edit{
        width: 100%;
    }
    .edit-input{
        width: 100%;
    }
}

/* ONLY ON BIG SCREEN */
@media (min-width: 599px) {
    #footPage {
        background-image: url('../img/foot5b.png'); 
        background-repeat: repeat-x; 
        padding-top: 20px;
        bottom: 0;
        left: 0;
        right: 0;
        color: white;
        position: relative;
        height: 200px;
    }
    .calcul-nav{
        position: fixed;
    }
    .calcul-tab{
        margin-left: 120px;
    }
    .edit-desc{
        width: 50%;
    }
    .edit-input{
        width: 65%;
    }
    .editor{
        margin-left: 100px;
    }
    .disconnect-menu{
        margin-top: 18px!important;
    }
}

/*
* Test sur tablette paysage (1024 x 768)
* Affichage du logo InvestPorc
*/
@media (min-width: 10240px) and (max-width: 1280px) {
    #iconIndex{
        display: none;
    }
    
    #masterCarousel{
        display: none;
    }
}

@media (max-width: 800px){
    #masterCarousel{
        display: none;
    }
}

@media (min-width: 980px) { 
    body{
        top: auto;
        margin-top: 100px;
    }
}

#panelConnexion{
    margin-top: 25px;
}

#wrap{
    min-height: 100%;
    height: auto !important;
    height: 100%;
    margin: 0 auto -200px; /* the bottom margin is the negative value of the footer's height */
}

.push {
    height: 200px; /* .push must be the same height as .footer */
}

#layoutIndex{
    width: 700px; 
    height: 416px;
    -moz-box-shadow: 5px 5px 5px #888;
    -webkit-box-shadow: 5px 5px 5px #888;
    box-shadow: 5px 5px 5px #888;
}

#layoutCreation{
    width: 320px;
    margin-top: 25px;
    margin-right: 25px;
    padding-left: 15px;
    padding-right: 10px;
    background-color: rgba(255,255,255,0.95);
    border: 1px solid #275524;
    -webkit-border-radius: 9px;
     -moz-border-radius: 9px;
          border-radius: 9px;
}

#mailErreur404{
    color: #b94a48;
}

#mailErreur404:hover{
    color: #c09853;
}

#map{
    -webkit-border-radius: 6px;
     -moz-border-radius: 6px;
          border-radius: 6px;
}

#informationContact{
  background-color: #e5e5e5;
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#f2f2f2), to(#e5e5e5));
  background-image: -webkit-linear-gradient(top, #f2f2f2, #e5e5e5);
  background-image: -o-linear-gradient(top, #f2f2f2, #e5e5e5);
  background-image: linear-gradient(to bottom, #f2f2f2, #e5e5e5);
  background-image: -moz-linear-gradient(top, #f2f2f2, #e5e5e5);
  background-repeat: repeat-x;
  border-color: #e5e5e5 #e5e5e5 #bfbfbf;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  filter: progid:dximagetransform.microsoft.gradient(startColorstr='#fff2f2f2', endColorstr='#ffe5e5e5', GradientType=0);
  -webkit-border-radius: 6px;
     -moz-border-radius: 6px;
          border-radius: 6px;
  padding-left: 15px;
  padding-right: 15px;
  width: 240px;
  border: #6f6f6f ridge thin;
}

#calculContrat{
  background-color: #e5e5e5;
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#f2f2f2), to(#e5e5e5));
  background-image: -webkit-linear-gradient(top, #f2f2f2, #e5e5e5);
  background-image: -o-linear-gradient(top, #f2f2f2, #e5e5e5);
  background-image: linear-gradient(to bottom, #f2f2f2, #e5e5e5);
  background-image: -moz-linear-gradient(top, #f2f2f2, #e5e5e5);
  background-repeat: repeat-x;
  border-color: #e5e5e5 #e5e5e5 #bfbfbf;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  filter: progid:dximagetransform.microsoft.gradient(startColorstr='#fff2f2f2', endColorstr='#ffe5e5e5', GradientType=0);
  -webkit-border-radius: 6px;
     -moz-border-radius: 6px;
          border-radius: 6px;
  padding-left: 15px;
  padding-right: 15px;
  border: #6f6f6f ridge thin;
}

.coin-slider { overflow: hidden; position: relative; }

.cs-buttons { font-size: 0px; padding-top: 10px; }
.cs-buttons a { margin-left: 5px; height: 10px; width: 10px; float: left; border: 1px solid #B8C4CF; color: #B8C4CF; text-indent: -1000px; }
.cs-active { background-color: #B8C4CF; color: #FFFFFF; }

.cs-title { width: 230px; padding: 10px; background-color: #000000; color: #FFFFFF; }

.cs-prev, 
.cs-next { background-color: #000000; color: #FFFFFF; padding: 0px 10px; }

#contactform .input{
    width: 280px;
}

#contactform #message{
    width: 280px; 
    max-width: 500px; 
    min-height: 150px; 
    min-width: 100px; 
    max-height: 500px;
}

#modifNom, #modifEmail, #modifMotDePasse{
    background-color: #e5e5e5;
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#f2f2f2), to(#e5e5e5));
    background-image: -webkit-linear-gradient(top, #f2f2f2, #e5e5e5);
    background-image: -o-linear-gradient(top, #f2f2f2, #e5e5e5);
    background-image: linear-gradient(to bottom, #f2f2f2, #e5e5e5);
    background-image: -moz-linear-gradient(top, #f2f2f2, #e5e5e5);
    background-repeat: repeat-x;
    border-color: #e5e5e5 #e5e5e5 #bfbfbf;
    border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
    filter: progid:dximagetransform.microsoft.gradient(startColorstr='#fff2f2f2', endColorstr='#ffe5e5e5', GradientType=0);
    -webkit-border-radius: 6px;
     -moz-border-radius: 6px;
          border-radius: 6px;
    padding-bottom: 15px;
    margin-bottom: 0px;
}

#infoCompte{
    padding-top: 35px;
}

#imgCompte{
    background-image: url('../img/cochonJournalMethode.png'); 
    background-repeat: no-repeat; 
    width: 200px;
    height: 213px;
}

#footText{
    padding-top: 40px;
}

#mailSite{
    color: rgb(143, 186, 30);
}

#mailSite:hover{
    color: rgb(241, 199, 33);
}

.error{
    border: 1px solid #b94a48 !important;
}

.success{
    border: 1px solid #468847 !important;
}

caption{ margin:10px 0 0 5px; padding:10px; text-align:left; background-color: red;}

th{ background-color:#7BC624; padding:2px; border:1px solid #ccc; }

/*====================================================
	- classes des filtres
	- éditer les classes ci-dessous pour changer le
	style des <input> et du bouton "go" <a>
=====================================================*/
.flt{ 
	background-color:#f4f4f4;
	margin:0; width:100%;
}
.flt_s{
	background-color:#f4f4f4; 
	margin:0; width:90%;
}

.table > thead > tr > .active,
.table > tbody > tr > .active,
.table > tfoot > tr > .active,
.table > thead > .active > td,
.table > tbody > .active > td,
.table > tfoot > .active > td,
.table > thead > .active > th,
.table > tbody > .active > th,
.table > tfoot > .active > th {
    background-color: #f5f5f5;
}

.table-hover > tbody > tr > .active:hover,
.table-hover > tbody > .active:hover > td,
.table-hover > tbody > .active:hover > th {
    background-color: #e8e8e8;
}

/*********
 */
@media (min-width: 599px) {
    .ml-10{
        margin-left: 10px;
    }
    .ml-20{
        margin-left: 20px;
    }
    .flex-md{
        display: flex;
    }
}

.flex{
    display: flex;
}


.justify-content-start{
    justify-content: flex-start;
}
.justify-content-between{
    justify-content: space-between;
}
.align-item-center{
    align-items: center;
}

.decoration-no{
    text-decoration: none!important;
    color: black!important;
}

.chart{
}

.map{
    margin-left: 0!important;
}

.mt-1{
    margin-top: 1rem;
}

.ml-1{
    margin-left: 1rem;
}

.mb-2{
    margin-bottom: 2rem;
}

.input-lg{
    width: 50%;
}

.submit{
    width: 50%!important;
}

.connection-from{
    padding: 15px 10px 10px;
    background-color: rgb(228, 228, 228);
    width: 26rem;
    height: 15rem;
    margin: auto;
    align-items: center;
    border-radius: 10px;
}

.center-screen{
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    min-height: 70vh;
}

.font-bold{
    font-weight: bold;
}

.flex-column{
    flex-direction: column;
}

.flex-row{
    flex-direction: row;
}

#form-modif-var{
    border: 1px solid #939393;
    padding: 10px 5px 5px;
    border-radius: 5px;
    flex-wrap: wrap;
}