/* CSS Document */
{
 box-sizing: border-box;
}
body  {
	margin: 0 4%;
	max-width: 1400px;
	font-family: "Calibri light", Arial, Helvetica, Verdana, sans-serif;
	color: #666;
}

/* +++++ TEXT +++++ */
p {
	font-size: 120%;
	padding: 0 10px;
}
p.header { /* _iz_maglow */
	font-size: 270%;
	font-family:"Lucida Console", Monaco, monospace;
	font-weight: bold;
	color: #c00;
	text-align: right;
	margin-top: 10px; /* bestimmt auch position NAVBAR */
 	margin-bottom: 0;
}
.art-title { /* art */
	font-size: 80%;
}
.art-technic { /* art */
	font-size: 80%;
}
.anka { /* LINK-ANKER-DOT usichtbar */
	font-size: 1px;
	color:#fff;
}
h1 { /* alle Seiten */
	font-size: 12px;
	font-weight: normal;
	letter-spacing: 1px;
	color: #999;
	text-align: left;
	margin: 0;
	padding: 0 10px;
}
h2 { /* alle Seiten */
	font-size: 180%;
	font-weight: bold;
	color: #666;
	margin-bottom: 0;
	padding: 0 10px;
}
h3 { /* WAAGE & NEWS Subtitles */
	font-size: 120%;
	font-weight: bold;
	color: #666;
	padding: 0 10px;
}
ul, li { /* noch nicht */
	font-size: 105%;
	font-weight: normal;
	color: #666;
	margin-left: 10px;
	list-style-position: outside;  /* Einzug bleibt ausserhalb */
}
.small { /* h2 */
	font-size: 60%;
	color: #666;
}
.backlinx {
	display: none;
}

.crumb {
	display: none;
	/*font-size:10px;
	color: #999;*/
}

/* +++++ STICKY NAVBAR w JS +++++ */
#navbar {
	overflow: hidden;
	background-color: #fff;
	border-top: dotted;
	border-top-color: #c00;
	width: 100%;
}

#navbar a:link, #navbar a:visited {
	float: left;
	display: block;
	font-size: 140%;
	font-style: normal;
	color: #333;
	border-style: solid;
	border-width: thin;
	border-color: #fff;
	/*border-top: solid;
	border-top-color: #fff;
	border-right: solid;
	border-right-color: #fff;
	border-bottom: solid;
	border-bottom-color: #fff;
	border-left: solid;
	border-left-color: #fff;*/
	text-align: center;
	alignment-adjust: baseline;
	padding: 0px 6px;
	text-decoration: none;
}

#navbar a:hover {
	color: #c00;
	background-color: #FF6;
	border-style: solid;
	border-width: thin;
	border-color: #c00;
	/*border-top: solid;
	border-top-color: #c00;
	border-right: solid;
	border-right-color: #c00;
	border-bottom: solid;
	border-bottom-color: #c00;
	border-left: solid;
	border-left-color: #c00;*/
}

#groupbar {
	clear: both;
	float:left;
	background-color: #ddd;
}
#navgroup a:link, #navgroup a:visited {
	float: left;
	display: block;
	font-size: 100%;
	color: #fff;
	text-align: center;
	alignment-adjust: middle;
	margin: 0 2px;
	padding: 2px 3px;
	text-decoration: none;
}
#navgroup a:hover {
	color: #fff;
}
#navgroup a.active {
	background-color: #ccc;
}
#detailbar {
	clear: both;
	float: left;
	background-color: #eee
}
#navdetail a:link, #navdetail a:visited {
	float: left;
	display: block;
	font-size: 100%;
	color: #ccc;
	text-align: center;
	alignment-adjust: middle;
	margin: 0 2px;
	padding: 2px 3px;
	text-decoration: none;
}
#navdetail a:hover {
	color: #fff;
}

