@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,600,700,800|Roboto:400,500,700');



* {
    margin: 0;
    padding: 0;
    -webkit-font-smoothing: antialiased;
    -webkit-text-shadow: rgba(0, 0, 0, .01) 0 0 1px;
    text-shadow: rgba(0, 0, 0, .01) 0 0 1px;
}



body {
    font-family: 'Roboto', sans-serif;
    font-size: 14px;
    font-weight: 400;
    background: #FFFFFF;
    color: #a5a5a5;
}



div {
    display: block;
    position: relative;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}



ul {

    list-style: none;

    margin-bottom: 0px;

}



p {

    font-family: 'Roboto', sans-serif;

    font-size: 14px;

    line-height: 2.29;

    font-weight: 400;

    color: #a5a5a5;

    -webkit-font-smoothing: antialiased;

    -webkit-text-shadow: rgba(0, 0, 0, .01) 0 0 1px;

    text-shadow: rgba(0, 0, 0, .01) 0 0 1px;

}



p a {

    display: inline;

    position: relative;

    color: inherit;

    border-bottom: solid 1px #ffa07f;

    -webkit-transition: all 200ms ease;

    -moz-transition: all 200ms ease;

    -ms-transition: all 200ms ease;

    -o-transition: all 200ms ease;

    transition: all 200ms ease;

}



a,

a:hover,

a:visited,

a:active,

a:link {

    text-decoration: none;

    -webkit-font-smoothing: antialiased;

    -webkit-text-shadow: rgba(0, 0, 0, .01) 0 0 1px;

    text-shadow: rgba(0, 0, 0, .01) 0 0 1px;

}



p a:active {

    position: relative;

    color: #FF6347;

}



p a:hover {

    color: #FFFFFF;

    background: #ffa07f;

}



p a:hover::after {

    opacity: 0.2;

}



::selection {

    background: #FFD266;

    color: #C88E00;

}



p::selection {

    background: #FFD266;

    color: #C88E00;

}



h1 {

    font-size: 36px;

}



h2 {

    font-size: 22px;

}



h3 {

    font-size: 18px;

}



h4 {

    font-size: 14px;

}



h5 {

    font-size: 11px;

}



h1,

h2,

h3,

h4,

h5,

h6 {

    font-family: 'Roboto', sans-serif;

    -webkit-font-smoothing: antialiased;

    -webkit-text-shadow: rgba(0, 0, 0, .01) 0 0 1px;

    text-shadow: rgba(0, 0, 0, .01) 0 0 1px;

}



h1::selection,

h2::selection,

h3::selection,

h4::selection,

h5::selection,

h6::selection {}



::-webkit-input-placeholder {

    font-size: 14px !important;

    font-weight: 500 !important;

    color: #a5a5a5 !important;

}



:-moz-placeholder
/* older Firefox*/

    {

    font-size: 14px !important;

    font-weight: 500 !important;

    color: #a5a5a5 !important;

}



::-moz-placeholder
/* Firefox 19+ */

    {

    font-size: 14px !important;

    font-weight: 500 !important;

    color: #a5a5a5 !important;

}



:-ms-input-placeholder {

    font-size: 14px !important;

    font-weight: 500 !important;

    color: #a5a5a5 !important;

}



::input-placeholder {

    font-size: 14px !important;

    font-weight: 500 !important;

    color: #a5a5a5 !important;

}



.form-control {

    color: #db5246;

}



section {

    display: block;

    position: relative;

    box-sizing: border-box;

}



.clear {

    clear: both;

}



.clearfix::before,

.clearfix::after {

    content: "";

    display: table;

}



.clearfix::after {

    clear: both;

}



.clearfix {

    zoom: 1;

}



.float_left {

    float: left;

}



.float_right {

    float: right;

}



.trans_200 {

    -webkit-transition: all 200ms ease;

    -moz-transition: all 200ms ease;

    -ms-transition: all 200ms ease;

    -o-transition: all 200ms ease;

    transition: all 200ms ease;

}



.trans_300 {

    -webkit-transition: all 300ms ease;

    -moz-transition: all 300ms ease;

    -ms-transition: all 300ms ease;

    -o-transition: all 300ms ease;

    transition: all 300ms ease;

}



.trans_400 {

    -webkit-transition: all 400ms ease;

    -moz-transition: all 400ms ease;

    -ms-transition: all 400ms ease;

    -o-transition: all 400ms ease;

    transition: all 400ms ease;

}



.trans_500 {

    -webkit-transition: all 500ms ease;

    -moz-transition: all 500ms ease;

    -ms-transition: all 500ms ease;

    -o-transition: all 500ms ease;

    transition: all 500ms ease;

}



.fill_height {

    height: 100%;

}



.super_container {

    width: 100%;

    overflow: hidden;

}



.prlx_parent {

    overflow: hidden;

}



.prlx {

    height: 130% !important;

}



