/*
 * HTML5 Boilerplate
 *
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 *
 * Detailed information about this CSS: h5bp.com/css
 *
 * ==|== normalize ==========================================================
 */


/* =============================================================================
   HTML5 display definitions
   ========================================================================== */

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
nav,
section,
summary {
    display: block;
}

audio,
canvas,
video {
    display: inline-block;
    *display: inline;
    *zoom: 1;
}

audio:not([controls]) {
    display: none;
}

[hidden] {
    display: none;
}


/* =============================================================================
   Base
   ========================================================================== */

/*
 * 1. Correct text resizing oddly in IE6/7 when body font-size is set using em units
 * 2. Prevent iOS text size adjust on device orientation change, without disabling user zoom: h5bp.com/g
 */

html {
    font-size: 100%;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
}

html,
button,
input,
select,
textarea {
    font-family: sans-serif;
    color: #333;
}

body {
    margin: 0;
    font-size: 1em;
    line-height: 1.4;
    background: #fff;
}

/*
 * Remove text-shadow in selection highlight: h5bp.com/i
 * These selection declarations have to be separate.
 * Customize the background color to match your design.
 */

::-moz-selection {
    background: #db0000;
    color: #FFF;
    text-shadow: none;
}

::selection {
    background: #db0000;
    color: #FFF;
    text-shadow: none;
}


/* =============================================================================
   Links
   ========================================================================== */

a {
    color: #db0000;
    /* color: #cc3333; */
    text-decoration: none;
}

a:visited {
    color: #db0000;
    /* color: #cc3333; */
}

a:hover {
    color: #000;
    text-decoration: underline;
}

a:focus {
    outline: thin dotted;
}

/*
 * Improve readability when focused and hovered in all browsers: h5bp.com/h
 */

a:hover,
a:active {
    outline: 0;
}


/* =============================================================================
   Typography
   ========================================================================== */

abbr[title] {
    border-bottom: 1px dotted;
}

b,
strong {
    font-weight: bold;
}

blockquote {
    margin: 1em 40px;
}

dfn {
    font-style: italic;
}

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #f1f1f1;
    margin: 10px 0;
    padding: 0;
}

ins {
    background: #ff9;
    color: #000;
    text-decoration: none;
}

mark {
    background: #ff0;
    color: #000;
    font-style: italic;
    font-weight: bold;
}

/*
 * Redeclare monospace font family: h5bp.com/j
 */

pre,
code,
kbd,
samp {
    font-family: monospace, serif;
    _font-family: 'courier new', monospace;
    font-size: 1em;
}

/*
 * Improve readability of pre-formatted text
 */

pre {
    white-space: pre;
    white-space: pre-wrap;
    word-wrap: break-word;
}

q {
    quotes: none;
}

q:before,
q:after {
    content: "";
    content: none;
}

small {
    font-size: 85%;
}

/*
 * Position subscript and superscript content without affecting line-height: h5bp.com/k
 */

sub,
sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}

sup {
    top: -0.5em;
}

sub {
    bottom: -0.25em;
}


/* =============================================================================
   Lists
   ========================================================================== */

ul,
ol {
    margin: 1em 0;
    padding: 0 0 0 40px;
    margin: .4em 0 1.5em 0;
    font-family: "ff-meta-serif-web-pro", Cambria, Georgia, Times, “Times New Roman”, serif;
    font-weight: 400;
    font-style: normal;
    font-size: 18px;
    line-height: 1.5em;
}

ul {
    list-style: none;
    padding: 0;
}

ul li {
    margin-bottom: 10px;
}

ul li span {
    padding: 0 0 0 5px;
	font-style: italic;
	color: #999;
}


dd {
    margin: 0 0 0 40px;
}

nav ul,
nav ol {
    list-style: none;
    list-style-image: none;
    margin: 0;
    padding: 0;
}


/* =============================================================================
   Embedded content
   ========================================================================== */

/*
 * 1. Improve image quality when scaled in IE7: h5bp.com/d
 * 2. Remove the gap between images and borders on image containers: h5bp.com/i/440
 */

img {
    border: 0;
    vertical-align: middle;
    -ms-interpolation-mode: bicubic;
}

/*
 * Correct overflow not hidden in IE9
 */

svg:not(:root) {
    overflow: hidden;
}


/* =============================================================================
   Figures
   ========================================================================== */

figure {
    margin: 0;
}


/* =============================================================================
   Forms
   ========================================================================== */

form {
    margin: 0;
}

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

/*
 * Indicate that 'label' will shift focus to the associated form element
 */

label {
    cursor: pointer;
}

/*
 * 1. Correct color not inheriting in IE6/7/8/9
 * 2. Correct alignment displayed oddly in IE6/7
 */

legend {
    border: 0;
    padding: 0;
    white-space: normal;
    *margin-left: -7px;
}

/*
 * 1. Correct font-size not inheriting in all browsers
 * 2. Remove margins in FF3/4 S5 Chrome
 * 3. Define consistent vertical alignment display in all browsers
 */

button,
input,
select,
textarea {
    font-size: 100%;
    margin: 0;
    vertical-align: baseline;
    *vertical-align: middle;
}

/*
 * 1. Define line-height as normal to match FF3/4 (set using !important in the UA stylesheet)
 */

button,
input {
    line-height: normal;
}

/*
 * 1. Display hand cursor for clickable form elements
 * 2. Allow styling of clickable form elements in iOS
 * 3. Correct inner spacing displayed oddly in IE7 (doesn't effect IE6)
 */

button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
    cursor: pointer;
    -webkit-appearance: button;
    *overflow: visible;
}

/*
 * Re-set default cursor for disabled elements
 */

button[disabled],
input[disabled] {
    cursor: default;
}

/*
 * Consistent box sizing and appearance
 */

input[type="checkbox"],
input[type="radio"] {
    box-sizing: border-box;
    padding: 0;
    *width: 13px;
    *height: 13px;
}

input[type="search"] {
    -webkit-appearance: textfield;
    -moz-box-sizing: content-box;
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
}

input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button {
    -webkit-appearance: none;
}

/*
 * Remove inner padding and border in FF3/4: h5bp.com/l
 */

button::-moz-focus-inner,
input::-moz-focus-inner {
    border: 0;
    padding: 0;
}

/*
 * 1. Remove default vertical scrollbar in IE6/7/8/9
 * 2. Allow only vertical resizing
 */

textarea {
    overflow: auto;
    vertical-align: top;
    resize: vertical;
}


/* =============================================================================
   Tables
   ========================================================================== */

table {
    border-collapse: collapse;
    border-spacing: 0;
}

