@charset "UTF-8";

@media only screen and (orientation:portrait) {
    
* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

.col-1 {width: 7.25%;}
.col-2 {width: 15.5%;}
.col-3 {width: 23.75%;}
.col-4 {width: 32%;}
.col-5 {width: 40.25%;}
.col-6 {width: 48.5%;}
.col-7 {width: 56.75%;}
.col-8 {width: 65%;}
.col-9 {width: 73.25%;}
.col-10 {width: 81.5%;}
.col-11 {width: 89.75%;}
.col-12 {width: 98%;}

[class*="col-"] {
    float: left;
    padding: 15px;
    background-color: rgba(255, 255, 255, 0.2);
    margin-left: 1%;
    margin-top: 1%;
    border-radius: 0.4vw;
}    
    
body {
    background-color: #92b9bc;
    font-family: 'Nunito', sans-serif;
}
    
h1 {
    color: #0e575a;
    text-align: center;
    }

h2 {
    color: #0ca2a8;
    text-align: center;
    font-size: 2vw;
    }

h3 {

    }
    
p {
    color: #0e575a;
    }
    
a {
    text-decoration: none;
    color: #0e575a;
    }
    
a:hover {
    color: #6d1e06;
    transition: 0.5s;
    }

/* MENU */  
    
.header {
    background-color: #0a5558;
    height: 8vw;
    margin-bottom: 2vw;
    }

.menu {
    background-color: #09949a;
    padding: 0.8vw 1vw 0vw 1vw;
    height: 4vw;
    margin-bottom: 4vw;
    }

.menu:hover {
    background-color: #0a5558;
    transition: 0.5s;
    }
    
.menuActive {
    background-color: #0a5558 !important;
    }
    
.menu h2 {
    color: rgba(255, 255, 255, 0.5);
    }
    
    
.menu h3 {
    display: block;
    color: rgba(255, 255, 255, 0.7);
    font-size: 1.2vw;
    float: left;
    padding: 0vw 0.5vw 0.5vw 0.5vw;
    margin: 1vw 0.2vw 0vw 0.2vw;
    border-radius: 0.3vw;
    text-align: center;
    width: 7vw;
    } 
    
.menu h3:hover {
    color: rgba(255, 255, 255, 1);
    transition: 0.5s;
    }     
    
/* INDEX */   
    
.nyitokep {
    background-image: url(../pictures/chestnut-1698730_1920.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    height: 55vw;
    padding-top: 4.5vw;
    }

.nyitokep h1 {
    font-size: 5vw;
    color: #0a5558;
    }

.nyitokep h2 {
    font-size: 2vw;
    color: #000;
    }    
    
/* AJÁNLATKÉRÉS */
    
.content {
    width: 70vw;
    margin: 0vw 14vw 5vw 14vw;
    text-align: center;
    }
    
    
/* BELÉPÉS */
    
.header h1 {
    color: rgba(255, 255, 255, 0.7);
    padding-top: 2vw;
    }
    
.belepes {
    width: 50vw;
    margin: auto;
    }
    
.belepes h2 {
    color: rgba(255, 255, 255, 0.8);
    }
    
input {
    width: 93%;
    height: 3vw;
    border: none;
    margin: 1.5vw;
    padding: 0.75vw;
    color: #0e575a;
    text-align: center;
    background-color: rgba(255, 255, 255, 0.5);
    border-radius: 0.5vw;
    font-size: 1.5vw;
    
    }
    
/*FEKVŐ CSS vége*/    
}