.nopadding {

    padding: 0px !important;

}





/*********************************

3. Header

*********************************/



.header {

    position: fixed;

    top: 45px;

    left: 50%;

    -webkit-transform: translateX(-50%);

    -moz-transform: translateX(-50%);

    -ms-transform: translateX(-50%);

    -o-transform: translateX(-50%);

    transform: translateX(-50%);

    width: 1318px;

    height: 104px;

    background: #FFFFFF;

    z-index: 10;

    -webkit-transition: all 200ms ease;

    -moz-transition: all 200ms ease;

    -ms-transition: all 200ms ease;

    -o-transition: all 200ms ease;

    transition: all 200ms ease;

}



.header.scrolled {

    top: 15px;

}



.header.scrolled .header_content::before {

    box-shadow: 0px 20px 49px rgba(0, 0, 0, 0.17);

}



.header_content {

    width: calc(100% - 279px);

    height: 100%;

}



.header_content::before {

    display: block;

    position: absolute;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    content: '';

    box-shadow: 0px 20px 49px rgba(0, 0, 0, 0.67);

    z-index: -1;

}



/*********************************

3.1 Logo

*********************************/



.logo_container {

    display: inline-block;

    padding-left: 15px;
    padding-right: 10px;

}



.logo .logo_under {

    display: flex;

}



.logo .logo_under .logo_one {

    display: flex;

}



.logo .logo_under .logo_one img {
    align-self: center;
    width: 90px;
}



.logo .logo_under .logo_two {
    padding-left: 15px;
    display: flex;
    width: 165px;
}

.logo .logo_under .logo_two span {
    align-self: center;
}



.logo span {

    font-family: 'Open Sans', sans-serif;

    font-size: 25px;

    font-weight: 900;

    color: #3a3a3a;

    vertical-align: middle;

    text-transform: uppercase;

    margin-left: 3px;

}



/*********************************

3.2 Main Nav

*********************************/



.main_nav_container {

    display: inline-block;

    margin: auto;

    padding-right: 20px;

}



.main_nav {

    margin-top: 7px;

}



.main_nav_item {

    display: inline-block;

    margin-right: 20px;

}



.main_nav_item:last-child {

    margin-right: 0px;

}



.main_nav_item a {

    font-family: 'Open Sans', sans-serif;

    font-size: 14px;

    text-transform: uppercase;

    font-weight: 700;

    color: #3a3a3a;

    -webkit-transition: all 200ms ease;

    -moz-transition: all 200ms ease;

    -ms-transition: all 200ms ease;

    -o-transition: all 200ms ease;

    transition: all 200ms ease;

}



.main_nav_item a:hover {

    color: #ffb606;

}



.main_nav_container .sub_nav {

    display: none;

}



.main_nav_container .dropdown:hover .sub_nav {

    display: block;

    position: absolute;

    background-color: #f7f7f7;

    z-index: 999;

    padding: 15px 0;

    left: 0px;

}



.main_nav_container .dropdown .sub_nav a {

    padding-top: 10px;

    padding-bottom: 10px;

}



/*********************************

3.3 Header Side

*********************************/



.header_side {

    width: 279px;

    height: 100%;

    background: #ffb606;

}



.header_side img {

    width: 29px;

    height: 29px;

}



.header_side span {

    display: block;

    position: relative;

    font-size: 18px;

    font-weight: 500;

    color: #FFFFFF;

    padding-left: 12px;

}











/*********************************

15. Footer

*********************************/



.footer {

    width: 100%;

    padding-top: 86px;

    background: #1a1a1a;

}



.footer .section_title h1 {

    color: #FFFFFF;

}



/*********************************

15.1 Newsletter

*********************************/



.newsletter {

    padding-bottom: 85px;

    border-bottom: solid 2px #4d4e4e;

}



.newsletter_form_container {

    width: 60%;

    margin-top: 48px;

}



.newsletter_email {

    width: calc(100% - 164px);

    height: 42px;

    border: none;

    padding-left: 27px;

    font-weight: 500;

    color: #1a1a1a;

}



.newsletter_email:focus {

    outline: solid 2px #ffb606;

}



.newsletter_submit_btn {

    width: 164px;

    height: 42px;

    border: none;

    background: #ffb606;

    color: #FFFFFF;

    font-size: 14px;

    font-weight: 500;

    cursor: pointer;

}



.newsletter_submit_btn:focus {

    border: solid 2px #FFFFFF;

}



/*********************************

3.4 Hamburger

*********************************/



.hamburger_container {

    position: absolute;

    top: 50%;

    -webkit-transform: translateY(-50%);

    -moz-transform: translateY(-50%);

    -ms-transform: translateY(-50%);

    -o-transform: translateY(-50%);

    transform: translateY(-50%);

    right: 20px;

    display: none;

    cursor: pointer;

}



.hamburger_container i {

    font-size: 24px;

    padding: 10px;

    color: #3a3a3a;

}



