/* meetBRAINS stylesheet
 *
 * (c) 2013 meetBRAINS
 */

/* color scheme:
 *
 * pages #59c ( 80,144,192)
 * intro #6ab ( 96,160,176)
 * bkgnd #8dd (128,208,208) in PNG (changed to gray now)
 *
 */
                                    
.english {
}
.dutch {
    display: none;
}

.menutext {
}
.address {
}
.overlay-wrapper {
}
.overlay-content {
}

html {
	font-size: 16px;
	overflow-y: scroll;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
}

body {
	margin: 0;
	font: 16px 'Abel', 'Helvetica Neue', Helvetica, Arial, sans-serif;
	color: Black;
	background: White;
	padding: 0;
}
[hidden] {
    display: none;
}
::-moz-selection {
	background: Black;
	color: White;
	text-shadow: none;
}
::selection {
	background: Black;
	color: White;
	text-shadow: none;
}
a, a:visited {
	color: DarkViolet; /* Black; */
	text-decoration: none;
}
a:hover {
	text-decoration: none;
	color: Black;
	border-bottom: 1px solid #0da4d3;
}
a:focus {
    outline: none;
}
a:hover, a:active {
    outline: 0;
}
a, a img, .featured-post .byline {
	-webkit-transition: all 0.18s ease-out;
	-moz-transition: all 0.18s ease-out;
	-ms-transition: all 0.18s ease-out;
	-o-transition: all 0.18s ease-out;
	transition: all 0.18s ease-out;
}

ul {
  color: Black;
  margin-left: 16px;
  padding-left: 0;
}
li {
  color: Black;
  margin: 0;
  padding: 0;
}

#nomargin {
    padding: 5px 5px 5px 5px;
	list-style: circle;
	margin: 0 0 0 0;
	padding: 0;
}

/* Main Wide Layout */

.container {
	font-family: 'Text Me One', sans-serif;
	font-weight: normal;
	font-style:  normal;
	font-size:   16px;
    line-height: 16px;
}

.container-size {
	position: relative; /* divides free space left and right equally */
	margin: 0 auto;
	max-width: 940px;
}

#boxes {
    font-size: 16px;
    display:   block;
    position:  absolute;
    left:         5px;
    top:          5px;
    width:      940px;
    height:     660px;
}

#box-logo {
    position:  absolute;
    left:         5px;
    top:          5px;
    width:      460px;
    height:      96px;
}

#box-control {
    position:  absolute;
    left:       475px;
    top:          5px;
    width:      460px;
    height:     110px;
}

#box-slideshow {
    position:  absolute;
    left:         5px;
    top:        115px;
    width:      930px;
    height:     155px;
}

#box-menu {
    position:  absolute;
    left:         5px;
    top:        280px;
    width:      460px;
    height:      25px;
}

#box-text {
    position:  absolute;
    background-image:url('pictures/LogoPattern-60x40-gray.png');
    left:         5px;
    top:        310px;
    width:      930px;
    height:     340px;
}

/* uncomment for visible layout borders */
/*
.bg-box-prifoot              { background-color: yellow; }
.bg-box-secfoot              { background-color: yellow; }
.bg-info-wrapper-leftheader  { background-color: green;  }
.bg-info-wrapper-rightheader { background-color: green;  }
.bg-info-wrapper-left        { background-color: blue;   }
.bg-info-wrapper-right       { background-color: blue;   }
*/

.box-prifoot {
    position:  absolute;
    left:        15px;
    top:        615px;
    width:      450px;
    height:      25px;
}

.box-secfoot {
    position:  absolute;
    left:       475px;
    top:        615px;
    width:      450px;
    height:      25px;
}

/* End Main Layout */

/* Text Layout */

.info-wrapper-leftheader {
    font-weight: normal;
    color: white;
    position: absolute;
    left:   10px;
    top:    10px;
    width: 440px;
    height: 40px;
}

.info-wrapper-rightheader {
    font-weight: normal;
    color: white;
    position: absolute;
    left:  470px;
    top:    10px;
    width: 440px;
    height: 40px;
}

