body {
    background-color: #fafafa;
}

.logo img {
    widows: 100%;
    height: 100%;
}

.logo {
    width: auto;
    height: 70px;
    float: left;
}

.logo_name {
    font-size: 18px;
    font-weight: bold;
    color: #152733;
    line-height: 36px;
}

.head {
    background-color: #3c3c3c;
}

.content_area {
    padding: 70px 0px 70px 0px;
}

.ibtn {
    background-color: #3dba6f;
    text-align: center;
    border: 1px solid #cccc;
    color: #fff;
}

.free_space_20 {
    height: 20px;
}

.TC {
    margin-top: 30px;
    font-size: 10px;
    text-align: center;
}

.opn{
    opacity: 0;   
}

.justifyContent{
    display: flex;
    justify-content:center;
}
.alignItems{
    display: flex;
    align-items:center; 
}


/* media area*/

@media (min-width: 320px) {
    .logo {
        width: auto;
        height: 54px;
        float: left;
    }
    .logo_name {
        font-size: 22px;
        font-weight: bold;
        color: black;
    }
    .align_center {
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .extra_padding {
        padding: 10px 40px;
        justify-content: center;
    }
    .row {
        margin: 0%;
    }
    .heigth_1 {
        height: 70px;
    }
    .btn {
        padding: 7px 57px;
    }
    .head label {
        color: #fff;
    }
    .mobile_001 {
        height: 100px;
    }
    label {
        font-size: 13px;
        margin-bottom: 2px;
        color: gary;
    }
    .content_input {
        padding: 5px 10px;
    }
    select {
        font-size: 12px !important;
    }
    input {
        font-size: 12px !important;
    }
    .video {

    }
    .only_mobile{
        margin-top: 40px;
    }
    

}

@media (min-width: 576px) {
    .logo {
        width: auto;
        height: 70px;
        float: left;
    }
    .logo_name {
        font-size: 44px;
        font-weight: bold;
        color: white;
    }
    .align_center {
        padding: 0px 130px;
    }
    .align_center {
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .row {
        margin: 0%;
    }
    .head label {
        color: #fff;
    }
    .mobile_001 {
        height: 100px;
    }
    label {
        font-size: 13px;
        margin-bottom: 2px;
        color: gray;
    }
    .content_input {
        padding: 5px 10px;
    }
    select {
        font-size: 12px !important;
    }
    input {
        font-size: 12px !important;
    }
    .video {

    }
    .only_mobile{
        margin-top: 40px;
    }
}

@media (min-width: 768px) {
    .logo {
        width: auto;
        height: 50px;
        float: left;
    }
    .logo_name {
        font-size: 33px;
        font-weight: bold;
        color: white;
    }
    .form-control {
        width: 100%;
    }
    .col-lg.col-md.col-sm-12.col-xs-12.extra_padding.B {
        padding: 10px 10px;
    }
    .btn {
        padding: 5px 31px;
    }
    .extra_padding {
        padding: 10px 40px;
        justify-content: center;
    }
    .align_center {
        display: flex;
        justify-content: center;
        align-items: center;
    }s
    .head label {
        font-size: 13px;
        margin-bottom: 2px;
        color: white;
    }
    label {
        font-size: 13px;
        margin-bottom: 2px;
        color: gray;
    }
    .content_input {
        padding: 5px 10px;
    }
    select {
        font-size: 12px !important;
    }
    input {
        font-size: 12px !important;
    }
    .video {
        height: 280px;
        width: 441px;
    }
    .only_mobile{
        margin-top: 40px;
    }
}
@media (min-width: 992px) {
    .logo {
        width: auto;
        height: 55px;
        float: left;
    }
    .logo_name {
        font-size: 24px;
        font-weight: normal;
        color: #25e371;
    }
    .align_center {
        padding: 0px 0px;
    }
    .align_center {
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .form-control {
        width: 100%;
    }
    .col-lg.col-md.col-sm-12.col-xs-12.extra_padding.B {
        padding: 10px 10px;
    }
    .abtn {
        padding: 7px 74px;
    }
    .head label {
        font-size: 13px;
        margin-bottom: 2px;
        color: white;
    }
    input {
        font-size: 14px !important;
    }
    select {
        font-size: 12px !important;
    }
    label {
        font-size: 13px;
        margin-bottom: 2px;
        color: gray;
    }
    .content_input {
        padding: 5px 10px;
    }
    .video {
        height: 280px;
        width: 441px;
    }
    .col-lg-6 .col-md-6 .content_input_width {
        width: 200px;
    }
    .only_mobile{
        margin-top: 40px;
    }
}

@media (min-width: 1200px) {
    .logo {
        width: auto;
        height: 46px;
        float: left;
    }
    .logo_name {
        font-size: 22px;
        font-weight: normal;
        color: #25e371;
    }
    .form-control {
        width: 100%;
    }
    .col-lg.col-md.col-sm-12.col-xs-12.extra_padding.B {
        padding: 10px 10px;
    }
    .abtn {
        padding: 11px 74px;
    }
    .head label {
        font-size: 13px;
        margin-bottom: 2px;
        color: white;
    }
    input {
        font-size: 14px !important;
    }
    select {
        font-size: 12px !important;
    }
    label {
        font-size: 13px;
        margin-bottom: 2px;
        color: gray;
    }
    .content_input {
        padding: 5px 10px;
    }
    .col-lg-6 .col-md-6 .content_input_width {
        width: 200px;
    }
    .video {
        width: 375px;
        height: 280px;
    }
}

@media (min-width: 1920px) {
    .logo {
        width: auto;
        height: 55px;
        float: left;
    }
    .logo_name {
        font-size: 25px;
        font-weight: bold;
        color: white
    }
    .form-control {
        width: 100%;
    }
    .col-lg.col-md.col-sm-12.col-xs-12.extra_padding.B {
        padding: 10px 10px;
    }
    .abtn {
        padding: 11px 100px;
    }
    .align_center {
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .head label {
        font-size: 13px;
        margin-bottom: 2px;
        color: white;
    }
    .video {
        width: 540px;
        height: 380px;       
    }
    input {
        font-size: 14px !important;
    }
    select {
        font-size: 12px !important;
    }
    label {
        font-size: 13px;
        margin-bottom: 2px;
        color: gray;
    }
    .content_input {
        padding: 5px 10px;
    }
    .col-lg-6 .col-md-6 .content_input_width {
        width: 250px;
    }
}


/*primary_settings*/


/*bichu custom css*/
.content-area {
    height: 373px;
    padding: 10px;
}
.os-y{
    overflow-y: scroll;
    border: 1px solid #e8e8e8;
}
.os-x{
    overflow-x: scroll;
    border: 1px solid #e8e8e8;
}
.borderx{
    border: 1px solid #e8e8e8;
}


/*bichu end custom css*/

.border-right-1px-light-gray{
    border-right: 1px solid #e8e8e8
}

.border-1px-light-gray{
    border: 1px solid #e8e8e8
}
.indication-boll {
    height: 30px;
    width: 30px;
    background: #a6dcbc;
    border-radius: 200px;
}
.indication-boll1 {
    height: 30px;
    width: 30px;
    background: #e8e8e8;
    border-radius: 200px;
}
.indication-boll::after {
    content: '';
    width: 1px;
    height: 100px;
    background-color: #a6dcbc;
    display: block;
    position: absolute;
    left: 50px;
    top: 100%;
}
.indication-boll-bottom {
    height: 30px;
    width: 30px;
    background: #a6dcbc;
    border-radius: 200px;
}
.indication-boll-bottom::after {
    background-color: #a6dcbc;
    content: '';
    width: 1px;
    height: 100px;
    display: block;
    position: absolute;
    left: 50px;
    bottom: 0%;
}
.indication-boll-active {
    height: 75px;
    width: 75px;
    border: 2px solid #3dba6f;
    border-radius: 200px;
    z-index: 3;
    background: #fff;
    position: absolute;
    padding: 16px 20px;
    
}
.indication-boll-active1 {
    height: 75px;
    width: 75px;
    border: 2px solid #e8e8e8;
    border-radius: 200px;
    z-index: 3;
    background: #e8e8e8;
    position: absolute;
    padding: 16px 20px;
    
}

.indication-boll-inactive{
    height: 30px;
    width: 30px;
    background: #e8e8e8;
    border-radius: 200px;
}
.indication-boll-inactive::before {
    content: '';
    width: 1px;
    height: 100px;
    background-color: #e8e8e8;
    display: block;
    position: absolute;
    left: 50px;
    bottom: 0%;
}
.indication-boll-inactive-top{
    height: 30px;
    width: 30px;
    background: #e8e8e8;
    border-radius: 200px;
}
.indication-boll-inactive-top::before {
    content: '';
    width: 1px;
    height: 100px;
    background-color: #e8e8e8;
    display: block;
    position: absolute;
    left: 50px;
    top: 44%;
}
.pt-100 {
    padding-top: 108px;
}

.border-2px-nice-green {
    border: 2px solid #3dba6f;
}

.hilighted{
/*    background-color: #22d0b8 !important;*/
    position: relative;
    border-left: 3px solid #22d0b8 !important;
}

.hilighted:after{
    font-family: "lindo-fonts" !important;
    content: "\e88f";
    font-style: normal !important;
    font-weight: normal !important;
    font-variant: normal !important;
    text-transform: none !important;
    speak: none;
    line-height: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    position: absolute;
    right: 10px;
    /* top: 10px; */
    padding-top: 20px;
    font-size: 40px;
    opacity: 0.08;
}
.hilighted_student{
/*    background-color: #22d0b8 !important;*/
    position: relative;
    border-left: 3px solid #22d0b8 !important;
}


#table_grid table{
    width: 100%;
    border-collapse: collapse;
    border: 1px solid #ebebeb;
}

#table_grid table thead tr th { 
    background: #bfbfbf;
    color: white;
    font-weight: bold;
    color: #000000;
    padding: 5px 10px;
    border: 1px solid #a7a7a7;
}

#table_grid table tr:nth-of-type(odd) { 
    background: #f7f7f7; 
}

#table_grid table tr:nth-of-type(even) { 
    background: #ffffff; 
}

