@charset "UTF-8";
/*

  Projekt: netzatelier
  Datei: netzatelier.css
  © Peter Stalder 2017
  
*/
/* ---------------------------- reset */
* { 
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	}
html, body { 
	min-height: 100%;
	}
html { 
	overflow-y: scroll;
	}
body { 
	background-color: transparent;
	overflow: hidden;
	}
img { 
	border-width: 0;
	border: none;
	width: 100%;
	}
ul li { 
	list-style-type: none;
	}
article,
footer,
header,
nav,
section { 
	display: block;
	}
/* ---------------------------- fonts */
/*<link href="https://fonts.googleapis.com/css?family=Noto+Sans:400,400i,700,700i" rel="stylesheet">
400 = Regular
700 = Bold
*/
html, body { 
	font-family: 'Noto Sans', sans-serif;
	font-size: 100%;
	font-style: normal;
	font-weight: 400;
	}
/* ---------------------------- bigpicture */
html { 
	background: url(../hg/hg04.jpg) no-repeat center center fixed;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	}
/* ---------------------------- color*/
.darkblue { 
	color: #0A7FD9;
	}
.red { 
	color: #E0154B;
	}
.blue { 
	color: #52A6CF;
	}
.color_01 { 
	color: rgb(67,71,74);
	}
.bg-color_01 { 
	background-color: rgb(67,71,74);
	}
.color_02 { 
	color: rgb(74,79,82);
	}
.bg-color_02 { 
	background-color: rgb(74,79,82);
	}
.color_03 { 
	color: rgb(117,138,150);
	}
.bg-color_03 { 
	background-color: rgb(117,138,150);
	}
.color_04 { 
	color: rgb(129,174,201);
	}
.bg-color_04 { 
	background-color: rgb(129,174,201);
	}
.bg-color_04-5 { 
	background-color: rgba(129,174,201, .5);
	}
.bg-color_05 { 
	background-color: rgba(255,255,255, .6);
	}
/* ---------------------------- button*/
.netzatelier, .contact { 
	
	}
.netzateliertext, .contacttext, .referencetext { 
	display: none;
	background-color: rgba(255,255,255, .8);
	padding: 20px;
	}
.btn-lg, btn-sm, btn-xs { 
	border: none;
	}
/* ---------------------------- container */
/* ---------------------------- nav */
/* ---------------------------- framework */
img { 
	width: 100%;
	height: 100%;
	}
/* ---------------------------- offset */
.margin-top-0 { 
	margin-top: 0;
	}
.padding-top-20px { 
	padding-top: 20px;
	}
.padding-bottom-40px { 
	padding-bottom: 40px;
	}
.padding-bottom-20px { 
	padding-bottom: 20px;
	}
.margin-bottom-40px { 
	margin-bottom: 40px;
	}
.padding-8px { 
	padding: 8px;
	}
.padding-15px { 
	padding: 15px;
	}
/* ---------------------------- content */
.fullwidth { 
	margin-left: -14px;
	margin-right: -14px;
	margin-bottom: 20px;
	}
a { 
	color: #3e3d40;
	text-decoration: underline;
	}
a:hover,
a:focus { 
	text-decoration: underline;
	}
a:focus { 
	outline: 5px auto -webkit-focus-ring-color;
	outline-offset: -2px;
	}
/* ---------------------------- general */
h1 { 
	font-weight: 700;
	font-size: 24px;
	line-height: 100%;
	margin: 0;
	margin: 20px 0 20px 20px;
	}
.menu { 
	margin-left: -20px;
	padding: 0 20px 0 20px;
	cursor: pointer;
	}
h2 { 
	font-size: 19px;
	line-height: 100%;
	text-transform: uppercase;
	margin: 20px 0 20px 0;
	}
@media (max-width: 767px) {
h2 { 
	margin-top: 0px;
	}
}
h3 { 
	font-weight: 400;
	font-size: 17px;
	line-height: 140%;
	color: rgb(37,82,147);
	margin-top: 20px;
	}
p, ul, dl { 
	font-size: 18px;
	font-weight: 300;
	line-height: 140%;
	color: rgba(0,0,0, .6);
	margin-bottom: 15px;
	}
.content li { 
	list-style-image: url(../img/ulli.png);
	list-style-position: outside;
	margin-left: 18px;
	}
em { 
	color: #796f66;
	font-weight: 400;
	font-style: italic;
	}
b, strong { 
	font-weight: 400;
	font-size: 17px;
	color: rgb(37,82,147);
	}
dt { 
	float: left;
	width: 250px;
	display: block;
	}
sub,
sup { 
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
	}
sup { 
	top: -0.5em;
	}
sub { 
	bottom: -0.25em;
	}
#rightcol img { 
	border: 1px solid #3e3d40;
	}
/* ---------------------------- content links */