/* ==== EGYSZERŰ CSS RESET ERIC MEYER féle ==== */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}

ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/* =========================================== A SIMPLE CSS RESET VÉGE ==== */

/* ==== ALAP STÍLUSOK ====  ELRENDEZÉS STÍLUSAI  */

* {
	box-sizing: border-box;
}

body {
  font-family: 'Open Sans', Arial, sans-serif;
  font-size: 1.125rem;
  line-height: 2rem;
  color: #333;
  background-color: rgba(64%,64%, 64%, .6);
  /*kikapcsolom az alsó gördítő sávot*/ 
  overflow: auto;
  overflow-x: hidden;
  overflow-y: auto;
  }

h1, 
h2 {
  font-family: 'Open Sans', Arial, sans-serif;
}

h1{
   font-size: 1.8rem;
   color: #244bae;  /*ERFA útmutató kék*/ 
  
}

h2{
   font-size: 1.6rem;
   color: #183ca3;  /*ERFA útmutató SÖTÉTkék*/ 
}

  
a {
	color: #e5127d;
	text-decoration: none;
}

a:hover {
	color: #b60e63;
}

/**minen elem alsó margóját 1rem-re állítjuk/*/

h1,h2,h3,h4,h5,h6,hgroup,
ul,ol,dd,
p,figure,
pre,table,fieldset,hr,img
 .primary-content {
    margin-bottom: 1rem;
}

                                        /* ======================================FEJLÉC TULAJDONSÁGAI========================7 */
    
header {
	text-align: center;	
	color: #fff;
  position: fixed;
  width: 100%; 
	background-color: #ffffff; /* #42444e */
  border-bottom: 2px solid #28479d;
  z-index: 1;
}
 /* ======================================FEJLÉC TULAJDONSÁGAI VÉGR========================7 */


/* =========================== MENU KINÉZETE =====================================*/

nav {
  position: fixed;
  top: 161px;
  left: 0;
  width: 100%;
  margin:0;
  border:0;
  z-index: 2;
}

nav ul { 
          background-color: rgba(36,75,174,.9);
          text-align:center;
          margin:0;
          border:0;
          padding-bottom: 1rem;
          padding-top: 0.7rem;
       }

nav li {
  font-family: 'Open Sans', Arial, sans-serif;
  font-size: 1.4rem;
  line-height: 3rem;
  height: 3rem;
   /*VIZUÁLIS ELVÁLSZTÓ */
  border-bottom: 1px solid #ccc; 
  /*display:  inline-block;*/
  border-bottom: none;
}

nav a {
  text-decoration: none; /*Nincs aláhúzás*/
  color: #fff;
  text-decoration: none;
  font-family: 'Open Sans', Arial, sans-serif;
  text-align: center;
  display: block;
  padding: .1rem 2rem;
  color: #fff;
  /*Ennek köszönhetően az anchor elemek 
    kitöltik az li tageket. Ez megnöveli 
    a kattintható terület méretét a teljes 
    szélességre és magasságra, így könnyebb 
    ráklikkelni a navigációs linkekre.*/
  display: block;
  transition: background-color .4s ease-in-out;

}

nav a:hover {
  color: hsl(0, 0%, 77%);
  transition: color .15s ease-in-out;
}

nav li .aktivmenu {
  border: 1px solid hsla(0,0%,100%,.9);
  border-radius: 9999px;
  transition: background-color .15s ease-in-out;
   background-color: rgba(36,75,174,.9);
}
 
/* ======================MENU KINÉZETE VÉGE ===================================*/


/*======================LÁBLÉC KINÉZETE  =================================== */
footer {
  text-align: center;	
	color: #fff;
  position: fixed;
  top: calc(100vh - 34px);
  /*top:500px;*/
  width: 100%; 
	background-color: #404040; /* #42444e */
  border-top: 2px solid #28479d; 
}

/*======================LÁBLÉC KINÉZETE VÉGE =================================== */

.kozepre {
         text-align: center;
         }
         
.framebeall{
          width:400px;
          height:300px;
}         


/* Primary Content Wrapper Styles */

.cikk_tarolo {
  background-color: rgba(100%, 100%,100%, 1);
  padding-top:150px;
}



