div.mainmenu.eventsmod {
    background-image: url(../../eventsmod/img/object_eventsmod1.png);
    background-size: 19px;
}


.form_eventsmod .etapes {
    /*display: block;*/
    position: relative;
    padding-left: 28px;
    margin-left: 13px;
    margin-bottom: 12px;
    cursor: pointer;
    /*font-size: 22px;*/
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    float: right;
}

/* Hide the browser's default radio button */
.form_eventsmod .etapes input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
}

/* Create a radio button */
.form_eventsmod .radio {
    position: absolute;
    top: -4px;
    left: 0;
    height: 25px;
    width: 25px;
    background-color: #eee;
    border-radius: 50%;
    border: 1px solid #ccc !important;
}

/* On mouse-over, add a grey background color */
.form_eventsmod .etapes:hover input ~ .radio {
  background-color: #ccc;
}

/* When the radio button is checked, add a blue background */
.form_eventsmod .etapes input:checked ~ .radio {
  background-color: #2196F3;
}

/* Create the indicator (the dot/circle - hidden when not checked) */
.form_eventsmod .radio:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the indicator (dot/circle) when checked */
.form_eventsmod .etapes input:checked ~ .radio:after {
  display: block;
}

/* Style the indicator (dot/circle) */
.form_eventsmod .etapes .radio:after {
    top: 8px;
    left: 8px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: white;
}

.form_eventsmod .rating{
    /*width: 25% !important;*/
    float: left;
}

.form_eventsmod .fichecenter td input{
    width: 85%;
}

.form_eventsmod input.datetimepicker_events{
  width: 40% !important;
} 

input.max_participants{
  width: 52% !important;
  display: none;
}

/* css radio max_participants */

.form_eventsmod .max_partc {
    /*display: block;*/
    position: relative;
    padding-left: 28px;
    margin-left: 13px;
    margin-bottom: 12px;
    cursor: pointer;
    /*font-size: 22px;*/
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

/* Hide the browser's default radio button */
.form_eventsmod .max_partc input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
}

/* Create a radio button */
.form_eventsmod .radio_max {
    position: absolute;
    top: 0px;
    left: 0;
    height: 18px;
    width: 18px;
    background-color: #eee;
    border-radius: 50%;
}

/* On mouse-over, add a grey background color */
.form_eventsmod .max_partc:hover input ~ .radio_max {
  background-color: #ccc;
}

/* When the radio_max button is checked, add a blue background */
.form_eventsmod .max_partc input:checked ~ .radio_max {
    background-color: #ffffff ;
    border: 1px solid #0a6526 ;
}

/* Create the indicator (the dot/circle - hidden when not checked) */
.form_eventsmod .radio_max:after {
    content: "";
    position: absolute;
    display: none;
}

/* Show the indicator (dot/circle) when checked */
.form_eventsmod .max_partc input:checked ~ .radio_max:after {
    display: block;
}

/* Style the indicator (dot/circle) */
.form_eventsmod .max_partc .radio_max:after {
    top: 4px;
    left: 4px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #0a6526;
}

.form_eventsmod .rating{
    /*width: 25% !important;*/
    float: left;
}

.form_eventsmod td.first_td{
  width: 34% !important;
}


td.date_events{
  width: 115px !important;
}
td.date_events input{
  width: 100% !important;
}

.communiq .delete:hover{
    text-decoration: none;
    cursor: pointer;
}






.communiq .types {
    /*display: block;*/
    position: relative;
    padding-left: 18px;
    margin-left: 13px;
    margin-bottom: 12px;
    cursor: pointer;
    /*font-size: 22px;*/
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

/* Hide the browser's default radio button */
.communiq .types input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
}