.hamburger_container:hover i {

    color: #ffb606;

}



/*********************************

4. Menu

*********************************/



.menu_container {

    position: fixed;

    top: 0;

    right: -50vw;

    width: 50vw;

    height: 100vh;

    background: #FFFFFF;

    z-index: 12;

    -webkit-transition: all 0.6s ease;

    -moz-transition: all 0.6s ease;

    -ms-transition: all 0.6s ease;

    -o-transition: all 0.6s ease;

    transition: all 0.6s ease;

    visibility: hidden;

    opacity: 0;

}



.menu_container.active {

    visibility: visible;

    opacity: 1;

    right: 0;

}



.menu {

    position: absolute;

    top: 150px;

    left: 0;

    padding-left: 15%;

}



.menu_list {

    -webkit-transform: translateY(3.5rem);

    -moz-transform: translateY(3.5rem);

    -ms-transform: translateY(3.5rem);

    -o-transform: translateY(3.5rem);

    transform: translateY(3.5rem);

    -webkit-transition: all 200ms ease;

    -moz-transition: all 200ms ease;

    -ms-transition: all 200ms ease;

    -o-transition: all 200ms ease;

    transition: all 1000ms 600ms ease;

    opacity: 0;

}



.menu_container.active .menu_list {

    -webkit-transform: translateY(0px);

    -moz-transform: translateY(0px);

    -ms-transform: translateY(0px);

    -o-transform: translateY(0px);

    transform: translateY(0px);

    opacity: 1;

}



.menu_item {

    margin-bottom: 9px;

}



.menu_item a {

    font-family: 'Open Sans', sans-serif;

    font-size: 36px;

    font-weight: 700;

    color: #3a3a3a;

    -webkit-transition: all 200ms ease;

    -moz-transition: all 200ms ease;

    -ms-transition: all 200ms ease;

    -o-transition: all 200ms ease;

    transition: all 200ms ease;

}



.menu_item a:hover {

    color: #ffb606;

}



.menu_close_container {

    position: absolute;

    top: 86px;

    right: 79px;

    width: 21px;

    height: 21px;

    cursor: pointer;

    -webkit-transform: rotate(45deg);

    -moz-transform: rotate(45deg);

    -ms-transform: rotate(45deg);

    -o-transform: rotate(45deg);

    transform: rotate(45deg);

}



.menu_close {

    top: 9px;

    width: 21px;

    height: 3px;

    background: #3a3a3a;

    -webkit-transition: all 200ms ease;

    -moz-transition: all 200ms ease;

    -ms-transition: all 200ms ease;

    -o-transition: all 200ms ease;

    transition: all 200ms ease;

}



.menu_close::after {

    display: block;

    position: absolute;

    top: -9px;

    left: 9px;

    content: '';

    width: 3px;

    height: 21px;

    background: #3a3a3a;

    -webkit-transition: all 200ms ease;

    -moz-transition: all 200ms ease;

    -ms-transition: all 200ms ease;

    -o-transition: all 200ms ease;

    transition: all 200ms ease;

}



.menu_close_container:hover .menu_close,

.menu_close_container:hover .menu_close::after {

    background: #ffb606;

}



/*********************************

4.1 Menu Social

*********************************/



.menu_social_container {

    margin-top: 100px;

    -webkit-transform: translateY(3.5rem);

    -moz-transform: translateY(3.5rem);

    -ms-transform: translateY(3.5rem);

    -o-transform: translateY(3.5rem);

    transform: translateY(3.5rem);

    -webkit-transition: all 1000ms 1000ms ease;

    -moz-transition: all 1000ms 1000ms ease;

    -ms-transition: all 1000ms 1000ms ease;

    -o-transition: all 1000ms 1000ms ease;

    transition: all 1000ms 1000ms ease;

    opacity: 0;

    padding-left: 4px;

}



.menu_social_item {

    display: inline-block;

    margin-right: 30px;

}



.menu_social_item a i {

    color: #3a3a3a;

}



.menu_social_item a i:hover {

    color: #ffb606;

}



.menu_container.active .menu_social_container {

    -webkit-transform: translateY(0px);

    -moz-transform: translateY(0px);

    -ms-transform: translateY(0px);

    -o-transform: translateY(0px);

    transform: translateY(0px);

    opacity: 1;

}



/*********************************

4.2 Menu copyright

*********************************/



.menu_copyright {

    margin-top: 30px;

    -webkit-transform: translateY(3.5rem);

    -moz-transform: translateY(3.5rem);

    -ms-transform: translateY(3.5rem);

    -o-transform: translateY(3.5rem);

    transform: translateY(3.5rem);

    -webkit-transition: all 1000ms 1200ms ease;

    -moz-transition: all 1000ms 1200ms ease;

    -ms-transition: all 1000ms 1200ms ease;

    -o-transition: all 1000ms 1200ms ease;

    transition: all 1000ms 1200ms ease;

    opacity: 0;

    padding-left: 3px;

}



