Ondersteuning » Thema en CSS/opmaak » WordPress reageert niet op CSS file

  • Opgelost jacobboersma

    (@jacobboersma)


    Ik heb een wordpress site welke draait op http://www.jacobboersma.nl/rwc
    Hierbij wil ik het menu in een andere kleur hebben. Ik heb hiervoor het CSS aangepast, maar er gebeurt niets.

    Wie weet wat ik fout doe?

    Hieronder de css file

    /*
    Theme Name: Simone
    Theme URI: http://mor10.com/simone-wordpress-theme/
    Author: Morten Rand-Hendriksen
    Author URI: http://mor10.com/
    Description: Simone is a responsive, accessible, high-resolution theme featuring custom header and custom link colors, large images, and easy to read typography that scales to fit all screens. Other features include keyboard accessible navigation, optional social menu, sidebar- and footer widgets, no-sidebar page template, Aside post format, and collapsible author profile box. Simone is translation ready and ships in English with translations in Chinese (simplified), Finnish, French, German, Hungarian, Italian, Norwegian Bokmål, Portugese, Russian, and Spanish.
    Version: 1.0.10
    License: GNU General Public License
    License URI: http://www.gnu.org/licenses/gpl-2.0.html
    Text Domain: simone
    Domain Path: /languages/
    Tags: white, black, blue, light, one-column, two-columns, right-sidebar, responsive-layout, accessibility-ready, custom-colors, custom-header, custom-menu, editor-style, featured-images, microformats, post-formats, sticky-post, threaded-comments, translation-ready
    
    This theme, like WordPress, is licensed under the GPL.
    Use it to make something cool, have fun, and share what you've learned with others.
    
    Simone is based on Underscores http://underscores.me/, (C) 2012-2014 Automattic, Inc.
    
    CSS structure 2.0 onwards based on http://mdo.github.io/code-guide/#css-syntax
    
    Resetting and rebuilding styles have been helped along thanks to the fine work of
    Eric Meyer http://meyerweb.com/eric/tools/css/reset/index.html
    along with Nicolas Gallagher and Jonathan Neal http://necolas.github.com/normalize.css/
    and Blueprint http://www.blueprintcss.org/
    */
    
    /*--------------------------------------------------------------
    >>> TABLE OF CONTENTS:
    ----------------------------------------------------------------
    1.0 - Reset
    2.0 - Typography
    3.0 - Elements
    4.0 - Forms
    5.0 - Navigation
    	5.1 - Links
    	5.2 - Menus
    6.0 - Accessibility
    7.0 - Alignments
    8.0 - Clearings
    9.0 - Widgets
    10.0 - Content
    	10.1 - Posts and pages
            10.2 - Index and Archives
    	10.3 - Asides
            10.4 - Image Attachments
    	10.5 - Comments
            10.6 - Author Box
    11.0 - Infinite scroll
    12.0 - Media
    13.0 - Footer
    --------------------------------------------------------------*/
    
    /*--------------------------------------------------------------
    1.0 - Reset
    --------------------------------------------------------------*/
    html, body, div, span, applet, object, iframe,
    h1, h2, h3, h4, h5, h6, p, blockquote, pre,
    a, abbr, acronym, address, big, cite, code,
    del, dfn, em, font, ins, kbd, q, s, samp,
    small, strike, strong, sub, sup, tt, var,
    dl, dt, dd, ol, ul, li,
    fieldset, form, label, legend,
    table, caption, tbody, tfoot, thead, tr, th, td {
    	border: 0;
    	font-family: inherit;
    	font-size: 100%;
    	font-style: inherit;
    	font-weight: inherit;
    	margin: 0;
    	outline: 0;
    	padding: 0;
    	vertical-align: baseline;
    }
    html {
    	font-size: 62.5%; /* Corrects text resizing oddly in IE6/7 when body font-size is set using em units http://clagnut.com/blog/348/#c790 */
    	overflow-y: scroll; /* Keeps page centered in all browsers regardless of content height */
    	-webkit-text-size-adjust: 100%; /* Prevents iOS text size adjust after orientation change, without disabling user zoom */
    	-ms-text-size-adjust:     100%; /* www.456bereastreet.com/archive/201012/controlling_text_size_in_safari_for_ios_without_disabling_user_zoom/ */
    }
    *,
    *:before,
    *:after { /* apply a natural box layout model to all elements; see http://www.paulirish.com/2012/box-sizing-border-box-ftw/ */
    	-webkit-box-sizing: border-box; /* Not needed for modern webkit but still used by Blackberry Browser 7.0; see http://caniuse.com/#search=box-sizing */
    	-moz-box-sizing:    border-box; /* Still needed for Firefox 28; see http://caniuse.com/#search=box-sizing */
    	box-sizing:         border-box;
    }
    body {
    	background: #fff;
    }
    article,
    aside,
    details,
    figcaption,
    figure,
    footer,
    header,
    main,
    nav,
    section {
    	display: block;
    }
    ol, ul {
    	list-style: none;
    }
    table { /* tables still need 'cellspacing="0"' in the markup */
    	border-collapse: separate;
    	border-spacing: 0;
    }
    caption, th, td {
    	font-weight: normal;
    	text-align: left;
    }
    blockquote:before, blockquote:after,
    q:before, q:after {
    	content: "";
    }
    blockquote, q {
    	quotes: "" "";
    }
    a:focus {
    	outline: thin dotted;
    }
    a:hover,
    a:active {
    	outline: 0;
    }
    a img {
    	border: 0;
    }
    
    a:focus img {
        outline: 3px dotted #2c86ba;
    }
    
    /*--------------------------------------------------------------
    2.0 Typography
    --------------------------------------------------------------*/
    body,
    button,
    input,
    select,
    textarea {
        font-size: 12px;
        font-size: 1.8rem;
        font-family: 'PT Serif', serif;
        line-height: 1.5;
        color: #404040;
        color: hsl(0, 0%, 25%);
    }
    
    h1, h2, h3, h4, h5, h6 {
        clear: right;
        font-weight: 900;
        font-family: 'Lato', sans-serif;
        color: #000;
        color: hsl(0, 0%, 0%);
        -ms-word-break: break-word;
        word-break: break-word;
    }
    
    p { margin-bottom: 1.5em; }
    
    b, strong { font-weight: bold; }
    
    dfn, cite, em, i { font-style: italic; }
    
    address { margin: 0 0 1.5em; }
    
    pre {
        max-width: 100%;
        padding: 1.6em;
        margin-bottom: 2em!important;
        overflow: auto;
        font-family: "Courier 10 Pitch", Courier, monospace;
        font-size: 15px;
        font-size: 1.5rem;
        line-height: 1.6;
        background: #eee;
    }
    
    code, kbd, tt, var { font: 15px Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace; }
    
    abbr, acronym {
        border-bottom: 1px dotted #666;
        cursor: help;
    }
    
    mark, ins {
        text-decoration: none;
        background: #fff9c0;
    }
    
    sup, sub {
        position: relative;
        height: 0;
        vertical-align: baseline;
        font-size: 75%;
        line-height: 0;
    }
    
    sup { bottom: 1ex; }
    
    sub { top: .5ex; }
    
    small { font-size: 75%; }
    
    big { font-size: 125%; }
    
    /*--------------------------------------------------------------
    3.0 Elements
    --------------------------------------------------------------*/
    hr {
        height: 1px;
        margin-bottom: 1.5em;
        background-color: #ccc;
        border: 0;
    }
    
    ul, ol { margin: 0 0 1.5em 3em; }
    
    ul { list-style: disc; }
    
    ol { list-style: decimal; }
    
    li > ul,
    li > ol {
        margin-bottom: 0;
        margin-left: 1.5em;
    }
    
    dt { font-weight: bold; }
    
    dd { margin: 0 1.5em 1.5em; }
    
    img {
        height: auto; /* Make sure images are scaled correctly. */
        max-width: 100%; /* Adhere to container width. */
    }
    
    figure { margin: 0; }
    
    table {
        width: 100%;
        margin: 0 0 1.5em;
    }
    
    th { font-weight: bold; }
    
    /*--------------------------------------------------------------
    4.0 Forms
    --------------------------------------------------------------*/
    button,
    input,
    select,
    textarea {
        vertical-align: baseline; /* Improves appearance and consistency in all browsers */
        *vertical-align: middle; /* Improves appearance and consistency in IE6/IE7 */
        margin: 0; /* Addresses margins set differently in IE6/7, F3/4, S5, Chrome */
        font-size: 100%; /* Corrects font size not being inherited in all browsers */
    }
    
    button,
    input[type="button"],
    input[type="reset"],
    input[type="submit"] {
        padding: 1em 2em;
        font-size: 16px;
        font-size: 1.6rem;
        font-family: 'Lato';
        text-transform: uppercase;
        line-height: 1;
        color: hsl(0, 0%, 100%);
        background: #3c3c3c;
        background: hsl(0, 0%, 24%);
        border: none;
        border-radius: 3px;
        cursor: pointer; /* Improves usability and consistency of cursor style between image-type 'input' and others */
        -webkit-appearance: button; /* Corrects inability to style clickable 'input' types in iOS */
    }
    
    button:hover,
    input[type="button"]:hover,
    input[type="reset"]:hover,
    input[type="submit"]:hover {
        background: #000;
        background: hsl(0, 0%, 0%);
    }
    
    button:focus,
    input[type="button"]:focus,
    input[type="reset"]:focus,
    input[type="submit"]:focus,
    button:active,
    input[type="button"]:active,
    input[type="reset"]:active,
    input[type="submit"]:active {
        background: #000;
        background: hsl(0, 0%, 0%);
    }
    
    input[type="checkbox"],
    input[type="radio"] {
        padding: 0; /* Addresses excess padding in IE8/9 */
    }
    
    input[type="search"] {
        -webkit-appearance: textfield; /* Addresses appearance set to searchfield in S5, Chrome */
        width: 100%;
    }
    
    input[type="search"]::-webkit-search-decoration { /* Corrects inner padding displayed oddly in S5, Chrome on OSX */
        -webkit-appearance: none;
    }
    
    button::-moz-focus-inner,
    input::-moz-focus-inner { /* Corrects inner padding and border displayed oddly in FF3/4 www.sitepen.com/blog/2008/05/14/the-devils-in-the-details-fixing-dojos-toolbar-buttons/ */
        padding: 0;
        border: 0;
    }
    
    input[type="text"],
    input[type="email"],
    input[type="url"],
    input[type="password"],
    input[type="search"],
    textarea {
        padding: 8px;
        font-family: 'Lato', sans-serif;
        color: #333;
        border: 1px solid #ccc;
    }
    
    input[type="text"]:focus,
    input[type="email"]:focus,
    input[type="url"]:focus,
    input[type="password"]:focus,
    input[type="search"]:focus,
    textarea:focus {
        color: #111;
    }
    
    textarea {
        width: 100%;
        vertical-align: top; /* Improves readability and alignment in all browsers */
        overflow: auto; /* Removes default vertical scrollbar in IE6/7/8/9 */
    
    }
    
    .comment-awaiting-moderation { /* Green background color to make moderation seem less aggressive */
        padding: .5rem 1rem;
        margin: 1rem 0;
        font-family: 'Lato', sans-serif;
        font-size: 16px;
        font-size: 1.6rem;
        color: #fff;
        color: hsl(0, 0%, 100%);
        background: #84bd68;
        background: hsl(100, 39%, 57%);
    }
    
    /*--------------------------------------------------------------
    5.0 Navigation
    --------------------------------------------------------------*/
    /*--------------------------------------------------------------
    5.1 Links
    --------------------------------------------------------------*/
    a {
        text-decoration: none;
        color: #000;
        color: hsl(0, 0%, 0%);
    }
    
    a:visited {
        color: #333;
        color: hsl(0, 0%, 20%);
    }
    
    a:hover,
    a:focus,
    a:active {
        text-decoration: underline;
    }
    
    /*--------------------------------------------------------------
    5.2 Menus
    --------------------------------------------------------------*/
    .main-navigation {
        position: relative;
        display: block;
        width: 100%;
        clear: both;
        font-family: 'Lato', sans-serif;
        text-transform: uppercase;
        background: #061e46;
        background: hsl(0, 0%, 19%);
    }
    
    .main-navigation ul {
        margin: 0;
        padding-left: 0;
        list-style: none;
    }
    
    .main-navigation li {
        position: relative;
        float: left;
    }
    
    .main-navigation a {
        display: block;
        padding: 1.3em 1em;
        font-size: 14px;
        font-size: 1.4rem;
        text-decoration: none;
        line-height: 1.3em;
        color: white;
        color: hsl(0, 0%, 100%);
    }
    
    .main-navigation ul ul {
        position: absolute;
        left: 0;
        z-index: 99999;
        display: none;
        float: left;
        padding: 0;
        background: #061e46;
        background: hsl(0, 0%, 30%);
    }
    
    .main-navigation ul ul ul {
        top: 0;
        left: 100%;
    }
    
    .main-navigation ul ul a { width: 200px; }
    
    .main-navigation ul ul li { }
    
    .main-navigation li:hover > a,
    .main-navigation li > a:focus {
        color: #fff;
        color: hsl(0, 0%, 100%);
        background: #061e46;
        background: hsl(0, 0%, 60%);
    }
    
    .main-navigation ul ul :hover > a { }
    
    .main-navigation ul ul a:hover,
    .main-navigation ul ul a:focus {
        background: #061e46;
        background: hsl(0, 0%, 19%);
    }
    
    .main-navigation ul li:hover > ul { display: block; }
    
    .main-navigation .current_page_item > a,
    .main-navigation .current-menu-item > a,
    .main-navigation .current_page_item > a:hover,
    .main-navigation .current-menu-item > a:hover,
    .main-navigation .current_page_item > a:focus,
    .main-navigation .current-menu-item > a:focus {
        color: #061e46;
        color: hsl(0, 0%, 19%);
        background: white;
    }
    
    .main-navigation .current_page_ancestor {
        background: #061e46;
        background: hsl(0, 0%, 30%);
    }
    
    .main-navigation ul ul .current_page_parent,
    .main-navigation .current_page_parent .current_page_item > a {
        color: #fff;
        color: hsl(0, 0%, 100%);
        background: #061e46;
        background: hsl(0, 0%, 19%);
    }
    
    /* Small menu */
    .menu-toggle {
        display: none;
        cursor: pointer;
    }
    
    @media screen and (max-width: 600px) {
        .menu-toggle {
            display: inline-block;
            height: 3.9em;
            padding: 0 1em;
            font-weight: normal;
            font-size: 14px;
            font-size: 1.4rem;
            text-decoration: none;
            line-height: 3.75em;
            color: white;
        }
    
        .menu-toggle a:hover,
        .menu-toggle a:focus {
            background: #ff0000;
        background: hsl(0, 0%, 30%);
        }
    
        .main-navigation.toggled .nav-menu {
            display: block;
            border-top: 1px solid;
            border-top-color: #061e46;
            border-top-color: hsla(0, 0%, 100%, .5);
        }
    
        .main-navigation ul {
            display: none;
            padding-left: 0;
        }
    
        .main-navigation li { float: none; }
    
        .main-navigation li a { padding: 1.3em 2em; }
    
        .main-navigation li li a { padding-left: 4em; }
    
        .main-navigation li li li a { padding-left: 6em; }
    
        .main-navigation li:hover > a,
        .main-navigation li > a:focus {
            background: #ff0000;
            background: hsl(0, 0%, 19%);
        }
    
        .main-navigation ul ul,
        .main-navigation ul ul ul {
            position: relative;
            top: inherit;
            left: 0;
            display: block;
            float: none;
            background: #061e46;
            background: hsl(0, 0%, 19%);
        }
    
        .main-navigation ul ul a { width: 100%; }
    
        .main-navigation ul a:hover,
        .main-navigation ul ul a:hover,
        .main-navigation ul a:focus,
        .main-navigation ul ul a:focus{
            background: #061e46;
            background: hsl(0, 0%, 30%);
        }
    
        .main-navigation .current_page_ancestor { background: inherit; }
    
        .main-navigation ul ul .current_page_parent {
            color: inherit;
            background: inherit;
        }
    
        .main-navigation .current_page_item > a,
        .main-navigation .current_page_item > a:hover,
        .main-navigation .current_page_item li:hover,
        .main-navigation .current_page_item > a:focus,
        .main-navigation .current_page_item li:focus,
        .main-navigation .current_page_parent .current_page_item > a  {
            color: #fff;
            color: hsl(0, 0%, 100%);
            background: #061e46;
            background: hsl(0, 0%, 30%);
        }
    
    } /* End responsive menu */
    
    /* Social Menu */
    
    .menu-social ul {
        float: right;
        text-align: center;
        list-style: none;
    }
    
    .menu-social ul li {
        position: relative;
        display:  inline-block;
    }
    
    .menu-social li a:before {
        display: inline-block;
        vertical-align: top;
        padding: 0 5px;
        font-family: 'Fontawesome';
        font-size: 20px;
        color: #fff;
        -webkit-font-smoothing: antialiased;
        content: '\f08e';
    }
    
    .menu-social li a[href*="dribbble.com"]::before { content: '\f17d'; }
    
    .menu-social li a[href*="facebook.com"]::before { content: '\f09a'; }
    
    .menu-social li a[href*="flickr.com"]::before { content: '\f16e'; }
    
    .menu-social li a[href*="foursquare.com"]::before { content: '\f180'; }
    
    .menu-social li a[href*="github.com"]::before { content: '\f09b'; }
    
    .menu-social li a[href*="plus.google.com"]::before { content: '\f0d5'; }
    
    .menu-social li a[href*="instagram.com"]::before { content: '\f16d'; }
    
    .menu-social li a[href*="jsfiddle.com"]::before { content: '\f1cc'; }
    
    .menu-social li a[href*="linkedin.com"]::before { content: '\f0e1'; }
    
    .menu-social li a[href*="pinterest.com"]::before { content: '\f0d2'; }
    
    .menu-social li a[href*="reddit.com"]::before { content: '\f1a1'; }
    
    .menu-social li a[href*="soundcloud.com"]::before { content: '\f1be'; }
    
    .menu-social li a[href*="stackoverflow.com"]::before { content: '\f16c'; }
    
    .menu-social li a[href*="tumblr.com"]::before { content: '\f173'; }
    
    .menu-social li a[href*="twitter.com"]::before { content: '\f099'; }
    
    .menu-social li a[href*="vimeo.com"]::before { content: '\f194'; }
    
    .menu-social li a[href*="vine.co"]::before { content: '\f1ca'; }
    
    .menu-social li a[href*="yelp.com"]::before { content: '\f1e9'; }
    
    .menu-social li a[href*="youtube.com"]::before { content: '\f167'; }
    
    .menu-social li a[href*="wordpress.com"]::before { content: '\f19a'; }
    
    @media screen and (max-width: 600px) {
        #menu-social ul {
    	position: absolute;
            top: 0;
            right: 6rem;
            display: block;
        }
    
        #menu-social li a {
            padding-left:.5em;
            padding-right: .5em;
        }
    }
    
    /* Paging navigation */
    
    .site-main .comment-navigation,
    .site-main .paging-navigation,
    .site-main .post-navigation {
        font-size: 18px;
        font-size: 1.8rem;
        font-family: 'Lato', sans-serif;
        color: #000;
        color: hsl(0, 0%, 0%);
    }
    
    .post-nav-box {
        padding: 2em 0;
        margin-bottom: 4em;
        border-top: hsl(0, 0%, 80%) solid 1px;
        border-bottom: hsl(0, 0%, 80%) solid 1px;
    }
    
    .comment-navigation .nav-previous,
    .paging-navigation .nav-previous,
    .post-navigation .nav-previous {
        float: left;
        width: 50%;
        padding-right: 15%;
    }
    
    .comment-navigation .nav-next,
    .paging-navigation .nav-next,
    .post-navigation .nav-next {
        float: right;
        width: 50%;
        padding-left: 15%;
        text-align: right;
    }
    
    .nav-indicator { margin-bottom: 1em; }
    
    .nav-previous h1,
    .nav-next h1 { font-weight: 900; }
    
    .comment-navigation {
        padding: 1em 0;
        margin: 3em 0;
        border-top: hsl(0, 0%, 80%) solid 1px;
        border-bottom: hsl(0, 0%, 80%) solid 1px;
    }
    
    .comment-navigation i { margin: 0 1em; }
    
    @media screen and (max-width: 600px) {
        .comment-navigation .nav-previous,
        .post-navigation .nav-previous,
        .comment-navigation .nav-next,
        .post-navigation .nav-next {
            float: none;
            width: 100%;
            padding: 0;
            text-align: left;
        }
    
        .comment-navigation .nav-next,
        .post-navigation .nav-next { margin-top: 4rem; }
    }
    
    .paging-navigation ul { margin: 0; }
    
    .paging-navigation li { display: inline; }
    
    a.page-numbers,
    span.page-numbers {
        padding: .3em .7em;
        color: #333;
        color: hsl(0, 0%, 20%);
    }
    
    a:hover.page-numbers,
    a:focus.page-numbers{
        color: #000;
        color: hsl(0, 0%, 0%);
    }
    
    .paging-navigation .current {
        font-weight: bold;
        color: #000;
        color: hsl(0, 0%, 0%);
    }
    
    /*--------------------------------------------------------------
    6.0 Accessibility
    --------------------------------------------------------------*/
    /* Text meant only for screen readers */
    .screen-reader-text {
        position: absolute !important;
        height: 1px;
        width: 1px;
        overflow: hidden;
        clip: rect(1px, 1px, 1px, 1px);
    }
    
    .screen-reader-text:hover,
    .screen-reader-text:active,
    .screen-reader-text:focus {
        top: 5px;
        left: 5px;
        z-index: 100000; /* Above WP toolbar */
        clip: auto !important;
        display: block;
        width: auto;
        height: auto;
        padding: 15px 23px 14px;
        font-weight: bold;
        font-size: 14px;
        text-decoration: none;
        line-height: normal;
        color: #21759b;
        background-color: #f1f1f1;
        border-radius: 3px;
        box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
    }
    
    /*--------------------------------------------------------------
    7.0 Alignments
    --------------------------------------------------------------*/
    .alignleft {
        display: inline;
        float: left;
        margin-right: 1.5em;
        margin-bottom: 1em;
    }
    
    .alignright {
        display: inline;
        float: right;
        margin-bottom: 1em;
        margin-left: 1.5em;
    }
    
    .aligncenter {
        display: block;
        margin: 0 auto 1.6em;
        clear: both;
    }
    
    /* Alignment responsive */
    @media screen and (min-width: 1320px) {
        .alignleft { margin-left: -160px; }
    }
    
    @media screen and (min-width: 1820px) {
        .alignright { margin-right: -160px; }
    }
    
    /*--------------------------------------------------------------
    8.0 Clearings
    --------------------------------------------------------------*/
    .clear:before,
    .clear:after,
    .entry-content:before,
    .entry-content:after,
    .comment-content:before,
    .comment-content:after,
    .site-header:before,
    .site-header:after,
    .site-content:before,
    .site-content:after,
    .site-footer:before,
    .site-footer:after {
        display: table;
        content: '';
    }
    
    .clear:after,
    .entry-content:after,
    .comment-content:after,
    .site-header:after,
    .site-content:after,
    .site-footer:after { clear: both; }
    
    /*--------------------------------------------------------------
    9.0 Header
    --------------------------------------------------------------*/
    
    .site-branding {
        padding: 6rem 0;
        text-align: center;
        background: #0587BF;
        background: hsl(198, 95%, 38%);
    }
    
    .title-box {
        width: 600px;
        max-width: 75%;
        padding: 4rem;
        margin: 0 auto;
        border: solid 1px #fff;
        border: solid 1px hsla(0, 0%, 100%, .3);
    }
    
    .site-title {
        font-weight: 700;
        font-size: 40px;
        font-size: 4.5rem;
        text-transform: uppercase;
        line-height: normal;
        padding-bottom: 1rem;
    }
    
    .site-description {
        font-weight: 300;
        font-size: 20px;
        font-size: 2rem;
    }
    
    .site-branding a { text-decoration: none; }
    
    .site-title a,
    .site-description {
        color: #fff;
        color: hsl(0, 0%, 100%);
    }
    
    .header-image img {
        display: block;
        margin: 0 auto;
    }
    
    .header-background-image {
        background: no-repeat center;
        background-size: cover!important;
        -moz-background-size: cover!important;
        -webkit-background-size: cover!important;
    }
    
    .header-background-image .title-box {
        background: #333;
        background: hsla(0, 0%, 0%, .7);
    }
    
    /* Header responsive */
    @media screen and (max-width: 900px) {
        .site-branding { padding: 0; }
    
        .title-box {
            max-width: 100%;
            margin: 0 auto;
            padding: 4rem;
            border: none;
        }
    }
    
    @media screen and (max-width: 399px) {
        .title-box { padding: 2rem; }
    }
    
    /* Header search */
    
    .search-toggle {
        float: right;
        width: 54px;
        height: 54px;
        padding: 12px;
        margin-right: 20px;
        color: #fff;
        text-align: center;
        cursor: pointer;
    }
    
    .search-toggle:hover,
    .search-toggle.active {
        background: #4d4d4d;
        background: hsl(0, 0%, 30%);
    }
    
    .search-toggle .screen-reader-text {
        top: 0;
        right: 0;
    }
    .search-box-wrapper {
        z-index: 2;
        width: 100%;
    }
    .search-box {
        padding: 1em;
        background: #4d4d4d;
        background: hsl(0, 0%, 30%);
    }
    
    .search-box .search-field {
        max-width: 362px;
        float: right;
        padding: 1rem 2rem 1rem 4rem;
        font-size: 20px;
        font-size: 2rem;
        background-color: #fff;
        border: 0;
    }
    
    .hide { display: none; }
    
    .error404 .search-submit,
    .search .search-submit,
    .search-box .search-submit { display: none; }
    
    @media screen and (max-width: 600px) {
        .search-toggle {
            position: absolute;
            top: 0;
            right: 0;
            margin-right: 0;
        }
    }
    
    /*--------------------------------------------------------------
    9.0 Widgets
    --------------------------------------------------------------*/
    .widget {
        margin: 0 0 4em;
        font-family: 'Lato', sans-serif;
        font-size: 16px;
        font-size: 1.6rem;
    }
    
    .widget-title {
        margin-bottom: 1em;
        font-size: 24px;
        font-size: 2.4rem;
        border-bottom: 2px solid #000;
    }
    
    .widget a {
        font-weight: 700;
        color: #000;
        color: hsl(0, 0%, 0%);
    }
    
    .widget ul,
    .widget ol {
        padding: 0;
        margin: -1em 0 0;
        list-style-type: none;
    }
    
    .widget li { padding: 1em 0 0; }
    
    .widget li ul,
    .widget li ol { margin-top: 0; }
    
    .widget li li { margin-left: 1.5em; }
    
    .widget_recent_entries li:before,
    .widget_recent_comments li:before,
    .widget_archive li:before {
        display: block;
        float: left;
        padding-top: 2px;
        margin-left: -2.5em;
        font-family: 'fontawesome';
        font-size: 14px;
        font-size: 1.4rem;
    } 
    
    .widget_recent_entries li,
    .widget_recent_comments li { margin: 0 0 .5em 2.5em; }
    
    .widget_recent_entries li:before { content: "\f036"; }
    
    .widget_recent_comments li:before { content: "\f075"; }
    
    .widget_archive li { margin: 0 0 0 2.5em; }
    
    .widget_archive li:before { content: "\f187"; }
    
    .widget_nav_menu a,
    .widget_pages a {
        display: block;
        padding: 1em 0;
        border-bottom: solid 1px hsl(0, 0%, 90%);
    }
    
    .widget_nav_menu li,
    .widget_pages li { padding-top: 0; }
    
    .widget_rss li { margin-bottom: .5em; }
    
    .widget_rss .rss-date,
    .widget_rss cite {
        display: block;
        font-size: 85%;
    }
    
    /* Make sure select elements fit in widgets */
    .widget select { max-width: 100%; }
    
    /* Search widget */
    .widget_search .search-submit {	display: none; }
    
    .footer-widgets { margin: 0 auto; }
    
    .footer-widgets .widget-title,
    .footer-widgets .widget a:hover,
    .footer-widgets .widget a:focus {
        color: #fff;
        color: hsl(0, 0%, 100%);
        border-color: #fff;
        border-color: hsl(0, 0%, 100%);
    }
    
    .footer-widgets .widget {
        float: left;
        width: 320px;
        margin: 0 4rem 8rem 4rem;
    }
    
    /* Footer widgets responsive */
    @media screen and (max-width: 879px) {
        #footer-widgets { width: 100%!important; }
    
        .footer-widgets .widget {
            float: none;
            width: 100%;
            margin: 0 0 8rem;
        }
    }
    /*--------------------------------------------------------------
    10.0 Content
    --------------------------------------------------------------*/
    /*--------------------------------------------------------------
    10.1 Posts and pages
    --------------------------------------------------------------*/
    .sticky { }
    
    .hentry { margin: 0 0 1.5em; }
    
    .updated { display: none; }
    
    .single .byline,
    .group-blog .byline { display: inline; }
    
    .page-content,
    .entry-content,
    .entry-summary { margin: 1.5em 0 0; }
    
    .page-links {
        margin: 0 0 1.5em;
        clear: both;
    }
    
    .entry-title {
        margin: 0 0 2rem;
        font-weight: 900;
        font-size: 40px;
        font-size: 4rem;
        line-height: 1.3em;
        color: #000;
        color: hsl(0, 0%, 0%);
    }
    
    .page .entry-title { margin-top: .7em; }
    
    .entry-content a { text-decoration: underline; }
    
    /* Typography */
    .entry-content h1,
    .entry-content h2,
    .entry-content h3,
    .entry-content h4,
    .entry-content h5,
    .entry-content h6 { margin-bottom: .4em; }
    
    .entry-content h1 {
        font-size: 32px;
        font-size: 3.2rem;
    }
    
    .entry-content h2 {
        font-size: 30px;
        font-size: 3.0rem;
    }
    
    .entry-content h3 {
        font-size: 28px;
        font-size: 2.8rem;
    }
    
    .entry-content h4 {
        font-size: 26px;
        font-size: 2.6rem;
    }
    
    .entry-content h5 {
        font-size: 24px;
        font-size: 2.4rem;
    }
    
    .entry-content h6 {
        font-size: 22px;
        font-size: 2.2rem;
    }
    
    .entry-content p,
    .entry-content ul,
    .entry-content ol {
        font-size: 20px;
        font-size: 2rem;
        line-height: 1.6em;
    }
    
    .entry-content blockquote p {
        font-size: 28px;
        font-size: 2.8rem;
        line-height: 1.5em;
    }
    
    blockquote cite {
        font-size: 18px;
        font-size: 1.8rem;
    }
    
    /* Smaller fonts for smaller screens */
    @media screen and (max-width: 680px) {
        .entry-title {
            font-size: 32px;
            font-size: 3.2rem;
            line-height: 1.3em;
        }
        .entry-content h1 {
            font-size: 28px;
            font-size: 2.8rem;
        }
    
        .entry-content h2 {
            font-size: 26px;
            font-size: 2.6rem;
        }
    
        .entry-content h3 {
            font-size: 24px;
            font-size: 2.4rem;
        }
    
        .entry-content h4 {
            font-size: 22px;
            font-size: 2.2rem;
        }
    
        .entry-content h5 {
            font-size: 20px;
            font-size: 2rem;
        }
    
        .entry-content h6 {
            font-size: 18px;
            font-size: 1.8rem;
        }
    
        .entry-content p,
        .entry-content ul,
        .entry-content ol  {
            font-size: 18px;
            font-size: 1.8rem;
        }
    
        .entry-content blockquote p {
            font-size: 22px;
            font-size: 2.2rem;
            line-height: 1.5em;
        }
    
        blockquote cite {
            font-size: 14px;
            font-size: 1.4rem;
        }
    }
    
    /* Blockquotes */
    blockquote {
        padding: 1em 1.5em 0;
        margin-bottom: 1em;
        font-style: italic;
        border-top: solid 1px hsl(0, 0%, 80%);
        border-bottom: solid 1px hsl(0, 0%, 80%);
    }
    
    blockquote.alignleft {
        float: left;
        width: 50%;
        padding: 1em 0 0;
        margin-right: 2em;
    }
    
    blockquote.alignright {
        float: right;
        width: 50%;
        padding: 1em 0 0;
        margin-left: 2em;
    }
    
    .index-box blockquote.alignleft,
    .index-box blockquote.alignright {
        background: #fff;
        background: hsl(0, 0%, 100%);
        border: none;
    }
    
    blockquote em {
        font-style: normal;
    }
    
    blockquote cite {
        display: block;
        margin-top: 1em;
        margin-left: 40%;
        font-family: 'Lato', sans-serif;
        font-style: normal;
        line-height: 1.5em;
        text-align: right;
    }
    
    /* Blockquotes responsive */
    @media screen and (min-width: 1820px) {
        .index-box blockquote.alignright { padding-right: 2em; }
    }
    
    @media screen and (min-width: 1320px) {
        .index-box blockquote.alignleft { padding-left: 2em; }
    }
    
    @media screen and (max-width: 780px) {
        blockquote.alignleft,
        blockquote.alignright { width: 40%; }
    }
    
    @media screen and (max-width:600px) {
        blockquote.alignleft,
        blockquote.alignright {
            width: 100%;
            padding: 1em 1.5em 0;
        }
    }
    
    /* Image borders for white-on-white images */
    
    .border-gray {
        border: #b9b9b9 solid 1px;
        border: hsl(0, 0%, 75%) solid 1px;
    }
    
    .border-black {
        border: #000 solid 1px;
        border: hsl(0, 0%, 0%) solid 1px;
    }
    
    .border-custom {
        border: #6DBCDB solid 1px;
        border: hsl(19, 95%, 38%) solid 1px;
    }
    
    /* Meta */
    .category-list {
        margin: 1.3em 0 1em;
        font-family: 'Lato', sans-serif;
        font-size: 16px;
        font-size: 1.6rem;
    }
    
    .category-list a {
        color: #333;
        color: hsl(0, 0%, 20%);
    }
    
    .category-list a:hover,
    .category-list a:focus {
        color: #000;
        color: hsl(0, 0%, 0%);
    }
    
    .entry-meta {
        margin-bottom: 2rem;
        padding: 0;
        font-family: 'Lato', sans-serif;
        font-size: 14px;
        font-size: 1.4rem;
    }
    
    .entry-meta a { font-weight: 600; }
    
    /* Hides 'on' and '.' in post meta on wide screens. */
    .mobile-hide {
        display: inline;
    }
    
    /* Meta responsive */
    @media screen and (min-width: 1320px) {
        .single .entry-meta {
            position: absolute;
            width: 120px;
            margin-left: -160px;
            text-align: right;
        }
    
        .single .byline,
        .single .posted-on,
        .single .comments-link {
            display: block;
            margin-bottom: 1em;
        }
    
        .single .author { display: block; }
    
        .single .mobile-hide {
            display: none;
        }
    }
    
    .entry-footer {
        margin-top: 3rem;
        margin-bottom: 5rem;
        font-family: 'Lato', sans-serif;
    }
    
    .entry-footer ul {
        padding: 0;
        margin: 0;
        font-size: 16px;
        font-size: 1.6rem;
        line-height: 2em;
        list-style-type: none;
    }
    
    .entry-footer li {
        display: inline-block;
        margin-right: 4rem;
    }
    
    .entry-footer i { margin-right: .5rem; }
    
    /*--------------------------------------------------------------
    10.2 Index and Archive
    --------------------------------------------------------------*/
    .taxonomy-description {
        padding-top: 2rem;
        margin: 2rem 0;
        font-family: 'Lato', sans-serif;
        font-style: italic;
        border-top: 1px solid hsl(0, 0%, 75%);
        border-bottom: 1px solid hsl(0, 0%, 75%);
    }
    
    .sticky-post {
        position: absolute;
        top: 1rem;
        right: 3rem;
    }
    
    .Blijf-lezen {
        margin: 0 4rem;
        font-weight: 900;
        font-size: 18px;
        font-size: 1.8rem;
    }
    
    .Blijf-lezen i { margin-left: .5em; }
    
    .search-no-results .content-area,
    .error404 .content-area { margin-top: 4rem; }
    
    /*--------------------------------------------------------------
    10.3 Asides
    --------------------------------------------------------------*/
    .format-aside .entry-content { margin-top: 1em; }
    
    /*--------------------------------------------------------------
    10.4 Image Attachments
    --------------------------------------------------------------*/
    
    .attachment .entry-title { margin-top: .7em; }
    
    .entry-attachment { margin-bottom: 3rem; }
    
    .attachment-caption {
        font-size: 14px;
        font-size: 1.4rem;
        font-family: 'Lato', sans-serif;
    }
    
    /*--------------------------------------------------------------
    10.5 Comments
    --------------------------------------------------------------*/
    .comments-title {
        font-weight: 900;
        font-size: 36px;
        font-size: 3.6rem;
    }
    
    .comments-area > ol {
        padding: 0;
        margin: 2em 0;
        list-style-type: none;
    }
    
    ol.children { list-style-type: none; }
    
    .comment-author .avatar {
        display: block;
        float: left;
        width: 50px;
        margin-right: 20px;
    }
    
    .comment-author .fn {
        font-weight: 900;
        font-family: 'Lato', sans-serif;
        font-size: 20px;
        font-size: 2rem;
    }
    
    .comment-metadata {
        font-size: 14px;
        font-size:1.4rem;
    }
    
    .comment-meta { margin-bottom: 1em; }
    
    .comment-content { font-size: 90%; }
    
    .comment-content,
    .reply { margin-left: 70px; }
    
    .comment-body {
        padding-bottom: 2em;
        margin-bottom: 2em;
        border-bottom: solid hsl(0, 0%, 80%) 1px;
    }
    
    .comment-list ol { margin-left: 50px; }
    
    .comment-content a { word-wrap: break-word; }
    
    .reply {
        font-weight: 600;
        font-size: 14px;
        font-size: 1.4rem;
        font-family: 'Lato', sans-serif;
    }
    
    .comment-content ol { margin-left: 1.5em; }
    
    .bypostauthor > .comment-body {
        position: relative;
        padding: 1em;
        margin-bottom: 2em;
        background: hsl(0, 0%, 93%);
        border: none;
    }
    
    /* Comments responsive */
    @media screen and (max-width:600px) {
        .comment-list ol { margin-left: 0; }
    
        .comment-content ol { margin-left: 1.5em; }
    
        .comment-content,
        .reply { margin-left: 0; }
    }
    
    .comment-reply-title {
        margin-bottom: .5em;
        font-weight: 900;
        font-size: 30px;
        font-size: 3rem;
    }
    
    .comment-form {
        padding-bottom: 4rem;
        font-family: 'Lato', sans-serif;
        font-size: 16px;
        font-size: 1.6rem;
    }
    
    .comment-form textarea {
        font-family: 'PT Serif', serif;
        font-size: 18px;
        font-size: 1.8rem;
    }
    
    .comment-form label { display: block; }
    
    .required { color: red; }
    
    /*--------------------------------------------------------------
    10.6 Author Box
    --------------------------------------------------------------*/
    .reveal-bio {
        max-width: 780px;
        max-width: 78rem;
        margin: 0 auto;
        background: #fff;
    }
    
    .reveal-bio a {
        display: block;
        padding: 2rem 0;
        margin: 0 auto;
        font-weight: 700;
        font-size: 26px;
        font-size: 2.6rem;
        color: #bfbfbf;
        color: hsl(0, 0%, 75%);
        text-align: center;
    }
    
    .reveal-bio a:hover,
    .reveal-bio a:focus {
        text-decoration: none;
        color: #000;
        color: hsl(0, 0%, 0%);
    }
    
    .shorter { padding: 0 0 4rem!important; }
    
    .hide-fix {
        padding: 0!important;
        margin-bottom: 2rem!important;
    }
    
    .author-info {
        padding-top: 1rem;
        margin: 0 4rem;
    }
    
    .author-avatar {
        float: left;
        margin: 0 2rem 0 0;
    }
    
    .author-avatar img { display: block; }
    
    .author-title {
        margin-bottom: .8rem;
        font-size: 36px;
        font-size: 3.6rem;
        line-height: 1;
    }
    
    .author-meta {
        border-bottom: 16px solid hsl(0, 0%, 95%);
        margin-bottom: 2rem;
        font-family: 'Lato', sans-serif;
    }
    
    .share-and-more {
        padding: .1rem 0 1.1rem;
        font-weight: 700;
        font-size: 16px;
        font-size: 1.6rem;
    }
    
    .author-social-media { display: inline-block; }
    
    .author-social-media a {
        margin-left: 1.5rem;
        color: #000;
        color: hsl(0, 0%, 0%);
    }
    
    .author-social-media a:hover,
    .author-social-media a:focus { text-decoration: none; }
    
    a.author-link {
        font-weight: 900;
        font-family: 'Lato', sans-serif;
        color: #000;
        color: hsl(0, 0%, 0%);
    }
    
    .author-link i { margin-left: 1rem; }
    
    .author-meta,
    .author-description { margin-left: 12rem; }
    
    /* Author Box responsive */
    @media screen and (max-width: 600px) {
        .author-meta,
        .author-description { margin-left: 0; }
    }
    
    /*--------------------------------------------------------------
    11.0 Infinite scroll
    --------------------------------------------------------------*/
    /* Globally hidden elements when Infinite Scroll is supported and in use. */
    .infinite-scroll .paging-navigation, /* Older / Newer Posts Navigation (always hidden) */
    .infinite-scroll.neverending .site-footer { /* Theme Footer (when set to scrolling) */
    	display: none;
    }
    /* When Infinite Scroll has reached its end we need to re-display elements that were hidden (via .neverending) before */
    .infinity-end.neverending .site-footer {
    	display: block;
    }
    
    /*--------------------------------------------------------------
    12.0 Media
    --------------------------------------------------------------*/
    .page-content img.wp-smiley,
    .entry-content img.wp-smiley,
    .comment-content img.wp-smiley {
    	margin-bottom: 0;
    	margin-top: 0;
    	padding: 0;
            border: none;
    }
    
    .wp-caption {
        max-width: 100%;
        margin-bottom: 1.5em;
    }
    
    .wp-caption img[class*="wp-image-"] {
        display: block;
        margin: 0 auto;
    }
    
    .wp-caption-text { text-align: center; }
    
    .wp-caption .wp-caption-text,
    .gallery-caption {
        padding: 0.8075em 1em;
        font-size: 14px;
        font-size: 1.4rem;
        font-family: 'Lato', sans-serif;
        background: #e5e5e5;
        background: hsl(0, 0%, 90%);
    }
    
    .site-main .gallery { margin-bottom: 1.5em; }
    
    .gallery-caption {
        position: absolute;
        bottom: 0;
        left: 0;
        max-height: 50%;
        width: 100%;
        padding: 6px 8px;
        margin: 0;
        font-size: 12px;
        line-height: 1.5;
        color: #fff;
        text-align: left;
        background-color: hsla(0, 0%, 0%, .8);
        opacity: 0;
    }
    
    .gallery-item:hover .gallery-caption,
    .gallery-item:focus .gallery-caption{ opacity: 1; }
    
    .site-main .gallery a img {
        display: block;
        max-width: 100%;
        height: auto;
        margin: 0 auto;
        border: none;
    }
    
    .site-main .gallery-item {
        position: relative;
        float: left;
        max-width:100%;
        margin-right: 3.333333333%;
        margin-bottom: 3rem;
        overflow: hidden;
        background: #333;
    }
    
    .site-main .gallery dd,
    .site-main .gallery figcaption { margin: 0; }
    
    .site-main .gallery-columns-4 .gallery-item { }
    
    .site-main .gallery-columns-4 .gallery-item img { }
    
    /* Make sure embeds and iframes fit their containers */
    embed,
    iframe,
    object { max-width: 100%; }
    
    /* Featured Images */
    
    .single-post-thumbnail { background: #b2b2b2 url(images/pattern.svg) repeat; }
    
    .front-index-thumbnail { margin-bottom: -3.2em; }
    
    @media screen and (max-width: 779px){
        .front-index-thumbnail { margin-bottom: 0; }
    }
    
    .single-post-thumbnail img,
    .front-index-thumbnail img {
        display: block;
        margin: 0 auto;
    }
    
    .has-thumbnail {
        position: relative;
        margin-top: -8em;
    }
    
    .small-index-thumbnail { margin-top: -1em; }
    
    /*--------------------------------------------------------------
    13 Footer
    --------------------------------------------------------------*/
    
    .site-footer {
        padding: 2em;
        font-size: 16px;
        font-size: 1.6rem;
        font-family: 'Lato';
        color: #fff;
        color: hsl(0, 0%, 100%);
        background: #ff0000;
        background: hsl(0, 0%, 19%);
    }
    
    .site-footer a {
        color: #fff;
        color: hsl(0, 0%, 100%);
    }
    
    .site-info { text-align: center; }

4 reacties aan het bekijken - 1 tot 4 (van in totaal 4)
  • Hi jacobboersma,

    FYI: Het meesturen van een CSS-bestand is niet nodig, dat is sowieso al zichtbaar…
    >> Geef aub de url van je site, dan kunnen we ZIEN wat je bedoelt…

    Thread starter jacobboersma

    (@jacobboersma)

    De link stond al in de post. http://Www.jacobboersma.nl/rwc

    Thread starter jacobboersma

    (@jacobboersma)

    Weet al iemand het probleem?

    .main-navigation{
       background:#99cc66;/*verander naar keuze*/
    }

    Als je theme een optie heeft om de CSS aan te passen, bijvoorbeeld in een ‘custom css’-veld, plaats dan de aanpassing[en] aan je css hierin.
    Ontbreekt een dergelijke optie in je theme? Volg dan de instructies hieronder.

    Alternatief: Voeg bovenstaande code toe aan style.css van je CHILDtheme.
    Zo voorkom je dat al je aanpassingen worden overschreven als de makers van je theme een update installeren.
    Verder heeft het als voordeel dat alle aanpassingen overzichtelijk bij elkaar staan. Dat is makkelijk, overzichtelijk en eenvoudiger te onderhouden.

    Kies je ooit een ander theme, dan dien je een nieuw childtheme te maken.

    Heb je nog geen childtheme?

    1. installeer en activeer ‘one click childtheme’-plug-in
    2. activeer de originele theme
    3. Dashboard > weergave > child theme
    4. beantwoordt de vragen op het scherm
      >> er wordt een child theme aangemaakt in een map met bestanden zoals style.css;
    5. Activeer het childtheme.
    6. ==

    7. om je site aan te passen, maak je nu alle wijzigingen in de map en bestanden van je child theme.
      – Maak je aanpassingen in style.css van het childtheme;
      – mocht je aanpassingen willen maken in de originele php-bestanden, kopieer de betreffende php-file uit het originele theme naar de map van het childtheme. Maak hierin dan de gewenste aanpassingen.

    == == == Extra
    Als je precies wilt zien welke elementen je site heeft en welke opmaak-kenmerken [css] daarbij horen,rechtsklik en kies ‘element inspecteren’, of installeer dan bijv de browser-add-on ‘firebug’.

    Zo kan je op zoek naar de diverse elementen en de kenmerken zoals kleuren, layout etc. aanpassen.

    == == == ik wil echt GEEN childtheme [en begrijp het probleem van het aanpassen van het originele theme…]
    Zet de bovenstaande code dan ONDERAAN het bestand ‘styles.css’ van je thema. Ververs je browser <CTRL-F5>.

4 reacties aan het bekijken - 1 tot 4 (van in totaal 4)
  • Het onderwerp ‘WordPress reageert niet op CSS file’ is gesloten voor nieuwe reacties.