@font-face {
    font-family: "League Spartan";
    src: url("./leaguespartan-bold.ttf") format("truetype");
    src: url("./leaguespartan-bold-webfont.woff") format("woff") url("./leaguespartan-bold-webfont.woff2") format("woff2");
}

h2 {
    font-family: 'League Spartan', Arial, Helvetica, sans-serif;
    padding-top: 2%;
}

a {
    color: burlywood;
}

a:hover {
    color: #DFB900;
}

a.hover-green:hover {
    color: #4D6B49;
}

a.hover-black:hover {
    color: #000000;
}

.courses {
    text-align: center;
    color: #4D6B49;
}

p.courses {
    padding-bottom: 1%;
}

nav {
    padding-left: 5%;
    padding-right: 5%;
    background-color: #efefef;
}

.navbar {
    padding-top: 0.3rem;
    padding-bottom: 0.3rem;
}

.navbar-brand {
    padding-top: .15rem;
    padding-bottom: .15rem;
}

.nav-item {
    padding-left: 12px;
    padding-right: 12px;
    align-content: center;
    margin-left: auto;
    margin-right: auto;
}

.active-page {
    border-bottom: 5px solid #DFB900;
}

.search-field {
    border-radius: 20px;
    min-width: 25vw;
    padding-right: 50px;
}

.btn-search {
    border-radius: 25px;
    background-color: inherit;
    border: none;
    position: absolute;
    margin-left: 21.8vw;
}

#search {
    height: 1.6em;
    color: #4D6B49;
}

#disclamer {
    background-color: #073A00;
    color: #efefef;
    /* font-weight: bold; */
    font-size: small; /* 12px */ 
    margin-bottom: 0%;
    padding: 0.2%;
    padding-left: 5%;
}

#myAnnouncement {
    display: flex;
    padding-top: 1%;
    padding-bottom: 1%;
}

.myAnnouncement {
    flex: auto;
    width: 100%;
}

.announcement {
    object-fit: cover;
    width: 100%;
    max-height: 35vh;
    opacity: 0.4;
}

.announcement:hover {
    opacity: 0.6;
    transition-duration: 1s;
}

#padding-right {
    background-color: #073A00;
}

#padding-center {
    margin-left: 1%;
    margin-right: 1%;
    background-color: #DFB900;
}

#padding-left {
    background-color: #000000;
}

.featured {
    opacity: 0.8;
}

.featured:hover {
    opacity: 0.5;
    transition-duration: 0.5s;
}

/* Container holding the image and the text */

.myContainer {
    position: relative;
    color: white;
    margin: 0%;
    padding: 0%;
}

/* Bottom left text */

.bottom-left {
    position: absolute;
    bottom: 8px;
    left: 16px;
}

/* Top left text */

.top-left {
    position: absolute;
    top: 8px;
    left: 16px;
}

/* Top right text */

.top-right {
    position: absolute;
    top: 8px;
    right: 16px;
}

/* Bottom right text */

.bottom-right {
    position: absolute;
    bottom: 8px;
    right: 16px;
    font-family: 'League Spartan', Arial, Helvetica, sans-serif;
    font-size: 500%;
}

/* Centered text */

.centered {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-family: 'League Spartan', Arial, Helvetica, sans-serif;
    font-size: x-large;
    margin: 0%;
    padding: 0%;
    text-align: center;
}

/* Banner Text */

.banner {
    position: absolute;
    top: 50%;
    right: 1%;
    transform: translate(-50%, -50%);
    font-family: 'League Spartan', Arial, Helvetica, sans-serif;
    font-size: 500%;
    color: #efefef;
}

.banner-featured {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-family: 'League Spartan', Arial, Helvetica, sans-serif;
    font-size: 600%;
    margin: 0%;
    padding: 0%;
    text-align: center;
}

#left {
    left: 25%;
}

#right {
    left: 75%;
}

.banner-img {
    object-fit: cover;
    width: 100%;
    max-height: 50vh;
    opacity: 0.6;
}

.banner-container {
    background-color: #000000;
}