.menu_container.active .menu_copyright {

    -webkit-transform: translateY(0px);

    -moz-transform: translateY(0px);

    -ms-transform: translateY(0px);

    -o-transform: translateY(0px);

    transform: translateY(0px);

    opacity: 1;

}







/*********************************

9. Contact

*********************************/



.contact {

    padding-top: 106px;

    padding-bottom: 117px;

}



.contact_title {

    font-size: 36px;

    font-weight: 500;

    color: #1a1a1a;

}



.contact_form_container {

    margin-top: 70px;

}



.input_field {

    width: 100%;

    background: #f8f4f4;

    border: solid 2px transparent;

    margin-bottom: 24px;

    height: 42px;

    padding-left: 33px;

}



.input_field:focus {

    outline: none !important;

    border-color: #ffb606;

}



.text_field {

    width: 100%;

    height: 189px;

    background: #f8f4f4;

    border: solid 2px transparent;

    padding-left: 33px;

    margin-bottom: 24px;

}



.text_field:focus {

    outline: none !important;

    border-color: #ffb606;

}



.contact_send_btn {

    width: 100%;

    height: 48px;

    background: #ffb606;

    font-size: 14px;

    font-weight: 700;

    text-transform: uppercase;

    color: #FFFFFF;

    cursor: pointer;

    border: none;

}



.contact_send_btn:focus {

    outline: solid 1px #ffb606;

    border: green !important;

}



/*********************************

10. our_mission

*********************************/

.our_mission {

    margin: 50px 0 0 0;

}



.our_mission .heading {

    margin-bottom: 20px;

}



.our_mission .mission_padd {

    padding: 30px 50px;

}



.our_mission .rounded-start {

    max-width: 35%;

    float: left;

    margin: 11px 15px 15px 0px;

}



/*********************************

10. our_vision

*********************************/

.our_vision {

    margin: 50px 0 0 0;

}



.our_vision .heading {

    margin-bottom: 20px;

}



.our_vision .mission_padd {

    padding: 30px 50px;

}



.our_vision .rounded-start {

    max-width: 35%;

    float: left;

    margin: 11px 15px 15px 0px;

}



/*********************************

10. our_journey

*********************************/

.our_journey {

    margin: 50px 0 0 0;

}



.our_journey .heading {

    margin-bottom: 20px;

}



.our_journey .mission_padd {

    padding: 30px 50px;

}



.our_journey .rounded-start {

    max-width: 35%;

    float: left;

    margin: 11px 15px 15px 0px;

}



/*********************************

10. our_principal

*********************************/

.our_principal {

    margin: 50px 0 0 0;

}



.our_principal .heading {

    margin-bottom: 20px;

}



.our_principal .mission_padd {

    padding: 30px 50px;

}



.our_principal .rounded-start {

    max-width: 35%;

    float: left;

    margin: 11px 15px 15px 0px;

}



/*********************************

10. About

*********************************/



.about_title {

    font-size: 36px;

    font-weight: 500;

    color: #1a1a1a;

}



.about_text {

    margin-top: 20px;

}



.contact_info {
    margin-top: 64px;
    /* padding-left: 46px; */
}

.contact_info .common {
    display: flex;
    flex-direction: row;
}



.contact_info_item {

    font-size: 14px;

    font-weight: 400;

    color: #a5a5a5;

    margin-bottom: 22px;
}



.contact_info_item:last-child {

    margin-bottom: 0px;

}



.contact_info_icon {

    display: inline-block;

    width: 24px;

    height: 24px;

    vertical-align: middle;

    margin-right: 10px;

}



.contact_info_icon img {

    width: 100%;

}



/*********************************

11. Google Map

*********************************/



#google_map {

    width: 100%;

    height: 532px;

    margin-top: 117px;

}



.map_container {

    width: 100%;

    height: 100%;

    overflow: hidden;

}



#map {

    width: 100%;

    height: calc(100% + 30px);

}







/*********************************

15.2 Footer Content

*********************************/



.footer_content {

    padding-top: 80px;

    padding-bottom: 83px;

    border-bottom: solid 2px #4d4e4e;

}



.footer_content .logo_container {
    padding-left: 0px;
}



.footer_content .logo span {

    color: #FFFFFF;

}



.footer_about_text {

    margin-top: 24px;

    margin-bottom: 0px;

    padding-right: 20px;

}



.footer_column_title {

    font-size: 18px;

    font-weight: 500;

    color: #FFFFFF;

    padding-top: 15px;

}



.footer_column_content {

    margin-top: 32px;

}



.footer_list_item {

    margin-bottom: 11px;

}



.footer_list_item a {

    font-size: 14px;

    color: #a5a5a5;

    -webkit-transition: all 200ms ease;

    -moz-transition: all 200ms ease;

    -ms-transition: all 200ms ease;

    -o-transition: all 200ms ease;

    transition: all 200ms ease;

}