/* CIKKEK STÍLUSAI*/

.post {
	  /*background-color: rgba(255, 0, 0, .3);*/
    width: 95%;
    margin: 0 auto 1rem; /*fent bal-jobb alsó*/
    padding: 0.3125rem;
    text-align: justify; 
}

.post1 {
	  /*background-color: rgba(255, 0, 0, .3);*/
    width: 95%;
    margin: 0 auto 1rem; /*fent bal-jobb alsó*/
    padding-top: 135px;
    text-align: justify; 
}

figure {
	height: 0;    /* Internet Explorer 5 és 6 miatt van szükség.*/
	padding-bottom: 56.25%; /* 16:9 aspect ratio  
                            A figure konténer magassága így mindig a 
                            szélességének 56.25%-a lesz.  */
	position: relative;   /* biztosítja, hogy az iframe-et a figure 
                             elemhez képest tudjuk pozicionálni.*/
  z-index: 4;
}

 
figure iframe {
	position: absolute;   
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
  /* Az iframe abszolút módon pozícionált, szélessége és magassága is 100%, 
  így mindig kitölti   a rendelkezésére álló konténert, 
  ez biztosítja a reszponzivitást.*/
}



.picture {
	width: 100%;
}

/* ==== CGOMBOK BEÁLLÍTÁSA ==== */

.button {
	display: inline-block; 
  border: 1px solid rgba(36,75,174,.9); /*keret a szövegnek és színe*/
	color: rgba(36,75,174,.9); /*szöveg szine*/
	border-radius: 10px; /* kerekites*/
	padding-right: 5px; /*térközök*/
	padding-left: 5px;
	margin: 5px; /* margók*/
	/*width: 100%; *//*teljes szélesség*/
	font-family: 'Open Sans', sans-serif;
  transition: background-color .45s ease-in-out;
  
}

.button:hover {
	/*border: 1px solid #b60e63;*/
  border: 1px solid rgba(ff,ff,ff4,.9); /*keret a szövegnek és színe*/
	color: rgba(255,255,255,1); /*szöveg szine*/
  background-color: rgba(36,75,174,.9); 
  transition: background-color .45s ease-in-out;
}


/*HA KÉSŐBB KELL MAJD*/
.load {
	display: block;
	text-align: center; /*középre igazítás*/
	padding: 0.625rem;
	font-size: 1.25rem;
	color: #8c8e9b;
}



@media (min-width: 768px) { /* minimum 768 vagy több*/

	.cikk_tarolo {
		/*float: right;*/
		width: 66.6%;
		margin: 0 auto; 
		max-width: 1000px; /*ennél tovább nem nyúlik*/
		border-left: 2px solid #28479d;
		border-right: 2px solid #28479d;
	}
  
  nav li {
    display:  inline-block;

}

}

/*   mielőtt 2 soros lenne a menü kisebb betűkre váltok :)*/
@media (max-width: 950px) {
 nav li {
 
  font-size: 1.0rem;
 }
}

/*Ha kicsi képernyőről (mobil, tablet) nézzük a fejlécet,láblécet kidobjuk ne jelenjen meg     */
/*MENÜT függőlegesre cserélem, a térképet kisebbre összenyomom,hogy ne mozogjon vízszintesen az oldal*/
@media (max-width: 768px) {
 
 
 header {
	display: none;
  }

  footer {
  display: none; 
 }
 nav {
  position: absolute;
  top:  0px;
  left: 0;
  width: 100%;
  margin:0;
  border:0;
 }
 .framebeall{
          width:300px;
          height:225px;
 } 
 

.post1 {
    padding-top: 170px;
}
  

 
 .post p{
    font-size: .725rem;
     line-height: 1.2rem;  
        }
 .post1 p{
    font-size: .725rem;
     line-height: 1.2rem;
    
        }
 
 
 
}

/* MOBIL JÁTÉK VÉGE*/



/* SEGÉDSZINEKET tervezéshez*/

/*
.cikk_tarolo {
	background-color: #42444e;
}
*/

/*
.primary-content {
	background-color: rgba(140, 96, 255, .3);
}
*/
/*
.post {
	background-color: rgba(255, 0, 0, .3);
      
}

.main-header {
	background-color: #42444e;
}
*/