.font-nexa {
    font-family: nexa !important;
}
.nav-container {
    padding-left: 40px;
    padding-right: 40px;
    z-index: 100;
}
/* Checkout Start */

button.btn.btn-primary.checkout-btn {
    background: #0083ff !important;

    border-color: #0083ff !important;

    padding: 15px;

    width: 100%;
}

.checkout {
    min-height: 100vh;

    display: flex;

    align-items: center;
}

.checkout:before {
    content: "";

    position: absolute;

    left: 0;

    top: 0;

    width: 50%;

    height: 100%;

    background: url(../images/checkout-bg_02.png) no-repeat;

    background-size: 100% 100%;

    background-position: top;
}

.center {
    width: 100%;

    min-height: 80vh;

    /* max-height: 80vh; */

    background: #fff;

    position: relative;

    border-radius: 10px 0 0 10px;
}

.center:before {
    content: "";

    position: absolute;

    width: 50%;

    left: 0;

    height: 100%;

    box-shadow: -35px 0 25px 0 rgb(0 0 0 / 19%);

    border-radius: 10px 0 0 10px;

    background: #83cfef;
}

.checkout-left {
    padding: 15px 15px 15px 130px;
}

.top h4 {
    font-weight: 700;

    line-height: 1.2;
}

.top h4 span {
    font-weight: 300;

    font-size: 70%;
}

.checkout-logo {
    top: 15px;

    position: absolute;

    left: 15px;
}

.checkout-price span {
    font-size: 50%;

    letter-spacing: 2px;
}

.checkout-price {
    font-size: 27px;

    font-weight: 300;
}

.checkout-left hr {
    border-color: #fff;

    border-width: 2px;
}

.lable-invoice {
    font-size: 15px;

    line-height: 1;

    margin-bottom: 2px;
}

.support {
    width: 30%;

    position: absolute;

    bottom: 20px;

    left: 11.5%;
}

.chat-icon {
    width: 45px;

    height: 45px;

    border-radius: 50%;

    background: #0083ff;
}

.support p span {
    font-size: 90%;

    opacity: 0.8;
}

.support p {
    line-height: 1.5;

    font-size: 14px;

    margin: 0;
}

.checkout-right h4 i {
    text-align: right;

    float: right;

    font-size: 11px;

    width: 25px;

    height: 25px;

    border: 1px solid #83cfef;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 50%;

    color: #83cfef;
}

.tabs {
    border-bottom: 1px solid #e6ebed;
}

.payment-tabs {
    border: 0;
}

.payment-tabs .nav-link {
    color: #525453;

    font-size: 14px;

    font-weight: 300;
}

.payment-tabs .nav-link.active {
    color: #83cfef;
}

.payment-tabs .nav-link.active::after {
    background: #83cfef !important;
}

.more {
    color: #525453;

    font-size: 14px;

    display: block;

    padding: 9px;
}

.add-card {
    width: 55px;

    height: 55px;

    display: flex;

    align-items: center;

    justify-content: center;

    padding: 0;

    border-radius: 50%;

    font-size: 30px;

    color: #83cfef;

    box-shadow: none;

    margin-right: 10px;

    background: #f6f8f9;

    cursor: pointer;
}

.card-number {
    padding: 15px 25px;

    margin-right: 10px;

    background: #f6f8f9;

    border-radius: 30vh;

    font-weight: 500;

    box-shadow: inset -8px 0px 2px 3px #ebeced;

    cursor: pointer;
}

.payment-form.form-section input.form-control {
    color: #424242 !important;
}

.card-number.active {
    box-shadow: none;

    background: #0083ff;

    color: #fff;
}

.form-section .form-group.card-input i {
    position: absolute;

    top: 10%;

    right: 10px;

    color: #0083ff;
}

/* Checkout End */

/* Booking Start */

.bookings table .name {
    font-size: 14px;

    line-height: 1.2;
}

.bookings table thead th {
    color: #bbbec8;

    font-size: 14px;

    background: transparent !important;

    text-transform: capitalize;
}

.bookings table td.sn {
    color: #bbbec8;
}

.bookings table td.sn button {
    color: #bbbec8;
}

.hide-arrow:after {
    content: initial;
}

.sn .dropdown .dropdown-item {
    font-size: 13px;

    color: #adafb5;
}

.bookings table tbody tr:hover {
    box-shadow: 0 0px 10px 0 rgb(0 0 0 / 15%);

    border-radius: 5px;
}

.bookings table td,
.bookings table th {
    vertical-align: middle;

    white-space: nowrap;
}

.bookings table tr {
    font-size: 13px;

    font-weight: bold;

    transition: ease all 0.3s;
}

.bookings table .name span {
    font-weight: 400 !important;

    font-size: 12px;
}

.nav-tabs.assigned-tabs.booking-tabs .nav-link {
    color: #bbbec8 !important;

    font-size: 14px;

    text-transform: capitalize;

    padding: 10px;

    margin-right: 10px;
}

.bg-theme-dark {
    background: #146299 !important;
}

