@charset "utf-8";
/**
* Langarth fluid grid system
*
*
* @author        Matthew Davies (md@langarth.com)
* @date          21 Dec 2011
* @update        26 Aug 2013
*/
.container {
    padding-left: 5px;
    padding-right: 5px;
    margin-left: auto;
    margin-right: auto
    }
.box1, .box2, .box3, .box4, .box5, .box6, .box7, .box8, .box9, .box10, .box11, .box12 {
    display: inline;
    float: left;
    margin-left: 5px;
    margin-right: 5px
    }
.clear {
    clear: both;
    display: block;
    overflow: hidden;
    visibility: hidden;
    width: 0;
    height: 0
    }
/* mobile portait */
@media only screen and (min-width: 320px) {
    .container {
        width: 310px !important
        }
    .box1 {
        width: 15px
        }
    .box2 {
        width: 40px
        }
    .box3 {
        width: 65px
        }
    .box4 {
        width: 90px
        }
    .box5 {
        width: 115px
        }
    .box6 {
        width: 140px
        }
    .box7 {
        width: 165px
        }
    .box8 {
        width: 190px
        }
    .box9 {
        width: 215px
        }
    .box10 {
        width: 240px
        }
    .box11 {
        width: 265px
        }
    .box12 {
        width: 290px
        }
    .push1 {
        margin-left: 15px
        }
    .push2 {
        margin-left: 40px
        }
    .push3 {
        margin-left: 65px
        }
    .push4 {
        margin-left: 90px
        }
    .push5 {
        margin-left: 115px
        }
    .push6 {
        margin-left: 140px
        }
    .push7 {
        margin-left: 165px
        }
    .push8 {
        margin-left: 190px
        }
    .push9 {
        margin-left: 215px
        }
    .push10 {
        margin-left: 240px
        }
    .push11 {
        margin-left: 265px
        }
    .pull1 {
        margin-right: 15px
        }
    .pull2 {
        margin-right: 40px
        }
    .pull3 {
        margin-right: 65px
        }
    .pull4 {
        margin-right: 90px
        }
    .pull5 {
        margin-right: 115px
        }
    .pull6 {
        margin-right: 140px
        }
    .pull7 {
        margin-right: 165px
        }
    .pull8 {
        margin-right: 190px
        }
    .pull9 {
        margin-right: 215px
        }
    .pull10 {
        margin-right: 240px
        }
    .pull11 {
        margin-right: 265px
        }
    }
/* mobile landscape */
@media only screen and (min-width: 480px) {
    .container {
        width: 420px !important
        }
    .box1 {
        width: 25px
        }
    .box2 {
        width: 60px
        }
    .box3 {
        width: 95px
        }
    .box4 {
        width: 130px
        }
    .box5 {
        width: 165px
        }
    .box6 {
        width: 200px
        }
    .box7 {
        width: 235px
        }
    .box8 {
        width: 270px
        }
    .box9 {
        width: 305px
        }
    .box10 {
        width: 340px
        }
    .box11 {
        width: 375px
        }
    .box12 {
        width: 410px
        }
    .push1 {
        margin-left: 25px
        }
    .push2 {
        margin-left: 60px
        }
    .push3 {
        margin-left: 95px
        }
    .push4 {
        margin-left: 130px
        }
    .push5 {
        margin-left: 165px
        }
    .push6 {
        margin-left: 200px
        }
    .push7 {
        margin-left: 235px
        }
    .push8 {
        margin-left: 270px
        }
    .push9 {
        margin-left: 305px
        }
    .push10 {
        margin-left: 340px
        }
    .push11 {
        margin-left: 375px
        }
    .pull1 {
        margin-right: 25px
        }
    .pull2 {
        margin-right: 60px
        }
    .pull3 {
        margin-right: 95px
        }
    .pull4 {
        margin-right: 130px
        }
    .pull5 {
        margin-right: 165px
        }
    .pull6 {
        margin-right: 200px
        }
    .pull7 {
        margin-right: 235px
        }
    .pull8 {
        margin-right: 270px
        }
    .pull9 {
        margin-right: 305px
        }
    .pull10 {
        margin-right: 340px
        }
    .pull11 {
        margin-right: 375px
        }
    }
/* small tablet */
@media only screen and (min-width: 600px) {
    body {
        min-width: 600px
        }
    .container {
        width: 550px !important
        }
    .box1 {
        width: 35px
        }
    .box2 {
        width: 80px
        }
    .box3 {
        width: 125px
        }
    .box4 {
        width: 170px
        }
    .box5 {
        width: 215px
        }
    .box6 {
        width: 260px
        }
    .box7 {
        width: 305px
        }
    .box8 {
        width: 350px
        }
    .box9 {
        width: 395px
        }
    .box10 {
        width: 440px
        }
    .box11 {
        width: 485px
        }
    .box12 {
        width: 530px
        }
    .push1 {
        margin-left: 35px
        }
    .push2 {
        margin-left: 80px
        }
    .push3 {
        margin-left: 125px
        }
    .push4 {
        margin-left: 170px
        }
    .push5 {
        margin-left: 215px
        }
    .push6 {
        margin-left: 260px
        }
    .push7 {
        margin-left: 305px
        }
    .push8 {
        margin-left: 350px
        }
    .push9 {
        margin-left: 395px
        }
    .push10 {
        margin-left: 440px
        }
    .push11 {
        margin-left: 485px
        }
    .pull1 {
        margin-right: 35px
        }
    .pull2 {
        margin-right: 80px
        }
    .pull3 {
        margin-right: 125px
        }
    .pull4 {
        margin-right: 170px
        }
    .pull5 {
        margin-right: 215px
        }
    .pull6 {
        margin-right: 260px
        }
    .pull7 {
        margin-right: 305px
        }
    .pull8 {
        margin-right: 350px
        }
    .pull9 {
        margin-right: 395px
        }
    .pull10 {
        margin-right: 440px
        }
    .pull11 {
        margin-right: 485px
        }
    }
