---
---
@import 'colors';
@import 'sidebar';
@import 'fonts';


/// Mixin to prefix a property
/// @author Hugo Giraudel
/// @param {String} $property - Property name
/// @param {*} $value - Property value
/// @param {List} $prefixes (()) - List of prefixes to print
@mixin prefix($property, $value, $prefixes: ()) {
    @each $prefix in $prefixes {
      #{'-' + $prefix + '-' + $property}: $value;
    }
   
    // Output standard non-prefixed declaration
    #{$property}: $value;
  }


::selection {
    color: white;
    background: $orange; /* WebKit/Blink Browsers */
}

::-moz-selection {
    color: white;
    background: $orange; /* WebKit/Blink Browsers */
}



body {
    margin: 0;
    background-color: $margin;
}

#box {
    background-color: $background;
    max-width: 800px;
    z-index: 0;
    
    margin-left: auto;
    margin-right: auto;
    margin-top: 0;
    height: 100%;
            box-shadow: 0 0 4px 5px $shadow;
       -moz-box-shadow: 0 0 4px 5px $shadow;
    -webkit-box-shadow: 0 0 4px 5px $shadow;
}

// HEADER

#title {
    margin:0;
    padding: 10px;
    font-family: $title-font;
    color: $title-text;
    font-weight: normal;
    font-size: 28px;

    a {
        color: inherit;
        text-decoration: none;
    }

    a:hover {
        color: inherit;
        text-decoration: underline;
    }
}

.slash {
    display: inline-block;
    vertical-align: -10%;
    font: {
        size: 36px;
    }
}

#main {
    display: flex;
}

#content {
    padding: {
        right: 20px;
        left: 20px;
    }
    flex-grow: 1;
    font-family: $body-font;
    color: $body-text;
    line-height: 1.5em;

    p {
        margin: {
            top: 0;
            bottom: 15px;
        }
    }
}





footer {
    font-size: 1em;
    text-align: center;
}