/*   
Theme Name: OU ICE 4 2021
Theme URI: https://github.com/the-open-university/ouice
Source Reference: 71648f6160ddacbc62603de46d7ea4af502abc8b
Description: OU ICE 4 Theme
Author: Web Happens (info@webhappens.co.uk)
Author URI: https://webhappens.co.uk
Version: 1.0
*/

/*
 * 1.0 Accessibility
 * Text meant only for screen readers (styles taken from twentyseventeen theme)
 */

.screen-reader-text {
    clip: rect(1px, 1px, 1px, 1px);
    height: 1px;
    overflow: hidden;
    position: absolute !important;
    width: 1px;
    word-wrap: normal !important; /* Many screen reader and browser combinations announce broken words as they would appear visually. */
}

.screen-reader-text:focus {
    background-color: #f1f1f1;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    -webkit-box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
    box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
    clip: auto !important;
    color: #21759b;
    display: block;
    font-size: 14px;
    font-size: 0.875rem;
    font-weight: 700;
    height: auto;
    left: 5px;
    line-height: normal;
    padding: 15px 23px 14px;
    text-decoration: none;
    top: 5px;
    width: auto;
    z-index: 100000; /* Above WP toolbar. */
}

/*
 * 2.0 Widgets
 * Styles for Categories, Archive and Search widgets
 */

 .widget {
     margin-bottom: 20px;
 }

.widget_categories ul,
.widget_archive ul {
    /* .ou-list */
    margin:0 0 20px 0; 
    padding:0;
    list-style:none;
    list-style-type:none;
}

.widget_categories ul ul,
.widget_archive ul ul {
    /* .ou-list ul */
    margin:10px 0;
    padding:0 0 0 30px;
}

.widget_categories li,
.widget_archive li {
    /* .ou-list li */
    list-style:none;
    list-style-type:none;
    display:block;
    margin:0;
    line-height:150%;
}

.widget_categories form,
.widget_archive form {
    /* .ou-form */
    margin-bottom:20px;
}

.widget_categories select,
.widget_archive select {
    /* .ou-form__select */
    display:block;
    width:100%;
    padding:9px 10px;
    border:1px solid #A7A9AC;
    height:2.5em;
    border-radius:0;
}

.widget_categories select:focus,
.widget_archive select:focus {
    /* .ou-form__select:focus */
    border:1px solid #E80074;
    outline:none;
}

.widget_search form {
    /* .ou-form */
    margin-bottom:20px;
}

.widget_search form > div {
    /* Custom */
    display: -ms-flexbox;
    display: flex;
}

.widget_search form input[type="text"] {
     /* .ou-form__text */
     display:block;
     width:100%;
     padding:9px 10px;
     border:1px solid #A7A9AC;

     /* Custom */
     -ms-flex: 1;
     flex: 1;
}

.widget_search form input[type="text"]:focus {
    /* .ou-form__text:focus */
    border:1px solid #E80074;
    outline:none;
}

.widget_search form input[type="submit"] {
    /* .ou-button */
    background-color: #888;
    color: #fff;
    font-weight: bold;
    text-decoration: none;
    padding: 10px 15px;
    display: inline-block;
    margin: 0 5px 15px 0;
    cursor:pointer;
    border:0;
    text-align:center;
    line-height:120%;

    /* .ou-button--primary */
    background-color:#e80074;

    /* Custom */
    margin:0 0 0 5px;
}

.widget_search form input[type="submit"]:hover {
    /* .ou-button:hover */
    background-color:#000 !important;
    color:#fff;
    text-decoration:none;
}

/*
 * 3.0 Pagination
 * Styles for pagination elements
 */

.pagination {
    /* .ou-paged ul */
    text-align:center;
}

.pagination.prev-next li {
    /* .ou-paged li */
    display:inline-block;
    margin:0;
    padding:0;
    color:#777;
    background-color: transparent;
}

.pagination.prev-next li:before {
    /* .ou-paged li:before */
    content:normal;
}

.pagination .page-numbers,
.pagination.prev-next li > a {
    /* .ou-paged a, .ou-paged strong */
    color: #039;
    background-color: transparent;
    text-decoration: none;
    padding: 10px;
    display: block;

    /* Custom */
    display: inline-block;
    line-height: 150%;
}

