/*
Theme Name:     Material Gaze
Theme URI:      https://github.com/m-e-h/material-gaze
Author:         Marty Helmick
Description:    A clean and minimal child theme for the <a href=\"http://wordpress.org/themes/stargazer\">Stargazer</a> parent theme. This child theme takes inspiration from Google's Material Design to transform how it's parent theme looks.  It offers an alternative color scheme and comes packaged with additional headers to use with the WordPress custom header feature.
Version:        1.0.2
License:        GNU General Public License v2 or later
License URI:    http://www.gnu.org/licenses/gpl-2.0.html
Text Domain:    material-gaze
Tags:           blue, light, one-column, two-columns, left-sidebar, right-sidebar, fluid-layout, responsive-layout, custom-background, custom-colors, custom-header, custom-menu, editor-style, featured-images, flexible-header, microformats, post-formats, rtl-language-support, theme-options, threaded-comments, translation-ready
Template:       stargazer

Material Gaze, Copyright 2015 Marty Helmick.
Material Gaze is distributed under the terms of the GNU GPL.
This theme was inspired by material design stylings and patterns as laid out by Google Inc. Copyright 2015.
*/

/* ====== Primary Font ====== */
.font-primary,
.menu.font-secondary,
body,
input,
textarea,
.label-checkbox,
.label-radio,
.required,
#reply-title small {
    font-family: "Roboto", sans-serif;
}

/* ====== Secondary Font ====== */
.font-secondary,
#site-description,
dt,
th,
legend,
label,
input[type="submit"],
input[type="reset"],
input[type="button"],
button,
select,
option,
.wp-caption-text,
.gallery-caption,
.mejs-controls,
.wp-playlist-item-meta,
.entry-byline,
.entry-footer,
.chat-author cite,
.chat-author,
.comment-meta,
.breadcrumb-trail,
.media-info .prep,
.comment-reply-link,
.comment-reply-login,
.clean-my-archives .day,
.whistle-title {
    font-family: "Roboto Condensed", sans-serif;
}

/* ====== Headlines Font ====== */
#site-title,
.font-headlines,
h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: "Roboto", sans-serif;
    font-weight: 300;
}
#site-title a:hover,
#site-title a:focus,
#site-title a:active,
.font-headlines a:hover,
.font-headlines a:focus,
.font-headlines a:active,
h1 a:hover,
h1 a:focus,
h1 a:active,
h2 a:hover,
h2 a:focus,
h2 a:active,
h3 a:hover,
h3 a:focus,
h3 a:active,
h4 a:hover,
h4 a:focus,
h4 a:active,
h5 a:hover,
h5 a:focus,
h5 a:active,
h6 a:hover,
h6 a:focus,
h6 a:active {
    border-bottom: 0;
    text-decoration: none;
}

#menu-secondary .menu-toggle button,
a,
a:hover {
    text-decoration: none;
}

a.more-link {
    border-bottom: 0;
}

a {
    -webkit-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

/* ====== color: #424242 ====== */
body,
.media-shortcode-extend .media-info,
.wp-playlist-dark .wp-playlist-item {
    color: #424242;
}

#menu-primary {
    padding: 12px 0 0;
}

body.custom-colors {
    border-top-color: #455a64;
    border-bottom-color: #455a64;
}

/* ====== background: #455A64 ====== */
#menu-primary,
#menu-primary .search-form > div,
#footer,
.audio-shortcode-wrap,
.media-shortcode-extend .media-info,
.media-info-toggle,
.entry-content .media-info-toggle,
.media-info-toggle:hover,
.media-info-toggle:focus,
.wp-audio-shortcode.mejs-container,
.mejs-controls,
.mejs-volume-button .mejs-volume-slider,
.mejs-overlay-play .mejs-overlay-button::after,
.mejs-time-rail .mejs-time-float,
.wp-playlist-dark {
    background: #455a64;
}

.gallery .gallery-icon a img {
    padding: 0;
    border: 0;
    border-radius: 2px;
    background: none;
}

#menu-primary .menu-toggle button {
    color: rgba(255, 255, 255, 0.75);
}

#menu-primary li a,
#menu-secondary li a,
#menu-primary .menu-toggle button:hover,
#menu-primary .menu-toggle button:focus {
    color: rgba(255, 255, 255, 0.75);
    text-decoration: none;
}

#menu-primary li li a,
#menu-secondary li li a {
    border-color: #fff;
    color: rgba(33, 33, 33, 0.75);
    background: #fff;
}

