:root{    

    /* Colors */
    --fay-color-body: #ffffff;
    --fay-color-text: #000000;
    --fay-color-body-selection:#000000;
    --fay-color-text-selection: #ffffff;
    --fay-color-link: #f5f259;
    --fay-color-link-hover: #aaa9a9;
    --fay-color-h1: var(--fay-color-text);
    --fay-color-h2: var(--fay-color-text);
    --fay-color-h3: var(--fay-color-text);
    --fay-color-h4: var(--fay-color-text);
    --fay-color-h5: var(--fay-color-text);
    --fay-color-h6: var(--fay-color-text);

    /* Font Family */
    --fay-font-family-text:'Verdana', sans-serif;
    --fay-font-family-link:var(--fay-font-family-text);
    --fay-font-family-heading:var(--fay-font-family-text);
    --fay-font-family-h1:var(--fay-font-family-heading);
    --fay-font-family-h2:var(--fay-font-family-heading);
    --fay-font-family-h3:var(--fay-font-family-heading);
    --fay-font-family-h4:var(--fay-font-family-heading);
    --fay-font-family-h5:var(--fay-font-family-heading);
    --fay-font-family-h6:var(--fay-font-family-heading);

    /* Font Size */
    --fay-font-size-text:16px;
    --fay-font-size-link:var(--fay-font-size-text);
    --fay-font-size-heading:32px;
    --fay-font-size-h1:var(--fay-font-size-heading);
    --fay-font-size-h2:var(--fay-font-size-heading);
    --fay-font-size-h3:var(--fay-font-size-heading);
    --fay-font-size-h4:var(--fay-font-size-heading);
    --fay-font-size-h5:var(--fay-font-size-heading);
    --fay-font-size-h6:var(--fay-font-size-heading);

    /* Font Weight */
    --fay-font-weight-text:400;
    --fay-font-weight-link:var(--fay-font-weight-text);
    --fay-font-weight-heading:800;
    --fay-font-weight-h1:var(--fay-font-weight-heading);
    --fay-font-weight-h2:var(--fay-font-weight-heading);
    --fay-font-weight-h3:var(--fay-font-weight-heading);
    --fay-font-weight-h4:var(--fay-font-weight-heading);
    --fay-font-weight-h5:var(--fay-font-weight-heading);
    --fay-font-weight-h6:var(--fay-font-weight-heading);

    /* Line Height */
    --fay-line-height-text:26px;
    --fay-line-height-link:var(--fay-line-height-text);
    --fay-line-height-heading:42px;
    --fay-line-height-h1:var(--fay-line-height-heading);
    --fay-line-height-h2:var(--fay-line-height-heading);
    --fay-line-height-h3:var(--fay-line-height-heading);
    --fay-line-height-h4:var(--fay-line-height-heading);
    --fay-line-height-h5:var(--fay-line-height-heading);
    --fay-line-height-h6:var(--fay-line-height-heading);

    /* Default Row Width */
    --fay-row-width-xs: 450px;
    --fay-row-width-sm: 550px;
    --fay-row-width-md: 650px;
    --fay-row-width-lg: 800px;
    --fay-row-width-xl: 1000px;
    --fay-row-width-xxl: 1200px;

    /* Default Row offset */
    --fay-row-offset-y-xs: 30px;
    --fay-row-offset-y-sm: 60px;
    --fay-row-offset-y-md: 90px;
    --fay-row-offset-y-lg: 90px;
    --fay-row-offset-y-xl: 90px;
    --fay-row-offset-y-xxl: 90px;

    --fay-row-offset-x-xs: 30px;
    --fay-row-offset-x-sm: 60px;
    --fay-row-offset-x-md: 90px;
    --fay-row-offset-x-lg: 90px;
    --fay-row-offset-x-xl: 90px;
    --fay-row-offset-x-xxl: 90px;

    --fay-row-offset-top-xs: var(--fay-row-offset-y-xs);
    --fay-row-offset-top-sm: var(--fay-row-offset-y-sm);
    --fay-row-offset-top-md: var(--fay-row-offset-y-md);
    --fay-row-offset-top-lg: var(--fay-row-offset-y-lg);
    --fay-row-offset-top-xl: var(--fay-row-offset-y-xl);
    --fay-row-offset-top-xxl: var(--fay-row-offset-y-xxl);

    --fay-row-offset-bottom-xs: var(--fay-row-offset-y-xs);
    --fay-row-offset-bottom-sm: var(--fay-row-offset-y-sm);
    --fay-row-offset-bottom-md: var(--fay-row-offset-y-md);
    --fay-row-offset-bottom-lg: var(--fay-row-offset-y-lg);
    --fay-row-offset-bottom-xl: var(--fay-row-offset-y-xl);
    --fay-row-offset-bottom-xxl: var(--fay-row-offset-y-xxl);

    --fay-row-offset-left-xs: var(--fay-row-offset-x-xs);
    --fay-row-offset-left-sm: var(--fay-row-offset-x-sm);
    --fay-row-offset-left-md: var(--fay-row-offset-x-md);
    --fay-row-offset-left-lg: var(--fay-row-offset-x-lg);
    --fay-row-offset-left-xl: var(--fay-row-offset-x-xl);
    --fay-row-offset-left-xxl: var(--fay-row-offset-x-xxl);

    --fay-row-offset-right-xs: var(--fay-row-offset-x-xs);
    --fay-row-offset-right-sm: var(--fay-row-offset-x-sm);
    --fay-row-offset-right-md: var(--fay-row-offset-x-md);
    --fay-row-offset-right-lg: var(--fay-row-offset-x-lg);
    --fay-row-offset-right-xl: var(--fay-row-offset-x-xl);
    --fay-row-offset-right-xxl: var(--fay-row-offset-x-xxl);

    --fay-spacer-xs: 30px;
    --fay-spacer-sm: 30px;
    --fay-spacer-md: 30px;
    --fay-spacer-lg: 30px;
    --fay-spacer-xl: 30px;
    --fay-spacer-xxl: 30px;
}

