/* Start: Recommended Isotope styles */

/**** Isotope Filtering ****/


.img-rounded {
width: 100%;
}

.isotope-item {
	z-index: 2;
}
.isotope-hidden.isotope-item {
	/*pointer-events: none*/;
	z-index: 1;
}

/**** Isotope CSS3 transitions ****/

.isotope, .isotope .isotope-item {
	-webkit-transition-duration: 0.8s;
	-moz-transition-duration: 0.8s;
	-ms-transition-duration: 0.8s;
	-o-transition-duration: 0.8s;
	transition-duration: 0.8s;
}

.isotope {
	-webkit-transition-property: height, width;
	-moz-transition-property: height, width;
	-ms-transition-property: height, width;
	-o-transition-property: height, width;
	transition-property: height, width;
}
.isotope .isotope-item {
	-webkit-transition-property: -webkit-transform, opacity;
	-moz-transition-property:    -moz-transform, opacity;
	-ms-transition-property:     -ms-transform, opacity;
	-o-transition-property:      -o-transform, opacity;
	transition-property:         transform, opacity;
}
/**** disabling Isotope CSS3 transitions ****/

.isotope.no-transition, .isotope.no-transition .isotope-item, .isotope .isotope-item.no-transition {
	-webkit-transition-duration: 0s;
	-moz-transition-duration: 0s;
	-ms-transition-duration: 0s;
	-o-transition-duration: 0s;
	transition-duration: 0s;
}
/* End: Recommended Isotope styles */



/* disable CSS transitions for containers with infinite scrolling*/
.isotope.infinite-scrolling {
	-webkit-transition: none;
	-moz-transition: none;
	-ms-transition: none;
	-o-transition: none;
	transition: none;
}
/**** Base styles ****/

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	padding:0px 0px 0px 0px;
	font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Arial, sans-serif;
	font-size: 13px;
	line-height: 1.7em;
	background: #F2F2F2;
	color: #000;
}
h1, h2, h3, p, ul, ol, pre, dl {
	margin-bottom: 0.6em;
}
h1, h2, #super-list, .element, .tagline, #index-list, .super-list .link {
	font-family: 'Helvetica Neue', Arial, sans-serif;
}

h1 {
	font-size: 10px;
	line-height: 1.1em;
}
h2 {
	font-size: 14px;
	line-height: 1.1em;
}
h8 {
	font-size: 14px;
	line-height: 1.1em;
    text-align: middle;
}
ul, ol {
	margin-left: 1.5em;
}

a, a code {
    color: #fff;
    text-decoration: none;
}
a:hover, a:hover code {
    color: #dc3545;
}


a:active, a:active code {
	color: #1FB;
	background: black;
}
a img {
	border: none;
}
em {
	font-style: italic;
}
strong {
	font-weight: bold;
}
blockquote {
	padding-left: 1.0em;
	margin-left: 1.0em;
	border-left: 1px solid #333;
	font-style: italic;
}
/**** Isotope styles ****/

/* required for containers to inherit vertical size from window */
html, body {
	height: 100%;
}
#container {
	/*  border: 1px solid #666; */
  padding: 5px;
	margin-bottom: 20px;
}
.element {
	width: 130px;
	/*  height: 130px; */
	margin: 5px;
	float: left;
	overflow: hidden;
	position: relative;
	background: #888;
	color: #222;
	-webkit-border-top-right-radius: 1.2em;
	-moz-border-radius-topright: 1.2em;
	border-top-right-radius: 1.2em;
	-webkit-border-bottom-right-radius: 1.2em;
	-moz-border-radius-bottomright: 1.2em;
	border-bottom-right-radius: 1.2em;
	-webkit-border-top-left-radius: 1.2em;
	-moz-border-radius-topleft: 1.2em;
	border-top-left-radius: 1.2em;
	-webkit-border-bottom-left-radius: 1.2em;
	-moz-border-radius-bottomleft: 1.2em;
	border-bottom-left-radius: 1.2em;
-webkit-box-shadow: 5px 0px 10px rgba(0,0,0,2);
-moz-box-shadow: 5px 0px 10px rgba(0,0,0,2);
box-shadow: 8px 8px 12px rgba(0,0,0,2);
}

