/*
    Colorbox Core Style:
    The following CSS is consistent between example themes and should not be altered.
*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxWrapper {max-width:none;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:auto; -webkit-overflow-scrolling: touch;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block; max-width:none; -ms-interpolation-mode:bicubic;}
.cboxIframe{width:100%; height:100%; display:block; border:0; padding:0; margin:0;}
#colorbox, #cboxContent, #cboxLoadedContent{box-sizing:content-box; -moz-box-sizing:content-box; -webkit-box-sizing:content-box;}

/* 
    User Style:
    Change the following styles to modify the appearance of Colorbox.  They are
    ordered & tabbed in a way that represents the nesting of the generated HTML.
*/
#cboxOverlay{background:#fff; opacity: 0.9; filter: alpha(opacity = 90);}
#colorbox{outline:0;}
    #cboxTopLeft{width:25px; height:25px; background:url(../bundles/inperopage/img/border1.png) no-repeat 0 0;}
    #cboxTopCenter{height:25px; background:url(../bundles/inperopage/img/border1.png) repeat-x 0 -50px;}
    #cboxTopRight{width:25px; height:25px; background:url(../bundles/inperopage/img/border1.png) no-repeat -25px 0;}
    #cboxBottomLeft{width:25px; height:25px; background:url(../bundles/inperopage/img/border1.png) no-repeat 0 -25px;}
    #cboxBottomCenter{height:25px; background:url(../bundles/inperopage/img/border1.png) repeat-x 0 -75px;}
    #cboxBottomRight{width:25px; height:25px; background:url(../bundles/inperopage/img/border1.png) no-repeat -25px -25px;}
    #cboxMiddleLeft{width:25px; background:url(../bundles/inperopage/img/border2.png) repeat-y 0 0;}
    #cboxMiddleRight{width:25px; background:url(../bundles/inperopage/img/border2.png) repeat-y -25px 0;}
    #cboxContent{background:#fff; overflow:hidden;}
        .cboxIframe{background:#fff;}
        #cboxError{padding:50px; border:1px solid #ccc;}
        #cboxLoadedContent{margin-bottom:20px;}
        #cboxTitle{position:absolute; bottom:0px; left:0; text-align:center; width:100%; color:#999;}
        #cboxCurrent{position:absolute; bottom:0px; left:100px; color:#999;}
        #cboxLoadingOverlay{background:#fff url(../img/loading.gif) no-repeat 5px 5px;}

        /* these elements are buttons, and may need to have additional styles reset to avoid unwanted base styles */
        #cboxPrevious, #cboxNext, #cboxSlideshow, #cboxClose {border:0; padding:0; margin:0; overflow:visible; width:auto; background:none; }
        
        /* avoid outlines on :active (mouseclick), but preserve outlines on :focus (tabbed navigating) */
        #cboxPrevious:active, #cboxNext:active, #cboxSlideshow:active, #cboxClose:active {outline:0;}

        #cboxSlideshow{position:absolute; bottom:0px; right:42px; color:#444;}
        #cboxPrevious{position:absolute; bottom:0px; left:0; color:#444;}
        #cboxNext{position:absolute; bottom:0px; left:63px; color:#444;}
        #cboxClose{position:absolute; bottom:0; right:0; display:block; color:#444;}

/*
  The following fixes a problem where IE7 and IE8 replace a PNG's alpha transparency with a black fill
  when an alpha filter (opacity change) is set on the element or ancestor element.  This style is not applied to or needed in IE9.
  See: http://jacklmoore.com/notes/ie-transparency-problems/
*/
.cboxIE #cboxTopLeft,
.cboxIE #cboxTopCenter,
.cboxIE #cboxTopRight,
.cboxIE #cboxBottomLeft,
.cboxIE #cboxBottomCenter,
.cboxIE #cboxBottomRight,
.cboxIE #cboxMiddleLeft,
.cboxIE #cboxMiddleRight {
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF);
}
html {
  box-sizing: border-box; }

*, *::after, *::before {
  box-sizing: inherit; }