/* ++++++++++ READ MORE BUTTON ++++++++++ */
#more {
	display: none;
	background-color: #fff;
	border-color:transparent;
}
#more2 {
	display: none;
	background-color: #fff;
	border-color:transparent;
}
#more3 {
	display: none;
	background-color: #fff;
	border-color:transparent;
}
#more4 {
	display: none;
	background-color: #fff;
	border-color:transparent;
}
.button {
    background-color: #fff;
    border: none;
	font-family: "Calibri light", Arial, Helvetica, Verdana, sans-serif;
    color: #900;
    text-align: left;
	font-style: italic;
    text-decoration: none;
    display: inline-block;
    font-size: 110%;
	padding: 0 10px;
    cursor: pointer;
}
.button:hover {
	color: #c00;
	text-decoration:underline;
}

/* +++++ MAIN CONTAINER +++++ */
.container-header {
	max-width: 1400px;
	/* background-image: url(../images/bg-head-index.gif);
background-position: center;
    background-repeat: no-repeat;
    background-size: cover; */
}
.content {
	max-width: 1400px; /* to limit for wide screen */
	margin: 0;
	text-align: left;
}

.container-25, .container-25b { /* START SEITE */
	float: left;
	width: 25%;
	border-top-color: #c00;
	border-top-style: dotted;
	border-top-width: thin;
}

.container-33 { /* INTRO SEITE */
	float: left;
	width: 33%;
	border-top-color: #c00;
	border-top-style: dotted;
	border-top-width: thin;
}

.container-50 { /* THEMEN GRUPPEN */
	float: left;
	width: 50%;
}
.container-100 { /* THEMEN GRUPPEN */
	float: left;
	width: 100%;
}
.border-top { /* THEMEN GRUPPEN */
	border-top-color: #c00;
	border-top-style: dotted;
	border-top-width: thin;
}
/* +++++ NEWS STARTSEITE +++++ */

.container-textblock { /* NEWS */
	float: right;
	width: 75%; /* to limit for wide screen */
	margin-right: 10px;
	text-align: left;
}
.artbox50 {
	float: left;  /* NEWS */
	width: 46%;
	padding-left: 10px;
}

/* +++++ ICONS STARTSEITE +++++ */
.box10 {
	float: left; 
	width: 48%;
	text-align: center;
}
.icon {
	font-size: 80%;
	text-transform: uppercase;
	text-decoration: none;
}
/* POSTCARDS */
.cardbox100, .cardbox100c {
	float: left;
	width: 110px;
	text-align: center;
	font-size: 80%;
}
.cardbox100b {
	clear: left;
	float: left;
	width: 110px;
	text-align: center;
	font-size: 80%;
}

/* +++++ CV & UPDATE +++++ */
#row-dashed {
	clear: both;  /* CV */
	width: 100%;
	text-align: left;
	border-bottom-color: #c00;
	border-bottom-style: dashed;
	border-bottom-width: medium;
}
#row-solid {
	clear: both;  /* CV, REFERENCE */
	width: 100%;
	text-align: left;
	border-bottom-color: #c00;
	border-bottom-style: dotted;
	border-bottom-width: thin;
}
#box20 {
	float: left;	/* CV, UPDATE */
	width: 20%;
}
#box25 {
	float: left;	/* CV */
	width: 25%;
}
#box30 {
	float: left;	/* CV */
	width: 30%;
}
#box55 {
	float: left;	/* CV */
	width: 55%;
}
#box80 {
	float: left;	/* CV, UPDATE */
	width: 80%;
}

/* +++++ FOOTER +++++ */
.container-footer {
	max-width: 1400px;
	background-color: #ccc;
	text-align: center;
	padding: 5px 0;
}
.footer {
	font-size: 80%;
	color: #333;
	text-decoration: none;
	padding: 0 10px;
}
.footer a:link .footer a:visited {
	font-size: 80%;
	color: #333;
	text-decoration: none;
}
.footer a:hoover {
	text-decoration: underline;
}

