@charset "utf-8";
/* CSS Document */

@font-face {
  font-family:FiraSans;
  src: url(../fonts/firasanscondensed-regular.woff) format('woff');
  src: url(../fonts/firasanscondensed-regular.otf);
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family:FiraSans;
  src: url(../fonts/firasanscondensed-italic.woff) format('woff');
  src: url(../fonts/firasanscondensed-italic.otf);
  font-weight: normal;
  font-style: italic;
}
@font-face {
  font-family:FiraSans;
  src: url(../fonts/firasanscondensed-bold.woff) format('woff');
  src: url(../fonts/firasanscondensed-bold.otf);
  font-weight: bold;
  font-style: normal;
}
@font-face {
  font-family:FiraSans;
  src: url(../fonts/firasanscondensed-bolditalic.woff) format('woff');
  src: url(../fonts/firasanscondensed-bolditalic.otf);
  font-weight: bold;
  font-style: italic;
}

body {margin:0 auto; font-family:"FiraSans", Tahoma, sans-serif; font-size:20px; color:#000; background-image:url(../images/kfh-bg.jpg); background-repeat:repeat-y; background-size:100% auto; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;}

img {width:100%;}

.main {margin:0 auto; width:960px;}

/* HEAD */
.headColorStrip {margin:0 auto; width:100%; padding-top:1.25%; background-color:#760204;}
.headPic {margin:0 auto; width:100%;}

/* MENU */
.mainMenuBox {margin:0 auto; width:auto; height:92px; background-color:#760204; border-bottom:#6c6c6c solid 5px;}
ul.mainMenu {margin:0; height:92px; list-style-type:none; text-align:right; padding:0% 0% 0% 0%; font-size:16px; float:right;}
ul.mainMenu li {display:inline-block; height:92px; line-height:normal; vertical-align:middle; float:left;}
ul.mainMenu a {display:block; height:20px; text-decoration:none; color:#fff; vertical-align:middle; padding:36px 20px;}
ul.mainMenu a:hover {height:20px; color:#b1b1b1; background-color:#980000; border-bottom:#6c6c6c solid 5px;}
ul.mainMenu .active a {height:20px; color:#b1b1b1; background-color:#980000; border-bottom:#6c6c6c solid 5px;}
ul.mainMenu li.mainMenuDivider {width:2px; height:92px; margin:0 auto; padding:0% 0% 0% 0%; display:inline-block; background-color:#8a0002; border-right:#5b0103 solid 1px; border-bottom:none;}

ul.galleryMenu {margin:0; height:92px; list-style-type:none; text-align:right; padding:0% 0% 0% 0%; font-size:16px; float:right;}
ul.galleryMenu li {display:inline-block; height:92px; line-height:normal; vertical-align:middle; float:left;}
ul.galleryMenu a {display:block; height:20px; text-decoration:none; color:#fff; vertical-align:middle; padding:36px 20px; background-color:#6c6c6c; border-bottom:#760204 solid 5px;}
ul.galleryMenu a:hover {height:20px; color:#000000; background-color:#9b9b9b; border-bottom:#760204 solid 5px;}
ul.galleryMenu .active a {height:20px; color:#000000; background-color:#9b9b9b; border-bottom:#760204 solid 5px;}
ul.galleryMenu li.galleryMenuDivider {width:2px; height:92px; margin:0 auto; padding:0% 0% 0% 0%; display:inline-block; background-color:#7a7a7a; border-right:#545454 solid 1px; border-bottom:#760204 solid 5px;}

/* CONTENT */
.content {margin:0 auto; width:100%; padding-top:5%; background-color:#b1b1b1;}
.contentPageNameLine {margin:0 auto; width:100%; height:92px;}
.contentPageName {padding:28px 5%; border-top:#760204 solid; border-right:#760204 solid; border-bottom:#760204 solid; font-size:36px; color:#760204; float:left;}
.contentText {padding:5%; clear:both;}
.contentList {padding:5% 5% 5% 5%; width:90%; clear:both;}

ul.versList {margin:0 auto; margin-bottom:3%; padding:0; list-style-type:none; font-size:28px;}
ul.versList li {margin-bottom:10px; padding:0; display:block;}
ul.versList a {display:block; text-decoration:none; color:#760204; vertical-align:middle; padding:32px; background-color:#6c6c6c; border-bottom:#760204 solid 5px;}
ul.versList a:hover {color:#b1b1b1;}

ul.fotoList {list-style:none; padding:0; margin:0; text-align:center; }
ul.fotoList:after {clear:both; content:"."; display:block; height:0; visibility:hidden; }
ul.fotoList li {float:left; width:23.5%; margin-bottom:2%;}
ul.fotoList li a {display:block; padding:15%; color:#FFFFFF; text-decoration:none; background-color:#6c6c6c; border-bottom:#760204 solid 5px;}
ul.fotoList li img {display:block; width:100%; height:auto; }
ul.fotoList li.gapDQ-A {width:2%; display:block; padding-top:10%; background-color:transparent; border:none;}
ul.fotoList li.gapDQ-B {width:2%; display:block; padding-top:10%; background-color:transparent; border:none;}
ul.fotoList li.gapT-A {width:0; display:none; padding-top:0; background-color:transparent; border:none;}
ul.fotoList li.gapT-B {width:0; display:none; padding-top:0; background-color:transparent; border:none;}

.kapcsolatText {margin:0 auto; width:60%; margin-right:5%; margin-bottom:3%; float:left;}
.kapcsolatPic {margin:0 auto; width:25%; padding:5%; float:left; background-color:#6c6c6c; border-bottom:#760204 solid 5px;}
.mapHolder {width:100%; margin:3% 0% 5% 0%; padding-top:50%; position:relative; display:block; border-color:#6c6c6c; border-style:solid; clear:both;}
.map {width:100%; max-width:100%; max-height:100%; margin:0; position:absolute; display:block; top:0; left:0; bottom:0; right:0;}

highlight {font-weight:bold; text-decoration:underline; color:#464646;}

/* FOOT */
.foot {margin:0 auto; width:100%; background-color:#000;}
.footBox {margin:0 auto; width:100%;}

ul.footMenu {margin:0%; padding:3% 9%; list-style-type:none; line-height:normal; text-align:left; font-size:12px;}
ul.footMenu li {display:block; padding:3% 0%;}
.footMenu a {padding:0%; text-decoration:none; color:#b1b1b1;}
.footMenu a:hover {color:#760204;}
.footMenu .active a {color:#760204;}

ul.footBackToTopLink {margin:0%; padding:3% 9%; list-style-type:none; line-height:normal; text-align:right; font-size:12px;}
ul.footBackToTopLink li {display:block; padding:3% 0%;}
.footBackToTopLink a {width:100%; color:#b1b1b1; text-decoration:none; background-image:url(../images/arrow-up.png); background-repeat:no-repeat; background-position:right; background-size:1em auto; padding-right:2em;}
.footBackToTopLink a:hover {color:#760204; background-image:url(../images/arrow-up-hover.png);}

ul.copyright {margin:0%; padding:0% 0%; list-style-type:none; color:#b1b1b1; text-align:right; font-size:12px;}
ul.copyright {display:block; padding:6% 9%;}


@media only screen and (max-width:1024px) {
.main {width:90%;}
ul.mainMenu a {padding:36px 15px;}

}

@media only screen and (max-width:800px) {
.main {width:80%;}
.mainMenuBox {margin:0 auto; width:100%; height:447px; background-color:#760204; border-bottom:#6c6c6c solid 5px;} /*height: a li magasságokhoz hozzá adódik a Didiver és a border-bottom is!!*/
ul.mainMenu {margin:0; height:447px; list-style-type:none; text-align:center; padding:0% 0% 0% 0%; font-size:16px; float:none;}
ul.mainMenu li {display:block; height:72px; line-height:normal; vertical-align:middle; float:none;}
ul.mainMenu a {display:block; height:20px; text-decoration:none; color:#fff; vertical-align:middle; padding:26px 0px;}
ul.mainMenu a:hover {height:20px; color:#b1b1b1; background-color:#980000; border-bottom:none;}
ul.mainMenu .active a {height:20px; color:#b1b1b1; background-color:#980000; border-bottom:none;}
ul.mainMenu li.mainMenuDivider {width:100%; height:2px; margin:0 auto; padding:0% 0% 0% 0%; display:inline-block; background-color:#8a0002; border-right:none; border-bottom:#5b0103 solid 1px;}
.contentPageName {font-size:28px;}
ul.versList {font-size:20px;}
ul.fotoList li {width:32%;}
ul.fotoList li.gapDQ-A {width:0; display:none; padding-top:0; background-color:transparent; border:none;}
ul.fotoList li.gapDQ-B {width:0; display:none; padding-top:0; background-color:transparent; border:none;}
ul.fotoList li.gapT-A {width:2%; display:block; padding-top:10%; background-color:transparent; border:none;}
ul.fotoList li.gapT-B {width:2%; display:block; padding-top:10%; background-color:transparent; border:none;}
}

@media only screen and (max-width:600px) {
.content {padding-top:6%;}
.contentPageNameLine {height:88px;}
.contentPageName {font-size:24px;}
ul.galleryMenu {height:88px;}
ul.galleryMenu li {height:88px;}
ul.galleryMenu a {height:20px; padding:34px 20px;}
ul.galleryMenu a:hover {height:20px;}
ul.galleryMenu .active a {height:20px;}
ul.galleryMenu li.galleryMenuDivider {height:88px;}
ul.versList {font-size:16px;}
ul.fotoList li {width:48%;}
ul.fotoList li.gapDQ-A {width:2%; display:block; padding-top:10%; background-color:transparent; border:none;}
ul.fotoList li.gapDQ-B {width:0%; display:block; padding-top:10%; background-color:transparent; border:none;}
ul.fotoList li.gapT-A {width:0%; display:none; padding-top:0; background-color:transparent; border:none;}
ul.fotoList li.gapT-B {width:0%; display:none; padding-top:0; background-color:transparent; border:none;}
}

@media only screen and (max-width:480px) {
.main {width:100%;}
.mainMenuBox {margin:0 auto; width:100%; height:375px; background-color:#760204; border-bottom:#6c6c6c solid 5px;} /*height: a li magasságokhoz hozzá adódik a Didiver és a border-bottom is!!*/
ul.mainMenu {margin:0; height:375px; list-style-type:none; text-align:center; padding:0% 0% 0% 0%; font-size:16px; float:none;}
ul.mainMenu li {display:block; height:60px; line-height:normal; vertical-align:middle; float:none;}
ul.mainMenu a {display:block; height:20px; text-decoration:none; color:#fff; vertical-align:middle; padding:20px 0px;}
ul.mainMenu a:hover {height:20px; color:#b1b1b1; background-color:#980000; border-bottom:none;}
ul.mainMenu .active a {height:20px; color:#b1b1b1; background-color:#980000; border-bottom:none;}
ul.mainMenu li.mainMenuDivider {width:100%; height:2px; margin:0 auto; padding:0% 0% 0% 0%; display:inline-block; background-color:#8a0002; border-right:none; border-bottom:#5b0103 solid 1px;}
.content {padding-top:7%;}
.contentPageNameLine {height:84px;}
.contentPageName {font-size:20px;}
ul.galleryMenu {height:82px;} /* A menü borderje miatt csökken a magasság 84>82, 32>31 */
ul.galleryMenu li {height:82px;}
ul.galleryMenu a {height:20px; padding:31px 20px;}
ul.galleryMenu a:hover {height:20px;}
ul.galleryMenu .active a {height:20px;}
ul.galleryMenu li.galleryMenuDivider {height:82px;}
ul.versList {font-size:16px;}
}