button, input[type="button"], input[type="reset"], input[type="submit"],
button {
  -webkit-appearance: none;
  -moz-appearance: none;
  -ms-appearance: none;
  -o-appearance: none;
  appearance: none;
  -webkit-font-smoothing: antialiased;
  background-color: #477dca;
  border-radius: 3px;
  border: none;
  color: #fff;
  cursor: pointer;
  display: inline-block;
  font-family: "Helvetica Neue", "Helvetica", "Roboto", "Arial", sans-serif;
  font-size: 1em;
  font-weight: 600;
  line-height: 1;
  padding: 0.75em 1em;
  text-decoration: none;
  user-select: none;
  vertical-align: middle;
  white-space: nowrap; }
  button:hover, button:focus, input[type="button"]:hover, input[type="button"]:focus, input[type="reset"]:hover, input[type="reset"]:focus, input[type="submit"]:hover, input[type="submit"]:focus,
  button:hover,
  button:focus {
    background-color: #2c5999;
    color: #fff; }
  button:disabled, input[type="button"]:disabled, input[type="reset"]:disabled, input[type="submit"]:disabled,
  button:disabled {
    cursor: not-allowed;
    opacity: 0.5; }

fieldset {
  background-color: #f7f7f7;
  border: 1px solid #ddd;
  margin: 0 0 0.75em;
  padding: 1.5em; }

input,
label,
select {
  display: block;
  font-family: "Helvetica Neue", "Helvetica", "Roboto", "Arial", sans-serif;
  font-size: 1em; }

label {
  font-weight: 600;
  margin-bottom: 0.375em; }
  label.required::after {
    content: "*"; }
  label abbr {
    display: none; }

input[type="color"], input[type="date"], input[type="datetime"], input[type="datetime-local"], input[type="email"], input[type="month"], input[type="number"], input[type="password"], input[type="search"], input[type="tel"], input[type="text"], input[type="time"], input[type="url"], input[type="week"], textarea,
select[multiple=multiple],
textarea {
  background-color: #fff;
  border: 1px solid #ddd;
  border-radius: 3px;
  box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.06);
  box-sizing: border-box;
  font-family: "Helvetica Neue", "Helvetica", "Roboto", "Arial", sans-serif;
  font-size: 1em;
  margin-bottom: 0.75em;
  padding: 0.5em;
  transition: border-color;
  width: 100%; }
  input[type="color"]:hover, input[type="date"]:hover, input[type="datetime"]:hover, input[type="datetime-local"]:hover, input[type="email"]:hover, input[type="month"]:hover, input[type="number"]:hover, input[type="password"]:hover, input[type="search"]:hover, input[type="tel"]:hover, input[type="text"]:hover, input[type="time"]:hover, input[type="url"]:hover, input[type="week"]:hover, textarea:hover,
  select[multiple=multiple]:hover,
  textarea:hover {
    border-color: #c4c4c4; }
  input[type="color"]:focus, input[type="date"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="email"]:focus, input[type="month"]:focus, input[type="number"]:focus, input[type="password"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="text"]:focus, input[type="time"]:focus, input[type="url"]:focus, input[type="week"]:focus, textarea:focus,
  select[multiple=multiple]:focus,
  textarea:focus {
    border-color: #477dca;
    box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.06), 0 0 5px rgba(55, 112, 192, 0.7);
    outline: none; }

textarea {
  resize: vertical; }

input[type="search"] {
  -webkit-appearance: none;
  -moz-appearance: none;
  -ms-appearance: none;
  -o-appearance: none;
  appearance: none; }

input[type="checkbox"],
input[type="radio"] {
  display: inline;
  margin-right: 0.375em; }

input[type="file"] {
  padding-bottom: 0.75em;
  width: 100%; }

select {
  margin-bottom: 1.5em;
  max-width: 100%;
  width: auto; }

ul,
ol {
  list-style-type: none;
  margin: 0;
  padding: 0; }
dl {
  margin-bottom: 0.75em; }
  dl dt {
    font-weight: bold;
    margin-top: 0.75em; }
  dl dd {
    margin: 0; }

table {
  -webkit-font-feature-settings: "kern", "liga", "tnum";
  -moz-font-feature-settings: "kern", "liga", "tnum";
  -ms-font-feature-settings: "kern", "liga", "tnum";
  font-feature-settings: "kern", "liga", "tnum";
  border-collapse: collapse;
  margin: 0.75em 0;
  table-layout: fixed;
  width: 100%; }

th {
  border-bottom: 1px solid #b7b7b7;
  font-weight: 600;
  padding: 0.75em 0;
  text-align: left; }

