/*
 * Responsive HTML5/CSS3 template
 * http://webcodebuilder.com/examples/responsive-html5css3-template/index.html
 *
 * Copyright 2012, WebCodeBuilder
 * Free to use under the MIT license.
 * http://www.opensource.org/licenses/mit-license.php
 */
@media all{
    body{
        font:14px Arial, Helvetica, sans-serif;
        margin:0;
        background:#383838;
        width:100%;
        color:#444444;
    }
    a{
        color:#466087;
        text-decoration:underline;
    }
    a:hover { text-decoration:none;}
    section, header,footer,nav { display:block;}
    .navitem {
        float:left;
        padding-left:3.3em;
        padding-right:3.3em;
    }
    .navigation{
        background-color: greenyellow;
        position:fixed;
        top:0;
        width:100%;
    }
    .logo{
        display:block;
        background-color: #123123;
        font-size: 30px;
        color:#FFFFFF;
    }
    article{
        background-color: beige;
        border: blue;
        border-width: 0.5em;
        margin:0.5em;
        padding: 0.5em;
        border-radius: 0.8em;
    }
    .articleheadline{
        float:left;
    }
    .articledate{
        float:right;
    }
    .articlecontent{
        
        margin-top:1em;
    }
    .content{
        margin-top:4.5em;
    }
}
@media all and (max-width: 1024px){
    .logo{
        display:block;
        background-color: darkblue;
        font-size: 35px;
    }
}
@media all and (max-width: 960px){
    .center{
        padding:0 10px;
        width:auto;
    }
    .buttons{font-size:11px;}
    #header{
        padding:2px 0 0;
        height:0;
        overflow:hidden;
        position:static;
    }
    #content{padding:0;}
}
@media all and (max-width: 780px){
    body{font-size:13px;}
    .buttons{font-size:9px;}
    h1{font-size:3.5em;}
    .subHeading{font-size:2em;}
    .news h3{font-size:1.3em;}
}
@media all and (max-width: 504px){
    body{font-size:12px;}
    .columns > div,
    .columns > article{
        float:none;
        margin:0;
        width:100%;
    }
    .buttons{font-size:7px;}
    #testimonials li,
    #testimonials .row{
        background:none;
    }
    #testimonials blockquote{
        float:none;
        width:100%;
        position:relative;
    }
    #testimonials blockquote:after{
        background:url(../img/sep-hor.gif) no-repeat 50% 0;
        content:"";
        position:absolute;
        left:0;
        top:-18px;
        width:100%;
        height:2px;
    }
    #testimonials .row:first-child blockquote:first-child:after{display:none;}
    .flex-direction-nav{display:none;}
    h1{font-size:3em;}
    .subHeading{font-size:1.75em;}
}
@media all and (max-width: 320px){
    .buttons > span{display:none;}
    .buttons .btn{margin-top:0.5em;}
    .buttons{margin-top:2em;}
    h1{font-size:2.5em;}
    .subHeading{font-size:1.5em;}
    .news h3{font-size:1.25em;}
}
@media all
and (min-device-width: 768px)
and (max-device-width: 1024px){
    #header{
        padding:2px 0 0;
        height:0;
        overflow:hidden;
        position:static;
    }
    #content{padding:0;}

}