@font-face {
    font-family: 'arabia';
    src: url('Arabia.ttf');
}

@font-face {
    font-family: 'awesome';
    src: url('../stilus/alap/Mf Really Awesome.ttf');
}
@font-face {
    font-family: 'redressed';
    src: url('../stilus/alap/Redressed.ttf');
}
@font-face {
    font-family: 'cabbage';
    src: url('../stilus/alap/text_ttf/Cabbage Free.ttf');
}
@font-face {
    font-family: 'comicate';
    src: url('../stilus/alap/text_ttf/COMICATE.ttf');
}
@font-face {
    font-family: 'crialtrial';
    src: url('../stilus/alap/text_ttf/CRIALTRIAL.ttf');
}
@font-face {
    font-family: 'malorena';
    src: url('../stilus/alap/text_ttf/Ma Lorena FREE.ttf');
}
@font-face {
    font-family: 'mshand';
    src: url('../stilus/alap/text_ttf/Ms Hand.ttf');
}
@font-face {
    font-family: 'outwrite';
    src: url('../stilus/alap/text_ttf/Outwrite.ttf');
}
@font-face {
    font-family: 'rosanna';
    src: url('../stilus/alap/text_ttf/Rosanna.ttf');
}
@font-face {
    font-family: 'valuoldcaps';
    src: url('../stilus/alap/text_ttf/valuoldcaps.ttf');
}
@font-face {
    font-family: 'violette';
    src: url('../stilus/alap/text_ttf/Violette.ttf');
}
body {
margin: 0px;
background: url(img/background.jpg);
background-repeat: no-repeat;
background-size: 100% 100%;
background-attachment: fixed;
background-position: center; 
color: #47423D;
font-size: 13px;
font:Arial;
}
/* Mobil eszközökre */
@media (max-width: 768px) {
    body {
        background-attachment: scroll; /* Görgethetővé teszi, jobb teljesítmény */
    }
}
.fejlec {
float: left; 
width: 98%; 
height: 15%; 
min-height: 100px;
background: #000; 
padding: 1%; 
border-bottom: #fff 3px solid; 
font-size: 15px; 
color: #fff;
margin: 0px;
background: url(img/fejlec1_2.jpg);
background-repeat: no-repeat;
background-size: 200% 200%;
//background-attachment: fixed;
background-position: center; 
}
.login_box {
float: left;
width: 40%;
margin-left: 25%;
margin-top: 25%;
border: #fff 1px solid;
border-radius: 25px;
height: 40%;
padding: 5%;
//background: #F0FFFF;
background: url(img/spring.png);
background-repeat: no-repeat;
background-size: 200% 200%;
//background-attachment: fixed;
background-position: center; 
font-size: 17px; 
color: #000;
font-weight: bold;
}
.left-box {
float: left; 
width: 51%; 
//height: %; 
min-height: 300px;
background:  #f5f6fb;
border-radius: 25px;
box-shadow:-10px -10px 10px -10px #382e2c; 
border-image-slice:15 15 15 15 fill;
border-image-width:10px 10px 10px 10px;
border-image-outset:10px 10px 10px 10px;
border-image-repeat:round round;
border-image-source:url("new_border2.png");
color: #000; 
font-size: 13px; 
padding: 1%;
}
.right-box {
float: left; 
width: 23%; 
height: 700px;
background: #ddc386;
color: #000; 
border-radius: 25px;
box-shadow:-10px -10px 10px -10px #382e2c; 
//border: #382e2c 2px solid;

border-image-slice:15 15 15 15 fill;
border-image-width:10px 10px 10px 10px;
border-image-outset:10px 10px 10px 10px;
border-image-repeat:round round;
border-image-source:url("new_border1.png");
}





.chat_style {
position: fixed;
display: block;
right: 0%;
top: 0%;
padding: 0%;
width: 100%;
height: 100%;
overflow: none;
background: rgba(1,3,20,1);
 box-shadow: -10 -10 10 -10 #888888;
border-radius: 2px;
-webkit-animation: fadeInLeft 3s 1 ease-in-out;
-moz-animation: fadeInLeft 3s 1 ease-in-out;
-o-animation: fadeInLeft 3s 1 ease-in-out;
-ms-animation: fadeInLeft 3s 1 ease-in-out;
animation: fadeInLeft 3s 1 ease-in-out;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
}