/* HISTORIC SAMPLE */
.bubblebox100 { /* HISTORIC 3 */
	float: left;
	width: 100%;
	background: url(../images/history/bgmain.jpg) fixed;
	text-align: center;
}
.starbox100 { /* HISTORIC 1 & 2 */
	float: left;
	width: 100%;
	background: url(../images/history/starwall.gif) fixed;
	text-align: center;
}
/*#box40-left {  noch nicht
	float: left;
	width: 25%;
	padding-left: 15%;
} */
/* #box60-right { noch nicht
	float: right;
	width: 60%;
	clear: right;
} */



.center {
	text-align: center;
}
#content-center { /* OLD */
	text-align: center;
}
#row {
	clear: both;
	width: 100%;
	text-align: left;
}

/* IMAGES */
.auto-container { /* noch nicht */
	float: left;
	width: auto;
	margin: 10px;
	padding: 10px;
}
.leftbox {  /* INTRO GRUPPEN */ 
	float: left;
	padding: 5px 10px;
	display: inline;
}
.rightbox {  /* INTRO GRUPPEN */
	float: right;
	padding: 5px 10px 5px 10px;
	display: inline;
}
div.imagecaption160lft { /* Waage */
	float: left;
	width: 160px;
	padding: 5px 10px 5px 10px;
	display: inline;
	font: normal 60% Verdana, Arial, Helvetica, sans-serif;
	color: #666;
	text-transform: uppercase;
	text-align: center;
}
.adjustimage { /* ALL IMAGES */
	max-width: 100%;
	height: auto;
}
/* LINKS */
a:link, a:visited {
	font-family: "Calibri light", Arial, Helvetica, Verdana, sans-serif;
	font-size: 110%;
	font-weight: normal;
	font-style: italic;
	color: #900;
	background-color: transparent;
	text-decoration: none;
}
a:hover {
	color: #c00;
	text-decoration: underline;
}

/* Responsive layout - when the screen is less than 700px wide, make the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 768px) { /* medium: 768, large device: 992, 1200 */
#navbar a:link, #navbar a:visited {
	font-size: 120%;
}
.container-25, { /* STARTSEITE */
	float: left;
	width: 50%;
}
.container-25b, { /* STARTSEITE */
	clear: both;
	float: left;
	width: 50%;
}
.container-50 { /* THEMEN GRUPPEN */
	float: left;
	width: 100%;
}
.container-textblock { /* NEWS */
	width: 100%;
}
.box-footer { /* noch nicht */
	font: left;
}
} /* unused? */

/* Responsive layout - when the screen is less than 400px wide, make the navigation links stack on top of each other instead of next to each other */
@media screen and (max-width: 620px) {
/*.navbar a {
	float: none;
	width: 100%;
	padding: 8px 16px;
} */
#navbar a:link, #navbar a:visited {
	font-size: 100%;
}
p {
	font-size: 110%;
}
p.header { /* _iz_maglow */
	font-size: 200%;
}
.container-25, .container-25b { /* STARTSEITE */
	clear: both;
	float: left;
	width: 100%;
}
.container-33 { /* INTRO SEITE */
	clear: both;
	float: left;
	width: 100%;
}
.container { /* Intro / Text on Image */
	float: left;
	width: 100%;
}
.artbox50 {  /* NEWS */
	float: left;
	width: 100%;
}
#box20 {
	float: left;  /* CV, UPDATE */
	width: 100%;
}
#box25 {
	float: left;  /* CV */
	width: 100%;
}
#box30 {
	float: left;  /* CV */
	width: 100%;
}
#box50 {
	float: left;  /* CV */
	width: 100%;
}
#box55 {
	float: left;  /* CV */
	width: 100%;
}
#box80 {
	float: left;  /* CV, UPDATE */
	width: 100%;
}
.button-container { /* noch nicht */
	clear: both;
	float: left;
	width: 100%;
}
#box40-left { /* noch nicht */
	float: left;
	width: 100%;
	text-align:left;
	padding-left: 5px; /* Einzug Text vom Rand */
}
#box60-right { /* noch nicht */
	float: left;
	width: 100%;
	text-align: left;
	padding-left: 5px; /* Einzug EUR vom Rand */
}
#box-kontakt { /* noch nicht */
	float: left;
	width: 100%;
	clear: right;
}
}
