main h1, main > div, main > ul, main > p {
    margin: 1rem auto;
    width : 70%;
    height: 100%;
    clear : both;
}

main > ul {
    list-style-type    : none;
    list-style-position: outside;
}

main > ul li {
    float     : left;
    display   : block;
    width     : 25%;
    height    : 100%;
    text-align: center;
}

main > ul li a, li#page {
    display      : block;
    border       : 0.1rem solid #ccc;
    border-radius: 0.5rem;
    padding      : 1.5rem;
    margin       : 0.5rem;
    box-shadow   : 0 0.2rem 0.3rem #00000033;
    transition   : background-color 0.2s ease;
}

main > ul li a:hover, main > ul li a:focus {
  text-decoration : none;
  background-color: #f8f8f8;
}

main > ul li a img {
    width : 100%;
    height: 100%;
}

main > ul li a span {
    font-weight: normal;
}

main > ul + p, main > ul + ul {
    clear: both;
}

main > ul + ul {
    padding-top: 1rem;
    text-align : center;
}

main > ul + ul li, li#page {
    width  : auto;
    height : auto;
    display: inline-block;
    float  : none;
}

/* Téléphone portable */
@media (max-width: 670px) {
    main h1, main > div, main > ul, main > p {
        width: 90%;
    }

    main > ul li {
        width: 100%;
    }
}
 
header > div > div {
    float       : right;
    margin-right: 1rem;
}

header > div > div img {
    width      : 1.2rem;
    height     : 1.2rem;
    position   : relative;
    top        : 3px;
}

header div div + div {
    float: left;
}

header div div + div img {
    margin-left: 1rem;
    width      : 20rem;
    height     : 13.3rem;
}

header div div a + a + a {
    text-decoration : none !important;
}

header div div a span {
    color           : #fff;
    background-color: #27AE60;
    font-size       : 0.8rem;
    font-weight     : bold;
    padding-left    : 9px;
    padding-right   : 9px;
    border-radius   : 9px;
    position        : relative;
    top             : -9px;
    left            : -12px;
    cursor          : pointer;
}

header div div + div + div {
    width : 75%;
    height: 100%;
}

header div div + div + div p {
    font-weight: bold;
    font-size  : 2rem;
    margin     : 20px 0;
}

header div div + div + div input {
    width : 100%;
    height: 100%;
}

/* Téléphone portable */
@media (max-width: 670px) {
    div#user {
        margin-top: 15px !important;
    }

    header div div + div + div {
       width : 100%;
       height: 100%;
    }

    header div div + div + div p {
        font-size : 1.5rem;
        margin    : 10px;
        text-align: center;
    }

    header div div + div + div input {
        margin : 15px !important;
        padding: 5px;
    }

    header div div + div img {
       margin-left: 1rem;
       width      : 13rem;
       height     : 8.6rem;
    }
}

footer p {
    text-align: center;
}
* {
    margin : 0;
    padding: 0;
    cursor : default;
}

body {
    margin-top: 1.5rem;
    font      : normal normal normal 1.2rem Arial, "Bitstream Vera", sans-serif;
}

img {
    border: 0;
}

a {
    color          : #27AE60;
    text-decoration: none;
    font-weight    : 500;
    transition     : color 0.2s ease, text-decoration 0.2s ease;
    font           : bold normal normal 1.2rem Arial, "Bitstream Vera", sans-serif;
}

a:hover, a:focus {
  color: #1E8449;
  text-decoration: underline;
}

a:visited {
  color: #27AE60;
}

a:focus {
   outline: 0;
}

a, a img, area, a kbd, a acronym, a span, a em, a strong {
    cursor: pointer;
}

a:focus img {
    outline: 0.1rem dotted #ccc;
}

a.anglais:after {
    content: '[en]'
}

table {
    width          : 95%;
    margin         : 0 auto;
    border         : 0.1rem solid #27AE60;
    border-collapse: collapse;
    box-shadow     : 0 0.2rem 0.3rem #00000033;
}

caption {
    margin-bottom: 1rem;
    font         : normal normal bold 1.6rem Arial, "Bitstream Vera", sans-serif !important;
}

thead, tfoot {
    font-weight     : bold;
    font-style      : italic;
    background-color: #27AE60;
    color           : #fff;
}

thead th, tfoot td {
    border: 0.1rem solid #27AE60 !important;
}

tbody td {
    background-color: #fff;
    color           : #000;
    border          : 0.1rem dotted #27AE60;
}

tbody td.modulo {
    background-color: #fafafa;
    color           : #000;
}

th, td {
    padding: 0.2rem;
}

td#nothing {
    text-align : center;
    font-weight: bold;
    padding    : 0.5rem 0;
}

kbd {
    font           : inherit;
    border         : 0;
    text-decoration: underline;
}

fieldset {
    margin : 1rem;
    padding: 0.5rem;
    display: block;
    border : 0.1rem solid #f60883;
}

legend {
    padding    : 0.2rem;
    font-weight: bold;
}

ul {
    list-style-type    : disc;
    list-style-position: inside;
}

ol {
    list-style-position: inside;
}

hr {
    height          : 0.1rem;
    display         : block;
    border          : 0;
    margin          : 0.2rem auto;
    color           : #27AE60;
    background-color: #27AE60;
}

abbr, acronym {
    border-bottom      : 0;
    border-bottom-color: inherit;
}

.red {
    color: red;
}

.green {
    color: #2ECC71;
}

.orange {
    color: #ff9500;
}

.blue {
    color: blue;
}

.yellow {
    color: yellow;
}


.red, .green, .orange, .blue, .yellow {
    background-color: inherit;
    font-size       : 1.2rem;
}

.pages {
    text-align : center;
    font-weight: bold;
}

