chemiker/e.nigma-2015

/* -------------------------------- Default WP classes */

.aligncenter {
    display: block;
    margin: 0 auto;
}

.alignleft {
    float: left;
    margin: 0 15px 15px 0;
}

.alignright {
    float: right;
    margin: 0 0 15px 15px;
}

.center {
    text-align: center;
}

.wp-caption {}

.gallery-caption {
    color: $blockquotecolor;
}

.wp-caption-text {
    font: {
        size: 0.7em;
        style: italic;
    }
    margin-top: 8px;
    text-align: center;
}

.wp-block-gallery {
    figcaption {
        padding: 0px !important;
    }

    img {
        margin: 0px;
    }
}

.gallery {
    margin: 1em 0 2.8em 0 !important;

    figure {
        display: inline-block;
        margin-right: 3%;
        vertical-align: top;
        text-align: center;
    }

    figcaption {
        line-height: 1.1em;
    }

    img {
        border: {
            style: solid;
            color: $darkbeige;
        }
        border-radius: 2px;

        &:hover {
            border-color: $navigationbackground !important;
        }
    }

    @each $columns, $width, $border in $galleries {
        &-columns-#{$columns} {
            figure {
                width: $width;
            }

            img {
                border-width: $border;
            }
        }

    }
}

.hidden {
    text-indent: -9999px;
    position: absolute;
}

.screen-reader,
.screen-reader-text {
    width: 0px;
    display: inline-block;
    text-indent: -9999px;
    color: $beige;
}

.bypostauthor {
    display: block;
}

.gallery-caption {}

.enigma-icon[data-icon]:before {
    content: attr(data-icon);
    font-family: $iconfont, Helvetica;
}

.portfolio-entry {
    margin-bottom: 0px !important;
}

.portfolio-entry-column-2 {
    width: 46% !important;
}

.portfolio-entry-column-2 {
    img {
        border: 8px solid $darkbeige !important;
        border-radius: 2px;

        &:hover {
            border-color: $navigationbackground !important;
        }
    }
}

a,
a:visited {
    color: #333;

    &.screen-reader,
    &.screen-reader-text {
        position: absolute;

        &:focus {
            position: static;
            display: block;
            width: 100%;
            color: $beige;
            padding: 70px 0px 20px 0px;
            text: {
                align: center;
                indent: 0px;
            }
        }
    }
}

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

hr {
    margin: 3em 0 3em 0;
    border: 0;
    height: 1px;
    background: linear-gradient(to left, rgba(0, 0, 0, 0), rgba(73, 73, 73, 0.75), rgba(0, 0, 0, 0));
}

hr.popover-rule {
    margin: 0px;
    background: linear-gradient(to left, rgba(0, 0, 0, 0), rgba(176, 176, 176, 75), rgba(0, 0, 0, 0));
}

hr.before_content {
    margin: 1.2em 0 1.2em 0;
}

strong,
big {
    font-weight: bold;
}

em,
i {
    font-style: italic;
}

acronym,
abbr {
    border-bottom: 1px dotted #309c2a;
    cursor: help;
}

blockquote {
    font-family: $serif;
    quotes: "\201C" "\201D";
    margin: 1.3em 0 1.3em 0;
    padding: 0.8em;
    color: $blockquotecolor;
    font: {
        style: italic;
        size: 1.1em;
    }
    border: {
        top: 1px solid $lightgrey;
        bottom: 1px solid $lightgrey;
    }

    p:first-child:before {
        display: inline;
        position: relative;
        top: 0.425em;
        padding-right: 0.1em;
         color: $lightgrey;
        content: open-quote;
        font: {
            size: 5em;
            style: normal;
        }
        line-height: 0.1em;

    }

    p {
        display: inline-block;
        margin: 0px 0 0.3em 0 !important;
    }
}

cite {
    font-size: 0.8em;
    opacity: 0.8;
}

sup {
    vertical-align: super;
}

sub {
    vertical-align: sub;
    font-size: 0.7em;
}

pre {
    overflow: auto;
    white-space: pre;
    border-radius: 5px;
    margin: 1.5em 0 0 0;

    code {
        padding: 8px 5px 8px 5px;
        line-height: 0.8em;
        font-size: 0.8em;
    }
}

code,
var,
kbd {
    overflow: auto;
    font-family: $code;
    color: $darkbeige;
}

var {
    font-style: italic;
}

code,
kbd {
    background-color: #E7E7E7;
    padding: 5px;
}