@charset "utf-8";
                 
/* CSS Layout for mobile Website */



@media only screen and (max-width: 980px)
{

    html {
        font-size: 5vw;
    }

    h1 {
        font-size: 7vw;
    }
    
    h2 {
        font-size: 5vw;
    }
    
    h3 {
        font-size: 3vw;
    }
    
    .rgaccord1-content input[type="text"] {
        font-size: 4vw;
        width: 100%;
    }
    
    .rgaccord1-content textarea {
        font-size: 4vw;
        margin-top: 5px; 
        width: 100% 
    }  
    .rgaccord1-content .form-group.checkbox {
        width: 100%;
    }
    
    .rgaccord1-content input[type="submit"] {
        font-size: 4vw;
        margin-top: 15px; 
    } 

    .form-group .select {
        font-size: 4vw;
    }
    
    .rgaccord1-toggle {
        font-size: 4vw;
    }
    

    #menu-container {
        display: none;    
    }
    
    .left-menu-container {
        display: none; 
    } 
    
    .optional-slider {
        display: none;
    }
    
    .slide-down { 
        display: none;
    }
    
    
    .home-main {
        margin-top: 76px!important;    
    }
    
    .footer-links {
        display: block;
        margin: 15px 0;
        width: 80%;
    }   
    
    .header {
        height: 80px!important;
        box-shadow: 0px -4px 18px 11px rgba(0,0,0,0.59);
        -moz-box-shadow: 0px -4px 18px 11px rgba(0,0,0,0.59);
        -webkit-box-shadow: 0px -4px 18px 11px rgba(0,0,0,0.59);
    }
    
    
    .content-slider {
        margin-top: 78px!important;
    }
    
    .main {
        margin-top: 76px;
    }

    
    .ce-media img {
        width: auto;
        height: auto;
    }
    
    
    .ce-bodytext {
        font-size: 100%;
    }
    
    .ce-bodytext li {
        padding-left: 0;
    }
    
    .ce-bodytext li:before {
        font-size: 80%;
    }
    

    
    .mobile-menu-trigger {
        display: block;
        position:fixed;
        right: 15px;
        top: 0;
        font-size: 35px;
        z-index:5;
        color: #FFFFFF;
        cursor: pointer;
    }

    .mobile-menu-trigger:before {
        content: "\2630";
    }

    .mmt-active:before {
        content: "\2573"!important; 
        font-size: 24px;
        font-weight: bolder;
        vertical-align: 15%;
        margin-right: 3px;
        font-family: Open Sans Bold;
    }
    
    
    .mobile-menu-overlay {
        display: block!important;
        opacity: 0;
        position: fixed;
        top: 80px;
        z-index: -3;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, 0.95);
    }
    .mmo-active {
        opacity: 1!important;
        z-index: 3;
    }
    .mmo-not-active {
        opacity: 0;
        z-index: -3;
    }
    
    
    .mobile-menu {
        display: block!important;
        opacity: 0;
        position: fixed;
        z-index: 4;
        top: -100%;
        width: 100%;
        overflow: auto;
        height: 100%;
    }
    .mm-active {
        opacity: 1!important;
        top: 0;  
        -webkit-transition: top 0.5s; /* Safari */
        transition: top 0.5s;
    }
    .mm-not-active {
        opacity: 0; 
        top: -100%;
        -webkit-transition: top 0.5s ease 0s, opacity 0s ease 2s; /* Safari */
        transition: top 0.5s ease 0s, opacity 0s ease 2s;
    }
    
    .mobile-menu ul {
        margin-top: 80px;
        margin-bottom: 0;
        width: 100%;
        padding-left: 0;
        font-family: Open Sans Regular;
        font-size: 22pt;
    }
    
    .mobile-menu li {
        list-style: none;
        background-color: #FFFFFF;
        margin: 0;
        width: 100%;
        text-align: center;
        text-transform: uppercase;
        border-bottom: solid 1px #1b181a;
    }
    
    .mobile-menu .submenu {
        background-color: #7F6D37;
    }
    
    .mobile-menu li a {
        color: #000000;
        text-decoration: none;
    }
    
    
    .mobile-menu .submenu a {
    
        color: #FFFFFF;
        text-decoration: none;
    }
    
    .mobile-menu .act a {
        color: #826E37;
    } 
    
    .mobile-menu .submenu.act a {
        color: #000000;
    }
    
    
    .language-menu {
        right: auto;
        left: 40px;
        font-size: 15pt;
        top: 21px;
        width: 125px;
    }
    
    .language-menu .lang li {
        display: inline-block;
        position: static;
    }
    
    .language-menu .top-line {
        display: none;
    }
    
    .language-menu .top-line-active {
        display: none;
    }
    
    .language-menu a {
        font-size: 15pt;
    }
    
    .lang-active a {
        color: #826E37!important;
    }
    
    
    /* center and ydjustment of grid-images */
    
    .grid-wrapper {
        padding-top: 6%;
    }
    
    .grid-row {
        margin-bottom: 25px;
        margin-top: 10px;
    }
    
    .grid-row .content {
         margin-bottom: 0;
    }
  
    .grid-row .content .layout0 {
        width:100%;
        padding: 0;
    }
    .grid-row .content .layout0 .ce-gallery {
        width:100%;
        padding: 0;
        margin-left: 0;
        margin-bottom: 34px;
    }
    
    .grid-row .ce-column:last-child {
        width: 100%;
    }
    
    .grid-row .lightbox {
        display: inline-block;
        width: 100%;
    }
    
    .grid-row .ce-outer {
        right: 0;
        width:100%;
    }
    
    .grid-row .ce-inner {
        right: 0;
       width:100%;
    }
    
    .grid-row img {
        height: auto;
    }
    
    .ce-media img {
        width: 100%;
        height: auto;
        object-fit: cover;
    }
    
    
    .detail {
        border-radius: 3vw;
        font-size: 4vw;
        height: 5.7vw;
        width: 5.7vw;
    }
    /* **************************************************** */
    
    .grid-col-25,
    .grid-col-33 {
        float: none;
        width: 100%
    }

    .row {
         padding-top: 10px;
    }

    .home-main .row {
        padding-top:0;
    }

    .layout3 {
        display:block;
    }
    
    .footer {
        font-size: 100%;
    }
    
    .footer-menu-wrapper {
        display: inline-block;
    }
    
    
    .footer-menu-wrapper > li {
        margin-bottom: 50px;
    }
    
    .footer-menu {
        width: 100%;
    }
    
    .footer-bottom {
        margin-top: 0;
    }


  
}




@media only screen and (max-width: 600px)
{
    .language-menu {
        width: 40px;
        top: 0px;
    }
    
    .language-menu .lang li {
        display: block;
        position: relative;
    }
}




@media only screen and (max-width: 340px)
{
    .language-menu {
        left: 10px;
    }
}