/*
************************************************************
Styles:     flix//theme
Project:    flix-Base - Main CSS
Autor:      Yannik Boost
Copyright:  (c) 2015 interaktiv manufaktur
Website:    www.interaktiv-manufaktur.de
************************************************************
*/
@media only screen and (max-width: 480px) {

   .lang-selector .lang-text{
      display: none !important;
   }

   .overviewpages-main .text-container{
      width: 100%;
      margin: 0px;
      padding-top: 10px;
   }

   /*#### gallery-list #####*/

   .gallery-list-main .item{
      width: 100%;
      margin-left: 0px;
   }

   .lang-selector{
      width: 115px;
   }


   /*****************************************************************
   *********** Document
   ******************************************************************/

   /*****************************************************************
   *********** Allgemeine Selectoren
   ******************************************************************/

   /*****************************************************************
   *********** Header
   ******************************************************************/

   /*****************************************************************
   *********** Footer
   ******************************************************************/
   #footer-canvas .column {
      width: 100%;
      padding-bottom: 25px;
   }
   
   .logo-footer {
    width: 100%;
    margin: auto;
    padding-bottom: 50px;
}

   /*****************************************************************
   *********** Content
   ******************************************************************/

   /*****************************************************************
   *********** Seitenelemente
   ******************************************************************/




   .text-image-main .left-column .text, .text-image-main .right-column .text{
      box-sizing: border-box;
      max-width: 100%;
      position: relative;
      transform: translateY(0%);
      top: 0px;
   }

   .text-image-main .left-column{
      width: 100%;
      float: none;
      height: auto;
      overflow: hidden;
   }

   .text-image-main .right-column {
      width: 100%;
      overflow: hidden;
      float: none;
      height: auto;
   }

   .text-image-main .left-column .text{
      padding: 25px 40px !important;
      text-align: left;
   }

   .text-image-main .left-column .text{
      padding: 0px !important;
      text-align: left;
   }
   .scroll-to-top-div{
      width: 100% !important;
      bottom: 0px !important;
      left: 0px;
      background-color: #D7AE86;
   }

   #scroll-to-top{
      display: block;
      margin: auto;
      width: 75px !important;
   }

   .info-teaser-main .info {
      width: 100%;
      margin: 10px 0;
   }

   .contactform .textbox {
      width: 80% !important;
      margin: 10px 0;
   }

   .contactform .form-row.nachricht{
      display: block;
   }
   .contactform #nachricht {

      width: 80%;
      margin-top: 10px;
   }
   .contactform .button-submit {
      width: 100%;
      margin-left: 10px !important;
   }

   .teaser-start img {
         width: 75%;
      }
      
   .teaser-start p {
         width: 75%;
   } 

   .gallery-image{
      width: 100%;
      margin: 0px 0px 5px;
   }

   .slick-prev, .slick-next{
      background-size: 65%;
   }
   .ort-input{
      width: calc(70% - 30px);
   }

}


@media only screen and (max-width: 520px) {
   .news-list .image-container{
      width: 100%;
      margin: 0px;
      float: none;
   }
   .news-list .text-container{
      float: none;
      width: 100%;      
      overflow: hidden;
      max-width: 100%;
   }

   .overviewpages-main .image-container{
      width: 100%;
      margin: 0px;
   }
   .overviewpages-main .image-container img{
      width: 100%;
   }

   .overviewpages-main .text-container{
      float: left;
      width: 100%;      
      margin-left: 0px;
      padding: 5px 0px 5px 5px;
   }
   
   .teaser-start img {
         width: 75%;
      }
   .teaser-start p {
         width: 75%;
   } 
}

@media only screen and (max-width: 420px) {
   .gallery-list-main, .gallery-container {
    grid-template-columns: 1fr;
    grid-gap: 16px;
}

.teaser-start img {
      width: 75%;
   }
   .teaser-start p {
         width: 75%;
   } 
}