.info-wrapper-left {
    font-weight: normal;
    color: white;
    position: absolute;
    left:    10px;
    top:     60px;
    width:  440px;
    height: 270px;
}

.info-wrapper-right {
    font-weight: normal;
    color: white;
    position: absolute;
    left:   470px;
    top:     60px;
    width:  440px;
    height: 270px;
}

.bg-intro-header, .bg-intro-footer, .bg-intro-left, .bg-intro-right {
    background-color: #6ab;
}

.intro-header {
    font-size: 21px;
    position: absolute;
    padding: 5px 5px 5px 5px;
    top:    10px;
    left:   10px;
    width: 440px;
    height: 40px;
}

.intro-left {
    position: absolute;
    padding: 5px 5px 5px 5px;
    top:    70px;
    left:   10px;
    width: 440px;
    height:170px;
}

.intro-right {
    position: absolute;
    padding: 5px 5px 5px 5px;
    top:    10px;
    left:  470px;
    width: 440px;
    height:280px;
}

.intro-footer {
    position: absolute;
    padding: 5px 5px 5px 5px;
    top:   260px;
    left:   10px;
    width: 440px;
    height: 30px;
}

/* End Text Layout */

#footer p {
    margin-bottom: 0;
}

.footer-content a:hover {
    color: DarkViolet;
    border-bottom: none;
}

.footer-content {
	font-size: 14px;
	margin-top: 5px; /* check use */
    word-spacing: -2px; /* make footer fit */
	color: Black;
}

.brand {
	font-size: 50px;
    position: absolute;
    left:  0px;
    top:  30px;
	font-family: 'Text Me One', sans-serif;
	font-style: normal;
    font-weight: normal;
    line-height: 16px;
    padding: 10px 10px 0px 8px; /* 10px; */
    float: left;
}

.tagline.dutch {
    font-size: 17px;
    word-spacing: 8px;
    padding: 0px 10px 10px 10px;
    position: absolute;
    left: 0px;
    top: 79px;
}

.tagline.english {
    font-size: 17px;
    word-spacing: -5px;
    padding: 0px 10px 10px 10px;
    position: absolute;
    left: 0px;
    top: 79px;
}

.brand a {
    border-bottom: none;
}
#leftword {
    color: Black;
}
#rightword {
    color: DarkViolet;
}
#brandlogo {
    color: DarkViolet;
	font-family: 'Ribeye Marrow', sans-serif;
}

b {
    color: Black;
    /* font-style: lighter; */
}

.text-menu-item a {
    font-size: 19px;
    position: absolute;
    top:  0px;
    left: 0px;
    padding: 5px 5px 10px 5px;
}

.text-menu-item a:hover, a.selected-text-menu {
    position: absolute;
    top:  0px;
    left: 0px;
    padding: 5px 5px 10px 5px;
    background-color: #59c;
	border-bottom: none;
}

.overlay {
    position: absolute;
    top:       0px;
    left:     10px;
    width:   210px;
    height:  300px;
    z-index:  50;
    background-color: #6ab;
	filter: alpha(opacity=80);
	opacity: 0.8;
}

.overlay-title {
    font-size: 21px;
    position: absolute;
    top:       0px;
    left:     10px;
    width:   200px;
    height:  300px;
    z-index: 100;
    color: White;
    padding: 5px 5px 10px 5px;
}

.overlay-text {
	font: 18px 'Abel', 'Helvetica Neue', Helvetica, Arial, sans-serif;
    position: absolute;
    top:      30px;
    left:     10px;
    width:   200px;
    height:  270px;
    z-index: 100;
    color: White;
    padding: 5px 5px 10px 5px;
}
.overlay-text p {
        margin: 5px 0 5px 0;
}

.buttons a {
    padding-top: 10px;
    color: black;
}

.hidebutton {
    display: none;
}

.hideoverlaytext {
    display: none;
}
.picture-menu ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.text-menu ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.english #text-menu-item-1 {
    position: absolute;
    left: 10px;
    top:   0px;
    /* width: 30px; */
}
.english #text-menu-item-2 {
    position: absolute;
    left: 69px;
    top:   0px;
}
.english #text-menu-item-3 {
	position: absolute;
    left: 119px;
    top:    0px;
}
.english #text-menu-item-4 {
    position: absolute;
    left: 212px;
    top:    0px;
}
.english #text-menu-item-5 {
    position: absolute;
    left: 270px;
    top:    0px;
}
.english #text-menu-item-6 {
    position: absolute;
    left: 347px;
    top:    0px;
}

