body{ background-color: #f4f5f9; overflow-x: hidden;}

a{ color: #333; }

img{ max-width: 100%; }
ul,li{ list-style: none; margin: 0; padding: 0; }

.fa-eye{ color: #007bff;}
.fa-edit{ color: #28a745;}

.red{ color: red;}

.brand-link{ position: relative; }
.layout-fixed .brand-link{ width: auto; }
.content-wrapper {
    padding-bottom: calc(3.4rem + 1px);
    /*margin-top: calc(3.4rem + 1px);*/
    margin-top: 60px;
    /* background:
        radial-gradient(#ddd 1px, transparent 1px),
        radial-gradient(#ddd 1px, transparent 1px),
        #f4fffc;
    */
    background-position: 0 0, 10px 10px;
    background-size: 20px 20px;
}

.main-header,.main-footer {
    top: 0;
    left: 0;
    position: fixed;
    right: 0;
    z-index: 1032;
}

.main-header {
    box-shadow: 0 5px 10px rgb(27 67 131 / 18%);
    border: none;
    padding: 0 8px;
}

.main-header .navbar-nav .nav-item{ border-left: 1px solid #ccc; }

.main-header .navbar-nav .nav-item .nav-link{
  padding: 8px 18px;
  height: 100%;
  display: flex;
  align-items: center;
  color: #000; position: relative;transition: all 0.2s ease-in-out;
}
.main-header .navbar-nav .nav-item.active .nav-link{
  color: #fff;
  background-color: #cf1957; 
}

.main-header .nav-link:before{
  content: "";
    width: 0;
    height: 0;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-bottom: 8px solid #fff;
    position: absolute;
    bottom: -10px;
    left: 50%;
    transform: translateX(-50%);
    transition: all 0.2s ease-in-out;
    opacity: 0;
}

.main-header .navbar-nav .nav-item:hover .nav-link{
  color: #fff;
  background-color: #cf1957; 
}

.main-header .navbar-nav .nav-item.active .nav-link:before,
.main-header .navbar-nav .nav-item .nav-link:hover:before{
  bottom: 0;
  opacity: 1;
}

.main-header .dropdown-menu{ padding: 0; }
.main-header .dropdown-item:not(:last-child){ border-bottom: 1px solid #ccc; }


.user_dropdown .dropdown-toggle{ padding: 10px !important; }
.user_dropdown .dropdown-toggle img{ width:40px;}

.main-footer{ top: auto; bottom: 0; padding: 10px 15px; }

.card-footer .my_btn, .custom_filter .my_btn {
    background-color: #654dcf;
    border-color: #654dcf;
    color: #fff;
}

.input-group-append .btn{background-color: #e9ecef; border-color: #ced4da;}

.box,.card {
    position: relative;
    margin-bottom: 20px;
    width: 100%;
    background-color: #ffffff;
    border-radius: 10px; border:none;
    padding: 0px;
    -webkit-transition: .5s;
    transition: .5s;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    box-shadow:0 5px 10px rgb(27 67 131 / 25%);
}

.pull-up:hover{
    transform: translateY(-4px) scale(1.02);
    -webkit-box-shadow: 0 14px 24px rgb(223 230 240);
    box-shadow: 0 14px 24px rgb(49 102 187 / 18%);
    z-index: 999;
}

.box-body {
    padding: 15px;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    border-radius: 10px;
}


.card-header{ display: flex; justify-content: space-between; align-items: center; background-color: #c0cdde; }
.card-title,.card-title a{ font-size: 18px;
    color: #212229;
    float: none;
    font-weight: 500;
    font-family: "roboto", sans-serif;  }
.card-tools{ float: none; margin-left: auto; }
.card-tools .nav-pills .nav-link{ padding: 5px 21px; font-size: 14px; color: #475F7B;border-radius: 4px; }
.btn-tool{ color: #212229; }
.btn-group.show .btn-tool, .btn-tool:hover{ color: #fff; }

.card-header .nav-pills .nav-link.active, .card-header .nav-pills .show>.nav-link {
    background-color: #cf1957 !important;
    color: #fff;
}
.card-header .nav-pills .nav-link{ color: #000; }

#accordion .card-title a.collapsed:after,#accordion .card-title a:after{
    font-family: Font Awesome\ 5 Free;
    content:"\f067";
    font-size: 14px; line-height: 24px; font-weight: 600;
    position: absolute;right: 15px;
}
#accordion .card-title a:after{ content:"\f068"; }

.add_task_btn{ margin: -3px 0; background-color: #907f2f; color: #fff !important; }
.todo-list>li{ margin-bottom: 5px; background-color: #f3f3f3; border-left: 3px solid #907f2f; }

.todo-list>li .tools a{ color: #dc3545; }

.products-list .product-title{ color: #333; }

.dataTable tr th{ white-space: nowrap; }

/* Sidebar Section Start */

.main-sidebar{ 
    background-color: #112349; width: 250px;
    box-shadow: 5px 0px 10px rgb(27 67 131 / 40%) !important;
}
.main-sidebar:before {
  content: "";
  background: url("../../dist/images/sidebar_bg.jpg") left top;
  position: absolute;
  width: 100%;
  height: 100%;
  opacity: 0.4;
  background-size: 700px;
}

.sidebar-mini.sidebar-collapse .main-sidebar.sidebar-focused, 
.sidebar-mini.sidebar-collapse .main-sidebar:hover{width: 270px; }


/*.main-sidebar .sidebar{ padding-right: 0; }*/

[class*=sidebar-dark-] .sidebar a{ color: #fff; }

.brand-link .brand-image{ float: none; margin: 0 auto; display: block; max-height: 55px; }





.nav-pills .nav-link.active, .nav-pills .show>.nav-link{ background-color: #fff !important; color: #fff; }

.sidebar-dark-primary .nav-sidebar>.nav-item>.nav-link.active, 
.sidebar-light-primary .nav-sidebar>.nav-item>.nav-link.active{
    color: #fff !important;
    background-color: #cf1957 !important;
}


.nav-pills .nav-link:hover{ background-color: #d5dfea; }
.nav-pills .nav-link:not(.active):hover{ color: #000;background-color: #d5dfea; }

.nav-sidebar .nav-link>.right, .nav-sidebar .nav-link>p>.right{ right: 6px; }

.sidebar-mini.sidebar-collapse .main-sidebar .user-panel{
   justify-content: center;
}

.sidebar-mini.sidebar-collapse .sidebar .user-panel>.info{ width: 0;}

.sidebar-mini.sidebar-collapse .main-sidebar:hover::before{
  width: 270px;
}

.sidebar-mini.sidebar-collapse .main-sidebar:hover .sidebar .user-panel>.info{ width: auto;}

[class*=sidebar-dark-] .nav-sidebar>.nav-item.menu-open>.nav-link, 
[class*=sidebar-dark-] .nav-sidebar>.nav-item:hover>.nav-link, 
[class*=sidebar-dark-] .nav-sidebar>.nav-item>.nav-link:focus{
    background-color: #fff; color: #333;
}

[class*=sidebar-dark] .brand-link{ border-bottom: 1px solid #788cd8; }


[class*=sidebar-dark-] .nav-sidebar>.nav-item>.nav-treeview {
    background-color: #9c2c60; border-radius: 0 0 5px 5px; margin-top: -5px; padding-top: 5px;
}
[class*=sidebar-dark-] .nav-treeview>.nav-item>.nav-link,[class*=sidebar-dark-] .nav-treeview>.nav-item>.nav-link:hover {
    color: #fff;
}

[class*=sidebar-dark-] .nav-sidebar>.nav-item>.nav-treeview li:not(:last-child){ border-bottom: 1px solid #ddd; }

.nav-sidebar>.nav-item {
    margin-bottom: 5px;
    padding-bottom: 5px;
}
[class*=sidebar-dark] .user-panel{ border-color: rgba(255,255,255,0.5); }
.nav-sidebar .nav-item>.nav-link{ margin-bottom: 0; width: auto; }

.nav-sidebar .nav-item>.nav-link i{ width:25px; text-align:left; }

.user-panel .image{ padding-left: 0; }
.sidebar .os-content{ padding-right: 0; }


/* Pagination Start */

.page-link{ color: #333; }
.page-item.active .page-link {
    z-index: 3;
    color: #fff;
    background-color: #cf1957;
    border-color: #cf1957;
}

.page-link:focus{ box-shadow: 0 0 0 0.2rem rgb(144 127 47 / 25%); }


/* Custom Scrollbar css*/

::-webkit-scrollbar,.dataTables_scrollBody::-webkit-scrollbar {
  width: 6px; height: 6px;
}
 
::-webkit-scrollbar-track,.dataTables_scrollBody::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    border-radius: 10px;
    background-color: #F5F5F5;
}
 
::-webkit-scrollbar-thumb,.dataTables_scrollBody::-webkit-scrollbar-thumb  {
  border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
    background-color: #999;
}


.dataTables_scrollBody::-webkit-scrollbar-thumb{ background-color: #999; }


.table{ min-width: 99%; }
.table thead th{ white-space: nowrap; padding-top: 8px; padding-bottom: 8px;font-size: 15px;line-height: 16px; }
.table tr td{ padding: 5px; }
.table-striped{ border:1px solid #ddd; }
.table-bordered td, .table-bordered th{ border-color: #ccc;}
/*.table input{ max-width: 100px; }*/

.table tr.text-right, .table tr.text-right td, .table tr.text-right th{ text-align: right; }
.table .btn-sm{ padding: 2px 8px; }
.table .btn{ padding: 2px 12px; }

.view_btn {
    color: #fff !important;
    background-color: #36b37e;
    border-color: #36b37e;
    box-shadow: none;
    font-family: "roboto", sans-serif; font-weight: 500;
}

.custom_filter{ display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; margin-bottom: 15px; }
.custom_filter .form-group{ margin-right: 10px; margin-bottom: 0; }

.table .badge{ padding: 10px 20px; display: inline-block; }

.action_btn{ display: flex; align-items: center; }
.action_btn .btn{ white-space: nowrap; }
.action_btn i{
    width: 30px;
    height: 30px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px; cursor: pointer;
}

.dataTables_length{ float: left;}
.dt-buttons .btn{ border-radius: 5px !important;}

/* Login Page Design Start  */
/* Login Page Design Start  */

.login_text{
  font-family: 'Pacifico', cursive;
  position: absolute;
  left: 30px; top: 25%; 
  color: #fff; z-index: 2;
}

.login_text h1{font-size: 40px;}
.login_text p{font-size: 22px;}

.login_section {
  display: flex;
  align-items: center;
  width: 100%;
  background-color: #cf1957;
  padding: 50px;
  overflow: hidden;
  min-height: 100vh;
}

.login_form_box {
  width: 100%;
  max-width: 450px;
  border-radius: 10px;
  margin: 0 auto;
  background-color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative; z-index: 2;
}

.login_form_box form {
  width: 100%;
  padding: 10px 30px; text-align: center;
}
.login_form_box .form-group {
  margin-bottom: 12px; text-align: left;
}
.login_form_box .form-group label {
  margin-bottom: 5px;
}
.login_form_box a {
  color: #333;
  font-weight: bold;
}
.forgot_link {
  display: flex;
  justify-content: space-between;
}

.login_form_box .form-control {
  background-color: transparent;
  border-radius: 10px !important;
}

.login_btn {
  background-color: #8e123c !important;
  color: #fff !important;
  font-weight: bold;
  box-shadow: 0 10px 20px rgb(63 81 181 / 40%);
  padding: 8px 20px !important;
  width: auto !important; min-width: 160px;
  border-radius: 50px !important;
  margin: 10px auto;
  display: inline-block;
  transition: all 0.5s ease-in-out !important;
}

.login_btn:hover {
  transform: translateY(-5px);
  color: #fff;
  box-shadow: 0 20px 40px rgb(63 81 181 / 60%);
}

.login_logo {
  width: 200px;
  margin: 20px auto;
}
.login_users {
  display: flex;
  justify-content: space-around;
  text-align: center;
}
.login_users div img {
  margin: 10px auto;
  border-radius: 100%;
}

.login_form_box input::-webkit-input-placeholder {
  /* Edge */
  color: #333;
}

.login_form_box input:-ms-input-placeholder {
  /* Internet Explorer 10-11 */
  color: #333;
}

.login_form_box input::placeholder {
  color: #333;
}

.show_password {
  position: absolute;
  z-index: 9;
  right: 0;
  top: 0;
  width: 38px;
  height: 38px;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
}

.user_thum {
  position: relative;
}
.user_thum .form-check {
  position: absolute;
  top: 10px;
  padding-left: 0;
}
.user_thum .form-check label {
  height: 70px;
  width: 70px;
  /* border: 2px solid; */
  border-radius: 100%;
}
/* .user_thum .form-check input{ opacity: 0;} */

.register_form,.forgot_password_form{ display: none; }


.kids_img{ position: fixed; width: 450px; left: 20px; bottom: 0; z-index: 1; }
.grass_img{ position: fixed; left: 0; bottom: 0; z-index: 0; width: 100%;overflow-x: hidden;  }
.grass_img img{ height: 100px; max-width: unset; min-width: 100%; }
.boy_swing_img{
  position: absolute; top: -50px; right: 0; width: 200px; z-index: 1; 
}


.swingimage{
    -webkit-transform-origin: 50% 0;
    transform-origin: 50% 0;
    -webkit-animation: swinging 3.5s ease-in-out forwards infinite;
    animation: swinging 3.5s ease-in-out forwards infinite;
}

@-webkit-keyframes swinging{
    0%{-webkit-transform: rotate(10deg);}
    50%{-webkit-transform: rotate(-5deg)}
    100%{-webkit-transform: rotate(10deg);}
}

@keyframes swinging{
    0%{transform: rotate(10deg);}
    50%{transform: rotate(-5deg)}
    100%{transform: rotate(10deg);}
}

/* Form Design */

.custom-file {
  z-index: 0;
}

.flex_form .form-group {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  margin-bottom: 8px;
  justify-content: space-between;
}
.flex_form label {
  flex: 1;
}

.flex_form label{ max-width: calc(100% - 165px); display: flex; margin-right: 5px; line-height: 16px; }
.flex_form .error{ width: 100%;}

.flex_form .flex_label{ 
  flex: unset;max-width: unset;
}

section .form-control,
section .custom-file-label, .modal .form-control {
  width: auto;
  height: 30px; font-size: 14px;
  padding: 2px;
}
.flex_form input.form-control {
  max-width: 160px;
}

.modal .form-control{ width: 100%; max-width: 160px;}

select.form-control {
  min-width: 160px; max-width: 160px;
  flex: 1;
}

.dataTables_length select.form-control{ min-width: 55px; font-size: 14px; margin: 0 5px; }
.dataTables_scroll{ margin-bottom: 10px; }

.custom-file-label::after {
  height: 30px;
  padding: 2px 12px;
}
.input-group.date {
  max-width: 170px;
  display: flex;
}
.input-group.date .form-control {
  width: 1%;
}
label:not(.form-check-label):not(.custom-file-label) {
  font-weight: 600;
  font-size: 14px;
}

.react-datepicker-wrapper {
  max-width: 160px;
  position: relative;
}
.react-datepicker-wrapper input {
  height: 30px;
  width: 100%;
  display: flex !important;
  border: 1px solid #ced4da;
  border-radius: 0.25rem;
}
.react-datepicker-wrapper::after {
  content: "\f133";
  font-family: Font Awesome\5 Free;
  font-weight: 600;
  color: #333;
  width: 35px;
  height: 28px;
  background-color: #e9ecef;
  position: absolute;
  right: 1px;
  top: 1px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 0 0.25rem 0.25rem 0;
}

.simple_field label {
  flex: unset;
}
.simple_field .input-group,
.simple_field textarea,.simple_field .cke_chrome {
  flex: 1;
  margin-left: 10px;
  height: auto;
}


.file_upload_box{ display: flex; width: 160px;}
.view_icon{ 
  width: 30px; height: 30px; 
  display: flex; align-items: center; justify-content: center;
  color: #04AA6D !important;
}

.file_upload .file_upload_box .custom-file{ flex: 1;}

.file_upload .custom-file {
  position: relative;
  border: 1px solid #ddd;
  border-radius: 5px;
  width: 150px; height: 30px; padding: 0 10px; flex: unset;
}
.file_upload .custom-file::before{
  content: "Upload";
  margin-top: 2px;
  display: inline-block;
}
.file_upload .custom-file::after{
  content: "\f574";
    font-family: Font Awesome\ 5 Free;
  color: #333;
  font-size: 18px;
  font-weight: bold;
  position: absolute;
  right: 8px;
  bottom: 1px;
}
.file_upload .form-control{
  max-width: 150px;
  opacity: 0;
  position: absolute;
  width: 100%; top: 0;
}

.toggle-group label{ line-height: 28px;}

/* Profile Page Design Start */

.info_list{ display: flex; flex-wrap: wrap; }
.info_list li{ 
    display: flex; justify-content: space-between; 
    width: 33.33%; padding: 5px 15px;
    border-right: 1px solid #333; 
}
.info_list li:nth-child(3n){ border: none; }
.ui-widget-content{ background-color: white; max-height: 100px; overflow: auto; border: 1px solid #ccc; width: 150px;}

.box-icon {
  font-size: 40px;
  color: #112349;
}

/* For Date Picker Design */

input[type="date"],input[type="month"]{
  min-width:120px;position: relative; width: 100%; max-width: 160px;
   opacity: 1;
   display: block; text-align: right; padding-right: 50px !important;
   background: url(../../dist/images/calendar_icon.jpg) no-repeat top+3px right+5px ;
   background-size: 20px 20px;
   
}

input[type="number"]{
  text-align: right; padding: 2px 8px;
}


::-webkit-calendar-picker-indicator {
  position:absolute;
  width:2.5rem;
  height:100%;
  top:0;
  right:0;
  bottom:0;
  opacity:0;
  cursor:pointer;
  color:rgba(0, 120, 250, 1);
  background:rgba(0, 120, 250, 1);
 
}

  /* Chrome, Safari, Edge, Opera */
  input::-webkit-outer-spin-button,
  input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
  }
  
  /* Firefox */
  input[type=number] {
    -moz-appearance: textfield;
    appearance: textfield;
  }

/* parent dashboard start*/ 
.kids-details-box { display: flex; background-color: #eaf0f8; box-shadow: inset 0 3px 10px #aabfdb; padding: 15px; } 
.table-box td, .table-box th { vertical-align: top; border-top: 0px solid #dee2e6; padding: 2px; font-size: 18px; } 
.kids_detail_list li{margin-bottom: 15px;}
.kids_detail_list li:last-child{margin-bottom: 0;}
.kids_detail_list h3 { font-size: 22px; font-weight: 600; padding-bottom: 5px;} 
.kids-details-box .item-img { height: 80px; width: 80px; background-color: #4dd0e1; border-radius: 50%; text-align: center; overflow: hidden; margin-right: 20px; flex: 0 0 80px; } 

/* parent dashboard end */

.food_data_list{
    min-height: 40px;
    max-height: calc(100vh - 350px);
    overflow-y: auto;
}


.item-icon {
    position: relative;
    height: 80px;
    width: 80px;
    line-height: 80px;
    border-radius: 50%;
    text-align: center;
}
.item-icon i:before{font-size: 44px; line-height: 80px; margin: 0 auto;}

/* All Text Colors CSS */
.text-blue { color: #3f7afc;}
.text-green { color: #3cb878;}
.text-orange { color: #ffa001;}
.text-red { color: #ff0000;}
.text-magenta { color: #8e24aa;}
.text-dodger-blue { color: #2196f3;}
.text-mauvelous { color: #f48fb1; }
.text-orange-peel { color: #ffa000; }
.text-dark-pastel-green { color: #00c853; }
.text-true-v { color: #9575cd;}
.text-violet-blue { color: #a864a8;}
.text-light-sea-green { color: #1cbbb4; }
.text-martini { color: #bcaaa4; }
.text-yellow { color: #fbd540; }
.text-orange-red { color: #ff0000; }

/* All Background Color  */
.bg-transparent { background-color: transparent;}
.bg-dark-high { background-color: #000000;}
.bg-dark-medium { background-color: #111111; }
.bg-dark-normal { background-color: #222222;}
.bg-dark-low { background-color: #444444;}

.bg-ash { background-color: #f0f1f3 !important;}
.bg-red { background-color: #ff0000;}
.bg-orange-red { background-color: #ff0000;}
.bg-blue { background-color: #304ffe;}
.bg-blue-dark { background-color: #042954;}
.bg-yellow { background-color: #fbd540;}
.bg-yellow2 { background-color: #ffb822;}
.bg-yellow3 { background-color: #f0a70d;}
.bg-orange { background-color: #fbd540;}
.bg-orange-peel { background-color: #ffa000;}
.bg-skyblue { background-color: #40dfcd;}
.bg-pink { background-color: #f939a1;}
.bg-pink2 { background-color: #ff5252;}
.bg-pink3 { background-color: #ef3232;}
.bg-mauvelous { background-color: #f48fb1;}
.bg-light-red { background-color: #ffeaea;}
.bg-light-yellow { background-color: #fff2d8;}
.bg-light-blue { background-color: #e1f1ff;}
.bg-dodger-blue { background-color: #2196f3;}
.bg-violet-blue { background-color: #a864a8;}
.bg-light-green { background-color: #d1f3e0;}
.bg-dark-pastel-green { background-color: #00c853;}
.bg-light-sea-green { background-color: #1cbbb4;}
.bg-light-green2 { background-color: #64d9bc;}
.bg-light-green3 { background-color: #4ec9aa;}
.bg-light-magenta { background-color: #f3e5f5;}
.bg-martini { background-color: #bcaaa4;}
.bg-true-v { background-color: #9575cd;}
.bg-wild-strawberry { background-color: #ff4081;}


/* View List Design */

.view_list {
    display: flex;
    flex-wrap: wrap;
}

.view_list ul {
    display: flex;
    flex: 1;
    flex-wrap: wrap;
}
.view_list ul li {
    width: 33.33%;
    padding-right: 15px;
    margin-bottom: 12px;
    display: flex;
    align-items: flex-start;
    /* justify-content: space-between; */
}
.view_list ul li b {
    width: 152px;
    position: relative;
    line-height: 18px;
    font-size: 15px;
    display: flex;
    justify-content: space-between;
}
.view_list ul li b::after {
    content: ":";
    font-weight: bold;
    margin-right: 0;
    margin-left: 10px;
}
.view_list ul li span {
    flex: 1;
    min-height: 25px; margin-left: 10px;
    border-bottom: 1px solid #666;
}

.view_list ul.pic_img_box {
    width: 120px;
    flex: unset;
}
.view_list ul.pic_img_box li {
    width: 100%;
    padding: 0;
    flex-direction: column;
    align-items: center;
}
.view_list ul.pic_img_box li b {
    width: auto;
}
.view_list ul.pic_img_box li b::after {
    display: none;
}
.view_list ul.pic_img_box img {
    width: auto;
}

#viewTitile {
    display: none;
}

.filter_data_box {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.boreder_devider {
    width: 100% !important;
    border-bottom: 1px solid #000;
}

.dataTables_wrapper .dataTables_length {
    float: left;
}
.dataTables_wrapper .dataTables_filter{ float: right;}
.dt-buttons .btn{ border-radius: 4px !important; padding: 3px 12px;}

th.select-checkbox{ width: 20px !important;}

@media print {
    body {
        margin: 0;
        padding: 0;
    }
    .card-body {
        padding: 0;
    }
    tr td,
    tr th {
        border-color: #000;
    }
    .view_list ul li {
        width: 50%;
    }
    #viewTitile {
        display: block;
        text-align: center;
        border-bottom: 1px solid #000;
        margin-bottom: 20px;
        padding-bottom: 5px;
        margin-top: -5px;
    }
}


.dataTables_scrollHeadInner{ width: auto !important;}

.student_table tr th{ white-space: normal;}

.personal_info{border: 1px solid #ddd; padding: 10px; margin-bottom: 10px;}
.personal_info h5{ border-bottom: 1px dashed #ddd; margin-top: -5px; margin-bottom: 10px;}

.form_box{ border: 1px solid #ddd; padding: 5px 5px 0; margin-bottom: 8px;}
.form_box select{ margin-bottom: 0 !important;}

/* All Media Query */
/* for second mam column structure */
      @media screen and (min-width: 1199.98px) and (max-width: 1400px) {
        .flex_form .col-xl-4 {
            -webkit-flex: 0 0 25%;
            -ms-flex: 0 0 25%;
            flex: 0 0 25%;
            max-width: 25%;
        }
    }
      @media screen and (min-width: 991.98px) and (max-width: 1200px) {
        .flex_form .col-xl-4 {
            -webkit-flex: 0 0 33.333333%;
            -ms-flex: 0 0 33.333333%;
            flex: 0 0 33.333333%;
            max-width: 33.333333%;
        }
    }
@media only screen and (min-width: 1366px) and (max-width: 1500px) {
  .login_text h1{ font-size: 34px; }
  .login_text p { font-size: 20px;}

}

@media only screen and (max-width: 1600px) {
  .login_text{ width: 300px; }
  
}

@media only screen and (max-width: 1280px) {

  .login_text h1{ font-size: 36px; }

}

@media only screen and (max-width: 1024px) {

  .login_text { position: relative; top:0;}

}

@media only screen and (max-width: 991px) {
  .login_section{ flex-direction: column; padding: 20px; }
  .login_text {
    position: relative;
    width: auto;
    left: auto;
    top: auto;
    text-align: center;
    margin-bottom: 10px;
  }

  .login_text p{ font-size: 20px; margin-bottom: 5px; }
  .login_text h1{ font-size: 32px; }

}

@media only screen and (max-width: 430px) {
  .login_text h1{ font-size: 22px; }
}

@media only screen and (max-width: 1440px) {
  .layout-fixed .brand-link{ padding: 5px; }
  .main-header .navbar-nav .nav-item .nav-link{ padding: 22px 10px }
  .layout-fixed .brand-link{ max-width: 150px; }

}

@media only screen and (min-width: 1400px) {
 .col-xxl-1,.col-xxl-2,.col-xxl-3,.col-xxl-4,.col-xxl-5,
 .col-xxl-6,.col-xxl-7,.col-xxl-8,.col-xxl-9,
 .col-xxl-10,.col-xxl-11,.col-xxl-12{ flex: 0 0 auto;
 }
 .col-xxl-1 { width: 8.33333333%;}
 .col-xxl-2 { width: 16.66666667%;}
 .col-xxl-3 { width: 25%;}
 .col-xxl-4 {width: 33.33333333%;}
 .col-xxl-5 {width: 41.66666667%;}
 .col-xxl-6 {width: 50%;}
 .col-xxl-7 {width: 58.33333333%;}
 .col-xxl-8 {width: 66.66666667%;}
 .col-xxl-9 {width: 75%; }
 .col-xxl-10 {width: 83.33333333%;}
 .col-xxl-11 {width: 91.66666667%;}
 .col-xxl-12 {width: 100%;}
}
@media screen and (min-width: 1280px) and (max-width: 1366px) {
    .wrapper.login_section:before{ left: 42.8%; }
}

@media screen and (max-width: 1280.98px) {
  .kids_img{ width: 300px; }
  .boy_swing_img{ width: 160px; }
}

@media screen and (max-width: 1199.98px) {
  .layout-fixed .brand-link{ max-width: unset; padding: 15px; }
  .main-header .nav-link:before{ display: none; }
  .main-header .navbar-nav .nav-item{ border-bottom: 1px solid #ccc; }
  .main-header .navbar-nav{ max-height: calc(100vh - 120px); overflow-y: auto; }

}

@media screen and (min-width: 1100px) and (max-width: 1279px) {
    .wrapper.login_section:before{ left: 41.8%; }
}

@media screen and (min-width: 992px) and (max-width: 1099px) {
    .wrapper.login_section:before{ left: 40.3%; }
}

@media screen and (max-width: 991.98px) {
  .kids_img{ width: 180px; left: 0; }
  .boy_swing_img{ width: 100px; }
  .grass_img img{ height: 60px; }
}


@media screen and (min-width: 768px) and (max-width: 991.98px) {
    .wrapper.login_section:before{ left: 39.3%; }
}

@media screen and (min-width: 768px) {

  body:not(.sidebar-mini-md):not(.sidebar-mini-xs):not(.layout-top-nav) .content-wrapper, 
  body:not(.sidebar-mini-md):not(.sidebar-mini-xs):not(.layout-top-nav) .main-footer, 
  body:not(.sidebar-mini-md):not(.sidebar-mini-xs):not(.layout-top-nav) .main-header{
    /*margin-left: 250px;*/
    margin-left: 0;
  }

}

@media screen and (min-width: 992px) {

  .sidebar-mini.sidebar-collapse .main-sidebar, .sidebar-mini.sidebar-collapse .main-sidebar::before {
        margin-left: 0;
        width: 90;
  }

}


@media screen and (max-width: 991.98px) {
    body:not(.sidebar-mini-md):not(.sidebar-mini-xs):not(.layout-top-nav) .content-wrapper, 
    body:not(.sidebar-mini-md):not(.sidebar-mini-xs):not(.layout-top-nav) .main-footer, 
    body:not(.sidebar-mini-md):not(.sidebar-mini-xs):not(.layout-top-nav) .main-header {
    margin-left: 0;
    }

    .sidebar-collapse .main-sidebar, .sidebar-collapse .main-sidebar::before{ margin-left: -270px; }
}


@media screen and (max-width: 767.98px) {
    .login_box{ flex-wrap: wrap; flex-direction: column; }
    .login_left{ width: 100%; height: 180px; }
    .login_form_box{ width: 100%; }
    .login_form_box:before{ transform: translate(-50%,0); left: 50%; top: 0; width: 1200px; height: 800px; }

    .wrapper.login_section:before{
        width: 1200px; height: 800px;  border-radius: 100%;
        top: 32%;
        left: 50%;
        transform: translateX(-50%);
    }
    
}

@media screen and (min-width: 575.98px) and (max-width: 767.98px) {
  .flex_form input.form-control,.file_upload_box,select.form-control{max-width: 145px; min-width: unset;}

}

@media screen and (max-width: 575.98px) {
  .login_section{ padding: 20px; }
  .login_form_box form{ padding: 10px 15px; }
  select.form-control{ max-width: 160px; }
  input[type=date] {
    min-width: 160px;
  }

  .main-footer{ text-align: center; }
  .main-footer strong{ display: block; }

}



.fee_filter_box{ display: flex; flex-wrap: wrap; align-items: center; margin-bottom: 20px; }
.fee_filter_box .form-group{ padding: 0 15px; flex-wrap: nowrap;}
.fee_filter_box label{ display: flex; margin-right: 20px; white-space: nowrap; }



select{
  margin-bottom: 10px;
}
.select2 {
  width: 200px;
  min-width: 160px;
  max-width: 160px;
  flex: 1;
  height: 30px;
  margin-bottom: 10px;
}

.select2 .select2-selection{
  font-size: 15px;
  height: 30px;
  padding: 4px 10px;
}
.select2 .select2-selection__arrow {
  height: 25px !important;
}