td {
  border-bottom: 1px solid #ddd;
  padding: 0.75em 0; }

tr,
td,
th {
  vertical-align: middle; }

body {
  -webkit-font-feature-settings: "kern", "liga", "pnum";
  -moz-font-feature-settings: "kern", "liga", "pnum";
  -ms-font-feature-settings: "kern", "liga", "pnum";
  font-feature-settings: "kern", "liga", "pnum";
  -webkit-font-smoothing: antialiased;
  color: #333;
  font-family: "Helvetica Neue", "Helvetica", "Roboto", "Arial", sans-serif;
  font-size: 1em;
  line-height: 1.5; }

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Helvetica Neue", "Helvetica", "Roboto", "Arial", sans-serif;
  font-size: 1em;
  line-height: 1.2;
  margin: 0 0 0.75em; }

p {
  margin: 0 0 0.75em; }

a {
  color: #477dca;
  text-decoration: none;
  transition: color 0.1s linear; }
  a:active, a:focus, a:hover {
    color: #2c5999; }
  a:active, a:focus {
    outline: none; }

hr {
  border-bottom: 1px solid #ddd;
  border-left: none;
  border-right: none;
  border-top: none;
  margin: 1.5em 0; }

img,
picture {
  margin: 0;
  max-width: 100%; }

@font-face {
  font-family: Calibri;
  src: url(../../fonts/Calibri.ttf); }
/* ***************************** custom styles *********************************** */

.clearfix::after {
  clear: both;
  content: "";
  display: table; }

img.responsive {
  display: block;
  width: 100%; }

body > section {
  min-width: 300px;
}

.btn {
  border: 1px solid #dc002e;
  padding-left: 23px;
  padding-right: 23px;
  font-weight: bold;
  display: inline-block;
  color: #dc002e; }
  .btn.btn-sm {
    font-size: 1.15em;
    line-height: 30px; }
  .btn.btn-md {
    font-size: 1.3em;
    line-height: 40px; }
  .btn.btn-lg {
    font-size: 2em;
    line-height: 50px; }
  .btn:hover {
    color: #dc002e; }
  .btn.btn-grey {
    color: #2c2c2c;
    border: 1px solid #2c2c2c;
    background: white; }
  .btn.btn-white {
    color: #dc002e;
    border: none;
    background: white; }

.center {
  text-align: center; }

body {
  font-family: Calibri, Arial;
  margin: 0;
  padding: 0;
  font-size: 14px; }

h1, h2, h3, h4, h5, p, a {
  font-family: Calibri, Arial !important; }

section#s1 {
  border-top: 3px solid #009534; }
  section#s1 header {
    height: 128px;
    line-height: 124px; }
    section#s1 header #logo {
      float: left; }
      section#s1 header #logo img {
        vertical-align: middle; }
    section#s1 header #menu {
      float: right; }
      section#s1 header #menu ul {
        margin: 0;
        padding: 0; }
        section#s1 header #menu ul li {
          display: inline-block;
          list-style: none;
            height: 40px;}
          section#s1 header #menu ul li a {
            padding: 0 15px;
            color: #474747;
            text-transform: uppercase;
            font-size: 1.4em; }
            section#s1 header #menu ul li a:hover {
              color: #009534;
              font-weight: bold;
              text-decoration: none;}

section#s2 {
  background-image: url(../../bundles/inperopage/img/s2-bg.jpg);
  background-position: center top;
  background-repeat: no-repeat; }
  section#s2 #slider {
    background-image: url(../../bundles/inperopage/img/slider-shadow.jpg);
    background-position: center bottom;
    background-repeat: no-repeat;
    padding-bottom: 30px; }
    section#s2 #slider ul {
      margin: 0;
      padding: 0;
      display: block; }
      section#s2 #slider ul li {
        margin: 0;
        padding: 0;
        display: block; }
        section#s2 #slider ul li img {
          display: block;
          max-width: 1061px; }

