
/*Termékeink*/
.divTermeklista 
{
    margin-top: 25px;
}

.divTermeklista .divListaElem 
{
    margin-bottom: 30px;
}
.divTermeklista .divListaElem a
{
    height: 210px;
    background-position: center center ;
    background-size: cover;
}

.divTermeklista .divListaElem p
{
    text-transform: uppercase;
    padding: 5px 0px;
}


@media screen and (max-width: 640px)
{
    .divTermeklista 
    {
        margin-top: 2.125vw;
    }
        

    .divTermeklista .divListaElem 
    {
        width: 42.97vw;
        margin: 0px;
        margin: 0px 0px 5.47vw 0px;
    }
    
    .divTermeklista .divListaElem:nth-child(odd)
    {
        margin-right: 3vw;
    }
    
    
    .divTermeklista .divListaElem a
    {
        height: 42.97vw;
        
    }
    
    .divTermeklista .divListaElem p
    {
        padding: 5px 0px;
    }

}



#divTermekeinkNyito h1
{
    font-size: 70px;
    position: relative;
    margin: 35px 45px 20px;
    padding: 0px;
    top: 0px;
    left: 0px;
    line-height: 70px;
}

#divTermekeinkNyito h2
{
    margin-top: 0px;
    font-size: 40px;
    line-height: 45px;
}

#divTermekeinkNyito img
{
    margin-top: 0px;
}



#divTermekeinkBlokk1
{
    background-color: rgb(167,174,115); 
}

#divTermekeinkBlokk1 img
{
    /* margin: 70px 45px 0px; */
    margin: 20px 35px 0px; 
}

#divTermekeinkBlokk1 .divBlokkR
{
    background-image: url('../images/termekblokk_vegan.jpg');
}

#divTermekeinkBlokk1 h1
{
    margin-top: 0px;
}
    


#divTermekeinkBlokk2
{
    background-color: rgb(172,155,147);
}

#divTermekeinkBlokk2 img
{
    margin: 35px 45px 0px 45px; 
}


#divTermekeinkBlokk2 .divBlokkL
{
    background-image: url('../images/termekblokk_excelsior.jpg');
}




#divTermekeinkBlokk3
{
    background-color: rgb(169,188,204);    
}

#divTermekeinkBlokk3 h1
{
    margin-left: 0px;  
}

#divTermekeinkBlokk3 img
{
    margin: 35px 10px 0px 45px; 
}

#divTermekeinkBlokk3 .divBlokkR
{
    background-image: url('../images/termekblokk_mestersonka.jpg');
}



#divTermekeinkBlokk3  span
{
    font-family: RobotoThin;
    font-weight: 100;
}



#divTermekeinkBlokk4
{    
    background-color: rgb(172,164,179);
}

#divTermekeinkBlokk4 h1
{
    margin-top: 165px;
}

#divTermekeinkBlokk4 .divBlokkL
{
    background-image: url('../images/termekblokk_egyeb.jpg');
}



#divTermekeinkBlokk7
{
    background-color: #f2a569 ;    
}

#divTermekeinkBlokk7 h1
{
    margin-top: 165px;
}



#divTermekeinkBlokk7 h3
{
    margin-right: 40%;   
}

#divTermekeinkBlokk7 .divBlokkL
{
    background-image: url('../images/blokk7.jpg');
    background-position: center;
}



#divTermekeinkBlokk8
{
    background-color: #f2a569 ;    
}

#divTermekeinkBlokk8 h1
{
    margin-top: 165px;
}

#divTermekeinkBlokk8 h3
{
    margin-right: 40%;   
}

#divTermekeinkBlokk8 .divBlokkR
{
    background-image: url('../images/blokk8.jpg');
    background-position: center;
}



#divTermekeinkBlokk3  span
{
    font-family: RobotoThin;
    font-weight: 100;
}


@media screen and (max-width: 640px)
{
    
    #divTermekeinkNyito h1
    {
        font-size: 10.94vw;
        line-height: 10.94vw;
     
        position: relative;
        
        left: 0px;
        top: 0px;
        right: auto;
        bottom: auto;
        
        margin-left: 5vw;
        margin-top: 3.13vw;
        margin-bottom: 0px;
    }
    
    #divTermekeinkNyito h2
    {
       font-size: 6.25vw;
        line-height: 6.25vw;
        
        margin-top: 2vw;
        margin-left: 5vw;
        margin-bottom: 2vw;
        margin-right: auto;
    }
    
    #divTermekeinkNyito h3
    {
        font-size: 4.69vw;
        margin-top: auto;
        margin-left: 5vw;
        margin-right: 5vw;
        font-family: RobotoLight;
        font-weight: 100;
    }
    
    #divTermekeinkNyito img
    {
        position: absolute;
        margin: 0px;
  
        top: auto;
        left: 5vw;
        right: auto;
        bottom: 5.13vw;
        height: 23.1vw;
    
    }
    
    
    #divTermekeinkBlokk1 .divBlokkL
    {
        top: 68.75vw;
    }
    #divTermekeinkBlokk2 .divBlokkR
    {
        top: 68.75vw;
    }
    #divTermekeinkBlokk3 .divBlokkL
    {
        top: 68.75vw;
    }
    #divTermekeinkBlokk4 .divBlokkR
    {
        top: 68.75vw;
    }
    #divTermekeinkBlokk7 .divBlokkR
    {
        top: 68.75vw;
    }
}