td {
    vertical-align: top;
    font-family: "prenton-condensed", Georgia, sans-serif;
    font-weight: normal;
    font-size: 18px;
    line-height: 25px;
    letter-spacing: 0.2 em;
    text-transform: uppercase;
    color: #999;
}


/* =============================================================================
   Chrome Frame Prompt
   ========================================================================== */

.chromeframe {
    margin: 0.2em 0;
    background: #ccc;
    color: #000;
    padding: 0.2em 0;
}


/* ==|== primary styles =====================================================
   Author:
   ========================================================================== */
* { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }

header {
    position: fixed;
	display: block;
    background: #000;
        -moz-box-shadow: 0 2px 4px rgba(000, 000, 000, .15);
        -webkit-box-shadow: 0 2px 4px rgba(000, 000, 000, .15);
    box-shadow: 0 2px 4px rgba(000, 000, 000, .15);
    margin: 0;
    top: 0;
    width: 100%;
    height: 50px;
    z-index: 10;
}

header h1 a {
	display: block;
    margin: 13px auto 10px auto;
    background:url(../img/logo.png) 50% 0 no-repeat; 
    background-size: 150px 25px;
    height: 25px;
    width: 150px;
    float: left;
    clear: none;
    text-indent: -9000px; /* The addition of the "ir" class doesn't seem to hide the h1 in some Android browsers (Kindle Fire) */
}

.h-category {
    display: block;
    font-family: "proxima-nova-condensed", Georgia, sans-serif;
    color: #fff;
    font-weight: 400;
    font-style: normal;
    font-size: 1.3em;
    margin: 0.7em 1.6em 0.5em 0.5em;
    line-height: 1.1em;
    letter-spacing: 0em;
    text-transform: uppercase;
    float: right;
    clear: none;
    padding-right: 12px;
    border-right: 1px solid #333;
}

#header-main{
    float: left;
    width: 100%;
    padding: 0 3.90625%;
}

    #nav {
        margin: 0 -2px 0 0;
        background: #000;
        /* background: #fff; */
        padding: 0;
        display: block;
        float: right;
        clear: both;
        width: 180px;
        /*border: solid 1px #f1f1f1;
        border: solid 1px rgba(0, 0, 0, .2);*/
        box-shadow: 0 7px 10px rgba(0, 0, 0, .2);
        border-top: none !important;
    }

    #nav ul {
        list-style: none;
        border: 0;
        padding: 0 10px;
        margin: 0;
    }

    #nav li {
        font-family: "proxima-nova-condensed", "Helvetica Neue", Arial, Helvetica, sans-serif;
        font-size: 20px;
        line-height: 20px;
        font-weight: 400;
        font-style: normal;
        text-transform: uppercase;
        margin: 0;
        padding: 10px 0 10px 0;
        float: left;
        clear: both;
        border-right: none;
        border-bottom: 1px solid #333;
        width: 100%;
    }

    #nav li:last-child {
        border-right: none;
        border-bottom: none;
    }

    #nav li a, #nav li a:visited {
        color: #fff;
        /* color: #222; */
    }

    #nav li a:hover, #nav li a:active, #nav li a.current {
        color: #db0000;
        /* color: #cc3333; */
        text-decoration: none;
    }

.hamburger {
    cursor: pointer;
}

.mic {
    display: inline-block;
    height: 25px;
    width: 25px;
    text-indent: -9999px;
    background: url(../img/mic.png) 0px 0px no-repeat;
    background-size: 25px 25px;
}

#topright {
    display: none;
}    
    
#topright ul {
    list-style: none;
    /*margin: 17px 0 0 0; */
    margin: -10px 0 0 0;
    padding: 0;
}

#topright li a {
    text-indent: -9999px;
    float: right;
    clear: none;
    border-right: 1px solid #333;
    /* border-right: 1px solid #e3e3e3; */
    height: 20px;
    width: 20px;
    padding: 0 15px;
    margin-left: 5px;
}

#topright li a.viaemail {
    display: block;
    background: url(../img/sprite-topright.png) -2px -2px no-repeat;
    background-size: 140px 50px;
}

#topright li a.viaemail:hover {
    background: url(../img/sprite-topright.png) -2px -30px no-repeat;
    background-size: 140px 50px;
}

#topright li a.twitter {
    display: none;
    background: url(../img/sprite-topright.png) -40px -2px no-repeat;
    background-size: 140px 50px;
}

#topright li a.twitter:hover {
    background: url(../img/sprite-topright.png) -40px -30px no-repeat;
    background-size: 140px 50px;
}

#topright li a.facebook {
    display: none;
    background: url(../img/sprite-topright.png) -80px -2px no-repeat;
    background-size: 140px 50px;
}

#topright li a.facebook:hover {
    background: url(../img/sprite-topright.png) -80px -30px no-repeat;
    background-size: 140px 50px;
}

#topright li a.rss {
    display: none;
    background: url(../img/sprite-topright.png) -120px -2px no-repeat;
    background-size: 140px 50px;
    border-right: none;
    margin-left: 12px;
    padding-right: 0;
    margin-right: 0px;
}

#topright li a.rss:hover {
    background: url(../img/sprite-topright.png) -120px -30px no-repeat;
    background-size: 140px 50px;
}


    #edition-selector select{
        background: url(../img/small-dropdown-tick.png) no-repeat;
        background-color: #eee;
        background-position: 145px 7px;
        background-size: 8px 6px; 
        -webkit-border-radius: 3px;
        -moz-border-radius: 3px;
        border-radius: 3px;
        border: none;
        color: #999;
        display: block;

        font-family: "proxima-nova-condensed", "Helvetica Neue", Arial, Helvetica, sans-serif;
        font-size: 16px;
        line-height: 15px;
        font-weight: 600;
        font-style: normal;
        text-transform: uppercase;

 
        float: right;
        margin: 12px 4px 0 0;
        padding: 4px 12px 4px 7px;
        text-transform: uppercase;
        -webkit-appearance: none;
        width: 160px;
    }
    #edition-selector option{
        text-transform: uppercase;
    }
/* New Email Sign-Up Link */
#email-edition {
    float: left;
    width: 25%;
}

#email-edition .link {
    display: block;
    float: left;
    margin: 10px 0 0 5px;
}

#email-edition .link a {  
    font-family: "proxima-nova-condensed", "Helvetica Neue", Arial, Helvetica, sans-serif;
    font-weight: normal;
    font-size: 11px;
    line-height: 20px;
    letter-spacing: 0.2 em;
    text-transform: uppercase;
    background: #eee;
    color: #999;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    padding: 3px 15px;
}



.m-ad img {
    display: block;
    margin: 0;
    width: 100%;
    height: auto;
}