.element h3{left: 0.2em;top: 0.2em;font-size: 1.5em;line-height: 1.0em;font-weight: bold;font-style: italic;}
.element.large h3{font-size: 4.5em;}
.element.fake h3
.element h2{font-size: 1.2em;left: 0.5em;bottom: 2.5em;}
.element h1{font-size: 1.2em;left: 0.5em;bottom: 2.5em;}
.element p {font-size: 1.2em;left: 0.5em;bottom: 2.5em;}

.element .number {
	font-size: 1.25em;
	font-weight: bold;
	color: hsla(0, 0%, 0%, .5);
	right: 0.5em;
	top: 0.5em;
}
.variable-sizes .element.width2 {
	width: 230px;
}
.variable-sizes .element.height2 {
	height: 230px;
}
.variable-sizes .element.width2.height2 {
	font-size: 2.0em;
}
.element.large, .variable-sizes .element.large, .variable-sizes .element.large.width2.height2 {
	font-size: 3.0em;
	width: 350px;
	height: 350px;
	z-index: 100;
}
.clickable .element:hover {
}
.clickable .element:hover h3 {
	text-shadow:
 0 0 10px white,  0 0 10px white;
}
.clickable .element:hover h2 {
	text-shadow:
 0 0 10px white,  0 0 10px white;
	color: white;
	cursor: pointer;
}
.clickable .element:hover h1 {
	text-shadow:
 0 0 10px white,  0 0 10px white;
}
/**** Example Options ****/

#options {
	padding: 0 0 1.0em 1.0em;
}
#options h3 {
	margin-bottom: 0.2em;
	font-size: 15px;
}
#options h4 {
	font-weight: bold;
}
#options ul {
	margin: 0;
	list-style: none;
}
#options ul ul {
	margin-left: 1.5em;
}
#options li {
	float: left;
	margin-bottom: 0.2em;
}
#options li a {
	display: block;
	padding: 0.4em 0.5em;
	background-color: #DDD;
	color: #222;
	font-weight: bold;
	text-shadow: 0 1px hsla( 0, 0%, 100%, 0.5 );
	background-image: -webkit-linear-gradient( top, hsla( 0, 0%, 100%, 0.5 ), hsla( 0, 0%, 100%, 0.0 ) );
	background-image:    -moz-linear-gradient( top, hsla( 0, 0%, 100%, 0.5 ), hsla( 0, 0%, 100%, 0.0 ) );
	background-image:     -ms-linear-gradient( top, hsla( 0, 0%, 100%, 0.5 ), hsla( 0, 0%, 100%, 0.0 ) );
	background-image:      -o-linear-gradient( top, hsla( 0, 0%, 100%, 0.5 ), hsla( 0, 0%, 100%, 0.0 ) );
	background-image:         linear-gradient( top, hsla( 0, 0%, 100%, 0.5 ), hsla( 0, 0%, 100%, 0.0 ) );
}
#options li a:hover {
	background-color: #000000;
	color: white;
}
#options li a:active {
	background-color: #39D;
	-webkit-box-shadow: inset 0 2px 8px hsla( 0, 0%, 0%, 0.6 );
	-moz-box-shadow: inset 0 2px 8px hsla( 0, 0%, 0%, 0.6 );
	-o-box-shadow: inset 0 2px 8px hsla( 0, 0%, 0%, 0.6 );
	box-shadow: inset 0 2px 8px hsla( 0, 0%, 0%, 0.6 );
}
#options li a {
	border-left:  1px solid hsla( 0, 0%, 100%, 0.3 );
	border-right: 1px solid hsla( 0, 0%, 0%, 0.2 );
}
#options li:first-child a {
	border-radius: 7px 0 0 7px;
	border-left: none;
}
#options li:last-child a {
	border-radius: 0 7px 7px 0;
}
#options li a.selected {
	background-color: #FF0000;
	text-shadow: none;
	color: white;
}
/* Combination filter options*/

#options .option-combo {
	display: inline-block;
	float: left;
	margin-right: 10px;
}
#options .option-combo ul {
	margin-right: 20px;
	display: inline-block;
}
#options .option-combo h2, #options .option-combo h4 {
	line-height: 34px;
	margin-bottom: 0;
	margin-right: 5px;
	display: inline-block;
	vertical-align: top;
}

/**** Horizontal ****/

