/* ==========================================================================
   Author's custom styles
   ========================================================================== */
/* * {
-webkit-user-select: none;
-webkit-touch-callout: none;        
}*/


.debug {
	color: "red";sp
	width: 100px;
	height: 100px;
}

:-moz-selection { background: rgba(0, 10, 255, 0.75); }
::selection { background:rgba(0, 10, 255, 0.75); }

html {
    -webkit-text-size-adjust: none; /* Prevent font scaling in landscape */
}
/*///////////////////////*/


@font-face {
	font-family: MaisonNeueLight;
	src: url('../fonts/MaisonNeue-Light-TRIAL.otf') format("opentype");
}

@font-face {
	font-family: MaisonNeueBold;
	src: url('../fonts/MaisonNeue-Bold-TRIAL.otf') format("opentype");
}

@font-face {
	font-family: MaisonMono;
	src: url('../fonts/MaisonMono-Light-TRIAL.otf') format("opentype");
}




.teaser {
	/*background-color:rgb(233, 233, 233);*/	
	position: relative;
	opacity: 1;
	top: 0px;
	
	transition: -webkit-transform 1s ease-out, opacity .5s ease-out;
}


.background {
	display: inline-block;
	padding: .05em .15em;
	margin-bottom: 2px;
}

.teaser .row div {
	background-image: url(../img/teaser/topgun.gif);
	background-size: 70%;
	background-repeat: no-repeat;
	background-position: center 90%;
}

* {
	box-sizing: border-box;
	text-overflow: ellipsis;
}

body {
	font-family: "MaisonNeueLight", Helvetica, Arial, Sans-Serif, sans-serif;
	font-size: 16px;
	color: #000;
	background-color: #fff;
	
	transition: background-color .7s ease-out;
}

.main-content {
	display: none;
	/*background-color: #fff;*/
	
		transition: background-color .7s ease-out;

}

a,
a:hover {
	text-decoration: none;
	color: rgba(0, 10, 255, .85);
	
	transition: color .3s ease-out;
}



h1 {
	font-size: 1.75em;
	line-height: 1.25;
	font-family: "MaisonNeueBold", Helvetica, Arial, Sans-Serif, sans-serif;
}

ul {
	padding: 0;
	list-style-type: none;
}

th {
	vertical-align:text-top;
}

.container {
	width: 100%;
	margin: 0;
	padding: 0;
	
	background-repeat: no-repeat;
	background-position: center;
}

.row {
	max-width: 1070px;
	margin-left: auto;
	margin-right: auto;
	position: relative;
}

header {
	width: 100%;
	position: fixed;
	top: 0px;
	background-color: rgba(255,255,255,.5);
	z-index: 10;
	padding-top: .5em;
	padding-bottom: .5em;
	z-index: 9999;
 
 	transition: padding .3s ease-out, margin .1s ease-out;
}

.topMargin {
	margin-top: 5em;
}

.navOpen {
		margin-top: 3em;
}

.headerBig {
	padding-bottom: 3em;
	background-color: transparent !important;
}

.line {
	text-decoration: line-through;
}

.bold {
	font-family: "MaisonNeueBold", Helvetica, Arial, Sans-Serif, sans-serif;
	font-size: 1em;
}

.info {
	font-family: 'maisonMono', helvetica, arial, monospace;
	font-size: 1em;
}

.logo {
	font-family:"MaisonNeueBold", Helvetica, Arial, Sans-Serif, sans-serif;
	font-weight: bold;
	font-size: 1.5em !important;
	padding-left: 15px;
	opacity: .95;
}

.headerBig .logo {
	font-size: 3em !important;
	line-height: .9;
	padding-top: .5em;
	font-weight: bolder;
	
	transition: padding-top .3s ease-out;
}

.headerBig .menuBtn {
	margin-top: 2em;
}


