/*
Theme Name: PSinside 3.0 - Autonomy
Theme URI: htreleasestp://www.psinside.de
Description: PSinside 3.0 - 2016-07-02
Author: John McDonald
Author URI: http://www.johnmc.de
*/

/*
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
minified with https://cssminifier.com/
Author: Richard Clark - http://richclarkdesign.com
Twitter: @rich_clark
*/
article,aside,details,figcaption,figure,footer,header,hgroup,hr,menu,nav,section{display:block}a,hr{padding:0}abbr,address,article,aside,audio,b,blockquote,body,canvas,caption,cite,code,dd,del,details,dfn,div,dl,dt,em,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,p,pre,q,samp,section,small,span,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,ul,var,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:0 0}ins,mark{background-color:#ff9;color:#000}body{line-height:1}nav ul{list-style:none}blockquote,q{quotes:none}blockquote::after,blockquote::before,q::after,q::before{content:'';content:none}a{margin:0;font-size:100%;vertical-align:baseline;background:0 0}ins{text-decoration:none}mark{font-style:italic;font-weight:700}del{text-decoration:line-through}abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}table{border-collapse:collapse;border-spacing:0}hr{height:1px;border:0;border-top:1px solid #ccc;margin:1em 0}input,select{vertical-align:middle}

/* --------------------------------------------------
| General CSS setup and styles
-------------------------------------------------- */
:root{
    --default-transition-speed:250ms;
    --element-spacing:2rem;
    --element-spacing-bigger:5rem;
    --element-spacing-medium:2.5rem;
    --element-spacing-smaller:1rem;
    --font-family:"Poppins", Sans Serif;
    --default-copy-font:'Roboto', Serif;
    --main-color:#0058dd;
    --main-color-hover:#00327d;
    --secondary-color:#000;
    --secondary-color-hover:#FFFF;
    --link-color:#0058dd;
    --link-color-hover:#7930d3;
    --alternate-color:#46006a;
    --alternate-color-hover:#560083;
    --lightgrey:#ccc;
    --darkgrey:#444;
    --orange:#f47142;
    --white:#FFF;
    --widget-font-size:2.4rem;
}
*{
    box-sizing:border-box;
}
html,body{
    min-height:100%;
    min-width:100%;
    position:relative;
}
html{
    font-size: 62.5%; /* 62.5% of 16px = 10px */
}
body{
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-family:var(--font-family);
    font-size:16px;
    overflow-x:hidden;
    overflow-y:scroll;
}
h1,h2,h3,h4,h5,h6{
    font-family:var(--font-family);
    font-weight:700;
    display:block;
    line-height:1.4;
    margin-bottom:var(--element-spacing);
}
h1{
    font-size:2.6rem;
}
h2{
    font-size:2.2rem;
}
h3{
    font-size:1.8rem;
}
h4,
h5,
h6{
    font-size:1.6rem;
}
a{
    color:#000;
    text-decoration:none
}
    a:hover{
       color:var(--alternate-color);
    }
ins{background-color:transparent}
img{
    height:auto;
    max-width:100%;
}
.no-margin-bottom{margin-bottom:0 !important;}
.no-margin-left{margin-left:0 !important;}
.no-margin-right{margin-right:0 !important;}
.no-margin-top{margin-top:0 !important;}
.no-padding-bottom{padding-bottom:0 !important;}
.no-padding-left{padding-left:0 !important;}
.no-padding-right{padding-right:0 !important;}
.no-padding-top{padding-top:0 !important;}
.margin-top{margin-top:var(--element-spacing)}
.inline-block{display:inline-block !important;}
.hidden{display:none !important;}

/* --------------------------------------------------
| Animations
-------------------------------------------------- */
@keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}
/* Firefox */
@-moz-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}
/* Safari and Chrome */
@-webkit-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}
/* Internet Explorer */
@-ms-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}
/* Opera */
@-o-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* --------------------------------------------------
| WP Styles
-------------------------------------------------- */
.alignleft{
    float:left;
    margin:0 15px 15px 0
}
.alignright{
    float:right;
    margin:0 0 15px 15px
}
.aligncenter{
    display:block;
    margin:0 auto 15px
}
.gallery{
    margin:0 auto var(--element-spacing);
}
    .gallery .gallery-item {
        float: left;
        margin-top: 0;
        text-align: center;
        width: 33%;
    }
.gallery-columns-2 .gallery-item { width: 50%; }
.gallery-columns-4 .gallery-item { width: 25%; }
.gallery img {
    border:1px solid #009ef3;
    padding:3px;
    background: #009ef3;
    margin-bottom:5px
}
.gallery img:hover{background: white}
.gallery-columns-2 .attachment-medium{
    max-width: 92%;
    height: auto
}
.gallery-columns-4 .attachment-thumbnail{
    max-width: 84%;
    height: auto
}
.gallery .gallery-caption{
    color: #888;
    font-size: 12px;
    margin: 0 0 12px
}
.gallery dl, .gallery dt{margin:0}
.gallery br+br{display:none}
div.wp-caption{
    line-height:1;
    max-width:100%;
}
    div.wp-caption > img{
        display:block;
        margin:0 auto;
    }
    div.wp-caption > .wp-caption-text{
        background-color:var(--alternate-color);
        color:#fff;
        display:block;
        font-size:1.4rem;
        padding:var(--element-spacing-smaller);
    }
/* --------------------------------------------------
| Grid
-------------------------------------------------- */
#wrapper-main{
    z-index:1;
}
#wrapper{
    display:flex;
    flex-direction:column;
    position:relative;
}
    #wrapper.blurry{
        filter:blur(5px);
    }
#content-wrapper{flex-grow:2;}
.clearfix::after,
.row-fluid::after,
.row-container::after{
    visibility: hidden;
    display: block;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0
}
* html .clearfix,
* html .clearfix.row-container,
* html .clearfix.row-fluid{zoom:1} /* IE6 */
*:first-child+html .clearfix,
*:first-child+html .row-container,
*:first-child+html .row-fluid{zoom:1} /* IE7 */
.row-fluid,
.row-container{
    display:block;
    margin-bottom:var(--element-spacing);
    margin-left:auto;
    margin-right:auto;
    position:relative
}
.row-flex{display:flex}
.row-fluid{
    width:100%
}
.row-container{
    width:1080px
}
.row-container-smaller{
    width:900px;
}
.row-container--bigger{
    width:90%;
}
.col{
    display:block;
    float:left;
    position:relative
}
.flex-row{flex-direction:row}
.flex-column{flex-direction:column}
.flex-growing{
    flex-grow:1;
}
/* Big sizes */
@media (min-width:1081px){
    .col-xl-1{width:8.33333%}
    .col-xl-2{width:16.66667%}
    .col-xl-3{width:25%}
    .col-xl-4{width:33.33333%}
    .col-xl-5{width:41.66667%}
    .col-xl-6{width:50%}
    .col-xl-7{width:58.33333%}
    .col-xl-8{width:66.66667%}
    .col-xl-9{width:75%}
    .col-xl-10{width:83.33333%}
    .col-xl-11{width:91.66667%}
    .col-xl-12{width:100%}
}
/* Tablet & netbook sizes */
@media (max-width:1080px){
    .row-container{width:100%}
    #wrapper > .row-container{
        padding-left:var(--element-spacing-medium);
        padding-right:var(--element-spacing-medium);
    }
    .col-t-3{width:25%}
    .col-t-6{width:50%}
    .col-t-7{width:58.33333%}
    .col-t-8{width:66.66667%}
    .col-t-9{width:75%}
    .col-t-10{width:83.33333%}
    .col-t-11{width:91.66667%}
    .col-t-12{width:100%}
    #wrapper-main{
        padding-left:var(--element-spacing-bigger);
        padding-right:var(--element-spacing-bigger);
    }
}
/* Mobile sizes */
@media (max-width:799px){
    .col-m-12{width:100%}
    #wrapper-main{
        padding-left:var(--element-spacing);
        padding-right:var(--element-spacing);
    }
}
@media (max-width:560px){
    #wrapper-main{
        padding-left:0 !important;
        padding-right:0 !important;
    }
}
@media (max-width:480px){
    #wrapper-main{
    }
    .news-loop > .item > .news > .text > h3.title, .news-loop > .item > .news > .text > h3.title a{
        font-size:2rem;
    }
}

