@import url("printing.css") print;

/* ---------FORM + CONTACT_IMG------------- */
.from_container_flex {
    width: 60vw;
}

.form_container {
    width: 500px;
    margin-bottom: 20px;
}

@media screen and (max-width: 1400px) {
    .from_container_flex {
        flex-direction: column;
    }
    .img_container {
        margin: 0 0 30px auto;
    }
}

@media screen and (max-width: 1220px) {
    form input {
        max-width: 400px !important;
    }
}

@media screen and (max-width: 360px) {
    .img_container{
        /* padding-right: 20px !important; */
        margin: 20px auto 0 !important;
        border: 1px solid black;
    }

    .img_container img {
        display: block;
        margin: 0 auto !important;
        width: 300px;
    }
}

@media screen and (max-width: 990px) {
    .flex_container {
        flex-direction: column !important;
    }
    .form_container {
        max-width: 400px !important;
    }
    .harmadik {
        width: 80vw !important;
        margin: 30px auto;
    }
    .img_container {
        margin: 30px auto 0;
    }
    form textarea {
        max-width: 300px !important;
    }
    form input {
        max-width: 300px !important;
    }
    .form_container {
        margin: 0 auto;
    }
    form {
        margin: 0 auto;
    }
}

label {
    margin-top: 30px;
}

form textarea {
    width: 100%;
    max-width: 410px;
}

.form_p {
    margin-top: 10px;
    margin-bottom: 0;
}

#textarea_label {
    display: block;
}

/* CONTACT_IMG */
.contact_img {
    display: block;
    margin: 0 auto;
    max-width: 300px;
}

.img_container img:hover {
    box-shadow: 0 0 3px 5px rgba(0, 140, 186, 0.5);
}

.img_container {
    margin-left: 35px;
}

/* CONTACT_IMG END */

/* ---------FORM + CONTACT_IMG END------------- */

/* -----ASIDE CSS------- */

.harmadik {
    border: 2px solid black;
    background-image: linear-gradient(rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.8)), url(../media/hatter.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    max-width: 450px !important;
    height: 600px;
}

.harmadik p, .harmadik h2 {
    color: white;
}

/* aside link */
#link:link {
    color: white;
}

#link:visited {
    color: rgb(83, 168, 140);
}

/* -----ASIDE CSS------- */

/* ------TERKEP----- */
iframe {
    width: 500px;
    height: 300px;
}

@media screen and (max-width: 510px) {
    iframe {
        width: 310px;
    }
}
/* ------TERKEP----- */

/* -------ELERHETOSEG------ */

.elerhetoseg_container {
    border: 1px solid gray;
    border-radius: 5px;
    display: flex;
    flex-direction: column;
    margin: 0 0 0 auto;
}

.elerhetoseg {
    margin: 0 auto;
}

.elerhetoseg_felett, .elerhetoseg_alatt  {
    flex-grow: 1;
}

/* -------ELERHETOSEG END------ */