/*========= menuBtn =======*/
.menuBtn {
	transition: all .3s ease-out;
	margin-top: .5em;
	position: absolute;
	right: 45px;
	cursor: pointer;
}

.menuBtnElement {
	width: 1.85em;
	height: .25em;
	background-color: #000;
	margin-bottom: .25em;
	margin-left: 0px;
	-webkit-transform-origin: 50% 50%;
	position: relative;
	
	transition: all .6s cubic-bezier(0.980, -0.360, 0.030, 1.405);
}

.menuBtn:hover > .menuBtnElement {
	background-color: rgba(0, 10, 255, .75) !important;
}

.menuBtnCloseIcon #menuBtnElement1 {
		-webkit-transform: translateY(.5em) rotate(45deg);
		background-color: rgba(0, 10, 255, .85);
		
}
.menuBtnCloseIcon #menuBtnElement2 {
		-webkit-transform: translateX(-1em);
		opacity: 0;
}
.menuBtnCloseIcon #menuBtnElement3 {
		-webkit-transform:translateY(-.5em)rotate(-45deg);
		background-color: rgba(0, 10, 255, .85);
}


/*========= nav ==============*/

nav {
	background-color: #fff;
	color: #000;
	position: fixed;
	z-index: 200;
	overflow: hidden;
	height: 3em;
	line-height: 3em;
	font-family: "MaisonNeueLight", Helvetica, Arial, Sans-Serif, sans-serif;
	text-transform: lowercase;
	letter-spacing: .1em;
	font-size: .8em;
	
	transition: height .3s ease-out, background-color .3s ease-out;
}

nav:hover {
	background-color: #f0f0f0;
}
nav ul {
		padding-left: 0px;	
}

nav li {
	padding-left: 0px;
	cursor: pointer;
}

.navClosed {
	height: 0px !important;
}



/*========= topLink ==========*/

.topLinkContainer {
	position: fixed;
	bottom: -3em;
	z-index: 20;
	
	transition: all .7s cubic-bezier(0.980, -0.360, 0.030, 1.405);
}

.topLink:hover {
	cursor: pointer;
}

.topLink {
	text-decoration: none;
	color: #000;
	font-family: "MaisonNeueBold", Helvetica, Arial, Sans-Serif, sans-serif;
	font-size: 1em;
	line-height: 1.75em;
}

.topLinkOpen {
	bottom: 0 !important;
}

.topLinkElementContainer {
	width: 2em;
	height: 1em;
	float: left;
	margin: .5em;
}

.categorie {
	font-family: "MaisonNeueBold", Helvetica, Arial, Sans-Serif, sans-serif;
	font-weight: bold;
	float: left;
}

p {
	font-size: 1em;
}

.intro {
	padding-top: 50px;
	padding-bottom: 50px;
}

.introText {
	color: #fff;
}

.balken {
	display: inline-block;
	width: 70px;
	height: 10px;	
	margin-bottom: .2em;
	background-color: #000;
	margin-right: .75em;
}

.introTextSpan {
	background-color: #fff;
}

.addressBar {
	transition: all .7s ease-out;
	margin-bottom: 5em;
}

.adressBar a:hover {
	color: rgba(0, 10, 255, .75) !important;
}

.info,
.contact {
	font-family: "MaisonMono", Helvetica, Arial, Sans-Serif, sans-serif;
	font-size: .75em;
	display: block;
}

.datebox {
	border: 1px solid red;
	background-image: url(../img/datum.svg);
	background-size: contain;
	display: block;
}

.contactText {
	display: none;
}

.scroller h1 {
	font-size: 1.75em;
}


.logoSpan {
	display: inline-block;
}

.headerBig .logoSpan {
	display: block !important; 	
}


.underline {
	border-bottom: 0.075em solid;
}


.work {
	margin-top: 50px;
}