#hero {
    width: 100%;
    height: 280px;
    position: relative;
	background-color: #2d4d59;
    /*background: url(../img/home-greece.jpg) no-repeat center center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;*/
}

#hero .caption {
    display: none;
    background-color: #000;
    background-color:rgba(0,0,0,0.5);
    position: absolute;
    padding: 2px 10px;
    max-width: 94%;
    left: 3%;
    bottom: 10px;
    font-family: "proxima-nova-condensed", "Helvetica Neue", Arial, Helvetica, sans-serif;
    font-size: 13px;
    font-weight: 300;
    color: #fff;
}
#hero .caption a {
    color: #fff;
}
#hero .caption a:hover {
    color: #db0000;
}

#hero .promo {
    background-color: #000;
    background-color:rgba(0,0,0,0.7);
    padding: 15px;
    display: block;
    position: absolute;
    right: 3%;
    bottom: 15px;
    width: 94%;
}

#hero .promo h1 {
    font-family: "proxima-nova-condensed", "Helvetica Neue", Arial, Helvetica, sans-serif;
    font-size: 26px;
    line-height: 29px;
    font-weight: 400;
    font-style: normal;
    letter-spacing: -1px;
    color: #db0000;
    margin: 0;
}

#hero .promo p {
    color: #fff;
    font-family: "proxima-nova-condensed", "Helvetica Neue", Arial, Helvetica, sans-serif;
	font-size: 19px;
	line-height: 22px;
    font-weight: 300;
    font-style: normal;
    margin: .4em 0 1.0em 0;
}

#hero a.btn {
    padding: 3px 15px;
    font-size: 20px;
    margin: 0 0 10px 0;
    font-family: "proxima-nova-condensed", "Helvetica Neue", Arial, Helvetica, sans-serif;
    font-weight: 400;
    font-style: normal;
    text-transform: uppercase;
    background: #db0000;
    color: #fff;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    display: inline-block;
}

#hero a.btn:hover {
    text-decoration: none;
    background: #b60101;
}



h3.latest {
    font-family: "proxima-nova-condensed", "Helvetica Neue", Arial, Helvetica, sans-serif;
    color: #db0000;
    font-size: 24px;
    letter-spacing: -1px;
    font-weight: 600;
    font-style: normal;
    text-transform: uppercase;
    width: 94%;
    margin: 10px 3% 5px 3%;
    padding-bottom: 5px;
    border-bottom: 1px solid #ebebeb;
}

h3.latest span {
    display: none;
    font-family: "ff-meta-serif-web-pro", Georgia, Times, “Times New Roman”, serif;
    /* font-style: italic; */
    color: #999;
    font-size: 14px;
    float: right;
    clear: both;
    letter-spacing: 0;
    padding: 10px 0;
    text-transform: none;
    font-weight: 400;
}


.col {
    width: 94%;
    margin: 7px 3%;
    /* background-color: #efefef; */
    float: left;
    clear: none;
}

.col h2  {
    margin: 2px 0 10px 0 !important;
    font-size: 1.3em;
    line-height: 1.1em;
    text-transform: none !important;
}

.col h2 a {
    color: #000;
}


.col h4 {
    font-family: "proxima-nova-condensed", "Helvetica Neue", Arial, Helvetica, sans-serif;
    font-size: 15px;
    line-height: 16px;
    margin: 0;
    font-weight: 400;
    text-transform: uppercase;
}

.col h4 a:hover {
    text-decoration: none;
}

.col p {
    font-size: 16px;
    line-height: 1.3em;
    margin: .4em 0 0.5em 0;
}

.col em {
    font-family: "ff-meta-serif-web-pro", Georgia, Times, “Times New Roman”, serif;
    font-style: italic;
    color: #999;
    font-size: 15px;
}





.alignright {
    float: right;
    clear: none;
}

.alignleft {
    float: left;
    clear: none;
}

#news{
    margin-top: 60px;
    padding: 0 15px;
}
	
	#news em {
		font-style: italic;
		color: #999;
		font-size: 14px;
	}

    #news p a, #news ul li a {