/* --------------------------------------------------
| Colors
-------------------------------------------------- */
.bg-black{background-color:#000}
.fg-black{color:#000}
.fg-black-hover{color:#000}
.bg-dark-gray{background-color:#222}
.fg-dark-gray{color:#222}
.fg-dark-gray{color:#222}
.bg-white{background-color:#fff}
.fg-white{color:#fff}
.fg-white-hover{color:#fff}
.bg-main{background-color:var(--main-color)}
.fg-main{color:var(--main-color)}
.fg-main-hover{color:var(--main-color-hover)}
.bg-secondary{background-color:var(--secondary-color)}
.fg-secondary{color:var(--secondary-color)}
.fg-secondary-hover{color:var(--secondary-color-hover)}
.bg-alternate{background-color:var(--alternate-color)}
.bg-alternate-hover{background-color:var(--alternate-color-hover)}
.bg-gradient-blue{
    background: #021B79;  /* fallback for old browsers */
    background: -webkit-linear-gradient(to right, #021B79, #5a00ff);  /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to right, #021B79, #5a00ff); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}
.bg-gradient-blue-invert{
    background: #5a00ff;  /* fallback for old browsers */
    background: -webkit-linear-gradient(to right, #5a00ff, #021B79);  /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to right, #5a00ff, #021B79); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}
.bg-gradient-dark-blue{
    background: #0f0c29;  /* fallback for old browsers */
    background: -webkit-linear-gradient(to right, #24243e, #302b63, #0f0c29);  /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to right, #24243e, #302b63, #0f0c29); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}

/* --------------------------------------------------
| Global elements
-------------------------------------------------- */
.image-link{
    flex-grow:1;
    overflow:hidden;
    position:relative;
}
    .image-link:hover > .background{
        transform:scale(1.1);
    }
    .image-link a.title{
        bottom:0;
        height:100%;
        left:0;
        position:absolute;
        width:100%;
        z-index:4;
    }
        .image-link a.title::before{
            background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 30%, rgba(0,0,0,0.65) 100%);
            background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0) 30%,rgba(0,0,0,0.65) 100%);
            background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0) 30%,rgba(0,0,0,0.65) 100%);
            filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#a6000000',GradientType=0 );
            opacity:1;
            bottom: 0;
            content: " ";
            display: block;
            height: 100%;
            left: 0;
            position: absolute;
            transition:all 250ms ease-in-out;
            width: 100%;
            z-index: 2;
        }
        .image-link a.title .box{
            bottom: 0;
            left: 0;
            padding: 0 1.5rem 1.5rem;
            position: absolute;
            width: 100%;
            z-index: 3;
        }
            .image-link a.title .box .category{
                background-color: var(--main-color);
                color: #fff;
                display: inline-block;
                font-size: 1rem;
                margin-bottom:0.75rem;
                padding: 0.5rem;
                position: relative;
                text-transform: uppercase;
                transition:all var(--default-transition-speed) ease-in-out;
                z-index: 3;
            }
            .image-link a.title .box .description{
                color:#fff;
            }
            .image-link a.title .box .title{
                color: #fff;
                font-size: 2rem;
                line-height: 1.3;
                margin-bottom: 0;
            }
    .image-link a.title:hover .category{
        background-color:var(--link-color-hover);
    }
        .image-link a.title:hover::after{
            background: #021B79;  /* fallback for old browsers */
            background: -webkit-linear-gradient(to right, #021B79, #8400ff);  /* Chrome 10-25, Safari 5.1-6 */
            background: linear-gradient(to right, #021B79, #8400ff); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
        }

.image-link .background{
        background-position:center;
        background-repeat:no-repeat;
        background-size:cover;
        bottom: 0;
        left: 0;
        height: 100%;
        position: absolute;
        transition: all var(--default-transition-speed) ease-in-out;
        width: 100%;
        z-index: 1;
    }
.colorful::before{
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#1e5799+0,2989d8+50,207cca+51,7db9e8+100;Blue+Gloss+Default */
    background: rgb(30,87,153); /* Old browsers */
    background: -moz-linear-gradient(45deg, rgba(30,87,153,1) 0%, rgba(41,137,216,1) 50%, rgba(32,124,202,1) 51%, rgba(125,185,232,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(45deg, rgba(30,87,153,1) 0%,rgba(41,137,216,1) 50%,rgba(32,124,202,1) 51%,rgba(125,185,232,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(45deg, rgba(30,87,153,1) 0%,rgba(41,137,216,1) 50%,rgba(32,124,202,1) 51%,rgba(125,185,232,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1e5799', endColorstr='#7db9e8',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */                    content:" ";
    display:block;
    height:100%;
    left:0;
    opacity:0.1;
    pointer-events: none;
    position:absolute;
    top:0;
    transition:all 750ms ease-in-out;
    width:100%;
}
    .colorful:hover::before{
        opacity:0.4;
    }
.button{
    background-color:var(--main-color);
    color:#fff;
    cursor:pointer;
    display:block;
    font-size:11px;
    font-weight:900;
    padding:0.6rem 1.4rem;
    text-align:center;
    text-decoration:none;
    text-transform:uppercase;
    transition:all var(--default-transition-speed) ease-in-out;
}
    .button:hover{
        background-color:var(--alternate-color);
    }
.psi-label{
    font-weight:bold;
}
.psi-input{
    border:0;
    border-bottom:3px solid #ccc;
    color:#999;
    font-size:2.1rem;
    padding:var(--element-spacing-smaller);
    outline:none;
    transition:all 250ms ease-in-out;
}
    .psi-input:hover,
    .psi-input:focus{
        border-bottom:3px solid var(--main-color);
        color:#000;
    }

/* --------------------------------------------------
| Header - Header container, logo, navigation, login
| TODO: filter out which of these styles can be placed directly into the header so that the css file can be moved to the bottom of the page
-------------------------------------------------- */
.home-page #site-header{
    margin-bottom:0 !important;
}
#site-header{
    display:inline-flex;
    justify-content: center;
    flex-direction:column;
    flex-shrink:1;
    margin-bottom:var(--element-spacing-bigger) !important;
    padding: var(--element-spacing-smaller);
    position:relative;
    z-index:11;
}
@media screen and (max-width:1080px){
    #site-header{
    }
}
#header-wrapper{
    display:flex;
    align-content:center;
    align-items:center;
}
#mobile-nav-toggle{display:none}
#logo{
    flex-basis:0;
    flex-grow:2;
    position:relative;
}
    #logo img,
    #logo svg{
        height:4rem;
        margin:auto;
        transition:all var(--default-transition-speed) ease-in-out;
        width:auto;
    }
        #logo svg:hover{
            transform:scale(1.2)
        }
        #logo svg:hover *{}
#menu-wrapper{
    flex-grow:1;
    position:relative;
}
    #menu-wrapper.active{
        background-color:var(--darkgrey);
        display:block;
        height:100%;
        left:0;
        position:fixed;
        top:0;
        width:100%;
        z-index:5;
    }
    #menu-wrapper .close{
        background-color:var(--main-color);
        cursor:pointer;
        display:inline-block;
        font-weight:800;
        padding:1rem;
        position:absolute;
        top:0;
        text-transform:uppercase;
        right:0;
    }
#register-login{
    flex-basis:0;
    flex-shrink:1;
    height:100%;
    margin-right: 1rem;
    position: relative;
}
    #register-login > a{
        color:#fff;
        cursor:pointer;
        display:table-cell;
        font-size:1.6rem;
        font-weight:900;
        height:100%;
        padding:1.4rem;
        text-align: center;
        text-transform: uppercase;
        transition:all var(--default-transition-speed) ease-in-out;
        vertical-align: middle;
    }
        #register-login > a:hover{
            background-color:var(--main-color);
            width:100%;
        }
#modal-overlay{
    align-content:center;
    align-items:center;
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,000000+100&0.35+28,1+86,1+100 */
    background: -moz-radial-gradient(center, ellipse cover, rgba(0,0,0,0.35) 0%, rgba(0,0,0,0.35) 28%, rgba(0,0,0,1) 86%, rgba(0,0,0,1) 100%); /* FF3.6-15 */
    background: -webkit-radial-gradient(center, ellipse cover, rgba(0,0,0,0.35) 0%,rgba(0,0,0,0.35) 28%,rgba(0,0,0,1) 86%,rgba(0,0,0,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: radial-gradient(ellipse at center, rgba(0,0,0,0.35) 0%,rgba(0,0,0,0.35) 28%,rgba(0,0,0,1) 86%,rgba(0,0,0,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#59000000', endColorstr='#000000',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
    display:none;
    flex-direction:column;
    height:100vh;
    justify-content:center;
    left:0;
    opacity:0;
    position:fixed;
    top:0;
    width:100vw;
    z-index:9008;
}
#user-off-canvas{
    background-color:#000;
    color:#fff;
    display:block;
    opacity:1;
    width:440px;
    z-index:9009;
}
#login-box{
    display:flex;
    flex-direction:row;
    flex-wrap: wrap;
    margin:auto;
    padding:5rem;
    position:relative;
    width:100%;
}
    #login-box .box{
        flex-grow:1;
        padding:0 1rem;
    }
    .wp-social-login-connect-with,
    #login-box h4{
        color:#fff !important;
        font-size:2.4rem;
        font-weight:900;
        margin-bottom:10px;
        text-align:left !important;
        text-transform:uppercase;
        position:relative;
        width:100%;
    }
        .wp-social-login-connect-with::before,
        #login-box h4::before{
            background-color:#fff;
            content:" ";
            height:5px;
            left:0;
            top:-8px;
            position:absolute;
            width:76px;
        }
    #login-box input[type=text],
    #login-box input[type=password]{
        background-color:transparent;
        border:0;
        color:#fff;
        border-bottom:2px solid var(--main-color);
        cursor:pointer;
        display:block;
        font-size:1.6rem;
        margin-bottom:1.2rem;
        outline:none;
        padding:0.6rem;
        transition:all var(--default-transition-speed) ease-in-out;
        width:100%;
    }
        #login-box input[type=text]:focus,
        #login-box input[type=text]:hover,
        #login-box input[type=password]:focus,
        #login-box input[type=password]:hover{
            border-bottom-color: #fff;
        }
    #login-box button[type=submit]{
        background-color:var(--main-color);
        border:2px solid var(--main-color);
        color:#fff;
        cursor:pointer;
        display:block;
        font-weight:900;
        margin:1.6rem auto 1.2rem;
        padding:0.6rem 1.4rem;
        text-transform:uppercase;
        transition:all var(--default-transition-speed) ease-in-out;
        width:100%;
    }
        #login-box button[type=submit]:hover{
            background-color:var(--alternate-color);
            border:2px solid var(--alternate-color);
            color:#fff;
        }
    #login-box .flexer{
        display:block;
        margin:25px 0;
    }
    #login-box .datenschutz{
        color:#fff;
        font-size:1.3rem;
        width:100%;
    }
        #login-box .datenschutz:hover{
            text-decoration: underline;
        }
    #login-box #rememberme-label{
        display:block;
        margin-bottom:15px;
        padding-left:35px;
        position: relative;
    }
        #login-box #rememberme-label::after{
            background-color:transparent;
            border:2px solid #fff;
            bottom:0;
            color:#fff;
            content:" ";
            display:block;
            height:20px;
            left:0;
            margin:auto;
            position: absolute;
            top:0;
            text-align: center;
            transition:all var(--default-transition-speed) ease-in-out;
            width:20px;
        }
    #login-box input[type=checkbox]#rememberme{
        display:inline-block;
        position:absolute;
        opacity:0;
    }
        #login-box input[type=checkbox]#rememberme:checked + #rememberme-label::after{
            content:"✔";
        }
    #login-box #forgot-password{
        color:#fff;
        display: block;
        margin-bottom:15px;
        font-size:1.3rem;
    }
    #login-box #register-button{
        color:#fff;
        display:block;
        margin-bottom:50px;
    }
