/* ######################## érték nullázás ######################### */

* { padding: 0; margin: 0; border: 0 }


/* ##################### általános beállítások ##################### */

body {
	background-color: #db8056;
}

div#wrapper {
 width: max;
// border: 1px solid yellow;
}

div.fej-tabla {
 background-color: #f2ece1;
 color: brown;
// border: 1px solid white;
 border-radius: 8px 8px 0px 0px;
 box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);

}

div.fej-bal {
 float: left;
// border:  1px solid blue;
}

div.fej-bal-cim {
 float: left;
 font-weight: bold;
// background-color: white;
// border: 1px solid green;
}

span.negy {
 color: #fba;
}

div.fej-bal-idezet {
 float: left;
// background-color: white;
// border: 1px solid navy;
}

div.fej-jobb {
 float: left;
// background-color: white;
// border:  1px solid purple;
}

div.fej-jobb-logo {
 align:center;
 border: 4px solid brown;
 border-radius: 2px;
}

/* ################################ */

div.menu-tabla {
// border: 1px solid cyan;
 border-radius: 0px 0px 8px 8px;
 box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
}


ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
//  background-color: #333;
//  border: 1px solid green;
}

li {
  float: left;
}

li a, .dropbtn {
  display: inline-block;
  color: brown;
  font-weight: bold;
  text-align: center;
//  padding: 14px 16px;
  text-decoration: none;
}

li a:hover, .dropdown:hover .dropbtn {
//  background-color: brown;
  color: #fba;
}

li.dropdown {
  display: inline-block;
}

.dropdown-content {
  display: none;
  position: absolute;
  background-color: #f2ece1;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
  border-radius: 5px;
}

.dropdown-content a {
  color: black;
//  padding: 12px 16px;
  text-decoration: none;
  display: block;
  text-align: left;
}

.dropdown-content a:hover {background-color: #f1f1f1; border-radius: 5px;
}

.dropdown:hover .dropdown-content {
  display: block;
}


/* ################################ */


div.tartalom-tabla {
// width: 90%;
 margin: 10px auto;
 background-color: #f2ece1;
// border: 1px solid brown;
 border-radius: 10px;
 box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);

}

tartalom-hir-link {
 text-decoration: none;
}


div.tartalom-hir-dim {
 float: left;
 background-color: brown;
 border-radius: 6px;
 border: 2px solid brown;
}

div.tartalom-hir-dim:hover {
 opacity: 0.8;
}

img.dim-osz {
 align: cemter;
 width: 100%;
 height: 200px;
}

p.dim-szoveg {
 text-align: right;
 padding: 3px 5px;
 color: cornsilk;
// background-color: brown;
// opacity: 0.5;
 text-decoration: none;
}

div.exit {
 float: left;
 text-decoration: none;

}

/* ################################ */


div.footer {
 width: 230px;
// height: 20px;
 margin: 10px auto;
 padding: 5px;
 border: 2px solid brown;
 border-radius: 12px;
 text-align: center;
 font-size: 20px;
 color: brown;
 background-color: #f2ece1;
 box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
}


/* ################################ */

/* méret ajánlás:
Mobile: from 360×640 to 414×896
Tablet: from 601×962 to 1280×800
Desktop: from 1280×720 to 1920×1080 */





/*                            M O B I L                            */




/* ########################## FEJLÉC MÉRET ########################## */