.pagination .current {
    /* .ou-paged strong, .ou-paged a.ou-selected */
    color:#fff;
    background-color:#036;

    /* Custom */
    font-weight: bold;
}

.pagination a.prev:before,
.pagination a.next:after,
.pagination.prev-next li.prev > a:before,
.pagination.prev-next li.next > a:after {
    /* a.ou-paged__previous:before, a.ou-paged__next:after */
    color:#999;
    background-color: transparent;
    font-family:"Hiragino Mincho ProN";
    font-size: 10px;
    content: "\25c0";
    display:inline-block;
    margin:0 6px 0 0;
 }

 .pagination.prev-next li.next > a {
    /* .ou-paged--previous-next a.ou-paged__next */
    border:1px solid #ccc;
}

.pagination a.next:after,
.pagination.prev-next li.next > a:after {
    /* a.ou-paged__next:after */
    content: "\25b6";
    margin:0 0 0 6px;
}

.pagination .dots {
    /* Custom */
    color:#777;
}

.pagination a:hover,
.pagination.prev-next li > a:hover {
    /* .ou-paged a:hover */
    background-color:#e80074;
    color:#fff;
}

.pagination .prev:hover:before,
.pagination .next:hover:after,
.pagination.prev-next li.prev > a:hover:before,
.pagination.prev-next li.next > a:hover:after {
    /* a.ou-paged__previous:hover:before, a.ou-paged__next:hover:after */
    color:#fff;
}

/*
 * 4.0 Images
 * Inline image styles
 */

.wp-caption {
    padding: 15px;
    text-align:center;
}

.wp-caption img {
    margin:0 auto;
}

.wp-caption.alignleft,
.wp-caption.alignright {
    width:40%;
}

.wp-caption.aligncenter {
    width:80%;
}

.wp-caption .wp-caption-text {
    /* .ou-img__caption */
    margin:5px 0 0 0;
    color:#555;
    background-color: transparent;
    font-size:.9em;
}

/*
 * 5.0 Aligns
 * Alignment utility styles
 */

.alignleft {
    /* .ou-pull-left */
    float: left;
    margin: 0 25px 15px 0;
}

.alignright {
    /* .ou-pull-right */
    float: right;
    margin: 0 0 15px 25px;
}

.aligncenter {
    /* .ou-pull-centre */
    display: block;
    margin: 0 auto 15px auto;
}

@media 
only screen and (max-width: 767px), 
only screen and (max-device-width: 767px) {
    .alignleft,
    .alignright,
    .aligncenter {
        max-width:50%;
    }
}

@media 
only screen and (max-width: 400px), 
only screen and (max-device-width: 400px) {
    .alignleft,
    .alignright,
    .aligncenter {
        float:none;
        max-width:100%;
        margin:0 0 20px 0;
    }
}

/*
 * Blockquote
 * Default blockquote style
 */

blockquote {
    /* .ou-quote */
    padding:30px 30px 35px 90px;
    margin-bottom:20px;
    background:url(gui/icons/icon-quotemarks.png) 25px 32px no-repeat #333;
    color:#fff;
    position:relative;
    
    /* .ou-quote--light */
    color:#000;
    background-color: transparent;
    
    /* .ou-bg-light-grey */
    background-color:#e7eff7 !important;
}

blockquote p {
    /* .ou-quote p */
    font-size:1.2em;
}

@media 
only screen and (max-width: 400px), 
only screen and (max-device-width: 400px) {
    blockquote {
        padding:20px 15px 35px 55px;
        background:url(gui/icons/icon-quotemarks.png) 20px 25px no-repeat #333;
        background-size:25px 21px;
    }

    blockquote img {
        max-width:120px;
    }
}

@media 
only screen and (-webkit-min-device-pixel-ratio: 2) and (min-width: 768px),
only screen and (-o-min-device-pixel-ratio: 13/10) and (min-width: 768px),
only screen and (min-resolution: 192dpi) and (min-width: 768px) {
    blockquote {
        background-image:url(gui/icons/icon-quotemarks@2x.png);
        background-size:50px 42px;
    }
}

@media 
only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 767px),
only screen and (-o-min-device-pixel-ratio: 13/10) and (max-width: 767px),
only screen and (min-resolution: 192dpi) and (max-width: 767px) {
    blockquote {
        background-size:25px 21px;
    }
}

/*
 * Custom
 * Custom style tweaks
 */

#ou-site-footer p {
    color: #777;
}