.btn-primary.bg-theme-dark {
    border-color: #146299;
}

.nav-tabs.assigned-tabs.booking-tabs .nav-link.active {
    color: #146299 !important;
}

.nav-tabs.assigned-tabs.booking-tabs .nav-link.active:after {
    background: #146299 !important;
}

/* Booking End */

/* Assigned School Start */

.assign-list li span {
    color: #d27a25;
}

.profile-inner-content hr {
    border-color: #ffffff7d;

    width: 75%;

    margin: 1.5rem 0 1.5rem 0;
}

.grade {
    color: #000;
}

.nav-tabs.assigned-tabs {
    border: 0;
}

.nav-tabs.assigned-tabs .nav-link {
    color: #000 !important;

    font-size: 30px;

    text-transform: uppercase;
}

.nav-tabs.assigned-tabs .nav-link.active:after {
    background: #000 !important;
}

.locations {
    color: #d27a25;
}

/* Assigned School End */

/* Calander Starts */

.fc-toolbar-title {
    color: #146299;

    font-size: 17px !important;
}

.sidebar-lg .btn-close {
    background: transparent;

    box-shadow: none;

    border: none;

    color: #000;

    font-size: 26px;

    line-height: 1 !important;

    top: 2rem !important;
}

.page-heading {
    font-weight: 600;

    color: #146299;
}

/* Calander End */

/* Student Welcome Start */

.student-welcome-search .form-control {
    border: none;

    border-radius: 0;

    color: #22b5d1;

    font-weight: 300;

    height: 50px;
}

.student-welcome-search .form-control::placeholder {
    color: #22b5d1;
}

.student-welcome-search .form-control[type="text"] {
    border-right: 1px solid #d7d7d7 !important;

    border-radius: 5px 0 0 5px;

    padding-left: 35px;
}

.student-welcome-search select.form-control {
    border-radius: 0 5px 5px 0;

    padding-left: 35px;
}

.student-welcome-search .form-group i {
    position: absolute;

    left: 10px;

    top: 50%;

    transform: translateY(-50%);

    color: #22b5d1;
}

.student-welcome-search button.btn {
    font-weight: 300;

    letter-spacing: 1px;

    height: 50px;
}

.student-welcome-search h1 {
    font-size: 90px;

    text-align: center;

    font-weight: 700;

    text-transform: uppercase;

    color: #fff;

    line-height: 1;
}

.student-welcome-search h1 span {
    font-size: 61%;

    display: block;

    font-weight: 300;
}

.inline-dropdown {
    width: 75%;

    font-weight: 300;

    font-size: 14px;
}

.inline-dropdown button {
    background: transparent;

    box-shadow: none !important;

    border: none;

    color: #fff;

    font-weight: 600;

    display: flex;

    align-items: center;
}

.inline-dropdown .dropdown-toggle::after {
    content: "\f078" !important;

    border: 0;

    font-family: "Font Awesome 5 Free";

    margin-left: 8px;

    font-size: 13px;
}

.feature-heading {
    text-transform: uppercase;

    font-weight: 400;

    font-family: "Myriad Pro Regular", sans-serif;

    font-size: 30px;
}

.inline-dropdown.dark-dropdown {
    color: #000;

    font-weight: 500;

    font-family: "Myriad Pro Regular", sans-serif;

    font-size: 12px;
}

.inline-dropdown.dark-dropdown button {
    color: #000;

    font-weight: 800;

    font-size: 12px;
}

.inline-dropdown .dropdown-item {
    font-size: 13px;

    padding: 5px;
}

.view-link {
    font-size: 13px;

    color: #000;

    font-weight: 500;
}

.view-link:hover {
    color: #000;
}

.bottom {
    position: absolute;

    bottom: 14px;

    width: 100%;

    left: 0;

    padding-left: 15px;

    font-weight: 400;

    font-size: 15px;
}

.select2-container {
    width: 100% !important;

    margin: 0;

    display: inline-block;

    position: relative;

    vertical-align: middle;

    box-sizing: border-box;
}

.select2-container--classic .select2-selection--single,
.select2-container--default .select2-selection--single {
    min-height: 2.5rem;

    padding: 5px;

    border: 1px solid #d8d6de;
}

.select2-container .select2-selection--single {
    box-sizing: border-box;

    cursor: pointer;

    display: block;

    height: 28px;

    user-select: none;

    -webkit-user-select: none;
}

.select2-container--default
    .select2-selection--single
    .select2-selection__arrow {
    height: 38px;
}

/* Student Welcome End */

/* Dashboard Start */

header.main-header.dashboard a {
    font-size: 13px !important;
}

.user span {
    font-size: 14px;

    font-family: "nexa";

    font-weight: 300;

    color: #a5a5ac;
}

.user {
    position: absolute;

    right: -105px;

    max-width: 140px;

    display: flex;

    overflow: hidden;

    top: 50%;

    transform: translateY(-50%);

    align-items: center;
}

