/*

* This file contains the styling for the actual template, this
is the file you need to edit to change the look of the
template.

This files table contents are outlined below >>>>>

<<<<<< Website All Pages List >>>>>>

1. Home Page (index)
2. About Us Page 
3. Courses Page 
4. Contact Us Page      
5. Certificate Page     
6. Login Page
7. onlineadmission Page
8. terms&conditions Page   
9. placement Page
10. sign up page

<<<  Courses pages  >>>

11. Diploma In Air Hostess
12. Diploma In Airport Management 
13. Diploma In Aviation
14. Diploma In Banking & Finance 
15. Diploma In Cabin Crew 
16. Diploma In Crusie Ship
17. Diploma In Fire & Safety
18. Diploma In Hotel Management 
19. Diploma In IT 
20. Diploma In Merchant Navy 
21. Diploma In Tourism Management
22. Diploms In Tourism Studies

*/


/* <<<<<<  All Font Family Links  >>>>>> */

/* font-family: "Poppins", serif;  */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap');

/* font-family: "Roboto", sans-serif;  */
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap');

/* font-family: "Lato", sans-serif;  */
@import url('https://fonts.googleapis.com/css2?family=Lato:wght@400;700&display=swap');

/* font-family: "Open Sans", sans-serif;  */
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wdth,wght@75..100,300..800&display=swap');


/*================================================
Default And Custom CSS
=================================================*/

* {
    padding: 0;
    margin: 0;
    text-decoration: none;
    list-style: none;
    box-sizing: border-box;
    outline: none;
    vertical-align: top;
}

body {
    padding: 0;
    margin: 0;
    background-color: #fff;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    color: #000;
    font-family: 'poppins', sans-serif;
}

a, button {
    cursor: pointer;
    background: transparent;
    border: none;
    outline: none;
    list-style: none;
    box-shadow: none;
    text-decoration: none;
    display: inline-block;
    transition: all ease 0.5s;
    font-size: 18px;
    font-weight: 400;
    line-height: 24px;
    color: #000;
    font-family: 'Roboto', sans-serif;
}

ol, ul, li {
    list-style: none;
}

ul {
    padding-left: 0px;
    margin-bottom: 0px;
}

span {
    display: inline-block;
}

image, iframe, video {
    display: block;
}

.list-item {
    margin: 0;
}

:root {
    --first-color: #00b4d8;
    --secound-color: #fc4624;
    --third-color: #caf0f8;
    --forth-color: #0077bb;
    --fifth-color: #e5e5e570;
    --sixth-color: #90e0ef;

    --btn-color: #03045e;

    --white-color: #ffffff;
    --black-color: #000000;

    --primary-font: "poppins", sans-serif;
    --sub-primary-font: "Roboto", sans-serif;
    --secoundry-font: "Open Sans", sans-serif;
    --sub-secoundry-font: "Lato", sans-serif;
}

.c-white {
    color: #fff;
}

.c-black {
    color: #000;
}

.c-first {
    color: #00b4d8;
}

.c-secound {
    color: #fc4624;
}

.c-third {
    color: #caf0f8;
}

.c-forth {
    color: #0077bb;
}

.c-fifth {
    color: #e5e5e570;
}

.c-sixth {
    color: #90e0ef;
}

.c-bg-first {
    background-color: #00b4d8;
}

.c-bg-secound {
    background-color: #fc4624;
}

.c-bg-third {
    background-color: #caf0f8;
}

.c-bg-forth {
    background-color: #0077bb;
}

.c-bg-fifth {
    background-color: #e5e5e570;
}

.c-bg-sixth {
    background-color: #90e0ef;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'poppins', sans-serif;
    color: #000;
}

h1 {
    font-size: 42px;
    line-height: 54px;
    font-weight: 700;
}

h2 {
    font-size: 36px;
    line-height: 48px;
    font-weight: 700;
}

h3 {
    font-size: 30px;
    line-height: 42px;
    font-weight: 600;
}

h4 {
    font-size: 24px;
    line-height: 36px;
    font-weight: 600;
}

h5 {
    font-size: 20px;
    line-height: 28px;
    font-weight: 500;
}

h6 {
    font-size: 18px;
    line-height: 24px;
    font-weight: 500;
}

p {
    font-size: 18px;
    line-height: 28px;
    font-weight: 400;
    color: var(--black-color);
    font-family: var(--sub-primary-font);
}

.gap-10 {
    gap: 10px;
}

.img-box {
    overflow: hidden;
}

.img-box img {
            width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    /*border-radius: 40px;*/
}

.pd-lr-10 {
    padding-left: 10px;
    padding-right: 10px;
}

.pd-l-10 {
    padding-left: 10px;
}

.pd-r-10 {
    padding-right: 10px;
}

.pd-tb-10 {
    padding-top: 10px;
    padding-bottom: 10px;
}

.pd-t-10 {
    padding-top: 10px;
}

.pd-b-10 {
    padding-bottom: 10px;
}

.border-rad-2 {
    border-radius: 2px;
}

.border-rad-4 {
    border-radius: 4px;
}

.border-rad-6 {
    border-radius: 6px;
}

.border-rad-8 {
    border-radius: 8px;
}

.border-rad-10 {
    border-radius: 10px;
}

.border-rad-12 {
    border-radius: 12px;
}