/*        color:#0b73a0;*/
        border-bottom:1px solid #e6e6e6;
        text-decoration:none;
    }
    #news p a:hover {
        border-bottom-color:#666;
    }
    #news h1{
		color: #cc3333;
        font-size: 20px;
        font-family: "ff-meta-serif-web-pro";
        font-weight: normal;
        margin: 0 0 0.5em 0;
        padding: 0;
    }
    
    #news h1.title {
        color: #db0000;
        font-size: 32px;
        line-height: 34px;
        font-family: "ff-meta-serif-web-pro";
        font-weight: normal;
        margin: 0 0 10px 0;
        padding: 0 0 10px 0;
        border-bottom: 1px solid #CCC;
    }
    
    #news h1.title span {
    	font-family: "freight-sans-pro", Georgia, sans-serif;
        font-weight: 600;
        font-style: normal;
	    font-size: 16px;
	    text-transform: uppercase;
	    float: right; 
	    clear: none;
	    margin: 8px 0 0 0;
	}

     #news h1.topic-title {
        color: #000;
        font-size: 32px;
        line-height: 34px;
        font-family: "ff-meta-serif-web-pro";
        font-weight: normal;
        margin: 0 0 10px 0;
    }

    #news h1.about {
        font-family: "proxima-nova-condensed", "Helvetica Neue", Arial, Helvetica, sans-serif;
        font-weight: 600;
        font-style: normal;
        letter-spacing: -1px;
        color: #000;
        text-transform: none;
        font-size: 30px;
        line-height: 30px;
        margin: 0 0 20px 0;
    }

    #news h3.masthead {
        font-family: "proxima-nova-condensed", "Helvetica Neue", Arial, Helvetica, sans-serif;
        font-weight: 600;
        font-style: normal;
        letter-spacing: -1px;
        color: #000;
        text-transform: none;
        font-size: 30px;
        line-height: 30px;
        padding: 30px 0 10px 0;
        border-bottom: 1px solid #dadada;
        margin: 30px 0 30px 0;
    }

    #news .bio {
        float: left;
        clear: both;
        margin: 0 0 30px 0;
    }

    #news .bio h2 { 
        margin-top: 0 !important;
    }

    #news .bio h4 {
        color: #999;
        margin: -5px 0 0 0;
        font-family: "ff-meta-serif-web-pro";
        font-style: italic;
        font-weight: 400;
    }
    
    #news .bio img {
        border: 1px solid #dadada;
        padding: 5px;
        float: left;
        clear: none;
        margin: 0 20px 10px 0;
    }
	
	#news h3.stories {
        color: #db0000;
        font-size: 20px;
        line-height: 24px;
        font-family: "ff-meta-serif-web-pro";
        font-weight: normal;
        margin: 0 0 25px 0;
        padding: 0 0 10px 0;
        border-bottom: 1px solid #CCC;
    }
    
    #news .category {
        display: none;
        color: #999;
        font-family: "ff-meta-serif-web-pro", Cambria, Georgia, Times, “Times New Roman”, serif;
        font-size: 14px;
        font-weight: normal;
        line-height: 15px;
        margin: 0 0 0 0;
        padding: 0;
    }

    #news .topic-crumb {
        font-family: "proxima-nova-condensed", Georgia, Times, “Times New Roman”, serif;
        font-size: 15px;
        line-height: 18px;
        font-weight: 600;
        font-style: normal;
        text-transform: uppercase;
    }
    
    #news .timestamp {
	    font-family: "ff-meta-serif-web-pro", Cambria, Georgia, Times, “Times New Roman”, serif;
	    font-size: 14px;
	    font-style: italic;
	    color: #999;
	    margin: 20px 0;
    }
    
        h2, #news article h2 {
            color: #333;
            font-family: "proxima-nova-condensed", Georgia, sans-serif;
            font-weight: 700;
            font-style: normal;
            font-size: 1.6em;
            margin: 0 0 0.5em 0;
            line-height: 1.1em;
            letter-spacing: 0em;
            text-transform: none;
        }
        p, #news article p {
            margin: .4em 0 1.5em 0;
            font-family: "ff-meta-serif-web-pro", Cambria, Georgia, Times, “Times New Roman”, serif;
            font-weight: 400;
            font-style: normal;
            color: #444;
            font-size: 16px;
            line-height: 1.5em;
        } 

        #news article ul {
            list-style: none;
            margin: 0 0 20px 0;
            padding: 0;
        }

        #news article ul li {
            margin: 0em 0 0.5em 0;
            font-family: "ff-meta-serif-web-pro", Cambria, Georgia, Times, “Times New Roman”, serif;
            font-size: 16px;
            line-height: 1.4em;
        }

        #news article .subscribe {
            color: #333;
            font-family: "proxima-nova-condensed", Georgia, sans-serif;
            font-weight: 600;
            font-style: normal;
            font-size: 0.9em;
            margin: 0.5em 0 1.5em 0;
            line-height: 1.1em;
            letter-spacing: 0em;
            text-transform: uppercase;
        }

        #news article .subscribe span {
            padding: 0 5px;
            color: #c3c3c3;
        }

        #news article .subscribe strong {
            padding-right: 5px;
            font-weight: 600;
            font-style: normal;
        }

        #news article img {
            width: 100%;
            height: auto;
        }

        #news article caption, #news article .caption {
            font-family: "proxima-nova-condensed", Georgia, sans-serif;
            font-weight: 400;
            font-style: normal;
            font-size: 0.8em;
            line-height: 0.8em;
            color: #999;
            margin: -10px 0 30px 0;
        }
        
        
        #news a.topic {  
	        font-family: "proxima-nova-condensed", Georgia, sans-serif;
            font-weight: 700;
            font-style: normal;
            font-size: 15px;
            margin: 5px 0;
            line-height: 40px;
            letter-spacing: .07em;
            text-transform: uppercase;
            background: #eee;
            color: #999;
            -webkit-border-radius: 3px;
            -moz-border-radius: 3px;
            border-radius: 3px;
            padding: 2px 7px 1px 7px;
        }
        
        #news a.topic:hover {
	        text-decoration: none;
	        background: #db0000;
	        color: #fff;
	        border-bottom: none;
        }
		
		#news a.btn {
			padding: 2px 10px;
			font-size: 14px;
			margin: 0 0 25px 0;
			font-family: "proxima-nova-condensed", "Helvetica Neue", Arial, Helvetica, sans-serif;
			font-weight: 400;
			font-style: normal;
			text-transform: uppercase;
			background: #eee;
			color: #999;
			-webkit-border-radius: 3px;
			-moz-border-radius: 3px;
			border-radius: 3px;
			display: inline-block;
		}
	
		#news a.btn:hover {
	    	text-decoration: none;
			background: #db0000;
			color: #fff;
		}
        
        #news footer {
            display: none;
        }
    aside { }
    aside section {
        border-top: 1px solid #f1f1f1;
        padding: 15px;
    }
    aside section h2 {
        color: #333;
        font-family: "proxima-nova-condensed", Georgia, sans-serif;
        font-size: 14px;
        font-weight: 700;
        font-style: normal;
        line-height: 14px;
        margin: 0 0 1.0em 0;
        padding: 0;
        letter-spacing: 0em;
        text-transform: uppercase;
    }
    aside section h3, aside section h4 {
        color: #999;
        font-family: "ff-meta-serif-web-pro", Cambria, Georgia, Times, “Times New Roman”, serif;
        font-size: 14px;
        font-weight: normal;
        line-height: 18px;
        margin: 0;
        padding: 0;
    }

    aside section h4 {
        font-family: "proxima-nova-condensed", Helvetica, Arial, sans-serif;
        font-size: 12px;
        text-transform: uppercase;
        line-height: 14px;
    }
	
	aside section a.btn {
		padding: 2px 10px;
		font-size: 14px;
		margin: 5px 0 10px 0;
		font-family: "proxima-nova-condensed", "Helvetica Neue", Arial, Helvetica, sans-serif;
		font-weight: 400;
		font-style: normal;
		text-transform: uppercase;
		background: #db0000;
		color: #fff;
		-webkit-border-radius: 3px;
		-moz-border-radius: 3px;
		border-radius: 3px;
		display: inline-block;
	}
	
	aside section a.btn:hover {
    	text-decoration: none;
    	background: #b60101;
	}

    #links, #date-nav {
        padding: 0 15px;
    }
   
    
    #author { padding-top: 30px; text-align: center; }

    #m-author {
        width: 100%;
        float: left;
        clear: none;
    }
	
	.m-author-left {
		float: left;
		clear: none;
	}
	
	.m-author-right {
		float: right;
		clear: none;
	}
	
	.m-author-etc {
		float: left;
		clear: both;
		width: 100%;
		text-align: center;
	}

    #m-advert, #announcement {
        width: 100%;
        float: left;
        clear: none;
        text-align: center;
    }

    #announcement {
        margin: 0 auto 20px auto;
        padding: 10px 0px;
        background: #fff;
        border-top: 1px solid #eee;
        border-bottom: 1px solid #eee;
    }
    
    #announcement h3 {
        color: #333;
        font-family: "proxima-nova-condensed", Georgia, sans-serif;
        font-weight: 700;
        font-style: normal;
        font-size: 1.3em;
        margin: 0.25em 0;
        line-height: 1.1em;
        letter-spacing: 0em;
        text-transform: none;
    }

    #announcement p {
        font-size: 16px;
        line-height: 20px;
        color: #666;
        margin: 0 0 0.25em 0;
    }

    #announcement.paris h3 {
        font-size: 1.2em;
    }

    #announcement.paris p {
        font-size: 14px;
        line-height: 19px;
    }

    #author img{
        float: left;
        margin: 0 10px 10px 0;
		clear: none;
		
    }
    #author h2, #m-author h2, #support h2 {
        margin-bottom: 0.3em;
    }
    #author h3 a, #m-author h3 a {
        font-size: 16px;
        line-height: 16px;
    }

    #support h3 a {
        font-size: 18px;
        line-height: 28px;
    }

    #subnav {
        margin: 10px 0 15px 0;
        padding: 10px 0;
        width: 100%;
        height: 36px;
        border-top: 1px solid #e3e3e3;
        border-bottom: 1px solid #e3e3e3;
        clear: both;
    }

    #subnav ul {
        list-style: none;
        margin: 0;
        border: 0;
        padding: 0 0 0 5px;
        margin: 0;
    }

    #subnav li {
        font-family: "proxima-nova-condensed", Georgia, Times, “Times New Roman”, serif;
        font-size: 15px;
        line-height: 15px;
        font-weight: 600;
        font-style: normal;
        text-transform: uppercase;
        margin: 0 0px;
        padding: 0 12px;
        float: left;
        clear: none;
        border-right: 1px solid #e3e3e3;
    }

    #subnav li:last-child {
        border-right: none;
    }

    #subnav li a, #subnav li a:visited {
        color: #222;
    }

    #subnav li a:hover, #subnav li a:active {
        color: #db0000;
        text-decoration: none;
    }
    
    #advert, #m-advert { display: block; overflow: hidden; background: #f5f5f5; padding: 15px; border-bottom: none; margin: 15px 0; }
	#m-advert {
		margin: 0 auto 20px auto;
		padding: 10px 0px;
		background: #fff;
		border-top: 1px solid #eee;
		border-bottom: 1px solid #eee;
	}
    #advert h4, #m-advert h4 { margin: 0 0 0 0; }
    #advert p, #m-advert p {
        font-family: "ff-meta-serif-web-pro", Cambria, Georgia, Times, “Times New Roman”, serif;
        font-size: 13px;
        line-height: 15px;
        color: #999;
        margin: 0;
        padding: 0;
    }

    #m-advert .plug {
            padding: 10px 0;
            border-top: 1px #ddd;
            font-family: "proxima-nova-condensed", Georgia, Times, “Times New Roman”, serif;
            font-size: 10px;
            text-align: center;
            text-transform: uppercase;
        }

    #advert img, #author img, #m-author img { background: #fff; width: 130px; height: 98px; padding: 5px; margin-bottom: 5px; border: 1px solid #dadada; }
    #author img, #m-author img { margin-bottom: 10px; }
	#m-advert img { width: 300px; height: 50px; border: none; }
	#m-author img { margin-right: 10px; }
    #advert .left, #m-advert .left { float: left; clear: none; width: 120px; text-align: center; font-size: 10px; line-height: 14px; color: #ccc; margin-bottom: 5px; }
    #advert .right, #m-advert .right { float: left; clear: none; margin-left: 10px; }

    #podcast { display: block; overflow: hidden; }
    #podcast h4 { margin: 0 0 0 0; }
    #podcast p {
        font-family: "ff-meta-serif-web-pro", Cambria, Georgia, Times, “Times New Roman”, serif;
        font-size: 13px;
        line-height: 15px;
        text-align: center;
        color: #999;
        margin: 0;
        padding: 0 0 3px 0;
    }
    #podcast img { background: #fff; width: 210px; height: 75px; margin: 0 0 5px 40px; border: none; }
    #podcast .left { float: left; clear: none; width: 120px; text-align: center; font-size: 10px; line-height: 14px; color: #ccc; }
    #podcast .right { float: left; clear: none; margin-left: 10px; }

    #podcast-links { 
        font-family: "ff-meta-serif-web-pro", Cambria, Georgia, Times, “Times New Roman”, serif;
        font-size: 13px;
        line-height: 15px;
        text-align: center;
        color: #999;
        margin: 0;
        padding: 0; }
    #podcast-links span { color: #ddd; padding: 0 3px; }
    #podcast-links a.radio { background: url(../img/podcast-mule@2x.png) 0 0 no-repeat; background-size: 15px 15px; padding: 0 0 0 20px; }
    #podcast-links a.itunes { background: url(../img/podcast-itunes@2x.png) 0 0 no-repeat; background-size: 15px 15px; padding: 0 0 0 20px; }
    #podcast-links a:hover.radio { background: url(../img/podcast-mule-hover@2x.png) 0 0 no-repeat; background-size: 15px 15px; padding: 0 0 0 20px; }
    #podcast-links a:hover.itunes { background: url(../img/podcast-itunes-hover@2x.png) 0 0 no-repeat; background-size: 15px 15px; padding: 0 0 0 20px; }

    #yesterday h2{
        margin: 0;
    }
    #yesterday a{
        color: #db0000;
    }

    #date-nav {
        margin: 50px 0 30px 0;
    }

    #date-nav ul {
        list-style:none;
        margin: 0;
        overflow:hidden;
        padding-left: 0px;
    }
    #date-nav a {
        /* border-left:1px solid #CCC; */
        display:inline;
        /*float:right;*/
        font-family: "proxima-nova-condensed", Georgia, sans-serif;
        font-weight: 600;
        font-style: normal;
        font-size:22px;
        padding:0;
        text-transform:uppercase;
        /*width:50%;*/
    }
    #date-nav li:first-child a {
        border-left:0;
        float:left;
        padding:0 15px 0 0;
        text-align:right;
    }

    .align-left {
        float: left;
        clear: none;
    }

    .align-right {
        float: right;
        clear: none;
    }

    #meta h2{
        background: url(../img/logo-rail.png) no-repeat;
        background-size: 175px 29px;
        display: block;
        text-indent: -9999px;
        height: 30px;
        width: 176px; 
        margin: 0 62px 15px;
    }
    #meta p{
        font-family: "ff-meta-serif-web-pro", Cambria, Georgia, Times, “Times New Roman”, serif;
        font-size: 14px;
        color: #999;
        margin: 0;
        padding: 0;
    }
    
    #meta p.metalinks {
	    margin: 10px 0;
    }
    
    #meta p.metalinks span { padding: 0 5px; color: #aaa; }
    
    #mule-logo a{
        background: url(../img/mule-logo.png) 0 0 no-repeat;
        width: 46px;
        height: 38px;
        margin: 1.5em auto;
        display: block;
        text-indent: -314159px;
    }

    .date { color: #db0000;  }


    .share {
        text-align: center;
        font-family: "proxima-nova-condensed", Georgia, sans-serif;
        font-weight: 600;
        font-style: normal;
        font-size: 16px;
        text-transform: uppercase;
        margin: 0 0 25px 0;
    }

    .share span {
        color: #e3e3e3;
        padding: 0 5px;
    }


    div.sharedaddy div.sd-block {
        border-top: none !important;
        padding: 10px 0 5px;
        margin: 0;
        width: 100% !important;
    }

    div.sharedaddy .sd-content {
        width: 100%;
        float: left !important;
        margin: 0 !important;
    }


    footer {
        font-family: "ff-meta-serif-web-pro", Cambria, Georgia, Times, “Times New Roman”, serif;
        font-size: 14px;
        color: #999;
        float: left;
        clear: both;
        width: 92%;
        max-width: 92%;
        /* margin: 0 3.90625% 35px 3.90625%; */
        margin: 0 15px 35px 15px;
        padding: 20px 0;
        border-top: 1px solid #f1f1f1;
    }

    #ft-copy {
        float: left;
        clear: both;
        margin: 15px 0 0 0;
    }

    #ft-nav {
        float: left;
        clear: both;
        margin: 0 0 0 -10px;
    }

    #ft-nav ul {
        list-style: none;
        margin: 0;
        border: 0;
        padding: 0 0 0 5px;
        margin: 0;
    }

    #ft-nav li {
        padding: 0 5px;
        float: right;
        clear: none;
        border-right: 1px solid #e3e3e3;
        font-size: 14px;
        line-height: 14px;
        margin: 0;
    }

    #ft-nav li:first-child {
        border-right: none;
        padding-right: 0;
    }


    #promo::before {
        content: "\0025CF";
        color: #C33;
        font-size: 20px;
        text-align: center;
        padding-bottom: 20px;
        display: block;
    }

    #promo, #picker{
        display: block;
        margin: 20px 0 25px 0; 
        font-family: ff-meta-serif-web-pro, Cambria, Georgia, Times, serif; 
        font-size: 16px; 
        line-height: 1.5em; 
        color:#999; 
        font-style:italic;
    }
    #picker{
        margin: 5px 0 10px 0;
    }

    #promo a {
        /*color:#0b73a0;*/
        border-bottom:1px solid #e6e6e6;
        text-decoration:none;
    }
    #promo a:hover {
        border-bottom-color:#666;
    }
