/*
=======================================================================
 Desktop Styles
=======================================================================
*/

body {
    width:100%;
    height:auto;
    font-family:Arial;
    color:#000;
    margin:0;
    padding:0;
    text-align:center;
    background:#FFF;
}

.content_container {
    position:relative;
    top:0;
    left:0;
    width:88%;
    max-width:1280px;
    height:auto;
    margin:0 auto;
    text-align:left;
    box-sizing:border-box;
    overflow:hidden;
}

/*
=======================================================================
 Top Header
=======================================================================
*/

#topheader {
    position:relative;
    top:0;
    left:0;
    width:100%;
    height:auto;
    border-bottom:3px solid #F2F2F2;
}

#logoicon {
    float:left;
    width:15%;
    height:auto;
    margin-top:12px;
}

#logoicon img {
    max-width:100%;
}

#navigation {
    float:left;
    width:75%;
    height:auto;
}

#socialicons {
    float:left;
    width:10%;
    height:auto;
    text-align:center;
    margin-top:20px;
}

#socialicons a {
    font-size:30px;
    color:#2173FF;
    text-decoration:none;
    margin-left:10px;
    margin-right:10px;
}

#socialicons a:hover {
    color:#009900;
}

#navigation ul {
    text-align:center;
    margin:0;
    padding:0;
    list-style:none;
}

#navigation ul li {
    display:inline-block;
    position:relative;
    cursor:pointer;
    margin-left:-5px;
}

#navigation ul li a.nav {
    display:inline-block;
    color:#000;
    font-size:15px;
    text-decoration:none;
    padding:28px 15px 28px 15px;
}

#navigation ul li a.nav:hover {
    color:#2173FF;
}

#mobilenavigation {
    display:none;
}

/*
=======================================================================
 Bottom Footer
=======================================================================
*/

#bottomfooter {
    position:relative;
    top:0;
    left:0;
    width:100%;
    height:auto;
    font-size:15px;
    background:#F2F2F2;
    padding-top:50px;
    padding-bottom:50px;
}

#bottomfooter img {
    max-width:100%;
}

.footer_column_one {
    float:left;
    width:32%;
    height:auto;
    margin-left:1%;
    margin-right:1%;
}

.footer_column_two {
    float:left;
    width:20%;
    height:auto;
    margin-left:1%;
    margin-right:1%;
}

.footerlinks {
    margin-top:20px;
}

.footerlinks a {
    color:#000;
    text-decoration:none;
    line-height:40px;
}

.footerlinks a:hover {
    color:#2173FF;
}

#copyright {
    position:relative;
    top:0;
    left:0;
    width:100%;
    height:auto;
    font-size:13px;
    color:#CCC;
    background:#2173FF;
    padding-top:25px;
    padding-bottom:25px;
}

#copyright a {
    color:#FFF;
    text-decoration:none;
}

/*
=======================================================================
 Desktop 1024-1280
=======================================================================
*/

@media screen and (max-width:1279px)
{
    #navigation {width:85%;}
    #navigation ul li a.nav {font-size:14px; padding:28px 11px 28px 11px;}
    #socialicons {display:none;}
    #bottomfooter {font-size:14px;}
}

/*
=======================================================================
 Tablets 768-1024
=======================================================================
*/

@media screen and (max-width:1023px)
{
    #topheader .content_container {width:100%; margin:0;}
    #logoicon {width:40%; height:auto; margin-left:15px; padding-bottom:7px;}
    #navigation {display:none; width:100%; background:#2173FF;}
    #navigation ul li {width:100%; margin:0;}
    #navigation ul li a.nav {width:100%; padding:15px 0 15px 10px; text-align:left; font-size:13px; font-weight:bold; color:#FFF; border-bottom:1px solid #FFF;}
    #navigation ul li a.nav:hover {color:#FFF; background:#009900;}
    #mobilenavigation {display:block;}
    #mobilenavigation a {position:absolute; top:13px; right:15px; font-size:40px; font-weight:bold; color:#2173FF; text-decoration:none;}
    #bottomfooter {font-size:12px;}
    #copyright {font-size:12px;}
}

/*
=======================================================================
 Mobile & Small Tablets
=======================================================================
*/
    
@media screen and (max-width:767px)
{
    .content_container {width:94%;}
    #bottomfooter {padding-top:35px; padding-bottom:5px;}
    .footer_column_one {width:46%; height:150px; margin-left:2%; margin-right:2%;}
    .footer_column_two {width:46%; height:150px; margin-left:2%; margin-right:2%;}
    .footerlinks {margin-top:10px;}
    .footerlinks a {line-height:30px;}
}
    