@page { margin: 0px; }

.h1style{
  font-size:28px;font-weight: bold; text-align: center;
  background-color: #e7eae1; border-top: 3px solid #022960; padding: 15px 0;
}

.h3style{
  border-left: 20px solid #f60;
    padding-left: 15px;
    background: #f3f3f3;
    max-width: 300px;
    padding-top: 15px; font-family: 'Roboto', sans-serif; 
}

.prof_left{
  width: 300px; height: 300px; float: left; background-color: #a4b8c1;
}

.prof_img{
  width: 104px; min-height: 100px; height: auto; border: 2px solid #fff;  background-color: #00f; margin: 90px auto 0 auto;
}

.prof_right{
  width: 500px; padding-left: 20px; height: 300px; float: right; background-color: #f6f7f7;
}


    .caption{
      height: 40px; padding-top: 10px; border-bottom: 1px solid #ccc;   
    }
    .calendar{
        font-family: 'Roboto', sans-serif;  float: left; margin-right: 25px;
        border-collapse: collapse; overflow: hidden;
      }
      .calendar .header{                
        width: 40px; padding: 4px 0;
        font-weight: normal; font-size: 10px;
      }
      .calendar .day{
        border:1px solid  #eee; padding: 10px 0; text-align: center;
        background: #f3f3f3; position: relative;
      }



      .calendar .activity{
        background: #ffbe00; position: relative; color: #000;
      }
      .calendar .activity:before {
          content: "ACT";
          right: -8px;
          position: absolute;
          top: -8px;
          font-size: 9px;
          color: #9a2929;
       }



      .calendar .present{
        background: #76d28e; /*position: relative;*/
      }
      .calendar .present:before {
          content: "P";
          font-family: FontAwesome;
          right: 0;
          position: absolute;
          top: 0;
          font-size: 9px;
          color: #0e9e33;
       }

      .calendar .absent{
        background: #f37070; position: relative;
      }
      .calendar .absent:before {
          content: "Ab";
          font-family: FontAwesome;
          right: -8px;
          position: absolute;
          top: -8px;
          font-size: 9px;
          color: #9a2929;
       }


      .calendar .p_absent{
        background: #f37070; position: relative;
      }
      .calendar .p_absent:before {
          content: "PA";
          font-family: FontAwesome;
          right:-8px;
          position: absolute;
          top: -8px;
          font-size: 9px;
          color: #9a2929;
       }

      .calendar .leave{
        background: #f37070; position: relative;
      }
      .calendar .leave:before {
          content: "L";
          right: -8px;
          position: absolute;
          top: -8px;
          font-size: 9px;
          color: #9a2929;
       }


      .calendar .holidt{
        background: #00ccff; position: relative;
      }
      .calendar .holidt:before {
          content: "H";
          right: -8px;
          position: absolute;
          top: -8px;
          font-size: 9px;
          color: #9a2929;
       }

       .calendar .sunday{
        background: #b84dff; position: relative; color: #fff;
      }
      .calendar .sunday:before {
          content: "S";
          right: -8px;
          position: absolute;
          top: -8px;
          font-size: 9px;
          color: #9a2929;
       }


       .day span{
          padding: 2px 3px;
          border-radius: 50%; display: inline-block;  font-size: 11px;
       }
       #pageloader{
        display: none;
       }
       .starer{
          color: #ff8100 !important;
          font-size: 20px;
       }


        .pageloaderimg
        {
          left: 50%;
          margin-left: -32px;
          margin-top: -32px;
          position: absolute;
          top: 50%;
          font-size: 60px;
          color: #415873;
        }

        .pageloaderpercent
        {
          left: 50%;
          margin-left: -32px;
          margin-top: -32px;
          position: absolute;
          top: 58%;
          font-size: 60px;
          color: #415873;
        }












      body { margin: 0px; }
    
    .page_break { page-break-before: always; }
    
    .class_green{
      color: #fff !important; 
      background-color: #a9e823; 
      text-align: center !important;
      vertical-align: center !important;
      font-weight: bold;
    }
    .class_red{
      color: #fff !important;
      background-color: #ffcd7a;
      text-align: center !important;
      vertical-align: center !important;
      font-weight: bold;
    } 
    .class_white{
      color: #fff !important;
      background-color: #fff;
      text-align: center !important;
      vertical-align: center !important;
      font-weight: bold;
    } 

    .class_black{
      color: #fff !important;
      background-color: black;
      text-align: center !important;
      vertical-align: center !important;
      font-weight: bold;
    }
    .class_txt_green { 
      color:green !important;
      text-align: center !important;
      vertical-align: center !important;
      font-weight: bold;
    }

    .class_txt_red{ 
      color: red !important;
      text-align: center !important;
      vertical-align: center !important;
      font-weight: bold;
    }
        .nav-tabs-custom>.nav-tabs>li>a:hover { 
        color: #fff !important; 
    }
   .act_style { 
        font-size: 13px; 
        height: 22px; 
        left: 30% !important; 
        line-height: 20px !important; 
        top: 50% !important; 
        width: 26px !important; 
    }












    #calendar_plug,.calendar_box,.calendar_content{ 
      width: 100% !important; 
      overflow-x: unset !important; 
      overflow-y: unset !important; 
    }
    #calendar_plug .calendar_dates .calendar_names, #calendar_plug .calendar_dates .calendar_days, #calendar_plug .calendar_dates .calendar_today,.activity_day,.holiday,.calender_sunday,.present_day,.absent_day,.calendar_names { 
      width: 12.5% !important; 
    }
    #calendar_plug{ 
      height:450px !important; 
    }
    .calendar_content{
      border:unset !important; 
      /*padding: 0px !important; */
    }
    .currmonth{
      background-color: khaki;
    }