body{
    height: 100%;
}
#sweetWrapper{
    background: #FFF;
    left: 0;
    position: absolute;
    width: 100%;
    z-index: 2;
}
#sweetWrapper.offscreen{
    left: -100%;
    -webkit-transition-property: left;
    -webkit-transition-duration: 1s;
    transition-property: left;
    transition-duration: 1s;
}
#sweetWebview{
    height: 100%;
    width: 100%;
    position: absolute;
    z-index: 1;
}
#sweetFrame{
    height: 100%;
    width: 100%;
}



/* Dropdown for the Edition Selector */


.dropdown {
    position: absolute;
    z-index: 9999999;
    display: none;
    color: #333;
    font-family: "proxima-nova-condensed", Georgia, sans-serif;
    font-size: 14px;
    font-weight: 700;
    font-style: normal;
    line-height: 14px;
    letter-spacing: 0em;
    text-transform: uppercase;
}

.dropdown .dropdown-menu,
.dropdown .dropdown-panel {
    min-width: 160px;
    max-width: 360px;
    list-style: none;
    background: #FFF;
    border: solid 1px #DDD;
    border: solid 1px rgba(0, 0, 0, .2);
    border-radius: 6px;
    box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
    overflow: visible;
    padding: 4px 0;
    margin: 0;
}

