/*
* Amee V2.0
* Copyright 2013, Blue2 Digital
* www.blue2.co.uk
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 6/20/2012
*/

/* Table of Content
==================================================
	#Site Styles
	#Page Styles
	#Media Queries
	#Font-Face */

/* #Site Styles
================================================== */

/* #Page Styles
================================================== */

/* #Media Queries
================================================== */

/* Smaller than standard 960 (devices and browsers) MQ 1 */
@media only screen and (max-width: 959px) {

    /*
body:after{
				content:"@mq 1";
				position:absolute;
				top:0;
				left:0;
				color: #1691be;
				font-weight:bold;
				padding:1em;
			}	
*/
    .viewer .viewer__left-col,
    .viewer .right-viewport {
        width: 100%;
    }
}

/* Tablet Portrait size to standard 960 (devices and browsers) MQ 2 */
@media only screen and (min-width: 768px) and (max-width: 959px) {
    /*

			body:after{
				content:"@mq 2";
				position:absolute;
				top:0;
				left:0;
				color: #1691be;
				font-weight:bold;
				padding:1em;
			}
*/

    .text_unit .txtholder {
        width: 60%;
    }

    .dl-trigger {
        display: block !important;
    }

    .viewer #dl-menu > ul {
        border: 1px solid #0066a4;
        border-radius: 6px 6px 6px 6px;
        padding: 15px;
    }

    .viewer #dl-menu ul {
        background-color: #0066a4;
        color: #fff;
        font-weight: bold;
        width: 90%;
    }

    .viewer .dl-menuwrapper li a {
        padding: 5px 20px;
    }

    .viewer #dl-menu li a:hover {
        background-color: #47A3DA;
        border-radius: 3px;
    }

    .viewer .hero h3 {
        width: 85%;
        top: 70%;
    }
}

/* All Mobile Sizes (devices and browser) MQ 3*/
@media only screen and (max-width: 767px) {

    /*
body:after{
				content:"@mq 3";
				position:absolute;
				top:0;
				left:0;
				color: #1691be;
				font-weight:bold;
				padding:1em;
			}
*/

    .dl-trigger {
        display: block !important;
    }
}

/* Mobile Landscape Size to Tablet Portrait (devices and browsers) MQ 4 */
@media only screen and (min-width: 480px) and (max-width: 767px) {

    /*
body:after{
				content:"@mq 4";
				position:absolute;
				top:0;
				left:0;
				color: #1691be;
				font-weight:bold;
				padding:1em;
			}
*/

    .right-viewport .upper ul li, .subnav .lower ul li {
        float: left;
        margin-bottom: 1px;
        width: 100%;
        height: auto;
        min-height: 50px;
    }

        .right-viewport .upper ul li a, .subnav .lower ul li a {
            font-size: 0.85rem;
            text-align: left;
        }

    .viewer .current-tab {
        min-height: 405px;
    }

    .tabbed .desc .button {
        position: relative;
    }

    .brand h1 {
        float: none;
        width: 100%;
    }

        .brand h1 a {
            display: block;
            float: none;
            margin: 0 auto;
            width: 285px;
        }


    .header nav.user {
        /* display: none; */
        width: 100%;
        font-size: 0.2em;
    }

        .header nav.user ul {
            text-align: center;
            width: 100%;
        }

    .viewer .hp-widgets {
        float: left;
        width: 100%;
    }

    .hp-widgets .hp-news {
        min-height: 0;
    }

    .widget {
        width: 100% !important;
        margin-bottom: 22px;
    }

    .viewer .center {
        width: 100%;
        padding-right: 0;
    }

    .nav li:nth-child(6n+6) {
        border-radius: 0;
    }

    /* .nav li:nth-child(6n+2) {border-radius: 0 6px 0 0;} */

    .viewer .hero h2 {
        font-size: 18px;
        line-height: 18px;
        width: auto;
        top: -60%;
    }

    .viewer .hero h3 {
        font-size: 14px;
        line-height: 18px;
        width: auto;
        top: -60%;
    }

    .tabbed .image-holder {
        width: 350px;
    }

    .tabbed .desc {
        margin-left: 13px;
        width: 350px;
        margin-top: 12px;
        height: 165px;
    }

    .footer .details {
        width: 100%;
    }

    .footer .social {
        width: 100%;
        float: left;
    }

        .footer .social a {
            float: left;
        }

    .staff_image {
        display: none;
    }

    .staff_content {
        width: 100%;
    }



    .right-viewport .article p {
        font-size: 1rem;
        line-height: 1.45rem;
    }

    .text_unit .txtholder {
        width: 100%;
    }

        .text_unit .txtholder.left, .text_unit .txtholder.right {
            text-align: left;
        }

    .text_unit .imgholder {
        width: 100%;
        float: left;
        max-width: 100%;
    }

    .dl-trigger {
        display: block !important;
    }

    .social {
        display: none;
    }

    .viewer #dl-menu > ul {
        border: 1px solid #0066a4;
        border-radius: 6px 6px 6px 6px;
        padding: 15px;
    }

    .viewer #dl-menu ul {
        background-color: #0066a4;
        color: #fff;
        font-weight: bold;
        width: 90%;
    }

    .viewer .dl-menuwrapper li a {
        padding: 5px 20px;
    }

    .viewer #dl-menu li a:hover {
        background-color: #47A3DA;
        border-radius: 3px;
    }

    .viewer .hero {
        display: none;
    }

    .hp-widgets .hp-news {
        max-height: 250px;
    }
}