.footer_list_item a:hover {

    color: #ffb606;

}



.footer_contact_item {

    font-size: 14px;

    font-weight: 400;

    color: #a5a5a5;

    margin-bottom: 22px;

}



.footer_contact_item:last-child {

    margin-bottom: 0px;

}



.footer_logo {
    display: flex;

}



.footer_logo .one {
    width: 85px;
    display: flex;

}

.footer_logo .one img {
    align-self: center;
    width: 100%;
}



.footer_logo .two {
    display: flex;
    font-size: 20px;

    padding-left: 10px;

}

.footer_logo .two span {
    align-self: center;
}



.footer_contact_icon {

    display: inline-block;

    width: 24px;

    height: 24px;

    vertical-align: middle;

    margin-right: 10px;

    float: left;

}



.footer_contact_icon img {

    width: 100%;

}



/*********************************

15.3 our_notice

*********************************/

.our_notice {

    margin-top: 50px;

}



.our_notice .event_items {

    margin-top: 0px;

    padding-left: 20px;

    padding-right: 20px;

}



.our_notice .event_date {

    width: 131px;

    height: 131px;

    border: solid 2px #ffb606;

}



.our_notice .event_day {

    font-size: 48px;

    font-weight: 700;

    color: #ffb606;

    margin-bottom: 1px;

    line-height: 1;

}



.our_notice .event_month {

    font-size: 16px;

    font-weight: 700;

    color: #ffb606;

}



.our_notice .event_name a {

    font-size: 22px;

    font-weight: 500;

    color: #1a1a1a;

}



.our_notice .event_name a:hover {

    color: #ffb606;

}



.our_notice .event_location {

    font-size: 14px;

    font-weight: 500;

    color: #1a1a1a;

    margin-top: 2px;

}



.our_notice .event_content p {

    font-weight: 500;

    color: #a5a5a5;

    margin: 21px 0 0 0;

}



.our_notice .content {

    padding: 0 60px;

}



.our_notice .content .col-sm-6 .row {

    margin: 25px 0px;

    background: #f4f4f4;

    padding: 10px 0;

}



.our_notice .event_image {}



.our_notice .event_image img {
    width: 100%;
}





.our_notice .student_birth .read_more {

    width: 100%;

    text-align: center;

    margin-top: 20px;

}



.our_notice .student_birth .read_more button {

    height: 48px;

    background: #ffb606;

    color: #FFFFFF;

    font-size: 14px;

    text-transform: uppercase;

    font-weight: 700;

    border: none;

    cursor: pointer;

    padding: 0 20px;

    transition: .20s ease-in-out;

}



.our_notice .student_birth .read_more button:hover {

    border-radius: 20px;

}



/*********************************

15.3 Footer Copyright

*********************************/



.footer_bar {

    padding-top: 19px;

    padding-bottom: 19px;

}



.footer_social .menu_social_item a i {

    color: #FFFFFF;

}



.footer_social .menu_social_item a i:hover {

    color: #ffb606;

}



.footer_social .menu_social_item:last-child {

    margin-right: 0px;

}





/*********************************

14. Events

*********************************/



.event_items {

    margin-top: 0px;

    padding-left: 20px;

    padding-right: 20px;

}



.notice_board {

    padding: 0 15px;

}



.notice_board .notice_container {

    display: flex;

    flex-direction: row;

    justify-content: space-around;

    flex-wrap: wrap;

}



.notice_board .notice_container .notice_content {

    width: 70%;

    padding: 20px;

    margin-top: 25px;

}



.notice_board .notice_container .event_content .event_location {

    padding-bottom: 10px;

}



.notice_board .notice_container .event_date {

    margin: auto;

}



.event_item .col-md-3 {

    margin: auto;

}



.event_item {

    margin-bottom: 56px;

}



.event_item:last-child {

    margin-bottom: 0px;

}



.event_date {

    width: 140px;

    height: 140px;

    border: solid 2px #ffb606;

}



.event_day {

    font-size: 48px;

    font-weight: 700;

    color: #ffb606;

    margin-bottom: 1px;

    line-height: 1;

}



.event_month {

    font-size: 16px;

    font-weight: 700;

    color: #ffb606;

}



.event_name a {

    font-size: 22px;

    font-weight: 500;

    color: #1a1a1a;

}



.event_name a:hover {

    color: #ffb606;

}



.event_location {

    font-size: 14px;

    font-weight: 500;

    color: #1a1a1a;

    margin-top: 2px;

}



.event_content p {

    font-weight: 500;

    color: #a5a5a5;

    margin-top: 21px;

    margin-bottom: 13px;

}



.student_birth .event_item {
    background-color: #fbfbfb;
    padding: 10px;
}

.student_birth .event_image img {
    width: 120px;
}



.event_image img {

    width: 100%;

}



