/*
Theme Name: The Courier
Theme URI: http://www.dcthomson.co.uk
Author: Robert Paul
Author URI: http://www.dcthomson.co.uk
Description: CSS for the Blocks system.
*/

.block-title {
    font-size: 180%;
    color: #000;
}

 h3.article-title a:hover {
        text-decoration:none;
    }

.advertising + .block hr,
.carousel + .block hr,
.page-header + .block hr {
    display: none;
}

/*************
Block: Feature
*************/

.feature .article .thumbnail .category {
    position: absolute;
    bottom: 0;
    left: 0;
    padding: 10px 10px 10px 0;
    background-color: #fff;
    color: #0066b3;
}

.feature .article .synopsis {
    position: relative;
    padding-top: 10px;
    padding-bottom: 10px;
}

.feature .article .synopsis .category {
    display: none;
}

.feature .article .article-title {
    color: #fff;
}

.feature .article .meta {
    margin-top: 10px;
}

.feature:first-child > .wrap {
    padding-top: 0;
    border-top: 0 none;
}

/* Block: Feature > Boxed */
.feature .box .article .thumbnail .category {
    padding: 10px;
    background-color: #6719cd;
    background-color: rgba(255,255,255,.8);
    color: #000;
    #color: rgba(255,255,255,.6);
}

.feature .box .article .category:hover {
    color: #cb31fe;
}

