body{
    font-size: 1.3vw;
    line-height: 1.6em;
    font-family: 'Roboto', sans-serif;
    font-weight: 300;
    letter-spacing: .05em;
}

.invisible {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

#container {
  display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
  display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox;      /* TWEENER - IE 10 */
  display: -webkit-flex;     /* NEW - Chrome */
  display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
 }
 
#main {
  width: 75%;                 /* NEW, Spec - Opera 12.1, Firefox 20+ */
  margin-left: 25%;
}


#left {
  width: 25%;  
  position: fixed;
  left: 0;
  top: 0;
  height: 100%;
}
#left > .inside {
    height: 100%;
    min-height: 100%;
    display: flex;
    flex-direction: column;
}
#left #logo {
    margin: 5vw 0 5vw;
}
#left #logo figure{
    width: 70%;
    margin: auto;
}
#left #logo figure img{
    width: 100%;
}

#left .mod_navigation{
    width:65%;
    margin: 0 auto 0 25%;
    font-size: 1.3vw;
}
#left .vcard{
    /*position: absolute;
    bottom: 5vw;*/
    width:65%;
    margin: 0 auto 0 25%;
    color: #7f9027;
    font-size: .9em;
    margin-top: auto;
    margin-bottom: 5vw;
    padding-top:1vw;
}
a, a:link, a:visited{
    color: #7f9027;
    text-decoration: none;
}
a:hover{
    text-decoration: underline;
}
.mod_navigation li{
    position: relative;
}
.mod_navigation ul a, .mod_navigation ul span{
    display: inline-block;
    padding: .5vw 0;
    text-decoration: none;
    color: #666;
}
.mod_navigation ul a:before, .mod_navigation ul span:before{
    position: absolute;
    top: 40%;
    left:-1.3vw;
    width: .5vw;
    height: .5vw;
    display: inline-block;
    background: #7f9027;
    content: '';
    display: none;
}
.mod_navigation a:hover:before, .mod_navigation  a.trail:before, .mod_navigation span.active:before{
    display: block;
}

.mod_article{
    overflow: hidden;
}

#main ul{
    padding-left: 2vw; 
}
#main ul li{
    position: relative;
    padding-bottom: .6vw;
}
#main ul li::before{
    position: absolute;
    top: 25%;
    left:-1.6vw;
    width: .5vw;
    height: .5vw;
    display: inline-block;
    background: #7f9027;
    content: '';
}
#bgstretch{
    position: relative;
}
.noBgImg #bgstretch{
    display: none;
}
@-webkit-keyframes bounce {
 0%, 20%, 50%, 80%, 100% {-webkit-transform: translateY(0);} 
 40% {-webkit-transform: translateY(-30px);}
 60% {-webkit-transform: translateY(-15px);}
}
 
@-moz-keyframes bounce {
 0%, 20%, 50%, 80%, 100% {-moz-transform: translateY(0);}
 40% {-moz-transform: translateY(-30px);}
 60% {-moz-transform: translateY(-15px);}
}
 
@-o-keyframes bounce {
 0%, 20%, 50%, 80%, 100% {-o-transform: translateY(0);}
 40% {-o-transform: translateY(-30px);}
 60% {-o-transform: translateY(-15px);}
}
@keyframes bounce {
 0%, 20%, 50%, 80%, 100% {transform: translateY(0);}
 40% {transform: translateY(-30px);}
 60% {transform: translateY(-15px);}
}


.arrow {
  position: absolute;
  bottom: 0;
  left: 50%;
  margin-left:-20px;
  width: 40px;
  height: 40px;
  background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNi4wLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IiB3aWR0aD0iNTEycHgiIGhlaWdodD0iNTEycHgiIHZpZXdCb3g9IjAgMCA1MTIgNTEyIiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCA1MTIgNTEyIiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxwYXRoIGZpbGw9IiNGRkZGRkYiIGQ9Ik0yOTMuNzUxLDQ1NS44NjhjLTIwLjE4MSwyMC4xNzktNTMuMTY1LDE5LjkxMy03My42NzMtMC41OTVsMCwwYy0yMC41MDgtMjAuNTA4LTIwLjc3My01My40OTMtMC41OTQtNzMuNjcyICBsMTg5Ljk5OS0xOTBjMjAuMTc4LTIwLjE3OCw1My4xNjQtMTkuOTEzLDczLjY3MiwwLjU5NWwwLDBjMjAuNTA4LDIwLjUwOSwyMC43NzIsNTMuNDkyLDAuNTk1LDczLjY3MUwyOTMuNzUxLDQ1NS44Njh6Ii8+DQo8cGF0aCBmaWxsPSIjRkZGRkZGIiBkPSJNMjIwLjI0OSw0NTUuODY4YzIwLjE4LDIwLjE3OSw1My4xNjQsMTkuOTEzLDczLjY3Mi0wLjU5NWwwLDBjMjAuNTA5LTIwLjUwOCwyMC43NzQtNTMuNDkzLDAuNTk2LTczLjY3MiAgbC0xOTAtMTkwYy0yMC4xNzgtMjAuMTc4LTUzLjE2NC0xOS45MTMtNzMuNjcxLDAuNTk1bDAsMGMtMjAuNTA4LDIwLjUwOS0yMC43NzIsNTMuNDkyLTAuNTk1LDczLjY3MUwyMjAuMjQ5LDQ1NS44Njh6Ii8+DQo8L3N2Zz4=);
  background-size: contain;
}