#con-noticeBoard-modal .modal-header,
#con-birthday-modal .modal-header {
    background-color: #FFD266;
}

#con-noticeBoard-modal .modal-footer,
#con-birthday-modal .modal-footer {
    background-color: #FFD266;
}

#con-noticeBoard-modal .container-mk,
#con-birthday-modal .container-mk {
    display: flex;
    flex-direction: column;
}

#con-noticeBoard-modal .container-mk .mk-common,
#con-birthday-modal .container-mk .mk-common {}

#con-noticeBoard-modal .container-mk .mk-flex,
#con-birthday-modal .container-mk .mk-flex {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

#con-noticeBoard-modal .container-mk .mk-padding-border,
#con-birthday-modal .container-mk .mk-padding-border {
    padding-bottom: 10px;
    border-bottom: 1.5px solid #ddb102;
    margin-bottom: 10px;
}

#con-noticeBoard-modal .container-mk .mk-image,
#con-birthday-modal .container-mk .mk-image {
    height: 150px;
}

#con-noticeBoard-modal .container-mk .mk-heading,
#con-birthday-modal .container-mk .mk-heading {
    font-size: 23px;
    color: black;
    font-weight: bold;
}

#con-noticeBoard-modal .container-mk .mk-number,
#con-birthday-modal .container-mk .mk-number {
    font-size: 11px;
    color: black;
}

#con-noticeBoard-modal .container-mk .mk-date,
#con-birthday-modal .container-mk .mk-date {
    font-size: 11px;
}



/*---- ( Our Teacher ) ----*/
#con-outTeacher-modal .modal-header {
    background-color: #FFD266;
}

#con-outTeacher-modal .modal-footer {
    background-color: #FFD266;
}

#con-outTeacher-modal .container-mk {
    display: flex;
    flex-direction: column;
}

#con-outTeacher-modal .container-mk .mk-common {}

#con-outTeacher-modal .container-mk .mk-common label {
    font-weight: bold;
    color: black;
}

#con-outTeacher-modal .container-mk .mk-flex {
    display: flex;
    flex-direction: row;
    justify-content: space-around;
}

#con-outTeacher-modal .container-mk .mk-flex-column {
    display: flex;
    flex-direction: column;
    justify-content: space-around;
}

#con-outTeacher-modal .container-mk .mk-padding-border {
    padding-bottom: 10px;
    border-bottom: 1.5px solid #ddb102;
    margin-bottom: 10px;
}

#con-outTeacher-modal .container-mk .mk-image {
    height: 150px;
}

#con-outTeacher-modal .container-mk .mk-heading {
    font-size: 23px;
    color: black;
    font-weight: bold;
}

#con-outTeacher-modal .container-mk .mk-number {
    font-size: 11px;
    color: black;
}

#con-outTeacher-modal .container-mk .mk-date {
    font-size: 11px;
}



/*---- ( Prev Headmistress ) ----*/
#con-prevHeadmistress-modal .modal-header {
    background-color: #FFD266;
}

#con-prevHeadmistress-modal .modal-footer {
    background-color: #FFD266;
}

#con-prevHeadmistress-modal .container-mk {
    display: flex;
    flex-direction: column;
}

#con-prevHeadmistress-modal .container-mk .mk-common {}

#con-prevHeadmistress-modal .container-mk .mk-common label {
    font-weight: bold;
    color: black;
}

#con-prevHeadmistress-modal .container-mk .mk-flex {
    display: flex;
    flex-direction: row;
    justify-content: space-around;
}

#con-prevHeadmistress-modal .container-mk .mk-flex-column {
    display: flex;
    flex-direction: column;
    justify-content: space-around;
}

#con-prevHeadmistress-modal .container-mk .mk-padding-border {
    padding-bottom: 10px;
    border-bottom: 1.5px solid #ddb102;
    margin-bottom: 10px;
}

#con-prevHeadmistress-modal .container-mk .mk-image {
    height: 150px;
}

#con-prevHeadmistress-modal .container-mk .mk-heading {
    font-size: 23px;
    color: black;
    font-weight: bold;
}

#con-prevHeadmistress-modal .container-mk .mk-number {
    font-size: 11px;
    color: black;
}

#con-prevHeadmistress-modal .container-mk .mk-date {
    font-size: 11px;
}



/*---- ( Our Staffs ) ----*/
#con-outStaff-modal .modal-header {
    background-color: #FFD266;
}

#con-outStaff-modal .modal-footer {
    background-color: #FFD266;
}

#con-outStaff-modal .container-mk {
    display: flex;
    flex-direction: column;
}

#con-outStaff-modal .container-mk .mk-common {}

#con-outStaff-modal .container-mk .mk-common label {
    font-weight: bold;
    color: black;
}

#con-outStaff-modal .container-mk .mk-flex {
    display: flex;
    flex-direction: row;
    justify-content: space-around;
}