#menu-primary li a,
#menu-secondary li a,
#menu-primary li li a,
#menu-secondary li li a {
    font-size: 0.9rem;
    font-weight: 500;
    text-transform: capitalize;
}

.sub-menu {
    padding: 4px 0;
    border-radius: 2px;
    background: #fff;
}

@media only screen and (max-width: 799px) {
    #menu-primary li.current-menu-item > a {
        color: #424242;
    }

    .menu-toggle button {
        box-shadow: none;
    }
    .menu-toggle button:hover,
    .menu-toggle button:focus {
        box-shadow: none;
    }

    #menu-secondary .menu-toggle button {
        padding: 0.5rem 0.75rem 0.5rem 0;
        border-color: transparent;
        border-radius: 2px;
        color: rgba(255, 255, 255, 0);
        background: rgba(255, 255, 255, 0.5);
        font-size: 0;
    }
    #menu-secondary .menu-toggle button:hover {
        background-color: rgba(255, 255, 255, 0.7);
    }
    #menu-secondary .menu-toggle button:focus {
        outline: 0;
        background-color: rgba(255, 255, 255, 0.8);
    }
    #menu-secondary .menu-toggle button.active {
        border-radius: 2px 2px 0 0;
        background-color: rgba(255, 255, 255, 0.9);
    }
    #menu-secondary .menu-toggle button:after {
        color: rgba(33, 33, 33, 0.75) !important;
    }

    .wrap .menu-items {
        box-shadow: 0 10px 10px 0 rgba(0, 0, 0, 0.19), 0 6px 3px 0 rgba(0, 0, 0, 0.23);
    }

    #menu-secondary .wrap,
    #menu-primary .search-form > div {
        background: #1f1f1f;
    }

    #menu-primary li a,
    #menu-secondary li a,
    #menu-primary li li a,
    #menu-secondary li li a {
        border-color: transparent;
        color: rgba(33, 33, 33, 0.75);
        background: #fff;
    }

    #menu-primary li a:hover,
    #menu-secondary li a:hover,
    #menu-primary li a:focus,
    #menu-secondary li a:focus,
    #menu-primary li li a:hover,
    #menu-secondary li li a:hover,
    #menu-primary li li a:focus,
    #menu-secondary li li a:focus {
        color: #212121;
        background: #eee;
    }
}

.entry-title,
.entry-title a {
    color: #455a64;
}

.entry-byline,
.entry-footer,
.comment-meta,
.wp-playlist-item-meta {
    color: rgba(85, 85, 85, 0.75);
}

.image-sizes .sep {
    color: #e3e3e3;
}

li.ping,
.comment-content,
.loop-description {
    border-color: #fafafa;
    border-radius: 2px;
    background: #fafafa;
    box-shadow: 0 1px 1.5px 0 rgba(0, 0, 0, 0.12), 0 1px 1px 0 rgba(0, 0, 0, 0.24);
}

label:focus,
label.focus {
    text-decoration: none;
}

blockquote {
    border-color: transparent;
    border-radius: 2px;
    outline: 0;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 5px 0 rgba(0, 0, 0, 0.23);
}

/* Menu colors */
@media only screen and (min-width: 800px) {
    .sub-menu {
        box-shadow: 0 10px 10px 0 rgba(0, 0, 0, 0.19), 0 6px 3px 0 rgba(0, 0, 0, 0.23);
    }

    .sidebar .sub-menu {
        box-shadow: none;
    }

    .menu li > ul::before {
        border-right-color: transparent;
        border-bottom-color: #fff;
        border-left-color: transparent;
    }

    .menu li li > ul::before {
        border-top-color: transparent;
        border-bottom-color: transparent;
    }

    .ltr .menu li li > ul::before {
        border-right-color: #fff;
    }

    .rtl .menu li li > ul::before {
        border-left-color: #fff;
    }

    #menu-primary ul ul li a:hover,
    #menu-secondary ul ul li a:hover,
    #menu-primary ul ul li a:focus,
    #menu-secondary ul ul li a:focus {
        color: #212121;
        background: #eee;
    }

    #menu-primary .search-form .search-toggle::before {
        color: rgba(255, 255, 255, 0.75);
    }

    #menu-primary .search-toggle:hover::before,
    #menu-primary .search-toggle:focus::before {
        color: #fff;
    }
}