.souligne {
    text-decoration: underline;
}

/* Téléphone portable */
@media (max-width: 670px) {
    * {
        box-sizing: border-box;
    }
    
    body {
        width  : auto;
        margin : 0;
        padding: 0;
    }
    
    img, table, td, blockquote, code, pre, textarea, input, iframe, object,
    embed, video {
        max-width: 100%;
    }
    
    img {
        height: auto;
    }
    
    textarea, table, td, th, code, pre, samp {
        -webkit-hyphens: auto;
        -moz-hyphens   : auto;
        hyphens        : auto;
        word-wrap      : break-word;
    }
    
    select {
        width: 100%;
    }

    code, pre, samp {
        white-space: pre-wrap;
    }
    
    .nonMobile {
        display: none !important;
    }
    
    .aLaLigneMobile {
        clear: both !important;
    }

    .nonFlottantMobile {
        float: none !important;
        width: auto !important;
    }

    .blocMobile {
       display: block !important;
    }
}

@media (max-device-width:768px) and (orientation: landscape) {
    html {
        -webkit-text-size-adjust: 100%;
        -ms-text-size-adjust    : 100%;
  }
}

input, textarea, select {
    padding: 0.2rem;
    border : 0.1rem solid #ccc;
}

select optgroup {
    margin    : 0.3ex 0;
    text-align: center;
    font      : italic normal bold  1.2rem Verdana, Arial, "Bitstream Vera", sans-serif;
}

select option {
    text-align: left;
    padding   : 0 0.2rem;
}

input[type="checkbox"] {
    margin: 0.2rem;
}

input[type="text"], input[type="password"], input[type="email"], input[type="tel"], input[type="search"], input[type="number"], input[type="date"], input[type="url"], textarea, select {
    cursor          : text;
    color           : #000;
    background-color: #f8f8f8;
    font            : normal normal normal 1.2rem Verdana, Arial, "Bitstream Vera", sans-serif;
    margin          : 0.5rem 0;
    border-radius   : 0.2rem;
    transition      : background-color 0.2s ease;
}

input[type="text"]:hover, input[type="text"]:focus, input[type="password"]:hover, input[type="password"]:focus, input[type="email"]:hover, input[type="email"]:focus, input[type="tel"]:hover, input[type="tel"]:focus, input[type="search"]:hover, input[type="search"]:focus, input[type="number"]:hover, input[type="number"]:focus, input[type="date"]:hover, input[type="date"]:focus, input[type="url"]:hover, input[type="url"]:focus, textarea:hover, textarea:focus, select:hover, select:focus {
    color           : #000;
    background-color: #fff;
}

input[type="text"]:focus, input[type="password"]:focus, input[type="email"]:focus, input[type="tel"]:focus, input[type="search"]:focus, input[type="number"]:focus, input[type="date"]:focus, input[type="url"]:focus, textarea:focus, select:focus {
    outline: 0;
}

input[readonly], input[readonly]:hover, input[readonly]:focus {
    color           : #000;
    background-color: #f8f8f8;
    transition      : none;
}

input[type="search"] {
    background-image   : url('/data_Hixn1vnE/images_0eb46de1/searchicon_v.1.png');
    background-position: 4px 3px;
    background-repeat  : no-repeat;
    padding-left       : 32px;
}

input[maxlength="80"] {
    width: 60rem;
}

input[maxlength="60"] {
    width: 40rem;
}

input[maxlength="50"] {
    width: 35rem;
}

input[maxlength="40"] {
    width: 31rem;
}

input[maxlength="34"] {
    width: 28.5rem;
}

input[maxlength="20"] {
    width: 14rem;
}

input[maxlength="14"] {
    width: 9.8rem;
}

input[maxlength="12"] {
    width: 9rem;
}

input[maxlength="11"] {
    width: 11.5rem;
}

input[maxlength="10"] {
    width: 7rem;
}

input[maxlength="7"] {
    width: 5.5rem;
}

input[maxlength="6"] {
    width: 5rem;
    float: left;
}

input[maxlength="5"] {
    width: 4rem;
    float: left;
}

input[maxlength="4"] {
    width: 3.6rem;
}

input[maxlength="3"] {
    width: 2.1rem;
}

input[maxlength="2"] {
    width: 1.8rem;
}

input[maxlength="1"] {
    width: 0.9rem;
}

input[maxlength="6"] {
    margin-top: 1rem;
}

input[maxlength="6"] + img {
    width      : 14rem;
    height     : 4rem;
    margin-left: 0.5rem;
}

input[type="file"] {
    border: 0;
}

input[type="file"], input[type="file"]:hover, input[type="file"]:focus {
    background-color: inherit;
}

label[for] {
    line-height: 2.4rem;
    cursor     : pointer;
}

button {
    background-color: #2ECC71;
    color           : #fff;
    margin          : 0.5rem 0.2rem;
    padding         : 0.5rem 10rem !important;
    border          : 0;
    border-radius   : 2rem;
    font            : normal normal bold 1.2rem Verdana, Arial, "Bitstream Vera", sans-serif;
    box-shadow      : 0 0.2rem 0.3rem #00000033;
    transition      : all 0.5s ease;
    cursor          : pointer;
}

button:hover, button:focus {
  background-color: #27AE60;
  box-shadow      : 0 0.2rem 0.3rem #00000040;
}

button:active {
  box-shadow: 0 0.2rem 0.3rem #00000033;
  transform : translateY(0.2rem);
}

button:focus {
    outline: 0;
}

button.image {
    border: 0;
    margin: 0;
    cursor: pointer;
}

button.image:hover {
    border: 0;
}

.error, .error:hover, .error:focus {
    color           : #000;
    background-color: #ffc8c8 !important;
    border-color    : #ff0000;
}