section#s3 {
  padding-bottom: 1.5em;
  padding-top: 1em; }
  section#s3 .left-part {
    float: left;
    width: 69.23077%;
    box-sizing: border-box;
    padding-right: 3em; }
  section#s3 h1 {
    color: #009534;
    font-size: 2em;
    margin-bottom: 0.2em; }
  section#s3 h2 {
    margin-top: 1em;
    color: #009534;
    font-size: 1.6em;
    margin-bottom: 0.2em; }
  section#s3 .description h3 {
    font-size: 1.5em;
    margin-bottom: 0;
  }
  section#s3 p {
    text-align: justify;
    font-size: 1.2em; }
  section#s3 .right-part {
    float: right;
    width: 30.76923%; }
section#s3 .form {
  clear: both;
  padding: 3em 20%;
}
section#s3 .form .btn {
  border: 1px solid #025202;
  color: white;
  background: #009534;
  border-radius: 0;

}
section#s3 .form .alert {
  border: 1px solid green;
  width: 100%;
  padding: 1em;
  box-sizing: border-box;
}
section#s4 {
  background: #e2e2e2;
  padding-top: 1.5em;
  padding-bottom: 1.5em; }
  section#s4 h2 {
    color: #565e58;
    font-size: 2em;
    text-align: center;
    text-transform: uppercase;
    font-weight: normal;
    margin-bottom: 0.2em; }

#grid {
  padding: 2em 0; }
  #grid:after {
    clear: both; }
  #grid.choose .element {
    width: 48.07692%; }
    #grid.choose .element:nth-child(2n) {
      margin-right: 0; }
  #grid .element {
    position: relative;
    float: left;
    width: 30.76923%;
    margin-right: 3.84615%;
    margin-bottom: 2em;
    overflow: hidden; }
    #grid .element:nth-child(3n) {
      margin-right: 0; }
    #grid .element:nth-child(3n+1) {
      clear: both; }

    #grid .element img {
      display: block;
      width: 100%; }
    #grid .element .overlay {
      background: #dc002e;
      opacity: 0.3;
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      -webkit-transition: all 0.3s;
      -moz-transition: all 0.3s;
      transition: all 0.3s; }
    #grid .element .info {
      -webkit-transition: all 0.3s;
      -moz-transition: all 0.3s;
      transition: all 0.3s;
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      color: white;
      text-align: center; }
      #grid .element .info h2 {
        color: white;
        font-size: 2.5em;
        border-bottom: 1px solid white;
        display: inline-block;
        padding: 0.3em;
        margin: 0;
        margin-bottom: 0.3em; }
      #grid .element .info p {
        text-align: center; }

section#s5 {
  padding: 3em 0; }
  section#s5 .left-part {
    float: left;
    width: 69.23077%;
    box-sizing: border-box; }
    section#s5 .left-part h2 {
      color: #009534;
      font-size: 2em;
      margin-bottom: 0.2em; }
    section#s5 .left-part p {
      font-size: 1.2em; }
  section#s5 .right-part {
    float: right;
    width: 30.76923%;
    box-sizing: border-box;
    text-align: center; }
    section#s5 .right-part.btn-area {
      padding: 2em 0; }

section#s6 {
  background: url(../../bundles/inperopage/img/footer-bg.jpg) no-repeat center top #222222; }
  section#s6 footer {
    color: white; }
    section#s6 footer h2, section#s6 footer p {
      text-align: center; }
    section#s6 footer h2 {
      font-size: 4em;
      text-transform: uppercase;
      font-weight: normal;
      padding-top: 0.5em; }
    section#s6 footer p {
      font-size: 1.2em; }
      section#s6 footer p img {
        padding: 0 0.5em; }
    section#s6 footer a {
      color: white; }
    section#s6 footer .copyright {
      padding: 0.3em 0;
      margin-top: 1em; }
      section#s6 footer .copyright .left {
        float: left; }
      section#s6 footer .copyright .right {
        float: right; }

.bx-wrapper .bx-viewport {
  border: none;
  box-shadow: none; }

.cols-4 {
  width: 30.76923%;
  float: left; }

.cols-9 {
  width: 69.23077%;
  float: left; }

.offset-2 {
  margin-left: 15.38462%; }

.description {
  float: left;
  width: 53.84615%;
  padding-bottom: 3em;
    padding-left: 5px;
    padding-right: 5px;}
  .description .table {
    border-bottom: 1px solid #ccc;
    border-top: 1px solid #ccc;
    padding: 10px;
    margin: 10px 0 20px; }
  .description .hcell {
    clear: both;
    float: left;
    width: 38.46154%;
    color: #565e58;
    text-align: right;
    padding: 3px;
    box-sizing: border-box; }
  .description .dcell {
    float: left;
    width: 61.53846%;
    color: black;
    padding: 3px;
    box-sizing: border-box; }
  .description h2 {
    margin-top: 0.8em;
    margin-bottom: 0.4em; }