#calendar_plug_plug {
  margin: 0px auto;
  padding: 0px;
  width: 602px;
  font-family: Helvetica, "Times New Roman", Times, serif;
}
#calendar_plug_plug .calendar_box {
  position: relative;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 40px;
  background-color: #787878;
}
#calendar_plug_plug .calendar_header {
  line-height: 40px;  
  vertical-align: middle;
  position: absolute;
  left: 11px;
  top: 0px;
  width: 582px;
  height: 40px;
  text-align: center;
}
#calendar_plug_plug .calendar_header , #calendar_plug .calendar_next {
  position: absolute;
  top: 0px;
  height: 17px;
  display: block;
  cursor: pointer;
  text-decoration: none !important;
  color: #FFF !important;
}
#calendar_plug .calendar_header .calendar_title {
  color: #000;
  font-size: 18px;
}
#calendar_plug .calendar_header .calendar_prev {
  left: 0px;
}
#calendar_plug .calendar_header .calendar_next {
  right: 0%;
  color: #3C8DBC !important;
  padding-top:27px;
}
/*************************** Calendar Content Cells ***************************/
#calendar_plug .calendar_content {
  border: 1px solid #787878;
  border-top: none;
}
#calendar_plug .calendar_label {
  /*float: left;*/
  margin: 0px;
  padding: 0px;
  margin-top: 5px;
  margin-left: 5px;
}
#calendar_plug .calendar_label .calendar_names {
  margin: 0px;
  padding: 0px;
  margin-right: 5px;
  float: left;
  list-style-type: none;
  width: 13.6%;
  height: 34px;
  line-height: 34px;
  vertical-align: middle;
  text-align: center;
  color: #000;
  font-size: 15px;
  background-color: transparent;
}
#calendar_plug .calendar_dates {
  /*float: left;*/
  margin: 0px;
  padding: 0px;
  margin-left: 5px;
  margin-bottom: 5px;
} 
/** overall width = width+padding-right **/
#calendar_plug .calendar_dates .calendar_names, #calendar_plug .calendar_dates .calendar_days, #calendar_plug .calendar_dates .calendar_today {
  margin: 0px;
  padding: 0px;
  margin-right: 5px;
  margin-top: 5px;
  vertical-align: middle;
  float: left;
  list-style-type: none;
  width: 13.6%;
  height: 52px;
  font-size: 18px;
  background-color: #DDD;
  color: #000;
  text-align: center;
}
/*.calendar_dates .calendar_today {
  background-color: #CC6699;
}
.calendar_dates .calender_sunday{
  background-color: #808080;
}
.calendar_dates .absent_day{
  background-color: #F5A9BC;
}
.calendar_dates .present_day{
  background-color: #04B404;
}
.calendar_dates .holiday{
  background-color: #58ACFA;
}
.calendar_dates .activity_day{
  background-color: #FFFF00;
} */
.calendar_title{
  font-size:18px;
} 
.activity_day {
  margin: 0px;
  padding: 0px;
  margin-right: 5px;
  margin-top: 5px;
  vertical-align: middle;
  float: left;
  list-style-type: none;
  width: 13.6%;
  height: 52px;
  font-size: 18px;
  background-color: #DDD;
  color: #000;
  text-align: center;
}   
.holiday{
  margin: 0px;
  padding: 0px;
  margin-right: 5px;
  margin-top: 5px;
  vertical-align: middle;
  float: left;
  list-style-type: none;
  width: 13.6%;
  height: 52px;
  font-size: 18px;
  background-color: #DDD;
  color: #000;
  text-align: center;
} 
.calender_sunday{
  margin: 0px;
  padding: 0px;
  margin-right: 5px;
  margin-top: 5px;
  vertical-align: middle;
  float: left;
  list-style-type: none;
  width:13.6%;
  height: 52px;
  font-size: 18px;
  background-color: #DDD;
  color: #000;
  text-align: center;
}
.present_day{
  margin: 0px;
  padding: 0px;
  margin-right: 5px;
  margin-top: 5px;
  vertical-align: middle;
  float: left;
  list-style-type: none;
  width: 13.6%;
  height: 52px;
  font-size: 18px;
  background-color: #DDD;
  color: #000;
  text-align: center; 
}
.absent_day{
  margin: 0px;
  padding: 0px;
  margin-right: 5px;
  margin-top: 5px;
  vertical-align: middle;
  float: left;
  list-style-type: none;
  width: 13.6%;
  height: 52px;
  font-size: 18px;
  background-color: #DDD;
  color: #000;
  text-align: center; 
}
.calendar_content{
  border-top:1px solid #828282 !important;
  padding: 5px 0 10px 14px !important;
}
.current_month_style{
  margin-top:-26px !important;
}
.current_month_style1{
  margin-top:0px !important;
} 
:focus {
  outline: none;
}
  
.calendar_clear {
  clear: both;
}
.calendar_names{background:#f5a71b !important;color:#fff !important;}
.calendar_title.text-center.current_month_style > a {
    color:#f5a71b !important;
}
.div_relative{
  position:relative !important;
 
}
.line_height{
   line-height: 54px !important;
}
.attendence_num{
  position:absolute !important;
  left:6px !important;
  top:3px !important;
}
.attend_stat{
  position:absolute !important;
  top:24%;
  left:40%;
  /*border:1px solid #ddd !important;*/
  width:30px;
  line-height: 29px; 
  color:#FFFFFF !important;
 /* background:rgba(0,0,0,0.7) !important;*/
 font-weight: bold;
}
.act_style {
    font-size: 14px;
    height: 40px;
    left: 34% !important;
    line-height: 37px !important;
    top: 12% !important;
    width: 43px !important;
}