@import url('https://fonts.googleapis.com/css?family=Maven+Pro&subset=latin-ext');

@font-face {
	font-family: LieToMeTTFimport;
	src:url("LieToMeTTF.ttf");
}

@font-face {
	font-family: DancingintheMinefieldsimport;
	src:url("DancingintheMinefields.ttf");
}

@font-face {
	font-family: DotDigital7import;
	src:url("DotDigital7.ttf");
}


	html, body {
		height: 100%;
		margin: 0; 
		overflow: hidden; 
				}

	.pirosvonal {
		border: 1px solid red;
				}

	body {
		background-image: url('bg.jpg');
		background-color: #FFFFFF;
		background-repeat: no-repeat; 
		background-position: center; 
		background-size: cover; 
		color: white;
		font-size: 36px; 
		font-family: 'Maven Pro';
		}

 	ol {
        list-style-type: none;
        padding: 0;
        }

	ol li {
        display: inline;
        }
  			
	#headerbox {
        text-align: center;
        position: absolute;
        left: 50%;
        margin-right: -50%;
        transform: translate(-50%, 0);
        font-family: Maven Pro;
        text-transform: uppercase;
        font-size: 14px;
        margin-top: 1px;            
        		}

    	#headerbox a {
    		color: white;
    		margin: 0px 10px;
    		text-decoration: none;
       				}

       	#headerbox a.new {
			color: rgba(128,0,0 ,1);
					}

		#headerbox a.new:hover {
			color: rgba(128,0,0, .6);
					}


    	#headerbox a:hover {
    	  	color: rgb(255, 255, 255, .6);
    	  	transition-duration: 0.5s;
      						}

	#footerbox {
		text-align: center;
		position: absolute;
		left: 50%;
		margin-right: -50%;
		transform: translate(-50%, 0);
		font-family: Maven Pro;
		font-size: 16px;
		margin-bottom: 1px; 
		bottom: 0;           
				}
	
		#footerbox a {
			color: white;
			margin: 0px 20px;
			text-decoration: none;
				}

		#footerbox a:hover {
			color: rgb(203, 203, 203);
			transition-duration: 0.5s;
							}

	
	.gombdoboz a {
		color: white;
		margin: 10px;
		display: inline-block;
				}

	.kepdoboz {
        margin-top: 30px;
        margin-left: auto;
        margin-right: auto;
        display: table;
              	}

     	.kepdoboz a {
		color: grey;
		margin: 10px;
		display: inline-block;
				}         	

	
	.gombdoboz {
        margin-top: 30px;
        margin-left: auto;
        margin-right: auto;
        display: table;
              	}

	.idezet {
		margin-top: 30px;
		text-decoration: none;
		font-family: Maven Pro;
		font-size: 18px;
		display: inline-block;
			}

	h1 {
		font-size: 18px; 
		font-weight: bold; 
		text-align: center; 
		}

	h2 {
		font-size: 16px; 
		font-weight: normal;
		text-align: left; 
		}

	h3 {
		font-size: 12px; 
		font-weight: normal;
		text-align: center; 
		}

	h4 {
		font-size: 16px;
		font-weight: bold;
		text-align: left;
		color: red;
		}

	.td-right { text-align: right; }

	.td-left { text-align: left; }

	.td-center	{ text-align: center; }

	.td-top	{ vertical-align: top; }

	.td-middle	{ vertical-align: middle; }

	.td-bottom	{ vertical-align: bottom; }

	.center-align	{ text-align: center; }

	.center-div	{ margin-left: auto; margin-right: auto; }

	.right-div	{ margin-left: auto; margin-right: 0; }

	.left-div	{ margin-left: 0; margin-right: auto; }

	.vkozepre {
		position: absolute; 
		left: 50%;					
		transform: translate(-50%, 0);
		margin-right: -50%; 
				}

	.vfkozepre {
		position: absolute; 
		top: 50%;
		left: 50%;								
		transform: translate(-50%, -50%);
		margin-right: -50%; 
		text-align:center;
				}

	.tavolabb { 
		clear:both; 
		margin-left: 10px; 
				}

	.tavolabb-indexben { 
		clear:both; 
		margin-left: 3px; 
						}


	.nagyvideo {
		width: auto; 
		height: auto; 
		min-width: 100%;
		min-height: 100%; 
				}

	.fejlec {
		margin-left: 10px;
		font-family: Maven Pro;
		font-size: 16px; 
		text-align: center; 
			}
			
	.fejgomb {
		font-size: 16px;
		font-family: Maven Pro; 
		background-color: transparent; 
		padding: 10px 20px;
		width: 120px; 
		display: inline-block;
			}

	.fejgomb-konyvek-index {
		font-size: 16px;
		font-family: Maven Pro; 
		background-color: transparent; 
		padding: 10px 20px;
		width: 140px; 
		display: inline-block;
							}
	
	a {
		color: grey; 
		text-decoration: none; 
		}

	

	.gomb {
		font-size: 16px;
		font-family: Arial; 
		background-color: rgba(0, 0, 0, .5); 
		padding: 10px 20px;
		width: 130px; 
		display: inline-block;
		}

	.gomb-index {
		font-size: 16px;
		font-family: Arial; 
		background-color: rgba(0, 0, 0, .3); 
		padding: 10px 20px;
		width: 130px; 
		display: inline-block;
				}

	.gomb-index-pl {
		font-size: 16px;
		font-family: Arial; 
		text-shadow: 1px 1px black;
		background-image:linear-gradient(rgba(243, 241, 239, .7),rgba(243, 241, 239, .9), rgba(207,0,15,.6), rgba(207,0,15,1));
		padding: 10px 20px;
		width: 130px; 
		display: inline-block;
				}

	.gomb-index-en {
		font-size: 16px;
		font-family: Arial; 
		text-shadow: 1px 1px black;
		background-image:linear-gradient(rgba(0, 36, 125, .9),rgba(243,241,239,1), rgba(207,0,15,1));
		padding: 10px 20px; 
		width: 130px; 
		display: inline-block;
				}

	.gomb-index-unionjack {
		font-size: 16px;
		font-family: Arial; 
		text-shadow: 1px 1px black;
		background:linear-gradient(90deg, hsl(353,82.3789%,44.5098%), hsl(353,82.3789%,44.5098%)) 0 50%,
           linear-gradient(0deg, hsl(353,82.3789%,44.5098%), hsl(353,82.3789%,44.5098%)) 50% 0,
           linear-gradient(90deg, hsl(0,0%,100%), hsl(0,0%,100%)) 0 50%,
           linear-gradient(0deg, hsl(0,0%,100%), hsl(0,0%,100%)) 50% 0,
           linear-gradient(55deg, hsla(0,0%,0%,0) 45%, hsl(0,0%,100%) 45%, hsl(0,0%,100%) 48%, hsl(353,82.3789%,44.5098%) 48%, hsl(353,82.3789%,44.5098%) 51%, hsl(0,0%,100%) 51%, hsl(0,0%,100%) 56%, hsla(0,0%,0%,0) 56%, hsla(0,0%,0%,0) 100%) 0 100%,
           linear-gradient(-55deg, hsla(0,0%,0%,0) 45%, hsl(0,0%,100%) 45%, hsl(0,0%,100%) 50%, hsl(353,82.3789%,44.5098%) 50%, hsl(353,82.3789%,44.5098%) 53%, hsl(0,0%,100%) 53%, hsl(0,0%,100%) 56%, hsla(0,0%,0%,0) 56%, hsla(0,0%,0%,0) 100%) 100% 0;
		background-size:100% 20%, 16% 100%, 100% 33%, 25% 100%, 100% 100%, 100% 100%;
		background-repeat:no-repeat;
	background-color: rgb(0,36,125, .5);
			padding: 10px 20px; 
			width: 130px; 
			display: inline-block;
				}