.bounce {
  animation: bounce 2s infinite;
}
.arrow.hidden {
  display: none !important;
}

h1{
    font-family: 'Roboto Slab', serif;
    font-size: 4em;
    font-weight: 300;
    margin: 10vw 0 6vw 0;
    line-height: normal;
}
.noBgImg h1{
    font-family: 'Roboto Slab', serif;
    font-weight: 300;
    margin: 4.5vw 0 3vw 0;
    line-height: normal;
}
.noBgImg.vita h1{
    font-size: 2em;
    font-weight: 400;
    margin: 4.5vw 0 0 0;
}
h1.ce_headline{
    padding: 0 3vw;
}
h2{
    font-size: 1.3em;
    font-weight: 300;
    font-style: italic;
    margin: 3vw 0 2vw 0;
}
h3{
    font-size: 1em;
    font-weight: 400;
    margin-top: 0;
}
.ce_text{
    padding: 0 3vw;
}
.ce_text.last{
    margin-bottom: 5vw;
}
.grid30{
    width: 30%;
    float: left;
    box-sizing: border-box;
    padding: 0 3vw;
}
.grid40{
    width: 40%;
    float: left;
    box-sizing: border-box;
    padding: 0 3vw;
}
.grid50{
    width: 50%;
    float: left;
    box-sizing: border-box;
    padding: 0 3vw;
}
.grid60{
    width: 60%;
    float: left;
    box-sizing: border-box;
    padding: 0 3vw;
}
.grid70{
    width: 70%;
    float: left;
    box-sizing: border-box;
    padding: 0 3vw;
}
.grid100{
    width: 100%;
    float: none;
    clear: both;
    box-sizing: border-box;
    padding: 0 3vw;
}
.noBgImg .ce_image{
    margin-top: 5vw;
}
table td{
    padding-right: 1vw;
}
table td:first-child{
    white-space: nowrap;
}
.ce_image img{
    width: 100%;
    height: auto;
}
#bgstretch .bs-nav{
    position: absolute;
    bottom: 1vw;
    text-align: center;
}
.bs-nav .item, .bs-nav .item-nav {
    display: inline-block;
    zoom: 1;
    width: 1vw;
    height: 1vw;
    line-height: 1vw;
    margin: 0 .5vw;
    text-indent: -999em;
    border: 2px solid #fff;
    border-radius: 0;
    cursor: pointer;
    opacity: .4;
    background: #fff;
    -webkit-transition: background .5s, opacity .5s;
    -moz-transition: background .5s, opacity .5s;
    transition: background .5s, opacity .5s;
}

.mod_navigation_pageimages{
    clear: both;
    margin: 2vw 0 4vw 0;
    overflow: hidden;
    padding-top: 4vw;
}
.mod_navigation_pageimages ul {
    padding-left: 0 !important;
    margin-left: -1.5vw;
    margin-right: 1.5vw;
}
.mod_navigation_pageimages ul li{
    float: left;
    width: 33%;
    padding:1.5vw !important;
    box-sizing: border-box;
}
.mod_navigation_pageimages ul li .image_container{
    width: 100%;
    padding-bottom:100%;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    position: relative;
    overflow: hidden;
}
.mod_navigation_pageimages ul li .image_container .title_overlay_outer{
    position: absolute;
    bottom: -33%;
    width: 100%;
    height:33%;
    background: #fff;
    
}
.mod_navigation_pageimages ul li .image_container .title_overlay{
    width: 100%;
    height:100%;
    display: table;
}
.mod_navigation_pageimages ul li .image_container .title_overlay_inner{
    display: table-cell;
    text-align: center;
    vertical-align: middle;
}
.mod_navigation_pageimages ul li a{
    color: #000;
    text-decoration: none;
    font-size: 1.4em;
}


.mod_navigation_pageimages ul li img{
    width: 100%;
    height: auto;
    display: block;
}
.mod_navigation_pageimages ul li::before{
    display: none !important;
}

.ce_gallery {
    margin: 0 2vw 2vw;
    overflow: hidden;
}
    