.workTitle {
	font-family: 'maisonMono', helvetica, arial, sans-serif;
	text-transform: uppercase;
	font-size: 2em;
	letter-spacing: 1px;
	font-size: 1em !important;
	line-height: .9;
	display: inline-block;
	-webkit-transform: rotate(-90deg);
	-webkit-transform-origin: 20%;
	z-index: 10;
	position: relative;
	top: 20em;
	display: none;
}

.blackBg {
	background: #000000 !important
}

/*========= footer ==========*/

footer {
	background-color: #000;
	color: #fff;
	line-height: 200px;
	font-size: 1rem;
	text-align: center;
	
	background-image: url(../img/stars.png);
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center bottom;
	background-size: 100% 100%;
}

/*//////// caseLink /////////*/

#mbux2018Link {
	background-color:#000000 !important;
}
#mbux2018Link .caseLinkImg{
	background-image: url(../img/mbux2018/mbux2018.jpg);
	width: 100%;
}
#etapesLink {
	background-color:#121d2e;
}
#etapesLink .caseLinkImg{
	background-image: url(../img/etapes/test.png);
}

#punzeLink {
	background-color: #e9e9e9;
}
#punzeLink .caseLinkImg{
	background-image: url(../img/punze/punze_double.png);
}

#arachnoboxLink {
	background-color: #0d0d0d !important;
}

#arachnoboxLink .caseLinkImg{
	background-image: url(../img/arachnobox2.png);
}

#werkschauLink {
	background-color: #f25a26;
}

#werkschauLink .caseLinkImg{
	background-image: url(../img/werkschau2.jpg);
}
#mercedesLink {
	background-color: #000 !important;
}
#mercedesLink .caseLinkImg{
	background-image: url(../img/mercedes/mercedesPrev2.jpg);
}

#pencilLink {
	background-color: #a5c4d8;
}
#pencilLink .caseLinkImg{
	background-image: url(../img/pencil.png);
}

#meLink {
	background-color:#f0f0f0;
	background-size:cover !important;
}
#meLink .caseLinkImg{
	background-image: url(../img/memyself.jpg);
	background-size: cover;
}

.closeBtn {
	visibility: hidden;
}

.spacing {
	height: 100px;
}

.caseLink {
	height: 320px;
	padding: 0;
	overflow: hidden;
	background-color: transparent !important; /* hebt alle HG-Farben auf */
	/*border-left: .5em solid #fff;
	border-top: .5em solid #fff;
	border-right: .5em solid #fff;*/
}

.caseLinkImg {
	display: block;
	width: 100%;
	position: absolute;
	top: 0;
	bottom: 0;
	padding: 2em;
	
	background-position: center;
	background-repeat: no-repeat;
	background-size:contain;
	
	transition: all .3s ease-out;
	
}

.caseImgLinkText {
	position: absolute;
	color: rgba(0, 10, 255, .75);
	font-family: "MaisonNeueBold", Helvetica, Arial, Sans-Serif, sans-serif;
	font-size: 2.5em;
	font-weight: bolder;
	line-height: 1.35;
	margin-left: 0px;
	opacity: 0;
	width: 100%;
	height: 100%;
	padding: .5em;
	text-align: center;
	display: table;
		
	
	-webkit-transition: all 900ms cubic-bezier(0.980, -0.360, 0.030, 1.405);
	/*-webkit-transition: opacity .7s ease-out;*/
}

.caseImgTextCenterWrapper {
	display: table-cell;
	vertical-align: middle; 
	text-align: center;
}

.caseBtnElementWrapper {
	width: 1.85em;
	height: 1.85em;
	position: absolute;
	right: 50%;
	bottom: 50%;
	transition-delay: 1s;
	transition: all .3s ease;
}

.caseBtnElement {
	position: relative;
	background-color: rgba(255, 255, 255, 0.85);;
	
	transition: all .3s ease;
}
.caseBtnElementHorizontal {
	width:  1.85em;
	height: .25em;
	top: .8em;
	left: 0em;
	margin-bottom: auto;
}

