/*
* Skeleton V1.2
* Copyright 2011, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 6/20/2012
*/

/* Table of Content
==================================================
	#Site Styles
	#Page Styles
	#Media Queries
	#Font-Face */

/* #Site Styles
================================================== */

/* #Page Styles
================================================== */

.media-default {display: inherit !important; text-align: center;}

.media-max-1155 {display: none !important;}
.media-min-818-max-1155 {display: none !important;}
.media-max-817 {display: none !important;}
.media-min-480-max-817 {display: none !important;}
.media-max-479 {display: none !important;}


/* #Media Queries
================================================== */

	/* Smaller than standard 960 (devices and browsers) */
	@media only screen and (max-width: 1155px) {

		.media-max-1155 {display: inherit !important; text-align: center;}
		.media-default {display: none !important;}

	}


	/* Tablet Portrait size to standard 960 (devices and browsers) */
	@media only screen and (min-width: 818px) and (max-width: 1155px) {

		.media-min-818-max-1155 {display: inherit !important; text-align: center;}
		.media-default {display: none !important;}

		body {font-size: 80%;}

		.container .line-top,
		.container .line-bottom {width: 778px !important;}

		.container .logo {margin: 0 5px 20px 5px !important;}


		/* search */

		html .search {
			font-size: 100%;
			margin: 5px 15px 5px 10px;
		}


		/* #STAGE I
		================================================== */

			.stage {
				width: 778px !important;
				min-height: inherit;
			}

				.stage h2 {font-size: 18px; line-height: 22px; margin-bottom: 10px;}

				.stage p {
					margin: 0 0 12px 0;
					line-height: 18px;
				}

				.stage img {
					width: 470px;
					height: auto;
					display: inline;
					float: left;
				}

				.stage-txt {
					width: 268px;
					height: 216px;
					padding: 20px 20px 0 20px;
					display: inline;
					float: right;
				}

				.stage-before a,
				.stage-before a:link,
				.stage-before a:visited,

				.stage-next a,
				.stage-next a:link,
				.stage-next a:visited {bottom: 30px;}


		ul.lang {
				width: auto;
				text-align: right;
				margin: 9px 0 0 0;
				padding: 0;
				display: inline;
				float: right !important;
		}

		ul.socials {
				width: auto;
				margin: -5px 0 0 40px;
				padding: 0;
				display: inline;
				float: right;
			}




		/* #STAGE II
		================================================== */

			.stage2 {min-height: 200px !important;}

				.stage2-txt {
					width: 430px;
					min-height: 190px;
					padding: 20px 20px 0 20px;
				}

				.stage2 h3 {
					font-size: 22px;
					margin-bottom: 4px;
				}

				.stage2-more {
					width: 238px;
					font-size: 110%;
					min-height: 117px;
					padding: 93px 30px 0 40px;
				}


		/* #STAGE SUBPAGES
		================================================== */

		html .stage-sub {min-height: 233px;}

			.bubble {
				top: 20px;
				margin: 0 86px 0 0;
			 }


		/* #CONTENT DEFAULT
		================================================== */

		p {
			margin: 0 0 12px 0;
			line-height: 18px;
		}

		html .container #content-sub .one.columns,
		html .container #content-sub .one.column {display: none !important;}

		html .container main #content-sub .four.columns {
			width: 230px;
			margin: 0 15px 0 20px;
		}

		html .container main #content-sub .nine.columns {
			width: 470px;
			margin: 0 20px 0 13px;
		}

			#content-sub p {
				margin: 0 0 12px 0;
				line-height: 18px;
			}

				#content-sub .nine.columns p {
					margin: 0 0 12px 0;
					line-height: 19px;
				}

			.stage-header h1 {
				font-size: 22px;
				line-height: 34px;
				margin-bottom: 8px;
			}

			#content-sub h1,
			#content-sub .four h2 {
				font-size: 16px;
				line-height: 20px;
			}

			#content-sub .four h1 {
				font-size: 16px;
				line-height: 30px;
				margin-bottom: 14px;
			}

			#content-sub .nine h4 {
				font-size: 16px;
				margin: 18px 0 7px 0;
			}

			#content-sub .nine h2 {
				font-size: 16px;
				line-height: 30px;
				margin: 28px 0 7px 0;
			}


		/* #STAGE SUBPAGES TXT
		================================================== */

		.stage-header header {
			font-size: 110%;
			margin: 20px;
		}

			#content-sub.style1 {margin: 30px 0 27px 0;}

			#content-sub.style2 {margin: 30px 0 15px 0;}


		/* #PAGEBROWSER
		=========================== */

		.pagebrowser div {margin: 0 0 11px 0;}

		.pagebrowser ol {margin: 0 0 19px 0;}

			.pagebrowser ol li {font-size: 100%;}

					html .no-more-first,
					html .no-more-last {
						font-size: 120% !important;
						padding: 3px 8px 3px 8px !important;
					}


		/* #SEARCH RESULT LIST
		=========================== */

		.search-result {margin: 0 0 10px 0;}


		/* #NEWS
		=========================== */

		.news {margin: 0 0 20px 0;}

			.news-dl img {
				width: 30px;
				height: auto;
			}

			.news-dl p {padding: 15px 10px 0 0;}


		/* #CATS HOME
		================================================== */

		#content .four {height: auto;}

		#content>.four h2 a {
			width: 167px;
			height: 38px;
			font-size: 13px;
			margin: 5px 0 0 0;
			padding-top: 15px;
			padding-left: 15px;
			display: inline;
			float: left;
			text-decoration: none;
		}

			#content>.four h2 a:after {content: normal !important;}

		#content>.four p {
			width: 142px;
			line-height: 110%;
			height: 92px;
			margin: 0;
			padding: 20px 20px 0 20px;
		}


		/* #SITEMAP
		=========================== */

		ul#sitemap {
			width: 230px;
			margin-left: 15px;
		}

			ul#sitemap a,
			ul#sitemap a:link,
			ul#sitemap a:visited {
				width: 230px;
				font-size: 16px;
				padding: 0 0 49px 0;
			}

				ul#sitemap ul {
					width: 470px;
					margin: -81px 0 0 260px;
					padding: 0 0 20px 0;
				}

					ul#sitemap ul li {width: 136px;}

						ul#sitemap ul li a,
						ul#sitemap ul li a:link,
						ul#sitemap ul li a:visited {width: 136px;}


		/* #BREADCRUMB
		================================================== */

		html #breadcrumb ul {margin: 10px 0 8px 10px;}

			#breadcrumb li:before {margin: -2px 5px 0 0;}


		/* #URLs
		================================================== */

		#content-sub .nine a,
		#content-sub .nine a:link,
		#content-sub .nine a:visited {
			color: #008ADD;
			background: transparent url(../graphic/bg/arrow-s.png) right -22px no-repeat;
			padding: 1px 16px 1px 2px;
		}

		#content-sub .nine a:hover,
		#content-sub .nine a:active,
		#content-sub .nine a:focus {
			color: #1A181B;
			background: #EFF1F4 url(../graphic/bg/arrow-s.png) right -46px no-repeat;
		}

		#content-sub .nine a.mail,
		#content-sub .nine a.mail:link,
		#content-sub .nine a.mail:visited {
			color: #008ADD;
			background: transparent url(../graphic/bg/mail.png) right 3px no-repeat;
		}

		#content-sub .nine a.mail:hover,
		#content-sub .nine a.mail:active,
		#content-sub .nine a.mail:focus {
			color: #1A181B;
			background: #EFF1F4 url(../graphic/bg/mail.png) right -38px no-repeat;
		}

		.stage-txt a, .stage-txt a:link, .stage-txt a:visited {
			color: #1A181B;
			background: transparent url(../graphic/bg/arrow2-s.png) right -21px no-repeat;
			margin-right: 5px;
			margin-left: -4px;
			padding: 1px 16px 0 4px;
		}

		.stage-txt a:hover,
		.stage-txt a:active,
		.stage-txt a:focus {
			color: #008ADD;
			background: #FFF url(../graphic/bg/arrow2-s.png) right -46px no-repeat;
		}

		.stage2 a,
		.stage2 a:link,
		.stage2 a:visited {
			color: #008ADD;
			background: transparent url(../graphic/bg/arrow-s.png) right -22px no-repeat;
			padding: 0 16px 1px 2px;
		}

		.stage2 a:hover,
		.stage2 a:active,
		.stage2 a:focus {
			color: #1A181B;
			background: #FFF url(../graphic/bg/arrow-s.png) right -47px no-repeat;
		}

		.stage2-more a,
		.stage2-more a:link,
		.stage2-more a:visited {
			color: #FFF;
			background: transparent url(../graphic/bg/arrow-s.png) right 3px no-repeat;
			margin-right: 5px;
			margin-left: -4px;
			padding: 1px 16px 1px 4px;
		}

		.stage2-more a:hover,
		.stage2-more a:active,
		.stage2-more a:focus {
			color: #008ADD;
			background: #FFF url(../graphic/bg/arrow-s.png) right -21px no-repeat;
		}

		#content-sub a.news-more,
		#content-sub a.news-more:link,
		#content-sub a.news-more:visited,

		#content-sub a.search-more,
		#content-sub a.search-more:link,
		#content-sub a.search-more:visited {
			color: #1A181B;
			background: #D8D6D7 url(../graphic/bg/arrow2-s.png) 80px -16px no-repeat;
			padding: 4px 24px 5px 12px;
		}

			#content-sub a.search-more,
			#content-sub a.search-more:link,
			#content-sub a.search-more:visited {
				background: #D8D6D7 url(../graphic/bg/arrow2-s.png) 98px -16px no-repeat;
				padding: 4px 24px 5px 12px;
			}

		#content-sub a.news-more:hover,
		#content-sub a.news-more:active,
		#content-sub a.news-more:focus,

		#content-sub a.search-more:hover,
		#content-sub a.search-more:active,
		#content-sub a.search-more:focus {
			color: #008ADD;
			background: #EFF1F4 url(../graphic/bg/arrow2-s.png) 80px -40px no-repeat;
			text-decoration: none;
		}

			#content-sub a.search-more:hover,
			#content-sub a.search-more:active,
			#content-sub a.search-more:focus {background: #EFF1F4 url(../graphic/bg/arrow2-s.png) 98px -40px no-repeat;}


			#content-sub a.news-back,
			#content-sub a.news-back:link,
			#content-sub a.news-back:visited {
				color: #1A181B;
				background: #D8D6D7 url(../graphic/bg/arrow.png) 10px -110px no-repeat;
				padding: 6px 16px 7px 25px;
			}

			#content-sub a.news-back:hover,
			#content-sub a.news-back:active,
			#content-sub a.news-back:focus {
				color: #008ADD;
				background: #EFF1F4 url(../graphic/bg/arrow.png) 10px -87px no-repeat;
			}

		/* #NAVIGATION
		================================================== */

		/* nav link */
		html #nav a,
		html #nav a:link,
		html #nav a:visited {padding: 9px 15px 9px 15px;}

		/* nav link sub 1 */
		html #nav li ul li a,
		html #nav li ul li a:link,
		html #nav li ul li a:visited {
			font-size: 110%;
			padding: 8px 15px 6px 15px;
		}


		/* #FOOTER
		================================================== */

		.footer {
			font-size: 95%;
			padding: 20px 0 8px 5px;
		}

		.footer h3 {
			font-size: 14px;
			line-height: 18px;
			margin-bottom: 10px;
			font-weight: 700;
			letter-spacing: 0;
			/* letter-spacing: 0.5px;  */
		}

		.footer h4 {
			font-size: 12px;
			line-height: 16px;
			margin-bottom: 4px;
			letter-spacing: 0;
		}

	}

	/* All Mobile Sizes (devices and browser) */
	@media only screen and (max-width: 817px) {

		.media-max-817 {display: inherit !important; text-align: center;}
		.media-default {display: none !important;}

	}


	/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
	@media only screen and (min-width: 480px) and (max-width: 817px) {

		.media-min-480-max-817 {display: inherit !important; text-align: center;}
		.media-default {display: none !important;}


		/* #STAGE I
		================================================== */

		body {font-size: 100%;}

		.container .line-top {
			width: 420px !important;
			margin: 0 0 15px 0 !important;
			padding: 0 !important;
		}

		.container .line-bottom {
			width: 420px !important;
			margin: 15px 0 0 0 !important;
			padding: 0 !important;
		}

		.container .logo {
			text-align: center;
			margin: 0 !important;
		}

		ul.lang {
			width: 100%;
			text-align: center;
			margin: 25px 0 0 0;
			padding: 0 0 25px 0;
			display: block;
			float: inherit !important;
		}

		ul.socials {
			width: auto;
			text-align: center;
			margin: 15px 0 15px 175px;
			padding: 0;
			display: inline !important;
			float: inherit !important;
		}

			ul.socials li {
				display: inline !important;
				float: inherit !important;
			}

				ul.socials li a {
					display: block;
					float: inherit !important;
				}

			.stage {
				width: 420px !important;
				min-height: inherit;
			}

				.stage h2 {font-size: 18px; line-height: 22px; margin-bottom: 10px;}

				.stage p {
					margin: 0 0 12px 0;
					line-height: 18px;
				}

				.stage img {
					width: 420px;
					height: auto;
					display: inline;
					float: left;
				}

				.stage-txt {
					width: 370px;
					height: auto;
					padding: 20px 20px 10px 20px;
					margin: 0;
					display: inline;
					float: left;
				}

				.stage-before a,
				.stage-before a:link,
				.stage-before a:visited,

				.stage-next a,
				.stage-next a:link,
				.stage-next a:visited {bottom: 30px;}


		/* search */

		html form.search  {}

		.search {
			width: 210px;
			margin: 5px 0 10px 103px !important;
			display: inline;
			float: left;
		}


		/* #STAGE II
		================================================== */

			.stage2 {min-height: 200px !important;}

				.stage2-txt {
					width: 370px;
					min-height: 190px;
					padding: 20px 20px 12px 20px;
				}

				.stage2 h3 {
					font-size: 22px;
					margin-bottom: 4px;
				}

				.stage2-more {
					width: 420px;
					font-size: 110%;
					min-height: 0;
					text-align: center !important;
					padding: 30px 0 20px 0;
					margin: 0;
					float: left;
				}


		/* #STAGE SUBPAGES
		================================================== */

		.stage-sub .stage-image {
			max-height: 300px;
			overflow: hidden;
		}

		.stage-sub img {
			width: 100%;
			height: auto;
			/*
			clip: rect(auto auto 300px auto);
			overflow: hidden;
			*/
			/*height: 300px;*/
			/*left: -130px;*/
			/*clip: rect(auto 550px auto 130px);*/
		}


		/*html .stage-sub {min-height: 300px;}*/

			 .bubble {
				width: 260px;
				top: 20px;
				margin: 0 20px 0 0;
			 }

				 .bubble p {font-size: 80%;}

				.example-obtuse {padding: 10px 10px 1px 10px;}

					/* display of quote author (alternatively use a class on the element following the blockquote) */
					.example-obtuse + p {margin: 4px 85px 2em 0;}

						/* creates the larger triangle */
							.example-obtuse:before {
								bottom: -30px;
								right: 20px;
							}


		/* #CONTENT DEFAULT
		================================================== */

		p {
			margin: 0 0 12px 0;
			line-height: 22px !important;
		}

		html .container #content-sub .one.columns,
		html .container #content-sub .one.column {display: none !important;}

			/*  
			
			html .container main #content-sub:first-child .four.columns {
		   width: 380px;
		   margin: 0 0 20px 0;
		   padding: 0 20px 20px 20px;
		   border-bottom: 1px solid #D6D6D7;
		}
	
		html .container main #content-sub:first-child .four.columns nav { } */

html .container main #content-sub:first-child .four.columns nav {display: none;}

		html .container main #content-sub {
			width: 380px;
			margin: 20px 0 5px 0;
		}

			html .container main #content-sub .four.columns,
			html .container main #content-sub .nine.columns {
				width: 380px;
				margin: 0 20px 0 20px;
			}

				#content-sub p {
					margin: 0 0 12px 0;
					line-height: 18px;
					-moz-hyphens: auto;
					-o-hyphens: auto;
					-webkit-hyphens: auto;
					-ms-hyphens: auto;
					hyphens: auto;
				}

					#content-sub .nine.columns p {
						margin: 2px 0 12px 0;
						line-height: 18px;
					}

				.stage-header h1 {
					font-size: 22px;
					line-height: 34px;
					margin-bottom: 8px;
				}

				#content-sub h1,
				#content-sub .four h2 {
					font-size: 18px;
					line-height: 20px;
				}

				#content-sub .four h1 {
					border: 0 !important;
					font-size: 18px;
					line-height: 30px;
					margin: 0 0 8px 0;
				}

				#content-sub .nine h4 {
					font-size: 16px;
					margin: 18px 0 7px 0;
				}

				#content-sub .nine h2 {
					font-size: 16px;
					line-height: 30px;
					margin: 28px 0 7px 0;
				}


		/* #STAGE SUBPAGES TXT
		================================================== */

		.stage-header header {
			font-size: 110%;
			margin: 20px;
		}

			#content-sub.style1 {margin: 30px 0 27px 0;}

			#content-sub.style2 {margin: 30px 0 15px 0;}


		/* #PAGEBROWSER
		=========================== */

		.pagebrowser {
			width: 100%;
			text-align: center;
			margin: -30px 0 0 0;
			display: inline;
			float: left;
		}

			html .pagebrowser:nth-of-type(1) {margin: 0 0 8px 0 !important;}

			.pagebrowser div {
				width: 100%;
				text-align: center;
				margin: 0 0 10px 0;
			}

			.pagebrowser ol {
				width: auto;
				margin: 0 25% 16px 25%;
				padding: 0;
				display: inline;
				float: left;
			}
				.pagebrowser ol li {font-size: 100%;}

				html #content-sub .nine .pagebrowser ol li.x-first a,
				html #content-sub .nine .pagebrowser ol li.x-last a {
					padding-top: 2px !important;
					padding-bottom: 4px !important;
				}

						html .no-more-first,
						html .no-more-last {
							font-size: 120% !important;
							padding: 2px 8px 4px 8px !important;
						}


		/* #SEARCH RESULT LIST
		=========================== */

		.search-result {margin: 0 0 10px 0;}

			#content-sub .nine > .search-result:nth-of-type(4) {margin-bottom: 37px;}


		/* #NEWS
		=========================== */

		.news {margin: 0 0 20px 0;}

			.news-dl {
				border-top: 1px solid #D6D6D7;
				display: block;
				float: left;
				margin: 0 0 -20px 0;
				padding: 5px 0 0 0;
				width: 100%;
			}

				.news-dl img {
					width: 30px;
					height: auto;
					margin: 10px 10px 0 0;
				}

				.news-dl p {
					width: 340px;
					font-size: 90%;
					padding: 2px 0 0 0;
					display: inline;
					float: left;
				}

				.news-links ul,
				.news-links2 ul {
					font-size: 90%;
				}


		/* #CATS HOME
		================================================== */

		#content .four {
			height: 323px;
			margin-bottom: 10px;
		}

			#content>.four:nth-of-type(1):hover,
			#content>.four:nth-of-type(1):active,
			#content>.four:nth-of-type(1):focus {
				color: #FFFFFF;
				background: #294C74 url(../graphic/kacheln/t-dunkelblau.png) center -320px no-repeat;
				background-size: 100%;
			}

			#content>.four:nth-of-type(2):hover,
			#content>.four:nth-of-type(2):active,
			#content>.four:nth-of-type(2):focus {
				color: #FFFFFF;
				background: #294C74 url(../graphic/kacheln/f-dunkelblau.png) center -320px no-repeat;
				background-size: 100%;
			}

			#content>.four:nth-of-type(3):hover,
			#content>.four:nth-of-type(3):active,
			#content>.four:nth-of-type(3):focus {
				color: #FFFFFF;
				background: #294C74 url(../graphic/kacheln/l-dunkelblau.png) center -320px no-repeat;
				background-size: 100%;
			}

			#content>.four:nth-of-type(4):hover,
			#content>.four:nth-of-type(4):active,
			#content>.four:nth-of-type(4):focus {
				color: #FFFFFF;
				background: #294C74 url(../graphic/kacheln/b-dunkelblau.png) center -320px no-repeat;
				background-size: 100%;
			}

			#content>.four:nth-of-type(5):hover,
			#content>.four:nth-of-type(5):active,
			#content>.four:nth-of-type(5):focus {
				color: #FFFFFF;
				background: #294C74 url(../graphic/kacheln/p-dunkelblau.png) center -320px no-repeat;
				background-size: 100%;
			}

			#content>.four:nth-of-type(6):hover,
			#content>.four:nth-of-type(6):active,
			#content>.four:nth-of-type(6):focus {
				color: #FFFFFF;
				background: #294C74 url(../graphic/kacheln/k-dunkelblau.png) center -320px no-repeat;
				background-size: 100%;
			}

			#content>.four:nth-of-type(7):hover,
			#content>.four:nth-of-type(7):active,
			#content>.four:nth-of-type(7):focus {
				color: #FFFFFF;
				background: #294C74 url(../graphic/kacheln/g-dunkelblau.png) center -320px no-repeat;
				background-size: 100%;
			}

			#content>.four:nth-of-type(8):hover,
			#content>.four:nth-of-type(8):active,
			#content>.four:nth-of-type(8):focus {
				color: #FFFFFF;
				background: #294C74 url(../graphic/kacheln/j-dunkelblau.png) center -320px no-repeat;
				background-size: 100%;
			}

		#content>.four h2 a {
			width: 405px;
			height: 38px;
			font-size: 18px;
			padding-top: 15px;
			padding-left: 15px;
		}

			/* #content>.four h2 a:after {content: !important;} */

		#content>.four p {
			width: 380px;
			line-height: 130%;
			height: 242px;
			margin: 0;
			padding: 20px 20px 0 20px;
		}


		/* #SITEMAP
		=========================== */

		ul#sitemap {
			width: 390px;
			margin-left: 15px;
			display: inline;
			float: left;
		}

			ul#sitemap a,
			ul#sitemap a:link,
			ul#sitemap a:visited {
				width: 100%;
				border: 0 !important;
				font-size: 16px;
				padding: 0 0 0 0;
				display: inline;
				float: left;
			}

				ul#sitemap ul {
					width: 100%;
					border: 0 !important;
					margin: 0 0 0 0;
					padding: 0 0 20px 0;
					display: inline;
					float: left;
				}

					ul#sitemap ul li {
						width: 370px;
						margin-left: 20px;
					}

						ul#sitemap ul li a,
						ul#sitemap ul li a:link,
						ul#sitemap ul li a:visited {
							width: 365px;
							padding-left: 5px;
							line-height: 24px !important;
						}


		/* #BREADCRUMB
		================================================== */

		html #breadcrumb ul {
			width: 410px;
			font-size: 80%;
			margin: 0 !important;
			border-top: solid 1px #D6D6D7;
			border-bottom: solid 1px #D6D6D7;
			/* margin: 10px 0 10px 0; */
			padding: 5px;
		}

			#breadcrumb li:before {margin: -2px 5px 0 0;}


		/* #URLs
		================================================== */

		#content-sub .nine a,
		#content-sub .nine a:link,
		#content-sub .nine a:visited {
			color: #008ADD;
			background: transparent url(../graphic/bg/arrow.png) right -19px no-repeat;
			padding: 1px 16px 1px 2px;
		}

		#content-sub .nine a:hover,
		#content-sub .nine a:active,
		#content-sub .nine a:focus {
			color: #1A181B;
			background: #EFF1F4 url(../graphic/bg/arrow.png) right -44px no-repeat;
		}

		#content-sub .nine a.mail,
		#content-sub .nine a.mail:link,
		#content-sub .nine a.mail:visited {
			color: #008ADD;
			background: transparent url(../graphic/bg/mail.png) right 5px no-repeat;
		}

		#content-sub .nine a.mail:hover,
		#content-sub .nine a.mail:active,
		#content-sub .nine a.mail:focus {
			color: #1A181B;
			background: #EFF1F4 url(../graphic/bg/mail.png) right -36px no-repeat;
		}

		.stage-txt a, .stage-txt a:link, .stage-txt a:visited {
			color: #1A181B;
			background: transparent url(../graphic/bg/arrow2.png) right -20px no-repeat;
			margin-right: 5px;
			margin-left: -4px;
			padding: 1px 16px 0 4px;
		}

		.stage-txt a:hover,
		.stage-txt a:active,
		.stage-txt a:focus {
			color: #008ADD;
			background: #FFF url(../graphic/bg/arrow2.png) right -44px no-repeat;
		}

		.stage2 a,
		.stage2 a:link,
		.stage2 a:visited {
			color: #008ADD;
			background: transparent url(../graphic/bg/arrow.png) right -20px no-repeat;
			padding: 0 16px 1px 2px;
		}

		.stage2 a:hover,
		.stage2 a:active,
		.stage2 a:focus {
			color: #1A181B;
			background: #FFF url(../graphic/bg/arrow.png) right -45px no-repeat;
		}

		.stage2-more a,
		.stage2-more a:link,
		.stage2-more a:visited {
			color: #FFF;
			background: transparent url(../graphic/bg/arrow.png) right 5px no-repeat;
			margin-right: 5px;
			margin-left: -4px;
			padding: 1px 16px 1px 4px;
		}

		.stage2-more a:hover,
		.stage2-more a:active,
		.stage2-more a:focus {
			color: #008ADD;
			background: #FFF url(../graphic/bg/arrow.png) right -19px no-repeat;
		}

		#content-sub a.news-more,
		#content-sub a.news-more:link,
		#content-sub a.news-more:visited,

		#content-sub a.search-more,
		#content-sub a.search-more:link,
		#content-sub a.search-more:visited {
			color: #1A181B;
			background: #D8D6D7 url(../graphic/bg/arrow2.png) 98px -15px no-repeat;
			padding: 4px 30px 5px 16px;
		}

			#content-sub a.search-more,
			#content-sub a.search-more:link,
			#content-sub a.search-more:visited {
				background: #D8D6D7 url(../graphic/bg/arrow2.png) 122px -15px no-repeat;
				padding: 4px 30px 5px 16px;
			}

		#content-sub a.news-more:hover,
		#content-sub a.news-more:active,
		#content-sub a.news-more:focus,

		#content-sub a.search-more:hover,
		#content-sub a.search-more:active,
		#content-sub a.search-more:focus {
			color: #008ADD;
			background: #EFF1F4 url(../graphic/bg/arrow2.png) 98px -39px no-repeat;
			text-decoration: none;
		}

			#content-sub a.search-more:hover,
			#content-sub a.search-more:active,
			#content-sub a.search-more:focus {background: #EFF1F4 url(../graphic/bg/arrow2.png) 122px -39px no-repeat;}

			#content-sub a.news-back,
			#content-sub a.news-back:link,
			#content-sub a.news-back:visited {
				font-size: 90%;
				color: #1A181B;
				background: #D8D6D7 url(../graphic/bg/arrow.png) 10px -108px no-repeat;
				padding: 6px 16px 7px 26px;
			}

			#content-sub a.news-back:hover,
			#content-sub a.news-back:active,
			#content-sub a.news-back:focus {
				color: #008ADD;
				background: #EFF1F4 url(../graphic/bg/arrow.png) 10px -85px no-repeat;
			}


		/* #NAVIGATION
		================================================== */

		/* nav link */
		html #nav a,
		html #nav a:link,
		html #nav a:visited {padding: 9px 15px 9px 15px;}

		/* nav link sub 1 */
		html #nav li ul li a,
		html #nav li ul li a:link,
		html #nav li ul li a:visited {
			font-size: 110%;
			padding: 4px 25px 3px 25px;
		}

		/* #FOOTER
		================================================== */

		.footer {
			font-size: 100%;
			padding: 20px 0 8px 5px;
		}


		.footer p {
			line-height: 22px !important;
		}

		.footer h3 {
			font-size: 18px;
			line-height: 22px;
			margin-bottom: 8px;
			font-weight: 700;
			letter-spacing: 0;
			/* letter-spacing: 0.5px;  */
		}

		.footer h4 {
			font-size: 16px;
			line-height: 22px;
			font-weight: 700;
			margin-bottom: 4px;
			letter-spacing: 0;
		}

	}

	/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
	@media only screen and (max-width: 479px) {

		.media-max-479 {display: inherit !important; text-align: center;}
		.media-default {display: none !important;}


		/* #STAGE I
		================================================== */

		body {font-size: 100%;}

		/* 
		
		.container .line-top {
			width: 410px !important;
			margin: 0 0 15px 0 !important;
			padding: 0 !important;
		} 

		.container .line-bottom {
			width: 410px !important;
			margin: 15px 0 0 0 !important;
			padding: 0 !important;
		} 
		
		*/
		
		.container .line-top {
			width: 100% !important;
			margin: 0 0 15px 0 !important;
			padding: 0 !important;
		}
		
		.container .line-bottom {
			width: 100% !important;
			margin: 15px 0 0 0 !important;
			padding: 0 !important;
		}

		.container .logo {
			text-align: center;
			margin: 0 !important;
		}

		ul.lang {
			width: 100%;
			text-align: center;
			margin: 25px 0 0 0;
			padding: 0 0 25px 0;
			display: block;
			float: inherit !important;
		}

		/* ul.socials {
			width: auto;
			text-align: center;
			margin: 25px 0 0 158px;
			padding: 0;
			display: inline !important;
			float: inherit !important;
		} 
		
			ul.socials li {
				display: inline !important;
				float: inherit !important;
			}

				ul.socials li a {
					display: block;
					float: inherit !important;
				}


		.stage {
				width: 410px !important;
				min-height: inherit;
			}

		*/
		
		ul.socials {
			width: auto;
			text-align: center;
			margin: 15px 35% 15px 35%;
			padding: 0;
			display: inline !important;
			float: inherit !important;
		}
		
			ul.socials li {margin: 0 4px;}

				ul.socials li a { }

			.stage {
				width: 100% !important;
				min-height: inherit;
			}

				.stage h2 {font-size: 18px; line-height: 22px; margin-bottom: 10px;}

				.stage p {
					margin: 0 0 12px 0;
					line-height: 18px;
				}

				/* 
				
				.stage img {
					width: 410px;
					height: auto;
					display: inline;
					float: left;
				}

				.stage-txt {
					width: 370px;
					height: auto;
					padding: 20px 20px 10px 20px;
					margin: 0;
					display: inline;
					float: left;
				}
				
				*/
				
				.stage img {
					width: 100%;
					height: auto;
					display: inline;
					float: left;
				}

				.stage-txt {
					width: calc(100% - 40px);
					height: auto;
					padding: 20px 20px 10px 20px;
					margin: 0;
					display: inline;
					float: left;
				}
				

				.stage-before a,
				.stage-before a:link,
				.stage-before a:visited,

				.stage-next a,
				.stage-next a:link,
				.stage-next a:visited {bottom: 30px;}


		/* NAV */
		
		/* menu icon */
		
		#menu-icon {
			width: auto !important; 
			background: #FFF url(../graphic/bg/menu-icon.png) 30% 15px no-repeat !important;
			text-align: center;
			padding: 13px 20% 2px 20%  !important;
		}
		
		/* search */

		html form.search  {}

		/*
		
		.search {
			width: 210px;
			margin: 5px 0 10px 103px !important;
			display: inline;
			float: left;
		} 
		
		*/
		
		 .search {
			width: 80%;
			text-align: center;
			margin: 5px 10% 10px 10% !important;
			display: inline;
			float: left;
		}
		
		
		/* #STAGE II
		================================================== */

			.stage2 {min-height: 200px !important;}

				/*
				
				.stage2-txt {
					width: 370px;
					min-height: 190px;
					padding: 20px 20px 12px 20px;
				}

				.stage2 h3 {
					font-size: 22px;
					margin-bottom: 4px;
				}

				.stage2-more {
					width: 410px;
					font-size: 110%;
					min-height: 0;
					text-align: center !important;
					padding: 30px 0 20px 0;
					margin: 0;
					float: left;
				}
				
				*/
				
				.stage2-txt {
					width: calc(100% - 40px);
					min-height: 190px;
					padding: 20px 20px 12px 20px;
				}

				.stage2 h3 {
					font-size: 22px;
					margin-bottom: 4px;
				}

				.stage2-more {
					width: 100%;
					font-size: 110%;
					min-height: 0;
					text-align: center !important;
					padding: 30px 0 20px 0;
					margin: 0;
					float: left;
				}


		/* #STAGE SUBPAGES
		================================================== */

		.stage-sub .stage-image {
			max-height: 300px;
			overflow: hidden;
		}

		.stage-sub img {
			width: 100%;
			/*
			overflow: hidden;
			clip: rect(auto auto 300px auto);
			*/
			/*height: 300px;
			left: -130px;
			clip: rect(auto 550px auto 130px);*/
		}

		/*html .stage-sub {min-height: 300px;} */

			 .bubble {
				width: 260px;
				top: 20px;
				margin: 0 20px 0 0;
			 }

				 .bubble p {font-size: 80%;}

				.example-obtuse {padding: 10px 10px 1px 10px;}

					/* display of quote author (alternatively use a class on the element following the blockquote) */
					.example-obtuse + p {margin: 4px 85px 2em 0;}

						/* creates the larger triangle */
							.example-obtuse:before {
								bottom: -30px;
								right: 20px;
							}


		/* #CONTENT DEFAULT
		================================================== */

		p {
			margin: 0 0 12px 0;
			line-height: 22px !important;
		}

		html .container #content-sub .one.columns,
		html .container #content-sub .one.column {display: none !important;}

		/* html .container main #content-sub:first-child .four.columns nav {display: none;} 
	  
			html .container main #content-sub:first-child .four.columns {
			   width: 380px;
			   margin: 0 0 20px 0;
			   padding: 0 20px 20px 20px;
			   border-bottom: 1px solid #D6D6D7;
			}
	
		html .container main #content-sub:first-child .four.columns nav { } */