.border-rad-14 {
    border-radius: 14px;
}

.border-rad-16 {
    border-radius: 16px;
}

.border-rad-18 {
    border-radius: 18px;
}

.border-rad-20 {
    border-radius: 20px;
}

.f-weight-4 {
    font-weight: 400;
}

.f-weight-5 {
    font-weight: 500;
}

.f-weight-6 {
    font-weight: 600;
}

.f-weight-7 {
    font-weight: 700;
}

.b-shadow-1 {
    box-shadow: rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px;
}

.b-shadow-2 {
    box-shadow: rgba(17, 17, 26, 0.1) 0px 0px 16px;
}

.b-shadow-3 {
    box-shadow: rgba(17, 17, 26, 0.1) 0px 4px 16px, rgba(17, 17, 26, 0.05) 0px 8px 32px;
}

.b-shadow-4 {
    box-shadow: rgba(9, 30, 66, 0.25) 0px 4px 8px -2px, rgba(9, 30, 66, 0.08) 0px 0px 0px 1px;
}

.b-shadow-5 {
    box-shadow: rgba(14, 63, 126, 0.06) 0px 0px 0px 1px, rgba(42, 51, 70, 0.03) 0px 1px 1px -0.5px, rgba(42, 51, 70, 0.04) 0px 2px 2px -1px, rgba(42, 51, 70, 0.04) 0px 3px 3px -1.5px, rgba(42, 51, 70, 0.03) 0px 5px 5px -2.5px, rgba(42, 51, 70, 0.03) 0px 10px 10px -5px, rgba(42, 51, 70, 0.03) 0px 24px 24px -8px;
}

.b-shadow-6 {
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
}

.b-shadow-7 {
    box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;
}

.b-shadow-8 {
    box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px;
}

.b-shadow-9 {
    box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;
}

.b-shadow-10 {
    box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 5px 0px, rgba(0, 0, 0, 0.1) 0px 0px 1px 0px;
}

.b-radius-1 {
    border-radius: 1%;
}

.b-radius-2 {
    border-radius: 2%;
}

.b-radius-3 {
    border-radius: 3%;
}

.b-radius-4 {
    border-radius: 4%;
}

.b-radius-5 {
    border-radius: 5%;
}

.b-radius-10 {
    border-radius: 10%;
}

.b-radius-15 {
    border-radius: 15%;
}

.b-radius-20 {
    border-radius: 20%;
}

.b-radius-25 {
    border-radius: 25%;
}

.b-radius-30 {
    border-radius: 30%;
}

.b-radius-35 {
    border-radius: 35%;
}

.b-radius-40 {
    border-radius: 40%;
}

.b-radius-45 {
    border-radius: 45%;
}

.b-radius-50 {
    border-radius: 50%;
}

.b-radius-55 {
    border-radius: 55%;
}

.b-radius-60 {
    border-radius: 60%;
}

.b-radius-65 {
    border-radius: 65%;
}

.b-radius-70 {
    border-radius: 70%;
}

.b-radius-75 {
    border-radius: 75%;
}

.b-radius-80 {
    border-radius: 80%;
}

.b-radius-85 {
    border-radius: 85%;
}

.b-radius-90 {
    border-radius: 90%;
}

.b-radius-95 {
    border-radius: 95%;
}

.b-radius-100 {
    border-radius: 100%;
}

.b-bottom-1 {
    border-bottom: 1px solid var(--forth-color);
}

.b-top-1 {
    border-top: 1px solid var(--forth-color);
}

.b-left-1 {
    border-left: 1px solid var(--forth-color);
}

.b-right-1 {
    border-right: 1px solid var(--forth-color);
}

.border-1 {
    border: 1px solid #ddd;
}

.border-2 {
    border: 2px solid #ddd;
}

/* button Css and hover */

.l-btn a {
    color: var(--white-color);
    letter-spacing: 0.5px;
    padding: 12px 35px;
    position: relative;
}
.l-btn a span {
    mix-blend-mode: difference;
    transition: transform 0.4s cubic-bezier(0.2, 1, 0.8, 1);
}
.l-btn a::before {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.l-btn a::before {
    content: '';
    -webkit-clip-path: polygon(0% 0%, 100% 0, 100% 50%, 100% 100%, 0% 100%);
    clip-path: polygon(0% 0%, 100% 0, 100% 50%, 100% 100%, 0% 100%);
    transition: clip-path 0.4s cubic-bezier(0.2, 1, 0.8, 1), -webkit-clip-path 0.4s cubic-bezier(0.2, 1, 0.8, 1);
}
.l-btn a::before {
    content: '';
    background: var(--black-color);
    -webkit-clip-path: polygon(0% 0%, 100% 0, 100% 50%, 100% 100%, 0% 100%);
    clip-path: polygon(0% 0%, 100% 0, 100% 50%, 100% 100%, 0% 100%);
    transition: clip-path 0.4s cubic-bezier(0.2, 1, 0.8, 1), -webkit-clip-path 0.4s cubic-bezier(0.2, 1, 0.8, 1);
}
.l-btn a:hover::before {
    background: var(--black-color);
    -webkit-clip-path: polygon(0% 0%, 75% 0%, 100% 50%, 75% 100%, 0% 100%);
    clip-path: polygon(0% 0%, 75% 0%, 100% 50%, 75% 100%, 0% 100%);
}