.dropdown .dropdown-panel {
    padding: 10px;
    overflow: hidden;
}

.dropdown.dropdown-tip {
    margin-top: 8px;
}

.dropdown.dropdown-tip:before {
  position: absolute;
  top: -6px;
  left: 14px;
  content: '';
  border-left: 7px solid transparent;
  border-right: 7px solid transparent;
  border-bottom: 7px solid #CCC;
  border-bottom-color: rgba(0, 0, 0, 0.2);
  display: inline-block;
}

.dropdown.dropdown-tip.dropdown-anchor-right:before {
    left: auto;
    right: 14px;
}

.dropdown.dropdown-tip:after {
  position: absolute;
  top: -5px;
  left: 10px;
  content: '';
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-bottom: 6px solid #FFF;
  display: inline-block;
}

.dropdown.dropdown-tip.dropdown-anchor-right:after {
    left: auto;
    right: 15px;
}


.dropdown.dropdown-scroll .dropdown-menu,
.dropdown.dropdown-scroll .dropdown-panel {
    max-height: 358px;
    overflow: auto;
}

.dropdown .dropdown-menu LI {
    list-style: none;
    padding: 0 0;
    margin: 0;
    line-height: 18px;
}

.dropdown .dropdown-menu LI > A,
.dropdown .dropdown-menu LABEL {
    display: block;
    color: #555;
    text-decoration: none;
    line-height: 18px;
    padding: 3px 15px;
    white-space: nowrap;
}

.dropdown .dropdown-menu LI > A:hover,
.dropdown .dropdown-menu LABEL:hover {
    background-color: #08C;
    color: #FFF;
    cursor: pointer;
}

.dropdown .dropdown-menu .dropdown-divider {
    font-size: 1px;
    border-top: solid 1px #E5E5E5;
    padding: 0;
    margin: 5px 0;
}

a.tugboat {
	display: none;
	background: url(../img/tugboat.png) 0 0 no-repeat;
	background-size: 130px 90px;
	width: 130px;
	height: 45px;
	text-indent: -9999px;
	margin: 10px auto 15px auto;
}

a.tugboat:hover {
	display: block;
	background: url(../img/tugboat.png) 0 -45px no-repeat;
	background-size: 130px 90px;
	width: 130px;
	height: 45px;
	text-indent: -9999px;
	margin: 10px auto 15px auto;
}




    

@media only screen and (-webkit-min-device-pixel-ratio : 2){
    header h1 a{
        background: url(../img/logo.png) no-repeat;
        background-size: 150px 25px;
    }
    }
    #mule-logo a{
        background: url(../img/mule-logo@2x.png) 0 0 no-repeat;
        background-size: 46px 38px;
    }

    #podcast a.radio { background: url(../img/podcast-mule@2x.png) 0 0 no-repeat; background-size: 15px 15px; padding: 0 0 0 20px; }
    #podcast a.itunes { background: url(../img/podcast-itunes@2x.png) 0 0 no-repeat; background-size: 15px 15px; padding: 0 0 0 20px; }
}