html .container main #content-sub:first-child .four.columns nav {display: none;}

		/* html .container main #content-sub {
			width: 380px;
			margin: 20px 0 5px 0;
		}

			html .container main #content-sub .four.columns,
			html .container main #content-sub .nine.columns {
				width: 380px;
				margin: 0 20px 0 20px;
			} */
			
		
		html .container main #content-sub {
			width: 100%;
			margin: 20px 0 5px 0;
		}

			html .container main #content-sub .four.columns,
			html .container main #content-sub .nine.columns {
				width: calc(100% - 40px);
				margin: 0 20px 0 20px;
				text-align: justify;
			}
			
				.stage-header {text-align: justify;}

				#content-sub p {
					margin: 0 0 12px 0;
					line-height: 18px;
					-moz-hyphens: auto;
					-o-hyphens: auto;
					-webkit-hyphens: auto;
					-ms-hyphens: auto;
					hyphens: auto;
				}

					#content-sub .nine.columns p {
						margin: 2px 0 12px 0;
						line-height: 18px;
					}

				.stage-header h1 {
					font-size: 22px;
					line-height: 34px;
					margin-bottom: 8px;
				}

				#content-sub h1,
				#content-sub .four h2 {
					font-size: 18px;
					line-height: 20px;
				}

				#content-sub .four h1 {
					border: 0 !important;
					font-size: 18px;
					line-height: 30px;
					margin: 0 0 8px 0;
				}

				#content-sub .nine h4 {
					font-size: 16px;
					margin: 18px 0 7px 0;
				}

				#content-sub .nine h2 {
					font-size: 16px;
					line-height: 30px;
					margin: 28px 0 7px 0;
				}


		/* #STAGE SUBPAGES TXT
		================================================== */

		.stage-header header {
			font-size: 110%;
			margin: 20px;
		}

			#content-sub.style1 {margin: 30px 0 27px 0;}

			#content-sub.style2 {margin: 30px 0 15px 0;}


		/* #PAGEBROWSER
		=========================== */

		.pagebrowser {
			width: 100%;
			text-align: center;
			margin: -30px 0 0 0;
			display: inline;
			float: left;
		}

			html .pagebrowser:nth-of-type(1) {margin: 0 0 8px 0 !important;}

			.pagebrowser div {
				width: 100%;
				text-align: center;
				margin: 0 0 10px 0;
			}

			.pagebrowser ol {
				width: auto;
				margin: 0 25% 16px 25%;
				padding: 0;
				display: inline;
				float: left;
			}
				.pagebrowser ol li {font-size: 100%;}

				html #content-sub .nine .pagebrowser ol li.x-first a,
				html #content-sub .nine .pagebrowser ol li.x-last a {
					padding-top: 2px !important;
					padding-bottom: 4px !important;
				}

						html .no-more-first,
						html .no-more-last {
							font-size: 120% !important;
							padding: 2px 8px 4px 8px !important;
						}


		/* #SEARCH RESULT LIST
		=========================== */

		.search-result {margin: 0 0 10px 0;}

			#content-sub .nine > .search-result:nth-of-type(4) {margin-bottom: 37px;}


		/* #NEWS
		=========================== */

		.news {margin: 0 0 20px 0;}

			.news-dl {
				border-top: 1px solid #D6D6D7;
				display: block;
				float: left;
				margin: 0 0 -20px 0;
				padding: 5px 0 0 0;
				width: 100%;
			}

				.news-dl img {
					width: 30px;
					height: auto;
					margin: 10px 10px 0 0;
				}

				/* 
				
				.news-dl p {
					width: 340px;
					font-size: 90%;
					padding: 2px 0 0 0;
					display: inline;
					float: left;
				} 
				
				*/
				
				.news-dl p {
					width: calc(100% - 40px);
					font-size: 90%;
					padding: 2px 0 0 0;
					display: inline;
					float: left;
				}

				.news-links ul,
				.news-links2 ul {
					font-size: 90%;
				}


		/* #CATS HOME
		================================================== */

		#content .four {
			height: 323px;
			margin-bottom: 10px;
		}

			#content>.four:nth-of-type(1):hover,
			#content>.four:nth-of-type(1):active,
			#content>.four:nth-of-type(1):focus {
				color: #FFFFFF;
                                background: #294C74 url(../graphic/kacheln/t-dunkelblau.png) center -320px no-repeat;
				background-size: 100%;
			}

			#content>.four:nth-of-type(2):hover,
			#content>.four:nth-of-type(2):active,
			#content>.four:nth-of-type(2):focus {
				color: #FFFFFF;
				background: #294C74 url(../graphic/kacheln/f-dunkelblau.png) center -320px no-repeat;
				background-size: 100%;
			}

			#content>.four:nth-of-type(3):hover,
			#content>.four:nth-of-type(3):active,
			#content>.four:nth-of-type(3):focus {
				color: #FFFFFF;
				background: #294C74 url(../graphic/kacheln/l-dunkelblau.png) center -320px no-repeat;
				background-size: 100%;
			}

			#content>.four:nth-of-type(4):hover,
			#content>.four:nth-of-type(4):active,
			#content>.four:nth-of-type(4):focus {
				color: #FFFFFF;
				background: #294C74 url(../graphic/kacheln/b-dunkelblau.png) center -320px no-repeat;
				background-size: 100%;
			}

			#content>.four:nth-of-type(5):hover,
			#content>.four:nth-of-type(5):active,
			#content>.four:nth-of-type(5):focus {
				color: #FFFFFF;
				background: #294C74 url(../graphic/kacheln/p-dunkelblau.png) center -320px no-repeat;
				background-size: 100%;
			}

			#content>.four:nth-of-type(6):hover,
			#content>.four:nth-of-type(6):active,
			#content>.four:nth-of-type(6):focus {
				color: #FFFFFF;
				background: #294C74 url(../graphic/kacheln/k-dunkelblau.png) center -320px no-repeat;
				background-size: 100%;
			}

			#content>.four:nth-of-type(7):hover,
			#content>.four:nth-of-type(7):active,
			#content>.four:nth-of-type(7):focus {
				color: #FFFFFF;
				background: #294C74 url(../graphic/kacheln/g-dunkelblau.png) center -320px no-repeat;
				background-size: 100%;
			}

			#content>.four:nth-of-type(8):hover,
			#content>.four:nth-of-type(8):active,
			#content>.four:nth-of-type(8):focus {
				color: #FFFFFF;
				background: #294C74 url(../graphic/kacheln/j-dunkelblau.png) center -320px no-repeat;
				background-size: 100%;
			}

		/*
		
		#content>.four h2 a {
			width: 395px;
			height: 38px;
			font-size: 18px;
			padding-top: 15px;
			padding-left: 15px;
		}
		
		#content>.four p {
			width: 380px;
			line-height: 130%;
			height: 242px;
			margin: 0;
			padding: 20px 20px 0 20px;
		}
		
		*/
		
		#content>.four h2 a {
			width: calc(100% - 15px);
			height: 38px;
			font-size: 18px;
			padding-top: 15px;
			padding-left: 15px;
		}

			/* #content>.four h2 a:after {content:;} */

		#content>.four p {
			width: calc(100% - 40px);
			line-height: 130%;
			height: 242px;
			margin: 0;
			padding: 20px 20px 0 20px;
		}


		/* #SITEMAP
		=========================== */

		/* 
		
		ul#sitemap {
			width: 390px;
			margin-left: 15px;
			display: inline;
			float: left;
		}
		
		*/
		
		ul#sitemap {
			width: calc(100% - 15px);
			margin-left: 15px;
			display: inline;
			float: left;
		}

			ul#sitemap a,
			ul#sitemap a:link,
			ul#sitemap a:visited {
				width: 100%;
				border: 0 !important;
				font-size: 16px;
				padding: 0 0 0 0;
				display: inline;
				float: left;
			}

				ul#sitemap ul {
					width: 100%;
					border: 0 !important;
					margin: 0 0 0 0;
					padding: 0 0 20px 0;
					display: inline;
					float: left;
				}

					/*
					
					ul#sitemap ul li {
						width: 370px;
						margin-left: 20px;
					}

						ul#sitemap ul li a,
						ul#sitemap ul li a:link,
						ul#sitemap ul li a:visited {
							width: 365px;
							padding-left: 5px;
							line-height: 24px !important;
						}
					
					*/

					ul#sitemap ul li {
						width: calc(100% - 20px);
						margin-left: 20px;
					}

						ul#sitemap ul li a,
						ul#sitemap ul li a:link,
						ul#sitemap ul li a:visited {
							width: calc(100% - 25px);
							padding-left: 5px;
							line-height: 24px !important;
						}
		/* #BREADCRUMB
		================================================== */

		/*
		
		html #breadcrumb ul {
			width: 400px;
			font-size: 80%;
			margin: 0 !important;
			border-top: solid 1px #D6D6D7;
			border-bottom: solid 1px #D6D6D7;
			padding: 5px;
		}
		
		*/
		
		html #breadcrumb ul {
			width: calc(100% - 10px);
			font-size: 80%;
			margin: 0 !important;
			border-top: solid 1px #D6D6D7;
			border-bottom: solid 1px #D6D6D7;
			padding: 5px;
		}


			#breadcrumb li:before {margin: -2px 5px 0 0;}


		/* #URLs
		================================================== */

		#content-sub .nine a,
		#content-sub .nine a:link,
		#content-sub .nine a:visited {
			color: #008ADD;
			background: transparent url(../graphic/bg/arrow.png) right -19px no-repeat;
			padding: 1px 16px 1px 2px;
		}

		#content-sub .nine a:hover,
		#content-sub .nine a:active,
		#content-sub .nine a:focus {
			color: #1A181B;
			background: #EFF1F4 url(../graphic/bg/arrow.png) right -44px no-repeat;
		}

		#content-sub .nine a.mail,
		#content-sub .nine a.mail:link,
		#content-sub .nine a.mail:visited {
			color: #008ADD;
			background: transparent url(../graphic/bg/mail.png) right 5px no-repeat;
		}

		#content-sub .nine a.mail:hover,
		#content-sub .nine a.mail:active,
		#content-sub .nine a.mail:focus {
			color: #1A181B;
			background: #EFF1F4 url(../graphic/bg/mail.png) right -36px no-repeat;
		}

		.stage-txt a, .stage-txt a:link, .stage-txt a:visited {
			color: #1A181B;
			background: transparent url(../graphic/bg/arrow2.png) right -20px no-repeat;
			margin-right: 5px;
			margin-left: -4px;
			padding: 1px 16px 0 4px;
		}

		.stage-txt a:hover,
		.stage-txt a:active,
		.stage-txt a:focus {
			color: #008ADD;
			background: #FFF url(../graphic/bg/arrow2.png) right -44px no-repeat;
		}

		.stage2 a,
		.stage2 a:link,
		.stage2 a:visited {
			color: #008ADD;
			background: transparent url(../graphic/bg/arrow.png) right -20px no-repeat;
			padding: 0 16px 1px 2px;
		}

		.stage2 a:hover,
		.stage2 a:active,
		.stage2 a:focus {
			color: #1A181B;
			background: #FFF url(../graphic/bg/arrow.png) right -45px no-repeat;
		}

		.stage2-more a,
		.stage2-more a:link,
		.stage2-more a:visited {
			color: #FFF;
			background: transparent url(../graphic/bg/arrow.png) right 5px no-repeat;
			margin-right: 5px;
			margin-left: -4px;
			padding: 1px 16px 1px 4px;
		}

		.stage2-more a:hover,
		.stage2-more a:active,
		.stage2-more a:focus {
			color: #008ADD;
			background: #FFF url(../graphic/bg/arrow.png) right -19px no-repeat;
		}

		#content-sub a.news-more,
		#content-sub a.news-more:link,
		#content-sub a.news-more:visited,

		#content-sub a.search-more,
		#content-sub a.search-more:link,
		#content-sub a.search-more:visited {
			color: #1A181B;
			background: #D8D6D7 url(../graphic/bg/arrow2.png) 98px -15px no-repeat;
			padding: 4px 30px 5px 16px;
		}

			#content-sub a.search-more,
			#content-sub a.search-more:link,
			#content-sub a.search-more:visited {
				background: #D8D6D7 url(../graphic/bg/arrow2.png) 122px -15px no-repeat;
				padding: 4px 30px 5px 16px;
			}

		#content-sub a.news-more:hover,
		#content-sub a.news-more:active,
		#content-sub a.news-more:focus,

		#content-sub a.search-more:hover,
		#content-sub a.search-more:active,
		#content-sub a.search-more:focus {
			color: #008ADD;
			background: #EFF1F4 url(../graphic/bg/arrow2.png) 98px -39px no-repeat;
			text-decoration: none;
		}

			#content-sub a.search-more:hover,
			#content-sub a.search-more:active,
			#content-sub a.search-more:focus {background: #EFF1F4 url(../graphic/bg/arrow2.png) 122px -39px no-repeat;}

			#content-sub a.news-back,
			#content-sub a.news-back:link,
			#content-sub a.news-back:visited {
				font-size: 90%;
				color: #1A181B;
				background: #D8D6D7 url(../graphic/bg/arrow.png) 10px -108px no-repeat;
				padding: 6px 16px 7px 26px;
			}

			#content-sub a.news-back:hover,
			#content-sub a.news-back:active,
			#content-sub a.news-back:focus {
				color: #008ADD;
				background: #EFF1F4 url(../graphic/bg/arrow.png) 10px -85px no-repeat;
			}


		/* #NAVIGATION
		================================================== */

		/* nav link */
		html #nav a,
		html #nav a:link,
		html #nav a:visited {padding: 9px 15px 9px 15px;}

		/* nav link sub 1 */
		html #nav li ul li a,
		html #nav li ul li a:link,
		html #nav li ul li a:visited {
			font-size: 110%;
			padding: 4px 25px 3px 25px;
		}

		/* #FOOTER
		================================================== */

		/* 
		
		.footer {
			font-size: 100%;
			padding: 20px 0 8px 5px;
		}
		
		*/
		
		.footer {
			font-size: 100%;
			padding: 20px 0 8px 0;
		}


		.footer p {
			line-height: 22px !important;
		}

		.footer h3 {
			font-size: 18px;
			line-height: 22px;
			margin-bottom: 8px;
			font-weight: 700;
			letter-spacing: 0;
			/* letter-spacing: 0.5px;  */
		}

		.footer h4 {
			font-size: 16px;
			line-height: 22px;
			font-weight: 700;
			margin-bottom: 4px;
			letter-spacing: 0;
		}


	}

