﻿@media only screen and (max-width: 1050px) {
    /* FRONTPAGE
    ----------------------------- */
    .frontpage .header { height: 430px; }
    .frontpage .header h1 { font-size: 48px; }
    .frontpage .header h2 { font-size: 30px; }
    .frontpage .header .teaser { 
        font-size: 18px; 
        line-height: 18px; 
        padding: 20px 25px;
    }
    .frontpage .middleSection .section2 { 
        padding: 0 0 0 35px; 
        margin:0;
    }
    .frontpage .middleSection .section2 .section2-text{
        width: 100%;
        height: 270px;
        background: rgba(247,247,247, 0.75);
        float: none;
        padding: 15px 25% 15px 15px;
    }

    /* CONTENT
    ----------------------------- */
    .plantcare-details .lazyYT,
    .plantcare-details .lazyYT iframe{
        width: 100% !important;
    }
    .plant-details .mainimage img{
        height: auto !important;
    }
}

@media only screen and (min-width: 800px) and (max-width: 900px){
    /* HEADER
    ----------------------------- */
    .header .web-topmenu a
    {
        margin-left: 3%;
        font-size: 20px;
    }
    
}

@media only screen and (max-width: 800px){
    /* GLOBAL
    ----------------------------- */
    .mobile{ display: block; }
    .no-mobile{ display: none; }
    .wrapper { padding: 0; }
    
    /* HEADER
    ----------------------------- */
    .header .web-languages{ text-align: left !important; }
    .header .web-languages a { margin-top: 15px; }
    .header .searchbox { margin-top: 15px; }
    .header .web-servicemenu a
    {
        width: 100%;
        margin: 25px 0 0 0;
    }

    /* FOOTER
    ----------------------------- */
    .footer{
        height: auto;
        position: relative;
    }
    .footer .footerwrapper{
        padding: 15px;
    }
    .footer .footerwrapper .columns{
        float: none;
        margin: 0 auto 15px auto;
        width: 80%;
    }

    /* FRONTPAGE
    ----------------------------- */
    .frontpage .header { height: 430px; }
    .frontpage .header h1 { font-size: 32px; }
    .frontpage .header h2 { font-size: 20px; }
    .frontpage .header .teaser { 
        font-size: 18px; 
        line-height: 18px;
        bottom: 20px;
        width: 80%;
    }
    .frontpage .middleSection .small-12 { width: 100%; }
    .frontpage .middleSection .section2 { 
        padding: 0; 
        height: auto;
    }
    .frontpage .middleSection .section2 .section2-text { 
        padding: 20px 20px 40px 20px;
        height: auto;
    }
    .frontpage .plantSearch {
        padding: 25px 20px;
        height: 250px;
    }
    .frontpage .plantSearch .searcharea #searchbox{ max-width: 240px; }

    /* CONTENT
    ----------------------------- */
    .page-content {
        padding: 0 20px 0px 20px;
    }
    .side-menu{
        padding: 10px 15px 0px 15px;
    }
    .modeBar .columns .barButton select{
        width: auto;
    }
    .tropica-tabs{
        width: 89px;
        min-height: 56px !important; 
    }
    .tropica-tabs a{
        display: block;
        float: none !important;
        text-align: center;
        white-space: normal;
        padding: 10px 14px !important;
    }
    .tropica-tabs a img{
        display: inline-block !important;
        margin: 0 !important;
    }
    
    /* PLANTS 
    ------------------------- */
    
    .plantGallaryItemName 
    {
        font-weight:bold;
        margin-bottom:5px;
    }
    
    .plantGallaryItemDesc 
    {
        margin-bottom:10px;
    }
    
    .plantname h1 
    {
        font-size:24px;
    }
    
    /* LAYOUTS 
    ------------------------- */
    
    
    
    
    /* ARTICLES 
    ------------------------ */
    
    .article-content 
    {
            padding: 0 20px 20px 20px;
    }
    
    .article-content .jcarouselLayout img 
    {
        width:100%;
        height: auto !important;
    }
    
    
}