/* 
    Document   : styles
    Created on : 2013.08.07., 11:50:54
    Author     : semmer@infoart.hu
*/

@import url('js-ui.css');

@font-face {
  font-family: 'Roboto Condensed';
  font-style: normal;
  font-weight: 300;
  src: local('Roboto Condensed Light'), local('RobotoCondensed-Light'), url(../fonts/RobotoCondensed-Light.ttf) format('truetype');
}
@font-face {
  font-family: 'Roboto Condensed';
  font-style: normal;
  font-weight: 400;
  src: local('Roboto Condensed Regular'), local('RobotoCondensed-Regular'), url(../fonts/RobotoCondensed-Regular.ttf) format('truetype');
}
@font-face {
  font-family: 'Roboto Condensed';
  font-style: normal;
  font-weight: 700;
  src: local('Roboto Condensed Bold'), local('RobotoCondensed-Bold'), url(../fonts/RobotoCondensed-Bold.ttf) format('truetype');
}
@font-face {
  font-family: 'Gothic';
  font-style: normal;
  font-weight: 300;
  src: local('Gothic'), local('Gothic'), url(../fonts/Gothic.ttf) format('truetype');
}


html, body, form, fieldset,
h1, h2, h3, h4, h5, h6, p, pre, samp, span,
blockquote, ul, li, ol, dl, dd, dt, address, div, abbr, dfn, acronym,
table, tr, th, td,
input, select, option, textarea {
  margin: 0;
  padding: 0;
  font: 15px 'Open Sans', sans-serif;
  font-weight: 400;
  color: #333;
}
h1, h2, h3, h4, h5, h6, p, pre, samp, 
blockquote, ul, li, ol, dl, dd, dt, address, abbr, dfn, acronym {
  cursor: text;
}
.clearfix:after {
  content: '.';
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}
.clearfix { display: inline-block }
*:active, object:focus, embed:focus, a { outline: none }
input::-moz-focus-inner { border: 0 }
*.pointer, label { cursor: pointer }
fieldset { border: none }
input, select, option, textarea {
  font-size: 100%;
  outline-style: none;
}
textarea { resize: none; }
.bug { border: 1px solid red; }
table tbody tr td, table tr th { padding: 2px; }

body {}

img {
  border: 0;
}

.clear {
  float: none !important;
  clear: both;
}

a {
  color: #9DC054;
  text-decoration: none;
}

a:hover {
  color: #333;
  text-decoration: none;
}

span.gothic_class{
    font-family: Gothic;
}

strong {
  font-weight: 700;
}

div#noview {
  display: none;
}

div#site {
  display: block;
  overflow: hidden;
}

input:-webkit-autofill {
  -webkit-box-shadow: 0 0 0px 1000px #fff inset;
  -webkit-text-fill-color: #333;
}

/* Header */

div#header {
  position: relative;
  margin-bottom: 45px;
  padding: 0;
  background: #95B84A;
}

div#header-top {
  height: 60px;
  background: #3A454B url('../gfx/head_top_bg.png') top left;
}

div#header-top-in {
  width: 970px;
  height: 44px;
  margin: 0 auto;
  position: relative;
  text-align: right;
  padding: 10px 0 0 0;
}

div#header-top-in > div#logo {
  position: absolute;
  left: 0;
  top: 20px;
  z-index: 30;
}

div#header-top-in > div {
  display: inline-block;
  margin: 0 -3px 0 0;
}

div#header-cover {
  height: 109px;
  position: relative;
  z-index: 10;
  border-top: 1px #BFD491 solid;
  border-bottom: 1px #BFD491 solid;
}

div#mainmenu {
  width: 100%;
  position: absolute;
  top: 50px;
  left: 0;
  z-index: 20;
}

div#mainmenu-in {
  width: 970px;
  height: 32px;
  padding-top: 34px;
  padding-bottom: 35px;
  margin: 0 auto;
  position: relative;
}

/* Masonry Boxes */

div#content {
/*  width: 970px;*/
  width: 985px;
  margin: 20px auto 0;
}

div#content div.box {
  width: 235px;
  margin-bottom: 25px;
  background: #fff;
}

div#content div.box h1.component-heading,
div#content div.box h2.component-heading {
  font-family: 'Roboto Bold', Arial, sans-serif;
  font-size: 17px;
  margin-bottom: 15px;
  padding: 0 0 9px 36px;
  background: #FFF url('../gfx/box_head_pikto_2.png') top left no-repeat;
  color: #9DC053;
  line-height: 1.1;
  text-transform: uppercase;
  border-bottom: 1px #969696 solid;
}

div.portlet-content.box.part-content.tartalom h1.component-heading {
  margin-bottom: 10px !important;
}

div#content div.box#widebox {
  margin: 0;
  background: transparent;
}

div#content div.box#widebox,
div#content div.box#widebox div.box {
  width: 730px;
  padding-left: 0;
  padding-right: 0 !important;
}

div#footer-top-in div.box {
  width: 310px;
  margin: 20px 0 0;
}