/* #DGS
================================================== */

html .container main #content-sub .fourteen.columns {
	width: calc(100% - 40px);
	margin: 0 20px;
}

	video {
		width: 100%;
		margin: 0;
		padding: 0 0 20px 0;
	}

	html .container main #content-sub .toggle {
		color: #008ADD;
		background: transparent 0;
		outline: 0;
		line-height: 22px;
		-webkit-transition: 0.6s ease;
		-moz-transition: 0.6s ease;
		-ms-transition: 0.6s ease;
		-o-transition: 0.6s ease;
		transition: 0.6s ease;
		-moz-border-radius: 4px;
			-webkit-border-radius: 4px;
			border-radius: 4px;
		margin: 0;
		padding: 1px 2px;
		overflow: hidden;
		white-space: inherit;
		text-decoration: underline;
		cursor: pointer;

	}

	html .container main #content-sub .toggle:hover,
	html .container main #content-sub .toggle:active,
	html .container main #content-sub .toggle:focus {
		color: #1A181B;
		background: #EFF1F4 0;
		text-decoration: none;
		cursor: pointer;
	}

		html .container main #content-sub .video-text-content {
			line-height: 22px;
			margin: 20px 0 0 0;
		}


/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
@media only screen and (max-width: 817px) {

	html .container main #content-sub .fourteen.columns {
		width: 100%;
		margin: 0 -10px 0 20px;
	}

}