.caseBtnElementVertical {
	height:  1.85em;
	width: .25em;
	left: .8em;
	top: 0em;
	margin-top: -.25em;
	transform-origin: center;
}


/*//////// hover styles /////////*/

.caseImgLinkText:hover{
	opacity: .5;
}

.caseLink:hover > .caseLinkImg {
	opacity: 1;
}

.caseLink:hover > .caseImgLinkText {
	opacity: 1;
	line-height: 1.35;
}

.caseLink:hover > .caseBtnElementWrapper {
	-webkit-transform: rotate(90deg);
	opacity: 0;
} 

.caseLink:hover > .caseBtnElementWrapper > .caseBtnElementHorizontal {
	-webkit-transform: rotate(90deg);
} 


/*//////// work /////////*/

.projectTitle {
	opacity: .65;
	font-size: 8em;
}

.image {
	overflow: hidden;
}

.image img {
	max-width: 100%;
}

.half {
	height: 500px;
}


/*//////// me ////////////*/

.aboutText p {
	font-family: "MaisonNeueLight", Helvetica, Arial, Sans-Serif, sans-serif;
}

#me {
	padding-top: 8em;
	padding-bottom: 8em;
	


}

.aboutCv table {
	display: block;
	font-size: .8em;
	margin-top: 5em;
}

.aboutCv tr {
	margin-bottom: 20em;
}

.aboutCv td {
	vertical-align: top; 
	padding-bottom: 1em;
}


.firstTh {
	padding-right: 65px;
	font-family: "MaisonNeueBold", Helvetica, Arial, Sans-Serif, sans-serif;
}


/* chart*/



.chartCtrl ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
}

.chartCtrl li {
	display: block;
	padding: .5em 0 .5em 0;
	border-bottom: 1px solid #444;
	font-family: "MaisonNeueBold", Helvetica, Arial, Sans-Serif, sans-serif;
	text-align: center;
	
	transition: color .3s ease-out;

}

.chartCtrl li p {margin: 0;}

/*///////// triangle //////////*/

.skillsWrapper {
	height: 150px;
	background-color: #e9e9e9;
	padding: 0;
	overflow: hidden;
	margin-bottom: 1em;
}

.skillMarker {
	/*background-color: red;*/
	width: 30px;
	height: 30px;
	margin-left: 0%;
	margin-top: -40px;
	position: relative;
	z-index: 10;
	left: -15px;
	
	background-image: url(../img/hand_rock_box.svg);
	background-size: contain;
	background-repeat: no-repeat;
}

.skillOverlay {
	position: absolute; 
	width: 100%;
	height: 100%;
	z-index: 5;
	
	background-image: url(../img/hands_overlay_beide_small.svg);
	background-repeat: no-repeat;
	background-size-y:50%;
	background-position-x: center;
	background-position-y: -1px;
}

.skill {
	width: 100%;
	height: 0px;
	background-color: #000;
	position: absolute;
	bottom: 2px;
	z-index: 3;
	
	transition: all .9s cubic-bezier(0.980, -0.360, 0.030, 1.405);

}


/*//////// image CV ////////////*/

.cvWrapper {
	margin-top: 5em;
	width: 100%;
	height: 320px;
	overflow: hidden;
}

.cvHolder {
	/*background-image: url(../img/test.jpg);
	background-size: cover;
	background-position: center;
	rgba(0, 10, 255, 1)*/
	overflow: hidden;
	/*overflow-x: auto;*/
	height: 338px;
	width: 100%;
}

.cvHolder ul {
	width: 1220px;
	height: 320px;
}

.cvHolder ul li {
	width: 100px;
	height: 320px;
	display: block;
	float: left;
	margin: 0;
	padding: 1em;
	overflow: hidden;
	border-right: 1px solid #444;
	
	background-size: auto 320px;
	background-position-x: -420px;
	background-position-y: center;
	background-repeat: no-repeat;

	
	transition: all .9s cubic-bezier(0.980, -0.360, 0.030, 1.405);
}