.user.mobile {
    position: absolute;

    left: -136px;

    top: 57px;

    flex-direction: row-reverse;
}

.dashboard-card {
    border: 1px solid #e1e0e4;

    padding: 30px 20px;

    display: flex;

    align-items: center;

    justify-content: center;

    position: relative;

    background: #fff;

    flex-direction: column;

    cursor: pointer;
}

.card-shaddow {
    box-shadow: 0 0 14px 0 rgb(0 0 0 / 12%);
}

.dashboard-card .calender-icon {
    position: absolute;

    left: 15px;

    top: 12px;

    color: #939598;

    font-size: 15px;
}

.dashboard-card .topic-icon {
    color: #4875ba;

    background: #ecf3fe;

    width: 30px;

    height: 30px;

    display: flex !important;

    align-items: center;

    justify-content: center;

    border-radius: 50%;

    margin-bottom: 12px;
}

.dashboard-card h4 {
    font-weight: 600;

    font-size: 26px;
}

.dashboard-card p {
    color: #c3c2c7;

    font-size: 15px;
}

.col-lg-18 {
    width: 20%;

    max-width: 20%;
}

.tab-link {
    font-size: 14px;

    font-weight: 600;

    color: #bbbec8;
}

.tab-link.active {
    color: #0db1ef;

    text-decoration: underline;
}

.card-heading {
    color: #146299;

    font-weight: 600;

    text-transform: uppercase;

    margin-left: 10px;
}

.card-count h4 {
    font-weight: 600;

    font-size: 18px;
}

.card-count p {
    color: #146299;

    font-size: 11px;

    font-weight: 600;

    text-transform: uppercase;
}

#animating-donut {
    max-height: 15.7rem;
}

.chartist-tooltip {
    position: absolute;

    display: inline-block;

    opacity: 0;

    min-width: 0.625rem;

    padding: 2px 0.625rem;

    border-radius: 3px;

    background: #313a46;

    color: #ffffff;

    text-align: center;

    pointer-events: none;

    z-index: 1;

    -webkit-transition: opacity 0.2s linear;

    -moz-transition: opacity 0.2s linear;

    -o-transition: opacity 0.2s linear;

    transition: opacity 0.2s linear;
}

.chartist-tooltip.tooltip-show {
    opacity: 1;
}

.ct-series-a .ct-bar,
.ct-series-a .ct-line,
.ct-series-a .ct-point,
.ct-series-a .ct-slice-donut {
    stroke: #4875ba;
}

.ct-series-a .ct-area,
.ct-series-a .ct-slice-donut-solid,
.ct-series-a .ct-slice-pie {
    fill: #ecf3fe;
}

/* Dashboard End */

.welcome-input .form-control {
    border: none !important;

    font-weight: 300;
}

.welcome-input {
    box-shadow: 0 0 20px 0 #00000047;

    padding: 6px;

    border-radius: 30vh;

    overflow: hidden;
}

.welcome-input button.btn-primary {
    border-radius: 30vh;

    font-weight: 300;
}

.profile-inner {
    position: relative;

    color: #fff;
}

.profile-inner-content {
    position: absolute;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    padding: 15px;
}

.profile-inner-content p {
    font-size: 27px;

    line-height: 1;
}

.profile-inner-content p.expert {
    font-size: 23px;
}

.profile-inner-content p span {
    font-weight: 600;
}

.martial-list li {
    position: relative;

    padding-left: 20px;

    font-size: 22px;

    text-transform: uppercase;

    line-height: 1.3;
}

.martial-list li:before {
    position: absolute;

    content: "-";

    left: 5px;

    top: 50%;

    transform: translateY(-50%);
}

.calender {
    display: flex;

    align-items: center;

    justify-content: center;

    text-align: center;

    height: 100%;

    position: absolute;

    top: 0;

    left: 0;

    width: 100%;
}

.calender span {
    font-size: 24px;

    padding: 7px;

    cursor: pointer;
}

.cal-text.active {
    color: #ca6230;

    font-weight: 400;
}