/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) MQ 5 */
@media only screen and (max-width: 479px) {

    body:after {
        content: /* "@mq 5" */ "";
        position: absolute;
        top: 0;
        left: 0;
        color: #1691be;
        font-weight: bold;
        padding: 1em;
    }

    /* --------------- custom iphone styles ------------------ */

    .container {
        padding: 0;
    }

    .header {
        padding-top: 10px;
        min-height: 80px;
    }


    .brand h1 a {
        background-size: contain;
        height: 55px;
        width: 245px;
        margin-left: 45px;
        margin-top: 2px;
        z-index: 1001;
    }

    .brand {
    }

    .dl-menuwrapper button {
        z-index: 1002;
    }

    .dl-menuwrapper {
        position: absolute !important;
        top: 10px;
    }

    .right-viewport .dothings {
        width: 100%;
    }

        .right-viewport .dothings .share-things {
            font-size: 14px;
        }

    .footer {
        padding-top: 10px;
    }

    .social {
        display: none;
    }

    .right-viewport .headline .category {
        font-size: 1.125em;
    }

    .right-viewport .headline h2 {
        font-size: 1.45em;
    }


    .text_unit .txtholder p img, .article p img {
        max-width: 100%;
        margin: 0 0 12px 0;
    }

    .footer .details p {
        width: 100%;
        text-align: center;
        font-size: 10px;
    }

    .footer-inner ul, .footer-inner div {
        font-size: 10px;
    }

    .footer {
        margin-bottom: 15px;
    }

    .design-by p {
        display: none;
    }


    /* --------------- custom iphone styles ------------------ */


    .staff_image {
        display: none;
    }

    .staff_content {
        width: 100%;
    }

    .dl-trigger {
        display: block !important;
    }

    .header nav.user {
        width: 100%;
    }

        .header nav.user ul {
            text-align: center;
        }

    .viewer .hp-widgets {
        float: left;
        width: 100%;
    }

    .hp-widgets .hp-news {
        min-height: 0;
    }

    .widget {
        width: 100% !important;
        margin-bottom: 22px;
    }

    .viewer .center {
        width: 100%;
        padding-right: 0;
    }

    .nav li:nth-child(6n+6) {
        border-radius: 0;
    }

    . /* nav li:nth-child(6n+2) {border-radius: 0 6px 0 0;} */
    .nav a {
        padding: 0.2em;
        font-size: 16px;
    }

    .viewer .hero {
        display: none;
    }

        .viewer .hero h2 {
            font-size: 18px;
            line-height: 18px;
            width: auto;
            top: -60%;
        }

        .viewer .hero h3 {
            font-size: 14px;
            line-height: 18px;
            width: auto;
            top: -60%;
        }

    .tabbed .image-holder {
        width: 350px;
    }

    .tabbed .desc {
        margin-left: 13px;
        width: 350px;
        margin-top: 12px;
        height: 165px;
    }

    .footer .details {
        width: 100%;
    }

    .footer .social {
        width: 100%;
        float: left;
    }

        .footer .social a {
            float: left;
        }

    .staff_image {
        display: none;
    }

    .staff_content {
        width: 100%;
    }



    .right-viewport .article p {
        font-size: 14px;
        line-height: 1.535em;
    }

    .right-viewport

    .text_unit .txtholder {
        width: 100%;
    }

    .text_unit .txtholder.left, .text_unit .txtholder.right {
        text-align: left;
    }

    .text_unit .imgholder {
        width: 100%;
        float: left;
        max-width: 100%;
    }


    .viewer #dl-menu > ul {
        border: 1px solid #0066a4;
        border-radius: 0px 0px 6px 6px;
        padding: 15px;
    }

    .viewer #dl-menu ul {
        background-color: #0066a4;
        color: #fff;
        font-weight: bold;
        width: 99%;
    }

    .viewer .dl-menuwrapper li a {
        padding: 5px 20px;
    }

    .viewer #dl-menu li a:hover {
        background-color: #47A3DA;
        border-radius: 3px;
    }

    .hp-widgets .hp-news {
        max-height: 350px;
    }

    .right-viewport .search .key-search {
        margin-bottom: 1em;
        float: left;
        width: 100%;
    }

    .right-viewport .search select {
        width: 100%;
    }

    .design-by {
        display: none;
    }

    .container .columns.base-footer {
        margin-bottom: 35px;
        margin-top: 15px;
    }

    .footer-inner {
        padding-left: 15px;
    }

    .tabbed .image-holder {
        width: 92%;
    }

    .tabbed .desc {
        width: 92%;
    }

    .viewer .current-tab {
        min-height: 445px;
    }

    /*
			.nav a {
			    font-size: 15px;
			    padding: 0.2em;
			}
*/


    .tabbed .desc .button {
        position: relative;
    }

    .right-viewport .upper ul li {
        float: left;
        margin-bottom: 15px;
        width: 100%;
    }

        .right-viewport .upper ul li a {
            font-size: 0.85rem;
        }
}


/* #Font-Face
================================================== */
/* 	This is the proper syntax for an @font-face file
		Just create a "fonts" folder at the root,
		copy your FontName into code below and remove
		comment brackets */

/*	@font-face {
	    font-family: 'FontName';
	    src: url('../fonts/FontName.eot');
	    src: url('../fonts/FontName.eot?iefix') format('eot'),
	         url('../fonts/FontName.woff') format('woff'),
	         url('../fonts/FontName.ttf') format('truetype'),
	         url('../fonts/FontName.svg#webfontZam02nTh') format('svg');
	    font-weight: normal;
	    font-style: normal; }
*/



/* Additions */