/*<license>
Copyright (c) 2010, 2011, triptic bv
All Rights Reserved.

This source is subject to the qdo LICENSE AGREEMENT.
Please see the 'license.txt' file for more information.
All other rights reserved.

THIS CODE AND INFORMATION ARE PROVIDED "AS IS" WITHOUT WARRANTY OF ANY
KIND, EITHER EXPRESSED OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE
IMPLIED WARRANTIES OF MERCHANTABILITY AND/OR FITNESS FOR A
PARTICULAR PURPOSE.
</license>*/
@media screen and (max-width: 980px) {
    div.sitewidth           { width: 720px; }
    div.menu ul li a        { font-size: 0.9em; padding-left: 7px; margin-left: 7px; }
    a.mobilemenubtn,
    div.mobilemenu,
    div.submenu             { display: none; }
    div.mobilesubmenu       { display: block; }
    div.contentwrap,
    div.content             { float: none; width: auto; }
    div.content>div.inner   { padding-left: 0; padding-right: 0; }

    div.aside               { float: none; width: 100%; }
    div.aside>div           { float: left; clear: none; width: 50%; padding-left: 12px; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
    div.aside>div.clearleft { clear: left; padding-right: 12px; padding-left: 0; }

    div.footermenu>ul       { margin-left: -5%; }
    div.footermenu>ul>li    { width: 28.33%; margin-left: 5%; }
    div.footermenu>ul>li:first-child    { margin-left: 5%; }
    div.footermenu>ul>li.footerchild-3,
    div.footermenu>ul>li.footerchild-6  { clear: left; }

    div.homepagewrap div.left,
    div.homepagewrap div.right          { width:50%; float:left; padding-right: 12px; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
    div.homepagewrap div.right          { float:right; padding-right: 0; padding-left: 12px; }
    div.homepagewrap img                { width: auto; height: auto; max-width: 100%; }

    table.contact tr td                                     { vertical-align: top; }
    div.background-carrousel                                { top:60px;}
    div.background-carrousel ul li img                      { width:100%; height:auto; }

}

@media screen and (max-width: 760px) {
    div.sitewidth        { width: 480px; }
    div.contentwrap      { width: 480px; padding:15px 0 0 0; }
    div.content          { width:480px;}
    div.content div.inner   { padding:15px 0 0 0; background:none;}
    div.quotewrap        { display:none; }
    div.aside            { float: none; clear: both; }

    div.logo                                              { float:none; text-align: center; }

    div.homepage div.main       { border-top: 1px solid #4bb4ca; }
    div.header>div.inner        { padding-bottom: 12px; }
    a.logo                      { display: block; padding: 14px 0 6px; margin-bottom: 6px; }
    a.logo img                  { width: auto; height: auto; max-width: 140px; }
    a.logo>span,
    a.logo:hover>span           { display:none; }

    a.mobilesearchbtn,
    a.mobilemenubtn           { display: inline-block; float: right; height:30px; line-height: 30px; width: 50px; text-align: center; padding: 0 15px; background:#4bb4ca; color: #FFFFFF; -moz-border-radius: 15px; -webkit-border-radius: 15px; border-radius: 15px; }
    a.mobilemenubtn           { float: left; }

    div.searchbox,
    div.menu                    { display: none; }
    div.mobilemenu              { position: relative; display: none; border-top: 2px solid #4bb4ca; }
    div.mobilemenu div.overlay  { display: none; }
    div.mobilemenu ul           { height: auto; width: 100%; padding-top: 12px; padding-bottom: 12px; overflow: hidden; }
    div.mobilemenu ul li        { display: block; float: none; }
    div.mobilemenu ul li a      { display: block; border: none; padding:4px 0; margin: 0; width: 100%; }

    div.background-carrousel    { display: none; }
    div.homepagewrap div.overlay { display: none; }

    div.homepagewrap div.left,
    div.homepagewrap div.right,
    div.aaarticle               { width:100%; float:none; padding-left: 0; padding-right: 0; }
    div.homepagewrap div.right          { margin-top: 24px; }
    div.aside>div,
    div.aside>div.clearleft           { float: none; width: 100%; padding-left: 0; padding-right: 0; }

    div.footermenu>ul       { margin: 0; }
    div.footermenu>ul>li,
    div.footermenu>ul>li:first-child    { width: 100%; float: none; margin: 0 0 24px; }

    div.footerservice ul li  { padding: 0; float: none; border: none; }
    div.footerservice ul li a  { display: block; padding: 4px 0; }

    table.contact.blue,
    table.contact.blue table,
    table.contact.blue tbody,
    table.contact.blue th,
    table.contact.blue td,
    table.contact.blue tr,
    table.contact.green.horizontal,
    table.contact.green.horizontal table,
    table.contact.green.horizontal tbody,
    table.contact.green.horizontal th,
    table.contact.green.horizontal td,
    table.contact.green.horizontal tr       { display: block; width: 100%; clear: left; text-align: left; }

    table.contact.blue>tbody>tr>td,
    table.contact.green.horizontal>tbody>tr>td  { padding: 5px 0; }

    form.formview div.formrowextra div.colone                   { width: 30%; }
    form.formview div.formrowextra div.coltwo                   { width: 70%; }
    form.formview div.formrowextra div.colthree                 { width: 30%; padding: 10px 0; }
    form.formview div.formrowextra div.colfour                  { width: 70%; padding: 10px 0; }

    form.formview div.formrowextra div.colthree label           { padding: 0 20px 0 0;}

}

@media screen and (max-width: 500px) {
    div.sitewidth        { width: auto; min-width:300px; }
    div.contentwrap      { width: auto; float: none; }
    div.content          { width: auto; float: none; }
    div.aside            { width: auto; }
    div.itemleft,
    div.itemright        { float: none; width: auto; padding: 10px 0; }

    form.formview div.colone                   { float: none; width: 100%; padding: 0; }
    form.formview div.coltwo                   { float: none; width: 100%; padding: 0; }

    form.formview div.formrowextra div.colone,
    form.formview div.formrowextra div.coltwo,
    form.formview div.formrowextra div.colthree,
    form.formview div.formrowextra div.colfour                  {  float: none; width: 100%; padding: 0; }


    div.homepagewrap h1  { padding:10px 0px 20px; font-size: 2.3em }
}