#cvNow {
	background-image: url(../img/lebenslauf/2013.png);
}
#cv2013 {
	background-image: url(../img/lebenslauf/2013.png);
}

.dragIcon {
	position: absolute;
	left: 50%;
	top:150%;
	color: rgba(0, 10, 255, .85);
	height: 100px;
	width: 100px;
	margin-left: -50px;
	margin-top: -50px;
	text-align: center;
	line-height: 0;
	opacity: 0;
	font-size: 2em;
	font-family: "MaisonNeueBold", Helvetica, Arial, Sans-Serif, sans-serif;	
	
	/*
	border: 7px solid;
	background-image: url(../img/hands_overlay_eins_blau.svg);
	background-repeat: no-repeat;
	background-position: -12px 10px;
	background-size: 100%;*/
	
	transition: all .9s cubic-bezier(0.980, -0.360, 0.030, 1.405);
}

.dragIconVisible {
	top: 50%;
	opacity: 1;
	line-height: 1.4;
}

.cvHolder ul li .background{
	background-color: rgba(0, 10, 255, .5);
	opacity: ;
}

.cvHolder ul li .cvImageHolder {
	position: relative; 
	border: 1px solid red;
	left: 0px;
	top: 0px;
	right: 0px;
	bottom: 0px;
}

.cvHolder ul li .balken {
	background-color: #444;
	
	transition: background-color .5s ease-out;

}

.cvHolder ul li h1 {
	font-size: 2em;
	font-family: "MaisonNeueBold", Helvetica, Arial, Sans-Serif, sans-serif;	
	display: inline-block;
	color: "#444"
	
	transition: color .3s ease-out;
}

.cvHolder ul li p {
	display: block;
	margin-top: 50px;
	opacity: 0;
	margin-top: 70px;
	font-family: "MaisonNeueLight", Helvetica, Arial, Sans-Serif, sans-serif;
	font-size: .85em;
	color: #fff;
	
	transition: all .5s ease-out;
	transition-delay: .5s;
}

/*/////hover styles /////*/
.cvHolder ul li.open {
	color: #fff !important;
	width: 320px !important;
	
	background-position-x: 0px;
}

.cvHolder ul li:hover > .balken {
	background-color:  #fff !important;
}

.cvHolder ul li.open > .balken {
	background-color: rgba(0, 10, 255, .85) !important;
}

.cvHolder ul li.open .background {
	opacity: 1 !important;
}

.cvHolder ul li.open > p {
	opacity: 1;
	margin-top: 30px;
}

.cvHolder ul li:hover > h1 {
	color: #fff !important;
} 

.cvHolder ul li.open > h1 {
	color: rgba(0, 10, 255, .85) !important;
} 
/*//////// Cases ////////////*/

/*//caseanimations //*/
.animate {
	transition: all .8s ease-out;	
}

/*==================================================*/
.animateLeft {
	-webkit-transform: translateX(-100px);
	opacity: 0;
}

.animateLeft.start {
	-webkit-transform: translateX(0px);
	opacity: 1;
}
/*==================================================*/
.animateRight {
	-webkit-transform: translateX(100px);
	opacity: 0;
}

.animateRight.start {
	-webkit-transform: translateX(0px);
	opacity: 1;
}
/*==================================================*/
.animateBottom {
	-webkit-transform: translateY(100px);
	opacity: 0;
}

.animateBottom.start {
	-webkit-transform: translateY(0px);
	opacity: 1;
}
/*==================================================*/
.animateFade {
	opacity: 0;
}

.animateFade.start {
	opacity: 1;
}
/*==================================================*/

.caseText p {
	color: #fff;
	font-family: "MaisonNeueLight", Helvetica, Arial, Sans-Serif, sans-serif;
	line-height: 2em;
	text-align: center;
	margin-top: 4em; 
}

