/** {
    margin: 0px;
}

body {
    margin: 0px;
    background-color: rgb(204, 165, 129);
    font-family: "MontserratM";

}*/

body, body * {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}

body {
    background-color: rgb(204, 165, 129);
    font-family: "MontserratM";
        min-width: 360px;
}

/******* NAV START ******/
nav {
    display: flex;
    position: relative;
    flex-direction: row;
    height: 80px;
    /*border: 1px red solid;*/
    justify-content: space-between;
    align-items: center;
    /*background-color: rgb(196,151,114);*/
    z-index: 10;
    padding-top: 40px;
}

/*******BURGER MENU START ******/
.burger_menu {
    display: none;
    position: fixed;
    backdrop-filter: blur(5px);
    top: 40px;
    right: 30px;
    width: 40px;
    aspect-ratio: 1;
    /*outline: solid white 2px;*/
    border-radius: 10px;
    flex-direction: column;
    justify-content: space-around;
    align-items: center;
    padding: 5px;
    z-index: 1000;
    cursor: pointer;

}

.burger_menu>div {
    width: 90%;
    height: 5px;
    background: white;
    pointer-events: none;
}

.burger_menu_links {
    display: none;
    position: absolute;
    top: 100%;
    right: 100%;
    padding: 40px;
    background: rgba(255, 255, 255, 1);
    color: white;
    font-weight: 500;
    line-height: 150%;
    flex-direction: column;
    z-index: 1000;
    gap: 20px;
    border-radius: 25px 0 25px 25px;
    text-align: right;
    border-left: solid 1px rgba(255, 255, 255, 0.5);
    border-bottom: solid 1px rgba(255, 255, 255, 0.5);
    white-space: nowrap;
    cursor: default;
    text-decoration: none;
}

.burger_menu_links>* {
    cursor: pointer;
    text-decoration: none;
    color: black;
}

.burger_menu_links_visible {
    display: flex;
}

.burger_menu_links_ajanlat {
    color: #00DBB9;
}

/***** BURGER MENU END ******/

.contact_but {
    font-size: 14px;
    padding: 20px;

}

.contact_but>a {
text-decoration: none;
    color: white;

}

.event_but {
    background-color: rgba(29, 41, 67, 1);
    padding: 20px;
    border-radius: 90px;
    font-size: 14px;

}

.event_but>a {
    text-decoration: none;
    color: white;

}

header {
    display: flex;
    position: relative;
    flex-direction: column;
    /*overflow: hidden;*/
}

#nav_left {
    display: flex;
    flex-direction: row;
    padding-left: 100px;
}

#nav_right {
    gap: 30px;
    display: flex;
    flex-direction: row;
    padding-right: clamp(0px, 100px, 100px);
}

#logo {
    max-height: 60px;
    display: flex;
    object-fit: contain;
    height: auto;
    width: auto;
}

/***** NAV END *****/

/***** SUBHEADER START *****/
#subheader {
    display: flex;
    position: relative;
    /*top: -80px;*/
    flex-direction: column;
    padding-bottom: clamp(0px, 10px, 100px);
    

}

#subheader_img {
    display: block;
    position: relative;
    /*top: -140px;*/
    object-fit: cover;
    max-width: 100%;
    height: auto;
    transform: scaleX(-1);

}

#subheader_text {
    display: flex;
    flex-direction: column;
    position: relative;
    left: 100px;
    /*top: clamp(100px, 14vw, 210px);*/
    font-family: "Montserrat";
    font-weight: 500;
    font-size: clamp(10px, 4vw, 56px);
    line-height: 110%;
    padding-top: clamp(50px, 10vw, 210px);
    padding-bottom: clamp(50px, 14vw, 400px);
    width: max-content;
}

#nav_subheader_img{
    display: block;
    position: absolute;
    object-fit: cover;
    width: 100%;
    height: auto;
    transform: scaleX(-1);

}

#subheader_text:first-child {
    color: white;

}

#subheader_text1,
#subheader_text2 {
    color: white;
}

#subheader_text3 {
    color: rgba(134, 118, 118, 1)
}

#subheader_choose_mobil {
    display: none;
}

/***** SUBHEADER END *****/

main {
    display: flex;
    flex-direction: column;
    position: relative;
    /*border: 1px blue solid;*/
    justify-content: center;
    align-items: center;
    height: max-content;
    padding-bottom: 100px;
    overflow: hidden;

}

main>img {
    display: block;
    position: absolute;
    opacity: 20%;
    top: clamp(10px, 4vw, 200px);
    width: 100%;
    height: auto;
}

/****** CATEGORY ********/

#category_wrapper {
    display: flex;
    position: relative;
    flex-direction: row;
    width: max-content;
    flex-wrap: nowrap;
    background-color: rgba(255, 255, 255, 1);
    gap: 20px;
    padding: 15px 20px;
    border-radius: 90px;
    /*margin-top: -280px;*/
    /*margin-top: clamp(-26vw, -22vw, -2vw);*/

}