.card {
    align-content: center;
    margin-left: auto;
    margin-right: auto;
    border-color: white;
    background-color: inherit;
}

h4.card-title {
    color: #DFB900;
    padding-top: 5px;
    padding-left: 2%;
    font-weight: bold;
    font-family: 'League Spartan', Arial, Helvetica, sans-serif;
}

.faculty-title {
    color: #4D6B49;
    padding-top: 5px;
    font-weight: bold;
    font-family: 'League Spartan', Arial, Helvetica, sans-serif;
}

.faculty-role {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: medium;
}

.card-text {
    padding-right: 5px;
}

.card-left {
    padding: 0% 3%;
}

.contact-flex {
    margin: 2% 0%;
}

.email-address {
    max-width: 580px;
    margin: 3% 0% 3% 9%;
}

.input-forms {
    max-width: 580px;
    margin: 3% 9% 3% 0%;
}

.conta {
    margin-bottom: 60px;
}

.contact-underline {
    padding-bottom: 20px;
}

.btn-warning, .btn-success, .btn-mine {
    font-weight: bolder;
    width: 170px;
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: auto;
    margin-right: auto;
    background-color: #DFB900;
}

.read-more {
    font-weight: bolder;
    width: 170px;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: auto;
    margin-right: auto;
    background-color: #fff;
}

.container-btn {
    height: 10vw;
    position: relative;
}

.center-btn {
    margin: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    padding-right: 10%;
}

.col-left {
    margin-right: 1%;
}

.col-right {
    margin-left: 1%;
}

#mission {
    max-width: 100%;
}

.yellow {
    background-color: #4D6B49;
    padding-left: 8%;
    padding-right: 8%;
    padding-top: 2%;
}

.degree-programs {
    padding-left: 8%;
    padding-right: 8%;
    padding-top: 2%;
    padding-bottom: 2%;
}

.yellow-border {
    border-color: #4D6B49;
    padding-top: 2%;
}

.green-border {
    border-color: #4D6B49;
    padding: 2%;
}

.my-picture-border {
    max-height: 200px;
    object-fit: contain;
}

.row {
    --bs-gutter-x: 0rem;
}

.all-courses {
    padding-top: 2%;
    padding-bottom: 2%;
}

.moto-vision-about {
    padding-top: 2%;
    padding-bottom: 2%;
}

.only-about {
    padding-top: 2%;
    padding-bottom: 1%;
}

.achievements {
    padding-top: 1%;
    padding-bottom: 4%;
}

.achievements-pics {
    width: 500px;
}

.our-moto, .our-vision, .about-us {
    border-radius: 20px;
    min-height: 22vw;
}

.our-moto {
    margin-left: 11%;
    background-color: #444444;
}

.our-vision {
    margin-right: 11%;
    background-color: #4D6B49;
}

.about-us {
    background-color: #DFB900;
}

.myCentered {
    position: absolute;
    top: 60%;
    left: 20%;
    transform: translate(-15%, -50%);
    font-size: 19px;
    margin: 0%;
    padding: 0%;
}

.vision-button, .moto-button, .about-button {
    background-color: #fff;
    margin-top: 5%;
    min-height: 12%;
}

.vision-button {
    color: #4D6B49;
    min-width: 55%;
}

.moto-button {
    color: #444444;
    min-width: 55%;
}

.about-button {
    color: #DFB900;
    min-width: 30%;
    margin-top: 2%;
}

.vision-button:hover {
    color: #4D6B49;
}

.moto-button:hover {
    color: #444444;
}

.about-button:hover {
    color: #DFB900;
}

.green-button {
    border-color: whitesmoke;
    color: whitesmoke;
    background-color: #4D6B49;
    min-width: 17vw;
}

.white-button {
    color: #4D6B49;
    background-color: #fff;
    border-color: #4D6B49;
    min-width: 20vw;
    margin-bottom: 5px;
}

.management-detail {
    padding: 1rem 1rem;
}

.col-2 {
    min-width: 120px;
    border-color: #4D6B49;
    padding-top: 2%;
}