/*
*
* FONTS & COLORS
*
*/
body{
    background-color:var(--fay-color-body);
    color:var(--fay-color-text); 
    font-family:var(--fay-font-family-text);
    font-size:var(--fay-font-size-text);
    font-weight:var(--fay-font-weight-text);
    line-height:var(--fay-line-height-text);
}
::-moz-selection {
    color: var(--fay-color-text-selection);
    background: var(--fay-color-body-selection);
}  
::selection {
    color: var(--fay-color-text-selection);
    background: var(--fay-color-body-selection);
}
a{
    color:var(--fay-color-link); 
    font-family:var(--fay-font-family-link);
    font-size:var(--fay-font-size-link);
    font-weight:var(--fay-font-weight-link);
    line-height:var(--fay-line-height-link);
}
a:hover{
    color:var(--fay-color-link-hover);
}
h1{
    color:var(--fay-color-h1); 
    font-family:var(--fay-font-family-h1);
    font-size:var(--fay-font-size-h1);
    font-weight:var(--fay-font-weight-h1);
    line-height:var(--fay-line-height-h1);
}
h2{
    color:var(--fay-color-h2); 
    font-family:var(--fay-font-family-h2);
    font-size:var(--fay-font-size-h2);
    font-weight:var(--fay-font-weight-h2); 
    line-height:var(--fay-line-height-h2);
}
h3{
    color:var(--fay-color-h3); 
    font-family:var(--fay-font-family-h3);
    font-size:var(--fay-font-size-h3);
    font-weight:var(--fay-font-weight-h3); 
    line-height:var(--fay-line-height-h3);
}
h4{
    color:var(--fay-color-h4); 
    font-family:var(--fay-font-family-h4);
    font-size:var(--fay-font-size-h4);
    font-weight:var(--fay-font-weight-h4); 
    line-height:var(--fay-line-height-h4);
}
h5{
    color:var(--fay-color-h5); 
    font-family:var(--fay-font-family-h5);
    font-size:var(--fay-font-size-h5);
    font-weight:var(--fay-font-weight-h5); 
    line-height:var(--fay-line-height-h5);
}
h6{
    color:var(--fay-color-h6); 
    font-family:var(--fay-font-family-h6);
    font-size:var(--fay-font-size-h6);
    font-weight:var(--fay-font-weight-h6); 
    line-height:var(--fay-line-height-h6);
}