background:linear-gradient(90deg, hsl(353,82.3789%,44.5098%), hsl(353,82.3789%,44.5098%)) 0 50%,
           linear-gradient(0deg, hsl(353,82.3789%,44.5098%), hsl(353,82.3789%,44.5098%)) 50% 0,
           linear-gradient(90deg, hsl(0,0%,100%), hsl(0,0%,100%)) 0 50%,
           linear-gradient(0deg, hsl(0,0%,100%), hsl(0,0%,100%)) 50% 0,
           linear-gradient(55deg, hsla(0,0%,0%,0) 45%, hsl(0,0%,100%) 45%, hsl(0,0%,100%) 48%, hsl(353,82.3789%,44.5098%) 48%, hsl(353,82.3789%,44.5098%) 51%, hsl(0,0%,100%) 51%, hsl(0,0%,100%) 56%, hsla(0,0%,0%,0) 56%, hsla(0,0%,0%,0) 100%) 0 100%,
           linear-gradient(-55deg, hsla(0,0%,0%,0) 45%, hsl(0,0%,100%) 45%, hsl(0,0%,100%) 50%, hsl(353,82.3789%,44.5098%) 50%, hsl(353,82.3789%,44.5098%) 53%, hsl(0,0%,100%) 53%, hsl(0,0%,100%) 56%, hsla(0,0%,0%,0) 56%, hsla(0,0%,0%,0) 100%) 100% 0;