#login-box .wp-social-login-provider-list a{
    display:inline-block;
    margin-right:10px;
}
#modal-close{
    background-color:var(--main-color);
    cursor:pointer;
    display:inline-block;
    color:#fff;
    font-size:1.6rem;
    font-weight:900;
    padding:14px;
    position:absolute;
    right:0;
    text-align:center;
    text-decoration:none;
    top:0;
    transition:all 150ms ease-in-out;
}
    #modal-close:hover{
        background-color:var(--alternate-color);
        color:#fff;
    }
#menu{
    display:flex;
    height:100%;
    margin-right:10px;
    position:relative;
    text-align: right;
}
    #menu > li{
        flex-grow:1;
        font-size:0;
        height:100%;
        list-style-type:none;
        position: relative;
    }
        #menu > li > a{
            color:#fff;
            display:block;
            height:100%;
            font-size:1.4rem;
            padding:1.4rem 0.6rem;
            position:relative;
            text-align: center;
            text-transform: uppercase;
            transition:all var(--default-transition-speed) ease-in-out;
        }
            #menu > li > a:hover{
                background-color:var(--main-color);
            }
            #menu > li.menu-item-has-children > a::after{
                content:'▼';
                font-size:1rem;
                margin-left:5px;
            }
        #menu > li > ul{
            -webkit-animation: fadein var(--default-transition-speed) forwards; /* Safari and Chrome */
            -moz-animation: fadein var(--default-transition-speed) forwards; /* Firefox */
            -ms-animation: fadein var(--default-transition-speed) forwards; /* Internet Explorer */
            -o-animation: fadein var(--default-transition-speed) forwardss; /* Opera */
            animation: fadein var(--default-transition-speed) forwards;
            display:none;
            opacity: 0;
            position: absolute;
            top:100%;
            text-align: left;
            transition:all var(--default-transition-speed) ease-in-out;
            z-index:9001;
        }
            #menu > li:hover > ul{
                display:block;
            }
            #menu > li > ul > li{position:relative}
            #menu > li > ul > li > a{
                background-color:var(--alternate-color);
                color:#fff;
                display:block;
                font-size:1.4rem;
                transition:all var(--default-transition-speed) ease-in-out;
                padding:1rem;
            }
                #menu > li > ul > li > a:hover{
                    background-color:var(--main-color);
                    width: 100%;
                }
#search-modal{
    background-color:rgba(0,0,0,0.8);
    display:block;
    display:flex;
    display:none;
    border-bottom:1px solid #ccc;
    flex-direction:column;
    align-content:center;
    justify-content:center;
    position: fixed;
    height: 100vh;
    width: 100vw;
    left:0;
    top:0;
    z-index: 9002;
}
    #search-modal .close{
        background-color: var(--main-color);
        cursor: pointer;
        display: inline-block;
        color: #fff;
        font-size: 1.6rem;
        font-weight: 900;
        padding: 14px;
        position: absolute;
        right: 0;
        text-align: center;
        text-decoration: none;
        top: 0;
        transition: all 150ms ease-in-out;
    }
        #search-modal .close:hover{
            background-color:var(--alternate-color);
            color:#fff;
        }
#header-search{
    display:flex;
    flex-direction:row;
    align-content:center;
    justify-content:center;
    width:100vw;
}
    #header-search-button{
        -webkit-transition: all var(--default-transition-speed) ease;
        -moz-transition: all var(--default-transition-speed) ease;
        -ms-transition: all var(--default-transition-speed) ease;
        -o-transition: all var(--default-transition-speed) ease;
        align-content:center;
        cursor:pointer;
        flex-shrink: 1;
        padding:1.4rem 1.6rem;
        position: relative;
        transition: all var(--default-transition-speed) easetime;
        vertical-align: middle;
    }
        #header-search-button:hover{
            background-color:var(--main-color);
        }
    #header-search input[type=text]{
        background-color:transparent;
        border:0;
        border-bottom:2px solid #fff;
        color:#fff;
        cursor:pointer;
        font-size:6rem;
        outline:0;
        padding:0.4rem;
        width:90%;
    }
        #header-search input[type=text]:focus{
            border-bottom:2px solid var(--link-color);
        }
    button#search-submit{
        flex-shrink:1;
        background-color:transparent;
        border:0;
        color:#ddd;
        cursor:pointer;
        display:inline-block;
        font-size:4rem;
    }
        button#search-submit:hover{
            color:var(--link-color);
        }
    #header-user{
        display:block;
        height:44px;
        position:relative;
    }
        #header-user .flexer{
            display:flex;
            flex-direction:column;
            flex-wrap: nowrap;
            height:44px;
            overflow:hidden;
            text-align:center;
            transition:all var(--default-transition-speed) ease-in-out;
        }
            #header-user .flexer.active,
            #header-user .flexer:hover{
                height:auto;
            }
            #header-user .box{
                background-color:#000B0F;
                width:130px;
                position: absolute;
                transition:all var(--default-transition-speed) ease-in-out;
                top:100%;
                right: 0;
                opacity:0;
                visibility: hidden;
            }
                #header-user .flexer.active .box,
                #header-user .flexer:hover .box{
                    opacity:1;
                    visibility: visible;
                }
                #header-user .box a{
                    position: relative;
                    z-index: 2;
                }
                #header-user .box a::before {
                    background-color: var(--main-color);
                    bottom: 0;
                    content: " ";
                    display: block;
                    height: 100%;
                    left: 0;
                    opacity: 0;
                    position: absolute;
                    transition:all var(--default-transition-speed) ease-in-out;
                    width: 100%;
                    z-index: -1;
                }
                #header-user .box a:hover::before{
                    opacity: 1;
                }
                #header-user-displayname{
                    color:var(--white);
                    display:block;
                    font-size:1.3rem;
                    padding:10px;
                    text-align: right;
                }
                    #header-user-displayname span{
                        display:block;
                        font-size:1.1rem;
                        margin-bottom:5px;
                    }
                #account-nav{
                    list-style-type: none;
                    margin:0;
                }
                #my-logout{
                    font-size:1.3rem;
                    padding:1rem;
                    color:#fff;
                    display:block;
                    text-align: right;
                }
    #header-user-avatar{
        height:44px;
        position:relative;
    }
        #header-user-avatar img{
            height:auto;
            max-width:44px;
            position:relative;
            transition:all var(--default-transition-speed) ease-in-out;
        }
@media (max-width:1024px){
    #menu-wrapper{
        display:none;
    }
        #menu-wrapper.active{
            background-color:#000;
            display:flex;
            padding:2rem;
        }
            #menu-wrapper.active #menu{
                display:block;
                flex-direction:column;
                width:100%;
            }
            #menu-wrapper.active #menu > li{
                display:block;
                height:auto !important;
                flex-direction:column;
            }
                #menu-wrapper.active #menu > li > a{
                    flex-grow:1;
                    justify-content:center;
                    padding:1rem;
                    text-align:center;
                    width:100%;
                }
                #menu-wrapper.active #menu > li > ul{
                    display:none;
                    position:relative;
                    top:0;
                }
                #menu-wrapper.active #menu > li > ul > li > a{
                    background-color:#222;
                    text-align:center;
                }
    #menu > li.menu-item-has-children > a::after {
        content: '';
    }
    #menu > li.menu-item-has-children > div.toggle-button{
        background-color:var(--link-color);
        color:#fff;
        cursor:pointer;
        display:block;
        font-size:1.4rem;
        padding:1rem;
        position:absolute;
        right:0;
        top:0;
    }
    #mobile-nav-toggle{
        cursor:pointer;
        display:block;
        padding:1.4rem;
        transition:all var(--default-transition-speed) ease-in-out;
    }
        #mobile-nav-toggle:hover{
            background-color:var(--main-color);
        }
    #user-off-canvas{
        width:100%;
    }
    #login-box{
        left:0;
        padding:3rem;
        right:auto;
    }
}
@media (max-width:480px){
    #logo img{
        height:30px;
    }
}

/* --------------------------------------------------
| Home
-------------------------------------------------- */
#top-news{
    display:block;
    margin-left:auto;
    margin-right:auto;
    position:relative;
}
    #top-news .news{
        float:left;
    }
    #top-news .news.big{
        display:block;
        height:400px;
        width:50%;
    }
    #top-news .news.small{
        display:block;
        height:200px;
        width:25%;
    }
    #top-news .news.big a .box h3{
        width:80%;
    }
