.radioM{
                cursor: pointer;
                -webkit-appearance: none;
                -moz-appearance: none;
                appearance: none;
                border-width: 2px;
                border-style: solid;
                border-image: linear-gradient(to right, darkblue, darkorchid,rgba(80,180,240)) 1;
                width: 20px;
                height: 20px;
                /*/border: 2px solid #999;*//*/**/
                transition: 0.2s all linear;
                margin-right: 5px;
                position: relative;
                top: 5px;
                }



                .radioM:checked {
                border-width: 10px;
                clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
                outline: unset !important /* I added this one for Edge (chromium) support */   
                }
                @media (max-width: 800px){     
                .radioM{

                width: 45px;
                height: 45px;
                top: 5px;
                margin-left: 15px;
                }      
                .radioM:checked {
                border-width: 23px;
                outline: unset !important /* I added this one for Edge (chromium) support */
                }
                }       
     
     
     li {
  list-style: none;
  background: #d1703c;
  color: #fff;
  height: 0;
  line-height: 2em;
  margin: 0;
  padding: 0;
  overflow: hidden;
  width: 10em;
}

.divlistwork{
    
    pointer-events: none; position: relative; top:1px; margin-left:5px;
}
.divlistworkcount{
    pointer-events: none; position: relative; top:1px; padding: 3px; border: 1px solid silver; border-radius: 25px 25px 25px 25px;
}

            .divadd{
               display: inline-block;
               float: left;
               width: 20px;
               height: 20px; 
               background: linear-gradient(to right, darkblue, darkorchid,rgba(80,180,240));
               pointer-events: none;
               clip-path: polygon(40% 0, 60% 0, 60% 40%, 100% 40%, 100% 60%,60% 60%, 60% 100%, 40% 100%, 40% 60%,0 60%, 0 40%, 40% 40%);
             }
             @media (max-width: 800px){
             .divadd{
               width: 40px;
               height: 40px;   
             }}
            
             
             .divremove{
                display: inline-block;
                float: left;
                width: 20px;
                height: 20px; 
                background: linear-gradient(to right, darkblue, darkorchid,rgba(80,180,240));
                pointer-events: none;
                clip-path: polygon(15% 0, 50% 35%, 85% 0%,  100% 15%, 65% 50% ,100% 85%, 85% 100%, 50% 65%, 15% 100%,0 85%, 35% 50%, 0% 15%);
             }
              @media (max-width: 800px){
             .divremove{
               width: 40px;
               height: 40px;   
             }}
  




.favorite_list{
    
padding: 0px;
padding-bottom: 0px;
color: black;
    
}

.favorite_list:empty{
    display: none;
    background-color: tomato;
}
.divlist{
    border-width: 1px;
border-style: solid;
border-image: linear-gradient(to right, red, brown,deeppink) 1;
  padding-bottom: 9px;
  padding-left: 9px;
  padding-top: 9px;
 margin: 0; 
margin-bottom: 5px; 
  position: relative;
  overflow: hidden;  
  //height: 0;  
  max-height: 0px;
  width: 95%;  
  
}


.work_list{
    font-family: Arial,helvetica,sans-serif;
    background-color: white;
  border-width: 0px;
border-style: solid;
border-radius: 0px 0px 5px 5px;
//border: 4px #f5f5f5 solid;
//border-image: linear-gradient(to right, blue, darkorchid) 1;
  padding-bottom: 9px;
  padding-left: 9px;
  padding-top: 9px;
  width: calc(100% - 17px);
  max-height: 300px;
  overflow-y: auto;
//padding: 0px;
//padding-bottom: 0px
}

.work_list:empty{
    
  //  background-color: tomato;
}
.divlist_work{
    
  padding-bottom: 5px;
  padding-left: 0px;
  padding-top: 5px;
 margin: 0;  
  position: relative;
  overflow: hidden;  
  //height: 0;  
  max-height: 0px;
  width: 100%;  
  
}

.show {
  //height: auto;
  max-height: 100px;
  //transition: max-height 0.4s ease-out;
  opacity: 1;
   transition: all 0.8s ease-out;
 
}
@media (max-width: 800px){   
      .show{
        max-height: 100px;  
       // height: 54px;  
      }
  }

.unshow {
  //height: 0em;
  max-height: 0px;  
  transition: all 0.4s ease-out;
  opacity: 0;
 
}

    .select
{
    background-color: white;
    overflow: scroll;
    font-size: 14px;
    border: 1px solid silver;
    width: 400px;
    cursor: default;
    font-family: Arial,helvetica,sans-serif;
    
    // height: 8em;
}
.select>*
{   
    
    padding: 4px;
    padding-top: 7px; padding-bottom: 7px;
    border-bottom: 1px solid lightgray;
    display: block;
    line-height: 20px;
}