@CHARSET "ISO-8859-1";
/* Reset CSS
 * --------------------------------------- */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,
form,fieldset,input,textarea,p,blockquote,th,td {
    padding: 0;
    margin: 0;
}
a{
	text-decoration:none;
}
table {
    border-spacing: 0;
}
fieldset,img {
    border: 0;
}
address,caption,cite,code,dfn,em,strong,th,var {
    font-weight: normal;
    font-style: normal;
}
strong{
	font-weight: bold;
}
ol,ul {
    list-style: none;
    margin:0;
    padding:0;
}
caption,th {
    text-align: left;

}
h1,h2,h3,h4,h5,h6 {
    font-weight: normal;
    font-size: 100%;
    margin:0;
    padding:0;
}
q:before,q:after {
    content:'';
}
abbr,acronym { border: 0;
}


/* Custom CSS
 * --------------------------------------- */
@font-face {
  font-family: 'Material Icons';
  font-style: normal;
  font-weight: 400;
  src: url(font/web/MaterialIcons-Regular.eot); /* For IE6-8 */
  src: local('Material Icons'),
       local('MaterialIcons-Regular'),
       url(font/web/MaterialIcons-Regular.woff2) format('woff2'),
       url(font/web/MaterialIcons-Regular.woff) format('woff'),
       url(font/ttf/MaterialIcons-Regular.ttf) format('truetype');
}
.material-icons {
  font-family: 'Material Icons';
  font-weight: normal;
  font-style: normal;
  font-size: 6em;  /* Preferred icon size */
  font-size: 6vw;
  display: inline-block;
  line-height: 1;
  text-transform: none;
  letter-spacing: normal;
  word-wrap: normal;
  white-space: nowrap;
  direction: ltr;

  /* Support for all WebKit browsers. */
  -webkit-font-smoothing: antialiased;
  /* Support for Safari and Chrome. */
  text-rendering: optimizeLegibility;

  /* Support for Firefox. */
  -moz-osx-font-smoothing: grayscale;

  /* Support for IE. */
  font-feature-settings: 'liga';
}