.category_button {
    background-color: rgba(217, 214, 224, 0.4);
    font-size: clamp(0.5vw, 1.5vw, 4vw);
    padding: 10px 15px;
    border-radius: 90px;
}

.course_wrapper {
    display: flex;
    position: relative;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    /*border: 3px green solid;*/
    height: max-content;
    padding-top: 40px;
    max-width: calc((347px * 3) + (40px * 2));
    gap: 40px;
    /*top: 40px;*/

}

.course_card {
    display: flex;
    position: relative;
    flex-direction: column;
    height: 478px;
    width: 347px;
    background-color: white;
    border-radius: 70px;
    box-shadow: rgba(0, 0, 0, 0.25) 5px 5px 10px;
    /*margin: 5px;*/
}

.course_card img {
    display: flex;
    position: relative;
    object-fit: contain;
    height: 100%;
    width: 100%;
    /*top: -35px;*/
    border-top-left-radius: 70px;
    border-top-right-radius: 70px;
}

.course_tag {
    display: flex;
    position: absolute;
    background-color: rgba(217, 214, 224, 0.4);
    padding: 15px;
    border-radius: 90px;
    width: max-content;
    top: 15px;
    align-self: end;
    right: 30px;

}

.course_content {
    /*background-color: white;*/
    display: flex;
    position: relative;
    flex-direction: column;
    padding-top: 20px;
}

.course_title {
    font-weight: 700;
    font-size: 20px;
    padding-left: 20px;
    padding-bottom: 5px;
    padding-right: 20px;
}

.course_text {
    padding-left: 20px;
    padding-right: 20px;
}

#course_button_wrapper {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}

.course_button {
    display: flex;
    padding-right: 25px;
    padding-top: 20px;

}

.course_button a {
    text-decoration: none;
    color: white;
    background-color: rgba(29, 41, 67, 1);
    padding: 10px 35px;
    font-size: 18px;
    border-radius: 90px;
}

/******* FOOTER START *********/

footer {
    display: flex;
    position: relative;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    height: 156px;
    background-color: white;
    /*top: 150px;*/
    padding-left: 100px;
    padding-right: 100px;
}

.footer_img {
    display: flex;
    flex-direction: column;
}

.footer_dev {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.footer_school {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: end;
}

/******* FOOTER END *********/


@font-face {
    font-family: "MontserratM";
    src: url(/fonts/Montserrat-Medium.ttf);
}

@font-face {
    font-family: "MontserratSB";
    src: url(/fonts/Montserrat-SemiBold.ttf);
}

@media screen and (max-width: 860px) {
    .footer_dev {
        display: none;
    }

    .navbar_links {
        display: none;
    }

    #nav_right {
        display: none;
    }

    .navbar {
        display: flex;

    }

    #nav_left {
        display: flex;
    }

    #subheader_text{
        padding-bottom: 60px
    }

    .navbar {
        justify-content: flex-start;
    }

    .burger_menu {
        display: flex;
    }

        #logo{
        max-height: 45px;
    }
}

@media screen and (max-width: 715px) {
    .footer_dev {
        display: none;
    }

    .navbar_links {
        display: none;
    }

    #nav_right {
        display: none;
    }

    .navbar {
        display: flex;

    }

    #nav_left {
        display: flex;


    }

    .navbar {
        justify-content: flex-start;
    }

    #logo{
        max-height: 30px;
    }

    .burger_menu {
        display: flex;
    }

    #category_wrapper {
        display: none;
    }

    #nav_left {

        padding-left: 40px;
    }

    #subheader_text {

    padding-top: clamp(30px, 10vw, 210px);
    padding-bottom: 10px;
    left: 40px;
    font-size: 20px;

    }

    #subheader_choose_mobil{
        display: flex;
        position: relative;
        border-radius: 90px;
        padding: 10px 30px;
        font-size: 2.5vw;
        box-shadow: rgba(0, 0, 0, 0.25) 5px 5px 10px;
        font-weight: 500;
        top: 20px;
        outline-style: none;
        align-self: center;
    }

    #subheader select{
        outline-style: none; 
        appearance: none;
        -webkit-appearance: none;   /* Safari/iOS */
        -moz-appearance: none; /* Firefox */
        border-radius: 90px;
        margin:-10px
    
    }

    main{
        /*top: -160px;*/
    }

    main>img{
        /*display: none;*/
    }

    #subheader_img{
        height: clamp(350px, 350px, 900px);
    }

    @media screen and (max-width: 515px) {
        footer{
            flex-direction: column;
            justify-content: space-around;
        }

        .footer_school{
                align-items: center;
        }

        main>img{
            
        }
    }

}