background-size:100% 20%, 16% 100%, 100% 33%, 25% 100%, 100% 100%, 100% 100%;
background-repeat:no-repeat;
background-color: rgb(0,36,125);

	.a-gomb {
		color: white;
		background-color: rgba(0, 0, 0, .5);
			}
			
	.a2-gomb {
		color: white;
			}
			
	.szovegkeret {
		font-size: 14px;
		font-family: Maven Pro;
		background-color: rgba(255, 0, 0, .5);
				}


	.oldalkeret {
		position: absolute;
		font-size: 16px;
		text-align: justify; 
		color: grey;
		font-family: Maven Pro; 
		background-color: rgba(255, 255, 255, .8);
		overflow: auto; 
		width: 60%;
		height: 70%;
		padding: 40px; 
				}
			

	.belso{
		width: 50%;
		height: 50%;
		top:50%;
		margin: 0 auto;
		position: relative;
		text-align:center; 
			}
			

	.belso-konyvek {
		width: 50%;
		height: 50%;
		top:50%;
		margin: 0 auto;
		position: relative;
				}

	.clearfix {
		overflow:auto;
			}

	.imgkonyv {
		float: right;
		padding: 0px 0px 15px 25px;
				}
			
	.img2 {
		float: right;
		padding: 0px 0px 3px 25px;
			}
			
	.imgcv {
		float: right;
		border: 1px solid #ccc; 
		padding: 6px 6px 6px 6px; 
		background:#ddd;				
		border-radius: 4px;
		margin: 0px 0px 0px 10px;
			}
			
	.imgcv2 {
		float: left;
		border: 1px solid #ccc; 
		padding: 6px 6px 6px 6px; 
		background:#ddd;				
		border-radius: 4px;
		margin: 0px 0px 0px 10px;
			}

	.imgown {
		border: 1px solid #ccc; 
		padding: 6px 6px 6px 6px; 
		background:#ddd;				
		border-radius: 4px;
		margin: 0px 0px 0px 10px;
			}
	
	p.templom {
		font-family:DotDigital7import;
		font-weight: normal;
		font-style: normal;
		text-align: center;
		font-size: 25px;
		color: rgba(255,0,0, 1);
	}
	
			
	}

	p.testshop {
		font-family: DancingintheMinefieldsimport;
		font-weight: normal;
		font-style: normal;
		text-align: center;
		font-size: 22px;
		
	}

	p.szomjasszuz {
		font-family:LieToMeTTFimport;
		font-weight: normal;
		font-style: normal;
		color: rgba(120, 25, 02, .8);
	}

	p.szomjasszuz-felirat {
		font-family:LieToMeTTFimport;
		font-weight: normal;
		font-style: normal;
		font-size: 50px;
		color: rgba(139,0,139 ,1);
		text-align: center;
	}


	audio { width: 98%; display: block; margin:10px; }			

	 @media (max-width: 767px) {
           

    .nagyvideo {
        display: none;
               	}

	.gomb {
		background-color: blue;
			}


			table {
    font-family: Maven Pro, sans-serif;
    border-collapse: collapse;
    width: 100%;
}

th {
    border: 1px solid #dddddd;
    text-align: center;
    padding: 8px;
}

td {
    border: 1px solid #dddddd;
    text-align: left;
    padding: 8px;
}

.time {
	text-align: right;
}

tr:nth-child(even) {
    background-color: rgba(0, 0, 0, .5);
}

			}

hr {
  color: rgba(128, 128, 128, .5);
}