@media only screen
and (min-width : 241px)
and (max-width : 720px)
{

div.fej-tabla {
 width: 90%;
 max-width: 360px;
 height:175px;
 margin: 10px auto; /* div középre igazítás */
// border: 1px solid green;
// background-color: green;
}

div.fej-bal {
 width: 67%;
 height: 95%;
// border: 1px solid blue;
}

div.fej-bal-cim {
 width: 90%;
 margin-top: 8px;
 margin-left: 5px;
 padding: 5px;
 font-size: 24px;
 text-align: center;
// border: 1px solid blue;

}

span.negy {

}

div.fej-bal-idezet {
 width: 90%;
 margin-top:5px;
 margin-left: 5px;
 padding: 5px;
 text-align: center;
// border: 1px solid blue;

}

div.fej-jobb {
 width: 32%;
 height: 95%;
// border: 1px solid blue;
}

div.fej-jobb-logo {
 width: 86px;
 height: 115px;
 align: center;
 margin: 40px auto;

}

img.logo {
 width: 86px;
 height: 115px;
}


div.menu-tabla {
 width: 90%;
 max-width: 360px;
 height: 40px;
 background-color: #f2ece1;
 color: brown;
 margin: auto;
// border: 1px solid black;
}


ul {
  list-style-type: none;
  margin: 0px;
  padding: 4px;
  overflow: hidden;
//  background-color: #333;
//  border: 1px solid green;
}

li {
  float: left;
}

li a, .dropbtn {
  display: inline-block;
  color: brown;
  font-weight: bold;
  text-align: center;
  font-size: 21px;
  padding: 5px 16px;
  text-decoration: none;
}

li a:hover, .dropdown:hover .dropbtn {
//  background-color: brown;
  color: #fba;
}

li.dropdown {
  display: inline-block;
}

.dropdown-content {
  display: none;
  position: absolute;
  background-color: #f2ece1;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}

.dropdown-content a {
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  text-align: left;
}

.dropdown-content a:hover {background-color: #f1f1f1;}

.dropdown:hover .dropdown-content {
  display: block;
}

/* ########################## TARTALOM MÉRET ########################## */

div.tartalom-tabla {
 width: 88%;
 max-width: 350px;
 height: 480px;
 padding: 5px;
// border: 1px solid black;

}

div.tartalom-hir-dim {
 margin-top: 10px;
 margin-left: 30px;
 width: 280px;
// padding: 5px;
 border: 1px solid black;
}

img.dim-osz {
 align: cemter;
 width: 100%;
 height: 170px;
}

p.dim-szoveg {
 font-family:
 height: 22px;
 font-size: 20px;
 opacity: 0,2;
}

div.exit {
 width: 350px;
// background-color: white;
// border: 1px solid black;
 margin-top: 10px;
// margin-left: 15px;
 text-align: center;
 padding: 4px 0px;
}


/* ########################## LÁB MÉRET ########################## */



}



/*                            T A B L E T                            */





/* ########################## FEJLÉC MÉRET ########################## */

@media only screen
and (min-width : 721px)
and (max-width : 990px)
{

div.fej-tabla {
 width: 85%;
 height: 200px;
 margin: 10px auto;
}

div.fej-bal {
 width: 67%;
 height: 95%;
}

div.fej-bal-cim {
 width: 90%;
 margin-top: 10px;
 margin-left: 5px;
 padding: 10px;
 font-size: 50px;
 text-align: center;
}

span.negy {

}

div.fej-bal-idezet {
 width: 90%;
// margin-top:4px;
 margin-left: 5px;
 padding: 10px;
 text-align: center;
 font-size: 19px;
}

div.fej-jobb {
 width: 32%;
 height: 95%;
}

div.fej-jobb-logo {
 width: 146px;
 height: 168px;
 align: center;
 margin: 12px auto;
}

img.logo {
 width: 146px;
 height: 168px;
}

div.menu-tabla {
 width: 85%;
 height: 40px;
 background-color: #f2ece1;
 color: brown;
 margin: auto;
// border: 1px solid black;
}



ul {
  list-style-type: none;
  margin: 0px;
  padding: 4px;
  overflow: hidden;
//  background-color: #333;
//  border: 1px solid green;
}

li {
  float: left;
}

li a, .dropbtn {
  display: inline-block;
  color: brown;
  font-weight: bold;
  text-align: center;
  font-size: 21px;
  padding: 5px 16px;
  text-decoration: none;
}

li a:hover, .dropdown:hover .dropbtn {
//  background-color: brown;
  color: #fba;
}

li.dropdown {
  display: inline-block;
}

.dropdown-content {
  display: none;
  position: absolute;
  background-color: #f2ece1;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}

.dropdown-content a {
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  text-align: left;
}

.dropdown-content a:hover {background-color: #f1f1f1;}

.dropdown:hover .dropdown-content {
  display: block;
}


/* ########################## TARTALOM MÉRET ########################## */

div.tartalom-tabla {
 width: 85%;
 max-width: 840px;
 height: 320px;
}

div.tartalom-hir-dim {
 margin-top: 10px;
 margin-left: 10px;
 width: 400px;
 max-width: 47%;
// height: 280px;
// padding: 5px;
 border: 1px solid black;
}

p.dim-szoveg {
 font-family:
 height: 22px;
 font-size: 20px;
 opacity: 0,2;
}

div.exit {
 width: 100%;
// background-color: white;
// border: 1px solid black;
 margin-top: 20px;
// margin-left: 200px;
 text-align: center;
 padding: 4px 0px;
}


/* ########################## LÁB MÉRET ########################## */





}




/*                               DESKTOP                            */





@media only screen
and (min-width: 991px)
{

div.fej-tabla {
 width: 900px;
 height:220px;
 margin: 10px auto;
// border: 1px solid white;
}

div.fej-bal {
 width: 70%;
 height: 95%;
}

div.fej-bal-cim {
 width: 90%;
 margin-top: 10px;
 margin-left: 5px;
 padding: 10px;
 font-size: 60px;
 text-align: center;
}

span.negy {

}

div.fej-bal-idezet {
 width: 90%;
// margin-top:4px;
 margin-left: 5px;
 padding: 10px;
 text-align: center;
 font-size: 22px;
}

div.fej-jobb {
 width: 29%;
 height: 95%;
}

div.fej-jobb-logo {
 width: 150px;
 height: 175px;
 align: center;
 margin: 17px auto;
}

img.logo {
 width: 150px;
 height: 175px;
}

div.menu-tabla {
 width: 900px;
 height: 40px;
 background-color: #f2ece1;
 color: brown;
 margin: auto;
// border: 1px solid black;
}



ul {
  list-style-type: none;
  margin: 0px;
  padding: 4px;
  overflow: hidden;
//  background-color: #333;
//  border: 1px solid green;
}

li {
  float: left;
}

li a, .dropbtn {
  display: inline-block;
  color: brown;
  font-weight: bold;
  text-align: center;
  font-size: 21px;
  padding: 5px 16px;
  text-decoration: none;
}

li a:hover, .dropdown:hover .dropbtn {
//  background-color: brown;
  color: #fba;
}

li.dropdown {
  display: inline-block;
}

.dropdown-content {
  display: none;
  position: absolute;
  background-color: #f2ece1;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}

.dropdown-content a {
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  text-align: left;
}

.dropdown-content a:hover {background-color: #f1f1f1;}

.dropdown:hover .dropdown-content {
  display: block;
}

/* ########################## TARTALOM MÉRET ########################## */

div.tartalom-tabla {
 width: 900px;
 height: 330px;
}

div.tartalom-hir-dim {
 margin-top: 30px;
 margin-left: 30px;
 width: 400px;
// max-width: 47%;
// padding: 5px;
 border: 1px solid black;
}

p.dim-szoveg {
 font-family:
 height: 28px;
 font-size: 22px;
}

div.exit {
 width: 100%;
// background-color: white;
// border: 1px solid black;
 margin-top: 20px;
// margin-left: 200px;
 text-align: center;
 padding: 4px 0px;
}


/* ########################## LÁB MÉRET ########################## */



}