.ce_gallery ul{
    list-style: none;
    padding: 0 !important;
}
.ce_gallery ul li{
    float: left;
    padding: 1vw;
    width: 33%;
    box-sizing: border-box;
}
.ce_gallery ul li::before {
    display: none !important;
}
.ce_gallery ul li figure{
    width: 100%;
    
}
.ce_gallery ul li figure img{
    width: 100%;
    display: block;
    height: auto;
}
.ce_form {
    margin: 0 3vw;
}
.ce_form .widget{
    float: none;
    clear: both;
    
}
.ce_form .widget.form50{
    width:50%;
    box-sizing: border-box;
    float: left;
    clear: none;
}
.ce_form .widget{
    background: #f3f9ed;
    margin: 2vw 0;
    padding: 0 1vw;
    line-height: 3vw;
}
.ce_form input{
    background: transparent;
    line-height: 3vw;
    padding: 0;
    border: none;
}
.ce_form label{
    margin-right: 1vw;
}
.ce_form input{
    width: 100%
}
.ce_form span.input_wrapper {
    display: block;
    overflow: hidden;
    padding-right:10px;
}
.ce_form label{
    float: left;
}
.ce_form .widget-textarea label{
    float: none;
    display: block;
}
.ce_form .widget-textarea textarea {
    width: 100%;
    height: 15vw;
    border: none;
    background: transparent;
}
.ce_form .widget-captcha input{
    width: 5vw;
    border: 1px dashed #7f9027;
    margin-right: 1vw;
}
.ce_form input.submit {
    width: auto;
    padding: 0 2vw;
    cursor: pointer;
    background: #f3f9ed;
}
.ce_form input.submit:hover {
    color: #fff;
    background: #7f9027;
}


@media (max-width: 970px){
    body{
        font-size: 13px;
    }
}
@media (min-width: 1401px){
    body{
        font-size: 18px;
    }
}

@media (max-width:767px){
    h1 {
        font-size: 2em;
    }
    h1.ce_headline {
        padding: 0 5vw;
    }
    #wrapper{
        clear: both;
        float: none;
    }
    #container{
        display: -webkit-box;
        display: -moz-box;
        display: box;
    
        -webkit-box-orient: vertical;
        -moz-box-orient: vertical;
        box-orient: vertical;
        margin-bottom: 6em;
    }
    #main {
        width: 100%;
        margin-left: 0;
        -webkit-box-ordinal-group: 3;
        -moz-box-ordinal-group: 3;
        box-ordinal-group: 3;
    }
    
    #left {
        margin-top: -44px;
        width: 100%;
        position: relative;
        left: auto;
        height: auto;
        -webkit-box-ordinal-group: 2;
        -moz-box-ordinal-group: 2;
        box-ordinal-group: 2;
    }
    #left #logo {
        margin: 5vw 0 3vw;
    }
    #left #logo figure {
        width: 70%;
        margin: 5vw 5vw 3vw;
    }
    #left .vcard{
        position: fixed;
        bottom: 0;
        width: 100%;
        margin: 0;
    }
    #left .vcard .adr{
        display: none;
    }
    #left .vcard .tel, #left .vcard div.email{
        width: 50%;
        box-sizing: border-box;
        color: #fff;
        background: #7f9027;
        display: block;
        float: left;
        height: 5em;
        padding: 8px;
        border-top:2px solid #fff;
    }
    #left .vcard div.email{
        border-left:1px solid #fff;
    }
    #left .vcard .tel{
        border-right:1px solid #fff;
    }
    #left .vcard .tel a, #left .vcard .email a{
        width: 100%;
        box-sizing: border-box;
        display: block;
        height: 100%;
        text-indent: -999999px;
        background-repeat: no-repeat;
        background-position: center center;
        background-size: contain;
    }
    #left .vcard .tel a{
        background-image: url(../images/icons/phone.png);
    }
    #left .vcard .email a{
        background-image: url(../images/icons/mail.png);
    }
    .ce_text {
        padding: 0 5vw;
    }
    .grid30, .grid40, .grid50, .grid60, .grid70{
        width: auto;
        float: none;
        box-sizing: border-box;
        padding: 0 5vw;
    }
    .ce_form {
    margin: 0 5vw;
}
    .ce_form .widget.form50 {
        width: auto;
        float: none;
        clear: both;
    }
    .ce_form input {
        line-height: 2.5em;
    }
    .ce_form label {
        line-height: 2.5em;
    }
    .ce_form .widget-captcha  {
        padding-bottom: .5em;
    }
    .ce_form .widget-captcha input {
        width: 3em;
    }
    .ce_form .widget-captcha label {
        display: block;
        float: none;
    }
    .ce_form .widget-captcha span {
        float: left;
        line-height: 2.5;
        margin-right: .5em;
    }
    .ce_form input.submit {
        width: 100%;
        
    }
    .mod_navigation_pageimages ul {
        margin-left: 2vw;
        margin-right: 2vw;
    }
    .mod_navigation_pageimages ul li {
        width: 50%;
        padding: 3vw !important;
    }
    .mod_navigation_pageimages ul li .image_container .title_overlay_outer {
        bottom: 0;
        height: 20%;
    }
    .mod_navigation_pageimages ul li a {
        font-size: .9em !important;
    }
    #main ul {
        padding-left: 15px;
    }
    #main ul li::before {
        left: -15px;
        width: 5px;
        height: 5px;
    }
    .ce_gallery {
        margin: 0 4vw 2vw;
    }
}