/* raleway-regular - latin */
@font-face {
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 400;
  src: url('font/web/raleway-v22-latin-regular.eot'); /* IE9 Compat Modes */
  src: local('Raleway'),
       url('font/web/raleway-v22-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('font/web/raleway-v22-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('font/web/raleway-v22-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('font/ttf/raleway-v22-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('font/web/raleway-v22-latin-regular.svg#Raleway') format('svg'); /* Legacy iOS */
}
/* raleway-800 - latin */
@font-face {
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 800;
  src: url('font/web/raleway-v22-latin-800.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('font/web/raleway-v22-latin-800.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('font/web/raleway-v22-latin-800.woff2') format('woff2'), /* Super Modern Browsers */
       url('font/web/raleway-v22-latin-800.woff') format('woff'), /* Modern Browsers */
       url('font/ttf/raleway-v22-latin-800.ttf') format('truetype'), /* Safari, Android, iOS */
       url('font/web/raleway-v22-latin-800.svg#Raleway') format('svg'); /* Legacy iOS */
}

body{
	color: #ededed;
}
.wrap{
	margin-left: auto;
	margin-right: auto;
	width: 960px;
	position: relative;
}

.formcontainer {
  max-width: 500px;
  width: 100%;
  margin: 0 auto;
  position: relative;
}
h1{
	font-family: 'Raleway';
	font-size: 4em;
	font-size: 4vw;
	font-weight: 800;
	color: #ffffff;
	text-shadow: 1px 1px #4a4a49;
}
h2{
	font-family: 'Raleway';
	font-size: 2.5em;
	font-size: 2.5vw;
	font-weight: normal;
	color: #ffffff;
	text-shadow: 1px 1px #4a4a49;
}
h3{
	font-family: 'Raleway';
	font-size: 3em;
}
h4{
	font-family: 'Raleway';
	font-size: 2.5em;
}
p{
	font-family: 'Raleway';
	font-size: 2em;
}
.intro p{
	width: 50%;
	margin: 0 auto;
	font-size: 1.5em;
}
.section{
	text-align:center;
}
ul {
	list-style-type: square;
	padding-left: 25px;
}

div.titlebox_g {
	background-color: rgba(74,74,73,0.5);
	padding: 20px 20px 20px 20px;
	width: 85%;
	margin-left: auto;
	margin-right: auto;
	
	font-family: 'Raleway';
	text-align: center;
	color: #ffffff;
	text-shadow: 1px 1px #4a4a49;
	font-weight: bold;
	
	font-size: 3.5em;
	font-size: 3.5vw;
}

div.titlebox_y {
	background-color: rgba(221,224,150,0.5);
	padding: 20px 20px 20px 20px;
	width: 85%;
	margin-left: auto;
	margin-right: auto;
	
	font-family: 'Raleway';
	text-align: center;
	color: #4a4a49;
	text-shadow: 1px 1px #ffffff;
	font-weight: bold;

	font-size: 3.5em;
	font-size: 3.5vw;
}

div.textbox {
	background-color: rgba(255,255,255,0.7);
	padding: 20px 20px 20px 20px;
	width: 85%;
	margin-left: auto;
	margin-right: auto;
	
	font-family: 'Raleway';
	text-align: left;
	color: #4a4a49;
	
	font-size: 1.8em;
	font-size: 1.8vw;
}

div.textbox_frame {
	padding: 20px 20px 20px 20px;
	width: 85%;
	margin-left: auto;
	margin-right: auto;
	
	font-family: 'Raleway';
	text-align: left;
	color: #4a4a49;
	
	font-size: 1.8em;
	font-size: 1.8vw;
}

/* landscape/desktop */
@media screen and (min-width: 701px) {
	h1 {
		font-size: 4em;
		font-size: 4w;
	}
	h2 {
		font-size: 2.5em;
		font-size: 2.5vw;
	}
	div.titlebox_g {
		font-size: 3.5em;
		font-size: 3.5vw;
	}
	div.titlebox_y {
		font-size: 3.5em;
		font-size: 3.5vw;
	}
	div.textbox {
		font-size: 1.8em;
		font-size: 1.8vw;
	}
	#footer {
}

/* portrait/mobile */
@media screen and (max-width: 700px) {
	h1 {
		font-size: 5.5em;
		font-size: 5.5w;
	}
	h2 {
		font-size: 4em;
		font-size: 4vw;
	}
	div.titlebox_g {
		font-size: 5em;
		font-size: 5vw;
	}
	div.titlebox_y {
		font-size: 5em;
		font-size: 5vw;
	}
	div.textbox {
		font-size: 3em;
		font-size: 3vw;
	}
	#footer {
		font-size: 0.8em;
	}
	.grid {
		display: grid;
		grid-template-columns: repeat(1, 1fr);
		border: 0px 0px 0px 0px;
	}
}

/* extra wide landscape */
@media screen and (min-width: 2001px) {
	h1 {
		font-size: 3.5em;
		font-size: 3.5w;
	}
	h2 {
		font-size: 2em;
		font-size: 2vw;
	}
	div.titlebox_g {
		font-size: 3em;
		font-size: 3vw;
	}
	div.titlebox_y {
		font-size: 3em;
		font-size: 3vw;
	}
	div.textbox {
		font-size: 1.3em;
		font-size: 1.3vw;
	}
}

@media only screen 
	and (min-device-width: 374px)
	and (orientation : portrait)
	and (-webkit-device-pixel-ratio: 2), (-webkit-device-pixel-ratio: 3), (-webkit-device-pixel-ratio: 4) {
	h1 {
		font-size: 5.5em;
		font-size: 5.5w;
	}
	h2 {
		font-size: 4em;
		font-size: 4vw;
	}
	div.titlebox_g {
		font-size: 5.5em;
		font-size: 5.5vw;
	}
	div.titlebox_y {
		font-size: 5.5em;
		font-size: 5.5vw;
	}
	div.textbox {
		font-size: 3.5em;
		font-size: 3.5vw;
	}
	.grid {
		display: grid;
		grid-template-columns: repeat(1, 1fr);
		border: 0px 0px 0px 0px;
	}
}

@media only screen 
	and (min-device-width: 374px)
	and (orientation : landscape)
	and (-webkit-device-pixel-ratio: 2), (-webkit-device-pixel-ratio: 3), (-webkit-device-pixel-ratio: 4) {
	h1 {
		font-size: 1.5em;
		font-size: 1.5w;
	}
	h2 {
		font-size: 1.5em;
		font-size: 1.5vw;
	}
	div.titlebox_g {
		font-size: 1.5em;
		font-size: 1.5vw;
	}
	div.titlebox_y {
		font-size: 1.5em;
		font-size: 1.5vw;
	}
	div.textbox {
		font-size: 1.5em;
		font-size: 1.5vw;
	}
	#footer {
		font-size: 0.8em;
	}
}

.grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	border: 0px 0px 0px 0px;
}
.grid > span {
	padding: 8px 4px;
	border: 0px 0px 0px 0px;
	
	font-family: 'Raleway';
	text-align: left;
	color: #ffffff;
	
	font-size: 1.8em;
	font-size: 1.8vw;
}