#table_grid table tbody tr td{
    width: auto;
    color: #111111;
    padding: 5px 10px;
    border: 1px solid #f3f3f3;
}

@media 
only screen and (max-width: 760px),
(min-device-width: 768px) and (max-device-width: 1024px)  {


    #table_grid table, thead, tbody, th, td, tr { 
        display: block; 
    }

    #table_grid thead tr { 
        position: absolute;
        top: -9999px;
        left: -9999px;
    }

    #table_grid tbody tr { border: 1px solid #f3f3f3; }

    #table_grid table tbody tr td { 
        border: none;
        border-bottom: 1px solid #eee; 
        position: relative;
        padding-left: 50%; 
    }

    #table_grid table tbody tr td:before { 
        position: absolute;
        top: 6px;
        left: 6px;
        width: 45%; 
        padding-right: 10px; 
        white-space: nowrap;
    }	
    
    .table-condensed thead tr th, .table-condensed tbody tr td{
        display: revert;   
    }
}

@media only screen and (max-width: 480px) {
.std_mob_add_item{
    width: 15% !important;
    padding: 1% !important;
    float: left;
    
}

.stud_count{
    width: 35% !important;
    padding: 1% !important;
    float: left;
}
    
.std_mob_print {
    width: 10% !important;
    padding: 1% !important;
    padding-top: 2% !important;
    display: flex;
    justify-content: center;
    align-items: center;
}
    
.std_mob_template {
    width: 10% !important;
    padding: 1% !important;
    padding-top: 2% !important;
    display: flex;
    justify-content: center;
    align-items: center;
}
.std_mob_docup {
    width: 10% !important;
    padding: 1% !important;
    padding-top: 2% !important;
    display: flex;
    justify-content: center;
    align-items: center;
}
    
.std_mob_search {
    width: 10% !important;
    padding: 1% !important;
    padding-top: 2% !important;
    display: flex;
    justify-content: center;
    align-items: center;
}
    
.std_mob_sort {
    width: 10% !important;
    padding: 1% !important;
    padding-top: 2% !important;
    display: flex;
    justify-content: center;
    align-items: center;
}

.sec_grid_color:nth-of-type(odd) {
    background-color: #f5f5f5;
    color: #212121;
    border-left: 3px solid #f5f5f5;
    float: left;
    width: 100%;
}

.sec_grid_color:nth-of-type(even) {
    background-color: #efefef;
    color: #212121;
    border-left: 3px solid #efefef;
    float: left;
    width: 100%;
}

.std_pro_pic {
    float: left;
    width: 20%;
}

.std_pro_pic img {
    all: unset;
    width: 100% !important;
    height: 100% !important;
    padding: 5%;
    border: 5px solid #c1c1c1;
    border-radius: 150px;
    margin: 8%;
}

.std_pro_data {
    float: left;
    width: 80%;
}

.pms_wrapper_right{
    position: absolute !important;
    background-color: #ffffff !important;
    z-index: 99999;
    margin: 2%;
    width: 97% !important;
    border: 2px solid #dbdbdb;
    display:none;
}

.emp_std_details_right{
    text-align:left !important;
}

.emp_std_details_right .btn-group{
    float:left !important;
}

.emp_std_details_right .btn-group a{
    font-size: 0.7rem !important;
}


.emp_std_details_right .btn-group .fz-20{
    font-size: 12px !important;
}

.close_page{
    float: right;
    background-color: #f44336;
    width: 28px;
    height: 28px;
    border-radius: 150px;
}

.close_page a{
    color: #ffffff;
    font-size: 17px;
}

#zoom_add_page table thead tr th, #zoom_add_page table tbody tr td{
    float:left;
} 

#tab_profile_data .pl-0-r {
    padding-left: 0px !important;
    padding-right: 0px !important;
}
#tab_profile_data .form-group{
    float: left;
    margin-bottom: 0px !important;
    width: 50%;
    border: 1px solid #ebebeb;
}

#pms_list_tab ul li{
    float:left;
    width:33%;
}
.tab-struct {
    float: left;
    width: 100%;
}
        
}