/*
*
* LAYOUT
*
*/
.fay-row{
    width:var(--fay-row-width-xs);
    padding:var(--fay-row-offset-top-xs) var(--fay-row-offset-right-xs) var(--fay-row-offset-bottom-xs) var(--fay-row-offset-left-xs);
    margin:auto;
    transition: all 1s ease;
}
.fay-row.no-offset{
    padding:0;
}
.fay-row.no-offset-y{
    padding-top:0;
    padding-bottom:0;
}
.fay-row.no-offset-x{
    padding-right:0;
    padding-left:0;
}
@media (min-width: 576px) {
    .fay-row{
        width:var(--fay-row-width-sm);
        padding:var(--fay-row-offset-top-sm) var(--fay-row-offset-right-sm) var(--fay-row-offset-bottom-sm) var(--fay-row-offset-left-sm);
    }
}
@media (min-width: 768px) {
    .fay-row{
        width:var(--fay-row-width-md);
        padding:var(--fay-row-offset-top-md) var(--fay-row-offset-right-md) var(--fay-row-offset-bottom-md) var(--fay-row-offset-left-md);
    }
}
@media (min-width: 992px) {
    .fay-row{
        width:var(--fay-row-width-lg);
        padding:var(--fay-row-offset-top-lg) var(--fay-row-offset-right-lg) var(--fay-row-offset-bottom-lg) var(--fay-row-offset-left-lg);
    }
}
@media (min-width: 1200px) {
    .fay-row{
        width:var(--fay-row-width-xl);
        padding:var(--fay-row-offset-top-xl) var(--fay-row-offset-right-xl) var(--fay-row-offset-bottom-xl) var(--fay-row-offset-left-xl);
    }
}
@media (min-width: 1400px) {
    .fay-row{
        width:var(--fay-row-width-xxl);
        padding:var(--fay-row-offset-top-xxl) var(--fay-row-offset-right-xxl) var(--fay-row-offset-bottom-xxl) var(--fay-row-offset-left-xxl);
    }
}

/*
*
* HELPERS
*
*/
.fay-spacer{
    height:var(--fay-spacer-xs);
}
@media (min-width: 576px) {
    .fay-spacer{
        height:var(--fay-spacer-sm);
    }
}
@media (min-width: 768px) {
    .fay-spacer{
        height:var(--fay-spacer-md);
    }
}
@media (min-width: 992px) {
    .fay-spacer{
        height:var(--fay-spacer-lg);
    }
}
@media (min-width: 1200px) {
    .fay-spacer{
        height:var(--fay-spacer-xl);
    }
}
@media (min-width: 1400px) {
    .fay-spacer{
        height:var(--fay-spacer-xxl);
    }
}

/*
*
* UTILITIES
*
*/

/* Stretch */
.stretch{
    width:100% !important;
    height:100% !important;
}
.stretch-h{
    width:100% !important;
}
.stretch-v{
    height:100% !important;
}

/* Bring */
.bring-back, .bring-front{
    position:absolute;
    top:0;
    left:0;
}
.bring-back{   
    z-index:-999;
}
.bring-front{   
    z-index:999;
}

/* Text */
.uppercase{
    text-transform:uppercase;
}

/* Background Image */
.bg-image{    
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;    
}
.bg-image.bg-image-center{
    background-position: center;
}
.bg-image.bg-image-parallax{
    background-attachment: fixed;
}
.bg-image.bg-image-overlay{
    background-blend-mode: multiply;
}

/* Show/Hide Inner content */
.show-content__onmouseover > * {
    display:none;
} 
.show-content__onmouseover:hover > * {
    display:inline-block;
}
.show-content__onmouseout:hover > * {
    display:none;
}
.show-overlay__onmouseover:hover > *{
    background-blend-mode: multiply;
}