.student-login {
    background: linear-gradient(180deg, #85d0f3 0%, #005992 100%) !important;
    box-shadow: -1px 1px 18px rgba(0, 0, 0, 0.1);
}
.student-login:hover {
    background: #0ba6da !important;
}

.map iframe {
    width: 100%;
}

@font-face {
    font-family: nexa;

    src: url(../fonts/Nexa-Light.otf);

    font-weight: 300;
}

@font-face {
    font-family: nexa;

    src: url(../fonts/Nexa-Regular.otf);

    font-weight: 400;
}

@font-face {
    font-family: nexa;

    src: url(../fonts/Nexa-Bold.otf);

    font-weight: 600;
}

.lang-web {
    position: absolute;

    right: 28px;

    margin-top: 14px;
}

.mobile-section-header {
    padding: 40px 0;

    background-size: 80% !important;

    background-position: center right !important;
}

.switcher {
    width: fit-content !important;
}

.switcher-user {
    width: fit-content !important;
    font-size: 12px;
    text-align: left;
    cursor: pointer;
    width: 173px;
    line-height: 17px;
    position: absolute !important;
    right: 40px !important;
    top: 52px !important;
}

.inner-container {
    width: 100%;

    padding: 20px 0;

    font-family: nexa !important;

    font-weight: 300 !important;
}

.main-header.login-header {
    position: initial;
}

img.login-logo {
    max-width: 130px;

    margin-top: 10px;
}

.form-heading {
    font-size: 1.8rem;

    text-transform: uppercase;

    font-weight: 400 !important;

    color: #146299;

    line-height: 1;
}

.form-sub-heading {
    font-size: 0.8rem;

    line-height: 1;

    color: #1462a3;

    margin-top: 3px;
}
.form-section select.form-control {
    background: transparent;
}
.form-section input.form-control {
    border: 0;

    border-bottom: 1px solid #e5ebed;

    border-radius: 0;

    color: #000;

    background: transparent;

    font-size: 17px;

    padding-right: 30px;
}

.form-section .form-group {
    position: relative;
}

.form-section .form-group i {
    position: absolute;

    top: 60%;

    right: 10px;

    color: #005992;
}

.form-section .form-check {
    width: fit-content;
}

.styled-checkbox {
    position: absolute;

    opacity: 0;

    z-index: 1;

    width: 100%;

    height: 100%;

    cursor: pointer;
}

.styled-checkbox + label {
    position: relative;

    cursor: pointer;

    padding: 0;
}

.styled-checkbox + label:before {
    content: "";

    margin-right: 10px;

    display: inline-block;

    vertical-align: text-top;

    width: 20px;

    height: 20px;

    background: white;

    box-shadow: 0 0 15px 0px rgb(0 0 0 / 16%);
}

.styled-checkbox:hover + label:before {
    background: #0ba6da;
}

.styled-checkbox:focus + label:before {
    box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.12);
}

.styled-checkbox:checked + label:before {
    background: #0ba6da;
}

.styled-checkbox:disabled + label {
    color: #b8b8b8;

    cursor: auto;
}

.styled-checkbox:disabled + label:before {
    box-shadow: none;

    background: #ddd;
}

.styled-checkbox:checked + label:after {
    content: "";

    position: absolute;

    left: 5px;

    top: 11px;

    background: white;

    width: 2px;

    height: 2px;

    box-shadow: 2px 0 0 white, 4px 0 0 white, 4px -2px 0 white, 4px -4px 0 white,
        4px -6px 0 white, 4px -8px 0 white;

    transform: rotate(45deg);
}

.form-section .form-check label {
    color: #0ba6da;
}

.btn-primary {
    background: #0083ff;

    border-color: #0083ff;

    padding: 8px 30px;
}

.forget {
    margin-left: 10px;

    font-size: 14px;

    text-decoration: underline;
}

.form-section input.form-control:focus {
    outline: none;

    border-color: #0083ff;

    box-shadow: none;
}

.social-button {
    border: 1px solid;

    text-align: center;

    padding: 8px 30px;

    border-radius: 30vh;

    color: #fff;

    font-size: 14px;

    display: inline-block;
}

.social-button.facebook {
    background: #3b5998;
}

.social-button.google {
    background: #f44336;
}

.social-button:hover {
    color: #fff;

    text-decoration: none;
}

.main-header.login-header .navbar .navbar-toggler {
    color: #0083ff;
}

.main-header.login-header .navbar {
    box-shadow: none;
}

span.or {
    color: #b1b1b1;

    font-weight: 400;
}

.btn-language {
    color: #fff;

    display: flex;

    align-items: center;

    justify-content: center;
}

.btn-language:focus {
    outline: none;

    border: none;

    box-shadow: none;
}

.btn-language:hover {
    color: #fff;
}

.toogle-language {
    display: flex;

    align-items: center;

    position: relative;
}

.toogle-language .dropdown {
    position: absolute;

    left: -40px;

    top: 0;
}

.toogle-language .dropdown .dropdown-menu.show {
    padding: 5px 5px;

    width: fit-content !important;

    max-width: initial;

    min-width: 6rem;

    left: 20px;
}

.dropdown .dropdown-menu.show {
    padding: 10px;
}

.lang .dropdown-toggle::after {
    content: initial;
}

body {
    background: #f5f5f5;
}

.logo-white {
    display: block;
}

.logo-dark {
    display: none;
}

.main-header {
    position: absolute;

    top: 0;

    z-index: 50;
}

.main-header .navbar {
    align-items: flex-start;

    background: none;

    padding: 0;
}

.main-header .navbar .navbar-toggler[aria-expanded="false"] i.fas.fa-bars {
    display: block;
}

.main-header .navbar .navbar-toggler[aria-expanded="false"] i.fas.fa-times {
    display: none;
}

.main-header .navbar .navbar-toggler[aria-expanded="true"] i.fas.fa-bars {
    display: none;
}

.main-header .navbar .navbar-toggler[aria-expanded="true"] i.fas.fa-times {
    display: block;
}