.dutch #text-menu-item-1 {
    position: absolute;
    left: 10px;
    top:   0px;
}
.dutch #text-menu-item-2 {
    position: absolute;
    left: 49px;
    top:   0px;
}
.dutch #text-menu-item-3 {
    position: absolute;
    left: 99px;
    top:   0px;
}
.dutch #text-menu-item-4 {
    position: absolute;
    left: 168px;
    top:    0px;
}
.dutch #text-menu-item-5 {
    position: absolute;
    left: 244px;
    top:    0px;
}
.dutch #text-menu-item-6 {
    position: absolute;
    left: 326px;
    top:    0px;
}

.toggle-menu {
    display:none;
    background-color:#59c;
    position: absolute;
    left:    0px;
    top:     0px;
    width: 930px;
    height:340px; /* 300 */
    z-index: 10;
}

#expand-text {
	font-family: 'Abel', 'Helvetica Neue', Helvetica, Arial, sans-serif;
    font-size:   18px;
	line-height: 21px;
}

#expand-text a:hover {
    border-color: White;
}

.intro {
}
.intro p {
        margin: 5px 0 5px 0;
}

.intro-text {
    color: white;
	font-family: 'Abel', 'Helvetica Neue', Helvetica, Arial, sans-serif;
    font-size:   18px; /* iso 19 */
	line-height: 21px;
}

.intro-header-text {
    color: white;
	font-family: 'Text Me One', sans-serif;
    font-size:   22px;
    line-height: 40px;
}

#ldquo {
    font-size: 24px;
    color: LightGrey;
}
#rdquo {
    font-size: 24px;
    color: LightGrey;
}
#bullit {
    color: DarkViolet;
	font-family: 'Ribeye Marrow', sans-serif;
}
.plaintext p {
        margin: 5px 0 5px 0;
}
.close {
    position: absolute;
    top:    5px;
    left: 915px;
    z-index: 100;
}

.nextmenu {
    position: absolute;
    top:  155px; /* 315 */
    left: 915px;
    z-index: 100;
}

.largecapital {
    padding: 0px 15px 5px 5px;
    font-size: 36px; /* 24 */
	font-family: 'Text Me One', sans-serif;
    /* font-style: italic; */
    float: left;
    margin-top: 5px;
}

/*
.header-text {
   padding: 0px 15px 5px 5px;
	font-family: 'Abel', 'Helvetica Neue', Helvetica, Arial, sans-serif;
    font-size: 16px;
    font-style: normal;
    margin-top: 0px;
    float: left;
}}
*/

img.float-left {
    float: left;
    margin-top: 10px;
    margin-right: 10px;
}
img.float-right {
    float: right;
    margin-top: 10px;
    margin-left: 10px;
}
.newline {
    clear: left;
}

/* Picture Navigation */

#nav li {
    list-style: none;
}
#button li {
    list-style: none;
}

#button a:hover {
    color: white;
	border-bottom: none;
}

.activeSlide a {
	filter: alpha(opacity=30);
	opacity: 0.3;
}

#nav a:hover {
	filter: alpha(opacity=60);
	opacity: 0.6;
	border-bottom: none;
}

#nav a:focus {
    outline: none;
}

.control-container {
    position: absolute;
    top:     50px;
    left:   101px;
    width:  359px;
    height:  47px;
}

.topmenu-position {
    position: absolute;
    top:     20px;
    left:   101px;
    width:  359px;
    height:  76px;
}

.topmenu-background {
    background-image:url('pictures/LogoPattern-60x40-gray.png');
    z-index: -100;
}

.topmenu-container {
}

.topmenu-items {
    position: absolute;
    top:     10px; /* 4 */
    left:    10px;
    width:  339px;
    height:  26px;
    text-align: right;
    z-index: 100;
	color: Black;
}

.topmenu-items a:hover {
    color: DarkViolet;
    border-bottom: none;
}