/* tablet portrait */
@media only screen and (min-width: 768px) {
    body {
        min-width: 768px
        }
    .container {
        width: 720px !important
        }
    .box1 {
        width: 50px
        }
    .box2 {
        width: 110px
        }
    .box3 {
        width: 170px
        }
    .box4 {
        width: 230px
        }
    .box5 {
        width: 290px
        }
    .box6 {
        width: 350px
        }
    .box7 {
        width: 410px
        }
    .box8 {
        width: 470px
        }
    .box9 {
        width: 530px
        }
    .box10 {
        width: 590px
        }
    .box11 {
        width: 650px
        }
    .box12 {
        width: 710px
        }
    .push1 {
        margin-left: 50px
        }
    .push2 {
        margin-left: 110px
        }
    .push3 {
        margin-left: 170px
        }
    .push4 {
        margin-left: 230px
        }
    .push5 {
        margin-left: 290px
        }
    .push6 {
        margin-left: 350px
        }
    .push7 {
        margin-left: 410px
        }
    .push8 {
        margin-left: 470px
        }
    .push9 {
        margin-left: 530px
        }
    .push10 {
        margin-left: 590px
        }
    .push11 {
        margin-left: 650px
        }
    .pull1 {
        margin-right: 50px
        }
    .pull2 {
        margin-right: 110px
        }
    .pull3 {
        margin-right: 170px
        }
    .pull4 {
        margin-right: 230px
        }
    .pull5 {
        margin-right: 290px
        }
    .pull6 {
        margin-right: 350px
        }
    .pull7 {
        margin-right: 410px
        }
    .pull8 {
        margin-right: 470px
        }
    .pull9 {
        margin-right: 530px
        }
    .pull10 {
        margin-right: 590px
        }
    .pull11 {
        margin-right: 650px
        }
    }
/* tablet landscape / netbook */
@media only screen and (min-width: 1024px) {
    body {
        min-width: 1024px
        }
    .container {
        width: 960px !important
        }
    .box1 {
        width: 70px
        }
    .box2 {
        width: 150px
        }
    .box3 {
        width: 230px
        }
    .box4 {
        width: 310px
        }
    .box5 {
        width: 390px
        }
    .box6 {
        width: 470px
        }
    .box7 {
        width: 550px
        }
    .box8 {
        width: 630px
        }
    .box9 {
        width: 710px
        }
    .box10 {
        width: 790px
        }
    .box11 {
        width: 870px
        }
    .box12 {
        width: 950px
        }
    .push1 {
        margin-left: 70px
        }
    .push2 {
        margin-left: 150px
        }
    .push3 {
        margin-left: 230px
        }
    .push4 {
        margin-left: 310px
        }
    .push5 {
        margin-left: 390px
        }
    .push6 {
        margin-left: 470px
        }
    .push7 {
        margin-left: 550px
        }
    .push8 {
        margin-left: 630px
        }
    .push9 {
        margin-left: 710px
        }
    .push10 {
        margin-left: 790px
        }
    .push11 {
        margin-left: 870px
        }
    .pull1 {
        margin-right: 70px
        }
    .pull2 {
        margin-right: 150px
        }
    .pull3 {
        margin-right: 230px
        }
    .pull4 {
        margin-right: 310px
        }
    .pull5 {
        margin-right: 390px
        }
    .pull6 {
        margin-right: 470px
        }
    .pull7 {
        margin-right: 550px
        }
    .pull8 {
        margin-right: 630px
        }
    .pull9 {
        margin-right: 710px
        }
    .pull10 {
        margin-right: 790px
        }
    .pull11 {
        margin-right: 870px
        }
    }
/* desktop */
@media only screen and (min-width: 1280px) {
    body {
        min-width: 1280px
        }
    .container {
        width: 1140px !important
        }
    .box1 {
        width: 85px
        }
    .box2 {
        width: 180px
        }
    .box3 {
        width: 275px
        }
    .box4 {
        width: 370px
        }
    .box5 {
        width: 465px
        }
    .box6 {
        width: 560px
        }
    .box7 {
        width: 655px
        }
    .box8 {
        width: 750px
        }
    .box9 {
        width: 845px
        }
    .box10 {
        width: 940px
        }
    .box11 {
        width: 1035px
        }
    .box12 {
        width: 1130px
        }
    .push1 {
        margin-left: 85px
        }
    .push2 {
        margin-left: 180px
        }
    .push3 {
        margin-left: 275px
        }
    .push4 {
        margin-left: 370px
        }
    .push5 {
        margin-left: 465px
        }
    .push6 {
        margin-left: 560px
        }
    .push7 {
        margin-left: 655px
        }
    .push8 {
        margin-left: 750px
        }
    .push9 {
        margin-left: 845px
        }
    .push10 {
        margin-left: 940px
        }
    .push11 {
        margin-left: 1035px
        }
    .pull1 {
        margin-right: 85px
        }
    .pull2 {
        margin-right: 180px
        }
    .pull3 {
        margin-right: 275px
        }
    .pull4 {
        margin-right: 370px
        }
    .pull5 {
        margin-right: 465px
        }
    .pull6 {
        margin-right: 560px
        }
    .pull7 {
        margin-right: 655px
        }
    .pull8 {
        margin-right: 750px
        }
    .pull9 {
        margin-right: 845px
        }
    .pull10 {
        margin-right: 940px
        }
    .pull11 {
        margin-right: 1035px
        }
    }