/* Section 4, div general 4 (Footer) */

.dg4b, .dg4b_left
{
    background-color: transparent;
}

.divg4
{
    float: left;
    margin-top: 0px;
    height: 250px;
    width: 100%;
    z-index: 8;
    text-align: center;
    background-color: rgb(250, 250, 255);
}

@media screen and (max-width: 1200px)
{
    .divg4
    {
        height: auto;
    }
}

.dg4b /* => Div dans divg4 */
{
    display: inline-block;
    height: auto;  /* 250px */
    width: auto;
    margin-top: 0px;
    text-align: left;
    font-family: Comic Sans MS;
    color: rgb(0, 0, 0);
    margin-left: 25px;
    margin-right: 25px;
    border: 0;
}

.dg4b_left /* =>  Div pour logo,titre,sous titres et Newsletters */
{
    float: left;
    text-align: left;
    height: 190px;
    width: 400px;
    margin-top: 30px;
}

.dg4b_div_logo_tst /* => Div General pour logo, titre et sous titres */ 
{
    float: left;
    height: 45px;
    width: auto;

    min-width: 180px;
    max-width: 310px;

    margin-left: 0px;
    margin-top: 0px;

    border: 0;
}

.dg4b_img_logo /* => Image du logo */ 
{
    float: left;
    height: 25px;
    width: auto;
}

.dg4b_txt_titre /* => Titre a côté du logo */ 
{
    float: left;
    font: 400 25px Helvetica;
    margin-left: 10px;
    margin-top: 0px;
    margin-bottom: 0;
}

.dg4b_txt_em /* => em pour le ® (R) a côté du titre */ 
{
    font: 400 10px Helvetica;
}

.dg4b_txt_st /* => (p) Sous titre pour le logo et le titre */
{
    margin-top: 2px;
    font: 400 12px arial;
}

.dg4b_div_nl /* => Div pour Newsletters */
{
    margin-top: 35px;
    float: left;
    height: 70px;
    width: 300px;
    border: 0;
}

.dg4b_dnl_text /* => Div pour text de la N. l. */
{
    float: left;
    height: 20px;
    width: auto;
    min-width: 150px;
    font: 400 16px arial;
    background-color: transparent;
}

.dg4b_dnl_form /* => Div pour <form> */
{
    float: left;
    width: 310px;
    height: 50px;
    margin-top: 3px;
    background-color: transparent;
}

.dg4b_dnl_form_email /* => <input> pour email */ 
{
    float: left;
    width: 178px;
    height: 35px;
    padding-left: 10px;
    padding-right: 10px;
    font: 400 14px arial;
    background-color: transparent;
    border-radius: 8px 0px 0px 8px; 
    color: rgb(43, 128, 255);
    border: 1px solid rgb(43, 128, 255);
}

.dg4b_dnl_form_submit /* => <input> pour envoyer (type="submit") */
{
    float: left;
    margin: 0;
    padding: 0;
    width: 100px;
    height: 39px;
    color: rgb(255, 255, 255);
    border-radius: 0px 8px 8px 0px; 
    transition: all .3s ease-in-out 0s;
    background-color: rgb(43, 128, 255);
    border: 1px solid rgb(43, 128, 255);
}

.dg4b_dnl_form_submit:hover
{
    background-color: rgb(73, 140, 239);
}

.dg4b_dnl_form_submit:active
{
    background-color: rgb(67, 132, 231);
}

/* °° Rigth °° */

.dg4b_right /* => Div pour tous les options de liens vers right */ 
{
    float: left;
    text-align: left;
    height: 190px; /* 190px */
    width: auto;
    margin-top: 30px;
    background-color: transparent;
}

@media screen and (max-width: 1200px)
{
    .dg4b_right
    {
        height: auto;
    }
}

.dg4b_pds /* => Div pour chaque sujet d'options */ 
{
    float: left;
    height: auto;
    width: auto;
    border: 0;
}

.dg4b_pds_titre /* => Div pour Titre de section */ 
{
    font: 400 18px arial;
}

.vertical_list /* => <ul> pour le de chaque section dans sections... */ 
{
    float: left;
    margin: 0;
    padding: 0;
    border: 0;
    margin-top: 20px;
    width: 160px;
    list-style-type: none;
}

.vertical_list li /* => <li> pour <ul> */ 
{
    color: rgb(0, 0, 0);
    margin-bottom: 10px;
    text-decoration: none;
    transition: all .3s ease-in-out 0s;
    font: 400 14px arial;
    list-style-type: none;
}

.vertical_list li:hover
{
    color: rgb(0, 144, 185);
}

.the_copyright /* => Div pour copyright de site web */ 
{
    text-align:  center;
    color: rgb(0, 0, 0);
    height: 30px;
    width: 100%;
    font: 400 16px arial;
}

@media screen and (max-width: 1200px)
{
    .the_copyright /* => Div pour copyright de site web */ 
    {
        display: none;
    }
}

/* ---- Cam ----- */ /* =>  */ /* => Div pour  */ 

.vd{
    position: fixed;
    right: 0;
    bottom: 0;
    height: 50px;
    transition: all 0.5s ease-in-out 2s;
}

.vd:hover{
    height: 150px;
    transition: all 0.5s cubic-bezier(0, 1.05, 1, 0.02) 0s;
}

.vd:active{
    height: 300px;
}