.col-md-2 {
    padding-bottom: 0%;
}

.contact-heading {
    font-weight: bolder;
    font-size: xx-large;
}

.title-white {
    color: whitesmoke;
    font-size: larger;
    font-weight: normal;
    text-align: center;
}

.featured-courses {
    padding-top: 5%;
    padding-bottom: 5%;
}

.contact-us {
    margin-top: 2%;
    margin-bottom: 2%;
    margin-left: auto;
    margin-right: auto;
    align-items: center;
}

.adv {
    background-color: #DFB900;
    min-width: 17vw;
    border-color: #DFB900;
}

.faculty-btn {
    min-width: 17vw;
    color: whitesmoke;
}

.green-button:hover, .faculty-btn:hover, .green-text:hover {
    color: whitesmoke;
}

.white-button:hover {
    color: #4D6B49;
}

.adv:hover, .moto-button:hover, .vision-button:hover, .about-button:hover, .white-button, .green-button:hover, .faculty-btn:hover, .green-text:hover {
    cursor: default;
}

.center {
    margin-left: auto;
    margin-right: auto;
    align-items: center;
}

.contact-icon {
    margin-left: auto;
    margin-right: 5%;
    height: 80px;
    width: 80px;
    color: #DFB900;
}

.align {
    align-items: center;
}

.mid {
    align-items: center;
    align-content: center;
}

.centerrr {
    padding-top: 5px;
}

.text-align {
    text-align: left;
}

.green-line-right {
    margin-top: 2%;
    padding-top: 0%;
    border-right: 2px solid #4D6B49;
}

.green-line-left {
    margin-top: 2%;
    padding-top: 0%;
    border-left: 2px solid #4D6B49;
}

.page-footer {
    background-color: #444444;
    color: #efefef;
}

.display-change {
    visibility: hidden;
}

.active-footer {
    font-weight: bolder;
}

.col-6 {
    padding-right: 10%;
    margin-right: 10%;
}

.col-8 {
    min-width: 70%;
}

.extra-padding {
    padding-bottom: 2rem;
}

.go-back {
    padding-bottom: 1%;
}

.container {
    width: 100%;
}

.black-Background {
    text-align: left;
    padding-left: 8%;
}

.black {
    background-color: black;
    color: #efefef;
}

.anchor-black {
    text-decoration: none;
    color: #efefef;
}

.anchor-black-text {
    text-decoration: none;
    color: #000000;
}

.anchor {
    text-decoration: none;
    color: #efefef;
}

@media screen and (max-width: 1359px) {
    nav {
        padding-left: 3%;
        padding-right: 3%;
    }    
    .title-white {
        font-size: medium;
    }
    .nav-item {
        padding-left: 1px;
        padding-right: 1px;
    }
    .nav-link {
        font-size: smaller;
    }
    .search-field {
        border-radius: 20px;
        min-width: 20vw;
        padding-right: 45px;
    }
    .btn-search {
        margin-left: 18vw;
    }
    .banner, .bottom-right, .banner-featured {
        font-size: 370%;
    }
    .myCentered {
        font-size: 16px;
    }
    .our-moto, .our-vision, .about-us {
        min-height: 29vw;
    }
}

@media screen and (max-width: 994px) {
    .btn-search {
        margin-left: 79vw;
    }
    .col-6 {
        padding-right: 2%;
        margin-right: 2%;
    }
    .achievements-pics {
        padding-bottom: 3%;
    }
    .black-Background {
        text-align: center;
        margin-left: 0%;
        margin-right: 20%;
        padding-left: 0%;
    }
}

