/**
Module: HireMee Pro Design
File: hiremee-pro-style.css
Date: 05/02/2019
Author: Gandhi
**/

.hme-pro-manage-candidate-pro{
  position: absolute;
  top: 12px;
  right: 4px;
  z-index: 1;
  margin-top: 50px;
}

.label-info {
  width: 24px;
  height: 24px;
  text-align: center;
  line-height: 24px;
  font-size: 18px;
  border-radius: 50%;
  display: inline-block;
  color: white;
}

.hme-pro-sub-heading{
  font-size:18px;
  font-weight:400;
  border-left:4px solid #89c540;
  padding-left:8px;
}
.pro-logo{
  position: relative;
  top: -14px;
  font-size: 30px;
  color: #F37C20;
  right: 17px;
  width: 20px;
}

.hme-pro-upgrade-button{	
  background : -moz-linear-gradient(52.66% 156.33% 94.97deg,rgba(255, 241, 0, 1) 0%,rgba(253, 220, 6, 1) 18.29%,rgba(243, 124, 32, 1) 100%);
  background : -webkit-linear-gradient(94.97deg, rgba(255, 241, 0, 1) 0%, rgba(253, 220, 6, 1) 18.29%, rgba(243, 124, 32, 1) 100%);
  background : -webkit-gradient(linear,52.66% 156.33% ,49.78% 41.33% ,color-stop(0,rgba(255, 241, 0, 1) ),color-stop(0.1829,rgba(253, 220, 6, 1) ),color-stop(1,rgba(243, 124, 32, 1) ));
  background : -o-linear-gradient(94.97deg, rgba(255, 241, 0, 1) 0%, rgba(253, 220, 6, 1) 18.29%, rgba(243, 124, 32, 1) 100%);
  background : -ms-linear-gradient(94.97deg, rgba(255, 241, 0, 1) 0%, rgba(253, 220, 6, 1) 18.29%, rgba(243, 124, 32, 1) 100%);
  -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFF100', endColorstr='#F37C20' ,GradientType=0)";
  background : linear-gradient(-4.97deg, rgba(255, 241, 0, 1) 0%, rgba(253, 220, 6, 1) 18.29%, rgba(243, 124, 32, 1) 100%);
  border-style : Solid;
  margin-right:5px;
  border-color : #C9C9C9;
  border-color : rgba(201, 201, 201, 1);
  border-width : 1px;
  border-radius : 19px 20px 20px 20px;
  -moz-border-radius : 19px 20px 20px 20px;
  -webkit-border-radius : 19px 20px 20px 20px;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFF100',endColorstr='#F37C20' , GradientType=1);

  & :hover {
    color:#ffffff;
    border-color: #cccc;
    background : linear-gradient(-4.97deg, rgba(255, 241, 0, 1) 0%, rgba(253, 220, 6, 1) 18.29%, rgba(243, 124, 32, 1) 100%) !important;
  }
  & :focus{
    color:#ffffff;
    border-color: #cccc;
    background : linear-gradient(-4.97deg, rgba(255, 241, 0, 1) 0%, rgba(253, 220, 6, 1) 18.29%, rgba(243, 124, 32, 1) 100%) !important;
  }

}

.hme-pro-container{
  background:#ffffff;
  padding:0px;

  .hme-pro-heading{
    padding:0;
    margin:0;
    color:#757575;
    font-size:18px;
    font-weight:400;
    padding:20px;
    background:#dddddd;


  }
  .hme-sub-heading{
    padding:0;
    margin:0;
    color:#212121;
    font-size:18px;
    font-weight:400;
    border-left: 4px solid #a2d344;
    padding-left: 8px;
  }

}

.hme-pro-spinner{
  padding:0px 10px !important;

  a{
    width:auto !important;
    padding:0 !important;
    height:auto !important;

    i{
      color:#fff;
      font-size:15px;
    }
  }



}

