body{background-color: rgb(127,127,127);}
*{font-family: 'Patrick Hand', cursive; font-size: 24px;}
button{padding: 5px 20px 5px 20px; font-size: 24px;}
.foglal{width: 14.45%; text-align: center; font-size: 34px; font-weight: bold; color: white; background-color: rgb(231,80,33); height: 150px; background-image: url("../img/logo.png"); background-repeat: no-repeat, no-repeat; background-position: center; background-size: 80px;}
.foglal2{width: 14.45%; text-align: center; font-size: 34px; font-weight: bold; color: white; background-color: rgb(43,141,203); height: 150px; background-image: url("../img/logokek.png"); background-repeat: no-repeat, no-repeat; background-position: center; background-size: 80px;}
.fogl{text-align: center; font-size: 18px; width: 100%;}
#tartalom{position: relative; z-index: 1; margin: auto; background-color: rgb(20,22,21); max-width: 1000px; padding: 5px; color: white; box-shadow: 0px 0px 12px 3px rgba(0,0,0,0.75); -webkit-box-shadow: 0px 0px 12px 3px rgba(0,0,0,0.75); -moz-box-shadow: 0px 0px 12px 3px rgba(0,0,0,0.75);}
#lablec{position: sticky; bottom: 0px; z-index: 2; font-size: 1.2em; margin: auto; background-color: rgb(231,80,33); max-width: 1000px; padding: 10px 3px 3px 10px; color: black;
box-shadow: 0px 0px 12px 3px rgba(0,0,0,0.75);
-webkit-box-shadow: 0px 0px 12px 3px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 0px 12px 3px rgba(0,0,0,0.75);}
#lablec p{text-align: justify; margin: 0px; padding: 0px; font-size: 1.2em;}
.flip-card table{width: 100%; font-size: 34px; font-weight: bold; text-align: center; color: white;}
p{text-align: justify; margin: 10px; font-size: 1.2em;}
.flip-card p{text-align: left; margin: 10px; font-size: 24px;}
.flip-card{float: left; margin: 8px; background-color: transparent; width: 150px; height: 220px; perspective: 1000px; cursor: pointer;}

.Xflip-card-inner{position: relative; width: 100%; height: 100%; text-align: center; transition: transform 0.8s; transform-style: preserve-3d; box-shadow: 0 4px 8px 0 rgba(0,0,0,0.5);}
.flip-card-inner{position: relative; width: 100%; height: 100%; text-align: center; transition: transform 0.3s; transform-style: preserve-3d; box-shadow: 0 4px 8px 0 rgba(0,0,0,0.5);}

.Xflip-card:hover .flip-card-inner{-ms-transform: rotateY(180deg); -webkit-transform: rotateY(180deg); -moz-transform: rotateY(180deg); -o-transform: rotateY(180deg); transform: rotateY(180deg);}
.flip-card:hover .flip-card-inner{transform: scale(1.1);}

.flip-card-front, .Xflip-card-back{position: absolute; width: 100%; height: 100%; -webkit-backface-visibility: hidden; -webkit-backface-visibility: hidden; -ms-backface-visibility: hidden; backface-visibility: hidden; -moz-backface-visibility: hidden;}
.flip-card-front{border-radius: 3px; background-color: rgb(231,80,33); background-image: url("../img/logo.png"); background-repeat: no-repeat, no-repeat; background-position: center; background-size: 100px;}
.Xflip-card-back{border-radius: 3px; background-color: rgb(231,80,33); background-image: url("../img/logo2.png"); background-repeat: no-repeat, no-repeat; background-position: center; background-size: 100px; -ms-transform: rotateY(180deg); -webkit-transform: rotateY(180deg); -moz-transform: rotateY(180deg); -o-transform: rotateY(180deg); transform: rotateY(180deg);}
a:link{text-decoration: none; color: white;}
a:visited{text-decoration: none; color: white;}
a:hover{text-decoration: none; color: white;}
a:active{text-decoration: none; color: white;}