@media screen and (max-width: 768px) {
    nav {
        padding-left: 1%;
        padding-right: 2%;
    }
    .title-white {
        font-size: smaller;
    }
    #disclamer {
        font-size: x-small;
        /* font-weight: normal; */
    }
    .centered {
        font-size: large;
    }
    .our-moto, .our-vision, .about-us {
        min-height: 34vw;
    }
    .banner, .bottom-right, .banner-featured {
        font-size: 270%;
    }
    .banner-img {
        max-height: 35vh;
    }
    .yellow {
        padding-left: 4%;
        padding-right: 4%;
    }
    .green-button, .white-button, .read-more, .adv {
        font-size: smaller;
    }
    .btn-mine {
        line-height: 1.2;
    }
    .vision-button, .moto-button, .about-button {
        font-size: small;
    }
    .rounded-start {
        max-height: 30vh;
        width: 100%;
        object-fit: contain;
    }
    .myCentered {
        font-size: small;
        left: 18%;
    }
    .card-left {
        padding: 3% 1% 0%;
    }
    .card-body {
        padding-right: 12px;
    }
    .management-detail {
        padding: 1rem 0rem;
    }
    .card-text {
        padding-right: 0%;
    }
    .green-border {
        padding-top: 4%;
    }
    .contact-heading {
        font-weight: bolder;
        font-size: x-large;
    }
    .text-align {
        text-align: center;
    }
    .green-line-right {
        border-right: 1px solid #4D6B49;
    }
    .green-line-left {
        border-left: 1px solid #4D6B49;
    }
    .display-change {
        display: none;
    }
    .col-6 {
        width: 100%;
        padding-right: 5%;
        margin-right: 5%;
        padding-bottom: 1rem;
    }
    .center-btn {
        padding-right: 0%;
    }
    .extra-padding {
        padding-bottom: 1rem;
    }
}

@media screen and (max-width: 767px) {
    .centered {
        font-size: medium;
    }
    .banner, .bottom-right, .banner-featured {
        font-size: 200%;
    }
    .contact-icon {
        margin-right: auto;
    }    
    .email-address {
        margin: 3% 3% 3% 3%;
    }
    .input-forms {
        margin: 3% 3% 3% 3%;
    }
    .black-Background {
        margin-right: 8%;
        padding-left: 8%;
    }
}

@media screen and (max-width: 600px) {
    h2.courses {
        font-size: x-large;
    }
    .btn-search {
        margin-left: 68vw;
    }
    .navbar-brand {
        padding-top: 0rem;
        padding-bottom: 0rem;
    }
    .centered {
        font-size: x-small;
    }
    .myCentered {
        font-size: xx-small;
        left: 16%;
        padding-top: 6%;
    }
    .banner-img {
        max-height: 30vh;
    }
    .green-border {
        padding-top: 3%;
    }
    .all-courses {
        padding-top: 5%;
    }
    .vision-button, .moto-button, .about-button {
        min-height: 7%;
    }
    .center-btn {
        padding-bottom: 5%;
    }
    .card-left {
        padding: 5%;
    }
    .our-moto, .our-vision, .about-us {
        min-height: 32vw;
        width: 80%;
        align-self: center;
        margin-left: auto;
        margin-right: auto;
    }
    .about-us {
        min-height: 41vw;
    }
    .our-moto {
        margin-bottom: 2%;
    }
    .achievements-pics {
        width: 95vw;
    }
    .banner, .bottom-right, .banner-featured {
        font-size: 130%;
    }
    .vision-button, .moto-button, .about-button {
        margin-top: 3%;
    }
}

@media screen and (max-width: 430px) {
    nav {
        padding-left: 0%;
        padding-right: 1%;
    }
    .banner-img {
        max-height: 20vh;
    }
    .our-moto, .our-vision, .about-us {
        min-height: 39vw;
    }
    .achievements-pics {
        width: 100vw;
    }
    .achievements {
        padding-bottom: 0%;
    }
    .about-us {
        min-height: 48vw;
    }
}

@media screen and (max-width: 350px) {
    .centered {
        font-size: xx-small;
    }
    .banner, .bottom-right, .banner-featured {
        font-size: 100%;
    }
    .vision-button, .moto-button, .about-button {
        min-height: 1%;
    }
    .our-moto, .our-vision, .about-us {
        min-height: 48vw;
    }
    .about-us {
        min-height: 58vw;
    }
    .myCentered {
        left: 14%;
    }
}