@media (max-width:1080px){
    #top-news{
    }
}
@media (max-width:800px){
    #top-news{}
    #top-news .news.big{
        width:100%
    }
    #top-news .flexer.column{
        width:100%
    }
    #top-news .flexer .news.small{
        height:auto;
        width:100%
    }
    #top-news .flexer.row{flex-direction:column}
}
@media (max-width:640px){
    .no-margin-top-mobile{margin-top:0;}
    #top-news{
        flex:none;
        height:250px;
        overflow:hidden;
        position:relative;
    }
        #top-news .news{
            float:none;
            height:100%;
        }
            #top-news .news.big,
            #top-news .news.small{
                height:250px;
                width:100%
            }
}

/**
CSS FILE CONTENT
**/
/* --------------------------------------------------
| Hacks
-------------------------------------------------- */
.photospace_res ul.thumbs img{cursor:pointer}
/* --------------------------------------------------
| Global Elements
-------------------------------------------------- */
.promo-row{text-align:center}
@media (max-width:1080px){
    .promo-row{
        padding-left:var(--element-spacing);
        padding-right:var(--element-spacing);
    }
}
.section-title{
    font-size:var(--widget-font-size);
    padding:0.2rem 0 0.2rem 2rem;
    position:relative;
}
    .section-title::after{
        background-color:var(--main-color);
        content:" ";
        display:block;
        left:0;
        height:100%;
        position:absolute;
        top:0;
        width:1rem;
    }
        .section-title.center{
            margin:3rem auto;
            padding-bottom:2rem;
            padding-left:0 !important;
            text-align:center;
        }
            .section-title.center::after{
                display:block;
                height:1rem;
                left:0;
                margin:var(--element-spacing-smaller) auto 0;
                position:relative;
                right:0;
                text-align:center;
                width:10rem;
            }
#login-register-cta{
    color: #fff;
    display:block;
    line-height:1.6;
    margin-bottom:var(--element-spacing);
    padding:var(--element-spacing);
    text-align:center;
}
    #login-register-cta h3{
        margin-bottom:var(--element-spacing-smaller);
    }
    #login-register-cta a{
        color: var(--white);
        text-decoration:underline;
    }
@media (max-width:560px){
    .section-title {
        margin:0 var(--element-spacing) var(--element-spacing);
    }
}
/* --------------------------------------------------
| Home
-------------------------------------------------- */
#home-upper-news-promo{
    display:flex;
}
    #home-upper-news-promo .promo{
        flex:0 0 300px
    }
    #home-upper-news-promo .news-list{
        display:flex;
        flex-direction:row;
        flex-grow:1;
    }
        #home-upper-news-promo .news-list .news{
            flex-grow:1;
            margin-bottom:0;
            overflow:hidden;
            padding-right:var(--element-spacing);
            position:relative;
            width:50%
        }
            #home-upper-news-promo .news-list .news .thumbnail{
                height:auto;
                margin-bottom:5px;
                max-width:100%;
                position:relative;
            }
            #home-upper-news-promo .news-list .news a{
                color:#000;
                transition:all var(--default-transition-speed) ease-in-out;
            }
                #home-upper-news-promo .news-list .news a:hover{
                    color:var(--link-color);
                }
                #home-upper-news-promo .news-list .news a .category{
                    background-color: var(--main-color);
                    color: #fff;
                    display: inline-block;
                    font-size: 1rem;
                    margin-bottom:0.75rem;
                    padding: 0.5rem;
                    position: relative;
                    text-transform: uppercase;
                    transition:all var(--default-transition-speed) ease-in-out;
                }
                    #home-upper-news-promo .news-list .news a:hover .category {
                    background-color: var(--link-color);
                }
                #home-upper-news-promo .news-list .news a .title{
                    margin-bottom:0;
                }
                #home-upper-news-promo .news-list .news a .author{
                    font-size:11px;
                }
#home-reviews-promo,
#home-releases-promo{
    align-items: flex-end;
    display:flex;
    flex-direction: row;
}
    #home-reviews-promo > .block.review,
    #home-releases-promo > .block.releases{
        display:flex;
        flex-direction:row;
        flex-grow:2;
        flex-wrap: wrap;
        position:relative;
        width:100%;
    }
        #home-reviews-promo > .block.review > .title,
        #home-releases-promo > .block.releases > .title{
            font-size:3rem;
            margin-bottom:0;
            width:100%;
        }
            #home-reviews-promo > .block.review > .title h3,
            #home-releases-promo > .block.releases > .title h3{
                margin-bottom:0;
            }
        #home-reviews-promo > .block.review > .game,
        #home-releases-promo > .block.releases > .game{
            flex-grow:0;
            height:225px;
            margin-right:3rem;
            width:225px;
        }
    #home-reviews-promo > .block.promo,
    #home-releases-promo > .block.promo{
        flex:0 0 300px
    }
/* --------------------------------------------------
| Reviews
-------------------------------------------------- */
.reviews-loop{
    display:flex;
    flex-direction:row;
    flex-wrap:wrap;
    margin-bottom:var(--element-spacing);
}
    .reviews-loop > .item{
        flex:0 0 33.33333%;
        position:relative;
    }
        .reviews-loop > .item > .thumbnail{
            display:block;
            font-size:0;
            overflow:hidden;
            position:relative;
            transition:all 250ms ease-in-out;
            z-index:100;
        }
            .reviews-loop > .item > .thumbnail > img{
                transition:all 250ms ease-in-out;
            }
                .reviews-loop > .item > .thumbnail:hover > img{
                    transform:scale(1.1);
                }
        .reviews-loop > .item > .text{
            bottom:1rem;
            left:1rem;
            position:absolute;
            z-index:101;
        }
            .reviews-loop > .item > .text > a > h3.title{
                color:#fff;
                text-shadow:1px 1px 1px #000;
            }
        .reviews-loop > .item > .rating{
            cursor: pointer;
            position:absolute;
            right:1rem;
            top:1rem;
            z-index: 101;
        }
        .reviews-loop > .item > .rating > span{
            font-weight:bold;
        }
#home-reviews-loop{
    margin-bottom:var(--element-spacing-bigger);
}
@media (max-width:1080px){
    #home-reviews-loop{
        padding-left:var(--element-spacing);
        padding-right:var(--element-spacing);
    }
}
@media (max-width:800px){
    .reviews-loop > .item{
        flex:0 0 50%
    }
}
/* --------------------------------------------------
| Reviews single
-------------------------------------------------- */
.review-body{
    padding-bottom:0 !important;
}
#review-wallpaper{
    height:800px;
    left:0;
    overflow:hidden;
    position:absolute;
    top:50px;
    width:100%;
    z-index:1;
}
    #review-wallpaper div.image{
        background-size:cover;
        background-position:center;
        height:100%;
        transform:scale(1.1);
        width:100%;
        z-index:2;
    }
    #review-wallpaper div.shader{
        background: #24243e;  /* fallback for old browsers */
        background: -webkit-linear-gradient(to right, #24243e, #0f0c29);  /* Chrome 10-25, Safari 5.1-6 */
        background: linear-gradient(to right, #24243e, #0f0c29); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
        content:" ";
        display:block;
        left:0;
        height:100%;
        opacity:0.6;
        position:absolute;
        top:0;
        width:100%;
        z-index:3;
    }
    #review-wallpaper::after{
        /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,ffffff+100&0+63,1+100 */
        background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 63%, rgba(255,255,255,1) 100%); /* FF3.6-15 */
        background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(255,255,255,0) 63%,rgba(255,255,255,1) 100%); /* Chrome10-25,Safari5.1-6 */
        background: linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(255,255,255,0) 63%,rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
        content:' ';
        display:block;
        filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
        height:100%;
        position:absolute;
        left:0;
        top:0;
        width:100%;
        z-index:4;
    }
#review-header{
    position:relative;
    text-align:center;
    z-index:5;
}
    #review-header h1{
        font-size:4.4rem;
        text-align: center;
    }
    #review-header span#post-meta{
        font-size:1.2rem;
        font-weight:bold;
        text-transform:uppercase;
    }
        #review-header span#post-meta a{
            color:var(--white);
        }
            #review-header span#post-meta a:hover{
                color:var(--alternate-color);
            }
