html{
    --dark_color : #1f4e5f;
    --light_color : #C5D1D5;
    --native_color : black;
    --native_color_opposit : white;
    
    --head_height : 56mm; /* En : 66mm, Fr : 56mm*/
    --right_bar_width : 54mm;
    --bottom_bar_height: 6mm;

    --image-size: 40mm;
    --name_size: 16mm;
    --speciality_size: 5mm;
    --section_title_size: 3.8mm;
    --content_size: 3.4mm;
    --details_size: 3mm;

    --skill_logo_width: 6mm;

    --main_s_borders-rad: 6mm;
}
body{
    transform: scale(1);
    font-size: var(--content_size);
    padding: 0; margin: 0;
    background-color: var(--light_color);
}

div.a4page{
    transform:scale(1);
    width: 210mm; height: 160mm;
    padding: 0; margin: 0;
    background: linear-gradient(var(--dark_color), var(--dark_color) var(--head_height), var(--light_color) calc(1.8*297mm));
    margin: auto;
    margin-top : 50mm;
    overflow: hidden;
    border-radius: var(--main_s_borders-rad) 0 0 var(--main_s_borders-rad);
    box-shadow: 20px 20px 20px rgba(0, 0, 0, 0.403);

    animation: fadeIn 5s;
    -webkit-animation: fadeIn 5s;
    -moz-animation: fadeIn 5s;
    -o-animation: fadeIn 5s;
    -ms-animation: fadeIn 5s;

}


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

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

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

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

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

a{
    text-decoration: none;
    color: inherit;
}



div.head{
    width: 210mm; height: var(--head_height);
    background-image: url('./theme_icon/camouflage.svg');
    overflow: hidden; 
    transform: scale(1);
    position: absolute; top:0; left:0;
}

table#head_text{
    height: 100%;
    color : var(--native_color_opposit);
}

div.right_bar{
    position: absolute; top: var(--head_height); left: 0;
    --padding: 4mm;
    padding: var(--padding);
    height: calc(297mm - var(--head_height) - 2 * var(--padding));
    width: calc(var(--right_bar_width) - 2*var(--padding));
    color: var(--native_color_opposit);
}

div.main{
    position: absolute; top: var(--head_height); right: 0;
    --padding_side: 6mm;
    padding-right: var(--padding_side); padding-left: var(--padding_side);
    height: calc(160mm - var(--head_height) - var(--bottom_bar_height));
    width: calc(210mm - var(--right_bar_width) - 2 * var(--padding_side));
    background-color: var(--native_color_opposit);
    border-radius: var(--main_s_borders-rad) 0 0 var(--main_s_borders-rad);
}





td.contact_logo{
    padding-top: 1mm;
    text-align: center;
    width: 8mm;
    height : 3mm;
}