/* Create a radio button */
.communiq .check {
    position: absolute;
    top: -2px;
    left: 0px;
    height: 11px;
    width: 11px;
    border: 2px solid #ccc;
    background-color: #fff;
    /*border-radius: 50%;*/
}

    /* On mouse-over, add a grey background color */
    .communiq .types:hover input ~ .check {
        background-color: #ccc;
    }

    /* When the check button is checked, add a blue background */
    .communiq .types input:checked ~ .check {
        background-color: #21bba9;
        border: 1px solid #21bba9;
    }

    /* Create the indicator (the dot/circle - hidden when not checked) */
    .communiq .check:after {
      content: "\2713";
      position: absolute;
      display: none;
    }

    /* Show the indicator (dot/circle) when checked */
    .communiq .types input:checked ~ .check:after {
      display: block;
    }

    /* Style the indicator (dot/circle) */
   .communiq .types .check:after {
        top: -5px;
        left: 1px;
        font-weight: bold;
        color: white;
        font-size: 10px;
    }
    .communiq .rating{
        /*width: 25% !important;*/
        float: left;
    }


    .communiq .types input:checked ~ .check:after {
    }

    .form_eventsmod span.select2{
        width: 90% !important;
    }

    #list_participants .actions{
        font:normal normal normal 14px/1 FontAwesome;
    }


    #list_participants .actions a{
        font:normal normal normal 14px/1 FontAwesome;
    }

    #list_participants .actions span{
        padding: 3px 0;
    }


    #list_participants .actions span.present{
        padding: 8px;
    }



    #list_participants .remove:hover{
        cursor: pointer;
    }

    #list_participants .actions span.fas {
        font-size: 18px;
    }
    #list_participants .actions .remove {
        color: #c54d49 !important;
        /*position: absolute;*/
    }

    #list_participants .actions .present:after {
        content: "\f149";
        color: #00863e !important;
        /*position: absolute;*/
    }
    
    #list_participants .actions .confirm {
        color: #00863e !important;
    }

    #mailform span.select2{
        width: 50% !important;
    }


    .dashbord_events{
        width: 100%;
    }

    .dashbord_events .event_child{
        width: 33%;
        float: left;
    }

    .dashbord_events .event_child .div_event{
        border:1px solid #ccc; 
        float: left;
        width: 95%;
        margin-bottom: 15px;
    }

    .dashbord_events .date_event{
        width: 22%;
        text-align: center;
        float: left;
        color: #fff !important;
        background: #1ea7a0;
        height: 120px;
    }

    .dashbord_events .date_event a{
        color: #fff !important;
        display: block;
    }

    .dashbord_events .date_event a:hover{
        text-decoration: none;
    }

    .dashbord_events .info_event{
        width: 78%;
        float: left;
    }

    .dashbord_events .lieu{
        color: #ccc;
        font-size: 12px;
        font-weight: bold;
    }

    .dashbord_events .title{
        padding: 10px;
        /*margin-bottom: 5px;*/
    }

    .dashbord_events .info_paticp{
        padding: 10px;
        font-size: 11px;
    }

    .dashbord_events .info_paticp img{
        height: 9px;
    }

    .dashbord_events .tag span{
        color: #fff;
        font-size: 11px;
        font-weight: bold;
        padding: 5px;
        border-radius: 3px;
        float: right;
            border: 1px solid #f3f3f3;
    }

    .dashbord_events .tag{
        float: left;
        width: 50%;
        margin-top: 20px;
    }

    .icon_list{
        cursor: pointer;
        text-decoration: none;
    }

    .icon_list:hover{
        text-decoration: none;
        /*padding: 5px;*/
    }

    .icon_list:hover img{
        background-color: rgba(0, 0, 0, 0.15);
    }

    #list_eventsmod a:hover{
        text-decoration: none !important;
    }
    #list_participants a:hover{
        text-decoration: none !important;
    }

    .mailevents form#mailform input#subject,.mailevents form#mailform textarea#message{
        color:#fff;
        background-color:#fff;
    }

    .mailevents input#sendto{
    }


    #list_participants .etat_present, .calendriereventsmod .fait ,#list_eventsmod .fait{
        padding: 5px;
        color: #fff;
        border-radius: 3px;
        background-color:#c2cc31; 
    }

    
    .calendriereventsmod .confirme, #list_eventsmod .confirme, #list_participants .etat_confirme{
        padding: 5px;
        color: #fff;
        border-radius: 3px;
        background-color:#59D859; 
    }

    .calendriereventsmod .no_confirm, #list_eventsmod .no_confirm, #list_participants .etat_no_confirm{
        padding: 5px;
        color: #fff;
        border-radius: 3px;
        background-color:#FFB164; 
    }

    .calendriereventsmod .confirme_resp #list_eventsmod .confirme_resp{
        padding: 5px;
        color: #fff;
        border-radius: 3px;
        background-color:#FFB164; 
    }

    .calendriereventsmod .annuler, #list_eventsmod .annuler, #list_participants .etat_annuler{
        padding: 5px;
        color: #fff;
        border-radius: 3px;
        background-color:#F59A9A; 
    }

    .calendriereventsmod div.div_etat{
        text-align: right;
    }

    .calendriereventsmod div.div_etat span{
        padding: 2px 4px !important;
        font-size: 12px;
    }

    .calendriereventsmod td.cal_today:hover,.calendriereventsmod .cal_other_month:hover,.calendriereventsmod .cal_current_month:hover {
        background-color: #eff3fb;
    }


    .calendriereventsmod div.eventsmoddiv {
        border: 3px solid #099e93;
        margin-bottom: 7px;
        border-radius: 5px;
    }


    .calendriereventsmod .planedmainte {
        border: 1px dashed #000;
        max-width: calc(100% - 15px);
        width: calc(100% - 15px);
        margin-bottom: 7px;
    }


    .calendriereventsmod .planedmainte a {
        white-space: nowrap;
        font-size: 12px;
    }

    .calendriereventsmod a.eventsmodtable  {
        white-space: nowrap;
        font-size: 12px;
    }

    .calendriereventsmod .contentoftdoverflowed {
        max-height: 270px;
        overflow: auto;
    }


    .calendriereventsmod .by_ a{
        font-size: 14px;
        padding: 10px;
    }


    .calendriereventsmod .by_ a:hover{
        background-color: #ebebeb;
        text-decoration: none; 
    }


    .calendriereventsmod div#search_user{
        float: left;
    }

    .calendriereventsmod div#icon_search {
        float: left;
    }

    .calendriereventsmod .agendacell {
        /*width: 150px !important;*/
        width: 100% !important;
    }

    /*  css card_eventmod  */

    .calendriereventsmod .tagtd {
        display: inline-table !important;
    }


    #list_eventsmod .titl_l{
        width: 90%;
        float: left;
    }

    #list_participants .msg .etoil{
        font-size: 20px !important;
        vertical-align: top;
    }

    #list_participants .msg{
        font-weight: bold;
        font-size: 12px;
    }

.dashbord_events .noevent{
    width: 100%;
    display: inline-block;
    line-height: 15;
    text-align: center;
    border: 1px dashed #cecece;
    border-radius: 4px;
}