body {margin: 0px; padding: 0px; background: #FFF ; color: #333; font-family: 'Libre Franklin', sans-serif; }
html { margin: 0px; padding: 0px;}

.clear {clear: both;}
.navbar-header {display: none;}
.container {}
.navbar {min-height: auto;}
.navbar-nav {margin: 0px;}
.navbar-collapse {max-height: none;}
.navbar-toggle {margin: 0px;}

#menu, #banner-fade .beuszo, #menual .almenu, .btn, 
#menu li a, #menu li i,#MenuFul, #footer ul li a img, #socials .socialsor a img,
#head .nav a,#head .nav a:hover,#head .nav a:focus,#head .nav a.aktiv,
#menu .nav a,#menu .nav a:hover,#menu .nav a:focus,#menu .nav a.aktiv,
.fooldal_link_box, .fooldal_link_box h2, .fooldal_box, .termek_box_padding {-moz-transition: all .3s ease-in-out; -webkit-transition: all .3s ease-in-out; -ms-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out;}

h1, #footer h2, #szlogen h2, #visszajelzesek h3 { } 	
.navbar-toggle .icon-bar {background: #FFF;}
.navbar-toggle {background: #a69e93;}

/* OK */
h1, .tartalom_szoveg h2 {color: #cd7708; font-size: 2em; margin-top: 0px; text-align: left; border-bottom: 1px solid #cd7708; text-transform: uppercase;}

#socials {background: #b7ada4; border-bottom: 1px solid #FFF; border-top: 1px solid #FFF; min-height: 34px; height: auto; color: #FFF; position: relative;}
	#socials .socialsor img, #socials .socialsor .cimke {display: inline; float: left; margin-left: 5px;}
	#socials .socialsor {display: table; margin-left: auto;}
	#socials .socialsor a {color: #FFF; text-decoration: none;}
	#socials .socialsor a img {opacity: 1.0; border: 1px solid transparent;border-radius: 50%; margin-top:-8px; margin-bottom: -10px;}
	#socials .socialsor a img:hover {opacity: 1.0; border: 1px solid #FFF;}
	#socials .socialsor .cimke {line-height: 32px;}
	#socials .socialsor_bal {margin-left: 0px; margin-right: auto;}
	#socials a {color: #4b4b4b; line-height: 32px;}
	#socials .elvalaszto {padding-left: 3px; padding-right: 3px;}
	#socials a.kezdolap {color: #afa89c;}
	
#vezeto {background: #e9e9e9; border-bottom: 1px solid #FFF; border-top: 1px solid #FFF; color: #cecece; padding: 5px 0px;}	
	#vezeto .kezdolap, #vezeto a {text-decoration: none; color: #005126;}
	#vezeto a:hover {text-decoration: underline;}
	#vezeto span {padding: 0 5px;}	
	
#head {background: url('../images/hatter-header.jpg') top center; padding-top: 5px;padding-bottom: 5px;}
	#head .li_logokep {float: left;}
	#head .navbar {display: table; float: right; padding-bottom: 0px; padding-top: 30px;}
	#head .navbar .nav-link {padding-bottom: 0px; color: #FFF;}
	#head .navbar .nav-link:hover {color: #cd7708;}

#TovabbTarto {}	
	#Tovabb {text-align: center; display: table; margin-left: auto; margin-right: auto; cursor: pointer; text-decoration: none;}

.form .elkulgombhelye {height: 85px;}	

#menutarto {position: fixed; z-index: 1000; width: 100%; top: 0px;}
	#menutarto .navbar-nav {margin-left: auto; margin-right: auto; float: none; display: table;}
	#menutarto .container, #menutarto .navbar-collapse {padding: 0px;}
	.bezar {opacity: 1;}
	.lenyit {opacity: 1;}

#content { font-size: 16px; position: relative; z-index: 2; margin-top: -50px; margin-bottom: 40px;}
	#content .container { padding: 40px; font-size: 16px; background: #f2f2f2; border-bottom: 70px solid #cd7708;}
	#content h1 {margin-top: 0px;}
	.tartalom_szoveg {font-size: 16px; line-height: 28px; text-align: justify; }
	.kerek_kepes_bejegyzes .kerek_kepes_bejegyzes_kep img {border-radius: 50%; padding: 6px; background: #b7ada4; }

#slideshow {position: relative; z-index: 1;}
	#slideshow #TovabbTarto {position: absolute; bottom: 60px; left: 50%; }
	#slideshow #TovabbTarto img {max-height: 160px;}

#menu {background: #363636; width: 100%; z-index: 100; border-bottom: 2px solid #cd7708;}
	#menu .fomenu {color: #FFF;background: transparent; text-decoration: none; padding: 20px 30px;}
	#menu .fomenu:hover {color: #FFF;background: #cd7708; text-decoration: none;}
	#menu .navbar {float: none; display: table; border: none; margin-left: auto; margin-right: auto; padding: 0px;}
	#menu .navbar-collapse {padding: 0px;}
	#menu nav {float: left;}
	#menu li:hover .fomenu, #menu .dropdown-menu li:hover .almenu, #menu .active, #menu .almenu_aktiv, .dropdown-menu>li>a:hover {background: #cd7708; text-decoration: none; color: #FFF;}
	#menu li a.logokep {padding: 0px;}
	#menu.lenyit {top: 0px;position: fixed;}
	#menu.lenyit .li_logokep img { height: 60px; }
	#menu.lenyit .li_fomenu {padding-top: 0px;}
	
	.navbar {margin: 0px;}
	.dropdown-menu {background: rgba(24,24,24,1);}	
	.dropdown-menu>li>a {font-size: 1.4em; color: #c5c5c5;}
	.kozepso_logo img {position: absolute; left: 0px;}
	
	.inline_slide_block {position: absolute;}
	#GalleryBox {position: relative;}
	.visszalepes, .datum {display: block; color: #51707e; text-align: right; margin-bottom: 5px; padding-bottom: 5px; border-bottom: 1px solid #efefef; font-weight: bold;}
	/*.fancybox-thumb img {height: 180px;}*/
	.visszalepes { border-bottom: none; margin-bottom: 25px; margin-top: 10px;}
	.visszalepes a {display: table; margin-left: auto; margin-right: auto; color: #91897e;}
	h1.kibontva {margin-bottom: 10px;}
	
	.bovebben {border-top: 1px solid #CECECE; padding-top: 10px; margin-bottom: 20px;}
	.bovebben a {margin-left: auto; margin-right: auto; display: table; float: none;}
	
	.visszajelzesek_box {position: relative;}
	.visszajelzesek_box img {margin-bottom: 0px;position: relative; z-index: 1;}
	.visszajelzesek_box p {text-align: center; font-weigh: bold; color: #000; font-size: 1.6em;position: relative; z-index: 2; margin-top: -1.6em; background: rgba(255,255,255,0.6);}
	
	.tartalom_szoveg {margin-bottom: 40px;}
	.tartalom_szoveg a {color: #000;}
	
#ElkuldBtn {margin-left: auto; margin-right: auto; float: none; display: table; background: #d78eac; border: 1px solid #b36683;}
	#ElkuldBtn:hover {background: #b36683;}
	
#kapcsolatfelvetel {background: #fafafa; padding: 50px 0px; padding-bottom: 80px; margin-top: 40px;} 	
	#kapcsolatfelvetel .szoveg h5 {text-align: center; font-size: 48px; line-height: 48px; margin-top: 0px; color: #f07677;}
	#kapcsolatfelvetel .szoveg p {text-align: center; font-size: 16px; color: #d1d1d1;}
	#kapcsolatfelvetel .szoveg {margin-bottom: 30px; display: block;}
	#kapcsolatfelvetel label {display: none;}
	#kapcsolatfelvetel input, #kapcsolatfelvetel textarea {border-radius: 0px; border: 1px solid #333; background: rgba(89,89,89,0.8); color: #FFF;}
	#kapcsolatfelvetel input::placeholder, #kapcsolatfelvetel textarea::placeholder {color: #FFF;}
	#kapcsolatfelvetel textarea {min-height: 200px;}
	#kapcsolatfelvetel button {background: #f07677; border-color: #d65758; color: #FFF; border-radius: 30px; font-size: 24px; text-transform: uppercase; padding: 15px 30px; float: none; margin-left: auto; margin-right: auto; display: table; margin-top: 15px;}
	#kapcsolatfelvetel button:hover {background: #d65758; color: #FFF;}
	
#footer {background: url('../images/hatter-footer.jpg') top center; padding: 20px 0px; color: #c7c1ba;}
	#footer .col {float: left;}
	#footer .navigacio {float: left; border-left: 2px solid #cd7708; list-style: none; padding: 0px; margin: 0px;}
	#footer .navigacio li {padding: 0px 10px;}
	#footer .navigacio li a {color: #FFF; font-size: 14px; border-bottom: 2px solid #333; padding: 5px 0px; }
	#footer .navigacio li a:hover {color: #cd7708;}
	#footer .navigacio li:first-child a { padding-top: 0px; }
	#footer .navigacio li:last-child a { padding-bottom: 0px; border-bottom: none; }
	#footer .menuk { display: table; margin-left: auto;}
	#footer p {margin-bottom: 5px; color: #FFF; padding-left: 120px; font-size: 12px; line-height: 12px;}
	#footer p span {display: block; float: left; width: 20px; }

	
#reklamrendelo {background: #282828; padding: 10px 0px; color: #a3a3a3; font-size: 12px;}
	#reklamrendelo p {color: #EFEFEF; }
	#reklamrendelo p em {color: #a3a3a3;}
	#reklamrendelo .col {float: left;}
	#reklamrendelo .reklamrendelo {margin-left: auto; display: table;}
	#reklamrendelo .reklamrendelo img {float: left; margin-right: 10px;}
	#reklamrendelo .reklamrendelo span {height: 50px; width: 200px; float: left; font-size: 12px; font-family: arial; line-height: 14px; text-align: left; color: #EFEFEF;}
	#reklamrendelo .reklamrendelo:hover span {color: #FFF;}
	#reklamrendelo .reklamrendelo img {float: left; height: 40px; margin-right: 10px;}

#ScrollTopDown {position: fixed; right: 40px; bottom: 40px; z-index: 100; background: rgba(0, 0, 0, 0.20); padding: 0px; width: 50px;}
	#ScrollTopDown i {font-size: 30px; color: #FFF; cursor: pointer; display: block; padding: 10px; float: left;}
	#ScrollTopDown i:hover {background: #a69e93; color: #FFF;}

	.blog_box_tarto {padding: 15px 0px;}
	.blog_box {border: 1px solid #e8e8e8; -webkit-box-shadow: inset 0px 0px 10px 5px rgba(245,245,245,1);-moz-box-shadow: inset 0px 0px 10px 5px rgba(245,245,245,1);box-shadow: inset 0px 0px 10px 5px rgba(245,245,245,1); background:#FFF;}
	.blog_box img {}
	.blog_box .szoveg h2 {font-size: 1.2em; font-weight: bold; margin-top: 0px; color: #000; text-transform: uppercase; margin-bottom: 5px;}
	.blog_box .szoveg {padding: 15px; font-size: 0.9em; color: #828282; text-align: justify;}
	.blog_box .szoveg a {color: #828282;}
	.blog_box a, .blog_box a:hover  {text-decoration: none;}
	.effect2 { position: relative; }
	.effect2:before, .effect2:after
	{
	  z-index: -1;
	  position: absolute;
	  content: "";
	  bottom: 15px;
	  left: 10px;
	  width: 50%;
	  top: 80%;
	  max-width:300px;
	  background: #777;
	  box-shadow: 0 15px 10px #777;
	  transform: rotate(-3deg);
	}
	.effect2:after
	{
	  transform: rotate(3deg);
	  right: 10px;
	  left: auto;
	}	
	
	/* LAPOZO */
		
div.page {padding: 20px 0;} 
div.page table {width: auto; margin-left: auto; margin-right: auto; border-top: 1px solid #ece5e3; border-bottom: 1px solid #ece5e3;}
div.page table a {color: #953046;}
div.page table a:hover,div.page table a.aktiv {color: #953046;}
div.page table a.aktiv {font-weight: bold;}
a.leptetes {width: 16px; height: 16px; display: block; background: url('../images/ikon_leptetes.png') no-repeat;}
 a.leptetes_elso {background-position:0px 0px;}
 a.leptetes_vissza {background-position: 0px -16px;}
 a.leptetes_elore {background-position: -16px -16px;}
 a.leptetes_utolso {background-position: -16px 0px;}
 a.leptetes_elso:hover {background-position: -32px 0px;}
 a.leptetes_vissza:hover {background-position: -32px -16px;}
 a.leptetes_elore:hover {background-position: -48px -16px;}
 a.leptetes_utolso:hover {background-position: -48px 0px;} 
div.page a.elvalaszto:hover, div.page  a.elvalaszto {cursor:hand; color: #ece5e3;} 
div.page td.lapozas_oldalak a:last-child {display: none;}

	#menu .navbar-mobil {display: none;}
	#menu .navbar-asztali {display: block;}	
	#menu {position: initial; top: 0px;}
	#menu .li_logokep { padding: 0px;} /*float: none;*/
	#menu .li_logokep img {float: none; margin-left: auto; margin-right: auto; display: table;}
	
@media (min-width:480px){
/* styles for mobile browsers smaller than 480px; (iPhone) */
	#Tovabb img {height: 80px;}			
}	
@media (min-width:768px){
/* default iPad screens */
	#menual .almenu {padding: 10px 8px; font-size: 1em;}
	#menu .fomenu {padding-left:12px; padding-right:12px;font-size: 14px;}
	#design .szam {font-size: 34px;}
	#design .cimke {font-size: 14px;}
}	
@media (max-width:767px){
/* default iPad screens */
	.navbar-mobil {display: block;}
	.navbar-asztali {display: hidden;}
	.navbar-header {display: block;}
	.navbar-header a, .navbar-header a:hover {color: #FFF; padding-top: 10px; display: block;}
	.navbar-toggle { margin-top: 5px;margin-right: 5px;}
	.navbar-toggle .fa {color: #b8cfda;}
	#menual li a {border: none;}
	h1 {font-size: 2em; margin-bottom: 1em;}
	#ScrollTopDown {right: 0px; bottom: 0px; width: 100px;}
	#Socials {bottom: 0px; left: 0px;}
	#Socials img {float: left; margin: 0px;}
	#logotarto img {max-height: 60px;}
	.design_kep {max-width: 50%;}
	#ScrollTopDown {display: none;}
	.fooldalbox h2 {font-size: 28px;}
	.fooldalbox .szoveg {font-size: 16px; text-align: center;}
	.col-xs-12 img {margin-left: auto; margin-right: auto; float: none;}
	#menu .logo  {display: block;}
	#TovabbTarto {display: none;}
	#menu .navbar {width: 100%;}
	#contact span.btn {font-size: 1.8em; }
	#menu .li_logokep { float: none; }
	#menu .fomenu {padding-left: 15px;padding-right: 15px;font-size: 24px;padding-top: 0px; line-height: 36px;}	
}		
@media (max-width:480px){
/* styles for browsers max width 480px; */   	
	#TovabbTarto {height: 100px;}
	#Tovabb img {height: 60px;}		
}	
@media (min-width:960px){
/* styles for browsers larger than 960px; */

}
@media (max-width:991px){
/* styles for browsers max width 991px; */   
	#logotarto {display: block;}
	#menu .menusor>li:first-child {display: none;}
}
@media (min-width:991px){
/* styles for browsers larger than 960px; */
	#menual .almenu {padding: 10px 15px; font-size: 1.2em;}
	h1 {font-size: 2.4em; margin-bottom: 1em;}
	#TovabbTarto {height: 225px;}	
	#menu .fomenu {padding-left:18px; padding-right:18px;font-size: 16px;}
	.tartalom_szoveg .col-md-2 {width: 33.3333%;}
}	
@media (min-width:1200px){
/* styles for browsers larger than 1440px; */
	#menu .fomenu {padding-left:15px; padding-right:15px;font-size: 20px;}
	h1 {font-size: 2.8em; margin-bottom: 1em; padding-bottom: 0.5em;}
	#Tovabb img {height: 190px;}		
	.tartalom_szoveg .col-md-2 {width: 16.66666667%;}
	#menu .li_logokep {float: left; background: transparent; padding-right: 20px;}
}

@media (min-width:1600px){
/* styles for browsers larger than 1440px; */
	#menu .fomenu {padding-left:20px; padding-right:20px; font-size: 20px;}
	#kapcsolatfelvetel input {height: 56px;}
	#kapcsolatfelvetel textarea {height: 200px;}
}