@-webkit-keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.fadeInLeft {
  -webkit-animation-name: fadeInLeft;
  animation-name: fadeInLeft;
}
@-webkit-keyframes fadeOutRight {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}

@keyframes fadeOutRight {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}

.fadeOutRight {
  -webkit-animation-name: fadeOutRight;
  animation-name: fadeOutRight;
}
.Button {
	box-shadow: 0px 10px 14px -7px #276873;
	background:linear-gradient(to bottom, #599bb3 5%, #408c99 100%);
	background-color:#599bb3;
	border-radius:8px;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:Arial;
	font-size:20px;
	font-weight:bold;
	padding:13px 32px;
	text-decoration:none;
	text-shadow:0px 1px 0px #3d768a;
}
.Button:hover {
	background:linear-gradient(to bottom, #408c99 5%, #599bb3 100%);
	background-color:#408c99;
}
.Button:active {
	position:relative;
	top:1px;
}
.regbutton {
  background-color: #F5E3C8; /* Pergamen szín */
  color: #5B4636; /* Íráshoz illő sötétbarna szín */
  font-family: 'Georgia', serif; /* Régies betűtípus */
  font-style: italic;
  font-size: 18px; /* Betűméret */
  padding: 10px 20px; /* Belül távolság */
  border: 2px solid #D2B48C; /* Szegély színe */
  border-radius: 8px; /* Lekerekített sarkok */
  box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3); /* Árnyék */
  cursor: pointer; /* Mutassa, hogy kattintható */
  transition: transform 0.2s, box-shadow 0.2s; /* Animáció a hoverre */
}

.regbutton:hover {
  background-color: #E8D2B3; /* Halványabb háttér, amikor ráviszed az egeret */
  box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.4); /* Erősebb árnyék hover alatt */
  transform: translateY(-2px); /* Kicsit "megmozdul" hoverre */
}
.oldal_udvozlo {
float: left;
width: 98%;
margin-bottom:15px;
text-align: left;
padding: 4px;
color: #ead8ba;
height: auto;
overflow: none;
//background: rgba(235,175,68,0.5);
background: url(img/title_bg.png);
background-size: 100% 100%;
background-position:center;
box-shadow: 10 -10 10 -10 #000;
border-radius: 5px;
border: #000 1px solid;
font-weight: bold;
}
.mymenu {
	font-weight:bold;
	text-decoration:none;
	font-family:Arial;
	box-shadow:inset #595959 0px 5px 8px -1px,#a6a6a6 0px 4px 6px;
	o-box-shadow:inset #595959 0px 5px 8px -1px,#a6a6a6 0px 4px 6px;
	-moz-box-shadow:inset #595959 0px 5px 8px -1px,#a6a6a6 0px 4px 6px;
	-webkit-box-shadow:inset #595959 0px 5px 8px -1px,#a6a6a6 0px 4px 6px;
	background:#787878;
	background:-o-linear-gradient(90deg, #787878, #454545);
	background:-moz-linear-gradient( center top, #787878 5%, #454545 100% );
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #787878), color-stop(1, #454545) );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#787878', endColorstr='#454545');
	background:-webkit-linear-gradient(#787878, #454545);
	background:-ms-linear-gradient(#787878, #454545);
	background:linear-gradient(#787878, #454545);
	text-indent:0px;
	line-height:0px;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border-radius:3px;
	text-align:center;
	vertical-align:middle;
	display:inline-block;
	font-size:12px;
	color:#f7f7f7;
	width:85%;
	height:0px;
	padding:13px;
	border-color:#2e2e2e;
	border-width:1px;
	border-style:solid;
}

.mymenu:active {
	box-shadow:inset #595959 0px 5px 8px -1px,#a6a6a6 0px 0 6px;
	o-box-shadow:inset #595959 0px 5px 8px -1px,#a6a6a6 0px 0 6px;
	-moz-box-shadow:inset #595959 0px 5px 8px -1px,#a6a6a6 0px 0 6px;
	-webkit-box-shadow:inset #595959 0px 5px 8px -1px,#a6a6a6 0px 0 6px;
	position:relative;
	top:4px
}

.mymenu:hover {
	background:#454545;
	background:-o-linear-gradient(90deg, #454545, #787878);
	background:-moz-linear-gradient( center top, #454545 5%, #787878 100% );
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #454545), color-stop(1, #787878) );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#454545', endColorstr='#787878');
	background:-webkit-linear-gradient(#454545, #787878);
	background:-ms-linear-gradient(#454545, #787878);
	background:linear-gradient(#454545, #787878);
}
.billgomb {
background: #10414E;
border: #c0c0c0 1px solid;
border-radius: 6px;
color: #c0c0c0;
padding-top: 10px;
padding-bottom: 10px;
}
.billgomb:hover {
background: #7D7D7D;
border: #10414E 1px solid;
border-radius: 6px;
color: #10414E;
padding-top: 10px;
padding-bottom: 10px;
}
.top-nick {
position: absolute;
top: 3%;
right: 10%;
width: auto;
height: auto;
background:  #f5f6fb;
border-radius: 25px;
box-shadow:-10px -10px 10px -10px #382e2c; 
border-image-slice:15 15 15 15 fill;
border-image-width:10px 10px 10px 10px;
border-image-outset:10px 10px 10px 10px;
border-image-repeat:round round;
border-image-source:url("border3.png");
color: #000; 
font-size: 13px; 
padding: 1%;
}
.session-info {
position: fixed;
bottom: 0px;
width: 100%;
height: auto;
background:  #a8c2d2;
border-radius: 0px;
border-top: #1eaecb 3px solid;
box-shadow:-10px -10px 10px -10px #382e2c; 
color: #03538f; 
font-size: 13px; 
padding: 0.5%;
box-sizing: border-box;
}
.bgif1 {
    background-image: url(../stilus/alap/gifs/1.gif);
    -webkit-background-clip: text;
    color: transparent;
    background-size: 100% 100%;
}.bgif2 {
    background-image: url(../stilus/alap/gifs/2.gif);
    -webkit-background-clip: text;
    color: transparent;
    background-size: 100% 100%;
}.bgif3 {
    background-image: url(../stilus/alap/gifs/3.gif);
    -webkit-background-clip: text;
    color: transparent;
    background-size: 100% 100%;
}.bgif4 {
    background-image: url(../stilus/alap/gifs/4.gif);
    -webkit-background-clip: text;
    color: transparent;
    background-size: 100% 100%;
}.bgif5 {
    background-image: url(../stilus/alap/gifs/5.gif);
    -webkit-background-clip: text;
    color: transparent;
    background-size: 100% 100%;
}.bgif6 {
    background-image: url(../stilus/alap/gifs/6.gif);
    -webkit-background-clip: text;
    color: transparent;
    background-size: 100% 100%;
}.bgif7 {
    background-image: url(../stilus/alap/gifs/7.gif);
    -webkit-background-clip: text;
    color: transparent;
    background-size: 100% 100%;
}.bgif8 {
    background-image: url(../stilus/alap/gifs/8.gif);
    -webkit-background-clip: text;
    color: transparent;
    background-size: 100% 100%;
}.bgif9 {
    background-image: url(../stilus/alap/gifs/9.gif);
    -webkit-background-clip: text;
    color: transparent;
    background-size: 100% 100%;
}
.text_cabbage {
font-family: cabbage;
}
.text_comicate {
font-family: comicate;
}
.text_crialtrial {
font-family: crialtrial;
}
.text_malorena {
font-family: malorena;
}
.text_mshand {
font-family: mshand;
}
.text_outwrite {
font-family: outwrite;
}
.text_rosanna {
font-family: rosanna;
}
.text_valuoldcaps {
font-family: valuoldcaps;
}
.text_redressed {
font-family: redressed;
}

.form-input {
  position: relative;
  font-family: "Source Sans Pro", sans-serif;
  font-weight: 600;
  width: 100%;
  height: 40px;
  border: none;
  padding: 0 10px;
  box-shadow: none;
  outline: none;
  -webkit-transition: all .5s ease;
     -moz-transition: all .5s ease;
      -ms-transition: all .5s ease;
       -o-transition: all .5s ease;
          transition: all .5s ease;
}
.form-input.round {
  border-radius: 40px;
}
.form-input.glow-shadow {
  border: 0;
  background: #fff;;
}
.form-input.glow-shadow:focus {
  box-shadow: 0 0 0 2px #4285F4;
  background: #fff;
  border-color: #4285F4;
}