@font-face {
    font-family: 'moments';
    src: url('fonts/moments.woff2') format('woff2'), url('fonts/moments.woff') format('woff'), url('fonts/moments.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
}

@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto+Condensed:wght@700&display=swap');
body {
    color: #00a1e4;
    font-family: 'Roboto', sans-serif;
    font-size: 16px;
	background: url(images/hatter1.webp);
	background-position: center;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-size: cover;
}
.sticky-top { top: 80px; }
.tooltip {z-index: 9000000;}
.tooltip-inner      {max-width: 350px;	font-size: 11px;	z-index: 9000000;}
a {color: #ffffff;}
.form-control::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: #CCCCCC!important;
  opacity: 1; /* Firefox */
}

/* MEMORIA JATEK START */
.mem_cont         {max-width: 100%; width: 520px; aspect-ratio: 1 / 1; margin-left: auto; margin-right: auto; color: #00a1e4;}
.mem_cont2         {max-width: 100%; width: 520px;  margin-left: auto; margin-right: auto; color: #00a1e4;}
.scene         {  display: inline-block;  width: 24%;  height: auto;  perspective: 600px;aspect-ratio: 1 / 1;}
.kartya        {  position: relative;  width: 100%;  height: 100%;  cursor: pointer;  transform-style: preserve-3d;  transform-origin: center right;  transition: transform 0.5s;}
.kartya.is-flipped     {  transform: translateX(-100%) rotateY(-180deg);}
.kartya_lap            {  position: absolute;  width: 100%;  height: 100%;  color: white;  text-align: center;  font-weight: bold;  font-size: 40px;  backface-visibility: hidden;}
.kartya_lap--front     {  }
.kartya_lap--back      {   transform: rotateY(180deg);}
#pont             {font-weight: 700;}
.csik_kulso         {border: solid 2px #00a1e4; padding: 2px; background: #FFFFFF; border-radius: 10px; height: 28px;}
.csik_belso         {border: solid 2px #00a1e4; padding: 2px; background: #00a1e4; border-radius: 10px; height: 20px; width: 5%;}
/* MEMORIA JATEK END */



hr                 {border-bottom: solid 1px #FFFFFF;}
.cont0             { background: url("images/BG.webp"); color: #000000!important;text-align: center;z-index: 3;}
.cont1             {background:rgba(241,158,167,0.5); color: #FFFFFF!important;z-index: 3;}
.cont2             {background:#b11e23; color: #ffffff!important;z-index: 3; }
.cont3             {background:#b11e23; color: #ffffff!important; z-index: 3; position: relative;}
.cont4               {background: #e61d2b; color: #FFFFFF!important; z-index: 3;}
.ablak             {background: rgba(0,0,0,0.9); border-radius: 15px; padding: 30px;}
.hatter1            {background: #016343;}
.hatter2            {background: #fecc00;}
.hatter3            {background: #1a3c90;}
.hatter4            {background: url("images/hatter1.webp"); background-color: #000000; background-size: cover; background-position: center center; background-repeat: no-repeat;}
.hatter5            { color: #FFFFFF;  background: #016343;}
.hatter6            {background: url("images/main5_bg.jpg"); background-color: #000000; background-size: cover; background-position: center; background-repeat: no-repeat;}
.hatter7            {background: #000000;}
.btn-sarga          {background: #FFFFFF; color: #00a1e4; padding: 10px; font-weight: 700; padding-left: 30px; padding-right: 30px; border-radius: 50px; border: none; margin-top: 30px; margin-bottom: 30px; text-transform: uppercase;}
.btn-piros          {background: #00a1e4; color: #FFFFFF; padding: 5px; font-weight: 700; padding-left: 10px; padding-right: 10px; border-radius: 50px; border: none; text-transform: uppercase;}
.btn-piros:hover         {background: #00a1e4; color: #FFFFFF; padding: 5px; font-weight: 700; padding-left: 10px; padding-right: 10px; border-radius: 50px; border: none; text-transform: uppercase;}

.modal-body a {color:#FFFFFF!important;text-decoration: underline;}


.gyik_kerdescont       {background: rgb(0,0,0,0.5); border: solid 1px #ffffff; text-align: left; padding: 10px; border-radius: 5px; color: #ffffff; display: block;margin-bottom:2px;}
.gyik_kerdes            {background: none; border: none; padding: 0px;color: #ffffff;font-weight: 600; display: block; text-align: left;outline: none !important;}
.gyik_kerdes:not     {border: none;}
.gyik_kerdes:not   {border: none;}

.gyikvalasz             {color: #ffffff!important;}

h1 					{font-weight: 900; text-transform: uppercase;}
h2 					{font-weight: 900; text-align: center; text-transform: uppercase; font-size: 40px;  font-size: 48px;}
h3 					{font-weight: 900;}
h4 					{font-weight: 900; margin-top: 30px;}
.btn-primary 		{color: #b11e23; background: #ffffff; border: none; font-size: 18px; padding: 10px; padding-left: 30px; padding-right: 30px; font-weight: 900; border-radius: 40px;}
.btn-primary:hover 	{background: #ffffff; color: #b11e23}
.btn-secondary 		{background: #FFFFFF; color: #303030; border-radius: 30px; font-weight: 900; border: solid 1px #303030;}
.btn-secondary:hover{background: #EEEEEE; color: #303030;}
.bold 				{ font-weight: 700;}
label 				{ font-weight: 700; text-align: left;}
.kattinthat 		{cursor:pointer;}
.kattinthato 		{cursor:pointer;}
.mobiltavtarto  	{height:0px;}
.tavtarto5 		{height:5px;}
.tavtarto10 		{height:10px;}
.tavtarto15 		{height:15px;}
.tavtarto30 		{height:30px;}
.tavtarto50 		{height:50px;}
.tavtarto100 		{height:100px;}
.tavtartojobb20 	{margin-right:20px;}
.tavtartocsik 		{height:1px; width:100%; margin-bottom:10px; margin-top:10px; background:rgba(255,255,255,0.3);}
.kozepre 			{text-align:center;}
.balra 				{text-align:left;}
.jobbra 			{text-align:right;}
.img-responsive	 	{max-width:100%;}
.link 				{color: #ffffff!important; text-decoration: underline!important; font-weight: 900; cursor: pointer;}
.link:hover 		{color: #ffffff!important; text-decoration: underline!important;}
.linkfeher 				{color: #FFFFFF!important; text-decoration: underline!important; font-weight: 900;}
.linkfeher:hover 		{color: #fecc00!important; text-decoration: underline!important;}
.gyik 				{color: #302e84; font-weight: 900;text-decoration: none!important; font-size: 20px;}
.gyik:hover			{color: #302e84; font-weight: 900;text-decoration: none!important;}
.rejtve             {display: none;}
.halvany            {opacity: 0;}

.hero_BG			{background: url("images/hero_bg.webp");}

.igy_cont           {background: #00a1e4; border-radius: 60px; padding: 10px; padding-right: 20px; color: #FFFFFF;}
.igy_jobb           {color: #FFFFFF;}


.bubi               {width: 400px; position: absolute; bottom: 0px; right: 0px; z-index: 3; opacity: 0;}

/* NYEREMENYEK */
.nyeremenyek_cont             {text-align: center;}
.nyeremenyek_cat              {display: inline-block; margin-right: 30px; text-align: center;}
.nyeremenyek_title            {color: #c68f4c;}
.nyeremenyek_title_aktiv      {color: #e61d2b;font-weight: 900; text-decoration: underline;}
.nyeremenyek_kor              {color: #c68f4c; cursor: pointer;}
.nyeremenyek_kor2             {color: #e61d2b; cursor: pointer;}
.nyeremenyek_main_cont        { height: 35em; position: relative;}
.nyeremenyek_arrow_left       {top: 40%; left: 0px; position: absolute; font-size: 80px; cursor: pointer; color: #e61d2b;}
.nyeremenyek_arrow_left:hover {transition-property: margin-top; margin-top: 10px;  transition-duration: 0.2s;  transition-timing-function: ease-in-out;  }
.nyeremenyek_arrow_right      {top: 40%; right: 0px; position: absolute;font-size: 80px; cursor: pointer; color: #e61d2b;}
.nyeremenyek_arrow_right:hover {transition-property: margin-top; margin-top: 10px;  transition-duration: 0.2s;  transition-timing-function: ease-in-out;  }
.nyeremenyek_kep1             {width:80%; left: 10%; top:0px; position: absolute; text-align: center; pointer-events: none;}

/* TOP */
.fehertopmenu       {background: #b11e23; color: #FFFFFF!important; margin: -10px; padding: 10px; margin-bottom: -18px; padding-bottom: 18px; margin-top: -12px; padding-top: 12px;}
.topmenuitem 		{color:#FFFFFF!important; text-decoration:none; font-size:18px; font-weight:300; margin-right: 25px; text-transform: uppercase; cursor: pointer;}
.topmenuitem:hover 		{color:#ffffff!important; text-decoration:none; font-size:18px; font-weight:300; margin-right: 25px; text-transform: uppercase; cursor: pointer;}
.bottom 			{width: 100%; background: #FFFFFF; padding: 5px; text-align: center; color: #b11e23;}
.top2 				{text-align: center; color: #b11e23; background: #FFFFFF!important;z-index: 1021; font-size: 20px; padding: 5px;}
.bottom2 			{width:100%}
.bottomlink 		{color: #b11e23!important; text-decoration: none!important; margin-right: 20px; font-size: 14px;}
.mobilmenu 			{background: #b11e23; color: #FFFFFF; padding: 10px;position:fixed; top:50px; left:0px; width:100%; z-index: 4520; }
.mobilcsik 			{width: 100%; height: 1px; border-bottom: solid 1px #FFFFFF; margin: 10px;}
.topmenuitem2 		{ text-align: center; color:#FFFFFF!important; text-transform: uppercase; font-size: 14px; border-top: solid 1px #FFFFFF; padding: 15px;}

/* AJANDEK */
.ajandek            {width: 200px; height: 200px; background: #016343; border-radius: 200px; display: inline-block;}
.ajandeknev         {color: #016343; font-size: 20px;}
.ajandekcont         { background: rgba(1,99,67,0.3); padding: 10px;}
.form-control-plaintext     { background: rgba(255,255,255,0.1)!important;}

/* termeklista */
.listasor             {background: rgba(0,0,0,0.1); padding: 3px; margin-bottom: 2px;}
.btn-kicsi            {background: #EEEEEE; color: #303030; padding: 3px; font-size: 14px; border-radius: 40px;border: solid 1px #303030;}

/* kerdoiv */
.kerdoiv_cont         {background: rgba(0,0,0,0.1); padding: 15px; font-weight: 300;}
.kerdoiv_kerdes         {font-weight: 700; font-size: 18px; margin-top: 30px; margin-bottom: 10px;}
.form-check-label         {font-weight: 300!important;}

.csik                 {width: 100%; height: 100px;}


/* NAPTAR nyertesek */
.naptar_nap_inaktiv 	{color: rgba(255,255,255,0.5); font-weight: 300;}
.naptar_nap_aktiv 	{color: rgba(255,255,255,1); font-weight: 700;}
.ajandekkep 		{width: 100%; padding: 10px;border-radius:5px; cursor:pointer;}
.ajandekok_jobb_cont {background: rgba(0,0,0,0.1); padding: 10px; border-radius: 10px;}
.ajandek_head 		{font-weight: 900; font-size: 24px; padding: 5px; border-radius: 10px; background: rgba(255,255,255,0.8); color:#302e84;}
.naptar_cont     {background: #c68f4c; border-radius: 10px; text-align: center;}
.naptar_honapirany {color: #FFFFFF; padding: 5px; font-size: 20px; padding-bottom: 0px;}
.naptar_honapirany2 {color: #fde5b7; padding: 5px; font-size: 20px; padding-bottom: 0px;}
.naptar_honap         {color: #fde5b7; font-size: 20px;}
hr                 {margin-bottom: 2px; margin-top: 2px;}
.naptar_nap_napok     {color: #fde5b7;}

/* Small devices (tablets, 768px and up) */
@media all and (min-width: 100px) and (max-width: 1100px) 
{
	.desktop 				{display:none;}
	.mobiltavtarto			{height:30px;}
	.mobiltavtarto10		{height:10px;}
	.top 					{position:fixed; top:0px; left:0px; width:100%; background:#b11e23; padding:10px;z-index: 4500}
	.top2 					{font-size: 18px;}
	.bottombig 				{font-size: 11px;}
	.bottom 				{width: 100%;}
	.tavtartonaagy 			{height: 200px;}
    .igy_jobb             {font-size: 14px;}
    /* NYEREMENYEK */
    .nyeremenyek_main_cont        { height: 20em;}
    .nyeremenyek_arrow_left       {top: 20%; left: 0px; position: absolute; font-size: 60px; z-index: 10;}
    .nyeremenyek_arrow_right      {top: 20%; right: 0px; position: absolute;font-size: 60px; z-index: 10;}
    .nyeremenyek_kep1             {width:100%; left: 0%; top:0px;}
    body                         {font-size: 14px;}
    .csik             {height: auto;}
    h2                 {font-size: 30px;}
    .ablak             {background: rgba(0,0,0,0.9); border-radius: 15px; padding: 15px;}
    .tatable         {  width: 100%;   overflow-x: auto;}
    /*.cont1             {background:url("images/hatter2.webp"); color: #FFFFFF; background-size: cover; background-position: center;}
    .cont2             {background:url("images/hatter2.webp"); color: #FFFFFF; background-size: cover; background-position: center;}*/
body {
	background: url(images/hatter2.webp);
	background-position: center;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-size: cover;
}
	.cont0{color: #FFFFFF;}

    .tatable table tr {border-bottom: solid 1px rgba(255,255,255,0.2);}
}


@media all and (min-width: 1101px) and (max-width: 5000px) 
{
	.toplogo 				{position: absolute; top: 2px; left: 0px; width: 8%; max-width: 150px;}
	.mobil 					{display:none;}
	.top 					{position:fixed; top:0px; left:0px; width:100%; background:#b11e23; height:50px; z-index:4500; padding:10px;-webkit-box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.75);
							-moz-box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.75);box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.75);}
	.top2 					{position:fixed; top:45px; left:0px; width:100%;}	
	.bottom 				{position:fixed; bottom:0px; left:0px; z-index:1021;width: 100%;}
	.bottom2 				{position:fixed; bottom:35px; left:0px; z-index:1021;width: 100%; pointer-events:none;}
	.topmenuitem 			{margin-top: 5px;}
	.topaktiv 				{margin-top: -15px; padding-top: 15px; padding-bottom: 15px; background: #FFFFFF; color: #00a1e4!important; padding-left: 5px; padding-right: 5px;}
    
    
}

/*kis laptop*/
@media all and (min-width: 1101px) and (max-width: 1300px) 
{
	.toplogo 			{width: 120px;}
	.topmenuitem 			{color:#FFFFFF!important; text-decoration:none; font-size:12px; font-weight:700; font-family: 'Roboto Condensed', sans-serif;}
	.topaktiv 				{margin-top: -15px; padding-top: 15px; padding-bottom: 15px; background: #FFFFFF; color: #00a1e4!important; padding-left: 5px; padding-right: 5px;}

    #nyeremenyek h3     {font-size: 18px;}
    #nyeremenyek         {font-size: 14px;}
	
}

/* NYEREMENYEK ablak */
@media all and (min-width: 600px) and (max-width: 900px) {.nyeremenyek_main_cont        { height: 30em;}}
@media all and (min-width: 901px) and (max-width: 1100px) {.nyeremenyek_main_cont        { height: 40em;}}
@media all and (min-width: 1101px) and (max-width: 1300px) {.nyeremenyek_main_cont        { height: 40em;}}
