﻿body {
background-color:white;
margin:0;
box-sizing:border-box;
}


div {
    box-sizing: border-box;
}



.landing_wrap {
overflow:hidden;
background-color:white;

}



.mei_1 {
    width: 430px;
    margin-bottom: -200px;
    position: relative;
    margin-left:-60px;
    margin-right:-10px;
    margin-top: -50px;
    z-index: 5;
}


.img_wrap {
text-align:right;
}

.background-wave {
    height: 220px;
    width: 120%;
    background-image: url(//uploads.cdn.uzdevumi.lv/upload/ProductLandingTemplateFiles/id-35200/ver-73/images/w_wave_2.svg);
    position: absolute;
    background-position: center bottom;
    background-repeat: repeat-x;
    /* transform: scaleY(0.4) translateY(0); */
    transform-origin: 100% 50%;
    background-size: 4000px;
    bottom: -5px;
    transform-origin: bottom;
    left: -12%;
    z-index: 3;
    /* transition: 1s ease-in-out; */
}


.background-2 {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: radial-gradient(65.83% 196.5% at 69.58% 85.48%, #AAA2EF 0%, #6A60CD 100%);
}


.header_section_back {
    position: relative;
    background: radial-gradient(800px 1000px at 30% 0%, #AAA2EF 0%, #6A60CD 100%);
    width: 100%;
}

.header_section {
    display: grid;
    padding-top: 5vh;
    grid-column-gap: 5%;
    padding-bottom: 10vh;
    max-width: 1000px;
    margin: auto;
    grid-template-columns: auto auto;
    color: white;
}


.text_wrap {
    position: relative;
    max-width: 550px;
}

.header_1 {
    color: #FFF;
    text-shadow: 0 2px 0 #372e8d;
    font-family: Montserrat;
    position:relative;
}

.huge {
    text-shadow: 0 2px 0 rgba(80, 5, 110, 0.25);
    font-size: 67px;
    position: relative;
    z-index: 1;
    font-style: normal;
    font-weight: 900;
    line-height: 0.9;
    max-width: 530px;
    display: block;
    text-transform: uppercase;
}

.normal {
    text-shadow: 0 2px 0 rgba(80, 5, 110, 0.25);
    font-size: 65px;
    font-weight: 500;
    margin-top: 25px;
    margin-bottom: 30px;
    display: block;
    position: relative;
    z-index: 5;
    line-height: 1;
    text-transform: uppercase;
}

.circule {
    width: 200px;
    height: 200px;
    font-size: 26px;
    align-content: center;
    text-align: center;
    position: absolute;
    top: 20px;
    right: 30px;
    display: grid;
    border-radius: 100%;
    text-transform: uppercase;
    background-color: #06C2B7;
    text-shadow: 0 2px 0 #009990;
    box-shadow: 0px 3px 0 #009990;
}


.line_1 {
    font-size: 32px;
    font-weight: 800;
    text-transform: uppercase;
    line-height: 1;
}


.line_2 {
    color: #FFF;
    font-size: 30px;
    font-weight: 600;
    margin-left: -2px;
    line-height: 1;
    text-transform: uppercase;
}


.plain_text {
    text-shadow: 0 2px 0 rgba(80, 5, 110, 0.25);
    font-size: 19px;
    font-weight: 500;
    max-width: 420px;
    line-height:1.3;
    margin-bottom:20px;
    display:block;
}


.schedule_wrap {
    display: grid;
    width: 100%;
    max-width: 1200px;
    margin: 40px auto;
    padding:0 20px;
    grid-row-gap: 8px;
    grid-column-gap: 8px;
    grid-template-columns: 19.20% 19.20% 19.20% 19.20% 19.20%;
}


.vrezka a {
    color: #008CFF;
}

.vrezka {
    display: block;
    margin: 20px auto;
    font-size: 17px;
    max-width: 600px;
    text-align: center;
    line-height: 1.3;
    font-weight: 500;
    font-family: Montserrat;
    color: #535e6f;
}

.day {
    border-radius: 14px;
    opacity: 1;
    background: rgb(240 242 243 / 0.52);
    box-shadow: 0 2px 0 0 #E4E4E4;
    color: #7d8a9c;
    padding: 15px 10px;
    text-align: center;
    font-family: Montserrat;
    font-size: 15px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
}

.day_2 {
    border-radius: 14px;
    opacity: 1;
    grid-template-columns: 65px auto;
    color: white;
    padding: 4px;
    text-align: center;
    grid-row-gap: 20px;
    grid-column-gap: 10px;
    font-family: Montserrat;
    font-size: 15px;
    align-items:center;
    font-style: normal;
    font-weight: 500;
    min-height:85px;
    line-height: normal;
    display:grid;
    transform: scale(1);
    text-decoration:none;
    transition: transform 0.5s ease-in-out;
}

.color_1 {
    background: #06C2B7;
    box-shadow: 0 2px 0 0 #0AA79D, 0 0px 1px rgb(0 0 0 / 0.0);
    transform: scale(1);
    transition: transform 0.5s ease-in-out, box-shadow 0.5s ease-in-out, z-index 0.3s;
}


.color_2 {
    background: #8E70FB;
    box-shadow: 0 2px 0 0 #6A60CD, 0 0px 1px rgb(0 0 0 / 0.0);
    transform: scale(1);
    transition: transform 0.5s ease-in-out, box-shadow 0.5s ease-in-out, z-index 0.3s;
}


.color_3 {
    background: #F0F2F3;
    box-shadow: 0 2px 0 0 #E4E4E4;
    color: white;
    transform: scale(1);
    transition: transform 0.5s ease-in-out;
}


    .color_3 .calendar_date {
        background-color:  rgb(125 138 156 / 0.20);
        border-radius: 10px;
        height: 100%;
        display: grid;
        align-items: center;
    }

.color_1:hover {
    transform: scale(1.07);
    transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out, z-index 0.3s ;
    cursor: pointer;
    z-index: 5;
    color:white;
    text-decoration:none;
    filter:brightness(1.05);
    box-shadow: 0 4px 0 0 #0AA79D, 0 5px 10px rgb(0 0 0 / 0.62);
}

.color_2:hover {
    transform: scale(1.07);
    transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out, z-index 0.3s;
    cursor: pointer;
    z-index: 5;
    color: white;
    text-decoration: none;
    filter: brightness(1.05);
    box-shadow: 0 4px 0 0 #795fd6, 0 5px 10px rgb(0 0 0 / 0.62);
}


.color_2:visited, .color_1:visited, .color_2:focus, .color_1:focus {
    color: white;
    text-decoration: none;
}


.calendar_date {
    background-color: rgb(0 0 0 / 0.15);
    border-radius: 10px;
    height:100%;
    display:grid;
    align-items:center;
}

.calendar_text {
    text-align: left;
}

.data_1 {
    font-size: 26px;
    line-height: 1;
    font-weight: 600;
}

.subject {
    font-size: 14px;
    line-height: 1.1;
    margin-top: 5px;
    text-shadow: 0 2px 3px #0000003b;
}

.data_2 {
    font-size:14px;
    margin-top:3px;
}

.dots {
    font-size: 16px;
    margin: 0;
    padding: 0;
    margin-left: -5px;
}

.class_text {
    font-size: 22px;
    font-weight: 800;
}







    @media screen and (max-width: 1244px) {
        .class_text {
            font-size: 17px;
            font-weight: 800;
        }

        .subject {
            font-size: 13px;
            line-height: 1.1;
            letter-spacing: -0.3px;
            margin-top: 5px;
        }

        .data_2 {
            letter-spacing: -0.3px;
        }


        .header_section {
            display: grid;
            padding-top: 3vh;
            grid-column-gap: 2%;
            padding-bottom: 8vh;
        }

        .day_2 {
            opacity: 1;
            grid-template-columns: 55px auto;
            padding: 0;
            grid-row-gap: 10px;
        }

        .mei_1 {
            width: 380px;
            margin-bottom: -200px;
            margin-top: -25px;
            margin-left: -20px;
        }

        .huge {
            font-size: 60px;
        }

        .plain_text {
            font-size: 17px;
            max-width: 340px;
        }

        .normal {
            font-size: 58px;
            margin-top: 20px;
            margin-bottom: 20px;
        }


        .schedule_wrap {
            display: grid;
            width: 98%;
            max-width: 1000px;
            padding: 0 10px;
            margin: 40px auto;
            grid-row-gap: 8px;
            grid-column-gap: 4px;
            grid-template-columns: 19.60% 19.60% 19.60% 19.60% 19.60%;
        }

        .circule {
            width: 180px;
            height: 180px;
            font-size: 24px;
            top: 20px;
            right: 70px;
        }
    }

@media screen and (max-width: 1120px) {

    .mei_1 {
        width: 330px;
        margin-bottom: -200px;
        margin-top: -10px;
        margin-left: -40px;
    }

    .text_wrap {
        position: relative;
        max-width: 490px;
    }

    .data_1 {
        font-size: 22px;

    }

    .day_2 {
        opacity: 1;
        grid-template-columns: 45px auto;
        padding: 0;
        grid-column-gap: 5px;
        grid-row-gap: 0px;
    }


    .data_2 {
        font-size: 12px;
        margin-top: 3px;
    }

    .huge {
        font-size: 55px;
    }
}

    @media screen and (max-width: 767px) {
        .class_text {
            font-size: 18px;
            font-weight: 800;
        }

        .vrezka {
            margin: 10px auto;
            font-size: 15px;
            max-width: 320px;
            text-align: center;
        }

        .schedule_wrap {
            display: grid;
            width: 98%;
            max-width: 330px;
            padding: 0 20px;
            margin: 30px auto;
            grid-row-gap: 8px;
            grid-column-gap: 4px;
            grid-template-columns: 100%;
        }

        .header_section {
            display: grid;
            padding-top: 40px;
            grid-column-gap: 5%;
            padding-bottom: 80px;
            position:relative;
            max-width: 320px;
            margin: auto;
            grid-template-columns: 100%;
        }

        .img_wrap {
            text-align: center;
            order: 2;
        }

        .mei_1 {
            width: 210px;
            margin-bottom: -200px;
            margin-top: -160px;
            margin-left: -40px;
            position: absolute;
        }

        .huge {
            font-size: 40px;
            line-height: 1.2;
        }

        .normal {
            font-size: 40px;
            margin-top: 5px;
            margin-bottom: 10px;
        }


        .line_1 {
            font-size: 20px;
        }

        .line_2 {
            color: #FFF;
            font-size: 18px;
            margin-left: -2px;
        }

        .circule {
            width: 120px;
            height: 120px;
            font-size: 24px;
            top: 25px;
            right: 10px;
        }

        .plain_text {
            font-size: 15px;
            max-width: 210px;
        }


        .day, .color_3, .br_mob {
            display: none;
        }


        .day_2 {
            opacity: 1;
            grid-template-columns: 75px auto;
            padding: 4px;
            grid-row-gap: 10px;
        }

        .subject {
            font-size: 16px;
            line-height: 1.1;
            font-weight: 600;
            letter-spacing: 0.1px;
            margin-top: 5px;
        }
    }


    @media screen and (max-width: 366px) {

        .header_section {
            padding-top: 10px;
            max-width: 300px;
        }

        .mei_1 {
            width: 200px;
            margin-bottom: -200px;
            margin-top: -150px;
            margin-left: 140px;
        }

        .huge {
            font-size: 36px;
            line-height: 1.2;
        }

        .normal {
            font-size: 34px;
            margin-top: 5px;
            margin-bottom: 10px;
        }

        .schedule_wrap {
            padding: 0 20px;
            margin: 20px auto;
        }

        .vrezka {
            margin: 5px auto;
            font-size: 15px;
            max-width: 280px;
        }
    }