input, select, textarea {
    background-color: #a9d0ea;
}


* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    font-family: Verdana;
    font-size: 10pt;
}

.container {
    margin-right: auto;
    margin-left: auto;
    padding-left:15px;
    padding-right:15px;
}

@media screen and (min-width: 320px) {
    .container {
        /*position: absolute;*/
        left: 0%;
        width: 100%;
        height: 100%;
        top: 5%;
        text-align: left;
        /* border: 1px solid gray; */
    }
    
}


@media screen and (min-width: 768px) {
    .container {
        /*position: absolute;*/
        left: 0%;
        width: 550px;
        height: 100%;
        top: 5%;
        text-align: left;
        /* border: 1px solid gray; */
    }
    .col-sz-1, .col-sz-2, .col-sz-3, .col-sz-4, .col-sz-5 .col-sz-6, .col-sz-9 .col-sz-10{
        position: relative;
        
    }
}

@media screen and (min-width: 992px) {
    .container {
        /*position: absolute;*/
        width: 770px;
        height: 100%;
        top: 5%;
        text-align: left;
        /* border: 1px solid gray; */
    }
    .col-sz-1 {
        width: 8.33333333%;
        float: left;
        position: relative;
        
    }
    .col-sz-2 {
        width: 16.66666667%;
        float: left;
        position: relative;
        
    }
    .col-sz-3 {
        width: 25%;
        float: left;
        position: relative;
        
    }
    .col-sz-4 {
        width: 33.33333333%;
        float: left;
        position: relative;
        
    }
    .col-sz-5 {
        width: 41.66666667%;
        float: left;
        position: relative;
        
    }
    .col-sz-6 {
        width: 50%;
        float: left;
        position: relative;
        
    }
    .col-sz-9 {
        width: 75%;
        float: left;
        position: relative;
        
    }
    .col-sz-10 {
        width: 99%;
        float: left;
        position: relative;
        
    }
}

@media screen and (min-width: 1200px) {
    .container {
        /*position: absolute;*/
        width: 1070px;
        height: 100%;
        top: 5%;
        text-align: left;
        /* border: 1px solid gray; */
    }
    .col-sz-1 {
        width: 8.33333333%;
        float: left;
        position: relative;
        
    }
    .col-sz-2 {
        width: 16.66666667%;
        float: left;
        position: relative;
        
    }
    .col-sz-3 {
        width: 25%;
        float: left;
        position: relative;
        
    }
    .col-sz-4 {
        width: 33.33333333%;
        float: left;
        position: relative;
        
    }
    .col-sz-5 {
        width: 41.66666667%;
        float: left;
        position: relative;
        
    }
    .col-sz-6 {
        width: 50%;
        float: left;
        position: relative;
        
    }
    .col-sz-9 {
        width: 75%;
        float: left;
        position: relative;
        
    }
    .col-sz-10 {
        width: 99%;
        float: left;
        position: relative;
        
    }
}

*:before, *:after {
    box-sizing: border-box;
}

.col-sz-1, .col-sz-2, .col-sz-3, .col-sz-4, .col-sz-5, .col-sz-6, .col-sz-9 .col-sz-10{
    min-height: 1px;
    padding-left:15px;
    padding-right:15px;
    position: relative;
}


#logo {
    top: 0px;
    position: relative;
    align: middle;
    width: 100%;
    /*border: 1px solid gray;*/
}

#formulaire {
    padding-top: 20px;
    vertical-align: bottom;
    /*border: 1px solid gray;*/
}

#formulaire label {
    display: block;
}

div {
    display: block;
}

.row:before, .row:after {
    content: " ";
    display: table;
    clear: both;
}

.form-group {
    margin-bottom: 15px;
}

.form-control {
    display: block;
    padding: 5px;
    width: 100%;
}


.submit_btn {
    text-align: right;
}

.rTable{display: table; table-layout: fixed; width: 100%;}
.rTableRow{display: table-row; height: 20px;}
.rTableCellHead{display: table-cell; padding: 0px 10px; border: 1px solid #999999; text-align: center;}
.rTableCell{display: table-cell; padding: 3px 10px; border: 1px solid #999999;}
.rTableCellCheck{display: table-cell; padding: 2px 3px 1px 0px; width: 20px; }
.rTableCellNack{display: table-cell; width: 10px;}
.rTableCellTime{display: table-cell; border: 1px solid #999999; width: 120px; text-align: center;}
.HeadDateText{text-transform: uppercase; font-weight: bold; background: #51aeee;}
.HeadColorOrang{background: orange;}
.HeadColorGreen{background: limegreen;}
myspan {width: 100%;}


/* ---------------------------------- */
.btn {
    BORDER-TOP-WIDTH: 1px;
    FONT-WEIGHT: normal;
    BORDER-LEFT-WIDTH: 1px;
    BORDER-LEFT-COLOR: #808080;
    BORDER-BOTTOM-WIDTH: 1px;
    BORDER-BOTTOM-COLOR: #808080;
    COLOR: #000000;
    BORDER-TOP-COLOR: #808080;
    BORDER-RIGHT-WIDTH: 1px;
    BORDER-RIGHT-COLOR: #808080 
}

.slct {
    height: 30px;
    border: 1px solid #00000;
    border-radius: 0px;
    -webkit-apparence: none;
}

.suggestionsBoxAsso {
    position: relative;
    left: 30px;
    margin: 10px 0px 0px 0px;
    width: 200px;
    background-color: #212427;
    -moz-border-radius: 7px;
    -webkit-border-radius: 7px;
    border-radius: 7px;
    border: 2px solid #000;
    color: #fff;
}

.suggestionListAsso {
    margin: 0px;
    padding: 0px;
}

.suggestionListAsso li {
    margin: 0px 0px 3px 0px;
    padding: 3px;
    cursor: pointer;
}

.suggestionListAsso li:hover {
    background-color: #659CD8;
}

.suggestionsBoxPNom {
    position: relative;
    left: 30px;
    margin: 10px 0px 0px 0px;
    width: 200px;
    background-color: #212427;
    -moz-border-radius: 7px;
    -webkit-border-radius: 7px;
    border-radius: 7px;
    border: 2px solid #000;
    color: #fff;
}

.suggestionListPNom {
    margin: 0px;
    padding: 0px;
}

.suggestionListPNom li {
    margin: 0px 0px 3px 0px;
    padding: 3px;
    cursor: pointer;
}

.suggestionListPNom li:hover {
    background-color: #659CD8;
}

#remove_btn {
    background-color: #f44336;
    color: #FFFFFF;
}

/* @media (min-width:320px)  { /* smartphones, iPhone, portrait 480x320 phones */ } */
/* @media (min-width:481px)  { /* portrait e-readers (Nook/Kindle), smaller tablets @ 600 or @ 640 wide. */ } */
/* @media (min-width:641px)  { /* portrait tablets, portrait iPad, landscape e-readers, landscape 800x480 or 854x480 phones * } */
/* @media (min-width:961px)  { /* tablet, landscape iPad, lo-res laptops ands desktops * } */
/* @media (min-width:1025px) { /* big landscape tablets, laptops, and desktops * } */
/* @media (min-width:1281px) { /* hi-res laptops and desktops * } */