#review-score-box{
    display:flex;
    flex-direction:row;
    flex-wrap:wrap;
    margin:var(--element-spacing-bigger) auto var(--element-spacing);
}
    #review-score-box .review-author{
        font-weight:bold;
        padding:var(--element-spacing) var(--element-spacing) var(--element-spacing-bigger);
        text-align:center;
        width:100%;
    }
        #review-score-box .review-author a{
            color:var(--link-color);
            transition:all 250ms ease-in-out;
        }
            #review-score-box .review-author a:hover{
                color:var(--link-color-hover);
            }
    #review-score-box .review-thumbnail{
        flex:0 0 170px;
    }

    #review-score-box .review-score{
        display:flex;
        flex-direction:row;
        flex-grow:1;
        padding:var(--element-spacing-bigger);
    }
        #review-score-box .review-score-container{
        }
        #review-score-box .review-score-item{
            line-height:1.5;
            padding:var(--element-spacing-smaller);
        }
            #review-score-box .review-score-item h4{
                font-size:2.3rem;
            }
        #review-score-box .review-score-pro,
        #review-score-box .review-score-con{
            flex-grow:1;
        }
        #review-score-box .review-score-pro{}
            #review-score-box .review-score-pro h4{
                color:#0C0;
            }
        #review-score-box .review-score-con{}
            #review-score-box .review-score-con h4{
                color:#F00;
            }
        #review-score-box .review-score-count{}
            #review-score-box .review-score-count .review-score-count-value{
                display: inline-block;
                font-size: 9rem;
                font-weight: bold;
                line-height:1;
                margin: 0 auto;
                text-align: center;
                width: 200px;
            }
            #review-score-box .review-score-count .review-score-count-text{
                display: block;
                font-size: 3rem;
                font-weight: bold;
                text-align:center;
            }
        #review-score-box .review-meta .review-text{
            flex-grow:1;
            padding:0 1rem 1rem;
        }
            #review-score-box .review-meta .review-text ul{
                display:block;
                list-style:none;
                margin-bottom:var(--element-spacing);
            }
                #review-score-box .review-meta .review-text ul li{
                    display:flex;
                    line-height:1.4;
                    padding-bottom:1rem;
                }
                    #review-score-box .review-meta .review-text ul li span{
                        font-weight:bold;
                        flex:0 0 90px;
                        margin-right:1rem;
                    }
        #review-score-box .review-score{
            flex-grow:1;
        }
            #review-score-box .review-score .review-score-scorebox{
                margin-bottom:var(--element-spacing);
                padding:var(--element-spacing);
            }
    #review-score-box .review-score-shopping-links{
        width:100%;
    }
    #review-score-box .review-gameinfo{
        display:flex;
    }
@media (max-width:780px){
    .review-body{
        padding:var(--element-spacing) !important;
    }
    #review-score-box .review-score{
        flex-wrap:wrap;
        justify-content:center;
    }
    #review-score-box .review-score-con{
        margin-bottom:var(--element-spacing);
    }
}
@media (max-width:480px){
    #review-header h1.title{
        padding-left:var(--element-spacing-smaller);
        padding-right:var(--element-spacing-smaller);
    }
}
@media (max-width:480px){
    #review-score-box .review-score{
        padding:var(--element-spacing);
    }
}

/* --------------------------------------------------
| News loop
-------------------------------------------------- */
#news-loop-load-more{
    cursor:pointer;
    display:block;
    color:#777;
    font-size:2rem;
    font-weight:700;
    margin:2rem auto;
    text-align:center;
    text-transform:uppercase;
}
    #news-loop-load-more span{
        background-color:var(--darkgrey);
        border-radius:10px;
        color:#fff;
        display:inline-block;
        text-align: center;
        transition:all var(--default-transition-speed) ease-in;
        padding:1rem;
    }
        #news-loop-load-more:hover span{
            background: var(--main-color);
        }
.news-loop-wrapper{
    display:flex;
    flex-direction:row;
    flex-wrap:nowrap;
}
    .news-loop-wrapper > .sidebar{
        flex:0 0 300px;
        margin-left:25px;
    }
        .news-loop-wrapper > .sidebar > .widget{
            margin:var(--element-spacing) 0;
        }
            .news-loop-wrapper > .sidebar > .widget:last-of-type{
                margin-bottom:0;
            }
            .news-loop-wrapper > .sidebar > .widget > h3{
                border-left:10px solid var(--alternate-color);
                font-size:var(--widget-font-size);
                margin-bottom:1rem;
                padding:0.2rem 1rem;
            }
            .news-loop-wrapper > .sidebar > .widget.widget-reviews{}
                .news-loop-wrapper > .sidebar > .widget.widget-reviews > .game{
                    justify-content:flex-end;
                    background-color:#666;
                    border-bottom:1px solid #eaeaea;
                    display:flex;
                    flex-direction: row;
                    flex-wrap: nowrap;
                }
                .news-loop-wrapper > .sidebar > .widget.widget-reviews > .game > .title{
                    flex-grow:1;
                    padding:1rem;
                    position:relative;
                    text-align:left;
                    transition:all var(--default-transition-speed) ease-in-out;
                }
                    .news-loop-wrapper > .sidebar > .widget.widget-reviews > .game > .title > h3{
                        color:#fff;
                        font-size:1.8rem;
                        line-height:1.3;
                        margin-bottom: 0;
                        position:relative;
                        transition:all var(--default-transition-speed) ease-in-out;
                        width:100%;
                        z-index:3;
                    }
                    .news-loop-wrapper > .sidebar > .widget.widget-reviews > .game > .title:hover > h3{
                        color:var(--link-color) !important;
                    }
                    .news-loop-wrapper > .sidebar > .widget.widget-reviews > .game > .title::after{
                        background-color:rgba(0,0,0,0.7);
                        content:" ";
                        display:block;
                        height:100%;
                        left:0;
                        position:absolute;
                        transition:all var(--default-transition-speed) ease-in-out;
                        top:0;
                        width:100%;
                        z-index:2;
                    }
                    .news-loop-wrapper > .sidebar > .widget.widget-reviews > .game > .title:hover::after{
                        background-color:rgba(0,0,0,0.6);
                    }
                .news-loop-wrapper > .sidebar > .widget.widget-reviews > .game > .score{
                    align-items: center;
                    background-color:#00ac00;
                    color:#fff;
                    display:flex;
                    flex:0 0 85px;
                    flex-direction:column;
                    font-size:2rem;
                    font-weight:900;
                    justify-content: center;
                    padding:1rem;
                }
                    .news-loop-wrapper > .sidebar > .widget.widget-reviews > .game > .score > .text{
                        font-size:1rem;
                    }
            .news-loop-wrapper > .sidebar > .widget.widget-releases{
                display:flex;
                flex-direction:column;
            }
                .news-loop-wrapper > .sidebar > .widget.widget-releases > .game{
                    background-repeat:no-repeat;
                    background-size:cover;
                    background-position:center;
                    flex-grow:0;
                    padding:1rem;
                    position:relative;
                }
                    .news-loop-wrapper > .sidebar > .widget.widget-releases > .game::before{
                        background-color:rgba(0,0,0,0.7);
                        content:" ";
                        display:block;
                        height:100%;
                        left:0;
                        position:absolute;
                        top:0;
                        transition:all var(--default-transition-speed) ease-in-out;
                        width:100%;
                        z-index:1;
                    }
                    .news-loop-wrapper > .sidebar > .widget.widget-releases > .game > a{
                        color:#fff;
                        display:block;
                        position:relative;
                        height:100%;
                        width:100%;
                        z-index:2;
                    }
                        .news-loop-wrapper > .sidebar > .widget.widget-releases > .game > a > h3{
                            line-height:1;
                            margin-bottom:5px;
                            transition:all var(--default-transition-speed) ease-in-out;
                        }
                    .news-loop-wrapper > .sidebar > .widget.widget-releases > .game:hover > a > h3{
                        color:var(--link-color) !important;
                    }
                    .news-loop-wrapper > .sidebar > .widget.widget-releases > .game:hover::before{
                        background-color:rgba(0,0,0,0.6);
                    }