@media screen and (orientation:landscape) and (max-width:767px) {
    header{
        position: static;
    }
    #news{
        margin-top:10px;
        padding:0 25px;
    }
}

/* ==|== media queries ======================================================
   EXAMPLE Media Query for Responsive Design.
   This example overrides the primary ('mobile first') styles
   Modify as content requires.
   ========================================================================== */


@media only screen and (max-width: 480px){
    #news article .subscribe {
        text-align: center;
    }
    #news article .subscribe strong {
        display: none;
    }
	
	ul, ol {
		font-size: 16px;
	}
}


@media only screen and (min-width: 480px){

    #ft-nav li {
        padding: 0 12px;
    }
	
	#news h1 {
		color: #cc3333;
		font-size: 26px;
	}
}

@media screen and (max-width: 768px) {

    #author, #advert {
        display: none;
    }

    #m-author {
        display: block;
    } 

    #m-advert {
        display: none;
    } 

    #news h1 {
        margin-top: 1.0em;
    }

}

@media screen and (max-width: 879px) {
    #menu, #menu:active, #menu:visited {
        border: none;
        display: block;
        color: #aaa;
        font-size: 13px;
        font-weight: bold;
        height: 28px;
        line-height: 26px;
        padding: 0 8px;
		
        position: absolute;
        /* -webkit-transform: translatez(0);
        -moz-transform: translatez(0);
        -o-transform: translatez(0);
        transform: translatez(0); */
        text-decoration: none;
        top: 7px;
        right: 10px;
        background: transparent url(../img/hamburger.png) 0 1px no-repeat;
        background-size: 25px 50px !important;
        height: 23px;
        margin: 6px 2px 0;
        width: 25px;
        -webkit-background-size: 25px 23px;
        -moz-background-size: 25px 23px;
        -o-background-size: 25px 23px;
        background-size: 25px 23px;
        text-indent: -9999px;
    }

    #nav {
        display: none;
    }

}


@media only screen and (min-width: 768px){

    p, #news article p {
        font-size: 18px;

    } 

    #news h1{
        color: #db0000;
        /* color: #cc3333; */
        font-size: 20px;
        font-family: "ff-meta-serif-web-pro";
        font-weight: normal;
        margin: 0 0 0.8em 0;
        padding: 0;
    }

    h3.latest {
        width: 98%;
        margin: 20px auto 5px auto;
    }

    h3.latest span {
        display: inline-block;
    }


    .col {
        width: 23%;
        margin: 20px 1%;
        /* background-color: #efefef; */
        float: left;
        clear: none;
    }

    #hero .caption {
        display: block;
        background-color: #000;
        background-color:rgba(0,0,0,0.7);
        display: block;
        position: absolute;
        padding: 2px 10px;
        left: 3%;
        bottom: 10px;
        font-family: "proxima-nova-condensed", "Helvetica Neue", Arial, Helvetica, sans-serif;
        font-size: 13px;
        font-weight: 300;
        color: #fff;
    }
	
	#hero .feature {
        display: block;
        position: absolute;
        left: 0;
        bottom: 0;
		height: 100%;
        width: 63%;
        background-color: #000;
        background-color:rgba(0,0,0,0.5);
	}
	
	#hero .feature h2 {
        font-family: "proxima-nova-condensed", "Helvetica Neue", Arial, Helvetica, sans-serif;
        font-size: 32px;
	}

    #hero .promo h1 {
        font-family: "proxima-nova-condensed", "Helvetica Neue", Arial, Helvetica, sans-serif;
        font-size: 32px;
    }

    #hero {
        min-height: 360px;
    }

    #hero .promo {
        display: block;
        position: absolute;
        right: 3%;
        bottom: 30px;
        width: 30%;
    }

    #footer {
        margin: 0 20px 35px 20px;
    }

    header h1 a{
    	display: block;
        margin: 13px 0 0 0;
        margin: 13px 0 0 -15px;
        background:url(../img/logo.png) no-repeat; 
        background-size: 150px 25px;
        height: 25px;
        width: 150px;
    }

    #edition-selector select{
        background: url(../img/big-dropdown-tick.png) no-repeat;
        background-color: #eee;
        background-size: 10px 9px; 
        background-position: 155px 8px;
        font-size: 16px;
        margin: 10px auto 0 auto;
        padding: 4px 25px 4px 8px;
        float: none;
        width: 170px;
    }


     #news .bio img {
        margin: 0 20px 30px 0;
    }

    #m-author, #m-advert {
        display: none;
    }

    #author, #advert,  {
        display: block;
    } 


    #news {
        padding: 0;
        width: auto;
        margin: 80px 20px 20px 180px;
    }

    #links {
        padding: 0;
        width: auto;
        margin: 0 20px 20px 180px;
    }

    #date-nav {
        padding: 10px 0 0 0;
        width: auto;
        margin: 0px 20px 20px 180px;
    }    

    #news h1 {
        font-size: 26px;
    }

    #news .category {
        display: block;
        color: #999;
    }

    #news::after {
        content: "\0025CF";
        color: #db0000;
        font-size: 20px;
        text-align: center;
        display: block;
    }

    #ft-copy {
        float: left;
        clear: none;
        height: 26px;
        margin: 0 0 0 0;
        padding: 0 0 0 30px;
        display: block;
        background: url(../img/babymule.png) 0 -2px no-repeat;
        background-size: 30px 26px;
    }

    #ft-nav {
        float: left;
        clear: both;
        margin: 0 0 20px 0;
    }

    #ft-nav ul {
        border: 0;
        padding: 0;
        margin: 0;
    }
     
    aside{
        margin-top: 40px;
        margin-right: 3.90625%;
        padding-top: 0px;
        width: 140px;
    }
        aside section{
            border-top: none;
            padding: 15px 0;
        }
        aside section:last-child{
            border-bottom: none;
        }

        #author {
            position: absolute;
            left: 20px;
            width: 130px;
            display: block;
            margin: 100px 0 0 0;
            padding: 0;
        }



        #advert {
            width: 130px;
            display: block;
            position: absolute;
            left: 20px;
            background: transparent;
            padding: 0px;
            border-bottom: none;
            margin: 450px 0 0 0;
        }

        #advert.about {
            margin: 95px 0 0 0;
        }

        #advert img, #m-advert img, #author img, #m-author img {
            border: 1px solid #dadada;
            padding: 5px;
        }

        #advert .plug {
            padding: 10px 0;
            font-family: "proxima-nova-condensed", Georgia, Times, “Times New Roman”, serif;
            font-size: 10px;
            text-align: center;
            text-transform: uppercase;
        }

        
        
        #support {
            border-top: 1px solid #e3e3e3;
            border-bottom: 1px solid #e3e3e3;
            margin-bottom: 20px;
        }

        #meta {
            padding: 0;
        }

         #links .wrapper {
            padding: 15px 0 20px 0;
        }

        #links .col {
            width: 23%;
            float: left;
            clear: none;
            color: #aaa;
            font-family: "proxima-nova-condensed", Georgia, Times, “Times New Roman”, serif;
            font-size: 18px;
            line-height: 20px;
            font-weight: 400;
            font-style: normal;
            list-style: none;
            margin: 0 2% 2em 0;
            padding: 0;
        }
        
}
@media only screen and (min-width:768px) and (max-width:768px) {
    
    #date-nav a {
        padding: 0;
        font-size: 17px;
    }

    #podcast img { margin: 0 0 5px 5px; }

    footer {
        max-width: 700px;
    }
}