#con-outStaff-modal .container-mk .mk-flex-column {
    display: flex;
    flex-direction: column;
    justify-content: space-around;
}

#con-outStaff-modal .container-mk .mk-padding-border {
    padding-bottom: 10px;
    border-bottom: 1.5px solid #ddb102;
    margin-bottom: 10px;
}

#con-outStaff-modal .container-mk .mk-image {
    height: 150px;
}

#con-outStaff-modal .container-mk .mk-heading {
    font-size: 23px;
    color: black;
    font-weight: bold;
}

#con-outStaff-modal .container-mk .mk-number {
    font-size: 11px;
    color: black;
}

#con-outStaff-modal .container-mk .mk-date {
    font-size: 11px;
}



/*---- ( Administration ) ----*/
#con-administration-modal .modal-header {
    background-color: #FFD266;
}

#con-administration-modal .modal-footer {
    background-color: #FFD266;
}

#con-administration-modal .container-mk {
    display: flex;
    flex-direction: column;
}

#con-administration-modal .container-mk .mk-common {}

#con-administration-modal .container-mk .mk-common label {
    font-weight: bold;
    color: black;
}

#con-administration-modal .container-mk .mk-flex {
    display: flex;
    flex-direction: row;
    justify-content: space-around;
}

#con-administration-modal .container-mk .mk-flex-column {
    display: flex;
    flex-direction: column;
    justify-content: space-around;
}

#con-administration-modal .container-mk .mk-padding-border {
    padding-bottom: 10px;
    border-bottom: 1.5px solid #ddb102;
    margin-bottom: 10px;
}

#con-administration-modal .container-mk .mk-image {
    height: 150px;
}

#con-administration-modal .container-mk .mk-heading {
    font-size: 23px;
    color: black;
    font-weight: bold;
}

#con-administration-modal .container-mk .mk-number {
    font-size: 11px;
    color: black;
}

#con-administration-modal .container-mk .mk-date {
    font-size: 11px;
}


#contact_send_form .form_common {
    position: relative;
}

#contact_send_form .form_common span {
    color: red;
    font-size: 12px;
    position: absolute;
    width: 100%;
    left: 16px;
    bottom: 7px;
    text-align: left;
}


/*---- ( Admission ) ----*/
#con-admission-modal .modal-header {
    background-color: #FFD266;
}

#con-admission-modal .modal-footer {
    background-color: #FFD266;
}

#con-admission-modal .container-mk {
    display: flex;
    flex-direction: column;
}

#con-admission-modal .container-mk .mk-common {}

#con-admission-modal .container-mk .mk-common label {
    font-weight: bold;
    color: black;
}

#con-admission-modal .container-mk .mk-flex {
    display: flex;
    flex-direction: row;
    justify-content: space-around;
}

#con-admission-modal .container-mk .mk-flex-column {
    display: flex;
    flex-direction: column;
    justify-content: space-around;
}

#con-admission-modal .container-mk .mk-padding-border {
    padding-bottom: 10px;
    border-bottom: 1.5px solid #ddb102;
    margin-bottom: 10px;
}

#con-admission-modal .container-mk .mk-image {
    width: 100%;
}

#con-admission-modal .container-mk .mk-heading {
    font-size: 23px;
    color: black;
    font-weight: bold;
}

#con-admission-modal .container-mk .mk-number {
    font-size: 11px;
    color: black;
}

#con-admission-modal .container-mk .mk-date {
    font-size: 11px;
}


#contact_send_form .form_common {
    position: relative;
}

#contact_send_form .form_common span {
    color: red;
    font-size: 12px;
    position: absolute;
    width: 100%;
    left: 16px;
    bottom: 7px;
    text-align: left;
}




/*---- ( Admission ) ----*/
#con-gallery-modal .modal-header {
    background-color: #FFD266;
}

#con-gallery-modal .modal-footer {
    background-color: #FFD266;
}

#con-gallery-modal .container-mk {
    display: flex;
    flex-direction: column;
}

#con-gallery-modal .container-mk .mk-common {}

#con-gallery-modal .container-mk .mk-common label {
    font-weight: bold;
    color: black;
}

#con-gallery-modal .container-mk .mk-flex {
    display: flex;
    flex-direction: row;
    justify-content: space-around;
}

#con-gallery-modal .container-mk .mk-flex-column {
    display: flex;
    flex-direction: column;
    justify-content: space-around;
}

#con-gallery-modal .container-mk .mk-padding-border {
    padding-bottom: 10px;
    border-bottom: 1.5px solid #ddb102;
    margin-bottom: 10px;
}

#con-gallery-modal .container-mk .mk-image {
    width: 100%;
}

#con-gallery-modal .container-mk .mk-heading {
    font-size: 23px;
    color: black;
    font-weight: bold;
}

#con-gallery-modal .container-mk .mk-number {
    font-size: 11px;
    color: black;
}