.btnContainer {
	display: block;
	width: 2.5em;
	font-size: 1em;
	height: 2.5em;
	text-align:center;
	border-radius: 100%;
	border: 2px solid; 
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 2em;
}

.btnContainer:hover {
	opacity: .75;
}

.btnContainer i {
	display: block; 
	margin: auto;
	line-height: 2.4em;
}


/* caseContainer */
	
#caseContainer {
	overflow: hidden;
	height: auto;
	margin-top: 50px;
				
	border-left: .5em solid #fff;
	border-right: .5em solid #fff;
}

.caseContainerClosed {
	height: 0px !important
}

.caseTitle {
	font-size: 3em !important;
	line-height: 1.15;
	padding-top: .5em;
	position: relative;
	z-index: 10;
}

.caseIntro {
	padding-top: 50px;
	padding-bottom: 50px;
}


.infoText, 
.infoBar {
	position: relative;
	z-index: 10;
}

.caseIntroHg {
	border: 1px solid red;
	width: 100%;
	position: absolute;
	top: 0;
	bottom: 0;
	z-index: 1;
	opacity: .5;
	
	background-image: url(../img/foto2.png);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}


.fullWidth {
	width:100%;
	height: auto;
}


.dragTool {
	width: 100%;
	max-width: 260px;
	margin: 0 auto;
	height: 545px !important;
}

/*========= page ALL CASES ======*/
.case h1,
.case p {
	text-align: center;
	line-height: 1.5;
}

.case p {
	margin-bottom: 5em;
}

.case .balken {
	margin: 0 auto;
	display: block;
}
/*========= page MBUX 2018 ======*/
.mbux2018 {
	background: url(../img/mbux2018/bg.png) no-repeat center center fixed;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;

}

.mbux2018 h1,
.mbux2018 p {
	color: #ffffff;
}

.mbux2018 .balken {
	background-color: #ffffff;
}

.mbux2018 i {
	color: #ffffff;
}
/*========= page ETAPES ======*/
.etapes h1,
.etapes p {
	color: #647281;
}

.etapes .balken {
	background-color: #647281;
}

.etapes i {
	color: #647281;
}


/*========= page PUNZE ======*/
.punze h1,
.punze p {
	color: #000;
}

.punze video {
	margin: 0 auto;
	display: block;
	background-color: rgba(233,233,233,1) !important;
}

.punze .svgContainer svg {
	display: block;
	margin: auto;
}

/*animation*/
.punze .svgContainer:hover > svg .svgCircle {
	-webkit-animation: fadeIn 4s linear;
}
.punze .svgContainer:hover > svg .svgHand {
	-webkit-animation: handMove 4s linear;
}

@-webkit-keyframes fadeIn {
    0%{
        opacity: 0;
    }
    25%{
        opacity: 0;
    }
    26%{
        opacity: 1;
    }
    100%{
        opacity: 1;
    }
}
@-webkit-keyframes handMove {
    0%{
        -webkit-transform: translateY(30px);
        opacity: 0;
    }
    25%{
        -webkit-transform: translateY(0px);
        opacity: 1;
    }
    50%{
        -webkit-transform: translateY(30px);
        opacity: 0;
    }
    100%{
        -webkit-transform: translateY(30px);
        opacity: 0;
    }
}

.punze .svgContainer:hover > svg .svgNavCircle {
	-webkit-animation: navRotating 4s ease-out;
	-webkit-transform-origin: center;
}
.punze .svgContainer:hover > svg .svgArticles {
	-webkit-animation: articleMove 4s ease-out;
}

@-webkit-keyframes navRotating {
    33%{
        -webkit-transform: rotate(-90deg);
    }
    66%{
        -webkit-transform: rotate(90deg);
    }
    100%{
        -webkit-transform: rotate(0deg);
    }
}