@media (max-width:1080px){
    .news-loop-wrapper{
        padding-left:var(--element-spacing);
        padding-right:var(--element-spacing);
    }
}
@media (max-width:1024px){
    .news-loop-wrapper{
        flex-direction:column;
    }
    #news-loop-top{
        margin-bottom:var(--element-spacing);
    }
    .news-loop-wrapper > .sidebar{
        margin-left:0;
    }
}
@media (max-width:640px){
    .reviews-loop > .item{
        flex: 0 0 100%;
    }
}
.news-loop{
    display:flex;
    flex-direction:column;
    margin-bottom:0;
}
    .news-loop > .item{
        border-bottom:3px solid #a2cde0;
        flex-grow:0;
        margin-bottom:var(--element-spacing);
        padding-bottom:var(--element-spacing);
    }
        .news-loop > .item:last-of-type{
            border-bottom:0;
            margin-bottom:0;
            padding-bottom:0;
        }
        .news-loop > .item > .news{
            display:flex;
            flex-direction:row;
            flex-wrap:nowrap;
        }
            .news-loop > .item > .news > .thumbnail{
                flex:0 0 200px;
                font-size:0;
                position:relative;
            }
                .news-loop > .item > .news > .thumbnail > .category{
                    background-color:var(--main-color);
                    color: #fff;
                    display: inline-block;
                    font-size: 1rem;
                    left:0;
                    margin-bottom:0.2rem;
                    pointer-events: none;
                    padding: 0.5rem;
                    position: absolute;
                    top:1rem;
                    text-transform: uppercase;
                    transition:all var(--default-transition-speed) ease-in-out;
                    z-index:5;
                }
                    .news-loop > .item > .news > .thumbnail:hover > .category{
                        left:1rem;
                        background-color:var(--link-color);
                    }
                .news-loop > .item > .news > .thumbnail > .review-score{
                    background-color:var(--main-color);
                    bottom:0;
                    color:#fff;
                    display: block;
                    font-size:4rem;
                    font-weight:bold;
                    left:0;
                    position: absolute;
                    padding: 1rem;
                    transition:all var(--default-transition-speed) ease;
                    z-index: 10;
                }
                    .news-loop > .item > .news > .thumbnail:hover > .review-score{
                        background-color:var(--link-color-hover);
                        bottom:1rem;
                        left:1rem;
                    }
            .news-loop > .item > .news > .text{
                flex-grow:1;
                padding:0 2rem;
            }
                .news-loop > .item > .news > .text > h3.title{
                    margin-bottom:2rem;
                }
                .news-loop > .item > .news > .text > h3.title,
                .news-loop > .item > .news > .text > h3.title a{
                    color:#000;
                    font-size:3rem;
                    line-height:1.1;
                    margin-bottom:0.5rem;
                    transition:all var(--default-transition-speed) ease-in-out;
                }
                    .news-loop > .item > .news > .text > h3.title:hover,
                    .news-loop > .item > .news > .text > h3.title:hover a{
                        color:var(--link-color);
                    }
                .news-loop > .item > .news > .text > .description{margin-bottom:1rem}
                    .news-loop > .item > .news > .text .description p{
                        line-height:1.4;
                        margin-bottom:0;
                    }
                .news-loop > .item > .news > .text > .meta{
                    font-size:11px;
                    margin-bottom:1rem
                }
    .news-loop-stream{
        border:0;
        margin-bottom:var(--element-spacing);
    }
        .news-loop-stream > .item{
            position:relative;
            overflow:hidden;
            z-index:3;
        }
            /**
            Default posts
             */
            .news-loop-stream > .item > .news > .text > h3.title,
            .news-loop-stream > .item > .news > .text > h3.title a{
            }
            /**
            Wallpaper posts
             */
            .news-loop-stream > .item > .top-news{
                flex-direction:column;
                min-height:450px;
                align-items:flex-end;
                justify-content:flex-end;
                overflow:hidden;
                position: relative;
            }
                .news-loop-stream > .item > .top-news::before{
                    background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 30%, rgba(0,0,0,0.65) 100%);
                    background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0) 30%,rgba(0,0,0,0.65) 100%);
                    background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0) 30%,rgba(0,0,0,0.65) 100%);
                    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#a6000000',GradientType=0 );
                    bottom: 0;
                    content: " ";
                    display: block;
                    height: 100%;
                    left: 0;
                    position: absolute;
                    width: 100%;
                    z-index: 2;
                }

                .news-loop-stream > .item > .top-news > .text{
                    flex-grow:0;
                }
                .news-loop-stream > .item > .top-news > .text > h3.title,
                .news-loop-stream > .item > .top-news > .text > h3.title a{
                    color:#fff;
                    z-index:2;
                    position:relative;
                }
                .news-loop-stream > .item > .top-news > .text > .category{
                    background-color: var(--main-color);
                    color: #fff;
                    display: inline-block;
                    font-size: 1rem;
                    left:0;
                    margin-bottom:1rem;
                    pointer-events: none;
                    padding:0.5rem;
                    position:relative;
                    text-transform: uppercase;
                    transition:all var(--default-transition-speed) ease-in-out;
                    z-index:5;
                }
                    .news-loop-stream > .item > .top-news > .text:hover > .category{
                        background-color:var(--link-color);
                    }
                .news-loop-stream > .item > .top-news > img.wallpaper{
                    width:100%;
                    height:auto;
                    position:absolute;
                    top:0;
                    left:0;
                    z-index:1;
                }
@media (max-width:1080px){
    #news-loop-continued{
        padding-left:var(--element-spacing);
        padding-right:var(--element-spacing);
    }
}
@media (max-width:800px){
    .news-loop > .item{
        border-bottom:0;
        padding-bottom:0;
    }
}
@media (max-width:768px){
    .news-loop > .item > .news{flex-direction:row}
        .news-loop > .item > .news > .box{
            height:auto;
            flex:0 0 150px;
        }
            .news-loop > .item > .news > .box > img{
                height:auto;
                margin-bottom:15px;
                width:100%;
            }
    .news-loop-stream > .item > .top-news{min-height:250px}
}
@media (max-width:560px){
    .news-loop-wrapper{
        padding:0;
    }
    .news-loop-stream{
        padding-left:0 !important;
        padding-right:0 !important;
    }
    #news-loop-top > .item > .news > .box,
    .news-loop > .item > .news > .box{
        font-size:0;
        flex:0 0 75px;
    }
        .news-loop > .item > .news > .box > a{display:block}
        .news-loop > .item > .news > .box > .category{
            position:relative;
            top:auto;
            text-align:center;
            width:100%;
        }
    .news-loop > .item > .news > .box:hover > .category{left:0}
    .news-loop > .item > .news > .text > h3.title, .news-loop > .item > .news > .text > h3.title a{font-size:2rem}
    .news-loop > .item > .news{
        flex-wrap:wrap
    }
        .news-loop > .item > .news > .thumbnail{
            flex:0 0 100%;
            margin-bottom:var(--element-spacing);
        }
            .news-loop > .item > .news > .thumbnail img{
                height:auto;
                width:100%
            }
}

/* --------------------------------------------------
| News
-------------------------------------------------- */
.row-container-smaller.article-body{
    padding:var(--element-spacing-bigger);
}
.article-body{
    background-color:#fff;
    padding:var(--element-spacing);
    position:relative;
    z-index:10;
}
    .article-body h1.title{
        font-size:3.5rem;
        line-height:1.2;
        margin-bottom:0.5rem;
    }
        .article-body > span#post-meta{
            display:block;
            font-size:1.5rem;
            line-height:1.5;
            margin-bottom:var(--element-spacing);
        }
            .article-body > span#post-meta > i.fa{
                margin-right:10px;
            }
                .article-body > span#post-meta > i.fa:last-of-type{
                    margin-left:10px;
                }

        .article-body > div.content img{
            height:auto;
            max-width:100%;
        }
        .article-body > div.content{font-family:var(--default-copy-font)}
        .article-body > div.content > ul{
            list-style-type:square;
            margin:0 0 var(--element-spacing) var(--element-spacing-bigger);
        }
            .article-body > div.content > ul > li{padding-bottom:0.8rem}
            .article-body > div.content > p{margin-bottom:1.5rem;}
            .article-body > div.content blockquote{
                color:var(--darkgrey);
                font-size:2.2rem;
                font-weight:bold;
                font-style:italic;
                margin:var(--element-spacing) auto;
                padding-left:var(--element-spacing-bigger);
                position:relative;
            }
                .article-body > div.content blockquote::before{
                    content:"\f10d";
                    font-family:"Font Awesome 5 Free";
                    display:block;
                    position:absolute;
                    top:0;
                    left:5px;
                    font-size:2rem;
                }

            .article-body > div.content a{
                color:var(--main-color);
                text-decoration: underline;
                transform:all var(--default-transition-speed) ease-in-out;
            }
                .article-body > div.content a:hover{color:var(--link-color)}
            .article-body > div.content ul.news-tags{
                font-size:1.6rem;
                margin:0;
            }
                .article-body > div.content ul.news-tags > li{
                    display:inline-block;
                    margin-right:1rem;
                    padding-bottom:0;
                }
                    .article-body > div.content ul.news-tags > li:first-child{
                        font-weight:bold;
                    }
                .article-body > div.content ul.news-tags > li a{
                    color:#000;
                    transition:all var(--default-transition-speed) ease-in-out;
                    text-decoration:underline;
                }
                    .article-body > div.content ul.news-tags > li a:hover{color:var(--link-color)}
        .article-body > div.content img.aligncenter{
            display:block;
            height:auto;
            margin:var(--element-spacing) auto;
            max-width:100%;
        }
    .article-body div.content{
        font-size:1.8rem;
        line-height:1.4;
    }
    .article-body div.content h1{font-size:3.2rem}
    .article-body div.content h2{font-size:2.8rem}
    .article-body div.content h3{font-size:2.4rem}
    .article-body div.content h4{font-size:2.0rem}
    .article-body div.content h5{font-size:1.8rem}
    .article-body > aside.shopping-links{
        font-size:1.8rem;
        margin:var(--element-spacing-bigger) auto 0;
        text-align:center;
    }
        .article-body > aside.shopping-links > h3{
            font-size:2rem;
            text-align:center;
        }
        .article-body > aside.shopping-links > p{
            line-height:1.2;
            margin:0 auto var(--element-spacing);
            max-width:550px;
            text-align:center;
        }
        .article-body > aside.shopping-links > a.the-button{
            background-color:var(--main-color);
            color:#fff;
            display:inline-block;
            padding:var(--element-spacing-smaller) var(--element-spacing);
            -webkit-transition: all var(--default-transition-speed) ease-in-out;
            -moz-transition: all var(--default-transition-speed) ease-in-out;
            -ms-transition: all var(--default-transition-speed) ease-in-out;
            -o-transition: all var(--default-transition-speed) ease-in-out;
            transition: all var(--default-transition-speed) ease-in-out;
        }
            .article-body > aside.shopping-links > a.the-button:hover{
                background-color:var(--main-color-hover);
            }
.news-post .gameinfo{
    display:flex;
    flex-direction:row;
}
    .news-post .gameinfo .thumbnail-ads{flex:0 0 170px}
        .news-post .gameinfo .box{margin-bottom:var(--element-spacing)}
    .news-post .gameinfo .meta{
        flex-grow:1;
        padding:0 1rem 1rem;
    }
        .news-post .gameinfo .meta ul{
            display:block;
            list-style:none;
            margin-bottom:var(--element-spacing);
        }
            .news-post .gameinfo .meta ul li{
                display:flex;
                line-height:1.4;
                padding-bottom:1rem;
            }
                .news-post .gameinfo .meta ul li span{
                    font-weight:bold;
                    flex:0 0 90px;
                    margin-right:1rem;
                }
    .news-post .gameinfo .sponsoring-mpu{flex:0 0 300px}
    .news-post .gameinfo .review{
        align-items:center;
        background-color:var(--secondary-color);
        color:#fff;
        display:flex;
        flex-direction:row;
        flex-wrap:wrap;
        margin-bottom:var(--element-spacing);
        padding:var(--element-spacing);
        width:100%;
    }
        .news-post .gameinfo .review .score{height:50%}
            .news-post .gameinfo .review .score .value{
                background:#fff;
                color:#fff;
                display:block;
                font-size:2rem;
                font-weight:bold;
                margin-right:1rem;
                padding:1rem;
                text-align:center;
                transition:all var(--default-transition-speed) ease-in-out;
            }
                .news-post .gameinfo .review:hover .score .value{
                    transform:scale(1.1);
                }

        .news-post .gameinfo .review .permalink{height:50%}
