

/*
==========================
==========================
==========================
Canevas
*/

/* =====================*/
/* Fonts
/* =====================*/

@font-face
{
    font-family: 'roboto_bold';
    src: url('../public_fonts/Roboto-Bold-webfont.woff') format('woff');
    font-weight: 400;
    font-style: normal;
}

@font-face
{
    font-family: 'roboto_regular';
    src: url('../public_fonts/Roboto-Regular-webfont.woff') format('woff');
    font-weight: 400;
    font-style: normal;
}

@font-face
{
    font-family: 'roboto_light';
    src: url('../public_fonts/Roboto-Light-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face
{
    font-family: 'opensans_regular';
    src: url('../public_fonts/OpenSans-Regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face
{
    font-family: 'orbitron_regular';
    src: url('../public_fonts/Orbitron-Regular.woff') format('woff');
    font-weight: 400;
    font-style: normal;
}

@font-face
{
    font-family: 'orbitron_bold';
    src: url('../public_fonts/Orbitron-Bold.woff') format('woff');
    font-weight: 700;
    font-style: normal;
}

@font-face
{
    font-family: 'quicksand_regular';
    src: url('../public_fonts/Quicksand-Regular.woff') format('woff');
    font-weight: 300;
    font-style: normal;
}

@font-face
{
    font-family: 'quicksand_light_regular';
    src: url('../public_fonts/Quicksand_light_regular.woff2') format('woff2');
    font-weight: 300;
    font-style: normal;
}

@font-face
{
    font-family: 'Quicksand Light';
    src: url('../public_fonts/Quicksand-Light.woff2') format('woff2');
    font-weight: 300;
    font-style: normal;
}

@font-face
{
    font-family: 'quicksand_medium';
    src: url('../public_fonts/Quicksand-Medium.woff2') format('woff2');
    font-weight: 300;
    font-style: normal;
}

@font-face
{
    font-family: 'Quicksand Medium';
    src: url('../public_fonts/Quicksand-Medium.woff2') format('woff2');
    font-weight: 300;
    font-style: normal;
}

@font-face
{
    font-family: 'opensans_regular';
    src: url('../public_fonts/OpenSans-Regular.woff') format('woff');
    font-weight: 300;
    font-style: normal;
}

@font-face
{
    font-family: 'Quicksand SemiBold';
    src: url('../public_fonts/Quicksand-SemiBold.woff2') format('woff2');
    font-weight: 300;
    font-style: normal;
}

@font-face
{
    font-family: 'source_sans_pro_regular';
    src: url('../public_fonts/SourceSansPro-Regular.woff2') format('woff2');
    font-weight: 300;
    font-style: normal;
}

@font-face
{
    font-family: 'Digital-7';
    src: url('../public_fonts/digital-7.woff') format('woff');
    font-weight: 300;
    font-style: normal;
}

@font-face
{
    font-family: 'Liberation Sans';
    src: url('../public_fonts/Liberation Sans.woff2') format('woff2');
    font-weight: 300;
    font-style: normal;
}



body
{
    margin-right: 0px;
    margin-left: 0px;
}

div.canevas_container_main
{
    /* some parameters are changed according to screen size, see @media below */
    background-color: #FFFFFF;
    /* * /
    border: 1px solid #a0a0a0;
    box-shadow: 0 0 10px -4px rgba(0, 0, 0, 0.6);
     */
    /* */
    text-align: left;
    margin: 0 auto;
    margin-top: 20px;
}
div.canevas_container_first_level
{

}
div.canevas_container_first_level_left_side
{
    /* some parameters are changed according to screen size, see @media below */
    display: inline-block;
    text-align: left;
    vertical-align: top;
    height: 110px;
}
div.canevas_container_first_level_left_side_top_space
{
    padding-top: 40px;
}

div.canevas_container_first_level_left_side_text_for_desktop_version
{
    font-family: orbitron_bold,verdana,arial,sans-serif;
	font-size: 14px;
	text-decoration: none;
	color: #000000;
	display: inline-block;
    padding-left: 10px;
    padding-top: 15px;
}

div.canevas_container_first_level_center
{
    display: inline-block;
}
div.canevas_container_first_level_logo
{
    /* some parameters are changed according to screen size, see @media below */
    width: 100%;

    animation: fadeIn 1.5s;
    -webkit-animation: fadeIn 1.5s;
    -moz-animation: fadeIn 1.5s;
    -o-animation: fadeIn 1.5s;
    -ms-animation: fadeIn 1.5s;
}
div.canevas_container_first_level_right_side
{
    display: inline-block;
    text-align: right;
    vertical-align: top;
    width: 33%;
    height: 110px;
}
div.canevas_language_selector
{
    /* some parameters are changed according to screen size, see @media below */
    width: 100%;
}

a.canevas_logo
{
    text-decoration: none;
}

a.canevas_language_selector_link
{
    color: #818181;
    text-decoration: none;
}

a.canevas_language_selector_link:link
{
    color:           #818181;
    text-decoration: none;
}

a.canevas_language_selector_link:visited
{
    color:           #818181;
    text-decoration: none;
}

a.canevas_language_selector_link:active
{
    color:           #818181;
    text-decoration: none;
}

div.canevas_language_selector_top_space
{
    padding-top: 44px;
}

div.canevas_language_selector_element
{
    display: block;
    overflow: auto;
    height: auto;
    padding-right: 10px;
}

div.canevas_language_selector_element a:hover
{
    font-weight: bold;
}
div.canevas_container_first_level_bottom_space
{
    padding-top: 15px;
}

nav.nav_medium
{
    background-color: #FF7700;
    height: 5px;
}

div.canevas_container_second_level
{
    display: inline-block;
    width: 100%;
}

table.canevas_table
{
    /* some parameters are changed according to screen size, see @media below */
    border-width: 0;
    border-color: #909090;
    border-style: solid;
    width: 100%;
    table-layout: fixed;
}
td.canevas
{
    background: #FFFFFF;
    max-width: 1070px;
}
div.canevas_container_second_level_left_div_element_top_space
{
    padding-top: 50px;
}
div.canevas_container_second_level_left_div_element
{
    /* some parameters are changed according to screen size, see @media below */
    display: inline-block;
    background-color: #FFFFFF;
    vertical-align: top;
}
div.canevas_container_second_level_right_div_element_right_space
{
    padding-top: 50px;
}
div.canevas_container_second_level_right_div_element
{
    /* some parameters are changed according to screen size, see @media below */
    display: inline-block;
    background: #FFFFFF;
    width: 100%;
    vertical-align: top;
    /* * /
    max-width: 1070px;
    /* */
    /* 220 px is the width of td.canevas_table_left_td_element */
    /* */
    /* max-width: calc(95% - 220px); */
    /* */

}
td.canevas_table_right_td_element
{
    padding-left: 15px;
    background: #FFFFFF;
    /* */
    max-width: 1070px;
    /* */
    /* 220 px is the width of td.canevas_table_left_td_element */
    /* * /
    max-width: calc(100% - 220px);
    /* */

}
td.canevas_bottom_credits_line
{
    background: #FFFFFF;
    max-width: 1070px;
}
div.responsive_table_by_adding_a_horizontal_scroll_bar
{
    overflow-x: auto;
}
table.responsive_table_by_adding_a_horizontal_scroll_bar_no_border
{
    border-collapse: collapse;
    border-spacing: 0;
    width: 100%;
    border: 2px;
    border-color: red;
    border: none;
    table-layout: auto;


}
th.responsive_table_by_adding_a_horizontal_scroll_bar_no_border
{
    text-align: left;
    padding: 8px;
    min-width: 400px;
    border-collapse: collapse;
}
td.responsive_table_by_adding_a_horizontal_scroll_bar_no_border
{
    text-align: left;
    padding: 8px;
    min-width: 400px;
    border-collapse: collapse;
}

/*
==========================
==========================
==========================
Canevas tail
*/

div.canevas_tail_linkedin
{
    height: 150px;
    text-align: center;
}

img.img_canevas_tail_linkedin
{
    max-height: 150px;
    max-width: 100%;
}

div.canevas_tail_first_level
{
    /*background-color: #FF7700;*/
    /*background-color: #000000; */ /* 2024.10.09 GVu: en noir pour le pied de page, ça donne mieux que du full orange. */
    /*height: 63px;*/
    height: 100px;

}

div.canevas_tail_begin
{
    height: 100px;
}

div.canevas_tail_copyright
{
    font-family: roboto_light,verdana,arial,sans-serif;
    font-size: 20px;
    font-weight: normal;
    /*color: #FFFFFF; */
    color: #A9A9A9;



}

div.canevas_tail_end
{
    height: 5px;
}

/*
==========================
==========================
==========================
*/





/*
==========================
==========================
==========================
Animations
*/



@keyframes fadeIn
{
	0% { opacity: 0;}
	100% { opacity: 1;}
}

@keyframes fadeInUp
{
	from {
        transform: translate3d(0,40px,0)
    }

    to {
        transform: translate3d(0,0,0);
        opacity: 1
    }
}

.fadeInUp
{
    animation-duration: 1s;
    animation-fill-mode: both;
    -webkit-animation-duration: 1s;
    -webkit-animation-fill-mode: both;

    opacity: 0;
    animation-name: fadeInUp;
    -webkit-animation-name: fadeInUp;
}

.fadeInUp_delay_1_5_seconds
{
    animation-delay: 1.5s;
    animation-duration: 1s;
    animation-fill-mode: both;
    -webkit-animation-duration: 1s;
    -webkit-animation-fill-mode: both;

    opacity: 0;
    animation-name: fadeInUp;
    -webkit-animation-name: fadeInUp;
}

.fadeInUp_delay_2_seconds
{
    animation-delay: 2s;
    animation-duration: 1s;
    animation-fill-mode: both;
    -webkit-animation-duration: 1s;
    -webkit-animation-fill-mode: both;

    opacity: 0;
    animation-name: fadeInUp;
    -webkit-animation-name: fadeInUp;
}

/*
==========================
==========================
==========================
*/






/* ******************************************** [ All except mobiles - mid and high res ] ***************************** */
@media handheld, only screen and (min-width: 800px), only screen and (min-device-width: 800px)
{

    div.canevas_container_main
    {
        text-align: left;
        width: 100%;
        /* * /
        box-shadow: 0 0 10px -4px rgba(0, 0, 0, 0.6);
        /* */
        margin-top: 20px;
    }
    div.canevas_container_first_level_left_side
    {
        width: 33%;
    }
    div.canevas_container_first_level_center
    {
        text-align: center;
        width: 33%;
    }
    img.logo_official
    {
        display: none;
    }
    img.logo_official_text_under_logo
    {
        display: inline-block;
    }
    table.canevas_table
    {
        margin-top: 50px;
    }
    div.canevas_container_second_level_left_div_element
    {
        width: 220px;
    }
    div.canevas_container_second_level_right_div_element
    {
        padding-left: 15px;
        /*
        max-width: calc(95% - 220px);
        */
        max-width: calc(98% - 220px);
    }
    div.canevas_tail_copyright
    {
        text-align: center;
        padding-top: 20px;
    }
}


/* ******************************************** [ Mobile - low res ] **************************** */
@media handheld, only screen and (max-width: 799px), only screen and (max-device-width: 799px)
{
    div.canevas_container_main
    {
        text-align: left;
        width: 100%;
        /* * /
        box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.6);
        /* */
        margin-top: 0;
    }
    div.canevas_container_first_level_center
    {
        text-align: center;
        width: 33%;
    }
    div.canevas_container_first_level_left_side
    {
        width: 33%;
    }
    img.logo_official
    {
        display: none;
    }
    img.logo_official_text_under_logo
    {
        display: inline-block;
    }
    table.canevas_table
    {
        margin-top: 0px;
    }
    div.canevas_container_second_level_left_div_element
    {
        width: 0px;
    }
    div.canevas_container_second_level_right_div_element
    {
        /* max-width: calc(95% - 50px);*/
        max-width: 100%;
        padding-left: 0px;
    }
    div.canevas_tail_copyright
    {
        margin-left: 0px;
        margin-right: 0px;
        text-align: center;
        padding-top: 10px;
        padding-left: 0%;
    }
    div.canevas_container_first_level_left_side_top_space
    {
        padding-top: 0px;
    }
    div.canevas_language_selector_top_space
    {
        padding-top: 0px;
    }
    div.canevas_container_first_level_left_side_text_for_desktop_version
    {
        padding-top: 5px;
    }
}

/*
==========================
==========================
==========================
*/