.buttons-position {
    position: absolute;
    top:      5px;
    left:   213px; /* 325-112 */
    width:  134px;
    height:  37px;
}

.buttons {
}

/* ButtonStripFull-32x40.png
    nr function  T   R  B   L
    0  close     1  33 32   1
    1  stop      1  74 32  41
    2  play      1 113 32  81
    3  pause     1 154 32 121
    4  close     1 193 32 161
    5  open      1 233 32 201
    6  prev      1 273 32 241
    7  next      1 313 32 281
*/

#textopen { /* picture 5 */
    position: absolute;
    top:        -8px;
    left:     -192px;
    clip:rect(11px,232px,42px,201px);
    display: none;
}

#textclose { /* picture 4 */
    position: absolute;
    top:        -8px;
    left:     -152px;
    clip:rect(11px,192px,42px,161px);
}

#prev { /* picture 6 */
    position: absolute;
    top:       -8px;
    left:    -200px;
    clip:rect(11px,272px,42px,241px);
}
#pause { /* picture 3 */ /* for picture 1, left: 32 clip r:72 l:41 */
    position: absolute;
    top:       -8px;
    left:     -48px;
    clip:rect(11px,152px,42px,121px);
}
#resume { /* picture 2 */
    position: absolute;
    top:      -8px;
    left:     -8px;
    clip:rect(11px,112px,42px,81px);
    display: none;
}
#next {
    position: absolute;
    top:       -8px;
    left:    -176px;
    clip:rect(11px,312px,42px,281px);
}

#thumb-1 {
    position: absolute;
    left:     -77px;
    top:      5px;
    clip:rect(3px,139px,34px,87px);
}
#thumb-2 {
    position: absolute;
    left:   -24px; /* 63-87 */
    top:      5px;
    clip:rect(3px,139px,34px,87px);
}
#thumb-3 {
    position: absolute;
    left:    29px; /* 116-87 */
    top:      5px;
    clip:rect(3px,139px,34px,87px);
}
#thumb-4 {
    position: absolute;
    left:    82px; /* 169-87 */
    top:      5px;
    clip:rect(3px,139px,34px,87px);
}

.linkedinlogo {
    position: absolute;
    left:   330px;
    top:    230px;
}

.person-picture, a.person-picture:hover {
    float: left;
    margin-right: 10px;
    margin-bottom: 5px;
}

/* EMail Form */

.contact-title {
	font-size:   24px;
}

.box-contact {
    position: absolute;
    left:    15px;
    top:    320px;
    display: none;
}

.box-contact-left {
    position: absolute;
    left:     0px; /* 15px;  */
    top:      0px; /* 320px; */
	width:  435px;
	height: 300px;
	padding: 10px 10px 10px 10px;
	z-index: 200;
	color: White;
	background-color: #aaa;
}

.box-contact-right {
    position: absolute;
    left:   455px; /* 470px; */
    top:      0px; /* 320px; */
	width:  435px;
	height: 300px;
	padding: 10px 10px 10px 10px;
	z-index: 200;
	color: White;
	background-color: #aaa;
}

.form-close {
    display: block;
    position: absolute;
    top:    5px;
    left: 895px; /* 440px; */
    z-index: 300;
}
#ajax-form {
}
label {
	display: block;
	height: 25px;
}
input {
	font-family: 'Abel', 'Helvetica Neue', Helvetica, Arial, sans-serif;
    font-size:   15px;
	width: 415px;
	margin-bottom: 5px;
	padding: 5px;
}
textarea {
	font-family: 'Abel', 'Helvetica Neue', Helvetica, Arial, sans-serif;
    font-size:   15px;
	width:  415px;
	height: 190px;
	/* disable resizability */
	resize: none;
	max-width: 415px;
	max-height: 200px;
	padding:  5px;
}
.err-name, .err-email, .err-emailvld, .err-subject, .err-form, .err-timedout, .err-state, .err-state-text {
	color: red;
	font-weight: bold;
	display: none;
}
.ajaxsuccess {
    color: green;
	font-weight: bold;
    display: none;
}
/*
.closeform {
    display: none;
}
*/