.main-header #navigationContent {
    flex-direction: column;

    justify-content: flex-start;

    align-items: flex-end;

    padding-right: 3rem;
}

.main-header .top-bar.bottom-bar {
    display: none;
}

.main-header .top-bar {
    width: 100%;

    display: flex;

    justify-content: flex-end;

    align-items: center;
    margin-right: 41px;
}

.main-header .top-bar .skew-button {
    transform: skewX(25deg);

    background: #85d0f3;

    padding: 10.5px 20px;

    color: #fff;

    text-transform: uppercase;

    font-size: 14px;

    transition: all 150ms ease-in-out;

    text-decoration: none;

    letter-spacing: 1px;
}

.main-header .top-bar .skew-button:last-child {
    margin-right: 0;
}

.main-header .top-bar .skew-button:hover {
    background: #0ba6da;
}

.main-header .top-bar .skew-button span {
    display: block;

    transform: skewX(-25deg);
}

.main-header .nav-bar {
    padding-right: 22px;

    display: flex;

    justify-content: flex-end;

    align-items: center;
    flex-direction: column;
    width: 100%;
    font-family: 'EnnVisions';
}

.main-header .nav-bar .nav-container {
    background: linear-gradient(180deg, #ffffff 0%, #f5f5f5 100%);
    transform: skewX(25deg);
    padding: 0 40px;
    width: 100%;
}

.main-header .nav-bar .nav-container nav {
    transform: skewX(-25deg);
    display: flex;
    justify-content: space-between;
}

.main-header .nav-bar .nav-container nav a {
    display: inline-block;

    padding: 12.5px 0;

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

    text-transform: uppercase;

    min-width: fit-content;

    color: #424242;

    text-transform: uppercase;

    font-size: 15px;

    transition: all 100ms ease-in-out;

    text-decoration: none;
}

.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
    font-weight: 400;
}

.main-header .nav-bar .nav-container nav a:last-child {
    padding-right: 0;
}

.main-header .nav-bar .nav-container nav a:hover {
    color: #005992;
}

.main-header .nav-bar .nav-container nav a.active {
    color: #49c9f5;
}
.nav-layer2 {
    background: #005992;
    box-shadow: -4px 4px 8px rgba(0, 0, 0, 0.1);
    position: relative;
    top: -37px;
    left: -3px;
    width: 100%;
    z-index: -1;
    padding: 21px;
    transform: skew(25deg);
}
.depth {
    color: #fff;

    position: relative;
}

.depth:before,
.depth:after {
    content: attr(title);

    color: rgba(0, 0, 0, 0.1);

    position: absolute;

    min-width: max-content;
}

.depth:before {
    top: 2.5px;
    left: 2.5px;
}

.depth:after {
    top: 3.5px;
    left: 3.5px;
}

.hero-img {
    position: relative;

    z-index: 10;

    min-height: 800px;

    height: 100vh;

    background-size: cover;

    background-position: center;

    background-repeat: no-repeat;
}

.hero-img::before {
    content: "";

    z-index: 10;

    position: absolute;

    left: 0;

    right: 0;

    top: 0;

    bottom: 0;

    background-color: #000000;

    background: url("/website/images/diagonal.png");

    background-size: cover;

    background-position: center;

    background-repeat: no-repeat;
}

.hero-img .hero-content .sub-heading,
.hero-img .hero-content .heading {
    font-family: "Myriad Pro Condensed";

    text-transform: uppercase;

    line-height: 1;

    margin-bottom: 0;

    color: #fff;

    letter-spacing: 0.19em;

    transform: scaleY(0.75);
}

.hero-img .hero-content .sub-heading {
    font-size: 1.9rem;
}

.hero-img .hero-content .heading {
    font-size: 3.75rem;
}