/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
@media only screen and (min-width: 1156px) {

	html .container main #content-sub .fourteen.columns {
		width: 960px;
		margin: 0 5px;
	}

}

@media only screen and (max-width: 817px) {

	/* Default */

	#content-sub .nine.columns .csc-textpic-imagecolumn {width: 100% !important;}

	#content-sub .nine.columns div.csc-textpic .csc-textpic-imagewrap figure,
	#content-sub .nine.columns div.csc-textpic figure.csc-textpic-imagewrap {display: inline;}

		#content-sub .nine.columns .csc-textpic-imagecolumn img {width: 100% !important;}

		#content-sub .nine.columns .csc-textpic-imagecolumn figcaption.csc-textpic-caption {
			display: block;
			margin: 5px auto 10px auto;
		}


	/* Gallery */

	#content-sub .fourteen.columns .csc-textpic-imagecolumn {width: 100% !important;}

	#content-sub .fourteen.columns div.csc-textpic .csc-textpic-imagewrap figure,
	#content-sub .fourteen.columns div.csc-textpic figure.csc-textpic-imagewrap {display: inline;}

		#content-sub .fourteen.columns .csc-textpic-imagecolumn img {width: 100% !important;}

}

/* Tablet Portrait size to standard 960 (devices and browsers) */
	@media only screen and (min-width: 818px) {

	/* Default */

	#content-sub .nine.columns .csc-textpic-imagecolumn {
		width: auto !important;
		margin-right: 10px;
	}

	#content-sub .nine.columns .csc-textpic-imagerow:first-child .csc-textpic-imagecolumn {	}

	#content-sub .nine.columns div.csc-textpic .csc-textpic-imagewrap figure,
	#content-sub .nine.columns div.csc-textpic figure.csc-textpic-imagewrap {display: inline;}

		#content-sub .fourteen.columns .csc-textpic-imagecolumn img {
			width: calc(100% - 10px) !important;
			margin: 0 5px;
			display: inline !important;
		}

	#content-sub .nine.columns .csc-textpic-imagecolumn figcaption.csc-textpic-caption {
			display: block;
			margin: 5px auto 10px auto;
		}


	/* Gallery */

	#content-sub .fourteen.columns .csc-textpic-imagecolumn {
		width: 25% !important;
		margin-right: 0;
	}

	#content-sub .fourteen.columns .csc-textpic-imagerow:first-child .csc-textpic-imagecolumn {	}

	#content-sub .fourteen.columns div.csc-textpic .csc-textpic-imagewrap figure,
	#content-sub .fourteen.columns div.csc-textpic figure.csc-textpic-imagewrap {display: inline;}

		#content-sub .fourteen.columns .csc-textpic-imagecolumn img {
			width: calc(100% - 10px) !important;
			margin: 0 5px;
			display: inline !important;
		}

}


 @media only screen and (max-width: 818px) {

	#slideshow {min-height: 212px;}

	#content .four {margin-bottom: 0;}

	#content {margin: 0 !important;}

 }

/* #Font-Face
================================================== */
/*   This is the proper syntax for an @font-face file
		Just create a "fonts" folder at the root,
		copy your FontName into code below and remove
		comment brackets */

/*  @font-face {
			font-family: 'FontName';
			src: url('../fonts/FontName.eot');
			src: url('../fonts/FontName.eot?iefix') format('eot'),
					 url('../fonts/FontName.woff') format('woff'),
					 url('../fonts/FontName.ttf') format('truetype'),
					 url('../fonts/FontName.svg#webfontZam02nTh') format('svg');
			font-weight: normal;
			font-style: normal; }


@font-face {
		font-family: 'pt_sansregular';
		src: url('../../../fonts/PTS55F-webfont.eot');
		src: url('../../../fonts/PTS55F-webfont.eot?#iefix') format('embedded-opentype'),
				 url('../../../fonts/PTS55F-webfont.woff') format('woff'),
				 url('../../../fonts/PTS55F-webfont.ttf') format('truetype'),
				 url('../../../fonts/PTS55F-webfont.svg#pt_sansregular') format('svg');
		font-weight: normal;
		font-style: normal;
} */