.hme-pro-account-settings-list{
  background:#eaeaea;
  border-left:7px solid #fbd302;
  padding:10px 15px;
  margin-bottom:15px;

  .hme-pro-head{
    color:#6e9431;
    font-size:16px;
    border-left:none;
    margin-bottom:4px;
    padding-left:0px;
  }

  .hme-pro-text{
    color:#757575;
    font-size:16px;
    font-weight:400;
  }
}

.payment-details-modal{
  .payment-details-modal-head{
    background: #156a26;  /* fallback for old browsers */
    background: -webkit-linear-gradient(to right, #156a26, #89c540,);  /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to right, #156a26, #89c540,); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
    padding:8px 20px;

  }
  .hme-pro-payment-text{
    font-size:16px;
    color:#fff;
    font-weight:400;
  }
  .hme-pro-payment-text-sm{
    font-size:12px;
    color:#fff;
    font-weight:400;
  }
}

.pro-page-heading{
  position:fixed;
  width:100%;

}

/* tabs */

.hme-pro-tab{
  .md-tabs{

    list-style: none; 
    overflow: hidden; 
    padding: 0;

    .nav-item{
      background-color: #679e02;
      .nav-link{
        border-top:none;
      }
      a {
        color: white;
        text-decoration: none; 
        padding: 7px !important;
        font-size:20px;
        background: brown; 
        background: #bfbfbf; 
        position: relative; 
        display: block;
        border-radius:0px !important;

        .number-round{
          width: 26px;
          height: 26px;
          border-radius: 50%;
          background: #fff;
          display: inline-block;
          color: #679e02;
          margin-left: 5px;
          line-height: 27px;
        }
      }
      a:after { 
        content: " "; 
        display: block; 
        width: 0; 
        height: 0;
        border-top: 50px solid transparent;           
        border-bottom: 50px solid transparent;
        border-left: 30px solid #bfbfbf;
        position: absolute;
        top: 50%;
        margin-top: -50px; 
        left: 100%;
        z-index: 2; 
      } 
      a:before { 
        content: " "; 
        display: block; 
        width: 0; 
        height: 0;
        border-top: 50px solid transparent;        
        border-bottom: 50px solid transparent;
        border-left: 30px solid white;
        position: absolute;
        top: 50%;
        margin-top: -50px; 
        margin-left: 5px;
        left: 100%;
        z-index: 1; 
      } 
      .active{background: #679e02;}
      .active{background: #679e02;}
      .active .number-round {color:#333333;}
      .active:after { border-left-color: #679e02 !important; }

      a:hover { background: #679e02; color:#ffffff !important;}
      a:focus { background: #679e02; color:#ffffff !important;}
      a:hover:after { border-left-color: #679e02 !important; }


      .slide{
        width: calc(100% / 5) !important;
      }
    }     
  }

}

/* switch button */

.hme-pro-sec-box{
  border:1px solid #ccc;
  border-radius:3px;
  padding:12px;
  min-height:150px;
}

.hme-pro-textarea{

  width:200px;
  position:relative;

  & textarea{
    min-height:44px !important;
    resize: none;
    position:absolute;
    top:-22px;
    border-radius:4px;
    line-height:25px;

    &:focus{
     min-height:120px !important;
     box-shadow:1px 2px 3px #757575;
     border:none;
   }

 }



}
.sidebar-heading-container{

  background:#dddddd;
  padding-left:8px !important;
  padding: 16px;
  
  .sidebar-heading{
    font-size: 18px;
    padding-left: 8px;
    margin-left: 8px;
    color: #666666;
    border-left: 3px solid #8fc740;
  }

}

.hme-pro-head{
  font-size: 18px;
  padding-left: 8px;
  margin-bottom: 15px;
  color: #666666;
  border-left: 3px solid #8fc740;
}
.hme-pro-green-head{
  color: #6e9431;
  font-size: 16px;
}

.border-grey{
  border:1px solid #959595;
  padding:1px 6px;
  border-radius:4px;
}

.hme-pro-drag{

  li{
    padding:8px;
    
    .hme-pro-drag-sort{
      display:flex;
      justify-content:end;
      margin-right:20px;

      .drag-sort-action{
        border: none;
        font-size: 18px;
        padding: 0;
        margin: 5px 15px 0 15px;
        background: none;

        i{
          font-size:20px;
        }
      }

      & :hover{
        cursor:pointer;
      }
    }

  }


}

.btn-secondary-pro.active, .btn-secondary-pro:active {
  background-color: #727b84;
  background-image: none;
  border-color: #6c757d;
}
.btn-secondary-pro:hover {
  color:#fff;
  background-color: #727b84;
  border-color: #6c757d;
  box-shadow:none;
}
.btn-secondary-pro {
  color: #fff;
  background-color: #868e96;
  border-color: #868e96;
}



// HireMee Pro Filter

.hme-pro-filter-label {
  height: 38px;
  max-width: 48px;
  padding: 8px;
  font-size: 24px;
  background-color: #0099ff;
  color: #fff;
  line-height: 20px;
  margin-right:8px;
}

.hme-pro-select-style{
  line-height:18px;
  height:38px;
  
  select{
    font-style:italic;
  }
}

// Pro color tag my Questions
.pro-color-tab{
  padding:0;
  margin:0;
  
  ul{
    background:#cecece;
    padding-left:8px;
    .pro-color-border1{border-top:2px solid #6b6b6b;}
    .pro-color-border2{border-top:2px solid #36b21e;}
    .pro-color-border3{border-top:2px solid #e5ad22;}
    .pro-color-border4{border-top:2px solid #e34041;}
    li{
      display:inline-block;
      padding:16px 2px 14px 2px;

      .pro-color-item{
        padding:12px 30px;
        background:#ededed;
        font-weight:400;
        color:#444444;
        font-size:15px;
        cursor:pointer;

        &:hover{
          background:#fff;
        }
      }
       .active{
          background:#fff;
        }
    }
    
  }

}

  .pro-color-tab-list-container{

    padding:10px;
    
    .pro-color-tab-left-border1{border-left:7px solid #36b21e;}
    .pro-color-tab-left-border2{border-left:7px solid #e5ad22;}
    .pro-color-tab-left-border3{border-left:7px solid #e34041;}
    
    .pro-color-tab-list{
      background:#ededed;
      padding:10px;
      margin-bottom:10px;
      
      .tab-left-icon{
        width:50px;
        font-size:18px;
        text-align:center
      }
      .tab-right-content{
        .tab-button-contaner {
          margin-top:12px;
          margin-bottom:5px;
          
          .btn-icon-hmepro{
            border-radius: 50%;
            width: 30px;
            line-height: 25px;
            height: 30px;
            padding: 3px;
            text-align: center;
            background:#424242 !important;
          }
        }
      }
    }

  }

  .edit-label-input{
    width:137px;
    position:relative;
    right: 12.5px;
    
    .lbl-text{text-align:center;}
    
    .edit-label-input-left{
      width:75px;
      height:32px;
      padding: 5px 10px 5px 1px;
      background:#fff;
      text-align:center;
      line-height:31px;
      border:none;
      position:relative;
      font-size:15px;
      font-weight:600;
      color:#636363;
      border-top-left-radius:25px;
      border-bottom-left-radius:25px;
      left:25px;
      right:auto;
      

      &:focus{
        outline:none;
      }
      
    }

    .bg-green{background:#36b21e;}
    .bg-yellow{background:#e5ad22;}
    .bg-red{background:#e34041;}

    .edit-label-input-right{
      width:85px;
      padding: 6px 0px 16x 20px;
      border:none;      
      text-align:center;
      padding-left:3px;
      height: 32px;
      display: flex;
      line-height: 32px;
      justify-content:center;
      font-size:15px;
      border-top-right-radius:25px;
      border-bottom-right-radius:25px;
      font-weight:600;
      color:#ffffff;
     -webkit-clip-path: polygon(25% 0, 100% 0, 100% 100%, 0 100%);
      clip-path: polygon(25% 0, 100% 0, 100% 100%, 0 100%);

      &:focus{
        outline:none;
      }
      
    }
  }


.label-pool-topic{
  background:#3ea8f4;
  color:#fff;
  padding:6px 20px;
  border-radius:50px;
  line-height:16px;
  position:relative;
  display:flex;
  justify-content:space-between;
  
  .label-pool-num{
    font-weight:600;
     background:darken(#358ec6, 7%);
    width: 45px;
    height: 45px;
    position: absolute;
    right: auto;
    left: 0px;
    top: 0px;
    border-radius: 50%;
    line-height: 45px;
    text-align: center;
  }
  .label-pool-list{
    padding-left:36px;
  }
  .label-pool-close{

    width: 45px;
    height: 45px;
    position: absolute;
    right: 0px;
    left: auto;
    background:#333333;
    top: 0px;
    border-radius: 50%;
    line-height: 48px;
    text-align: center;
    cursor:pointer;
    
    &:hover{
      background:lighten(#333333, 10%);
    }
  }
}

.single-add{
    background: #679e02;
    background: -webkit-linear-gradient(#679e02 0%, #426002 100%);
    background: -o-linear-gradient(#679e02 0%, #426002 100%);
    background: linear-gradient(#679e02 0%, #426002 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#679e02", endColorstr="#426002", GradientType=0 );
    width: 40px !important;
    height: 40px !important;
    line-height: 34px !important;
    
    span{
      color:#ffffff !important;
    }
}

.section-matrix-wrapper{
    
    border-radius:2px;
    
    .section-matrix-list{
      padding:4px 8px;
      background:#d3d3d3;
    position:relative;
      height: 65px;
      margin-bottom:12px;
      
      &:hover{
        box-shadow: 0 0 6px #999999;
      }
    }

    .arrow-num-left{
      background:#679e02;
      -webkit-clip-path: polygon(75% 0%, 100% 50%, 75% 100%, 0% 100%, 0% 0%);
    clip-path: polygon(75% 0%, 100% 50%, 75% 100%, 0% 100%, 0% 0%);
      position: absolute;
      left: 0;
      top: 0;
      width: 80px;
      height: 65px;
      border-top-left-radius: 2px;
      border-bottom-left-radius: 2px;
      color: #fff;
      font-size: 30px;
      padding-left: 18px;
      line-height: 65px;
          }
     .section-matrix-content{
       padding-left: 90px;
      font-size: 18px;
     }
  
    
}

.auto-manual-label{
  height: 32px;
  padding:2px 20px;
  display: flex;
  line-height: 30px;
  justify-content: center;
  font-size: 15px;
  border-radius: 25px;
  font-weight: 400;
  min-width:120px;
  color: #ffffff;
}

//  Question Selected Label

.question-selected-label{
    background:#fff;
    border-radius:25px;
    width:140px;
    display:flex;
    justify-content:center;
    padding:2px 4px;
    margin-right:10px;
    
    .question-selected-num{
      font-size:24px;
      line-height:25px;
      margin-right:3px;
    }

    .question-selected-text{
      font-size:11px;
      align-self:center;
      line-height:11px;

    }

}

//  Question Type

.question-type-box{
    background:#e2e2e2;
    padding:5px 8px;
    border-radius:4px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    
    .question-type-label{
      width:60%;
      font-size:15px;
    }
    
    .success-label{
      background:#36b21e;
      padding:2px 5px;
      width:40%;
      color:#fff;
      text-align:center;
      border-radius:4px;
      font-size:15px;
    }
    .warning-label{
      background:#e5ad22;
      padding:2px 5px;
      width:40%;
      color:#fff;
      text-align:center;
      border-radius:4px;
      font-size:15px;
    }
    .danger-label{
      background:#e34041;
      padding:2px 5px;
      width:40%;
      color:#fff;
      text-align:center;
      border-radius:4px;
      font-size:15px;
    }

}

.compose-message{
    position: fixed;
    z-index: 2000;
    min-width: 230px;
    color:#fff;
    font-size:16px;
    top: auto;
    bottom: 0;
    left: auto;
    right: 12%;
    border-top-left-radius:2px;
    border-bottom-left-radius:2px;
    padding: 5px 25px 5px 15px;
    cursor:pointer;
    background:#8fc740;
    -webkit-clip-path: polygon(86% 1%, 100% 100%, 0 99%, 0 0);
    clip-path: polygon(86% 1%, 100% 100%, 0 99%, 0 0);
}
.compose-message-box{
  top:133px !important;
}
.question-topic-dropdown{
    height:38px;
    
    .ellipse-btn{
      padding:12px 13px;
    }

    .question-topic-dropdown-list{
        width:300px;
        padding:6px;
        height:250px;
        
        .q-t-tabs{
          width:100%;
          
          a{
            margin-right:0px;
          }
        }

        .tab-text-area{
      width:100%;
      border:1px solid #ccc;
      resize:none;
      border-radius:4px;
    }

    .tab-padding{
      padding:10px !important;
      
      .list-search-topic{
        font-size:14px;
        text-align: left;
        
      }
    }

    }

    

}

.showChat-msg{
  top:165px !important;
  right:12px;
  
  .compose-message-title{    
    position: absolute;
    z-index: 2000;
    min-width: 230px;
    color: #fff;
    font-size: 16px;
    top: -34px;
    bottom: auto;
    left: -1px;
    right: auto;
    border-top-left-radius: 2px;
    border-bottom-left-radius: 2px;
    padding: 5px 25px 5px 15px;
    cursor: pointer;
    background: #8fc740;
    -webkit-clip-path: polygon(86% 1%, 100% 100%, 0 99%, 0 0);
    clip-path: polygon(86% 1%, 100% 100%, 0 99%, 0 0);
    

  }
}


// Search page Custom tab customize

.pro-result-page-tab{
    
     li{
        
         & .nav-link{
          padding:.5em 1em .8em 1em !important;
        }
    }
}
.chart {
    width: 100% !important;
    height: 220px;
}
.pro-result-personal-information{
  border-bottom:1px solid #ccc;
  padding-bottom:10px;
}
.amcharts-export-menu-top-right {display:none !important;}

/****************************** Report Page CSS Start **************************/
.proctoring-report-list-wrapper .proctoring-report-list {
  width: 100%;
  padding: 10px 16px;
  margin-bottom: 8px;
}
.dark-grey-bg {
  background-color: #dbdbdb;
}
.light-grey  {
  background-color: #f4f4f4;
}
.label-dark{color: #0f0f0f;font-size: 18px}
.result-card{background-color: #f7f7f7!important;border-radius: 6px;/*width: max-content*/}
.result-card-header{background-color: #f7f7f7;border-radius: 6px;padding: 15px;border-bottom: 1px solid #ddd;}
.result-card-header h2{background-color: #f7f7f7;border-radius: 6px;font-size: 1.5rem;}
.result-card-header h2 span{color: #8fc740;border-radius: 6px;font-size: 1.5rem;}

.tooltip1 {
    display:inline-block;
    position:relative;
   
    text-align:left;
}

.tooltip1 .top {
    min-width:120px; 
    top:-20px;
    left:50%;
    transform:translate(-50%, -100%);
    padding:5px 10px;
    color:#FFFFFF;
    background-color:#333333;
    font-weight:normal;
    font-size:13px;
    border-radius:8px;
    position:absolute;
    z-index:99999999;
    box-sizing:border-box;
    box-shadow:0 1px 8px rgba(0,0,0,0.5);
    display:none;
}

.tooltip1:hover .top {
    display:block;
}

.tooltip1 .top i {
    position:absolute;
    top:100%;
    left:50%;
    margin-left:-12px;
    width:24px;
    height:12px;
    overflow:hidden;
}

.tooltip1 .top i::after {
    content:'';
    position:absolute;
    width:12px;
    height:12px;
    left:50%;
    transform:translate(-50%,-50%) rotate(45deg);
    background-color:#333333;
    box-shadow:0 1px 8px rgba(0,0,0,0.5);
}
.personal-info-dark-text{color: #656464;font-size: 15px;font-weight: 600;}
.personal-info-light-text{color: #888787;font-size: 15px;font-weight: 600;}
.b-b-2{border-bottom: 2px solid#d9d9d9;}
.screen-capture-btn{background: linear-gradient(to right, #f9b610, #f27f1f);color: #fff;font-size: 17px;}
.screen-capture-btn, .btn a:hover {background: linear-gradient(to right, #f9b610, #f27f1f);color: #fff!important;font-size: 17px;}
.report-img-container {
  position: relative;
  width: 210px;
  margin: 5px;
  cursor: pointer;
}
.bottomleft {
  position: absolute;
  bottom: 1px;
  color: #fff;
  text-align:center;
  font-size: 12px;
  padding: 1px;
  width:100%;
  background-color:rgba(0,0,0, 0.5);
}
.report-img-container img { 
  width: 100%;
  border:2px solid#ddd;
}
.middle-over {
  transition: .5s ease;
  opacity: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  text-align: center;
}
.report-img-container:hover .report-image {
  opacity: 0.3;
  background-color: #80be3f;
}
.report-img-container:hover .middle-over {
  opacity: 1;
}
.f-25{font-size: 25px;}
.modal-backdrop {
    z-index: 1049;
}

@media (min-width: 992px){
.modal-lg {
    max-width: 800px;
}
.modal-open, .modal {
    z-index: 1058;
    margin-top: -30px;
}
}

/****************************** Report Page CSS End **********************/
 .cke_dialog_ui_hbox_last{display: none !important;}

 /****************************** Bug Fixing CSS Start **********************/
.top-6{top: 6px!important}
#inputGroupFile02-error .tooltip-validate{right: 150px;}
#js-bulk_question_type-error  .tooltip-validate{right: 30px!important;}
 #js-bulk_pool_name-error  .tooltip-validate{right: 30px!important;}
 #js-bulk_difficulty_level-error  .tooltip-validate{right: 30px!important;}
 #js-bulk_bloomstaxonomy-error .tooltip-validate{right: 30px!important;}
 .label-info1 {width: auto;text-align: center;font-size: 14px;display: inline-block;color: white;background-color: #3fa8f4;}
.wizard-inner .nav-tabs .active {border-color: none!important;}
.wizard-inner .nav-tabs .nav-link{border-top: 0px!important;}
.connecting-line{top:40px!important;}
.wizard .nav-tabs > li a{height: 60px!important}
.modal-content .modal-body{height: auto;}
.container-checkbox .checkmark-round{left: 13px!important;border-radius: 50%;width: 40px;height: 40px;border:1px solid#2196F3;}
.checkbox-fade label input[type="checkbox"] + .cr > .cr-icon{transform: unset;}
#js-pro-section_type-error-custom {right:30px;}
#js-pro-test_duration_time-error-custom{right:50px;}
/****************************** Bug Fixing CSS End **********************/

.pro-question-img-container{
   img{
    width:auto !important;
    height: auto !important;
    max-width: 100% !important;
    max-height: 100% !important;
  }
  table{
    width:100% !important;
    height:auto !important;
    display: block;
    max-width: 100%;
    overflow: scroll;
  }
}