@media only screen and (min-width:880px) {

    #menu {
            display: none;
        }

    #nav {
        display: block !important;
        float: none;
    }

    .h-category {
        display: none;
    }

    #nav {
        margin: 17px auto 0 auto;
        max-width: 700px;
        padding: 0;
        background: transparent;
        display: block;
        clear: none;
        width: auto;
        border: none;
        box-shadow: none;
    }

    #nav ul {
        list-style: none;
        border: 0;
        padding: 0;
        margin: 0;
    }

    #nav li {
        font-family: "proxima-nova-condensed", "Helvetica Neue", Arial, Helvetica, sans-serif;
        font-size: 18px;
        line-height: 15px;
        font-weight: 400;
        font-style: normal;
        text-transform: uppercase;
        margin: 0 0px;
        padding: 0 16px;
        float: left;
        clear: none;
        border-left: 1px solid #333;
        /* border-left: 1px solid #e3e3e3; */
        border-bottom: none;
        width: auto;
    }

    #nav li:first-child {
        border-left: none;
        padding-left: 0;
    }

    #topright {
        display: block;
        margin-right: 0;
        float: right;
        clear: none;
        width: 140px;
    }

    #topright li a.viaemail {
        padding: 0 13px;
    }

    #topright li a.twitter {
        display: block;

    }

    #topright li a.facebook {
        display: block;
    }

    #topright li a.rss {
        display: block;

    }

     #links {
        margin: 0 auto 20px auto;
    }

    #news{
        max-width: 62%;
        margin: 80px auto 20px auto;
    }

    header h1 a{
        margin: 13px 0 0 0;
    }

    #date-nav {
        margin: 50px auto;
    }

    #author {
        position: absolute;
        left: 0;
        margin: 100px 0 0 0;
    }

    #advert {
        position: absolute;
        left: auto;
        right: 0;
        margin: 100px 0 0 0;
    }

    #footer {
        margin: 0 3.90625% 35px 3.90625%;
    }

    #ft-nav {
        float: right;
        clear: none;
        margin: 0 0 0 0;
    }

    #ft-nav ul {
        padding: 0 0 0 5px;
        margin: 0;
    }
     

}


/* specific media queries for the ad block description in the right rail */

@media only screen and (min-width: 320px) {

	#advert .right { width: 155px; }
	#advert p { 
        padding-bottom: 10px;
        border-bottom: 1px solid #f1f1f1;
    }

}
	

@media only screen and (min-width: 768px) {

	#advert .right { width: 130px; margin-left: 0; }
}

@media only screen and (min-width: 1024px) {

	#advert .right { width: 130px; }

}


/* hi-def tablets e.g. retina ipads */
@media only screen and (min-width: 768px) and (-webkit-min-device-pixel-ratio: 2){
    header h1 a{
        background: url(../img/logo.png) no-repeat;
        background-size: 150px 25px;
    }

}

@media only screen and (min-width: 1000px){
    body .wrapper{
        width: 96%;
        max-width: 1400px;
        margin: 0 auto;
        position: relative;
    }
    aside{
        max-width: 140px;
        z-index: 1;
    }

    #header-main {
        padding: 0;
    }

    #news, #links, #date-nav {
        max-width: 660px;
        padding: 0 20px 0 20px;
    }

    #nav {
        padding: 0 0 0 40px;
    }

    aside {
        margin-right: 0;
    }

    footer {
        width: 100%;
        max-width: 100%;
        margin: 30px 0 35px 0;
    }
}

@media only screen and (min-width: 1060px){

    #news, #links, #date-nav {
        max-width: 700px;
        padding: 0;
    }

    #nav {
        padding: 0;
    }
}



/* ==|== non-semantic helper classes ========================================
   Please define your styles before this section.
   ========================================================================== */

/*
 * Image replacement
 */

.ir {
    border: 0;
    font: 0/0 a;
    text-shadow: none;
    color: transparent;
    background-color: transparent;
}

/*
 * Hide from both screenreaders and browsers: h5bp.com/u
 */

.hidden {
    display: none !important;
    visibility: hidden;
}

/*
 * Hide only visually, but have it available for screenreaders: h5bp.com/v
 */

.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

/*
 * Extends the .visuallyhidden class to allow the element to be focusable
 * when navigated to via the keyboard: h5bp.com/p
 */

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}

/*
 * Hide visually and from screenreaders, but maintain layout
 */

.invisible {
    visibility: hidden;
}

/*
 * Contain floats: h5bp.com/q
 */

.clearfix:before,
.clearfix:after {
    content: "";
    display: table;
}

.clearfix:after {
    clear: both;
}

.clearfix {
    *zoom: 1;
}



/* ==|== print styles =======================================================
   Print styles.
   Inlined to avoid required HTTP connection: h5bp.com/r
   ========================================================================== */

@media print {
    * {
        background: transparent !important;
        color: #000 !important; /* Black prints faster: h5bp.com/s */
        box-shadow:none !important;
        text-shadow: none !important;
    }

    a,
    a:visited {
        text-decoration: underline;
    }

    a[href]:after {
        content: " (" attr(href) ")";
    }

    abbr[title]:after {
        content: " (" attr(title) ")";
    }

    /*
     * Don't show links for images, or javascript/internal links
     */

    .ir a:after,
    a[href^="javascript:"]:after,
    a[href^="#"]:after {
        content: "";
    }

    pre,
    blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }

    thead {
        display: table-header-group; /* h5bp.com/t */
    }

    tr,
    img {
        page-break-inside: avoid;
    }

    img {
        max-width: 100% !important;
    }

    @page {
        margin: 0.5cm;
    }

    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3;
    }

    h2,
    h3 {
        page-break-after: avoid;
    }
}