button {
    background-color: transparent;
}

@media print  {
    .page_break{
        break-before: avoid;
        min-height: 38px;
        /*break-after: all;*/
        /*break-inside: avoid;*/
    }

    .border_right{
        position: relative;
        border-right: 1px solid #dce2f3;
        padding-left: 3%;
    }

    .print_tableau{
        position: absolute;
        border-bottom: #dce2f3 1px solid;
        width: 340px;
        margin-top: 86px;
        margin-left: 5px;
        z-index: 50;
    }

    .bottom_calendar {
        background-color: transparent;
    }

    table{
        background-color: transparent;
    }

    tr{
        background-color: transparent;
    }

    tbody{
        background-color: transparent;
    }

    thead{
        background-color: transparent;
    }

    .center-meteo-smartphone{
        padding-right: 0px;
        font-size: 16px;
        margin-top: -6px;
    }

    .bottom_calendar{
        background-color: transparent;
    }

    .longText{
        display: none;
    }

    .littleText{
        display: block;
    }

    .table_calendar .card{
        min-width: 360px;
        margin-top: 0;

    }

    .table_calendar{
        margin-left: 500px;
        margin-top: -70px;
    }

    ul .reset {
        list-style: none;
        margin: 0;
        padding: 0;
    }

    p {
        margin-bottom: 10px;
    }


    .prl_info .prl_name .text{
        text-overflow: ellipsis;
        width: 230px;
        max-width: 230px;
        overflow: hidden;
    }

    @media screen and (min-width: 1900px) and (max-width: 2000px){
        .prl_info .prl_name .text{
            text-overflow: ellipsis;
            width: 100px;
            max-width: 100px;
            overflow: hidden;
            margin-top: 2px;
        }
    }

    @media screen and (min-width: 1800px) and (max-width: 1900px){
        .prl_info .prl_name .text{
            text-overflow: ellipsis;
            width: 100px;
            max-width: 100px;
            overflow: hidden;
            margin-top: 2px;
        }
    }

    @media screen and (min-width: 1700px) and (max-width: 1800px){
        .prl_info .prl_name .text{
            text-overflow: ellipsis;
            width: 100px;
            max-width: 100px;
            overflow: hidden;
            margin-top: 2px;
        }
    }

    @media screen and (min-width: 1600px) and (max-width: 1700px){
        .prl_info .prl_name .text{
            text-overflow: ellipsis;
            width: 100px;
            max-width: 100px;
            overflow: hidden;
            margin-top: 2px;
        }
    }

    @media screen and (min-width: 1500px) and (max-width: 1600px){
        .prl_info .prl_name .text{
            text-overflow: ellipsis;
            width: 100px;
            max-width: 100px;
            overflow: hidden;
            margin-top: 2px;
        }
    }

    @media screen and (min-width: 1400px) and (max-width: 1500px){
        .prl_info .prl_name .text{
            text-overflow: ellipsis;
            width: 100px;
            max-width: 100px;
            overflow: hidden;
            margin-top: 2px;
        }
    }

    @media screen and (min-width: 1300px) and (max-width: 1400px){
        .prl_info .prl_name .text{
            text-overflow: ellipsis;
            width: 100px;
            max-width: 100px;
            overflow: hidden;
            margin-top: 2px;
        }
    }

    @media screen and (min-width: 1200px) and (max-width: 1300px){
        .prl_info .prl_name .text{
            text-overflow: ellipsis;
            width: 100px;
            max-width: 100px;
            overflow: hidden;
            margin-top: 2px;
        }
    }

    @media screen and (min-width: 1100px) and (max-width: 1200px){
        .prl_info .prl_name .text{
            text-overflow: ellipsis;
            width: 100px;
            max-width: 100px;
            overflow: hidden;
            margin-top: 2px;
        }
    }

    @media screen and (min-width: 992px) and (max-width: 1100px){
        .prl_info .prl_name .text{
            text-overflow: ellipsis;
            width: 100px;
            max-width: 100px;
            overflow: hidden;
            margin-top: 2px;
        }
    }

    @media screen and (min-width: 900px) and (max-width: 992px){
        .prl_info .prl_name .text{
            text-overflow: ellipsis;
            width: 100px;
            max-width: 100px;
            overflow: hidden;
            margin-top: 2px;
        }
    }

    @media screen and (min-width: 850px) and (max-width: 900px){
        .prl_info .prl_name .text{
            text-overflow: ellipsis;
            width: 100px;
            max-width: 100px;
            overflow: hidden;
            margin-top: 2px;
        }
    }

    @media screen and (min-width: 800px) and (max-width: 850px){
        .prl_info .prl_name .text{
            text-overflow: ellipsis;
            width: 100px;
            max-width: 100px;
            overflow: hidden;
            margin-top: 2px;
        }
    }

    @media screen and (min-width: 769px) and (max-width: 800px){
        .prl_info .prl_name .text{
            text-overflow: ellipsis;
            width: 100px;
            max-width: 100px;
            overflow: hidden;
            margin-top: 2px;
        }
    }

    @media screen and (min-width: 750px) and (max-width: 769px){
        .prl_info .prl_name .text{
            text-overflow: ellipsis;
            width: 100px;
            max-width: 100px;
            overflow: hidden;
            margin-top: 2px;
        }
    }

    @media screen and (min-width: 700px) and (max-width: 750px){
        .prl_info .prl_name .text{
            text-overflow: ellipsis;
            width: 100px;
            max-width: 100px;
            overflow: hidden;
            margin-top: 2px;
        }
    }

    @media screen and (min-width: 650px) and (max-width: 700px){
        .prl_info .prl_name .text{
            text-overflow: ellipsis;
            width: 100px;
            max-width: 100px;
            overflow: hidden;
            margin-top: 2px;
        }
    }

    @media screen and (min-width: 600px) and (max-width: 650px){
        .prl_info .prl_name .text{
            text-overflow: ellipsis;
            width: 100px;
            max-width: 100px;
            overflow: hidden;
            margin-top: 2px;
        }
    }

    @media screen and (min-width: 550px) and (max-width: 600px){
        .prl_info .prl_name .text{
            text-overflow: ellipsis;
            width: 100px;
            max-width: 100px;
            overflow: hidden;
            margin-top: 2px;
        }
    }

    @media screen and (min-width: 500px) and (max-width: 550px){
        .prl_info .prl_name .text{
            text-overflow: ellipsis;
            width: 100px;
            max-width: 100px;
            overflow: hidden;
            margin-top: 2px;
        }
    }

    @media screen and (min-width: 450px) and (max-width: 500px){
        .prl_info .prl_name .text{
            text-overflow: ellipsis;
            width: 100px;
            max-width: 100px;
            overflow: hidden;
            margin-top: 2px;
        }
    }

    @media screen and (min-width: 420px) and (max-width: 450px){
        .prl_info .prl_name .text{
            text-overflow: ellipsis;
            width: 100px;
            max-width: 100px;
            overflow: hidden;
            margin-top: 2px;
        }
    }

    @media screen and (min-width: 390px) and (max-width: 420px){
        .prl_info .prl_name .text{
            text-overflow: ellipsis;
            width: 100px;
            max-width: 100px;
            overflow: hidden;
            margin-top: 2px;
        }
    }

    @media screen and (min-width: 360px) and (max-width: 390px){
        .prl_info .prl_name .text{
            text-overflow: ellipsis;
            width: 100px;
            max-width: 100px;
            overflow: hidden;
            margin-top: 2px;
        }
    }

    @media screen and (min-width: 330px) and (max-width: 360px){
        .prl_info .prl_name .text{
            text-overflow: ellipsis;
            width: 100px;
            max-width: 100px;
            overflow: hidden;
            margin-top: 2px;
        }
    }

    .orange{
        color: #f5ae5c;
    }

    .ulclass{
        margin-top: -40px;
    }

    .bottom{
        margin-top: -50px;
        margin-bottom: -50px;
    }

    .img_type{
        height: 18px;
        margin-top: 2px;
        margin-left: -25px;
    }

    .jumbotron .calendrier{
        margin-top: -10px;
        margin-bottom: -10px;
    }

    .jumbotron{
        background-color: white;
        margin-top: -60px;
    }

    .meteo{
        background-color: white;
        margin-top: -20px;
    }

    .meteo_neige{
        margin-top: -40px;
    }

    .condition_up{
        margin-top: -25px;
        left: 45px;
    }

    .condition_commentary {
        margin-top: -10px;
    }

    .pistes_remontees .card{
        /*margin-bottom: -34px;*/
    }

    .intro{
    }

    .prevision_tendances_size{
        font-size: 16px;
        line-height: 18px;
        max-height: 18px;
    }

    .upForPrint{
        margin-top: -40px;
        margin-bottom: 50px;
    }

    .upForPrintCondition{
        margin-top: -110px;
    }

    .upForPrintPRL{
        margin-top: -110px;
    }

    .intro .domaine{
        height: 83px;
        text-align: right;
    }

    .prevision_tendances{
        padding-top: 16px;
        padding-bottom: 16px;
    }

    .card-body{
        padding: -10px;
    }

    /*.jumbotron .row{
        margin-bottom: 0px;
    }*/

    .calendar_group_table .image{
        height: 18px;
    }

    table{
        line-height: 0;
    }

    .calendar_group_table .text{
        font-size: 15px;
        line-height: 15px;
        font-weight: normal;
    }

    .calendar_group_table .image_text{
        position: absolute;
        min-height: 18px;
        height: 18px;
    }

    .calendar_group_table .image_text_aurore{
        position: absolute;
        min-height: 28px;
        height: 28px;
        margin-top: -6px;
        margin-left: 1px;
    }

    .calendar_group_table .border_right_calendar{
        position: relative;
    }

    .calendar_group_table .border_right_calendar::after{
        content: '';
        border-right: 1px solid #dce2f3;
        position: absolute;
        height: 80%;
        top: 10%;
        right: 4%;
    }

    tbody{
        border-color: transparent;
    }

    .intro .domaine .image {
        max-width: 240px;
        max-height: 60px;
    }

    .intro .image_longue .image {
        max-width: 240px;
        max-height: 60px;
    }

    .prl_affichage{
        margin-top: -15px;
        margin-bottom: 0px;
    }

    .intro_title{
        margin-top: 20px;
        text-align: center;
        text-transform: uppercase;
        color: #2a2840;
        font-size: 26px;
        font-weight: bold;
    }

    .intro_maj{
        margin-top: -10px;
        text-align: center;
        color: #4c5265;
        font-size: 16px;
        font-weight: bolder;
        margin-bottom: 20px;
    }

    .intro_maj_nuit{
        margin-top: 20px;
        text-align: center;
        color: #4c5265;
        font-size: 10px;
        font-weight: bolder;
        margin-bottom: 20px;
        z-index: 50;
    }

    .intro .pdf{
        height: 50px;
        text-align: center;
        margin-top: 10px;
    }

    .pdf_none{
        display: none;
    }

    .intro .pdf .image{
        position: absolute;
        margin-top: -50px;
        height: 50px;
    }
    
    .prevision{
        margin-top: -20px;
    }

    .prevision .text{
        color: #4c5265;
        font-size: 16px;
        font-weight: 700;
    }

    .prevision .subtext{
        margin-top: -5px;
        margin-left: 8px;
        font-size: 12px;
        color: #2a2840;
        text-align: justify;
        line-height: 14px;
        margin-bottom: 20px;
    }


    .subtitle{
        margin-top: -20px;
        display: flex;
    }

    .subtitle .image_text{
        height: 30px;
        width: 30px;
        margin-right: 16px;
    }

    .subtitle .text{
        color: #2a2840;
        margin-top: 2px;
        position: absolute;
        font-size: 16px;
    }

    .paragraphe{
        color: #2a2840;
        margin-top: 5px;
        margin-left: 54px;
        line-height: 14px;
        margin-bottom: 16px;
    }

    .condition{
        background-color: white;
        font-size: 12px;
        margin-left: -16px;
    }

    .conditions{
        padding-top: 10px;
        margin-left: -20px;
    }


    .title .information{
        left: 40px;
        position: absolute;
        outline: none;
        cursor: pointer;
    }

    .espaces_ludiques{
        position: absolute;
        margin-top: -70px;
        margin-left: -250px;
        max-height: 90px;
        min-width: 360px;
    }

    .espaces_ludiques_print{
        position: absolute;
        margin-top: -70px;
        margin-left: 250px;
        max-height: 90px;
        min-width: 360px;
    }

    .espaces_ludiques .card{
        min-height: 90px;
    }

    .espaces_ludiques_print .card{
        min-height: 90px;
    }

    .espaces_ludiques .card-body{
        border: none;
    }

    .espaces_ludiques_print .card-body{
        border: none;
    }

    .espaces_ludiques .card-header{
        border: none;
    }

    .espaces_ludiques_print .card-header{
        border: none;
    }

    .espaces_ludiques_print .span_espaces_ludiques {
        width: 100%;
        margin-left: -16px;
    }

    .span_espaces_ludiques{
        width: 100%;
    }

    .opoualand{
        min-height: 20px;
        margin-left: -30px;
        height: 40px;
        width: 80px;
        min-width: 80px;
        padding-top: 10px;
    }

    .waouland {
        min-height: 20px;
        margin-left: -30px;
        height: 40px;
        width: 80px;
        min-width: 80px;
        padding-top: 10px;
    }

    .flyingdonet{
        min-height: 20px;
        height: 50px;
        min-width: 70px;
        margin-left: -25px;
    }

    .schlitte-mountain{
        margin-left: -15px;
        min-height: 20px;
        min-width: 50px;
        height: 50px;
        width: 50px;
    }

    espace_ludique {
        min-width: 20px;
        width: 20px;
        max-width: 20px;
    }

    .espace_ludique .text{
        margin-top: -50px;
        text-align: center;
        margin-left: -10px;
        min-width: 70px;
    }

    .espaces_ludiques_print .espace_ludique_texte {
        padding-top: 5px;
        line-height: 12px;
        font-size: 12px;
        min-width: 60px;
        margin-left: -20px;
    }

    .espace_ludique_texte{
        padding-top: 10px;
        line-height: 12px;
        font-size: 12px;
        min-width: 60px;
    }

    .image_info{
        display: none;
    }

    .image_plus{
        display: none;
    }


    .remontee{
        padding-left: 5px;
        padding-top: 40px;
    }

    .remontee_gauche{
        margin-left: 60px;
    }

    .remontee_droite{
        margin-left: -190px;
    }

    .pistes_remontees{
        margin-top: -44px;
    }

    .piste_bas{
        margin-left: 214px;
        margin-top: -80px;
    }

    
    .piste_bas_no_table{
        margin-left: 440px;
        margin-top: -74px;
    }

    .piste{
        padding-left: 50px;
    }

    .prl_info .sector{
        color: #2a2840;
        font-weight: bold;
        font-size: 18px;
        margin-top: 0;
        padding-top: -24px;
        padding-bottom: -20px;
        margin-bottom: 0px;
    }

    .prl_info .text{
        color: #2a2840;
        font-size: 14px;
        font-weight: bold;
        padding-bottom: 20px;
        margin-top: -2px;
    }

    .prl_info .prl_name .text{
        color: #2a2840;
        text-align: left;
        font-size: 10px;
        margin-top: 5px;
        margin-left: -20px;
        font-weight: bold;
        white-space: nowrap;
    }
    .prl_info .prl_name .subtext{
        position: absolute;
        text-align: left;
        margin-top: -25px;
        margin-left: -19px;
        font-size: 10px;
        white-space: nowrap;
        color: #3e3c52;
    }

    /*.border_bottom_prl:nth-last-child(-n+3):before{
        content: "";
        position: absolute;
        right: 2%;
        z-index: 100;
        width: 96%;
        border-top: solid;
        margin-top: 29px;
        border-width: thin;
        color: #dce2f3;
    }*/

    .printMargin{
        margin-top: -15px;
    }

    .prl_info .prl_message .text{
        text-align: left;
        text-transform: uppercase;
        font-weight: bold;
        font-style: italic;
        color: #b71616;
        font-size: 7px;
        /*margin-top: 20px;*/
        line-height: 8px;
        margin-right: -68px;
        margin-left: -28px;
        /**/
        position: absolute;
        height: 30px;
        top: 22px;
    }

    .ski_area{
        margin-top: -60px;
    }

    .domaine_skiable{
        margin-top:-80px;
        background-color: #fff;
    }


    .prl_group{
        display: flex;
        margin-bottom: 2px;
        margin-top: -10px;
    }

    .left{
        text-align: left;
    }

    .right{
        text-align: right;
        margin-top: -41px;
        height: 20px;
    }

    .image_status{
        height: 23px;
        width: 23px;
        margin-top: 0px;
        margin-left: -23px;
    }

    .image_tooltip{
        margin-left: 10px;
        height: 30px;
        width: 30px;
    }

    .image_tooltip_avalanche{
        margin-left: -4px;
        height: 30px;
        width: 30px;
    }

    .left_weather .icon{
        margin-top: -25px;
        text-align: center;
    }

    .left_weather .icon .image{
        margin-top: 10px;
        width: 20px;
        height: 20px;
    }

    .left_weather .icon .image_vent {
        margin-top: 10px;
        margin-right: 50px;
        width: 20px;
        height: 20px;
    }

    .left_weather .icon .text{
        font-weight: bold;
        font-size: 12px;
        color: #2a2840;
        white-space: nowrap;
    }

    .matin{
        margin-left: -4px;
    }

    .apres_midi{
        margin-left: -11px;
    }

    .left_weather .icon .text_vent{
        font-weight: bold;
        font-size: 12px;
        color: #2a2840;
        margin-top: 12px;
        white-space: nowrap;
    }

    .left_weather .icon .subtext{
        font-size: 12px;
        color: #2a2840;
        white-space: nowrap;
    }

    .left_weather .icon .subtext_vent{
        margin-top: -16px;
        margin-left: 16px;
        font-size: 14px;
        color: #2a2840;
        white-space: nowrap;
    }

    .left_weather .icon .subtext .bold{
        font-weight: bold;
        font-size: 12px;
        color: #2a2840;
    }

    .left_weather .icon .subtext_vent .bold{
        font-weight: bold;
        font-size: 12px;
        color: #2a2840;
    }

    .middle_weather .icon{
        margin-top: -28px;
        text-align: center;
    }

    .middle_weather .icon .image{
        margin-left: 10px;
        margin-top: 12px;
        width: 20px;
        height: 20px;
    }

    .middle_weather .icon .text{
        font-weight: bold;
        font-size: 12px;
        color: #2a2840;
        white-space: nowrap;
    }

    .middle_weather .icon .text_italic{
        margin-left: -14px;
        font-style: italic;
        font-size: 12px;
        color: #2a2840;
        white-space: nowrap;
    }

    .middle_weather .icon .subtext{
        font-size: 12px;
        color: #2a2840;
        white-space: nowrap;
    }

    .middle_weather .icon .subtext .bold{
        font-weight: bold;
        font-size: 12px;
        color: #2a2840;
    }


    /* TODO */
    .right_weather .avalanche{
        text-align: center;
        margin-top: -20px;
        display: flex;
    }

    .right_weather .avalanche .text{
        margin-left: -16px;
        font-weight: bold;
        font-size: 12px;
        color: #2a2840;
        margin-top: 4px;
        white-space: nowrap;
    }

    .right_weather .avalanche .text .bold{
        font-size: 32px;
        color: #2a2840;
    }

    .right_weather .avalanche .image{
        margin-left: -16px;
        height: 30px;
        margin-top: 13px;
    }

    .title .image_text {
        height: 36px;
        min-width: 36px;
        margin-left: 80%;
    }

    .libelle_avalanche {
        font-weight: bold;
        font-size: 12px;
        margin-left: 10px;
        text-align: center;
        margin-top: -5px;
        color: #2a2840;
        white-space: nowrap;
    }

    .title .text {
        color: #2a2840;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        font-size: 22px;
        text-transform: uppercase;
        padding-left: 20px;
        white-space: nowrap;
        font-weight: normal;
    }

    .avalanche_libelle {
        display: none;
    }

    .title_tooltip{
        color: #2a2840;
        font-weight: bold;
        font-size: 16px;
        white-space: nowrap;
    }

    .text_tooltip{
        color: #2a2840;
        font-weight: bold;
        font-size: 12px;
        white-space: nowrap;
    }

    .image_tooltip{
        margin-left: -10px;
    }


    .prl{
        background-color: white;
    }

    .card{
        border-radius: 20px;
        border: 1px solid #2a2840;
        background-color: #ffffff;
        /*margin-bottom: 50px;*/
        margin-top: 50px;
    }

    .card .card-header{
        border-radius: 20px 20px 0 0;
        background-color: white;
        color: #2a2840;
        text-align: center;
        font-weight: bold;
        font-size: 26px;
        padding-top: 0px;
        padding-bottom: 0px;
        /*border-bottom: 1px #2a2840 solid;*/
        top: -1px;
    }

    .card .prl_info{
        margin-bottom: 0px;
    }

    .card .weather{
        border-radius: 0 0 30px 30px;
        background-color: white;
    }

    .card .calendar_group .row .calendar {
        margin-top: 10px;
    }

    .card .calendar_group{
        border-radius: 30px 30px 30px 30px;
        background-color: transparent;
    }

    .calendar .image_text{
        height: 40px;
        width: 40px;
        float: left;
        vertical-align: middle;
        margin-right: 10px;
    }

    .calendar .text{
        color: #2a2840;
        font-size: 14px;
        white-space: pre-wrap;
        line-height: 15px;
    }

    .libelle_tableau{
        display: none;
    }


    .centrer{
        text-align: center;
    }


    .tippy-tooltip{
        border-radius: 20px;
    }

    .tippy-tooltip.light-theme[data-animatefill]{
        background-color: #fff;
    }

    .margin_bottom{
        margin-bottom: 5px;
        margin-top: 5px;
    }

    .tooltip_domaine_image{
        height: 20px;
        text-align: right;
    }

    .center{
        text-align: center;
        font-size: 16px;
        font-weight: 700;
        margin-top: 2px;
        margin-bottom: 14px;
    }

    /*.border_top_prl {
        position: relative;
        border-top: #FFFFFF 1px solid;
    }*/

    /*.border_bottom_prl{
        position: relative;
        margin-top: -5px;
        border-bottom: #FFFFFF 1px solid;
    }*/

    .status{
        margin-right: 0px;
        margin-top: -1px;
    }

    .rotated-image {
        -webkit-transform: rotate(180deg);
        transform: rotate(180deg);
    }

    .SOUTHEAST, .SUDEST {
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg);
    }

    .SOUTH, .SUD {
        -webkit-transform: rotate(135deg);
        transform: rotate(135deg);
    }

    .SOUTHWEST, .SUDOUEST {
        -webkit-transform: rotate(180deg);
        transform: rotate(180deg);
    }

    .EAST, .EST {
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
    }

    .WEST, .OUEST {
        -webkit-transform: rotate(225deg);
        transform: rotate(225deg);
    }

    .NORTHWEST, .NORDOUEST {
        -webkit-transform: rotate(270deg);
        transform: rotate(270deg);
    }

    .NORTH, .NORD {
        -webkit-transform: rotate(315deg);
        transform: rotate(315deg);
    }

    .NORTHEAST, .NORDEST {
    }

    .UNDEFINED, .NONDEFINI {
        display: none;
    }

    .meteo{
        background-color: white;
    }

    .rect-auto,
    .c100.p51 .slice,
    .c100.p52 .slice,
    .c100.p53 .slice,
    .c100.p54 .slice,
    .c100.p55 .slice,
    .c100.p56 .slice,
    .c100.p57 .slice,
    .c100.p58 .slice,
    .c100.p59 .slice,
    .c100.p60 .slice,
    .c100.p61 .slice,
    .c100.p62 .slice,
    .c100.p63 .slice,
    .c100.p64 .slice,
    .c100.p65 .slice,
    .c100.p66 .slice,
    .c100.p67 .slice,
    .c100.p68 .slice,
    .c100.p69 .slice,
    .c100.p70 .slice,
    .c100.p71 .slice,
    .c100.p72 .slice,
    .c100.p73 .slice,
    .c100.p74 .slice,
    .c100.p75 .slice,
    .c100.p76 .slice,
    .c100.p77 .slice,
    .c100.p78 .slice,
    .c100.p79 .slice,
    .c100.p80 .slice,
    .c100.p81 .slice,
    .c100.p82 .slice,
    .c100.p83 .slice,
    .c100.p84 .slice,
    .c100.p85 .slice,
    .c100.p86 .slice,
    .c100.p87 .slice,
    .c100.p88 .slice,
    .c100.p89 .slice,
    .c100.p90 .slice,
    .c100.p91 .slice,
    .c100.p92 .slice,
    .c100.p93 .slice,
    .c100.p94 .slice,
    .c100.p95 .slice,
    .c100.p96 .slice,
    .c100.p97 .slice,
    .c100.p98 .slice,
    .c100.p99 .slice,
    .c100.p100 .slice {
        clip: rect(auto, auto, auto, auto);
    }
    .pie,
    .c100 .bar,
    .c100.p51 .fill,
    .c100.p52 .fill,
    .c100.p53 .fill,
    .c100.p54 .fill,
    .c100.p55 .fill,
    .c100.p56 .fill,
    .c100.p57 .fill,
    .c100.p58 .fill,
    .c100.p59 .fill,
    .c100.p60 .fill,
    .c100.p61 .fill,
    .c100.p62 .fill,
    .c100.p63 .fill,
    .c100.p64 .fill,
    .c100.p65 .fill,
    .c100.p66 .fill,
    .c100.p67 .fill,
    .c100.p68 .fill,
    .c100.p69 .fill,
    .c100.p70 .fill,
    .c100.p71 .fill,
    .c100.p72 .fill,
    .c100.p73 .fill,
    .c100.p74 .fill,
    .c100.p75 .fill,
    .c100.p76 .fill,
    .c100.p77 .fill,
    .c100.p78 .fill,
    .c100.p79 .fill,
    .c100.p80 .fill,
    .c100.p81 .fill,
    .c100.p82 .fill,
    .c100.p83 .fill,
    .c100.p84 .fill,
    .c100.p85 .fill,
    .c100.p86 .fill,
    .c100.p87 .fill,
    .c100.p88 .fill,
    .c100.p89 .fill,
    .c100.p90 .fill,
    .c100.p91 .fill,
    .c100.p92 .fill,
    .c100.p93 .fill,
    .c100.p94 .fill,
    .c100.p95 .fill,
    .c100.p96 .fill,
    .c100.p97 .fill,
    .c100.p98 .fill,
    .c100.p99 .fill,
    .c100.p100 .fill {
        position: absolute;
        border: 0.08em solid;
        width: 0.90em;
        height: 0.90em;
        clip: rect(0em, 0.5em, 1em, 0em);
        border-radius: 50%;
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    .pie-fill,
    .c100.p51 .bar:after,
    .c100.p51 .fill,
    .c100.p52 .bar:after,
    .c100.p52 .fill,
    .c100.p53 .bar:after,
    .c100.p53 .fill,
    .c100.p54 .bar:after,
    .c100.p54 .fill,
    .c100.p55 .bar:after,
    .c100.p55 .fill,
    .c100.p56 .bar:after,
    .c100.p56 .fill,
    .c100.p57 .bar:after,
    .c100.p57 .fill,
    .c100.p58 .bar:after,
    .c100.p58 .fill,
    .c100.p59 .bar:after,
    .c100.p59 .fill,
    .c100.p60 .bar:after,
    .c100.p60 .fill,
    .c100.p61 .bar:after,
    .c100.p61 .fill,
    .c100.p62 .bar:after,
    .c100.p62 .fill,
    .c100.p63 .bar:after,
    .c100.p63 .fill,
    .c100.p64 .bar:after,
    .c100.p64 .fill,
    .c100.p65 .bar:after,
    .c100.p65 .fill,
    .c100.p66 .bar:after,
    .c100.p66 .fill,
    .c100.p67 .bar:after,
    .c100.p67 .fill,
    .c100.p68 .bar:after,
    .c100.p68 .fill,
    .c100.p69 .bar:after,
    .c100.p69 .fill,
    .c100.p70 .bar:after,
    .c100.p70 .fill,
    .c100.p71 .bar:after,
    .c100.p71 .fill,
    .c100.p72 .bar:after,
    .c100.p72 .fill,
    .c100.p73 .bar:after,
    .c100.p73 .fill,
    .c100.p74 .bar:after,
    .c100.p74 .fill,
    .c100.p75 .bar:after,
    .c100.p75 .fill,
    .c100.p76 .bar:after,
    .c100.p76 .fill,
    .c100.p77 .bar:after,
    .c100.p77 .fill,
    .c100.p78 .bar:after,
    .c100.p78 .fill,
    .c100.p79 .bar:after,
    .c100.p79 .fill,
    .c100.p80 .bar:after,
    .c100.p80 .fill,
    .c100.p81 .bar:after,
    .c100.p81 .fill,
    .c100.p82 .bar:after,
    .c100.p82 .fill,
    .c100.p83 .bar:after,
    .c100.p83 .fill,
    .c100.p84 .bar:after,
    .c100.p84 .fill,
    .c100.p85 .bar:after,
    .c100.p85 .fill,
    .c100.p86 .bar:after,
    .c100.p86 .fill,
    .c100.p87 .bar:after,
    .c100.p87 .fill,
    .c100.p88 .bar:after,
    .c100.p88 .fill,
    .c100.p89 .bar:after,
    .c100.p89 .fill,
    .c100.p90 .bar:after,
    .c100.p90 .fill,
    .c100.p91 .bar:after,
    .c100.p91 .fill,
    .c100.p92 .bar:after,
    .c100.p92 .fill,
    .c100.p93 .bar:after,
    .c100.p93 .fill,
    .c100.p94 .bar:after,
    .c100.p94 .fill,
    .c100.p95 .bar:after,
    .c100.p95 .fill,
    .c100.p96 .bar:after,
    .c100.p96 .fill,
    .c100.p97 .bar:after,
    .c100.p97 .fill,
    .c100.p98 .bar:after,
    .c100.p98 .fill,
    .c100.p99 .bar:after,
    .c100.p99 .fill,
    .c100.p100 .bar:after,
    .c100.p100 .fill {
        -webkit-transform: rotate(180deg);
        -moz-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
        -o-transform: rotate(180deg);
        transform: rotate(180deg);
    }

    .c100.big {
        font-size: 7em;
    }
    .c100.small {
        font-size: 3em;
        margin-top: 18px;
    }
    .c100 {
        border: 1px solid #4c5265;
        position: relative;
        font-size: 4em;
        width: 1em;
        height: 1em;
        border-radius: 50%;
        float: left;
        margin: 5px 0.1em 0.1em 0;
        background-color: white;
        text-align: center;
    }

    .c100 .text{
        position: absolute;
        height: 40%;
        top: 46%;
        z-index: 1;
        font-size: 10px;
        transform: translateX(-50%);
    }

    .c100 .text .strong{
        font-size: 14px;
        font-weight: bold;
    }

    .small .text{
        position: absolute;
        height: 40%;
        top: 50%;
        z-index: 1;
        font-size: 8px;
        transform: translateX(-50%);
    }

    .small .text .strong{
        font-size: 10px;
        font-weight: bold;
    }


    .c100 *,
    .c100 *:before,
    .c100 *:after {
        -webkit-box-sizing: content-box;
        -moz-box-sizing: content-box;
        box-sizing: content-box;
    }
    .c100.center {
        float: none;
        margin: 0 auto;
    }
    .c100 > span .image{
        position: absolute;
        width: 40%;
        height: 36%;
        z-index: 1;
        left: 30%;
        top: 14%;
        font-size: 0.2em;
        color: #cccccc;
        display: block;
        text-align: center;
        white-space: nowrap;
    }

    .c100 .slice {
        position: absolute;
        width: 0.5em;
        height: 0.5em;
        clip: rect(0em, 1em, 1em, 0.5em);
    }

    .fill{
        right: 1px;
        top: -1px;
        /*margin-left: -1px;
        margin-top: -1px;*/
    }

    .bar{
        right: 1px;
        top: -1px;
        /*margin-left: -1px;
        margin-top: -1px;*/
    }

    .c100.p1 .bar {
        -webkit-transform: rotate(3.6deg);
        -moz-transform: rotate(3.6deg);
        -ms-transform: rotate(3.6deg);
        -o-transform: rotate(3.6deg);
        transform: rotate(3.6deg);
    }
    .c100.p2 .bar {
        -webkit-transform: rotate(7.2deg);
        -moz-transform: rotate(7.2deg);
        -ms-transform: rotate(7.2deg);
        -o-transform: rotate(7.2deg);
        transform: rotate(7.2deg);
    }
    .c100.p3 .bar {
        -webkit-transform: rotate(10.8deg);
        -moz-transform: rotate(10.8deg);
        -ms-transform: rotate(10.8deg);
        -o-transform: rotate(10.8deg);
        transform: rotate(10.8deg);
    }
    .c100.p4 .bar {
        -webkit-transform: rotate(14.4deg);
        -moz-transform: rotate(14.4deg);
        -ms-transform: rotate(14.4deg);
        -o-transform: rotate(14.4deg);
        transform: rotate(14.4deg);
    }
    .c100.p5 .bar {
        -webkit-transform: rotate(18deg);
        -moz-transform: rotate(18deg);
        -ms-transform: rotate(18deg);
        -o-transform: rotate(18deg);
        transform: rotate(18deg);
    }
    .c100.p6 .bar {
        -webkit-transform: rotate(21.6deg);
        -moz-transform: rotate(21.6deg);
        -ms-transform: rotate(21.6deg);
        -o-transform: rotate(21.6deg);
        transform: rotate(21.6deg);
    }
    .c100.p7 .bar {
        -webkit-transform: rotate(25.2deg);
        -moz-transform: rotate(25.2deg);
        -ms-transform: rotate(25.2deg);
        -o-transform: rotate(25.2deg);
        transform: rotate(25.2deg);
    }
    .c100.p8 .bar {
        -webkit-transform: rotate(28.8deg);
        -moz-transform: rotate(28.8deg);
        -ms-transform: rotate(28.8deg);
        -o-transform: rotate(28.8deg);
        transform: rotate(28.8deg);
    }
    .c100.p9 .bar {
        -webkit-transform: rotate(32.4deg);
        -moz-transform: rotate(32.4deg);
        -ms-transform: rotate(32.4deg);
        -o-transform: rotate(32.4deg);
        transform: rotate(32.4deg);
    }
    .c100.p10 .bar {
        -webkit-transform: rotate(36deg);
        -moz-transform: rotate(36deg);
        -ms-transform: rotate(36deg);
        -o-transform: rotate(36deg);
        transform: rotate(36deg);
    }
    .c100.p11 .bar {
        -webkit-transform: rotate(39.6deg);
        -moz-transform: rotate(39.6deg);
        -ms-transform: rotate(39.6deg);
        -o-transform: rotate(39.6deg);
        transform: rotate(39.6deg);
    }
    .c100.p12 .bar {
        -webkit-transform: rotate(43.2deg);
        -moz-transform: rotate(43.2deg);
        -ms-transform: rotate(43.2deg);
        -o-transform: rotate(43.2deg);
        transform: rotate(43.2deg);
    }
    .c100.p13 .bar {
        -webkit-transform: rotate(46.800000000000004deg);
        -moz-transform: rotate(46.800000000000004deg);
        -ms-transform: rotate(46.800000000000004deg);
        -o-transform: rotate(46.800000000000004deg);
        transform: rotate(46.800000000000004deg);
    }
    .c100.p14 .bar {
        -webkit-transform: rotate(50.4deg);
        -moz-transform: rotate(50.4deg);
        -ms-transform: rotate(50.4deg);
        -o-transform: rotate(50.4deg);
        transform: rotate(50.4deg);
    }
    .c100.p15 .bar {
        -webkit-transform: rotate(54deg);
        -moz-transform: rotate(54deg);
        -ms-transform: rotate(54deg);
        -o-transform: rotate(54deg);
        transform: rotate(54deg);
    }
    .c100.p16 .bar {
        -webkit-transform: rotate(57.6deg);
        -moz-transform: rotate(57.6deg);
        -ms-transform: rotate(57.6deg);
        -o-transform: rotate(57.6deg);
        transform: rotate(57.6deg);
    }
    .c100.p17 .bar {
        -webkit-transform: rotate(61.2deg);
        -moz-transform: rotate(61.2deg);
        -ms-transform: rotate(61.2deg);
        -o-transform: rotate(61.2deg);
        transform: rotate(61.2deg);
    }
    .c100.p18 .bar {
        -webkit-transform: rotate(64.8deg);
        -moz-transform: rotate(64.8deg);
        -ms-transform: rotate(64.8deg);
        -o-transform: rotate(64.8deg);
        transform: rotate(64.8deg);
    }
    .c100.p19 .bar {
        -webkit-transform: rotate(68.4deg);
        -moz-transform: rotate(68.4deg);
        -ms-transform: rotate(68.4deg);
        -o-transform: rotate(68.4deg);
        transform: rotate(68.4deg);
    }
    .c100.p20 .bar {
        -webkit-transform: rotate(72deg);
        -moz-transform: rotate(72deg);
        -ms-transform: rotate(72deg);
        -o-transform: rotate(72deg);
        transform: rotate(72deg);
    }
    .c100.p21 .bar {
        -webkit-transform: rotate(75.60000000000001deg);
        -moz-transform: rotate(75.60000000000001deg);
        -ms-transform: rotate(75.60000000000001deg);
        -o-transform: rotate(75.60000000000001deg);
        transform: rotate(75.60000000000001deg);
    }
    .c100.p22 .bar {
        -webkit-transform: rotate(79.2deg);
        -moz-transform: rotate(79.2deg);
        -ms-transform: rotate(79.2deg);
        -o-transform: rotate(79.2deg);
        transform: rotate(79.2deg);
    }
    .c100.p23 .bar {
        -webkit-transform: rotate(82.8deg);
        -moz-transform: rotate(82.8deg);
        -ms-transform: rotate(82.8deg);
        -o-transform: rotate(82.8deg);
        transform: rotate(82.8deg);
    }
    .c100.p24 .bar {
        -webkit-transform: rotate(86.4deg);
        -moz-transform: rotate(86.4deg);
        -ms-transform: rotate(86.4deg);
        -o-transform: rotate(86.4deg);
        transform: rotate(86.4deg);
    }
    .c100.p25 .bar {
        -webkit-transform: rotate(90deg);
        -moz-transform: rotate(90deg);
        -ms-transform: rotate(90deg);
        -o-transform: rotate(90deg);
        transform: rotate(90deg);
    }
    .c100.p26 .bar {
        -webkit-transform: rotate(93.60000000000001deg);
        -moz-transform: rotate(93.60000000000001deg);
        -ms-transform: rotate(93.60000000000001deg);
        -o-transform: rotate(93.60000000000001deg);
        transform: rotate(93.60000000000001deg);
    }
    .c100.p27 .bar {
        -webkit-transform: rotate(97.2deg);
        -moz-transform: rotate(97.2deg);
        -ms-transform: rotate(97.2deg);
        -o-transform: rotate(97.2deg);
        transform: rotate(97.2deg);
    }
    .c100.p28 .bar {
        -webkit-transform: rotate(100.8deg);
        -moz-transform: rotate(100.8deg);
        -ms-transform: rotate(100.8deg);
        -o-transform: rotate(100.8deg);
        transform: rotate(100.8deg);
    }
    .c100.p29 .bar {
        -webkit-transform: rotate(104.4deg);
        -moz-transform: rotate(104.4deg);
        -ms-transform: rotate(104.4deg);
        -o-transform: rotate(104.4deg);
        transform: rotate(104.4deg);
    }
    .c100.p30 .bar {
        -webkit-transform: rotate(108deg);
        -moz-transform: rotate(108deg);
        -ms-transform: rotate(108deg);
        -o-transform: rotate(108deg);
        transform: rotate(108deg);
    }
    .c100.p31 .bar {
        -webkit-transform: rotate(111.60000000000001deg);
        -moz-transform: rotate(111.60000000000001deg);
        -ms-transform: rotate(111.60000000000001deg);
        -o-transform: rotate(111.60000000000001deg);
        transform: rotate(111.60000000000001deg);
    }
    .c100.p32 .bar {
        -webkit-transform: rotate(115.2deg);
        -moz-transform: rotate(115.2deg);
        -ms-transform: rotate(115.2deg);
        -o-transform: rotate(115.2deg);
        transform: rotate(115.2deg);
    }
    .c100.p33 .bar {
        -webkit-transform: rotate(118.8deg);
        -moz-transform: rotate(118.8deg);
        -ms-transform: rotate(118.8deg);
        -o-transform: rotate(118.8deg);
        transform: rotate(118.8deg);
    }
    .c100.p34 .bar {
        -webkit-transform: rotate(122.4deg);
        -moz-transform: rotate(122.4deg);
        -ms-transform: rotate(122.4deg);
        -o-transform: rotate(122.4deg);
        transform: rotate(122.4deg);
    }
    .c100.p35 .bar {
        -webkit-transform: rotate(126deg);
        -moz-transform: rotate(126deg);
        -ms-transform: rotate(126deg);
        -o-transform: rotate(126deg);
        transform: rotate(126deg);
    }
    .c100.p36 .bar {
        -webkit-transform: rotate(129.6deg);
        -moz-transform: rotate(129.6deg);
        -ms-transform: rotate(129.6deg);
        -o-transform: rotate(129.6deg);
        transform: rotate(129.6deg);
    }
    .c100.p37 .bar {
        -webkit-transform: rotate(133.20000000000002deg);
        -moz-transform: rotate(133.20000000000002deg);
        -ms-transform: rotate(133.20000000000002deg);
        -o-transform: rotate(133.20000000000002deg);
        transform: rotate(133.20000000000002deg);
    }
    .c100.p38 .bar {
        -webkit-transform: rotate(136.8deg);
        -moz-transform: rotate(136.8deg);
        -ms-transform: rotate(136.8deg);
        -o-transform: rotate(136.8deg);
        transform: rotate(136.8deg);
    }
    .c100.p39 .bar {
        -webkit-transform: rotate(140.4deg);
        -moz-transform: rotate(140.4deg);
        -ms-transform: rotate(140.4deg);
        -o-transform: rotate(140.4deg);
        transform: rotate(140.4deg);
    }
    .c100.p40 .bar {
        -webkit-transform: rotate(144deg);
        -moz-transform: rotate(144deg);
        -ms-transform: rotate(144deg);
        -o-transform: rotate(144deg);
        transform: rotate(144deg);
    }
    .c100.p41 .bar {
        -webkit-transform: rotate(147.6deg);
        -moz-transform: rotate(147.6deg);
        -ms-transform: rotate(147.6deg);
        -o-transform: rotate(147.6deg);
        transform: rotate(147.6deg);
    }
    .c100.p42 .bar {
        -webkit-transform: rotate(151.20000000000002deg);
        -moz-transform: rotate(151.20000000000002deg);
        -ms-transform: rotate(151.20000000000002deg);
        -o-transform: rotate(151.20000000000002deg);
        transform: rotate(151.20000000000002deg);
    }
    .c100.p43 .bar {
        -webkit-transform: rotate(154.8deg);
        -moz-transform: rotate(154.8deg);
        -ms-transform: rotate(154.8deg);
        -o-transform: rotate(154.8deg);
        transform: rotate(154.8deg);
    }
    .c100.p44 .bar {
        -webkit-transform: rotate(158.4deg);
        -moz-transform: rotate(158.4deg);
        -ms-transform: rotate(158.4deg);
        -o-transform: rotate(158.4deg);
        transform: rotate(158.4deg);
    }
    .c100.p45 .bar {
        -webkit-transform: rotate(162deg);
        -moz-transform: rotate(162deg);
        -ms-transform: rotate(162deg);
        -o-transform: rotate(162deg);
        transform: rotate(162deg);
    }
    .c100.p46 .bar {
        -webkit-transform: rotate(165.6deg);
        -moz-transform: rotate(165.6deg);
        -ms-transform: rotate(165.6deg);
        -o-transform: rotate(165.6deg);
        transform: rotate(165.6deg);
    }
    .c100.p47 .bar {
        -webkit-transform: rotate(169.20000000000002deg);
        -moz-transform: rotate(169.20000000000002deg);
        -ms-transform: rotate(169.20000000000002deg);
        -o-transform: rotate(169.20000000000002deg);
        transform: rotate(169.20000000000002deg);
    }
    .c100.p48 .bar {
        -webkit-transform: rotate(172.8deg);
        -moz-transform: rotate(172.8deg);
        -ms-transform: rotate(172.8deg);
        -o-transform: rotate(172.8deg);
        transform: rotate(172.8deg);
    }
    .c100.p49 .bar {
        -webkit-transform: rotate(176.4deg);
        -moz-transform: rotate(176.4deg);
        -ms-transform: rotate(176.4deg);
        -o-transform: rotate(176.4deg);
        transform: rotate(176.4deg);
    }
    .c100.p50 .bar {
        -webkit-transform: rotate(180deg);
        -moz-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
        -o-transform: rotate(180deg);
        transform: rotate(180deg);
    }
    .c100.p51 .bar {
        -webkit-transform: rotate(183.6deg);
        -moz-transform: rotate(183.6deg);
        -ms-transform: rotate(183.6deg);
        -o-transform: rotate(183.6deg);
        transform: rotate(183.6deg);
    }
    .c100.p52 .bar {
        -webkit-transform: rotate(187.20000000000002deg);
        -moz-transform: rotate(187.20000000000002deg);
        -ms-transform: rotate(187.20000000000002deg);
        -o-transform: rotate(187.20000000000002deg);
        transform: rotate(187.20000000000002deg);
    }
    .c100.p53 .bar {
        -webkit-transform: rotate(190.8deg);
        -moz-transform: rotate(190.8deg);
        -ms-transform: rotate(190.8deg);
        -o-transform: rotate(190.8deg);
        transform: rotate(190.8deg);
    }
    .c100.p54 .bar {
        -webkit-transform: rotate(194.4deg);
        -moz-transform: rotate(194.4deg);
        -ms-transform: rotate(194.4deg);
        -o-transform: rotate(194.4deg);
        transform: rotate(194.4deg);
    }
    .c100.p55 .bar {
        -webkit-transform: rotate(198deg);
        -moz-transform: rotate(198deg);
        -ms-transform: rotate(198deg);
        -o-transform: rotate(198deg);
        transform: rotate(198deg);
    }
    .c100.p56 .bar {
        -webkit-transform: rotate(201.6deg);
        -moz-transform: rotate(201.6deg);
        -ms-transform: rotate(201.6deg);
        -o-transform: rotate(201.6deg);
        transform: rotate(201.6deg);
    }
    .c100.p57 .bar {
        -webkit-transform: rotate(205.20000000000002deg);
        -moz-transform: rotate(205.20000000000002deg);
        -ms-transform: rotate(205.20000000000002deg);
        -o-transform: rotate(205.20000000000002deg);
        transform: rotate(205.20000000000002deg);
    }
    .c100.p58 .bar {
        -webkit-transform: rotate(208.8deg);
        -moz-transform: rotate(208.8deg);
        -ms-transform: rotate(208.8deg);
        -o-transform: rotate(208.8deg);
        transform: rotate(208.8deg);
    }
    .c100.p59 .bar {
        -webkit-transform: rotate(212.4deg);
        -moz-transform: rotate(212.4deg);
        -ms-transform: rotate(212.4deg);
        -o-transform: rotate(212.4deg);
        transform: rotate(212.4deg);
    }
    .c100.p60 .bar {
        -webkit-transform: rotate(216deg);
        -moz-transform: rotate(216deg);
        -ms-transform: rotate(216deg);
        -o-transform: rotate(216deg);
        transform: rotate(216deg);
    }
    .c100.p61 .bar {
        -webkit-transform: rotate(219.6deg);
        -moz-transform: rotate(219.6deg);
        -ms-transform: rotate(219.6deg);
        -o-transform: rotate(219.6deg);
        transform: rotate(219.6deg);
    }
    .c100.p62 .bar {
        -webkit-transform: rotate(223.20000000000002deg);
        -moz-transform: rotate(223.20000000000002deg);
        -ms-transform: rotate(223.20000000000002deg);
        -o-transform: rotate(223.20000000000002deg);
        transform: rotate(223.20000000000002deg);
    }
    .c100.p63 .bar {
        -webkit-transform: rotate(226.8deg);
        -moz-transform: rotate(226.8deg);
        -ms-transform: rotate(226.8deg);
        -o-transform: rotate(226.8deg);
        transform: rotate(226.8deg);
    }
    .c100.p64 .bar {
        -webkit-transform: rotate(230.4deg);
        -moz-transform: rotate(230.4deg);
        -ms-transform: rotate(230.4deg);
        -o-transform: rotate(230.4deg);
        transform: rotate(230.4deg);
    }
    .c100.p65 .bar {
        -webkit-transform: rotate(234deg);
        -moz-transform: rotate(234deg);
        -ms-transform: rotate(234deg);
        -o-transform: rotate(234deg);
        transform: rotate(234deg);
    }
    .c100.p66 .bar {
        -webkit-transform: rotate(237.6deg);
        -moz-transform: rotate(237.6deg);
        -ms-transform: rotate(237.6deg);
        -o-transform: rotate(237.6deg);
        transform: rotate(237.6deg);
    }
    .c100.p67 .bar {
        -webkit-transform: rotate(241.20000000000002deg);
        -moz-transform: rotate(241.20000000000002deg);
        -ms-transform: rotate(241.20000000000002deg);
        -o-transform: rotate(241.20000000000002deg);
        transform: rotate(241.20000000000002deg);
    }
    .c100.p68 .bar {
        -webkit-transform: rotate(244.8deg);
        -moz-transform: rotate(244.8deg);
        -ms-transform: rotate(244.8deg);
        -o-transform: rotate(244.8deg);
        transform: rotate(244.8deg);
    }
    .c100.p69 .bar {
        -webkit-transform: rotate(248.4deg);
        -moz-transform: rotate(248.4deg);
        -ms-transform: rotate(248.4deg);
        -o-transform: rotate(248.4deg);
        transform: rotate(248.4deg);
    }
    .c100.p70 .bar {
        -webkit-transform: rotate(252deg);
        -moz-transform: rotate(252deg);
        -ms-transform: rotate(252deg);
        -o-transform: rotate(252deg);
        transform: rotate(252deg);
    }
    .c100.p71 .bar {
        -webkit-transform: rotate(255.6deg);
        -moz-transform: rotate(255.6deg);
        -ms-transform: rotate(255.6deg);
        -o-transform: rotate(255.6deg);
        transform: rotate(255.6deg);
    }
    .c100.p72 .bar {
        -webkit-transform: rotate(259.2deg);
        -moz-transform: rotate(259.2deg);
        -ms-transform: rotate(259.2deg);
        -o-transform: rotate(259.2deg);
        transform: rotate(259.2deg);
    }
    .c100.p73 .bar {
        -webkit-transform: rotate(262.8deg);
        -moz-transform: rotate(262.8deg);
        -ms-transform: rotate(262.8deg);
        -o-transform: rotate(262.8deg);
        transform: rotate(262.8deg);
    }
    .c100.p74 .bar {
        -webkit-transform: rotate(266.40000000000003deg);
        -moz-transform: rotate(266.40000000000003deg);
        -ms-transform: rotate(266.40000000000003deg);
        -o-transform: rotate(266.40000000000003deg);
        transform: rotate(266.40000000000003deg);
    }
    .c100.p75 .bar {
        -webkit-transform: rotate(270deg);
        -moz-transform: rotate(270deg);
        -ms-transform: rotate(270deg);
        -o-transform: rotate(270deg);
        transform: rotate(270deg);
    }
    .c100.p76 .bar {
        -webkit-transform: rotate(273.6deg);
        -moz-transform: rotate(273.6deg);
        -ms-transform: rotate(273.6deg);
        -o-transform: rotate(273.6deg);
        transform: rotate(273.6deg);
    }
    .c100.p77 .bar {
        -webkit-transform: rotate(277.2deg);
        -moz-transform: rotate(277.2deg);
        -ms-transform: rotate(277.2deg);
        -o-transform: rotate(277.2deg);
        transform: rotate(277.2deg);
    }
    .c100.p78 .bar {
        -webkit-transform: rotate(280.8deg);
        -moz-transform: rotate(280.8deg);
        -ms-transform: rotate(280.8deg);
        -o-transform: rotate(280.8deg);
        transform: rotate(280.8deg);
    }
    .c100.p79 .bar {
        -webkit-transform: rotate(284.40000000000003deg);
        -moz-transform: rotate(284.40000000000003deg);
        -ms-transform: rotate(284.40000000000003deg);
        -o-transform: rotate(284.40000000000003deg);
        transform: rotate(284.40000000000003deg);
    }
    .c100.p80 .bar {
        -webkit-transform: rotate(288deg);
        -moz-transform: rotate(288deg);
        -ms-transform: rotate(288deg);
        -o-transform: rotate(288deg);
        transform: rotate(288deg);
    }
    .c100.p81 .bar {
        -webkit-transform: rotate(291.6deg);
        -moz-transform: rotate(291.6deg);
        -ms-transform: rotate(291.6deg);
        -o-transform: rotate(291.6deg);
        transform: rotate(291.6deg);
    }
    .c100.p82 .bar {
        -webkit-transform: rotate(295.2deg);
        -moz-transform: rotate(295.2deg);
        -ms-transform: rotate(295.2deg);
        -o-transform: rotate(295.2deg);
        transform: rotate(295.2deg);
    }
    .c100.p83 .bar {
        -webkit-transform: rotate(298.8deg);
        -moz-transform: rotate(298.8deg);
        -ms-transform: rotate(298.8deg);
        -o-transform: rotate(298.8deg);
        transform: rotate(298.8deg);
    }
    .c100.p84 .bar {
        -webkit-transform: rotate(302.40000000000003deg);
        -moz-transform: rotate(302.40000000000003deg);
        -ms-transform: rotate(302.40000000000003deg);
        -o-transform: rotate(302.40000000000003deg);
        transform: rotate(302.40000000000003deg);
    }
    .c100.p85 .bar {
        -webkit-transform: rotate(306deg);
        -moz-transform: rotate(306deg);
        -ms-transform: rotate(306deg);
        -o-transform: rotate(306deg);
        transform: rotate(306deg);
    }
    .c100.p86 .bar {
        -webkit-transform: rotate(309.6deg);
        -moz-transform: rotate(309.6deg);
        -ms-transform: rotate(309.6deg);
        -o-transform: rotate(309.6deg);
        transform: rotate(309.6deg);
    }
    .c100.p87 .bar {
        -webkit-transform: rotate(313.2deg);
        -moz-transform: rotate(313.2deg);
        -ms-transform: rotate(313.2deg);
        -o-transform: rotate(313.2deg);
        transform: rotate(313.2deg);
    }
    .c100.p88 .bar {
        -webkit-transform: rotate(316.8deg);
        -moz-transform: rotate(316.8deg);
        -ms-transform: rotate(316.8deg);
        -o-transform: rotate(316.8deg);
        transform: rotate(316.8deg);
    }
    .c100.p89 .bar {
        -webkit-transform: rotate(320.40000000000003deg);
        -moz-transform: rotate(320.40000000000003deg);
        -ms-transform: rotate(320.40000000000003deg);
        -o-transform: rotate(320.40000000000003deg);
        transform: rotate(320.40000000000003deg);
    }
    .c100.p90 .bar {
        -webkit-transform: rotate(324deg);
        -moz-transform: rotate(324deg);
        -ms-transform: rotate(324deg);
        -o-transform: rotate(324deg);
        transform: rotate(324deg);
    }
    .c100.p91 .bar {
        -webkit-transform: rotate(327.6deg);
        -moz-transform: rotate(327.6deg);
        -ms-transform: rotate(327.6deg);
        -o-transform: rotate(327.6deg);
        transform: rotate(327.6deg);
    }
    .c100.p92 .bar {
        -webkit-transform: rotate(331.2deg);
        -moz-transform: rotate(331.2deg);
        -ms-transform: rotate(331.2deg);
        -o-transform: rotate(331.2deg);
        transform: rotate(331.2deg);
    }
    .c100.p93 .bar {
        -webkit-transform: rotate(334.8deg);
        -moz-transform: rotate(334.8deg);
        -ms-transform: rotate(334.8deg);
        -o-transform: rotate(334.8deg);
        transform: rotate(334.8deg);
    }
    .c100.p94 .bar {
        -webkit-transform: rotate(338.40000000000003deg);
        -moz-transform: rotate(338.40000000000003deg);
        -ms-transform: rotate(338.40000000000003deg);
        -o-transform: rotate(338.40000000000003deg);
        transform: rotate(338.40000000000003deg);
    }
    .c100.p95 .bar {
        -webkit-transform: rotate(342deg);
        -moz-transform: rotate(342deg);
        -ms-transform: rotate(342deg);
        -o-transform: rotate(342deg);
        transform: rotate(342deg);
    }
    .c100.p96 .bar {
        -webkit-transform: rotate(345.6deg);
        -moz-transform: rotate(345.6deg);
        -ms-transform: rotate(345.6deg);
        -o-transform: rotate(345.6deg);
        transform: rotate(345.6deg);
    }
    .c100.p97 .bar {
        -webkit-transform: rotate(349.2deg);
        -moz-transform: rotate(349.2deg);
        -ms-transform: rotate(349.2deg);
        -o-transform: rotate(349.2deg);
        transform: rotate(349.2deg);
    }
    .c100.p98 .bar {
        -webkit-transform: rotate(352.8deg);
        -moz-transform: rotate(352.8deg);
        -ms-transform: rotate(352.8deg);
        -o-transform: rotate(352.8deg);
        transform: rotate(352.8deg);
    }
    .c100.p99 .bar {
        -webkit-transform: rotate(356.40000000000003deg);
        -moz-transform: rotate(356.40000000000003deg);
        -ms-transform: rotate(356.40000000000003deg);
        -o-transform: rotate(356.40000000000003deg);
        transform: rotate(356.40000000000003deg);
    }
    .c100.p100 .bar {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
    .c100.default .bar,
    .c100.default .fill{
        border-color: #3d4754;
    }

    .c100.defaultClair .bar,
    .c100.defaultClair .fill{
        border-color: #7593b3;
    }

    .c100.green,
    .c100.green .bar,
    .c100.green .fill{
        border-color: #3f9b48;
    }

    .c100.blue,
    .c100.blue .bar,
    .c100.blue .fill{
        border-color: #3cb0f3;
    }

    .c100.red,
    .c100.red .bar,
    .c100.red .fill{
        border-color: #b71616;
    }

    .c100.black,
    .c100.black .bar,
    .c100.black .fill{
        border-color: black;
    }

    .default{
        color: #3d4754;
    }

    .green{
        color: #3f9b48;
    }

    .blue{
        color: #3cb0f3;
    }

    .red{
        color: #b71616;
    }

    .black {
        color: black;
    }
}

ul .reset {
    list-style: none;
    margin: 0;
    padding: 0;
}

p {
    margin-bottom: 10px;
}

.orange{
    color: #f5ae5c;
}

.jumbotron .calendrier{
    margin-top: -10px;
    margin-bottom: -10px;
}

.intro{
}

.intro .domaine{
    height: 83px;
    text-align: right;
}

.prevision_tendances{
    padding-top: 16px;
    padding-bottom: 16px;
}

@media screen and (min-width: 768px) {
    .intro .domaine .image {
        max-width: 240px;
        max-height: 80px;
    }
}

@media screen and (max-width: 768px) {
    .intro .domaine .image {
        max-width: 160px;
        max-height: 53px;
    }
}

@media screen and (max-width: 638px) and (min-width: 450px) {
    .intro .domaine .image {
        max-width: 120px;
        max-height: 40px;
        margin-top: 16px;
    }
}


@media screen and (max-width: 450px){
    .center{
        text-align: center;
        margin-top: -5px;
        font-size: 14px;
        font-weight: 700;
        white-space: initial;
    }

    .condition_up{
        margin-top: -30px;
    }

    .center-meteo-smartphone{
        padding-right: 0px;
        font-size: 16px;
        margin-bottom: -30px;
    }

    .prevision_tendances_size{
        font-size: 16px;
        line-height: 18px;
    }

    .prl_affichage{
        margin-bottom: 3px;
        margin-top: -15px;
        padding-top: 10px;
    }

    .intro_title{
        margin-top: 10px;
        text-align: center;
        text-transform: uppercase;
        font-size: 18px;
        font-weight: bold;
    }

    .intro_maj{
        margin-top: 10px;
        text-align: center;
        font-size: 12px;
        font-weight: bolder;
        margin-bottom: 20px;
    }

    .intro_maj_nuit{
        margin-top: 10px;
        text-align: center;
        font-size: 8px;
        font-weight: bolder;
        margin-bottom: 20px;
    }

    .intro .domaine .image {
        max-width: 80px;
        max-height: 27px;
    }

    .intro .pdf{
        height: 83px;
        text-align: center;
        margin-top: 10px;
    }

    .intro .pdf .image{
        height: 30px;
    }

    .title .image_text {
        height: 22px;
        min-width: 22px;
        margin-left: 80%;
    }

    .title .text {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        font-size: 16px;
        text-transform: uppercase;
        white-space: nowrap;
    }

    .avalanche_libelle{
        font-weight: bold;
        font-size: 10px;
        color: #2a2840;
        text-align: left;
        vertical-align: middle;
        margin-top: -18px;
        white-space: nowrap;
        margin-left: 5px;
    }


    .left_weather .icon{
        text-align: center;
    }

    .left_weather .icon .image{
        width: 20px;
        height: 20px;
    }

    .left_weather .icon .image_vent {
        margin-right: 60px;
        width: 20px;
        height: 20px;
    }

    .left_weather .icon .text{
        font-weight: bold;
        font-size: 10px;
        /*color: #2a2840;*/
        white-space: nowrap;
    }

    .left_weather .icon .text_vent{
        font-weight: bold;
        font-size: 8px;
        /*color: #2a2840;*/
    }

    .left_weather .icon .subtext{
        font-size: 10px;
        /*color: #2a2840;*/
    }

    .left_weather .icon .subtext_vent{
        margin-top: -8px;
        margin-left: 5px;
        font-size: 10px;
        /*color: #2a2840;*/
        white-space: nowrap;
    }

    .left_weather .icon .subtext .bold{
        font-weight: bold;
        font-size: 12px;
        /*color: #2a2840;*/
    }

    .left_weather .icon .subtext_vent .bold{
        font-weight: bold;
        font-size: 12px;
        /*color: #2a2840;*/
    }

    .middle_weather .icon{
        text-align: center;
    }

    .middle_weather .icon .image{
        margin-top: -24px;
        width: 20px;
        height: 20px;
    }

    .middle_weather .icon .text{
        font-weight: bold;
        font-size: 10px;
        /*color: #2a2840;*/
        white-space: nowrap;
    }

    .middle_weather .icon .text_italic{
        font-style: italic;
        font-size: 8px;
        /*color: #2a2840;*/
        white-space: nowrap;
    }

    .middle_weather .icon .subtext{
        font-size: 10px;
        /*color: #2a2840;*/
        white-space: nowrap;
    }

    .middle_weather .icon .subtext .bold{
        font-weight: bold;
        font-size: 12px;
        /*color: #2a2840;*/
    }

    .right_weather .avalanche{
        text-align: center;
        margin-top: -20px;
    }

    .right_weather .avalanche .text{
        font-weight: bold;
        font-size: 12px;
        color: #2a2840;
        white-space: nowrap;
    }

    .right_weather .avalanche .text .bold{
        margin-top: -20px;
        font-size: 20px;
        color: #2a2840;
    }

    .right_weather .avalanche .image{
        margin-left: -10px;
        height: 40px;
    }


    .prevision{
        margin-top: 0;
    }

    .prevision .text{
        /*color: #2a2840;*/
        font-size: 12px;
        font-weight: bold;
    }

    .prevision .subtext{
        margin-left: 5px;
        font-size: 10px;
        /*color: #2a2840;*/
        text-align: justify;
    }


    .subtitle{
        margin-top: 20px;
        display: flex;
    }

    .subtitle .image_text{
        height: 20px;
        width: 20px;
        margin-right: 16px;
    }

    .subtitle .text{
        /*color: #2a2840;*/
        position: absolute;
        font-size: 12px;
    }

    .paragraphe{
        /*color: #2a2840;*/
        margin-left: 30px;
    }

    .condition{
        background-color: white;
        font-size: 10px;
    }

    .conditions{
        padding-top: 20px;
        margin-left: 10px;
    }

    .title .information{
        position: absolute;
        cursor: pointer;
        left: 20px;
    }

    .image_info{
        background-size: 20px 20px;
        width: 20px;
        height: 20px;
        z-index: 99999;
        border: 0;
    }

    .image_plus{
        background-size: 20px 20px;
        width: 20px;
        height: 20px;
        z-index: 9999;
        border: 0;
        margin-left: 26px;
    }


    .remontee{
        padding-left: 30px;
        padding-top: 40px;
    }

    .piste{
        padding-left: 30px;
    }

    .prl_info .sector{
        font-weight: bold;
        font-size: 16px;
        padding-bottom: 5px;
    }

    .prl_info .text{
        /*color: #2a2840;*/
        font-size: 10px;
        font-weight: bold;
        padding-bottom: 5px;
        white-space: nowrap;
    }

    .prl_info .prl_name .text{
        text-align: left;
        font-size: 10px;
        font-weight: bold;
        white-space: nowrap;
        margin-left: 5px;
    }
    .prl_info .prl_name .subtext{
        text-align: left;
        margin-top: -7px;
        margin-left: 5px;
        font-size: 9px;
        white-space: nowrap;
    }


    .right{
        margin-top: -35px;
        text-align: right;
        margin-right: -20px;
    }

    .right_bold{
        font-size: 20px;
        font-weight: bold;
    }

    .prl_group{
        display: flex;
        break-after: avoid;
        break-inside: avoid;
    }

    .prl_center{
        padding-right: 0px;
        padding-left: 0px;
        margin-left: -20px;
    }

    .left{
        text-align: left;
    }

    .image_status{
        height: 20px;
        width: 20px;
        margin-top: -5px;
    }

    .text_tooltip{
        color: #2a2840;
        font-weight: bold;
        font-size: 10px;
        white-space: pre-line;
    }

    .image_tooltip{
        margin-left: 10px;
        height: 30px;
        width: 30px;
    }

    .image_tooltip_vent{
        margin-left: 10px;
        height: 24px;
        width: 24px;
    }

    .image_tooltip_avalanche{
        margin-left: -21px;
        height: 65px;
        width: 65px;
    }

    .title_tooltip{
        color: #2a2840;
        font-weight: bold;
        font-size: 14px;
        white-space: nowrap;
    }

    .border_bottom_prl::before{

    }
}

@media screen and (min-width: 450px){
    .center{
        text-align: center;
        font-size: 18px;
        font-weight: 700;
    }

    .prl_affichage{
        padding-top: 30px;
        margin-bottom: 32px;
    }

    .intro_title{
        margin-top: 20px;
        text-align: center;
        text-transform: uppercase;
        font-size: 32px;
        font-weight: bold;
    }

    .intro_maj{
        margin-top: 20px;
        text-align: center;
        font-size: 20px;
        font-weight: bolder;
        margin-bottom: 20px;
    }

    .intro_maj_nuit{
        margin-top: 20px;
        text-align: center;
        font-size: 12px;
        font-weight: bolder;
        margin-bottom: 20px;
    }

    .intro .pdf{
        height: 83px;
        text-align: center;
        margin-top: 10px;
    }

    .intro .pdf .image{
        height: 50px;
    }


    .prevision{
        margin-top: 0;
    }

    .prevision .text{
        /*color: #4c5265;*/
        font-size: 19px;
        font-weight: 700;
    }

    .prevision .subtext{
        margin-top: 5px;
        margin-left: 8px;
        font-size: 12px;
        /*color: #2a2840;*/
        text-align: justify;
        line-height: 14px;
        margin-bottom: 5px;
    }


    .subtitle{
        margin-top: 20px;
        display: flex;
    }

    .subtitle .image_text{
        height: 30px;
        width: 30px;
        margin-right: 16px;
    }

    .subtitle .text{
        /*color: #2a2840;*/
        margin-top: 2px;
        position: absolute;
        font-size: 19px;
    }

    .paragraphe{
        /*color: #2a2840;*/
        margin-top: 5px;
        margin-left: 54px;
        line-height: 14px;
    }

    .condition{
        background-color: white;
        font-size: 12px;
    }

    .conditions{
        padding-top: 20px;
        margin-left: 20px;
    }


    .title .information{
        left: 40px;
        position: absolute;
        outline: none;
        cursor: pointer;
    }

    .image_info{
        margin-left: -32px;
        margin-top: 5px;
        width: 38px;
        height: 38px;
        z-index: 99999;
        border: 0;
    }

    .image_info_image{
        width: 38px;
        height: 38px;
    }

    .image_plus{
        margin-top: 5px;
        background-size: 38px 38px;
        width: 38px;
        height: 38px;
        z-index: 9999;
        border: 0;
        margin-left: 18px;
    }


    .remontee{
        padding-left: 50px;
        padding-top: 40px;
    }

    .piste{
        padding-left: 50px;
    }

    .prl_info .sector{
        font-weight: bold;
        font-size: 28px;
        margin-top: -6px;
    }

    .prl_info .text{
        /*color: #2a2840;*/
        font-size: 16px;
        font-weight: bold;
        padding-bottom: 5px;
    }

    .prl_info .prl_name .text{
        /*color: #2a2840;*/
        text-align: left;
        font-size: 16px;
        font-weight: bold;
        white-space: nowrap;
    }
    .prl_info .prl_name .subtext{
        text-align: left;
        margin-top: -10px;
        font-size: 10px;
        white-space: nowrap;
        /*color: #3e3c52;*/
        font-style: italic;
    }

    .prl_group{
        display: flex;
        margin-bottom: 2px;
    }

    .left{
        text-align: left;
    }

    .right{
        text-align: right;
        margin-top: -45px;
    }

    .right_bold{
        font-size: 26px;
        font-weight: bold;
    }

    .image_status{
        height: 34px;
        width: 34px;
        margin-top: 3px;
        margin-left: -20px;
    }

    .image_tooltip{
        margin-left: 10px;
        height: 30px;
        width: 30px;
    }

    .image_tooltip_vent{
        margin-left: 12px;
        margin-top: 2px;
        height: 20px;
        width: 20px;
    }

    .image_tooltip_avalanche{
        margin-left: -21px;
        height: 65px;
        width: 65px;
    }
}


@media screen and (max-width: 768px){
    .jumbotron .row{
        margin-top: 1px;
        margin-bottom: 30px;
    }
}

@media screen and (min-width: 768px){
    .jumbotron .row{
        margin-top: -20px;
    }
}


.title{
    display: flex;
}

.jumbotron .right_weather {
    margin-bottom: -15px;
}

@media screen and (width: 768px){
    .right_weather .avalanche .image{
        margin-left: -60px;
        height: 64px;
        margin-top: 68px;
    }

    .left_weather .icon{
        margin-top: 40px;
        text-align: center;
    }

    .left_weather .icon .image{
        margin-top: 14px;
        width: 40px;
        height: 40px;
    }

    .left_weather .icon .image_vent {
        margin-top: 12px;
        margin-bottom: 5px;
        margin-right: 60px;
        width: 40px;
        height: 40px;
    }

    .left_weather .icon .text{
        font-weight: bold;
        font-size: 14px;
        /*color: #2a2840;*/
        white-space: nowrap;
    }

    .left_weather .icon .text_vent{
        font-weight: bold;
        font-size: 14px;
        /*color: #2a2840;*/
    }

    .left_weather .icon .subtext{
        font-size: 12px;
        color: #2a2840;
        /*white-space: nowrap;*/
    }

    .left_weather .icon .subtext_vent{
        margin-top: -24px;
        margin-left: 28px;
        font-size: 14px;
        /*color: #2a2840;*/
        white-space: nowrap;
    }

    .left_weather .icon .subtext .bold{
        font-weight: bold;
        font-size: 16px;
        /*color: #2a2840;*/
    }

    .left_weather .icon .subtext_vent .bold{
        font-weight: bold;
        font-size: 16px;
        /*color: #2a2840;*/
        margin-left: -12px;
    }

    .middle_weather .icon{
        margin-top: 40px;
        text-align: center;
    }

    .middle_weather .icon .image{
        margin-top: 14px;
        margin-left: 5px;
        width: 40px;
        height: 40px;
    }

    .middle_weather .icon .text{
        font-weight: bold;
        font-size: 14px;
        /*color: #2a2840;*/
        white-space: nowrap;
    }

    .middle_weather .icon .text_italic{
        margin-top: 2px;
        font-style: italic;
        font-size: 12px;
        /*color: #2a2840;*/
        white-space: nowrap;
    }

    .middle_weather .icon .subtext{
        font-size: 12px;
        /*color: #2a2840;*/
        white-space: nowrap;
    }

    .middle_weather .icon .subtext .bold{
        font-weight: bold;
        font-size: 16px;
        /*color: #2a2840;*/
    }

    .right_weather .avalanche{
        text-align: center;
        margin-top: 40px;
        display: flex;
    }

    .right_weather .avalanche .text{
        margin-left: 10px;
        font-weight: bold;
        font-size: 16px;
        color: #2a2840;
        margin-top: 32px;
    }

    .right_weather .avalanche .text .bold{
        font-size: 32px;
        color: #2a2840;
    }

    .title .image_text {
        height: 50px;
        min-width: 50px;
        margin-left: 80%;
        max-height: 32px;
        margin-top: 1px;
    }

    .title .text {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        font-size: 40px;
        text-transform: uppercase;
        padding-left: 30px;
        white-space: nowrap;
        font-weight: normal;
    }

    .avalanche_libelle {
        display: none;
    }

    .title_tooltip{
        color: #2a2840;
        font-weight: bold;
        font-size: 16px;
        white-space: nowrap;
    }

    .text_tooltip{
        color: #2a2840;
        font-weight: bold;
        font-size: 11px;
        white-space: nowrap;
    }

    .image_tooltip{
        margin-left: -10px;
    }

    .image_tooltip_vent{
        margin-left: -10px;
    }
}

@media screen and (min-width: 769px) {
    .right_weather .avalanche .image{
        margin-left: -30px;
        height: 64px;
        margin-top: 30px;
    }

    .left_weather .icon{
        margin-top: 40px;
        text-align: center;
    }

    .left_weather .icon .image{
        margin-top: 14px;
        width: 40px;
        height: 40px;
    }

    .left_weather .icon .image_vent {
        margin-top: 12px;
        margin-bottom: 5px;
        margin-right: 60px;
        width: 40px;
        height: 40px;
    }

    .left_weather .icon .text{
        font-weight: bold;
        font-size: 14px;
        /*color: #2a2840;*/
        white-space: nowrap;
    }

    .left_weather .icon .text_vent{
        font-weight: bold;
        font-size: 14px;
        /*color: #2a2840;*/
    }

    .left_weather .icon .subtext{
        font-size: 12px;
        /*color: #2a2840;*/
        white-space: nowrap;
    }

    .left_weather .icon .subtext_vent{
        margin-top: -24px;
        margin-left: 28px;
        font-size: 14px;
        /*color: #2a2840;*/
        white-space: nowrap;
    }

    .left_weather .icon .subtext .bold{
        font-weight: bold;
        font-size: 16px;
        /*color: #2a2840;*/
    }

    .left_weather .icon .subtext_vent .bold{
        font-weight: bold;
        font-size: 16px;
        /*color: #2a2840;*/
        margin-left: -12px;
    }

    .middle_weather .icon{
        margin-top: 40px;
        text-align: center;
    }

    .middle_weather .icon .image{
        margin-top: 14px;
        margin-left: 5px;
        width: 40px;
        height: 40px;
    }

    .middle_weather .icon .text{
        font-weight: bold;
        font-size: 14px;
        /*color: #2a2840;*/
        white-space: nowrap;
    }

    .middle_weather .icon .text_italic{
        margin-top: 2px;
        font-style: italic;
        font-size: 12px;
        /*color: #2a2840;*/
        white-space: nowrap;
    }

    .middle_weather .icon .subtext{
        font-size: 12px;
        /*color: #2a2840;*/
        white-space: nowrap;
    }

    .middle_weather .icon .subtext .bold{
        font-weight: bold;
        font-size: 16px;
        /*color: #2a2840;*/
    }

    .right_weather .avalanche{
        text-align: center;
        margin-top: 40px;
        display: flex;
    }

    .right_weather .avalanche .text{
        margin-left: 10px;
        font-weight: bold;
        font-size: 16px;
        color: #2a2840;
        margin-top: 32px;
        white-space: nowrap;
    }

    .right_weather .avalanche .text .bold{
        font-size: 32px;
        color: #2a2840;
    }

    .libelle_avalanche {
        font-weight: bold;
        margin-left: 10px;
        text-align: center;
        margin-top: -20px;
        color: #2a2840;
        white-space: nowrap;
    }

    .title .image_text {
        height: 50px;
        min-width: 50px;
        margin-left: 80%;
        max-height: 32px;
        margin-top: 1px;
    }

    .title .text {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        font-size: 40px;
        text-transform: uppercase;
        padding-left: 30px;
        white-space: nowrap;
        font-weight: normal;
    }

    .avalanche_libelle {
        display: none;
    }

    .title_tooltip{
        color: #2a2840;
        font-weight: bold;
        font-size: 16px;
        white-space: nowrap;
    }

    .text_tooltip{
        color: #2a2840;
        font-weight: bold;
        font-size: 11px;
        white-space: nowrap;
    }

    .image_tooltip{
        margin-left: -10px;
    }

    .image_tooltip_vent{
        margin-left: -10px;
    }
}

@media screen and (max-width: 767px) and (min-width: 450px){

    .title .image_text {
        height: 30px;
        min-width: 30px;
        margin-left: 80%;
    }

    .title .text {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        font-size: 28px;
        text-transform: uppercase;
        padding-left: 14px;
        white-space: nowrap;
    }

    .avalanche_libelle{
        font-weight: bold;
        font-size: 16px;
        color: #2a2840;
        text-align: right;
        vertical-align: middle;
        margin-top: -16px;
        white-space: nowrap;
    }


    .left_weather .icon{
        text-align: center;
    }

    .left_weather .icon .image{
        width: 40px;
        height: 40px;
    }

    .left_weather .icon .image_vent {
        margin-right: 60px;
        width: 40px;
        height: 40px;
    }

    .left_weather .icon .text{
        font-weight: bold;
        font-size: 12px;
        /*color: #2a2840;*/
        white-space: nowrap;
    }

    .left_weather .icon .text_vent{
        font-weight: bold;
        font-size: 12px;
        /*color: #2a2840;*/
    }

    .left_weather .icon .subtext{
        font-size: 12px;
        /*color: #2a2840;*/
    }

    .left_weather .icon .subtext_vent{
        margin-top: -10px;
        margin-left: 5px;
        font-size: 12px;
        /*color: #2a2840;*/
        white-space: nowrap;
    }

    .left_weather .icon .subtext .bold{
        font-weight: bold;
        font-size: 16px;
        /*color: #2a2840;*/
    }

    .left_weather .icon .subtext_vent .bold{
        font-weight: bold;
        font-size: 16px;
        /*color: #2a2840;*/
    }

    .middle_weather .icon{
        text-align: center;
    }

    .middle_weather .icon .image{
        margin-top: -24px;
        width: 40px;
        height: 40px;
    }

    .middle_weather .icon .text{
        font-weight: bold;
        font-size: 12px;
        /*color: #2a2840;*/
        white-space: nowrap;
    }

    .middle_weather .icon .text_italic{
        font-style: italic;
        font-size: 12px;
        /*color: #2a2840;*/
        white-space: nowrap;
    }

    .middle_weather .icon .subtext{
        font-size: 12px;
        /*color: #2a2840;*/
        white-space: nowrap;
    }

    .middle_weather .icon .subtext .bold{
        font-weight: bold;
        font-size: 16px;
        /*color: #2a2840;*/
    }

    .right_weather .avalanche{
        text-align: center;
        margin-top: -20px;
    }

    .right_weather .avalanche .text{
        font-weight: bold;
        font-size: 16px;
        color: #2a2840;
        white-space: nowrap;
    }

    .right_weather .avalanche .text .bold{
        margin-top: -20px;
        font-size: 32px;
        color: #2a2840;
    }

    .libelle_avalanche {
        font-weight: bold;
        margin-left: 90px;
        text-align: center;
        margin-top: -20px;
        color: #2a2840;
    }

    .right_weather .avalanche .image{
        margin-left: -20px;
        height: 60px;
    }

    .title_tooltip{
        color: #2a2840;
        font-weight: bold;
        font-size: 16px;
        white-space: nowrap;
    }

    .text_tooltip{
        color: #2a2840;
        font-weight: bold;
        font-size: 12px;
        white-space: nowrap;
    }

    .image_tooltip{
        margin-left: -10px;
    }

    .image_tooltip_vent{
        margin-left: -10px;
    }
}

@media screen and (max-width: 925px) and (min-width: 769px){
    .right_weather .avalanche .image{
        margin-left: -20px;
        height: 38px;
        margin-top: 42px;
    }
}

@media screen and (max-width: 1300px) and (min-width: 925px){
    .right_weather .avalanche .image{
        margin-left: -20px;
        height: 38px;
        margin-top: 42px;
    }
}

@media screen and (max-width: 538px) and (min-width: 450px){
    .title .image_text {
        height: 26px;
        min-width: 26px;
        margin-left: 80%;
    }

    .title .text {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        font-size: 24px;
        text-transform: uppercase;
        padding-left: 14px;
        white-space: nowrap;
    }
}

@media screen {
    .card{
        margin-top: 20px;
        border-radius: 30px;
        background-color: white;
        border-color: transparent;
        box-shadow:  0 4px 10px -4px rgba(36,40,47,.25);
        margin-bottom: 20px;
    }
}


.card .weather{
    border-radius: 0 0 30px 30px;
    background-color: white;
    padding-bottom: 0;
}



.card .calendar_group .row .calendar {
    margin-top: 10px;
}

.card .calendar_group{
    border-radius: 20px 20px 20px 20px;
    background-color: white;
}


@media screen and (min-width: 1px) and (max-width: 627px){
    .calendar .image_text{
        margin-left: -16px;
        height: 12px;
        width: 12px;
        vertical-align: center;
        margin-top: 6px;
        float: left;
    }

    .calendar .text{
        color: #2a2840;
        font-size: 7px;
        margin-right: -40px;
        line-height: normal;
    }
}

@media screen and (min-width: 627px) and (max-width: 768px){
    .calendar .image_text{
        height: 40px;
        width: 40px;
        float: left;
        vertical-align: middle;
        margin-right: 10px;
    }

    .calendar .text{
        color: #2a2840;
        font-size: 14px;
        white-space: pre-wrap;
        line-height: 15px;
    }
}

@media screen and (min-width: 768px) and (max-width: 1138px){
    .calendar .image_text{
        height: 20px;
        width: 20px;
        float: left;
        vertical-align: middle;
        margin-right: 10px;
    }

    .calendar .text{
        color: #2a2840;
        font-size: 10px;
    }
}

@media screen and (min-width: 1138px){
    .calendar .image_text{
        height: 40px;
        width: 40px;
        float: left;
        vertical-align: middle;
        margin-right: 10px;
        margin-bottom: 2px;
    }

    .calendar .text{
        color: #2a2840;
        font-size: 14px;
        white-space: pre-wrap;
        line-height: 15px;
    }
}



.centrer{
    text-align: center;
}


.tippy-tooltip{
    border-radius: 20px;
}

.tippy-tooltip.light-theme[data-animatefill]{
    background-color: #fff;
}

.margin_bottom{
    margin-bottom: 5px;
    margin-top: 5px;
}

.tooltip_domaine_image{
    height: 20px;
    text-align: right;
}


@media screen and (min-width: 992px) {
    .border_right_meteo {
        border-right: 1px solid #dce2f3;
        position: absolute;
        top: 14px;
        height: 80px;
        bottom: 10px;
        right: 0px;
    }

    .border_prevision{
        box-shadow:  1px 0px 0px -0px #dce2f3;
    }
}

@media screen and (max-width: 992px){
    .border_right_meteo{
        display: none;
    }

    .border_bottom_prevision {
        border-bottom: 1px solid #dce2f3;
    }
}

@media screen and (max-width: 767px){
    .border_bottom_meteo {
        border-bottom: 1px solid #dce2f3;
    }
}

@media screen and (max-width: 432px){
    .border_top_prl {
        position: relative;
    }


    .card .card-header{
        border-radius: 30px 30px 0 0;
        border-color: transparent;
        text-align: center;
        font-weight: bold;
        font-size: 26px;
        padding-top: 0px;
        padding-bottom: 0px;
        top: -5px;
        min-height: 30px;
    }

    .row_up{
        margin-bottom: -40px;
    }
}

@media screen and (min-width: 432px){
    .border_top_prl {
        position: relative;
        margin-top: -3px;
    }



    .card .card-header{
        border-radius: 30px 30px 0 0;
        border-color: transparent;
        text-align: center;
        font-weight: bold;
        font-size: 26px;
        padding-top: 0px;
        padding-bottom: 0px;
        top: -5px;
        min-height: 40px;
    }

    .row_up{

    }
}

.status{
    margin-right: 0px;
}

.rotated-image {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
}

.SOUTHEAST, .SUDEST {
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
}

.SOUTH, .SUD {
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);
}