@media screen and (orientation:portrait) {

    .container-size {
    	position: relative;
    	margin: 0 auto;
    	max-width: 470px; /* from 940 */
    }

    .container {
    	font-family: 'Text Me One', sans-serif;
    	font-weight: normal;
    	font-style:  normal;
    	font-size:   16px;
        line-height: 16px;
    }

    .control-container {
        position: absolute;
        top:     50px;
        left:     0px; /* new */
        width:  359px;
        height:  47px;
    }

    .topmenu-position {
        position: absolute;
        top:     20px;
        left:     0px; /* new */
        width:  359px;
        height:  76px;
    }

    #boxes {
        font-size: 16px;
        display:   block;
        position:  absolute;
    }

    #box-logo {
        position:  absolute;
        left:         5px;
        top:          0px;
        width:      460px;
        height:     110px;
    }

    #box-control {
        position:  absolute;
        left:         5px; /* moved left */
        top:         90px; /* new */
        width:      460px;
        height:     110px;
    }

    #box-slideshow {
        position:  absolute;
        left:         5px;
        top:        190px; /* new */
        width:      930px; /* new */
        height:     155px; /* new */
    }

    #box-menu {
    	font-size: 16px;
        position:  absolute;
        left:         5px;
        top:        354px; /* new */
        width:      460px;
        height:      25px;
    }

    #box-text {
        position:  absolute;
        background-image:url('pictures/LogoPattern-60x40-gray.png');
        left:         5px; /* new?? */
        top:        385px; /* new */
        width:      470px; /* new */
        height:     670px; /* new */
    }

    .box-prifoot {
        position:  absolute;
        left:        20px;
        top:        990px;  /* new */
        width:      450px;
        height:      20px;
    }

    .box-secfoot {
        position:  absolute;
        left:        20px; /* new */
        top:       1015px; /* new */
        width:      450px;
        height:      25px;
    }

    /* Text Layout */

    .info-wrapper-right {
        font-size: 19px;
        font-weight: normal;
        color: white;
        position: absolute;
        left:    10px; /* new 470 */
        top:    340px; /* new 60 */
        width:  440px;
        height: 270px;
    }

    .info-wrapper-rightheader {
        font-size: 19px;
        font-weight: normal;
        color: white;
        position: absolute;
        left:   10px; /* new 470 */
        top:   620px; /* new 10 */
        width: 440px;
        height: 40px;
    }

    .intro-header {
        font-size: 21px;
        position: absolute;
        padding: 5px 5px 5px 5px;
        top:    10px;
        left:   10px;
        width: 440px;
        height: 40px;
    }

    .intro-left {
        position: absolute;
        padding: 5px 5px 5px 5px;
        top:    70px;
        left:   10px;
        width: 440px;
        height:170px;
    }

    .intro-right {
        position: absolute;
        padding: 5px 5px 5px 5px;
        top:   260px; /* 10 */
        left:   10px; /* 470 */
        width: 440px;
        height:280px;
    }

    .intro-footer {
        position: absolute;
        padding: 5px 5px 5px 5px;
        top:   560px; /* 260 */
        left:   10px;
        width: 440px;
        height: 30px;
    }

    .toggle-menu {
        display:none;
        background-color:#59c;
        position: absolute;
        left:    0px;
        top:     0px;
        width: 470px;
        height:670px; /* 595 */
        z-index: 10;
    }

    .close {
        position: absolute;
        top: 5px;
        left: 455px;
        z-index: 100;
    }

    .nextmenu {
        position: absolute;
        top:  315px;
        left: 455px;
        z-index: 100;
    }

    /* Form Layout */

    .form-close {
        display: block;
        position: absolute;
        top:    5px;
        left: 440px; /* new */
        z-index: 300;
    }
    .box-contact {
        position: absolute;
        left:    15px;
        top:    395px; /* new */
        display: none;
    }

    .box-contact-right {
        position: absolute;
        left:     0px; /* new */
        top:    300px; /* new */
    	width:  435px;
    	height: 325px; /* iso 300px now! */
    	padding: 10px 10px 10px 10px;
    	z-index: 200;
    	color: White;
    	background-color: #aaa;
    }

}