@-webkit-keyframes articleMove {
    33%{
        -webkit-transform: translateX(-50px);
    }
    66%{
        -webkit-transform: translateX(50px);
    }
    100%{
        -webkit-transform: translateX(0px);
    }
}

.punze .ipadFront .ipad {
	width: 100%;
	height: auto;
	position: relative;
	z-index: 4;
}

.punze .ipadFront .content,
.punze .ipadFront .content2,
.punze .ipadFront .background {
	width: 64%;
	height: 80%;
	position: absolute;
	top: 11%;
	left: 18%;
	z-index: 3;
	transition: all .2s ease-out;

	
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}
.punze .ipadFront .content {
	background-image: url(../img/punze/punzeArticle.jpg);
}
.punze .ipadFront .content2 {
	z-index: 5;
	border-radius: 200
	-webkit-transform: scale(.1);
	opacity: 0;
	display: flex;
	justify-content: center;
}
.punze .ipadFront .background {
	z-index: 1;
	background-color: #000;
}

.punze .ipadFront .punzeMenu {
	height: 210px;
	width: 210px;
	border-radius: 50%;
	border: 10px solid #b3b3b3;
	background-color: transparent;
	
}


.punze .ipadFront:hover > .content {opacity: .2;}
.punze .ipadFront:hover > .content2 {-webkit-transform: scale(.5); opacity: 1;  }


/*========= page ARACHNOBOX ======*/
.arachnobox h1,
.arachnobox p {
	color: #d5dada;
}

.arachnobox .balken {
	background-color: #d5dada;
}

.arachnobox i {
	color: #d5dada;
}

/*========= page WERKSCHAU ======*/
.werkschau h1,
.werkschau p {
	color: #000 !important;
}

.werkschau .balken {
	background-color: #000;
}

.werkschau i {
	color: #000;
}

.werkschau .fullwidth {
	max-width: 100%;
	margin: 0 auto;
	display: block;
}

/* ==========================================================================
   Media Queries
   ========================================================================== */
@media only screen and (min-width: 481px) {
	

	.caseImgLinkText {
		font-size: 5em;
		line-height: 0;
	}
}

@media only screen and (min-width: 769px) {
	
	header {
		background-color: transparent;
	}
	
	.headerBig .logo {
		font-size: 6em !important;
		line-height: 1.15;
		padding-top: .5em;
	}
	
	.intro {
		padding-top: 50px;
		padding-bottom: 50px;
	}
	
	.headerBig {
		padding-top: 3em;
		padding-bottom: 3em;
	}
	.cvList span {
		display: inline;
	}
	
	.cvListEntry .date {
		font-family: "MaisonNeueLight", Helvetica, Arial, Sans-Serif, sans-serif;
		font-size: .45em;
		display: inline-block;
		margin-top: 0;
	}
	
	.contactText {
		display: inline-block;
	}
	
	.cv {
		font-size: 1.25em;
	}
	
	.chartCtrl li {
		text-align: left;
	}
	
	/*//////// Cases ////////////*/
	
	.caseLink {height: 480px}
	
	.cases .caseLink:nth-child(odd) > .caseImgLinkText {
		text-align: center;
		bottom: 0em;
	}
	
	.cases .caseLink:nth-child(even) > .caseImgLinkText {
		text-align: center;
		top: 0em;
	}
	
	/*hover styles */
	
	.cases .caseLink:nth-child(odd):hover > .caseImgLinkText {
		bottom: 0em;
	}
	
	.cases .caseLink:nth-child(even):hover > .caseImgLinkText {
		top: 0em;
	}



	

	#etapes {
		background-color: #121d2e;
		color: #fff;
	}
	
	.caseTitle {
		font-size: 6em !important;
		line-height: 1.15;
		padding-top: .5em;
	}
	
	.CaseIntro {
		padding-top: 50px;
		padding-bottom: 50px;
	}

	
}