/*Termék*/


.divTermek 
{
    
}

.divTermek hr
{
    height: 2px;
    background-color: rgb(204,51,51);
    border: solid 0px rgb(204,51,51);
    border-style: none;   
}

.divTermek .spanTermekNev
{
    font-family: RobotoBold;
    font-size: 30px;
    color: rgb(0,0,0);
    margin-bottom: 28px;
    display: block;
}


.divTermek .divKep
{
    width: 370px;
    max-width: 370px;
    min-height: 270px;
    overflow: hidden;
    margin-bottom: 10px;
    background-color: rgb(230,222,222);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}

.divTermek .divKepKicsi
{
    display: inline-block;
    width: 120px;
    height: 90px;
    margin-right: 5px;
    margin-bottom: 20px;
    background-color: rgb(230,222,222);
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    cursor: pointer;
}

.divTermek .divKepKicsiUres
{
    display: inline-block;
    width: 120px;
    height: 90px;
    margin-right: 5px;
    margin-bottom: 20px;
    background-color: rgb(230,222,222);
}

.divTermek .divKepKicsi:hover div
{
    height: 100%;
    background-color: rgba(204,51,51,0.5);
    background-image: url('../images/icnagyito_bg.png');
    background-repeat: no-repeat;
    background-position: center;
}

.divTermek .divLeiras
{
    display: inline-block;
    width: 300px;
    padding-top: 25px;
    float: right;
}

.divTermek label
{
    display: inline-block;
    width: 215px;
}

.divTermek div.divAdatsor
{
    border-bottom: solid 1px rgb(230,222,222);
    padding: 5px 0px;
}

.divTermek .divAdatsor div
{
    display: inline-block;
    width: 485px;
    vertical-align: top;
}

.divTermek a.aVissza
{
    margin-top: 90px
}


@media screen and (max-width: 640px)
{
    #divAloldal h1
    {
        font-family: RobotoLight;
        font-size: 7.8125vw;
        font-weight: 100;
        line-height: 1.20em;
        margin-bottom: 0vw;
    }
    
    .divTermek 
    {
        position: relative;
        display: flex;
        flex-direction: column;
    }
    
    .divTermek hr
    {
        height: 0.625vw;
        order: 1;
        margin-left: 0px;
        margin-right: 0px;
    }
    
    .divTermek .spanTermekNev
    {
        font-size: 5.625vw;
        margin-bottom: 2.66vw;
        order: 2;
    }
    
    
    .divKepek
    {
        white-space: nowrap;
        order: 3;
    }
        
    
    .divTermek .divKep
    {
        position: relative;
        top: 0vw;
        left: -5vw;
        width: 100vw;
        height: 72.97vw;
        margin-bottom: 1.5625vw;
    }
    
    .divTermek .divKepKicsi
    {
        width: 28.90vw;
        height: 17.97vw;
        margin-right: 1.7vw;
        margin-bottom: 3.125vw;
    }
    
    .divTermek .divKepKicsiUres
    {
        width: 28.90vw;
        height: 17.97vw;
        margin-right: 1.7vw;
        margin-bottom: 3.125vw;
    }
    
    .divTermek .divKepKicsi:hover div
    {
    }
    
    .divTermek .divLeiras
    {        
        display: block;
        width: 100%;
        padding-top: 0px;
        margin-top: 5.47vw;
        float: none;
        order: 4;
    }
    
    .divTermek label
    {
        display: block;
        width: 100%;
    }
    
    .divTermek div.divAdatok
    {
        order: 5;
        margin-top: 5.47vw;
    }
    
    .divTermek div.divAdatsor
    {
        border-bottom: solid 1px rgb(230,222,222);
        padding: 5px 0px;
    }
    
    .divTermek .divAdatsor div
    {
        display: block;
        width: 100%;
        vertical-align: top;
    }


    .divTermek a.aVissza
    {
        background-color: rgb( 204, 51, 51);
        color: rgb( 255, 255, 255);
        border-width: 0px;
        text-transform: lowercase;
        width: 50%;
        text-align: center;
        padding: 3.9vw 0px ;
        margin-top: 7.81vw;
    }
    
}