.article-body .twitter-tweet{
    margin:0 auto;
}
@media (max-width:1080px){
    .row-container-smaller.article-body{
        padding:var(--element-spacing-medium);
    }
}
@media (max-width:778px){
    .news-post .gameinfo{
        flex-wrap: wrap;
    }
    .news-post .gameinfo div{
        flex: 0 0 100% !important;
    }
}
@media (max-width:560px){
    .article-body > span#post-meta > span:last-of-type::after{
        content:" ";
        display:block;
    }
    .article-body > span#post-meta > i.fa:last-of-type{margin-left:0;}
}
/* --------------------------------------------------
| Releasecalendar
-------------------------------------------------- */
#releasecalendar-wrapper{
    display:flex;
    flex-direction:row;
    margin-bottom:var(--element-spacing-bigger);
    flex-wrap:nowrap;
    position:relative;
    width:100%;
}
    #releasecalendar-wrapper .releasecalendar-range{
        display:block;
        flex:0 0 250px;
        width:100%;
    }
        #releasecalendar-wrapper .releasecalendar-range.releasecalendar-item--range{
            height:100%;
        }
        #releasecalendar-wrapper .releasecalendar-range .releasecalendar-range-box{
            color:#fff;
            font-size:3rem;
            font-weight:bold;
            height:250px;
            padding:var(--element-spacing);
            position:relative;
        }
        #releasecalendar-wrapper .releasecalendar-range .releasecalendar-range-box span{
            display:block;
        }
    #releasecalendar-wrapper .releasecalendar-list{
        display:block;
        display:flex;
        flex-direction:row;
        flex-wrap:wrap;
        flex-grow:1;
        width:auto;
    }
        #releasecalendar-wrapper li{
            display:block;
            height:250px;
            margin:0 0 var(--element-spacing-smaller) var(--element-spacing-smaller);
            position:relative;
            width:250px;
        }
            #releasecalendar-wrapper li.no-items{
                width: 100%;
            }
        #releasecalendar-wrapper li article{
            display:block;
            display:flex;
            height:100%;
            flex-direction:column;
            position:relative;
            width:100%;
        }
            #releasecalendar-wrapper li article a.box{
                align-content: space-around;
                display:block;
                display:flex;
                flex-direction:column;
                justify-content: space-between;
                height:100%;
                padding:var(--element-spacing);
                position: relative;
                transition:all var(--default-transition-speed) ease-in-out;
                width:100%;
            }
                #releasecalendar-wrapper li article a.box img.releasecalendar-item-image{
                    height:100%;
                    left:0;
                    position:absolute;
                    top:0;
                    width:100%;
                    z-index:1;
                }
                #releasecalendar-wrapper li article a.box::after{
                    background: #021B79;  /* fallback for old browsers */
                    background: -webkit-linear-gradient(to right, #021B79, #8400ff);  /* Chrome 10-25, Safari 5.1-6 */
                    background: linear-gradient(to right, #021B79, #8400ff); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
                    content:" ";
                    display:block;
                    height:100%;
                    left:0;
                    opacity:0;
                    position:absolute;
                    top:0;
                    transition:all var(--default-transition-speed);
                    width:100%;
                    z-index:2;
                }
                    #releasecalendar-wrapper li article a.box:hover::after{
                        opacity:0.4;
                    }
                #releasecalendar-wrapper li article a.box p.meta{
                    color:var(--white);
                    position:relative;
                    z-index:3;
                }
                    #releasecalendar-wrapper li article a.box p.meta span.full{
                        font-size:3.8rem;
                        line-height:1.1;
                    }
                    #releasecalendar-wrapper li article a.box p.meta span.short{
                        font-size:3.8rem;
                    }
                #releasecalendar-wrapper li article a.box h3.title{
                    color:var(--white);
                    font-size:3rem;
                    line-height:1.2;
                    margin-bottom:0;
                    position:relative;
                    z-index:3;
                }
        #releasecalendar-wrapper li h2.no-games{
            font-size:3.8rem;
            font-weight:bold;
        }
#releasecalendar-navigation{
    display:block;
    flex:0 0 100%;
    margin-bottom:var(--element-spacing-bigger);
    text-align:center;
    width:100%;
}
    #releasecalendar-navigation .title{
        text-align:center;
    }
#game-release-month,
#game-release-year{
    display:none;
}
#game-release-month-navigation,
#game-release-year-navigation{
}
.psi-selectbox{
    background-color:var(--alternate-color);
    color:#fff;
    cursor:pointer;
    display:inline-block;
    font-weight:bold;
    padding:var(--element-spacing);
    position:relative;
    transition:all var(--default-transition-speed) ease-in-out;
}
    .psi-selectbox:hover{
        background-color:var(--link-color);
    }
    .psi-selectbox ul{
        display:none;
        position:absolute;
        top:-100%;
        left:0;
        z-index:99;
    }
        .psi-selectbox:hover ul{
            display:block;
        }
        .psi-selectbox ul li{
            background-color:var(--alternate-color);
            list-style:none;
            padding:var(--element-spacing-smaller);
            transition:all var(--default-transition-speed) ease-in-out;
        }
            .psi-selectbox ul li:hover{
                background-color:var(--link-color);
            }
@media (max-width:1366px){
    #releasecalendar-wrapper .releasecalendar-range{flex:0 0 200px}
    #releasecalendar-wrapper .releasecalendar-range .releasecalendar-range-box,
    #releasecalendar-wrapper li article a.box h3.title{
        font-size:2.2rem;
        line-height:1.4}
    #releasecalendar-wrapper li{
        height:200px;
        width:200px;
    }
}

/* --------------------------------------------------
| Releases yearly
-------------------------------------------------- */
.releases-yearly-wrapper{
    margin-bottom:var(--element-spacing-smaller)
}
.releases-yearly-month{
    background-color:var(--main-color-hover);
    color:#fff;
    margin-top:var(--element-spacing-medium);
    padding:var(--element-spacing-smaller);
    text-transform: uppercase;
}
    .releases-yearly-month i.fas{
        font-weight:normal
    }

.releases-yearly-item{
    align-items:center;
    display:flex;
    font-size:1.8rem;
    margin-bottom:var(--element-spacing-medium);
}
    .releases-yearly-item > h1.title{
        font-size:1.8rem;
        flex-grow:1;
        margin:0 var(--element-spacing-smaller) 0 0;
    }
    .releases-yearly-item > div.date{
        min-width:90px;
    }
    .releases-yearly-item > h1.title,
    .releases-yearly-item > div.date,
    .releases-yearly-item > div.options{
        margin:0 var(--element-spacing-smaller) 0 0;
    }

/* --------------------------------------------------
| Game post
-------------------------------------------------- */
.game-post > h1.title{
    font-size:4.4rem;
    text-align:center;
}
#game-info-article{
    color:#fff;
    display:flex;
    flex-direction:row;
    flex-wrap:nowrap;
    padding:var(--element-spacing-bigger);
}
    #game-info-article > .thumbnail-ads{
        flex:0 0 170px;
    }
        #game-info-article > .thumbnail-ads > .thumbnail{
            margin-bottom:var(--element-spacing)
        }
            #game-info-article > .thumbnail-ads > .thumbnail >  a > img{
            }
    #game-info-article > .meta{
        flex-grow:1;
        padding:0 var(--element-spacing) 1rem;
    }
        #game-info-article > .meta a{
            color:#fff;
        }
        #game-info-article > .meta ul{
            display:block;
            list-style:none;
            margin-bottom:var(--element-spacing);
        }
            #game-info-article > .meta ul li{
                display:flex;
                line-height:1.4;
                padding-bottom:1rem;
            }
                #game-info-article > .meta ul li span{
                    font-weight:bold;
                    flex:0 0 90px;
                    margin-right:1rem;
                }
    #game-info-article > .sponsoring-mpu{
        flex:0 0 300px
    }
@media (max-width:780px){
    #game-info-article{
        flex-wrap:wrap;
    }
    #game-info-article > .thumbnail-ads,
    #game-info-article > .meta{
        flex:0 0 50%;
    }
    #game-info-article > .sponsoring-mpu{
        flex:0 0 100%;
    }
}
/* --------------------------------------------------
| Author info
-------------------------------------------------- */
#author-info{
    display:flex;
    flex-wrap:nowrap;
    flex-direction:row;
    margin-bottom:var(--element-spacing-bigger);
    padding:var(--element-spacing);
    color:#fff;
}
    #author-info > .author-avatar{
        flex:0 0 150px;
    }
    #author-info > .author-description{
        line-height:1.3;
        padding-left:var(--element-spacing-medium);
    }