#container > .wrap {
    border-radius: 2px;
    box-shadow: 0 1px 1.5px 0 rgba(0, 0, 0, 0.12), 0 1px 1px 0 rgba(0, 0, 0, 0.24);
}

.display-header-text #header {
    border: 0;
    border-radius: 2px 2px 0 0;
    box-shadow: 0 1px 1.5px 0 rgba(0, 0, 0, 0.12), 0 1px 1px 0 rgba(0, 0, 0, 0.24);
}

#site-title a,
h2#site-description.font-primary {
    color: inherit;
    font-style: normal;
}

.widget_search > .search-form {
    border-radius: 2px;
}

.widget-title,
form label {
    cursor: default;
}

.widget-title,
#comments-number,
#reply-title,
.attachment-meta-title {
    margin-right: -0.75rem;
    margin-left: -0.75rem;
    border: 0;
    border-radius: 2px;
    box-shadow: 0 1px 1.5px 0 rgba(0, 0, 0, 0.12), 0 1px 1px 0 rgba(0, 0, 0, 0.24);
}

.attachment-meta-title > .wrap,
#comments-number > .wrap,
#reply-title > .wrap,
.widget-title > .wrap {
    box-sizing: border-box;
    width: 100%;
    padding: 1rem 1rem 0.925rem;
    border-radius: 2px;
    font-size: 1.3rem;
    font-weight: 300;
    text-transform: capitalize;
}

#menu-primary .search-form .search-toggle {
    position: relative;
    width: 45px;
    height: 45px;
    margin-top: -5px;
    margin-right: -6px;
    border-radius: 50%;
}
#menu-primary .search-form .search-toggle:before {
    color: #fff;
    font-size: 1.3rem;
}

#menu-primary .search-form .search-toggle,
input[type="submit"],
input[type="reset"],
input[type="button"],
button,
.page-links a,
.comment-reply-link,
.comment-reply-login,
.wp-calendar td.has-posts a,
#menu-sub-terms li a {
    box-shadow: 0 1px 1.5px 0 rgba(0, 0, 0, 0.12), 0 1px 1px 0 rgba(0, 0, 0, 0.24);
}
#menu-primary .search-form .search-toggle:hover,
#menu-primary .search-form .search-toggle:focus,
input[type="submit"]:hover,
input[type="submit"]:focus,
input[type="reset"]:hover,
input[type="reset"]:focus,
input[type="button"]:hover,
input[type="button"]:focus,
button:hover,
button:focus,
.page-links a:hover,
.page-links a:focus,
.comment-reply-link:hover,
.comment-reply-link:focus,
.comment-reply-login:hover,
.comment-reply-login:focus,
.wp-calendar td.has-posts a:hover,
.wp-calendar td.has-posts a:focus,
#menu-sub-terms li a:hover,
#menu-sub-terms li a:focus {
    box-shadow: 0 10px 10px 0 rgba(0, 0, 0, 0.19), 0 6px 3px 0 rgba(0, 0, 0, 0.23);
    text-decoration: none;
}

.comment-reply-link,
.comment-reply-login {
    border-radius: 0 0 2px 2px;
}

#footer {
    color: rgba(255, 255, 255, 0.75);
}
#footer a {
    font-weight: 700;
}

.ltr .widget-title > .wrap::before {
    padding-right: 10px;
    font-size: 1.5rem;
    line-height: 0.8;
}

.rtl .widget-title > .wrap::before {
    padding-left: 10px;
    font-size: 1.5rem;
    line-height: 0.8;
}

input[type="submit"],
input[type="reset"],
input[type="button"],
button {
    border-radius: 2px;
    font-weight: 400;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

input[type="number"],
input[type="date"],
input[type="datetime"],
input[type="datetime-local"],
input[type="email"],
input[type="month"],
input[type="password"],
input[type="search"],
input[type="tel"],
input[type="text"],
input[type="time"],
input[type="url"],
input[type="week"],
textarea,
select {
    border-top: 0;
    border-right: 0;
    border-bottom-color: #616161;
    border-left: 0;
    border-radius: 2px 2px 0 0;
    background: #fafafa;
}

input[type="date"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="email"]:focus,
input[type="month"]:focus,
input[type="number"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="text"]:focus,
input[type="time"]:focus,
input[type="url"]:focus,
input[type="week"]:focus,
textarea:focus,
select:focus {
    background: #fafafa;
}

textarea {
    resize: vertical;
}

.mejs-controls button {
    box-shadow: none;
}