.feature .box .article .synopsis {
    padding: 10px;
    height: 130px;
    #background-color: #000;
	background-color: rgba(103,25,205,.8);
	background: linear-gradient(60deg, #021429, #021429 2.4%, #6719cd 2.4%, #6719cd 16.2%, #021429 16.2%, #021429 88%, #6719cd 88%, #6719cd 100%);
}

.feature .box .article .synopsis .category {
    padding: 0;
}

.feature .box .article .meta {
    position: absolute;
    bottom: 10px;
    left: 10px;
    right: 10px;
}

/* Block: Feature > Full */
.feature.large .full {
    margin-top: 20px;
	text-decoration:none;
}

.feature .full .synopsis,
.feature .box .full .synopsis {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    display: block;
    padding: 20px;
    height: auto;
    line-height: 110%;
    background-color: #9624e4;
    background-color: rgba(103,25,205,.8);
}

.feature .box .full .synopsis {
    height: auto;
}

.feature .full .synopsis .category {
    display: block;
}

.feature .full .category {
    position: static;
    padding: 0;
    background-color: transparent;
}

.feature .full .article-title {
    clear: both;
    margin-top: 10px;
    margin-bottom: 10px;
    font-weight: 600;
	text-decoration:none;
}

.feature .full .meta,
.feature .box .full .meta {
    position: static;
}

/* Block: Feature > Boxed and Full (Shared) */
.feature .full .byline,
.feature .full .timestamp,
.feature .full .synopsis .category,
.feature .box .article .timestamp {
    color: #fff;
    color: rgba(255,255,255,.5);
}

.feature .full .synopsis .category:hover {
    color: #fff;
    color: rgba(255,255,255,1);
}

/* Block: Feature > Grid layout */
.grid-pad {
    padding-top: 10px;
    padding-bottom: 10px;
}

.feature .grid-pad .article {
    padding: 10px;
}

.feature .grid-pad .top {
    width: 100%;
}

.feature .grid-pad .grid {
    float: left;
    width: 50%;
}

.feature .grid:nth-of-type(2n + 1) {
    clear: left;
}

/* Block: Feature > Feature (Standard) */
.content > .standard:first-of-type hr {
    display: none;
}

.standard .block-title {
    margin-top: 20px;
}

.feature.standard .full .synopsis {
    bottom: 10px;
    left: 10px;
    right: 10px;
    padding: 10px;
}

.feature.standard .full .article-title {
    font-size: 180%;
}

/* Block: Feature > Feature (Large) */
.large .block-title {
    margin-top: 20px;
    margin-bottom: 20px;
}

.large .full .article-title {
    font-size: 220%;
}

/*************
Block: Section
*************/

.content > .section:first-of-type hr {
    display: none;
}

.section .block-title {
    margin-top: 20px;
}

.section .carousel .block-title {
    margin: 0 !important;
}

/**************
Block: Carousel
**************/

.carousel {
    padding-top: 20px;
    padding-bottom: 20px;
    background-color: #ffe01c;
    overflow: hidden;
    
    -moz-user-select: none;
    -ms-user-select: none;
    -o-user-select: none;
    -webkit-user-select: none;
    user-select: none;  
 background: linear-gradient(20deg, #021429, #021429 2.4%, #6719cd 2.4%, #6719cd 16.2%, #021429 16.2%, #021429 88%, #6719cd 88%, #6719cd 100%);	
}

.carousel .block-title {
    padding: 0px 0px 15px 10px;
    color: #c831fc;
	font-family:"GothamNarrow-black";
}

.carousel .prev,
.carousel .next {
    z-index: 1001;
    display: block;
    top: 0;
    width: 32px;
    height: 32px;
    background-color: #c831fc;
    font-weight: bold;    
    font-size: 32px;
    color: #fff;
}

.carousel .prev:hover,
.carousel .next:hover {
    background-color: #000;
    cursor: pointer;
}

.carousel .slideshow {
    display: block;
    min-height: 120px;
    overflow: visible !important;
}

.carousel .slideshow.js-off {
    height: 200px;
    background: url('../images/icons/loader_carousel.gif') center center no-repeat;
}

.carousel .slideshow.js-off .slide {
    display: none !important;
}

.carousel .slide {
    padding-left: 10px;
    padding-right: 10px;
    vertical-align: top;
    opacity: .25;
}

.carousel .article-title {
    margin-top: 5px;
    margin-bottom: 5px;
    white-space: normal;
}

.carousel .sponsored {
    display: none;
}

/* Block: Carousel > Theme: Default */
.carousel .theme-default .article {
    padding-left: 90px;
}

.carousel .theme-default .thumbnail {
    position: absolute;
    top: 0;
    left: 0;
    width: 80px;
    height: 48px;
}

.carousel .theme-default .article-title {
    line-height: 115%;
    font-size: 18px;
    color: #000;
}

/* Block: Carousel > Theme: Image */
.carousel .theme-image .article {
    max-width: 320px;
}

.carousel .theme-image .thumbnail .category {
    position: absolute;
    bottom: 0;
    left: 0;
    padding: 10px;
    background-color: #ffe01c;
	background-color: rgba(255,255,255,.8);
	color:#000
}

.carousel .theme-image .synopsis {
    padding-top: 5px;
    width: 100%;
}

.carousel .theme-image .synopsis .category {
    display: none;
}

/* Block: Carousel > Theme: Text */
.carousel .theme-text .thumbnail {
    display: none;
}

/******************
Block: Sliding List
******************/

.sliding-list {
    padding-top: 10px;
    padding-bottom: 10px;
}

.slider {
    position: relative;
}

.slider-wrap {
    position: relative;
    padding-left: 50px;
    padding-right: 50px;
    width: 100%;
}

.sliding-list .prev,
.sliding-list .next {
    position: absolute;
    top: 0;
    padding: 5px;
    background-color: #fff;
}

.sliding-list .prev:before,
.sliding-list .next:before {
    line-height: 32px;
    background-color: #eee;
    font-size: 32px;
    font-weight: normal;
    font-style: normal;
    text-align: center;
    color: #aaa;
}

.sliding-list .prev,
.sliding-list .next,
.sliding-list .prev:before,
.sliding-list .next:before {
    display: block;
    width: 32px;
    height: 32px;
}

.sliding-list .prev:hover:before,
.sliding-list .next:hover:before {
    background-color: #0066b3;
    color: #fff;
    cursor: pointer;
}

.sliding-list a {
    display: block;
    padding-left: 8px;
    padding-right: 8px;
    margin-left: 5px;
    margin-right: 5px;
    border: 1px solid #eee;
    line-height: 40px;
    background-color: #fafafa;
    font-size: 80%;
    color: #888;
}

.sliding-list a:hover {
    border-color: #aaa;
    color: #333;
}

.sliding-list.default,
.sliding-list ul,
.sliding-list a {
    height: 40px;
}

/* Block: Sliding List > Football Mode */
.sliding-list.football-mode,
.sliding-list.football-mode ul,
.sliding-list.football-mode a {
    height: 42px;
}

.football-mode a {
    position: relative;
    padding: 4px;
    height: 42px;
    line-height: 32px;
}

.football-mode a:before {
    content: '';
    display: block;
    float: left;
    margin-right: 8px;
    width: 32px;
    height: 32px;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 100%;
}

.sliding-list .aberdeen-fc:before {
    background-image: url(../images/icons/football/icon_aberdeen-fc.png);
}

.sliding-list .celtic-fc:before {
    background-image: url(../images/icons/football/icon_celtic-fc.png);
}

.sliding-list .dundee-fc:before {
    background-image: url(../images/icons/football/icon_dundee-fc.png);
}

.sliding-list .dundee-united:before {
    background-image: url(../images/icons/football/icon_dundee-united.png);
}

.sliding-list .raith-rovers-fc:before {
    background-image: url(../images/icons/football/icon_raith-rovers-fc.png);
}

.sliding-list .st-johnstone:before {
    background-image: url(../images/icons/football/icon_st-johnstone.png);
}

/************
Block Widgets
************/

.flexible {
    margin-top: 20px;
    margin-bottom: 20px;
}

.flexible .flexible-title {
    margin-bottom: 10px;
    line-height: 110%;
    font-size: 130%;
    font-weight: 600;
    color: #444;
}

.flexible .flexible-title a {
    color: inherit;
}

.boxed,
.PDS_Poll {
    padding: 10px;
    border-top: 4px solid #ddd;
    background-color: #f8f8f8;
}

/* Block Widgets > Advertising */
.flexible .mpu {
    margin-left: auto;
    margin-right: auto;
}

/* Block Widgets > Collections */
.collection .cycle-slideshow {
    margin-bottom: 10px;
    min-height: 48px;
}

.collection .article {
    display: none;
    padding-left: 90px;
    padding-bottom: 0;
    width: 100%;
    background-color: transparent;
}

.collection__article-title {
    margin-bottom: 10px;
}

.collection__article-title a {
    color: #000;
}

.collection .article .thumbnail {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 80px;
    height: 48px;
}

.collection .article .timestamp {
    float: none;
}

.collection .article p {
    margin-top: 10px;
    line-height: 110%;
    font-size: 12px;
}

.collection nav {
    position: relative;
    padding-top: 10px;
    border-top: 1px solid #ddd;
}

.collection .prev,
.collection .next {
    position: absolute;
    top: 10px;
    display: block;
    width: 20px;
    height: 20px;
    line-height: 16px;
    font-size: 24px;
    font-weight: bold;
}

.collection .prev:hover,
.collection .next:hover {
    color: #0066b3;
    cursor: pointer;
}

.collection .pager {
    padding-left: 20px;
    padding-right: 20px;
    height: 20px;
    text-align: center;
}

.collection .pager span {
    display: inline-block;
    margin: 3px;
    width: 10px;
    height: 10px;
    background-color: #ccc;
    text-indent: -9999em;
    overflow: hidden;
}

.collection .pager .cycle-pager-active {
    background-color: #0066b3;
}

/* Block Widgets > Events */
.event-calendar p {
    line-height: 100%;
    font-size: 13px;
}

/* Block Widgets > Latest Posts */
.latest-posts ul {
    list-style: none;
    text-align: left;
}

.latest-posts li {
    position: relative;
    padding: 10px 10px 10px 90px;
    border-bottom: 1px solid #eee;
    min-height: 48px;
    line-height: 1;
}

.latest-posts li:last-child {
    border-bottom: 0;
}

.latest-posts .list-thumb {
    position: absolute;
    top: 10px;
    left: 0;
    display: block;
    width: 80px;
    height: 48px;
    background-color: #eee;
    text-align: center;
}

.latest-posts h3 a {
    display: block;
    line-height: 110%;
    font-size: 16px;
    font-weight: 400;
    color: #000;
}

.latest-posts h3 a:hover {
    text-decoration: underline;
}

.latest-posts .date {
    display: inline-block;
    font-size: 12px;
    color: #aaa;
}

.latest-posts .view-more {
    text-align: center;
}

.latest-posts .view-more a {
    display: inline-block;
    padding: 10px;
    line-height: 20px;
    text-transform: uppercase;
    text-align: center;
    font-size: 13px;
    font-weight: 600;
    color: #0066b3;
}

/* Block Widgets > Latest Posts > Slim UI */
.latest-posts .boxed ul {
    max-height: 260px;
    background-color: #fff;
    overflow-y: scroll;
}

.latest-posts .boxed li {
    padding: 7px 10px;
    min-height: 20px;
}

.latest-posts .boxed h3 a {
    display: inline;
}

/* Block Widgets > Promotions */
.promotion a {
    margin-left: auto;
    margin-right: auto;
    width: 300px;
}

.promotion a,
.promotion a img {
    display: block;
}

/* Block Widgets > Textbox */
.flexible .cms h1 {
    font-size: 160%;
}

.flexible .cms h2 {
    font-size: 120%;
}

.flexible .cms h3,
.flexible .cms h4,
.flexible .cms h5,
.flexible .cms h6 {
    font-size: 100%;
}

.flexible .cms blockquote {
    font-size: 120%;
}

.flexible .cms .wp-caption {
    margin-top: 20px;
    margin-bottom: 20px;
    border-bottom: 1px solid #eee;
}

.flexible .cms .wp-caption p {
    margin: 0;
    padding-top: 5px;
    padding-bottom: 5px;
    font-size: 13px;
    color: #888;
}

.flexible .cms .wp-caption,
.flexible .cms .wp-caption img {
    max-width: 100%;
}

.flexible .cms .wp-caption a,
.flexible .cms .wp-caption img {
    display: block;
    height: auto;
}

/* Block Widgets > Weather */
.openweather-widget {
    position: relative;
    margin: 0;
    padding: 0 0 32px 70px;
    height: 80px;
}

.openweather-widget .weather-location {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 32px;
}

.weather-location select {
    margin: 0;
    border: 1px solid #ccc;
    width: 100%;
    height: 32px;
    line-height: 32px;
}

.ow-type {
    position: absolute;
    top: 0;
    left: 0;
    margin: 0;
    width: 64px;
    height: 64px;
}

.widget-wind {
    float: none;
    width: 100%;
    height: 64px;
    line-height: 64px;
    text-align: left;
}

.widget-wind:after {
    content: '';
    display: block;
    clear: both;
}

.ow-temp {
    float: left;
    margin: 0;
    line-height: inherit;
    font-weight: bold;
}

.ow-windspeed {
    position: relative;
    float: right;
    padding-left: 36px;
}

.ow-windspeed span {
    display: block;
    float: none;
    line-height: inherit;
    font-size: 16px;
    font-weight: 600;
}

.ow-temp,
.ow-windspeed span {
    font-family: 'Guardian Compact Web', 'Arial', sans-serif;
}

.wind-arrow {
    position: absolute;
    top: 16px;
    left: 0;
    display: block;
    padding-top: 32px;
    width: 32px;
    height: 0;
    background: url(../images/icons/icon_compass.png) center center no-repeat;
}

/*********
Shared CSS
*********/

/* Shared CSS > Border Radius */
.sliding-list a,
.weather-location select {
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;    
}

.carousel .next,
.carousel .prev,
.collection .pager span,
.sliding-list .next:before,
.sliding-list .prev:before {
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    -webkit-border-radius: 50%;
    border-radius: 50%;    
}

/* Shared CSS > Box Sizing */
.carousel .slide,
.carousel .theme-default .article,
.collection .article,
.feature .article .synopsis,
.feature .grid-pad .article,
.slider-wrap,
.sliding-list a {
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;    
}

/* Shared CSS > Transitions */
.block-title a,
.carousel .slideshow {
    -moz-transition: all ease .25s;
    -ms-transition: all ease .25s;
    -o-transition: all ease .25s;
    -webkit-transition: all ease .25s;
    transition: all ease .25s;    
}

/* Shared CSS > Icons */
.carousel .theme-default .format-icon,
.collection .format-icon {
    padding: 4px;
    width: 16px;
    height: 16px;
    line-height: 16px;
    font-size: 16px;
}

/************
Media Queries
************/

/* Media Queries > Mobile */
@media only screen and (max-width: 767px) {
    
    .block-title {
        font-size: 150%;
    }

    .article .article-title {
        font-size: 18px;
    }

    /* Block: Feature */
    .feature .article .synopsis,
    .feature .box .article .synopsis {
        height: auto;
    }

    .feature .article .meta,
    .feature .box .article .meta {
        position: static;
        margin: 0;
    }
    
    .feature.large .full {
        margin-top: 0;
    }    

    .feature .full .synopsis,
    .feature .box .full .synopsis {
        position: static;
        padding: 10px;
        background-color: #6719cd;
    }

    .feature .full .synopsis .article-title {
        font-size: 160%;
    }

    .feature .row-full {
        margin: 0;
    }

    .feature .grid-pad {
        padding-top: 0;
    }

    .feature .grid-pad .article.full {
        padding: 0;
    }

    .feature .grid-pad .grid {
        float: none;
        padding: 10px 0 10px 90px;
        border-bottom: 1px solid #ddd;
        width: 100%;
        min-height: 48px;
    }

    .feature .grid-pad .grid:last-child {
        border-bottom: 0;
    }

    .feature .grid-pad .grid .thumbnail .category {
        display: none;
    }

    .feature .grid-pad .grid .synopsis .category {
        position: static;
        display: block;
        padding: 0;
        background-color: transparent;
        color: #0066b3;
    }

    .feature .grid-pad .grid .thumbnail {
        position: absolute;
        top: 10px;
        left: 0;
        width: 80px;
        height: 48px;
    }

    .feature .grid-pad .grid .synopsis {
        padding: 0;
        background-color: transparent;
    }

    .feature .grid-pad .grid .article-title {
        margin-top: 5px;
        margin-bottom: 5px;
        color: #000;
    }

    .feature .grid-pad .grid .timestamp {
        color: #aaa;
    }

    .feature .block-title {
        margin-top: 15px;
        margin-bottom: 15px;
    }

    .full > .thumbnail img {
        min-height: 0;
    }

    /* Block: Section */
    .section .block-title {
        margin-top: 10px;
        margin-bottom: 10px;
    }

    .section .article .article-title {
        line-height: 120%;
        font-size: 18px;
    }

    .section .row-full {
        margin: 0;
    }

    /* Block: Carousel */
    .carousel {
        padding-top: 10px;
        padding-bottom: 10px;
    }

    .carousel .block-title {
        padding-left: 42px;
    }

    .carousel .slide.cycle-slide-active {
        opacity: 1;
    }

    .carousel .prev {
        left: 10px;
    }

    .carousel .next {
        right: 10px;
    }

    .carousel .article {
        margin-left: auto;
        margin-right: auto;
        max-width: 320px;
    }

    .carousel .theme-image {
        min-height: 320px;
    }

    /* Block: Sliding List */
    .sliding-list .prev:before,
    .sliding-list .next:before {
        background-color: #0066b3;
        color: #fff;
    }    
    
    /* Block Widgets > Collections */
    .collection .article {
        padding-bottom: 0;
    }

    /* Block Widgets > Latest Posts */
    .latest-posts h3 a {
        line-height: 120%;
        font-size: 18px;
        font-weight: 500;
    }

    .latest-posts .view-more a {
        background-color: #0066b3;
        color: #fff;
    }
}

/* Media Queries > Tablet */
@media only screen and (min-width: 768px) and (max-width: 1024px) {
    
    /* Block: Carousel */
    .carousel .slide.cycle-slide-active,
    .carousel .slide.cycle-slide-active + .slide {
        opacity: 1;
    }

    .carousel .theme-image {
        min-height: 300px;
    }

    /* Block: Sliding List */
    .sliding-list .prev:before,
    .sliding-list .next:before {
        background-color: #0066b3;
        color: #fff;
    }    
}

/* Media Queries > Desktop */
@media only screen and (min-width: 1025px) {
    
    .wrapped .block {
        margin-left: auto;
        margin-right: auto;
        width: 980px;
    }
    
    /* Block: Carousel */
    .wrapped .carousel {
        margin: 20px auto;
        border-top: 4px solid #fde400;
        width: 940px;
        background-color: #f8f8f8;
    }

    .wrapped .carousel .slideshow {
        overflow: hidden !important;
    }

    .wrapped .carousel .wrap {
        width: 100%;
    }

    .carousel .slideshow .cycle-slide-active,
    .carousel .slideshow .cycle-slide-active + .slide,
    .carousel .slideshow .cycle-slide-active + .slide + .slide {
        opacity: 1;
    }

    .carousel .theme-image {
        min-height: 300px;
    }

    /* Block Widgets > Latest Posts */
    .latest-posts .view-more a:hover {
        color: #000;
    }
    
    /* Shared CSS > Transitions */
    .carousel .next,
    .carousel .prev,
    .collection .next,
    .collection .prev,
    .feature > .article,
    .feature .top-article > .article,
    .feature .grid-pad .grid,
    .sliding-list a,
    .sliding-list .next:before,
    .sliding-list .prev:before {
        -moz-transition: all ease .2s;
        -ms-transition: all ease .2s;
        -o-transition: all ease .2s;
        -webkit-transition: all ease .2s;
        transition: all ease .2s;        
    }
}