.horizontal #container {
	height: 80%;
}
#copy {
	max-width: 640px;
}

/**** Doc page nav ****/



#site-nav {
	width: 200px;
	position: absolute;
	left: 10px;
	top: 0px;
	padding-top: 20px;
	font-size: 12px;
}
#site-nav h1 {
	font-size: 24px;
	margin-bottom: 0.5em;
	margin-top: 0;
	font-weight: bold;
	font-family: 'Helvetica Neue', Arial, sans-serif;
}
#site-nav h2 {
	font-size: 17px;
	font-weight: normal;
	margin: 0 0 0.3em;
	border-top: none;
}
#site-nav h1 a {
	color: #4FB;
}
#site-nav h1 a:hover {
	color: #4BF;
}
#site-nav ul {
	list-style: none;
	margin: 0 0 1.0em;
	font-weight: bold;
}
#site-nav ul ul {
	margin-bottom: 0;
}
#site-nav ul a {
	display: block;
	border: none;
	padding: 1px 5px;
}
#site-nav ul .current a {
	background: hsla( 0, 0%, 0%, 0.3 );
	color: #1BF;
}
#site-nav ul a:hover, #site-nav ul .current a:hover {
	color: #005580;
}
#site-nav ul .current .toc a {
	font-size: 12px;
	padding-left: 1.2em;
	font-weight: normal;
}

/**** Sites using Isotope ****/

#sites h2 {
	display: none;
	padding: 0.4em;
	line-height: 32px;
	margin-bottom: 0.4em;
	-webkit-transition: background-color 0.8s;
	-moz-transition: background-color 0.8s;
	-o-transition: background-color 0.8s;
	transition: background-color 0.8s;
}
#sites h2 img {
	display: inline-block;
	margin-right: 0.4em;
	vertical-align: bottom;
}
#sites h2.loading {
	background: white;
	color: #222;
}
#sites h2.error {
	background: red;
	color: #222;
}
#sites ul {
	margin: 0;
}

/* The Magnificent Clearfix: nicolasgallagher.com/micro-clearfix-hack/ */
.clearfix:before, .clearfix:after {
	content: "";
	display: table;
}
.clearfix:after {
	clear: both;
}
.clearfix {
	z-index: 1;
}
/**** disabling Isotope CSS3 transitions ****/

.isotope.no-transition,
.isotope.no-transition .isotope-item,
.isotope .isotope-item.no-transition {
  -webkit-transition-duration: 0s;
     -moz-transition-duration: 0s;
      -ms-transition-duration: 0s;
       -o-transition-duration: 0s;
          transition-duration: 0s;
}

/* style from wpd */
.frame{width: 350px; text-align: left; margin:0 auto}
.frameslide{width: 736px; text-align: left; margin:0 auto}
.framebotschafter{width: 765px; text-align: left; margin:0 auto}
.frame4{width: 400px; text-align: left; margin:0 auto}
.framed{width: 500px; text-align: left; margin:0 auto}
.framefund{width: 550px; text-align: left; margin:0 auto}
.industry, .diplomacy, .history, .country, .chocolate, .canton, .sweets, .drinks, .cheese, .food, .dishes, .fashion, .household, .body, .other, .politics, .sport, .science, .other, .whatever, .art, .Ostschweiz, .ZH, .Zentralschweiz, .Nordwestschweiz, .Mittelland, .lemanique, .Tessin, .science, .popular, .classic, .luxury, .department, .discounter, .dealer, .daily, .deluxe { background: #ED1C25; }
.disqus a:link, a:hover, a:active {color:#27408B;}
.text-box {margin: 5px; color: #fff; float: left; font-size: 10px; line-height: 1.3em; padding: 10px;}
.ads-box {width: 200px; margin: 5px; color: #fff; float: left; font-size: 10px; line-height: 1.3em; padding: 10px;}
img.c1 {vertical-align:middle}
div.c6 {text-align: center;}
img.c5 {width: 280px; height: 94x;}
div.c4 {margin: 0 auto; text-align: right; width: 120px}
div.c3 {width:120px; margin:0 auto;}
span.c2 {font-weight: bold;}
img.c2 {vertical-align:middle}
div.cd {text-align: center; font-size: 24px}
img.cdp {width: 260px;}