div#footer-top-in div.box h2.component-heading {
  font-size: 22px;
  padding: 0 0 10px;
  text-transform: uppercase;
}

/* Footer */

div#footer {
  height: 69px;
  background: #9DC054;
  border-bottom: #CBDEA5 1px solid;
  border-top: #CBDEA5 1px solid;
}

div#footer-top {}

div#footer-top-in {
  width: 970px;
  margin: 0 auto;
}

div#copyright {
  height: 68px !important;
  background: #344046;
  background: #344046;
  clear: both;
}

div#copyright-in {
  width: 970px;
  margin: 0 auto;
  padding: 0;
}

div#copyright-in > div.copyright-text {
  height: 21px;
  line-height: 21px;
  color: #969696 !important;
  font-size: 15px;
  float: left;
}

div#copyright-in > div#infoartnet {
  float: right;
}

div#copyright-in > div#infoartnet > a {
  width: 109px;
  height: 21px;
  display: inline-block;
  margin-right: 5px;
  text-indent: -9999px;
  background: transparent url('../gfx/logo-infoartnet.png') 0 0 no-repeat;
}

div#tajek {
    display: none;
    position: fixed;
    bottom: 60px;
    margin: auto;
    padding-left: 322px;
}

div#tajek div {
    background-color: rgba(255, 255, 255, 0.7);
    font-size: 20px;
    font-weight: bold;
    width: 640px;
    padding: 8px;
    background-image: url('../gfx/nyil.png');
    background-position: right center;
    background-repeat: no-repeat;
}

#logo img { margin: 6px 0 0 -18px; }

#comm100-float-button-2 { top: 517px !important; }

/* Fancybox */

#fancybox-title-over {
  width: 100%;
  color: #FFF;
}

/* Hatterkep */

body { overflow-x: hidden; }

site { background: #FFF; }

#hatterkep {
  top: 171px;
  width: 100%;
  display: block;
  position: absolute;
  text-align: center;
}

#hatterkep-in {
  top: 0;
  left: 50%;
  width: 1025px;
  height: 100%;
  position: absolute;
  margin-left: -512px;
  background: #FFF;
}

.portlet-content.box.part-user.simple {
    width: 216px;
    margin: 0 0 5px 30px;
    position: relative;
    float: left;
}

/* Tiszta tabla */
table.tiszta tbody tr td { border: 0 !important; }
table.tiszta tbody tr td img {
  width: 350px !important;
  margin: 0;
}
table.tiszta tbody tr td p {
  padding: 0 !important;
}



/* Media Queries */

@media only screen and (min-width: 1324px) {
  div#header-top-in,
  div#mainmenu-in,
  div#content,
  div#footer-top-in,
  div#copyright-in {
    width: 985px;
    padding-bottom: 35px;
  }
  div#header-cover {
    height: 109px;
    background: #96B94B;
    border-top: 1px #BBD18C solid;
  }
  .bal-slider { left: -215px; }
}

@media only screen and (min-width: 640px) and (max-width: 993px) {
  div#header-top-in,
  div#mainmenu-in,
  div#content,
  div#footer-top-in,
  div#copyright-in {
    width: 630px;
  }
  div#header-top-in {
    padding: 10px 0 40px;
  }
    div#header-top-in > div {
    left: -19px;
  }
    div#header {
    margin-bottom: 15px;
  }
    div#tajek {
    display: none;
    position: fixed;
    bottom: 60px;
    margin: auto;
    padding-left: 0;
  }
  div#tajek div {
    background-color: rgba(255, 255, 255, 0.7);
    font-size: 20px;
    font-weight: bold;
    width: 624px;
    padding: 8px;
  }
  div#header-cover {
    border-top: 1px #BFD491 solid;
    border-bottom: 1px #BFD491 solid;
    height: 91px;
  }
  div#header-top-in > div#logo {
    top: 52px;
    left: -18px;
    width: 228px;
    height: 130px;
    background: transparent url('../gfx/pp_logo_2.png') top left no-repeat;
    z-index: 99;
    cursor: pointer;
  }
  #header img {
     display: none;
  }
  div#header-top {
      height: 67px;
  }
  div#content div.box#widebox,
  div#content div.box#widebox div.box {
    width: 640px !important;
  }
  .bal-slider { display: none; }
  #hatterkep { display: none; }
  /* Tiszta tabla */
  table.tiszta tbody tr td img { width: 300px !important; }
}

