/*ÁLTALÁNOS*/

html{padding: 0px; 
    margin: 0px;}

body{padding: 0px; 
    margin: 0px; 
    background-color: #C9ADA7; 
    font-family: 'Abril Fatface', 'Times New Roman';}

* {box-sizing: border-box;}

.container {display: flex; 
    flex-direction: row;
    justify-content: space-around; 
    flex-wrap: wrap;}

.container>*{margin: 1%; 
    height: fit-content;}

/*FŐOLDAL ÉS MINDEN OLDALRA ÉRVÉNYES TAGEK*/

header{display: flex;
    background-color: #F2E9E4; 
    flex-direction: row;
    justify-content: center;}

header img{height: fit-content;}

header h1 a{color: #4A4E69; 
    margin-top: 5%; 
    display: block; 
    text-decoration: none;}

nav ul{list-style-type: none; 
    display: flex; 
    flex-direction: column;
    padding: 0px; 
    margin: 0px;}

nav ul li{padding: 5px;}

nav li a{display: block;
    color: #F2E9E4; 
    text-decoration: none;
    background-color: #4A4E69; 
    border-radius: 8px; 
    padding: 8px; 
    text-align: center;}

nav ul li a#active{background-color: #9A8C98;}

nav ul li a:hover, li a#active:hover{color: #4A4E69; 
    background-color: #F2E9E4;}

article {color: #4A4E69; 
    background-color: #F2E9E4; 
    border-radius: 8px; 
    padding: 5px; 
    text-align: justify;}

article.fooldal1 p{text-align: justify;}

article.fooldal1 img{float: left; 
    height: auto;
    width: 100%;
    border-radius: 8px;
    margin-right: 16px;}

article.fooldal3 h2, article.fooldal1 h2, article.fooldal2 h2{text-align: center;}

article.fooldal3 video{text-align: justify; 
    margin-left: auto; 
    margin-right: auto; 
    display: block; 
    width: 100%; 
    border-radius: 8px;}

article.fooldal2 img{float: left; 
    height: auto;
    width: 100%; 
    border-radius: 8px;
    margin-right: 16px;}

article.fooldal4 img{float: left; 
    height: auto; 
    width: 100%; 
    border-radius: 8px; 
    margin-right: 15px;}

article.fooldal4 p{text-align: justify;}

footer{color: #4A4E69;
    background-color: #F2E9E4; 
    padding: 5px;}

footer a{margin: 10px;}

footer img{height: auto; 
    width: 30px;}

table{width: 100%;}

footer td.balra{text-align: left;}
footer td.jobbra{text-align: right;}

footer img:hover{transform: scale(1.1); 
    transition: 1s;}

article.fooldal5 p{text-align: justify;}

article.fooldal5 h2{text-align: center;}

article.rendel{display: flex; 
    flex-direction: row; 
    justify-content: space-between; 
    flex-wrap: nowrap; 
    width: 100%;}

article.rendel h2{margin: 5px;}

article.rendel h2.nyil a{display: block; 
    text-decoration: none; 
    color: #4A4E69;}

article.rendel h2.nyil a:hover{color: #9A8C98;}

article.ugras{display: flex; 
    flex-direction: row; 
    justify-content: space-between; 
    flex-wrap: nowrap; 
    width: 100%;}

article.ugras h2{margin: 5px;}

article.ugras h2.nyil a{display: block; 
    text-decoration: none; 
    color: #4A4E69;}

article.ugras h2.nyil a:hover{color: #9A8C98;}

/*KARRIER TAGEK*/

article.karrier2 img{float: left; 
    height: auto; 
    width: 100%; 
    border-radius: 8px; 
    margin-right: 15px;}

article.karrier1 img, article.karrier3 img, article.karrier4 img{float: left; 
    height: auto; 
    width: 50%; 
    border-radius: 8px; 
    margin-right: 15px;}

/*FILMEK TAGEK*/

article.filmek1{width: 100%;}

article.filmek1 h2{text-align: center;}

article.filmek1 p{text-align: justify;}

article.filmek1 a:hover{color: #9A8C98;}

article.filmek2 img, article.filmek3 img, article.filmek4 img, article.filmek5 img, 
article.filmek6 img, article.filmek7 img{width: 100%; 
    height: auto; 
    border-radius: 8px;}

article.filmek2 img:hover, article.filmek3 img:hover, article.filmek4 img:hover, article.filmek5 img:hover, 
article.filmek6 img:hover, article.filmek7 img:hover{transform: scale(1.008); 
    transition: 3s;}

/*TESZT TAGEK*/

article.toltsd_ki{width: 100%;}

article.kerdesek{width: 100%;}

article.kerdesek h2{text-align: left;}

input#mybutton{color: #4A4E69; 
    border: solid #4A4E69 1px; 
    margin-left: 5px; 
    font-size: 15px;}

input#mybutton:hover{transform: scale(1.08); 
    transition: 0.5s;}

/*RENDELÉS TAGEK*/

form{text-align: left; 
    color: #4A4E69; width: 100%;}

form h2, form h3{text-align: center;}

hr.vonal1{height: 5px; 
    background-color: #4A4E69;}

input#vezeteknev{width: 100%;}

input#keresztnev{width: 100%;} 

input#email{width: 100%;}

input#telefonszam{width: 100%;}

input#jelszo{width: 100%;}

input#jelszo_ujra{width: 100%;}

article.rendeles2, article.rendeles3{margin-top: 5px;}

article.rendeles2 h4._kozepre{text-align: center;}

article.rendeles2 table{width: 80%; 
    text-align: center; 
    margin: auto;}

article.rendeles2 img.tabla{height: auto; 
    width: 28vw;}

article.rendeles2 td figcaption{
    caption-side: top;}

article.rendeles2 img.bogre{margin-left: 25%; 
    margin-right: 25%; 
    width: 50%;}

/*RESZPONZIVITÁS*/

@media all and (min-width: 600px) {

div.container{flex-direction: row;}

nav ul{flex-direction: row;}

nav ul li{flex-basis: 20%;}

article.fooldal1{flex-basis: 48%;}

article.fooldal2{flex-basis: 48%;}

article.fooldal3{flex-basis: 48%;}

article.fooldal4{flex-basis: 48%;}

article.rendel{flex-basis: 48%;}

article.ugras{flex-basis: 48%;}

article.karrier1{flex-basis: 48%;}

article.karrier2{flex-basis: 48%;}

article.filmek2{flex-basis: 48%;}

article.filmek3{flex-basis: 48%;}

article.filmek4{flex-basis: 48%;}

article.filmek5{flex-basis: 48%;}

article.filmek6{flex-basis: 48%;}

article.filmek7{flex-basis: 48%;}

}

@media all and (min-width: 768px) {

    article.karrier3{flex-basis: 48%;}

    article.karrier4{flex-basis: 48%;}

    article.filmek2{flex-basis: 31.33%;}

    article.filmek3{flex-basis: 31.33%;}
    
    article.filmek4{flex-basis: 31.33%;}
    
    article.filmek5{flex-basis: 31.33%;}
    
    article.filmek6{flex-basis: 31.33%;}
    
    article.filmek7{flex-basis: 31.33%;}

    article.rendeles1{flex-basis: 23%;}

    article.rendeles2{flex-basis: 73%;}

}