.font-gray{
    color: #4A4A4A;
    opacity: 1;
}
.font-40{
    font-size: 2rem;
}
.font-28{
    font-size: 1.2rem;
}
.font-24{
    font-size: 1rem;
}
.font-16{
    font-size: 16px;
}
.font-20{
    font-size: 20px;
}
.font-color-blue{
    color:#7FCDEE;
    text-shadow: 0px 1px 7px #7FCDEE;
    opacity: 1;
}
label {
    font-size: 1.2rem !important;
    font-family: 'Lato';
    text-align: left;
    letter-spacing: 0px;
    color: #4A4A4A !important;
    opacity: 1;
}

.font-blue{
    color:#7FCDEE;
    opacity: 1;
}

.font-darkblue{
   background: #253A65
}

.font-white-opacity{
   color:#ffffff94
}

.opacity{
    opacity: 0.8;
}

.background-gradient{
    background:transparent linear-gradient(275deg, #253A65 0%, #000000 100% ) 0% 0% no-repeat padding-box; ;
}


.box-gradent{
    background-image: url(/images/Rectangle.svg);
    background-repeat: no-repeat;
    background-size: cover;
    transition:  500ms;
    -webkit-transition: 500ms;
}

.box-gradent:hover{
    box-shadow: 0px 0px 10px 5px #DA1177B3;
    opacity: 1;
    color:#fff;
    opacity: 1;
    cursor: pointer;
    transition:  250ms;
    -webkit-transition: 250ms;
}

.resp {
    display: inline-block;
    width: 20%;
    margin-bottom: 4%;
    margin-right: 4%;
}
.menu_hover:hover{
    color:#7FCDEE;
    opacity: 1;
}
.menu_focus{
    color:#7FCDEE !important;
    opacity: 1;
    font-weight:700;
}
.not_active{
    background: #00000033;
}
.not_active_text{
    text-align: center;
    letter-spacing: 0px;
    color: #333333;
    opacity: 1;
}

.active{
    background:#7FCDEE80;
}
.active_text{
    text-align: center;
    letter-spacing: 0px;
    color: #253A65;
    opacity: 1;

}

.draft{
    background:#7FCDEE80;
}
.draft_text{
    text-align: center;
    letter-spacing: 0px;
    color: #253A65;
    opacity: 1;
}
/* .actions_icons{
    display: none;
 } */

.actions:hover .actions_icons{
   display: block;
}
li.paginate_button.page-item.active {
    background: unset;
}
.dataTables_paginate.paging_simple_numbers {
    width: 50%;
}
ul.pagination {
    display: flex;
}
.paginate_button.page-item{
    padding: 10px;
    background: #7FCDEE;
    color: #fff;
    font-weight: 600;
    border-radius: 5px;
    margin-right: 1%;
}

.paginate_button.page-item {
    padding: 10px;
    background: #7FCDEE;
    color: #fff;
    font-weight: 600;
    border-radius: 5px;
    margin-right: 1%;

}

li.paginate_button.page-item.active {
    padding: 10px;
    background: #253a65;
    color: #fff;
    font-weight: bold;
    margin-left: 2%;
    margin-right: 2%;
    border-radius: 5px;

}

.Msave{
    background: #7FCDEE;
    width: 100px;
    opacity: 0.9;
    text-transform: uppercase;
    transition:  500ms;
    -webkit-transition: 500ms;
}
.Msave:hover{
    box-shadow: 0px 0px 10px 5px #7FCDEE ;
    opacity: 1;
    transition:  250ms;
    -webkit-transition: 250ms;
}


.Mcancle{
    width: 100px;
    background-color: #fff;
    border: 1px solid #253A65;
    opacity: 1;
    text-transform: uppercase;
    transition:  500ms;
    -webkit-transition: 500ms;
}
.Mcancle:hover{

    background: #253a6533;
    box-shadow: 0px 0px 10px 5px #253a6533 ;
    transition:  250ms;
    -webkit-transition: 250ms;
}

.lato{
    font-family: 'Lato';
}
.user_M{
        position: relative;
    top: 15px;
}
.not_stated_text{
    text-align: center;
    letter-spacing: 0px;
    color: #333333;
    opacity: 1;
}
.not_started{
    background: #00000033;
}

.finalist_text{
    text-align: center;
    letter-spacing: 0px;
    color: #044334;
    opacity: 1;
}
.finalist{
    background:#0fdbb64d;
}

.submitted_text{
    text-align: center;
    letter-spacing: 0px;
    color: #DB0F43;
    opacity: 1;
}
.submitted{
    background:#DB0F434D;
}
.button_pink{
    background: #DA1177;
    opacity: 0.8;
    transition:  500ms;
    -webkit-transition: 500ms;
}
.button_pink:hover{
    background: #DA1177;
    box-shadow: 0px 0px 6px 3px #DA1177 ;
    opacity: 1;
    transition:  250ms;
    -webkit-transition: 250ms;
}

.modal_class{
background: #FFFFFF 0% 0% no-repeat padding-box;
box-shadow: 0px 0px 10px #7FCDEE;
border: 1px solid #7FCDEE;
border-radius: 5px;
opacity: 1;
}
/* input{
    border: 1px solid #253A65 !important;
} */
input.toggle-checkbox {
    background: #253A65 0% 0% no-repeat padding-box;
    border: unset;

}
label.toggle-label {
    border: 1px solid #979797;
    background: #fff;
}
input.toggle-checkbox:checked{
    background: #32CFFF 0% 0% no-repeat padding-box !important;
    border: unset;
}

.toggle-checkbox:checked + .toggle-label {
    border: 1px solid #979797;
    background: #fff;
}
*:focus {
    border-color: unset !important;
    box-shadow: none !important;
}
.bg-gray-500 {
    background: #00000080 0% 0% no-repeat padding-box;
    opacity: 1 !important;
}

.user_active{
    background: #FFFFFF 0% 0% no-repeat padding-box;
border: 1px solid #D8D8D8;
border-radius: 6px;
opacity: 1;
color: #4A4A4A;
}
.flash_message{
    background: #DB0F4333;
    box-shadow: none;
    border: unset;
    color: #DB0F43;
    font-size: 16px;
    text-align: center;
    border: 1px solid #DB0F43;
}
button:focus{
    outline: unset !important;
}
[type='radio']:checked{
    background-color:#253A65 !important ;
    background-image: none !important;
}
[type='checkbox']:checked , [type='checkbox']:checked:hover{
    background-color:#253A65;
    color:#253A65 ;
}
div.dataTables_wrapper div.dataTables_filter input{
    border-radius: 0.25rem;
}
@media only screen and (min-width : 320px) and (max-width : 470px) {
    .custoum_mobile_font {
        font-size: 10px;

    }

    }

@media only screen and (min-width : 320px) and (max-width : 1024px) {
    .resp {
        width: 44%;

    }
    .blocks_custom{
        font-size: 14px;
    }

    }


   @media only screen and (min-width : 1024px) and (max-width : 1280px) {
        .resp {
            width: 44%;

        }
        .user_M {
            position: relative;
            top: 10px;
            padding-top: 18px;

        }
        .blocks_custom{
            font-size: 14px;
        }
        .custoum_mobile_font{
            font-size: 12px;
        }

 }
 @media only screen and (min-width : 1280px) and (max-width : 1500px) {
    .blocks{
            font-size: 20px;
    }

}