.SOUTHWEST, .SUDOUEST {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
}

.EAST, .EST {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

.WEST, .OUEST {
    -webkit-transform: rotate(225deg);
    transform: rotate(225deg);
}

.NORTHWEST, .NORDOUEST {
    -webkit-transform: rotate(270deg);
    transform: rotate(270deg);
}

.NORTH, .NORD {
    -webkit-transform: rotate(315deg);
    transform: rotate(315deg);
}

.NORTHEAST, .NORDEST {
}

.UNDEFINED, .NONDEFINI {
    display: none;
}

svg {
    fill: currentColor;
}

@media screen and (min-width: 468px) and (max-width: 1110px){
    .true{
        margin-left: 20px;
    }
}

@media screen and (max-width: 468px){
    .true{
        display: none;
    }
}


@media screen and (min-width: 1260px){
    .border_right{
        position: relative;
        border-right: 1px solid #dce2f3;
        padding-left: 3%;
    }
}

.bottom{
    margin-bottom: 40px;
}


@media screen and (min-width: 1000px){
    .intro .image_longue{
        margin-top: -26px;
        margin-bottom: -20px;
    }
}

@media screen and (max-width: 1000px) and (min-width: 752px){
    .intro .image_longue{
        margin-top: 56px;
        margin-bottom: -20px;
        margin-left: -250px;
    }
}

@media screen and (max-width: 752px){
    .intro .image_longue{
        margin-top: -26px;
        margin-bottom: 20px;
    }
}

.espace_ludique{
    top: 40px;
    margin-right: 24px;
    margin-bottom: 50px;
    min-width: 90px;
    max-height: 90px;
}


.left_calendrier{
    margin-left: -8px;
}



@media screen and (min-width: 1600px) {
    .espace_ludique_texte{
        position: absolute;
        top: 105px;
        line-height: 12px;
        font-size: 12px;
        width: 50%;
        text-align: center;
        margin-left: -10px;
    }

    .espace_ludique .text{
        margin-top: -40px;
        text-align: center;
    }

    .opoualand{
        min-height: 20px;
        height: 40px;
        width: 120px;
        padding-top: 10px;
        min-width: 60px;
        margin-left: -15px;
    }

    .waouland {
        min-height: 20px;
        height: 40px;
        width: 120px;
        padding-top: 10px;
        min-width: 60px;
        margin-left: -15px;
    }

    .flyingdonet{
        min-height: 20px;
        height: 50px;
        min-width: 70px;
        margin-left: -20px;
    }

    .schlitte-mountain{
        min-height: 50px;
        min-width: 50px;
        width: 50px;
        height: 50px;
        margin-left: -10px;
        background-color: #0b2e13;
    }

}

@media screen and (max-width: 1600px) and (min-width: 1400px){
    .espace_ludique_texte{
        position: absolute;
        top: 105px;
        line-height: 12px;
        font-size: 12px;
        width: 40%;
        text-align: center;
        margin-left: -15px;
        min-width: 50px;
    }

    .espace_ludique .text{
        margin-top: -40px;
        text-align: center;
    }

    .opoualand{
        min-height: 20px;
        margin-left: -30px;
        height: 40px;
        width: 80px;
        min-width: 80px;
        padding-top: 10px;
    }

    .waouland {
        min-height: 20px;
        margin-left: -30px;
        height: 40px;
        width: 80px;
        min-width: 80px;
        padding-top: 10px;
    }

    .flyingdonet{
        min-height: 20px;
        height: 50px;
        min-width: 70px;
        margin-left: -25px;
    }

    .schlitte-mountain{
        margin-left: -15px;
        min-height: 20px;
        min-width: 50px;
        height: 50px;
        width: 50px;
    }

}

@media screen and (max-width: 1400px) and (min-width: 753px){
    .espace_ludique_texte{
        padding-top: 15px;
        line-height: 12px;
        font-size: 12px;
        margin-left: -16px;
        margin-right: -16px;
    }

    .espace_ludique .text{
        margin-top: -40px;
        text-align: center;
    }

    .opoualand{
        min-height: 20px;
        margin-left: -30px;
        height: 40px;
        width: 80px;
        min-width: 80px;
        padding-top: 10px;
    }

    .waouland {
        min-height: 20px;
        margin-left: -30px;
        height: 40px;
        width: 80px;
        min-width: 80px;
        padding-top: 10px;
    }

    .flyingdonet{
        min-height: 20px;
        height: 50px;
        min-width: 70px;
        margin-left: -25px;
    }

    .schlitte-mountain{
        margin-left: -15px;
        min-height: 20px;
        min-width: 50px;
        height: 50px;
        width: 50px;
    }

}

@media screen and (max-width: 753px) and (min-width: 600px){
    .espace_ludique_texte{
        position: absolute;
        top: 105px;
        line-height: 12px;
        font-size: 12px;
        width: 40%;
        text-align: center;
        margin-left: -10px;
        min-width: 50px;
    }

    .espace_ludique .text{
        margin-top: -30px;
        text-align: center;
    }

    .opoualand{
        min-height: 20px;
        margin-left: -25px;
        height: 40px;
        width: 80px;
        min-width: 80px;
        padding-top: 10px;
    }

    .waouland {
        min-height: 20px;
        margin-left: -25px;
        height: 40px;
        width: 80px;
        min-width: 80px;
        padding-top: 10px;
    }

    .flyingdonet{
        min-height: 20px;
        height: 50px;
        min-width: 70px;
        margin-left: -20px;
    }

    .schlitte-mountain{
        margin-left: -15px;
        min-height: 20px;
        min-width: 60px;
        height: 60px;
        width: 60px;
    }

}

@media screen and (max-width: 600px) and (min-width: 568px){
    .espace_ludique_texte{
        position: absolute;
        top: 105px;
        line-height: 12px;
        font-size: 12px;
        width: 40%;
        text-align: center;
        min-width: 50px;
        margin-left: -15px;
    }


    .espace_ludique .text{
        margin-top: -30px;
        text-align: center;
    }

    .opoualand{
        min-height: 20px;
        margin-left: -30px;
        height: 40px;
        width: 80px;
        min-width: 80px;
        padding-top: 10px;
    }

    .waouland {
        min-height: 20px;
        margin-left: -30px;
        height: 40px;
        width: 80px;
        min-width: 80px;
        padding-top: 10px;
    }

    .flyingdonet{
        min-height: 20px;
        height: 50px;
        min-width: 70px;
        margin-left: -15px;
    }

    .schlitte-mountain{
        margin-left: -25px;
        min-height: 20px;
        min-width: 60px;
        height: 60px;
        width: 60px;
    }

}

@media screen and (max-width: 568px) and (min-width: 553px){
    .espace_ludique_texte{
        position: absolute;
        top: 80px;
        line-height: 12px;
        font-size: 12px;
        width: 40%;
        text-align: center;
        min-width: 50px;
        margin-left: -15px;
    }

    .espace_ludique .text{
        margin-top: -20px;
        text-align: center;
    }

    .opoualand{
        padding-top: 20px;
        margin-left: -28px;
        min-height: 30px;
        min-width: 76px;
        height: 40px;
        width: 76px;
    }

    .waouland{
        padding-top: 20px;
        margin-left: -28px;
        min-height: 30px;
        min-width: 76px;
        height: 40px;
        width: 76px;
    }


    .flyingdonet{
        margin-left: -15px;
        min-height: 45px;
        min-width: 55px;
        height: 45px;
        width: 55px;
    }

    .schlitte-mountain{
        min-height: 45px;
        min-width: 45px;
        height: 45px;
        width: 45px;
        margin-left: -15px;
    }

}

@media screen and (max-width: 553px) and (min-width: 452px) {
    .espace_ludique_texte{
        position: absolute;
        top: 95px;
        line-height: 12px;
        font-size: 12px;
        margin-left: -12px;
        width: 50%;
        text-align: center;
    }

    .espace_ludique .text{
        margin-top: -30px;
        text-align: center;
    }

    .opoualand{
        padding-top: 20px;
        margin-left: -20px;
        min-height: 40px;
        min-width: 60px;
        height: 40px;
        width: 60px;
    }

    .waouland{
        padding-top: 20px;
        margin-left: -20px;
        min-height: 40px;
        min-width: 60px;
        height: 40px;
        width: 60px;
    }

    .flyingdonet{
        margin-left: -20px;
        min-height: 50px;
        min-width: 60px;
        height: 50px;
        width: 60px;
    }

    .schlitte-mountain{
        margin-left: -15px;
        min-height: 50px;
        min-width: 50px;
        height: 50px;
        width: 50px;
    }

}

@media screen and (max-width: 452px) {
    .espace_ludique_texte{
        padding-top: 5px;
        line-height: 10px;
        font-size: 10px;
        margin-left: -20px;
        margin-right: -20px;
    }

    .espace_ludique .text{
        margin-top: -60px;
        text-align: center;
    }

    .espace_ludique .img-fluid{
        margin-left: -16px;
        min-height: 16px;
        height: 16px;
        /*width: 48px;
        min-width: 48px;*/
    }

}

.border_top_prl:after{
    content: "";
    position: absolute;
    right: 2%;
    z-index: 100;
    width: 96%;
    /*border-top: solid;*/
    border-bottom: solid;
    margin-top: -1px;
    border-width: thin;
    color: #dce2f3;
}

@media screen and (min-width: 450px) {
    .border_bottom_prl:before{
        content: "";
        position: absolute;
        right: 2%;
        z-index: 100;
        width: 96%;
        border-top: solid;
        margin-top: 35px;
        border-width: thin;
        color: #dce2f3;
    }
}


@media screen and (min-width: 1416px){
    .calendar_group_table .image{
        height: 20px;
    }

    table{
        line-height: 0;
    }

    .calendar_group_table .text{
        font-size: 16px;
        line-height: 16px;
        font-weight: lighter;
    }

    .calendar_group_table .image_text{
        position: absolute;
        min-height: 20px;
        height: 20px;
    }

    .calendar_group_table .image_text_aurore{
        position: absolute;
        min-height: 32px;
        height: 32px;
        margin-top: -6px;
    }

    .calendar_group_table .border_right_calendar{
        position: relative;
    }

    .calendar_group_table .border_right_calendar::after{
        content: '';
        border-right: 1px solid #dce2f3;
        position: absolute;
        height: 80%;
        top: 10%;
        right: 18%;
    }
}


@media screen and (max-width: 1416px) and (min-width: 944px){
    .calendar_group_table .image{
        height: 18px;
    }

    table{
        line-height: 0;
    }

    .calendar_group_table .text{
        font-size: 15px;
        line-height: 15px;
        font-weight: normal;
    }

    .calendar_group_table .image_text{
        position: absolute;
        min-height: 18px;
        height: 18px;
    }

    .calendar_group_table .image_text_aurore{
        position: absolute;
        min-height: 28px;
        height: 28px;
        margin-top: -6px;
        margin-left: 1px;
    }

    .calendar_group_table .border_right_calendar{
        position: relative;
    }

    .calendar_group_table .border_right_calendar::after{
        content: '';
        border-right: 1px solid #dce2f3;
        position: absolute;
        height: 80%;
        top: 10%;
        right: 4%;
    }
}

@media screen and (max-width: 944px) and (min-width: 768px){
    .calendar_group_table .image{
        height: 16px;
    }

    th{
        max-width: 12px;
        width: 12px;
    }

    table{
        line-height: 0;
    }

    .calendar_group_table .text{
        font-size: 13px;
        line-height: 13px;
        font-weight: normal;
    }

    .calendar_group_table .image_text{
        position: absolute;
        min-height: 18px;
        height: 18px;
    }

    .calendar_group_table .image_text_aurore{
        position: absolute;
        min-height: 28px;
        height: 28px;
        margin-top: -6px;
        margin-left: 1px;
    }

    .calendar_group_table .border_right_calendar{
        position: relative;
    }

    .calendar_group_table .border_right_calendar::after{
        content: '';
        border-right: 1px solid #dce2f3;
        position: absolute;
        height: 80%;
        top: 10%;
        right: 4%;
    }
}

@media screen and (max-width: 768px) and (min-width: 385px){
    .calendar_group_table .image{
        height: 16px;
    }

    th{
        max-width: 12px;
        width: 12px;
    }

    table{
        line-height: 0;
    }

    .calendar_group_table .text{
        font-size: 13px;
        line-height: 13px;
        font-weight: normal;
    }

    .calendar_group_table .image_text{
        position: absolute;
        min-height: 18px;
        height: 18px;
    }

    .calendar_group_table .image_text_aurore{
        position: absolute;
        min-height: 28px;
        height: 28px;
        margin-top: -6px;
        margin-left: 1px;
    }

    .calendar_group_table .border_right_calendar{
        position: relative;
    }

    .calendar_group_table .border_right_calendar::after{
        content: '';
        border-right: 1px solid #dce2f3;
        position: absolute;
        height: 80%;
        top: 10%;
        right: 18%;
    }
}

@media screen and (min-width: 768px){
    .taille{
        margin-top: -25px;
    }
}

@media screen and (max-width: 385px) and (min-width: 270px){
    .calendar_group_table .image{
        height: 8px;
    }

    th{
        max-width: 0px;
        width: 0px;
    }

    table{
        line-height: 0;
    }

    .calendar_group_table .text{
        font-size: 8px;
        line-height: 8px;
        font-weight: normal;
    }

    .calendar_group_table .image_text{
        position: absolute;
        min-height: 16px;
        height: 16px;
    }

    .calendar_group_table .image_text_aurore{
        position: absolute;
        min-height: 24px;
        height: 24px;
        margin-top: -6px;
        margin-left: 1px;
    }

    .calendar_group_table .border_right_calendar{
        position: relative;
    }

    .calendar_group_table .border_right_calendar::after{
        content: '';
        border-right: 1px solid #dce2f3;
        position: absolute;
        height: 80%;
        top: 10%;
        right: 4%;
    }
}

@media screen and (max-width: 270px) and (min-width: 150px){
    .calendar_group_table .image{
        height: 5px;
    }

    th{
        max-width: 0px;
        width: 0px;
    }

    table{
        line-height: 0;
    }

    .calendar_group_table .text{
        font-size: 5px;
        line-height: 5px;
        font-weight: normal;
    }

    .calendar_group_table .image_text{
        position: absolute;
        min-height: 8px;
        height: 8px;
    }

    .calendar_group_table .image_text_aurore{
        position: absolute;
        min-height: 16px;
        height: 16px;
        margin-top: -6px;
        margin-left: 1px;
    }

    .calendar_group_table .border_right_calendar{
        position: relative;
    }

    .calendar_group_table .border_right_calendar::after{
        content: '';
        border-right: 1px solid #dce2f3;
        position: absolute;
        height: 80%;
        top: 10%;
        right: 4%;
    }
}

@media screen and (min-width: 900px){
    .table_calendar .card{
        min-width: 350px;
    }
}

@media screen and (min-width: 650px) and (max-width: 768px){
    .table_calendar .card{
        min-width: 330px;
        max-width: 330px;
        margin-left: 30px;
    }
}

@media screen and (min-width: 768px) and (max-width: 900px){
    .table_calendar .card{
        min-width: 330px;
        max-width: 330px;
        margin-left: -30px;
    }
}

@media screen and (min-width: 576px) and (max-width: 650px){
    .table_calendar .card{
        min-width: 330px;
        max-width: 330px;
        margin-left: 30px;
    }
}


@media screen and (min-width: 380px) and (max-width: 400px){
    .table_calendar .card{
        min-width: 320px;
    }
}

@media screen and (min-width: 150px) and (max-width: 380px){
    .table_calendar .card{
        min-width: 240px;
        margin-left: -30px;
    }
}


.bold_calendar{
    font-weight: 900;
}

.bottom_calendar{
    margin-bottom: 5px;
    /*color: #70767b;*/
    background-color: transparent;
    border-radius: 30px;
}

@media screen and (width: 768px) {
    .weather_icon{
        margin-bottom: -80px;
    }
}

@media screen and (min-width: 1650px){
    .libelle_tableau{
        position: relative;
        font-size: 12px;
        letter-spacing: -1px;
        top: 9px;
        left: 3px;
    }
}

@media screen and (max-width: 1650px) and (min-width: 768px){
    .libelle_tableau{
        display: none;
    }
}

@media screen and (max-width: 768px) and (min-width: 576px){
    .libelle_tableau{
        position: relative;
        font-size: 12px;
        letter-spacing: -1px;
        top: 9px;
        left: 15px;
    }
    .libelle_tableau{
        display: none;
    }
}

@media screen and (max-width: 576px) and (min-width: 1px){
    .libelle_tableau{
        display: none;
    }
}

@media screen and (max-width: 450px){
    .prl_info .prl_message .text{
        text-align: left;
        text-transform: uppercase;
        font-weight: bold;
        font-style: italic;
        color: #b71616;
        font-size: 9px;
        margin-top: 14px;
        margin-left: 28px;
        margin-right: -20px;
        white-space: initial;
        line-height: 10px;
    }
}

@media screen and (min-width: 450px) and (max-width: 1150px){
    .prl_info .prl_message .text{
        text-align: left;
        text-transform: uppercase;
        font-weight: bold;
        font-style: italic;
        color: #b71616;
        font-size: 9px;
        margin-top: 20px;
        margin-left: 5px;
        margin-right: -16px;
        white-space: initial;
        line-height: 10px;
    }
}

@media screen and (min-width: 1150px) and (max-width: 1600px){
    .prl_info .prl_message .text{
        text-align: left;
        text-transform: uppercase;
        font-weight: bold;
        font-style: italic;
        color: #b71616;
        font-size: 10px;
        margin-top: 23px;
        margin-left: -8px;
        margin-right: -16px;
        white-space: initial;
        line-height: 10px;
    }
}

@media screen and (min-width: 1600px){
    .prl_info .prl_message .text{
        text-align: left;
        text-transform: uppercase;
        font-weight: bold;
        font-style: italic;
        color: #b71616;
        font-size: 11px;
        margin-top: 20px;
        margin-left: -10px;
        margin-right: -16px;
        white-space: initial;
        line-height: 10px;
    }
}

@media screen and (max-width: 450px){
    .img_type{
        height: 15px;
        margin-left: 15px;
    }
}

@media screen and (min-width: 450px){
    .img_type{
        height: 27px;
        margin-top: 5px;
        margin-left: -5px;
    }
}

@media screen and (min-width: 768px) and (max-width: 955px){
    .lastCircle{
        margin-left: 230px;
        margin-top: -50px;
    }
}

@media screen and (min-width: 340px) and (max-width: 767px){
    .center-meteo-smartphone{
        margin-bottom: -30px;
    }
}

.littleText{
    display: none;
}

.longText{
    display: block;
    margin-bottom: 5px;
}


@media screen and (max-width: 991px){
    .ajustement_margin_top{
        margin-top: 14px;
    }
}

@media screen and (min-width: 1900px) and (max-width: 2000px){
    .prl_info .prl_name .text{
        text-overflow: ellipsis;
        width: 450px;
        overflow: hidden;
    }
}

@media screen and (min-width: 1800px) and (max-width: 1900px){
    .prl_info .prl_name .text{
        text-overflow: ellipsis;
        width: 430px;
        overflow: hidden;
    }
}

@media screen and (min-width: 1700px) and (max-width: 1800px){
    .prl_info .prl_name .text{
        text-overflow: ellipsis;
        width: 400px;
        overflow: hidden;
    }
}

@media screen and (min-width: 1600px) and (max-width: 1700px){
    .prl_info .prl_name .text{
        text-overflow: ellipsis;
        width: 366px;
        overflow: hidden;
    }
}

@media screen and (min-width: 1500px) and (max-width: 1600px){
    .prl_info .prl_name .text{
        text-overflow: ellipsis;
        width: 333px;
        overflow: hidden;
    }
}

@media screen and (min-width: 1400px) and (max-width: 1500px){
    .prl_info .prl_name .text{
        text-overflow: ellipsis;
        width: 300px;
        overflow: hidden;
    }
}

@media screen and (min-width: 1300px) and (max-width: 1400px){
    .prl_info .prl_name .text{
        text-overflow: ellipsis;
        width: 280px;
        overflow: hidden;
    }
}

@media screen and (min-width: 1200px) and (max-width: 1300px){
    .prl_info .prl_name .text{
        text-overflow: ellipsis;
        width: 260px;
        overflow: hidden;
    }
}

@media screen and (min-width: 1100px) and (max-width: 1200px){
    .prl_info .prl_name .text{
        text-overflow: ellipsis;
        width: 240px;
        overflow: hidden;
    }
}

@media screen and (min-width: 992px) and (max-width: 1100px){
    .prl_info .prl_name .text{
        text-overflow: ellipsis;
        width: 210px;
        overflow: hidden;
    }
}

@media screen and (min-width: 900px) and (max-width: 992px){
    .prl_info .prl_name .text{
        text-overflow: ellipsis;
        width: 380px;
        overflow: hidden;
    }
}

@media screen and (min-width: 850px) and (max-width: 900px){
    .prl_info .prl_name .text{
        text-overflow: ellipsis;
        width: 360px;
        overflow: hidden;
    }
}

@media screen and (min-width: 800px) and (max-width: 850px){
    .prl_info .prl_name .text{
        text-overflow: ellipsis;
        width: 330px;
        overflow: hidden;
    }
}

@media screen and (min-width: 769px) and (max-width: 800px){
    .prl_info .prl_name .text{
        text-overflow: ellipsis;
        width: 310px;
        overflow: hidden;
    }
}

@media screen and (min-width: 750px) and (max-width: 769px){
    .prl_info .prl_name .text{
        text-overflow: ellipsis;
        width: 454px;
        overflow: hidden;
    }
}

@media screen and (min-width: 700px) and (max-width: 750px){
    .prl_info .prl_name .text{
        text-overflow: ellipsis;
        width: 416px;
        overflow: hidden;
    }
}

@media screen and (min-width: 650px) and (max-width: 700px){
    .prl_info .prl_name .text{
        text-overflow: ellipsis;
        width: 380px;
        overflow: hidden;
    }
}

@media screen and (min-width: 600px) and (max-width: 650px){
    .prl_info .prl_name .text{
        text-overflow: ellipsis;
        width: 330px;
        overflow: hidden;
    }
}

@media screen and (min-width: 550px) and (max-width: 600px){
    .prl_info .prl_name .text{
        text-overflow: ellipsis;
        width: 320px;
        overflow: hidden;
    }
}

@media screen and (min-width: 500px) and (max-width: 550px){
    .prl_info .prl_name .text{
        text-overflow: ellipsis;
        width: 276px;
        overflow: hidden;
    }
}

@media screen and (min-width: 450px) and (max-width: 500px){
    .prl_info .prl_name .text{
        text-overflow: ellipsis;
        width: 240px;
        overflow: hidden;
    }
}

@media screen and (min-width: 420px) and (max-width: 450px){
    .prl_info .prl_name .text{
        text-overflow: ellipsis;
        width: 230px;
        overflow: hidden;
    }
}

@media screen and (min-width: 390px) and (max-width: 420px){
    .prl_info .prl_name .text{
        text-overflow: ellipsis;
        width: 210px;
        overflow: hidden;
    }
}

@media screen and (min-width: 360px) and (max-width: 390px){
    .prl_info .prl_name .text{
        text-overflow: ellipsis;
        width: 186px;
        overflow: hidden;
    }
}

@media screen and (min-width: 330px) and (max-width: 360px){
    .prl_info .prl_name .text{
        text-overflow: ellipsis;
        width: 170px;
        overflow: hidden;
    }
}

.card-columns {
    column-count: 2;
}