/* -------------------------------------------- */
/* The Virtual Brain: Website */
/* Version: 1.7 */
/* -------------------------------------------- */
/* Created by @twotribes, Germany */
/* -------------------------------------------- */
/* Browser Scope: ALL */
/* StyleSheet Scope: STAGE SETUP */
/* !-------------------------------------------- */

/* !-------------------------------------------- */
/* !Color dictionary */
/* !-------------------------------------------- */
/*
    
type
#313d43

home 
BASE #2d86b1 rgb(45,134,177) 
DARK #184343 rgb(24,67,67) 
ACCENT #2566aa rgb(37,102,170)

neuroscience 
BASE #43a13d rgb(67,161,61) 
DARK #22511f rgb(34,81,31) 
ACCENT #cd4422 rgb(205,68,34)

brainsimulator 
BASE #662d91 rgb(102,45,145) 
DARK #3b1d4d rgb(59,29,77) 
ACCENT #627986 rgb(98,121,134)

newswire 
BASE #624426 rgb(98,68,38) 
DARK #312213 rgb(49,34,19) 
ACCENT #e48120 rgb(228,129,32)

teamwork 
BASE #9c132c rgb(156,19,44) 
DARK #4e0a16 rgb(78,10,22) 
ACCENT #1e6158 rgb(30,97,88)
*/

/* !-------------------------------------------- */
/* !STAGE: General layout */
/* !-------------------------------------------- */

.actorgroup, 
.actor {
position: absolute;
left: 0;
overflow: hidden;
width: 100%;
}

/* !-------------------------------------------- */
/* !STAGE: Initial settings (for inside pages) */
/* !VIEWPORT: Desktop, iPad Landscape */
/* !-------------------------------------------- */

/* --- Main navigation */
.stage #actor-nav-main {
    top: 0;
    height: 140px;
    width: 1280px;
    left: calc((100% - 1280px) / 2);
    -webkit-transition: height 0.5s ease;
    transition: height 0.5s ease;
}

.stage #actor-nav-main.expression-minimal {
    height: 50px;
    -webkit-transition: height 0.5s ease;
    transition: height 0.5s ease;
}

/* --- Content actors */
.stage #actorgroup-section {
    top: 140px;
    bottom: 0;
    border: 20px solid #000;
    width: 1280px;
    left: calc((100% - 1280px) / 2);
    overflow: visible;
    -webkit-transition: top 0.5s ease;
    transition: top 0.5s ease;
}

.stage #actor-nav-main.expression-minimal ~ #actorgroup-section {
    top: 50px;
    -webkit-transition: top 0.5s ease;
    transition: top 0.5s ease;
}

.stage-neuroscience #actorgroup-section {
    border-color: #43a13d;
}
.stage-brainsimulator #actorgroup-section {
    border-color: #662d91;
}
.stage-newswire #actorgroup-section {
    border-color: #624426;
}
.stage-teamwork #actorgroup-section {
    border-color: #9c132c;
}

.stage #actor-nav-sub {
    width: 230px;
    height: 100%;
    left: -20px;
}

.stage #actorgroup-section .actor-main {
    left: 210px;
    right: 0;
    width: calc(100% - 210px);
    height: 100%;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
}

/* --- Overlay actors */
.stage #actorgroup-section .actor-overlay {
    z-index: 50;
    overflow: hidden;
}

/* !-------------------------------------------- */
/* !COMPONENT: Triangle cover for actor heads */
/* !-------------------------------------------- */

/* --- General placement for all actors with cover images */
.stage .actor-main .actor-head:before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 285px;
    height: 162px;
    background: transparent 0 0 no-repeat;
    z-index: 2;
}

.stage-home .actor-main .actor-head:before {
    display: none;
}

.stage-neuroscience .actor-main .actor-head:before {
    background-image: url("./img/back_nav_triangle_neuroscience.svg");
}
.stage-brainsimulator .actor-main .actor-head:before {
    background-image: url("./img/back_nav_triangle_brainsimulator.svg");
}
.stage-newswire .actor-main .actor-head:before {
    background-image: url("./img/back_nav_triangle_newswire.svg");
}
.stage-teamwork .actor-main .actor-head:before {
    background-image: url("./img/back_nav_triangle_teamwork.svg");
}

/* Special placements necessary in actors.css for Teamwork/Leaders and Newswire/Blog */


/* !-------------------------------------------- */
/* !STAGE: Homepage */
/* !VIEWPORT: Desktop, iPad Landscape */
/* !-------------------------------------------- */

/* --- Content actors */
.stage-home #actorgroup-home {
    top: 140px;
    bottom: 0;
    overflow: auto;
    width: 1300px; /* leave 20px extra room for permanent scrollbars on some OSes */
    left: calc((100% - 1280px) / 2);
    -webkit-overflow-scrolling: touch;
}

.stage-home #actor-nav-main.expression-minimal ~ #actorgroup-home {
    top: 50px;
    -webkit-transition: top 0.5s ease;
    transition: top 0.5s ease;
}

.stage-home #actorgroup-home .actor {
    position: relative;
}

.stage-home #actor-download-banner {
    height: 140px;
    width: 1280px;
}

.stage-home #actor-home-images {
    height: 245px;
    width: 1280px;
    -webkit-transition: height 0.5s ease;
    transition: height 0.5s ease;
}

.stage-home #actor-home-images.expression-player {
    height: 480px;
    width: 1280px;
    -webkit-transition: height 0.5s ease;
    transition: height 0.5s ease;
}