#con-gallery-modal .container-mk .mk-date {
    font-size: 11px;
}


#progressReportForm .form_common,
#contact_send_form .form_common {
    position: relative;
}

#progressReportForm .form_common span,
#contact_send_form .form_common span {
    color: red;
    font-size: 12px;
    position: absolute;
    width: 100%;
    left: 16px;
    bottom: 7px;
    text-align: left;
}

#progressReportForm .form_common span {
    bottom: -20px !important;
}









.progressReportMain {
    width: 95%;
    margin: auto;
}

.progressReportMain .prOne .isPassFail {
    position: absolute;
    top: -25px;
    left: 50%;
    z-index: 1;
    font-weight: bold;
    text-transform: uppercase;
    text-align: center;
    width: 100px;
    height: 25px;
    background-color: green;
    line-height: 25px;
    font-size: 16px;
    color: white;
    transform: translate(-50%, -0%);
    clip-path: polygon(15px 0, 85% 0%, 100% 100%, 0% 100%);
}

.progressReportMain .prOne .backgroundFail {
    background-color: red;
}

.progressReportMain .prOne .backgroundPass {
    background-color: green;
}

.progressReportMain .borderPass {
    border: 3px solid green;
}

.progressReportMain .borderFail {
    border: 3px solid red;
}

.progressReportMain .prOne {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    box-shadow: 0 2px 4px gray;
    transition: 0.30s ease-in-out;
    margin-top: 40px;
    border-radius: 10px;
}

.progressReportMain .prOne:hover {
    box-shadow: 0 4px 10px gray;
}

.progressReportMain .prOne .prStdName {
    padding: 10px;
    background-color: #ffe6aa;
    border-top-left-radius: 7px;
    border-top-right-radius: 7px;
}

.progressReportMain .prOne .prDownload {
    position: absolute;
    top: 12px;
    right: 12px;
    z-index: 1;
}

.progressReportMain .prOne .prDownload button {
    cursor: pointer;
}

.progressReportMain .prOne .prStdName span {
    color: black;
    font-size: 24px;
    font-weight: bold;
    text-transform: uppercase;
}

.progressReportMain .prOne .prStdClass {
    padding: 10px;
    flex-direction: row;
    justify-content: space-between;
    display: flex;
    flex-wrap: wrap;
    background-color: #fdd575;
    color: black;
}

.progressReportMain .prOne .prStdClass .prStdOne,
.progressReportMain .prOne .prStdClass .prStdTwo,
.progressReportMain .prOne .prStdClass .prStdThree,
.progressReportMain .prOne .prStdClass .prStdFour {}

.progressReportMain .prOne .prStdClass .prStdOne span,
.progressReportMain .prOne .prStdClass .prStdTwo span,
.progressReportMain .prOne .prStdClass .prStdThree span,
.progressReportMain .prOne .prStdClass .prStdFour span {}

.progressReportMain .prOne .prStdClass .prStdOne span:first-child,
.progressReportMain .prOne .prStdClass .prStdTwo span:first-child,
.progressReportMain .prOne .prStdClass .prStdThree span:first-child,
.progressReportMain .prOne .prStdClass .prStdFour span:first-child {
    font-weight: bold;
}

.progressReportMain .prOne .prStdClass .prStdOne span:last-child,
.progressReportMain .prOne .prStdClass .prStdTwo span:last-child,
.progressReportMain .prOne .prStdClass .prStdThree span:last-child,
.progressReportMain .prOne .prStdClass .prStdFour span:last-child {}

.progressReportMain .prOne .prStdMarks {
    padding: 10px;
    flex-direction: row;
    justify-content: space-between;
    display: flex;
    flex-wrap: wrap;
    background-color: #ffcb4e;
    color: black;
    border-bottom-left-radius: 7px;
    border-bottom-right-radius: 7px;
}

.progressReportMain .prOne .prStdMarks .prStdOne,
.progressReportMain .prOne .prStdMarks .prStdTwo,
.progressReportMain .prOne .prStdMarks .prStdThree {}

.progressReportMain .prOne .prStdMarks .prStdOne span,
.progressReportMain .prOne .prStdMarks .prStdTwo span,
.progressReportMain .prOne .prStdMarks .prStdThree span {}

.progressReportMain .prOne .prStdMarks .prStdOne span:first-child,
.progressReportMain .prOne .prStdMarks .prStdTwo span:first-child,
.progressReportMain .prOne .prStdMarks .prStdThree span:first-child {
    font-weight: bold;
}

.progressReportMain .prOne .prStdMarks .prStdOne span:last-child,
.progressReportMain .prOne .prStdMarks .prStdTwo span:last-child,
.progressReportMain .prOne .prStdMarks .prStdThree span:last-child {}

.progressReportMain .prTwo {
    text-align: center;
    margin-top: 40px;
}

.progressReportMain .prTwo span {
    font-size: 20px;
    font-weight: bold;
    color: #979797;
}