/* --------------------------------------------------
| Comments
-------------------------------------------------- */
#the-comments > #news-comments > h1.section-title{
    font-size:3rem;
}
section.article-comment-list{
    list-style:none;
    margin:0;
}
    article.comment{
        border-left:var(--element-spacing-smaller) solid var(--main-color);
        display:flex;
        flex-direction:row;
        margin-bottom:var(--element-spacing);
        padding-bottom:var(--element-spacing);
        padding-left:var(--element-spacing);
        padding-top:var(--element-spacing-smaller);
    }
        article.comment > div.comment-author{
            margin-right:var(--element-spacing);
            flex:0 0 100px;
        }
        article.comment > div.comment-details{
            flex-grow:1;
        }
            article.comment > div.comment-details > header{
                margin-bottom:var(--element-spacing-smaller);
            }
                article.comment > div.comment-details > header > span.author{
                    color:#000;
                    font-size:2rem;
                    font-weight:bold;
                }
            article > div.comment-details > div.comment-content{}
                article.comment > div.comment-details > div.comment-content > p{
                    font-size:1.5rem;
                    line-height:2.2rem;
                    margin-bottom:1rem;
                }
                    article.comment > div.comment-details > div.comment-content > p:last-of-type{
                        margin-bottom:0;
                    }
            article.comment > div.comment-details > footer > span.comment-date{
                font-size:1rem;
            }
            article.comment > div.comment-details > footer > div.reply{
                margin-top:var(--element-spacing);
                text-align:right;
            }
                article.comment > div.comment-details > footer > div.reply > a.comment-reply-link,
                article.comment > div.comment-details > footer > div.reply > a.comment-reply-login{
                    background-color:var(--main-color);
                    color:#fff;
                    display:inline-block;
                    font-size:1.3rem;
                    padding:0.7rem;
                    text-align:center;
                    text-transform:uppercase;
                    transition:all var(--default-transition-speed) ease-in-out;
                }
                    article.comment > div.comment-details > footer > div.reply > a.comment-reply-link:hover,
                    article.comment > div.comment-details > footer > div.reply > a.comment-reply-login:hover{
                        background-color:var(--link-color);
                    }
    section.article-comment-list > ul.children{
        margin-top:-2rem;
    }
    section.article-comment-list ul.children{
        padding-left:var(--element-spacing-bigger);
    }
    section.article-comment-list > article.comment{border-left:var(--element-spacing-smaller) solid var(--main-color)}
        section.article-comment-list > ul.children > article.comment{border-left:var(--element-spacing-smaller) solid var(--orange)}
            section.article-comment-list > ul.children > ul.children > article.comment{border-left:var(--element-spacing-smaller) solid var(--alternate-color-hover)}
#commentform #comment{
    border:3px solid var(--main-color);
    font-family:var(--font-family);
    margin-bottom:var(--element-spacing-smaller);
    padding:var(--element-spacing);
    transition:all var(--default-transition-speed) ease-in-out;
    width:100%;
}
    #commentform #comment:focus{
        border:3px solid var(--link-color);
    }
    #cancel-comment-reply-link,
    #commentform #comment-submit{
        background-color:var(--main-color);
        border:0;
        color:var(--white);
        cursor:pointer;
        display:inline-block;
        font-size:1.3rem;
        font-weight:bold;
        margin-bottom:var(--element-spacing-smaller);
        padding:var(--element-spacing-smaller) var(--element-spacing);
        text-transform:uppercase;
        transition:all var(--default-transition-speed) ease-in-out;
    }
        #cancel-comment-reply-link:hover,
        #commentform #comment-submit:hover{
            background-color:var(--link-color);
        }
@media (max-width:1080px){
    #the-comments{
        padding-left: var(--element-spacing-bigger);
        padding-right: var(--element-spacing-bigger);
    }
}
@media (max-width:799px){
    #the-comments{
        padding-left: var(--element-spacing-bigger);
        padding-right: var(--element-spacing-bigger);
    }
}
@media (max-width:560px){
    section.article-comment-list ul.children{
        border-left:5px solid var(--main-color);
        padding-left:0;
    }
    article.comment > div.comment-author{
        flex:0 0 50px;
    }
    #the-comments{
        padding-left:var(--element-spacing-medium);
        padding-right:var(--element-spacing-medium);
    }
}
/* --------------------------------------------------
| Game page
-------------------------------------------------- */
#game-page-header{
    padding:var(--element-spacing);
}
/* --------------------------------------------------
| Login page
-------------------------------------------------- */
body.page-id-248064 h1.title{
    margin-bottom:var(--element-spacing-bigger);
    text-align:center;
}
#login-page-wrapper{
    margin:0 auto;
    max-width:450px;
}
    #login-page-wrapper .tml-login .tml-submit-wrap{
        text-align:left;
    }
    #login-page-wrapper input[type=submit]{
        background-color:var(--main-color);
        border:0;
        color:#fff;
        cursor:pointer;
        font-weight:bold;
        outline:none;
        padding:var(--element-spacing-smaller);
        text-transform:uppercase;
        transition:all 250ms ease-in-out;
    }
        #login-page-wrapper input[type=submit]:hover,
        #login-page-wrapper input[type=submit]:focus{
            background-color:var(--main-color-hover);
        }
#login-page-wrapper .wp-social-login-connect-with, #login-box h4{
    color:#000;
    text-align:center;
}
#login-page-wrapper .wp-social-login-widget{
    margin-top:var(--element-spacing-bigger);
}
#login-page-wrapper .wp-social-login-provider-list{
    text-align: center;
}
#login-page-wrapper .legal-link{
    display:block;
    text-align:center;
}
@media (max-width:768px){}
/* --------------------------------------------------
| Register page
-------------------------------------------------- */
#register-page .wp-social-login-widget{
    margin-top:var(--element-spacing);
    flex:0 0 100%;
}
#signup_form{
    display:flex;
    flex-direction:row;
    flex-wrap:wrap;
}
    #signup_form div.register-section{
        float:none !important;
        padding:var(--element-spacing-smaller)
    }
#buddypress .standard-form#signup_form div.submit{
    float: none;
}
#register-page .wp-social-login-connect-with{
    color: #000;
}
#register-page .wp-social-login-connect-with::before{
    content:"";
    display:none !important;
}
@media (max-width:1000px){
    #signup_form div.register-section{
        flex:0 0 100%;
    }
}
/* --------------------------------------------------
| 404
-------------------------------------------------- */
.title--404{
font-size:3rem !important;
}
/* --------------------------------------------------
| Footer
-------------------------------------------------- */
#footer{
    color:#fff;
    margin-bottom:0;
    padding:4rem var(--element-spacing);
}
    #footer a{color:#fff}
    #footer i.fab{
        margin-right:5px;
    }
    #footer > .row{
        display:flex;
        flex-direction:row;
        flex-wrap:nowrap;
    }
        #footer > .row > .block{flex:1 0 25%}
        #footer > .row > .block > ul{
            margin-left:0;
        }
            #footer > .row > .block > ul > li{
                list-style:none;
                padding-bottom:1rem;
            }
                #footer > .row > .block > ul > li > a{
                    font-size:1.5rem;
                    transition:all var(--default-transition-speed) ease-in-out;
                }
                    #footer > .row > .block > ul > li > a:hover{text-decoration:underline !important;)}
        #footer > .row > .block > h3.title{text-transform:uppercase}
    #footer > .logo{
        margin-top:1rem;
        text-align:center
    }
        #footer > .logo .copyright {
            display:block;
            font-size:1.3rem;
            margin:1rem auto 0;
        }
@media (max-width:800px){
    #footer > .logo{
        text-align:left;
    }
    #footer > .row{
        flex-wrap:wrap;
        justify-content:center;
    }
        #footer > .row > .block{
            flex:0 0 50%
        }
}
@media (max-width:480px){
    #footer > .row > .block{
        flex:0 0 100%;
        margin-bottom:3rem;
    }
}
/* --------------------------------------------------
| Pagination
-------------------------------------------------- */
.pagination-wrapper{
    margin:var(--element-spacing-bigger) auto var(--element-spacing-bigger);
    text-align:center;
}
    .pagination{font-size:0}
        .pagination > span,
        .pagination > a{
            background-color:var(--main-color);
            color:#fff !important;
            display:inline-block;
            font-size:16px;
            padding:1.5rem;
            transition:all var(--default-transition-speed) ease-in-out;
        }
            .pagination > a:hover{
                background-color:var(--link-color);
            }
        .pagination > span{
            background-color:var(--main-color-hover);
        }
@media (max-width:560px){
    .pagination-wrapper{
        background-color:var(--main-color-hover);
        padding-bottom:var(--element-spacing-smaller);
        padding-top:var(--element-spacing-smaller);
    }
    .pagination > span.label{
        display:block;
    }
    .pagination > span.current{
        display:inline-block;
    }
}

.flex-message-container{
    align-items:center;
    align-content:center;
    color:#fff;
    display:flex;
    flex-direction:column;
    height:100vh;
    justify-content:center;
    position:absolute;
    top:0;
    left:0;
    width:100vw;
}
    .flex-message-container > .inner-container{
        max-width:575px;
    }
        .flex-message-container > .inner-container > .lp-logo{
            display:block;
            height:auto;
            margin:0 auto var(--element-spacing-medium);
            max-width:50vw;
            width:300px;
        }
        .flex-message-container > .inner-container > p{
            display:block;
            line-height:1.6;
            margin-bottom:var(--element-spacing-smaller);
            text-align:center;
        }
#particles-js{
    background:#333;
    height:100vh;
    position:relative;
    width:100vw;
}
    #particles-js > .legal{
        bottom:10px;
        color:#ccc;
        font-size:11px;
        margin-top:40px;
        right:10px;
        text-align:center;
        position:absolute;
    }
        #particles-js > .legal > a{
            color:#ccc;
            text-decoration:none;
            text-transform:uppercase;
        }