.images {
  float: left;
  width: 46.15385%;
  text-align: center;
  padding-bottom: 3em; }
  .images img {
    margin: 1em; }

.news {
  padding-top: 30px;
  padding-bottom: 30px;
}
.news:after {
  clear: both;
}
.news h2{
  font-size: 1.4em;
}
.media {
  clear: both;
}
.media:after {
  clear: both;
}
.media-left {
  float: left;
  width: 133px;
}
.media-left img.media-object {
  display: block;
  width: 100%;
}
.media-body {
  float: left;
  width: calc(100% - 133px);
  box-sizing: border-box;
  padding: 0 0 0px 20px;
}
.hero {
  margin: 10px auto;
  display: block;
}
.data{
  color: grey;
}

#nav, .nav, #nav .nav li { margin:0px; padding:0px; }
#nav li { cursor:pointer; list-style:none; position:relative;}
#nav li ul.first {left:-1px; top:100%;}

#nav .nav li { width:100%; text-indent:10px; line-height:30px; margin-right:10px;}
#nav li a {display:block; width:inherit; height:inherit;}

ul.nav { display:none; }
#nav li:hover > a, #nav li:hover {  }
li:hover > .nav { display:block; position:absolute; width:200px; top:-2px; left:50%; z-index:1000;} 
#nav li:hover { position:relative; z-index:2000; } 

@media all and (min-width: 1070px)
{
    .page-width 
    {
        width: 1061px;
        margin: 0 auto;
        padding: 0 10px;
    }
}

@media all and (max-width: 1070px)
{
    .page-width 
    {
        max-width: 1061px;
        margin: 0 auto;
        padding: 0 10px;
    }
}

@media all and (max-width: 1010px)
{  
    section#s1 header 
    {
        height: 128px;
        line-height: 0;
    }
    
    section#s1 header #menu
    {
        background: url(../bundles/inperopage/img/menu.png);
        background-repeat: no-repeat;
        background-size: 30px 30px;
        cursor: pointer;
        width: 30px;
        height: 30px;
        margin-top: 50px;
    }
    
    section#s1 header #menu ul
    {
        background: #ffffff;
        z-index: 100;
        position: absolute;
        right: 10px;
        display: none;
        padding-top: 50px;
        height: 290px;
    }
    
    section#s1 header #menu:hover ul
    {
        display: block;
    }
        
    section#s1 header #menu ul li 
    {
        display: block;        
        width: 200px;
        margin: 0;
        padding: 0;
        padding-top: 20px;
        border-bottom: 2px solid #009534;
    }
    
     section#s1 header #menu ul li:last-child
    {
        border-bottom: 0;
    }
}

.map 
{
  float: right;
}

.adres
{
  float: left;
}

@media all and (max-width: 990px)
{
    
    #grid.cols-9 .element .info h2
    {
        font-size: 2em;
    }
    
}


@media all and (max-width: 800px)
{
    #grid .element,
    #grid.cols-9 .element
    {
        width: 100%;
    }
    
     #grid.cols-9 .element .info h2
    {
        font-size: 3em;
    }
    
    
}
    
@media all and (max-width: 700px)
{
    .description,
    .images
    {
        float: none;
        clear: both;
        width: 100%;
    }
    
     #grid.cols-9 .element .info h2
    {
        font-size: 2.5em;
    }
    
    .media-left,   
    .media-body
    {
        float: none;
        clear: both;
        margin-left: auto;
        margin-right: auto;
    }
    
    .media-left
    {
        width: 300px;
    }
    
    .media-left img.media-object
    {
        width: 100%;
        height: auto;
    }
    
    .media-body
    {
        width: 90%;
    }

    .map, 
    .adres
    {
      float: none;
      clear: both;
      width: 100%;
    }


}

@media all and (max-width: 500px)
{
    #grid.cols-9
    {
        width: 100%;
        margin-left: auto;
        margin-right: auto;
    }
    
     #grid.cols-9 .element .info h2
    {
        font-size: 2em;
    }
}