@media only screen and (min-width: 480px) and (max-width: 639px) {
  div#header-top-in,
  div#mainmenu-in,
  div#content,
  div#footer-top-in,
  div#copyright-in {
    width: 98%;
  }
  div#header-top-in {
    padding: 10px 0 30px;
    text-align: left;
  }
  div#header-top-in > div {
    margin: 0 20px 10px 0;
  }
    div#header {
    margin-bottom: 0px;
  }
  div#tajek {
    display: none;
    position: fixed;
    bottom: 60px;
    margin: auto;
    padding-left: 0;
  }
  div#tajek div {
    background-color: rgba(255, 255, 255, 0.7);
    font-size: 20px;
    font-weight: bold;
    max-width: 639px;
    width: auto;
    margin-right: 6px;
    padding: 8px;
  }
  div#header-top {
    height: 90px;
  }
  div#header-top-in > div#logo {
    top: 85px;
  }
  div#header-top-in > div#logo img {
    display: none
  }
  div#header-cover {
    height: 92px;
    border-top: 1px #BFD491 solid;
    border-bottom: 1px #BFD491 solid;
  }
  div#header-top-in > div#logo {
    top: 95px;
    width: 180px;
    height: 83px;
    background: transparent url('../gfx/pp_logo_3.png') top left no-repeat;
    z-index: 30;
  }
  div#content div.box,
  div#footer-top-in div.box,
  div#content div.box#widebox,
  div#content div.box#widebox div.box {
    width: 100%;
  }
  div#copyright-in > div.copyright-text {
    float: none;
    text-align: center;
    padding: 0 0 10px;
  }
  div#copyright-in > div#infoartnet {
    float: none;
    text-align: center;
  }
  .bal-slider { display: none; }
  #hatterkep { display: none; }
  /* Tiszta tabla */
  table.tiszta tbody tr td img { width: 200px !important; }
}

@media only screen and (min-width: 320px) and (max-width: 479px) {
  div#header-top-in,
  div#mainmenu-in,
  div#content,
  div#footer-top-in,
  div#copyright-in {
    width: 98%;
  }
  div#header-top-in {
    padding: 10px 0 40px;
    text-align: left;
  }
  div#header-top-in > div {
    display: block;
    margin: 0 auto 3px;
  }
  div#header-top {
    height: 81px;
  }
  div#header {
    margin-bottom: 0px;
  }
  div#tajek {
    display: none;
    position: fixed;
    bottom: 60px;
    margin: auto;
    padding-left: 0;
  }
  div#tajek div {
    background-color: rgba(255, 255, 255, 0.7);
    font-size: 20px;
    font-weight: bold;
    max-width: 505px;
    width: auto;
    margin-right: 6px;
    padding: 8px;
  }
  div#header-top-in > div#logo {
    top: 130px;
  }
  div#header-top-in > div#logo img {
    display: none;
  }
  div#mainmenu {
    position: relative;
  }
  div#header-cover {
    height: 96px;
  }
  div#content div.box,
  div#footer-top-in div.box,
  div#content div.box#widebox,
  div#content div.box#widebox div.box {
    width: 100%;
  }
  div#copyright-in > div.copyright-text {
    float: none;
    text-align: center;
    padding: 0 0 12px;
    line-height: 1.1;
  }
  div#copyright-in > div#infoartnet {
    float: none;
    text-align: center;
  }
    div#header-top-in > div#logo {
    top: 88px;
    width: 180px;
    height: 83px;
    background: transparent url('../gfx/pp_logo_3.png') top left no-repeat;
    z-index: 30;
  }
  div#mainmenu-in {
    height: auto;
    padding: 0;
  }
  div#footer {
    height: 39px;
  }
  div#footer-top-in div.box {
    margin: 6px 0 0 -33px;
  }
  div#mainmenu {
      top: 0px;
  }
  div#header {
      min-height: 270px;
  }
  .bal-slider { display: none; }
  #hatterkep { display: none; }
   /* Tiszta tabla */
  table.tiszta { float: left; }
  table.tiszta tbody tr td img { width: 150px !important; }
}

@media only screen and (max-width: 319px) {
  div#noview {
    display: block;
  }
  div#tajek {
    display: none;
    position: fixed;
    bottom: 60px;
    margin: auto;
    padding-left: 0;
  }
  div#tajek div {
    background-color: rgba(255, 255, 255, 0.7);
    font-size: 20px;
    font-weight: bold;
    max-width: 319px;
    width: auto;
    margin-right: 6px;
    padding: 8px;
  }
  div#site {
    display: none;
  }
}



/* -------- Social -------- */

div#socials-share {
  position: fixed;
  bottom: 0;
  right: 0;
  z-index: 99999999;
  display: none;
}

div#socials-share > div.sosa-box {
  width: 310px;
  position: fixed;
  right: 0;
  bottom: 180px;
  margin-right: -310px;
}

div#socials-share > div.sosa-box.shadow {
  width: 310px;
  position: fixed;
  right: 0;
  bottom: 180px;
  margin-right: -310px;
  box-shadow: 0 0 12px #000;
}

div#socials-share > div.sosa-box > div {
  background: #333;
}

div#socials-share > div.sosa-box > a {
  width: 48px;
  height: 48px;
  display: block;
  text-indent: -9999px;
  position: absolute;
  z-index: 99;
}

div#socials-share > div.sosa-box > a#sosa-facebook {
  background: url('../gfx/facebook.png') 0 0 no-repeat;
  bottom: 452px;
  left: -48px;
}

div#socials-share > div.sosa-box > a#sosa-galeria {
  background: url('../gfx/gallery.png') 0 0 no-repeat;
  bottom: 402px;
  left: -48px;
}