@charset "UTF-8";
/* CSS Document */

/*
colors:
dark-grey: #766b70;
light-grey: #c6c2c3;
pink: #e75294;
green: #a5c767;
red: #d22336;
turquoise: #2fb1a0;
yellow: #f2e634;
blau: #73b3d8;
orange: #e9923e;
brown: #c7847f;
*/




html {
	background-color: white;
}
body {
	background-color: white;
	height: 1500px;
}
#movingItem {
	margin-top: 50px;
	margin-left: -110px;
	position: fixed;
}
h1 {
	color: #766b70;
	font-weight: bold;
	letter-spacing: 0.1px;
}
h2 {
	color: #c6c2c3;
	letter-spacing: 0.1px;
}
h4 {
	color: #c6c2c3;
	font-weight: bold;
	letter-spacing: 0.1px;
}
p {
	color: #766b70;
	letter-spacing: 0.3px;
}
a:hover h4 span {
	color: #c6c2c3;
}
address {
	font-style: normal;
}
.close h1 {
	margin-bottom: -10px;
}
.close h2 {
	margin-bottom: 50px;
}

.colorTextPink {
	color: #e75294;
}

.colorPink {
	color: #e75294;
}
.colorPink:hover {
	color: #c6c2c3;
}

.colorTextGreen {
	color: #a5c767;
}

.colorGreen {
	color: #a5c767;
}

.colorGreen:hover {
	color: #c6c2c3;
}

.colorTextRed {
	color: #d22336;
}

.colorRed {
	color: #d22336;
}
.colorRed:hover {
	color: #c6c2c3;
}

.colorTextTurquoise {
	color: #2fb1a0;
}

.colorTurquoise {
	color: #2fb1a0;
}
.colorTurquoise:hover {
	color: #c6c2c3;
}

.colorTextYellow {
	color: #f2e634;
}

.colorYellow {
	color: #f2e634;
}
.colorYellow:hover {
	color: #c6c2c3;
}

.colorTextOrange {
	color: #e9923e;
}

.colorOrange {
	color: #e9923e;
}
.colorOrange:hover {
	color: #c6c2c3;
}

.colorTextBrown {
	color: #c7847f;
}

.colorBrown {
	color: #c7847f;
}
.colorBrown:hover {
	color: #c6c2c3;
}

/* color blue portfolio*/

.colorTextBlue {
	color: #73b3d8;
}

.colorBlue {
	color: #73b3d8;
}
.colorBlue:hover {
	color: #c6c2c3;
}

/*.grey {
	color: #c6c2c3;
}*/
.navigation h4 {
	margin-bottom: -20px;
}
.arrowRightPink {
	display: block;
	background: transparent url(../img/arrow_grey.png) 0 0 no-repeat;
	z-index: 200;
	width: 75px;
	height: 148px; 
	position: relative;
	margin-top: 50px;
	margin-bottom: -20px;
}
.arrowRightPink:hover {
	background: transparent url(../img/arrow_pink.png) 0 0 no-repeat;
}

.arrowRightBlue {
	display: block;
	background: transparent url(../img/arrow_grey.png) 0 0 no-repeat;
	z-index: 200;
	width: 75px;
	height: 148px; 
	position: relative;
	margin-top: 50px;
	margin-bottom: -20px;
}
.arrowRightBlue:hover {
	background: transparent url(../img/arrow_blue.png) 0 0 no-repeat;
}

.arrowRightBlueSmall {
	display: block;
	background: transparent url(../img/arrow_grey_small.png) 0 0 no-repeat;
	z-index: 200;
	width: 50px;
	height: 67px; 
	position: relative;
	margin-top: 30px;
	margin-bottom: 0px;
}
.arrowRightBlueSmall:hover {
	background: transparent url(../img/arrow_blue_small.png) 0 0 no-repeat;
}

.arrowRightGreen {
	display: block;
	background: transparent url(../img/arrow_grey.png) 0 0 no-repeat;
	z-index: 200;
	width: 75px;
	height: 148px; 
	position: relative;
	margin-top: 50px;
	margin-bottom: -20px;
}
.arrowRightGreen:hover {
	background: transparent url(../img/arrow_green.png) 0 0 no-repeat;
}

.arrowRightRed {
	display: block;
	background: transparent url(../img/arrow_grey.png) 0 0 no-repeat;
	z-index: 200;
	width: 75px;
	height: 148px; 
	position: relative;
	margin-top: 50px;
	margin-bottom: -20px;
}
.arrowRightRed:hover {
	background: transparent url(../img/arrow_red.png) 0 0 no-repeat;
}

.arrowRightTurquoise {
	display: block;
	background: transparent url(../img/arrow_grey.png) 0 0 no-repeat;
	z-index: 200;
	width: 75px;
	height: 148px; 
	position: relative;
	margin-top: 50px;
	margin-bottom: -20px;
}
.arrowRightTurquoise:hover {
	background: transparent url(../img/arrow_turquoise.png) 0 0 no-repeat;
}

.arrowRightYellow {
	display: block;
	background: transparent url(../img/arrow_grey.png) 0 0 no-repeat;
	z-index: 200;
	width: 75px;
	height: 148px; 
	position: relative;
	margin-top: 50px;
	margin-bottom: -20px;
}
.arrowRightYellow:hover {
	background: transparent url(../img/arrow_yellow.png) 0 0 no-repeat;
}

.arrowRightOrange {
	display: block;
	background: transparent url(../img/arrow_grey.png) 0 0 no-repeat;
	z-index: 200;
	width: 75px;
	height: 148px; 
	position: relative;
	margin-top: 50px;
	margin-bottom: -20px;
}
.arrowRightOrange:hover {
	background: transparent url(../img/arrow_orange.png) 0 0 no-repeat;
}

.arrowRightBrown {
	display: block;
	background: transparent url(../img/arrow_grey.png) 0 0 no-repeat;
	z-index: 200;
	width: 75px;
	height: 148px; 
	position: relative;
	margin-top: 50px;
	margin-bottom: -20px;
}
.arrowRightBrown:hover {
	background: transparent url(../img/arrow_brown.png) 0 0 no-repeat;
}


.field_detail {
	position: fixed;
	margin-top: 250px;
	margin-left: 250px;
}

.field_detail_2 {
	position: fixed;
	margin-top: -200px;
	margin-left: -970px;
}

.field_detail_3 {
	position: fixed;
	margin-top: -80px;
	margin-left: 50px;
}

.field_detail_4 {
	position: fixed;
	margin-top: 200px;
	margin-left: 800px;
}

.field_detail_5 {
	position: fixed;
	margin-top: 50px;
	margin-left: -900px;
}

.field_detail_6 {
	position: fixed;
	margin-top: 0px;
	margin-left: -70px;
}

.field_detail_7 {
	position: fixed;
	margin-top: -400px;
	margin-left: -400px;
}

.field_grey {
	position: fixed;
	margin-top: -150px;
	margin-left: -400px;
}

.span {
	font: inherit;	
}

.marginMinus {
margin-top: -50px;
margin-bottom: 20px;	
	}
		
.marginNormal {
	margin-top: 0px;
		
	}
.marginNormalLib {
margin-top: 0px;
margin-bottom: 20px;	
	}

/*css animation begins here*/