@font-face { font-family: 'copy'; src: url('../font/copy.woff') format('woff'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'darker_grotesqueregular'; src: url('../font/darkergrotesque-regular-webfont.woff2') format('woff2'), url('../font/darkergrotesque-regular-webfont.woff') format('woff'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'darker_grotesquelight'; src: url('../font/darkergrotesque-light-webfont.woff2') format('woff2'), url('../font/darkergrotesque-light-webfont.woff') format('woff'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'darker_grotesquemedium'; src: url('../font/darkergrotesque-medium-webfont.woff2') format('woff2'), url('../font/darkergrotesque-medium-webfont.woff') format('woff'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'darker_grotesquesemibold'; src: url('../font/darkergrotesque-semibold-webfont.woff2') format('woff2'), url('../font/darkergrotesque-semibold-webfont.woff') format('woff'); font-weight: normal; font-style: normal; }
/*@font-face { font-family: 'Icons'; src: url('./fonts/mfglabsiconset-webfont.woff') format('woff'); font-weight: normal; font-style: normal; }*/

* { margin:0; padding:0;	-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}


html { height:100%; font-size:18px; line-height:20px; }
body	{ font-family:'darker_grotesqueregular', Arial, Helvetica, verdana, sans-serif; color:#354250; }

a		{ text-decoration:none; cursor:pointer; outline:none; color:#354250}
a img	{ border:none }
ul, ol, li { list-style:none}
.boldFont, .boldFont *, b, strong { font-family:'darker_grotesquesemibold'; font-weight:normal }
h1, .serifFont, .serifFont * { font-family:Times, "Times New Roman", Georgia, serif }
.smallFont, .smallFont * { font-size:0.8rem }




main { max-width:1550px; margin:0 auto; display:flex; flex-direction:column; }

header { display:flex; height:150px; }
header .col { display:flex; width:50%; }
header .col01 .logo { display:flex; width:290px; padding:0 25px }
header .col01 .logo svg { width:100%}

header .col02 { width:50% }
header .col02 ul { display:flex; flex-direction:row; margin-left:25px }
header .col02 ul a { line-height:150px; padding:0 25px }




article { display:flex; flex:1; flex-direction:row}
article h1, article .h1 { font-size:1.55rem; line-height:2rem; margin-bottom:1.55rem; font-weight:normal }
article h5, article .h5 { font-size:1.11rem; line-height:1.11rem; margin-bottom:1.11rem; font-weight:normal; font-family:'darker_grotesqueregular', Arial, Helvetica, verdana, sans-serif;  }
article p { margin-bottom:1em}
article ul li { padding-left:30px; list-style:none; text-indent:-15px}
article ol li { padding-left:40px; list-style:none; text-indent:-15px}
article ul li::before { content: "+"; position: relative; color:#00AEEF; font-weight:bold; left:-17px; font-size:30px}

footer * { color:#fff}
footer .line01 { background:#7b8896; height:75px}
footer .line01 ul { display:flex; flex-direction:row; margin-left:25px }
footer .line01 ul a { line-height:75px; padding:0 15px }
footer .line02 { background:#354250; height:45px}
footer .line02 p { line-height:45px; margin-left:40px}

/* FORMS */
.input.line { display:block; margin-bottom:15px; position:relative}
.input.line .inputText { border:1px solid #7b8896; border-radius:3px; background:#fff; width:385px; padding:19px 0 7px 15px; color:#354250 }
.input.line .inputButton { border:none; border-radius:3px; background:#354250; padding:10px 0; width:200px; color:#fff; text-align:center; text-transform:uppercase; font-size:1rem  }
.input.line label { position:absolute; top:10px; left:15px; color:#a9a9a9; cursor:text; transform-origin: 0 100%}

.input.line.focused .inputText { border-color:#00AEEF; color:#00AEEF } 
.input.line.focused label { transform:translateY(-13px) scale(0.7); transition: all .3s ease-out; }
.input.line.filled label { transform:translateY(-13px) scale(0.7); }

body#start { height:100% }
body#start main { max-width:100%; height:100%; }
body#start article { background:#f2f4f5  }
body#start article .col01 { width:50%; background:url(../keyvisuals/start01.jpg) center center; background-size:cover }
body#start article .col02 { width:50%; padding:5% 5% 15px 5% }
body#start article .col02 h2.h1{ width:70%; }

.ui-tooltip { position:absolute; background:#fff; z-index:9999; border:1px dotted #5e5e5e; padding:10px 15px; max-width:17%; }

.ui-tooltip {
	padding: 8px;
	max-width: 300px;
}
body .ui-tooltip {
}