#contact {
	background: #ededed;
	padding: 25px;
	margin: 150px 0;
	box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.2), 0 5px 5px 0 rgba(0, 0, 0, 0.24);
}

fieldset {
	border: medium none !important;
	margin: 0 0 10px;
	min-width: 100%;
	padding: 0;
	width: 100%;
}

#contact input[type="text"],
#contact input[type="email"],
#contact input[type="tel"],
#contact textarea {
	width: 100%;
	border: 1px solid #ccc;
	background: #FFF;
	margin: 0 0 5px;
	padding: 10px;
	color: #4a4a49;
	font-family: 'Raleway';
}

#contact input[type="text"]:hover,
#contact input[type="email"]:hover,
#contact input[type="tel"]:hover,
#contact textarea:hover {
	-webkit-transition: border-color 0.3s ease-in-out;
	-moz-transition: border-color 0.3s ease-in-out;
	transition: border-color 0.3s ease-in-out;
	border: 1px solid #aaa;
}

#contact input {
	max-width: 90%;
}

#contact textarea {
	height: 100px;
	max-width: 90%;
	resize: none;
}

#contact button[type="submit"] {
	cursor: pointer;
	width: 95%;
	border: none;
	background: #4a4a49;
	color: #ffffff;
	margin: 0 0 5px;
	padding: 10px;
	font-size: 15px;
}

#contact button[type="submit"]:hover {
	background: #dde096;
	-webkit-transition: background 0.3s ease-in-out;
	-moz-transition: background 0.3s ease-in-out;
	transition: background-color 0.3s ease-in-out;
}

#contact button[type="submit"]:active {
	box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.5);
}

#contact input:focus,
#contact textarea:focus {
	outline: 0;
	border: 1px solid #aaa;
}

::-webkit-input-placeholder {
	color: #4a4a49;
}

:-moz-placeholder {
	color: #4a4a49;
}

::-moz-placeholder {
	color: #4a4a49;
}

:-ms-input-placeholder {
	color: #4a4a49;
}

#section0 {
	background-image: linear-gradient(transparent, white 80%), url(images/digitallogistics_lasers.jpg);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
}
#section2 {
	background-image: linear-gradient(transparent, white 80%), url(images/digitallogistics_contact.jpg);
	background-size:     cover;
	background-repeat:   no-repeat;
	background-position: center center;
}

#slide0 {
}
#slide1 {
	background-image: linear-gradient(transparent, white 80%), url(images/digitallogistics_interview.jpg);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
}
#slide2 {
	background-image: linear-gradient(transparent, white 80%), url(images/digitallogistics_workshop.jpg);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
}
#slide3 {
	background-image: linear-gradient(transparent, white 80%), url(images/digitallogistics_server.jpg);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
}
#slide4 {
	background-image: linear-gradient(transparent, white 80%), url(images/digitallogistics_control.jpg);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
}

#slide5 {
}
#slide6 {
	background-image: linear-gradient(transparent, white 80%), url(images/digitallogistics_desk.jpg);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
}
#slide7 {
	background-image: linear-gradient(transparent, white 80%), url(images/digitallogistics_desk.jpg);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
}
#slide8 {
}
#slide9 {
	background-image: linear-gradient(transparent, white 80%), url(images/digitallogistics_city.jpg);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
}
#slide10 {
	background-image: linear-gradient(transparent, white 80%), url(images/digitallogistics_city.jpg);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
}
#slide11 {
	background-image: linear-gradient(transparent, white 80%), url(images/digitallogistics_city.jpg);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
}
#slide12 {
	background-image: linear-gradient(transparent, white 80%), url(images/digitallogistics_city.jpg);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
}