.hero-img .hero-content .skew-button {
    display: inline-block;

    margin: 0.75rem auto 0;

    transform: skewX(-25deg);

    background: linear-gradient(to bottom, #eeeeee, #cdcdcd);

    padding: 0 40px;

    transition: all ease 200ms;
}

.hero-img .hero-content .skew-button:hover {
    background: linear-gradient(to top, #eeeeee, #cdcdcd);
}

.hero-img .hero-content .skew-button span {
    display: inline-block;

    transform: skewX(25deg);

    padding: 12.5px;

    text-transform: uppercase;

    color: #00061c;

    letter-spacing: 0.12em;
}

.hero-img .for-everyone {
    z-index: 20;

    position: absolute;

    top: 30%;

    left: 12.5%;

    color: #fff;
}

.hero-img .for-business {
    z-index: 20;

    position: absolute;

    bottom: 20%;

    right: 12.5%;

    color: #fff;
}

.facts {
    padding: 5rem 0;
    margin-top: 600px;
}

.facts .fact .number {
    font-size: 5.15rem;

    font-family: "Myriad Pro Bold";

    line-height: 1.25;

    background-color: #01314c;

    color: transparent;
}

.facts .fact .title {
    font-family: "Myriad Pro Regular";

    font-size: 0.9rem;

    line-height: 1.1;

    letter-spacing: 0.125em;

    font-weight: normal;

    text-transform: uppercase;
}

.facts .fact.users .number {
    background: url("/website/images/text-clip-left.jpeg") no-repeat center /
        cover;

    background-clip: text;

    -webkit-background-clip: text;
}

.facts .fact.instructors .number {
    background: url("/website/images/text-clip-center.jpeg") no-repeat center /
        cover;

    background-clip: text;

    -webkit-background-clip: text;
}

.facts .fact.academies .number {
    background: url("/website/images/text-clip-right.jpeg") no-repeat center /
        cover;

    background-clip: text;

    -webkit-background-clip: text;
}

.explore-app {
    margin-bottom: 3.5rem;
}

.explore-app .search .title {
    font-size: 2rem;
}

.explore-app .search .sub-para span {
    color: #49c9f5;

    font-size: 0.9rem;
}

.explore-app .devices {
    margin-bottom: 1.5rem;
}

.explore-app .action-btn-container {
    display: flex;

    justify-content: center;

    align-items: center;
}

.explore-app .action-btn-container a.btn.btn-outline-primary {
    color: #49c9f5;

    border-color: #49c9f5;
}

.explore-app .action-btn-container a.btn.btn-outline-primary:hover {
    background-color: #49c9f5;

    color: #fff;
}

.explore-app .action-btn-container a.btn.btn-outline-primary:focus {
    box-shadow: 0 0 0 0.2rem rgba(73, 201, 245, 0.5);
}

.banner-devices {
    margin-bottom: 3.5rem;
}

.newsletter-signup {
    margin-bottom: 3.5rem;
}

.newsletter-signup .card {
    border-color: rgba(175, 175, 175, 0.25);
}

.newsletter-signup .card .card-body {
    padding: 2rem;
}

.newsletter-signup .main-title {
    font-family: "Myriad Pro Light";

    font-size: 1.65rem;

    font-weight: normal;

    color: #636363;

    margin-bottom: 1.5rem;
}

.newsletter-signup .form-inline {
    justify-content: center;

    align-items: center;

    margin-bottom: 1.5rem;
}

.newsletter-signup .form-inline ::placeholder {
    font-family: "Myriad Pro Light";

    color: #636363;
}

.newsletter-signup .form-inline input[type="email"].form-control {
    min-width: 350px;

    max-width: 100%;

    border-color: rgba(0, 0, 0, 0.1);
}

.newsletter-signup .form-inline .btn.btn-primary {
    font-family: "Myriad Pro Light";

    background-color: #49c9f5;

    color: #fff;

    border-color: #49c9f5;
}

.newsletter-signup .form-inline .btn.btn-primary:hover {
    background-color: #0ba6da;

    border-color: #0ba6da;

    color: #fff;
}

.newsletter-signup .social .sub-title {
    font-family: "Myriad Pro Light";

    font-size: 1.35rem;

    font-weight: normal;

    color: #636363;

    margin-bottom: 1.5rem;
}

.newsletter-signup .social a {
    font-family: "Myriad Pro Condensed";

    font-size: 0.9rem;

    background-color: #49c9f5;

    color: #fff;

    text-decoration: none;

    border-radius: 3px;

    padding: 2.5px 5px;

    transition: all 200ms ease-in-out;

    margin: 0 1.5px;
}

.newsletter-signup .social a:hover {
    background-color: #0ba6da;
}

.newsletter-signup .social .twitter {
    background-color: #85d0f3;
}

.newsletter-signup .social .twitter:hover {
    background-color: #0ba6da;
}

.newsletter-signup .social .facebook {
    background-color: #47629c;
}

.newsletter-signup .social .facebook:hover {
    background-color: #283757;
}

.newsletter-signup .social .linkedin {
    background-color: hsl(201, 98%, 35%);
}

.newsletter-signup .social .linkedin:hover {
    background-color: #01314c;
}

footer .container .content {
    display: flex;

    justify-content: space-between;

    align-items: center;

    flex-wrap: wrap;

    padding-bottom: 2rem;

    text-transform: uppercase;
}

footer .content a {
    font-size: 0.7rem;

    padding: 0 0.5rem;

    color: #636363;

    text-decoration: none;
}

footer .content a:hover {
    color: #85d0f3;
}
.angles {
    display: none;
}
.main-header .bottom-nav .nav-container nav a {
    color: #fff;
}
.main-header .bottom-nav .nav-container nav a:hover {
    color: #005992 !important;
}
@media screen and (max-width: 1199px) {
    .nav-layer2 {
        display: none;
    }
    .nav-container .container {
        width: 100%;

        max-width: unset;

        padding: 0;
    }
    .main-header .navbar {
        box-shadow: rgb(99 99 99 / 20%) 0px 2px 8px 0px;
    }
    .main-header .navbar .navbar-brand {
        margin-bottom: 10px;
        margin-top: 10px;
    }

    .main-header .navbar .navbar-toggler {
        color: #005992;
        border: none;
        transition: all 150ms ease-in-out;
        position: absolute;
        top: 22px;
        left: 7px;
    }

    .main-header .navbar .navbar-toggler .fas {
        font-size: 28px;

        transform: scaleX(1.1) scaleY(1);

        margin-bottom: 5px;
    }

    .main-header .navbar .navbar-toggler p {
        text-transform: uppercase;

        font-family: "Myriad Pro Light";
    }

    .main-header .navbar #navigationContent {
        flex-direction: column;

        justify-content: center;

        align-items: center;

        padding-top: 0.75rem;

        padding-right: 0;

        position: relative;

        width: 100vw;
        margin-left: 0px !important;
        margin-right: 0px !important;
    }

    .main-header .navbar #navigationContent.collapse.show,
    .main-header .navbar #navigationContent.collapsing {
        display: flex;
    }

    .main-header .top-bar {
        /* display: none; */
        width: auto;
        margin-right: 0px;
        justify-content: unset;
        align-items: normal;
    }

    .main-header .top-bar.bottom-bar {
        display: flex;

        flex-direction: column;

        justify-content: center;

        text-align: center;

        transition: all 200ms ease;

        background: #fff;
    }

    .main-header .nav-bar {
        justify-content: center;

        width: 100%;
    }

    /* .main-header .top-bar.bottom-bar .skew-button {

        width: 100%;

        text-align: center;

        transform: skewX(0);

        padding: 12.5px 20px;

        margin-right: 0;

    } */

    /* .main-header .top-bar.bottom-bar .skew-button:last-child {

        margin-right: 0;

        border-bottom: none;

        background: #146299;

    } */

    /* .main-header .top-bar.bottom-bar .skew-button:hover {

        background: #0ba6da;

    } */

    .main-header .top-bar.bottom-bar .skew-button span {
        display: block;

        /* transform: skewX(0); */
    }

    .main-header .nav-bar {
        padding-right: 0;

        flex-direction: column;

        justify-content: center;

        background-color: #fff;
    }
    .main-header .bottom-nav {
        margin-top: 0px;
    }
    .lang-web {
        right: auto;
    }
    .switcher a {
        display: inline-block !important;
    }
    .switcher-user a {
        display: inline-block !important;
    }
    .main-header .nav-bar .nav-container {
        background: none;

        transform: skewX(0);
    }

    .main-header .nav-bar .nav-container nav {
        transform: skewX(0);

        flex-direction: column;
    }

    .main-header .nav-bar .nav-container nav a {
        font-size: 14px;
        padding: 10px 37px;
        margin-bottom: 7.5px;
        transition: all 200ms ease;
        background: linear-gradient(180deg, #ffffff 0%, #f5f5f5 100%);
        box-shadow: -1px 1px 8px rgba(0, 0, 0, 0.15);
        display: block;
    }

    .main-header .nav-bar .nav-container nav a:hover {
        color: #005992;
    }

    .main-header .nav-bar .nav-container nav a.active {
        color: #49c9f5;

        border-bottom-color: #85d0f3;
    }
    .main-header .nav-bar .nav-container .dropdown a {
        display: flex;
        justify-content: space-between;
    }
    .angles {
        display: block;
    }
    .main-header .nav-bar .nav-container .dropdown a .angle-up {
        display: none;
    }
    .main-header .nav-bar .nav-container .dropdown.show a .angle-up {
        display: inline-block;
    }
    .main-header .nav-bar .nav-container .dropdown.show a .angle-down {
        display: none;
    }
    .main-header .nav-bar .nav-container {
        padding: 0px !important;
    }
    .hero-img {
        min-height: 500px;

        height: 60vh;

        max-height: 550px;
    }

    .hero-img .hero-content .sub-heading {
        font-size: 1rem;
    }

    .hero-img .hero-content .heading {
        font-size: 2.2rem;
    }

    .hero-img .hero-content .skew-button {
        margin: 0.5rem auto 0;

        padding: 0 20px;
    }

    .hero-img .hero-content .skew-button span {
        padding: 10px;
    }

    .hero-img .for-everyone {
        top: 33%;

        left: 7.5%;
    }

    .hero-img .for-business {
        bottom: 12.5%;

        right: 7.5%;
    }

    .facts {
        padding: 1.5rem 0;
    }

    .facts .fact .number {
        font-size: 3.15rem;

        line-height: 1.25;
    }

    .facts .fact .title {
        font-size: 0.875rem;
    }

    .explore-app {
        margin-bottom: 2.5rem;
    }

    .explore-app .search .title {
        padding-top: 1.5rem;

        font-size: 1.5rem;
    }

    .explore-app .search .sub-para span {
        font-size: 0.875rem;
    }

    .explore-app .devices {
        margin-bottom: 1.5rem;
    }

    .explore-app .action-btn-container a.btn.btn-outline-primary {
        min-width: max-content;
    }

    .banner-devices {
        margin-bottom: 2.5rem;
    }

    .newsletter-signup {
        margin-bottom: 1.5rem;
    }

    .newsletter-signup .card .card-body {
        padding: 1.25rem;
    }

    .newsletter-signup .main-title {
        font-size: 1.25rem;
    }

    .newsletter-signup .form-inline {
        margin-bottom: 1.5rem;
    }

    .newsletter-signup .form-inline input[type="email"].form-control {
        min-width: 300px;

        max-width: 100%;

        border-color: rgba(0, 0, 0, 0.1);
    }

    .newsletter-signup .social .sub-title {
        font-size: 1.15rem;
    }

    .newsletter-signup .social a {
        font-family: "Myriad Pro Condensed";

        font-size: 0.875rem;
    }

    footer .container .content {
        flex-direction: column;

        justify-content: center;

        align-items: center;
    }

    footer .left-menu {
        display: flex;

        justify-content: center;

        align-items: center;

        flex-wrap: wrap;
    }

    footer .content a {
        font-size: 0.7rem;

        padding: 0 0.5rem;

        color: #636363;

        text-decoration: none;
    }

    footer .content a:hover {
        color: #85d0f3;
    }
    .main-header .top-bar .skew-button {
        font-size: 12px;
    }
    .nav-container {
        padding-left: 0px;
        padding-right: 0px;
    }
}

@media screen and (max-width: 480px) {
    /* .nav-container {

        min-height: 100px;

        background-color: #fff;

    } */
    .main-header .navbar .navbar-toggler {
        color: #005992;
        border: none;
        transition: all 150ms ease-in-out;
        position: absolute;
        top: 22px;
        left: 7px;
    }
    .main-header .navbar .navbar-toggler p {
        font-size: 18px;
    }

    .nav-container .container {
        width: 100%;

        max-width: unset;

        padding: 0;
    }

    .main-header .navbar .navbar-toggler .fas {
        font-size: 28px;

        transform: scaleX(1.1) scaleY(1.1);

        margin-bottom: 5px;
    }

    .hero-img {
        min-height: 300px;

        max-height: 400px;
    }

    .hero-img .hero-content .sub-heading {
        font-size: 0.875rem;
    }

    .hero-img .hero-content .heading {
        font-size: 1.25rem;
    }

    .hero-img .hero-content .skew-button {
        margin: 0.5rem auto 0;

        padding: 0 5px;
    }

    .hero-img .hero-content .skew-button span {
        padding: 7.5px 10px;

        font-size: 0.875rem;
    }

    .hero-img .for-everyone {
        top: 33%;

        left: 5%;
    }

    .hero-img .for-business {
        bottom: 7.5%;

        right: 5%;
    }

    .facts .fact .number {
        padding: 0 0.2rem;

        font-size: 2.1rem;
    }

    .facts .fact .title {
        font-size: 0.6rem;
    }

    .explore-app .search .title {
        font-size: 1.75rem;
    }

    .explore-app .devices {
        flex-wrap: wrap;
    }

    .explore-app .devices > div {
        padding: 10px;
    }

    .newsletter-signup .form-inline input[type="email"].form-control {
        margin-bottom: 10px;
    }
}

@media (max-width: 1200px) {
    .student-welcome-search h1 {
        font-size: 6.5vw;
    }
}

@media (max-width: 991px) {
    .center:before {
        content: initial;
    }

    .checkout-left {
        padding: 25px 25px 25px 25px;

        background: #83cfef;
    }

    .checkout-logo {
        position: initial;

        margin-bottom: 20px;
    }

    .checkout:before {
        content: initial;
    }

    .support {
        width: 94%;

        position: initial;

        bottom: 20px;

        background: #83cfef;

        padding: 15px;

        margin: 15px auto;
    }

    .inner-container {
        background: #fff !important;

        min-height: auto;

        height: auto;

        padding-bottom: 30px;

        max-height: unset;
    }

    .col-lg-18 {
        width: initial;

        max-width: initial;
    }

    .inline-dropdown {
        width: 100%;
    }
}

@media (max-width: 768px) {
    .nav-tabs.assigned-tabs .nav-link {
        font-size: 22px;
    }

    .calender span {
        font-size: 16px;
    }

    .profile-inner-content p {
        font-size: 23px;
    }

    .student-welcome-search h1 {
        font-size: 9.5vw;
    }

    .student-welcome-search .form-control {
        height: 40px;

        border-radius: 5px !important;
    }

    .student-welcome-search button.btn {
        height: 40px;
    }
}

@media (max-width: 576px) {
    .col-lg-18 {
        width: 100%;

        max-width: 100%;
    }

    .nav-tabs.assigned-tabs .nav-link {
        font-size: 17px;
    }

    .student-welcome-search h1 {
        font-size: 8vw;
    }

    .profile-inner-content p {
        font-size: 20px;
    }
}

@media (max-width: 425px) {
    .social-button.google {
        margin-top: 10px;
    }

    .calender {
        position: initial;

        height: initial;

        margin-top: -15px;
    }

    .calender span {
        font-size: 13px;
    }
}