@charset "UTF-8";

@media all{
	
	html{
		height: 100%;
	}
	
	body{
		font-family: 'Open Sans', Helvetica, sans-serif;
		font-size: 115%;
		height: 100%;
		margin: 0px;
		color: #333333;
	}
	
	iframe{
		border: none;
	}

	
	/*	//////////////////////////////////////////////////
		BUILD
														*/
		div#bannerWrapper{
			position: absolute;
			top: 0px;
			left: 0px;
			width: 100%;
			height: 70px;
			background-image: url(../../images/banner/top1.png);
			background-position: center top;
			background-repeat: repeat-x;
			z-index: 100;
		}
			div#bannerWrapper div.banner{
				width: 100%;
				max-width: 1638px;
				height: 62px;
				margin: 0px auto;
				text-align: right;
			}
				
				div#bannerWrapper div.banner div#loginWrapper{
					padding-top: 10px;
				}
				
				div#bannerWrapper div.banner div#languageWrapper{
					height: 100%;
					padding: 12px;
					box-sizing: border-box;
				}
					div#bannerWrapper div.banner div#languageWrapper img{
						width: auto;
						height: 100%;
					}
				
				div#bannerWrapper div.banner div#menuWrapper{
					height: 100%;
				}
				div#bannerWrapper div.banner div#characterWrapper div#characterName,
				div#bannerWrapper div.banner div#menuWrapper{
					box-sizing: border-box;
					width: auto;
				}
				
					div#bannerWrapper div.banner div#menuWrapper div,
					div#bannerWrapper div.banner div#characterWrapper div#characterName{
						width: auto;
						height: 100%;
						padding: 19px 10px 0px;
						box-sizing: border-box;
					}
					div#bannerWrapper div.banner div#menuWrapper div{
						margin: auto 1.0em;
					}
					div#bannerWrapper div.banner div#menuWrapper div.selected{
						background-image: url(../../images/banner/top1_selected.png);
						background-position: center top;
						background-repeat: repeat-x;
						height: 64px;
					}

				div#bannerWrapper div.banner div#characterWrapper div#characterName{
					padding-right: 25px;
					height: 62px;
				}
				
		div#secondBannerWrapper{
			position: absolute;
			top: 64px;
			left: 0px;
			width: 100%;
			height: 50px;
			z-index: 90;
		}
			div#secondBannerWrapper div.banner{
				width: 100%;
				max-width: 1638px;
				height: 100%;
				margin: 0px auto;
				padding-top: 14px;
				box-sizing: border-box;
				background-image: url(../../images/bg/9fd2e9.png);
				background-repeat: repeat;
				text-align: left;
			}
				div#secondBannerWrapper div.banner span{
					padding: 0px 2.0em;
				}
				div#secondBannerWrapper div.banner span.selected a:link,
				div#secondBannerWrapper div.banner span.selected a:visited,
				div#secondBannerWrapper div.banner span.selected a:active{
					font-weight: bold;
				}
		
		div#wrapper{
			position: relative;
			top: 0px;
			left: auto;
			width: 100%;
			height: auto;
			margin: 100px auto;
			padding: 0px 50px;
			box-sizing: border-box;
			z-index: 20;
		}
		
	/*	//////////////////////////////////////////////////
		LINK
														*/
		
		a.menu:link,
		a.menu:visited,
		a.menu:active,
		div#characterName,
		div#characterMenu{
			color: #eaeaea;
			font-weight: bold;
			text-decoration: none;
		}
		
		a.submenu:link,
		a.submenu:visited,
		a.submenu:active{
			color: #333333;
			font-weight: normal;
			text-decoration: none;
		}
		
		a.menu:hover,
		a.submenu:hover,
		div#characterName:hover{
			text-decoration: underline;
		}
		
		div#bannerWrapper div.banner div#menuWrapper div.selected a.menu:link,
		div#bannerWrapper div.banner div#menuWrapper div.selected a.menu:visited,
		div#bannerWrapper div.banner div#menuWrapper div.selected a.menu:active{
			color: #333333;
		}
		
		
	/*	//////////////////////////////////////////////////
		MODULES
														*/
		
		div#sign-in{
			padding-top: 100px;
		}
		
		div#characterWrapper{
			width: 300px;
			max-width: 100%;
		}
			div#characterWrapper div,
			div#characterWrapper img{
				height: 100%;
			}
			
			div#characterWrapper div#characterMenu{
				margin-top: -6px;
				height: auto;
				width: 100%;
				background-image: url(../../images/bg/053a50.png);
				background-repeat: repeat;
				padding: 10px;
				box-sizing: border-box;
			}
	
		
	/*	//////////////////////////////////////////////////
		SETTINGS
														*/
		header, section, nav{
			width: 100%;
			display: block;
			height: auto;
		}
		code{
			font-family: monospace;
			color: #009999;
		}
		
		
	/*	//////////////////////////////////////////////////
		TEXT
														*/
		p{
			text-align: justify;
			margin: 1.0em auto;
		}
		
		a:link,
		a:active,
		a:visited{
			font-family: inherit;
			font-size: inherit;
			color: inherit;
			text-decoration: underline;
		}
		a:hover{
			text-decoration: none;
		}
		
		span{
			font-size: inherit;
		}
		
		h1, h2, h3, h4, h5, h6{
			font-family: inherit;
		}
		h1{	/*	Main headline for each page	*/
			font-size: 155%;
			margin: 1.5em auto;
		}
		h2{
			font-size: 125%;
			margin: 1.4em auto;
		}
		h3{
			font-size: 115%;
			margin: 1.3em auto 0.5em auto;
		}
		h4{
			font-size: 110%;
			margin: 1.3em auto 0.5em auto;
		}
		h5{
			font-size: 105%;
			margin: 1.3em auto 0.5em auto;
		}
		h6{
			font-size: 107%;
			margin: 1.3em auto 0.5em auto;
		}
		
	/*	//////////////////////////////////////////////////
		TABLE
														*/
		table{
			border-collapse: collapse;
			margin-bottom: 1.0em;
		}
		
		table td,
		table th{
			text-align: left;
			vertical-align: top;
			padding: 0.2em 0.7em 0.3em 0.3em;
		}
		
		table.list{
		}
			table.list thead th,
			table.list thead td{
				color: #42210b;
			}
			table.list tbody th,
			table.list tbody td{
				padding: 0.2em 0.7em 0.3em 0.3em;
			}
		
		div.tableStyleTh,
		div.tableStyleTd{
			float: left;
			padding: 0.2em 0.7em 0.3em 0.3em;
			box-sizing: border-box;
		}
		div.tableStyleTh{
			font-weight: bold;
			width: 29.99999%;
		}
		div.tableStyleTd{
			width: 69.99999%;
		}
		
	/*	//////////////////////////////////////////////////
		POPUP
														*/
		div#basicPopup{
			position: fixed;
			top: 50%;
			left: 50%;
			width: 500px;
			height: 500px;
			border: dashed 0.1em #333333;
			border-radius: 1.5em;
			background-color: #ffffff;
			box-shadow: 0px 0px 15px #888888;
			margin: -280px auto auto -250px;
			z-index: 200;
		}
		div#basicPopupFullscreen{
			position: fixed;
			top: 5%;
			left: 5%;
			width: 90%;
			height: 90%;
			border: dashed 0.1em #333333;
			border-radius: 1.5em;
			background-color: #ffffff;
			box-shadow: 0px 0px 15px #888888;
			z-index: 200;
		}
			div#basicPopupFullscreen,
			div#basicPopup{
				overflow: scroll;
			}
				div#basicPopup div#basicPopupInnerContainer{
					padding: 2.0em 3.0em;
				}
				div#basicPopupFullscreen  div#basicPopupInnerContainer,
				div#basicPopupFullscreen  div#basicPopupInnerContainer div#fullscreenMapContainer{
					width: 100%;
					height: 100%;
				}
					div#basicPopup div#basicPopupInnerContainer p,
					div#basicPopupFullscreen  div#basicPopupInnerContainer p{
						padding-left: 1.0em; 
					}
					
		div#popup_cover, div#popup_cover_invisible{
			position: fixed;
			top: 0px;
			left: 0px;
			width: 100%;
			height: 100%;
			z-index: 190;
		}
			div#popup_cover{
				background-color: #000000;
				opacity: 0.8;
				filter: Alpha(opacity=80);	/*	<= IE8 */
			}
			div#popup_cover_invisible{
			}
			
		.closeWindowButton{
			position: absolute;
			top: 10px;
			right: 10px;

			z-index: 300;
		}
		
	/*	//////////////////////////////////////////////////
		FORM
														*/
		input, textarea, select{
			font-family: 'Open Sans', Helvetica, sans-serif;
			font-size: 95%;
		}
		input, select{
			width: 20em;
			max-width: 90%;
			padding: 0.3em 0.5em;
		}
		
		select.small,
		input[type=text].small,
		input[type=number].small{
			width: 9.0em;
		}
		
		select.smaller,
		input[type=text].smaller,
		input[type=number].smaller{
			width: 5.0em;
		}
		
		input[type=submit],
		input[type=button],
		input[type=checkbox],
		input[type=radio]{
			width: auto;
		}
		
		textarea{
			width: 90%;
			height: 15em;
		}
		textarea.big{
			width: 800px;
			height: 30em;
		}
		
		input[type=submit].EVESSO{
			background-image: url(../../images/buttons/eve-sso-login-white-large_BLANK.png);
			background-repeat: no-repeat;
			width: 270px;
			height: 45px;
			border: none;
			font-weight: bold;
			font-size: 110%;
			color: #2a2a2a;
		}
		
	/*	//////////////////////////////////////////////////
		INFO-BOXES
														*/
		.boxInfo,
		.boxError,
		.boxSuccess,
		.boxWarning{
			position: relative;
			padding: 0.8em 0.8em 0.8em 80px;
			margin-bottom: 1em;
			clear: both;
			overflow: hidden;
		}
		.boxInfo{
			color: #205791;
			background-color: #d5edf8;
			border: solid 2px #92cae4;
		}
		.boxError{
			color: #912020;
			background-color: #f8d5d5;
			border: solid 2px #e49292;
		}
		.boxSuccess{
			color: #2d9120;
			background-color: #daf8d5;
			border: solid 2px #9ee492;
		}
		.boxWarning{
			color: #c3b516;
			background-color: #fffcd7;
			border: solid 2px #fcf05e;
		}
			.boxInfo .symbol,
			.boxError .symbol,
			.boxSuccess .symbol,
			.boxWarning .symbol{
				position: absolute;
				top: 10px;
				left: 15px;
			}
			
	/*	//////////////////////////////////////////////////
		SPRITE ICONS
														*/
		.icon,
		.icon-large{
			background-image: url(../../images/buttons-and-icons/sprite-icons.png);
			display: inline-block;
		}
		.icon{
			width: 12px;
			height: 12px;
		}
		.icon-large{
			width: 15px;
			height: 11px;
		}
		
		div.icon-pen{ background-position: 0 0; }
		
		div.icon-check{ background-position: -24px 0; }
		div.icon-check:hover{ background-position: -12px 0; }
		
		div.icon-cross{ background-position: -48px 0; }
		div.icon-cross:hover{ background-position: -36px 0; }
		
		div.icon-plus{ background-position: -72px 0; }
		div.icon-plus:hover{ background-position: -60px 0; }
		
		div.icon-minus{ background-position: -96px 0; }
		div.icon-minus:hover{ background-position: -84px 0; }
		
		div.icon-alert{ background-position: -120px 0; }
		div.icon-alert:hover{ background-position: -108px 0; }
		
		div.icon-image{ background-position: -132px 0; }
		
		div.icon-preview{ background-position: -144px 0; }
		
		div.icon-document{ background-position: -156px 0; }
		
		div.icon-sign{ background-position: -168px 0; }
		
		div.icon-trash{ background-position: -180px 0; }
		
			
		div.icon-email{ background-position: 0 -12px; }
			
	/*	//////////////////////////////////////////////////
		SPRITE INFO AND BUTTONS
														*/
	.sprite{
		background-image: url(../../images/buttons-and-icons/sprite-info-buttons.png);
	}
	div.sprite-symbol{
		display: inline-block;
	}
	
	.symbol-check-1{
		width: 18px;
		height: 17px;
		background-position: 0 0;
	}
	.symbol-check-1-false{
		width: 18px;
		height: 17px;
		background-position: -18px 0;
	}
	.symbol-check-1-alert{
		width: 18px;
		height: 17px;
		background-position: -36px 0;
	}
	.symbol-check-1-help{
		width: 18px;
		height: 17px;
		background-position: -54px 0;
	}
	.symbol-check-1-blank{
		width: 18px;
		height: 17px;
	}
	
	.symbol-info{
		width: 33px;
		height: 33px;
		background-position: -33px -21px;
	}
	.symbol-error{
		width: 33px;
		height: 33px;
		background-position: 0 -21px;
	}
	.symbol-success{
		width: 33px;
		height: 33px;
		background-position: -66px -21px;
	}
	.symbol-warning{
		width: 33px;
		height: 33px;
		background-position: -180px -81px;
	}
	
	.button-menu-handheld{
		width: 27px;
		height: 14px;
		background-position: -94px 0;
	}
	.button-close{
		width: 21px;
		height: 21px;
		background-position: -73px 0;
	}
	.button-next{
		width: 90px;
		height: 90px;
		background-position: -210px -53px;
	}
	.button-prev{
		width: 90px;
		height: 90px;
		background-position: -210px -143px;
	}
	
	.rss-feed{
		width: 28px;
		height: 28px;
		background-position: -180px -53px;
		margin-top: 40px;
	}
	
	/*	//////////////////////////////////////////////////
		GLOBAL CLASSES
														*/
		.box{
			border: solid 0.2em #333333;
			padding: 1.0em;
			margin: 1.0em;
		}
		.cafter:after{
			display: block;
			visibility: hidden;
			content: " ";
			clear: both;
		}
		.cboth{
			clear: both;
		}
		.checkboxContainer{
			height: auto;
			max-height: 200px;
			overflow: scroll;
		}
		img.character_portrait{
			height: 100%;
		}
		div.checkboxListContainer{
			width: 100%;
			max-width: 450px;
			padding: 0.4em 1.0em;
			box-sizing: border-box;
			background-color: #eaeaea;
			border: solid 0.2em #333333;
			margin: 1.0em;
		}
			div.checkboxListContainer button{
				width: 100%;
				padding: 1.0em;
				font-size: 105%;
			}
			div.checkboxListContainer ul{
				padding: 0px;
			}
				div.checkboxListContainer ul li{
					list-style-type: none;
					padding: 5px 0px;
				}
		.cursor-help{
			cursor: help;
		}
		.display_none{
			display: none;
		}
		.display_block{
			display: block;
		}
		.display_inline{
			display: inline;
		}
		hr.divider{
			margin: 3.0em auto;
		}
		td.divider{
			height: 3.0em;
		}
		th.divider{
			width: 3.0em;
		}
		.fleft{
			float: left;
		}
		.frame{
			border: solid 0.2em #42210b;
			padding: 0.5em;
			margin: 0.5em;
		}
		.fright{
			float: right;
		}
		.head{
			margin-top: 1.0em;
		}
			li.head{
				font-weight: bold;
			}
		p.limit{
			max-width: 600px;
			margin: 1.0em 0px;
		}
		.marginLeftMed{
			margin-left: 3.5em;
		}
		.marginTopMed{
			margin-top: 3.5em;
		}
		div.menuDropDown{
			border-top: solid 1px #eaeaea;
		}
			div.menuDropDown div.menuDropDown_charaterName{
				padding-top: 20px;
				padding-right: 25px;
				box-sizing: border-box;
			}
		.nobr{
			white-space: nowrap;
		}
		.point{
			cursor: pointer;
		}
		.red{
			color: #ff0033;
		}
		.responsiveColumnLeft{
			width: 59.99999%;
			float: left;
		}
		.responsiveColumnRight{
			width: 39.99999%;
			float: left;
		}
		button.saveChanges{
			width: 100%;
			max-width: 900px;
			padding: 1.0em;
			font-size: 105%;
		}
		.tcenter{
			text-align: center;
		}
		
		.w10p{width: 9.99999%;}
		.w20p{width: 19.99999%;}
		.w30p{width: 29.99999%;}
		.w40p{width: 39.99999%;}
		.w50p{width: 49.99999%;}
		.w60p{width: 59.99999%;}
		.w70p{width: 69.99999%;}
		.w80p{width: 79.99999%;}
		.w90p{width: 89.99999%;}
}	/*	@media all */

@media screen and (max-width: 1000px){
	
	/*	//////////////////////////////////////////////////
		MEDIA
														*/
		div.responsiveImageHolder{
			width: 49.99999%;
		}
		div.responsiveImageHolderHeaderImage{
			width: 99.99999%;
			padding: 0 6px;
		}
	/*	//////////////////////////////////////////////////
		GLOBAL CLASSES
														*/
		.responsiveColumnLeft,
		.responsiveColumnRight{
			width: 99.99999%;
		}
		.responsiveColumnLeft{
			padding-bottom: 1.5em;
		}
}

@media screen and (max-width: 500px){
	
		
	/*	//////////////////////////////////////////////////
		TABLE
														*/
		div.tableStyleTh,
		div.tableStyleTd{
			width: 99.99999%;
		}
		div.tableStyleTd{
			padding-bottom: 1.0em;
		}
	/*	//////////////////////////////////////////////////
		FOOTER
														*/
		footer div.footerInnerContainer{
			width: 99.99999%;
		}
	/*	//////////////////////////////////////////////////
		MEDIA
														*/
		div.responsiveImageHolder{
			width: 99.99999%;
		}
}

@media screen and (max-width: 650px){
	
	/*	//////////////////////////////////////////////////
		HEADER
														*/
		header div#headerInnerContainer div#google_translate_element{
			max-width: 22px;
			overflow: hidden;
		}
	/*	//////////////////////////////////////////////////
		NAVIGATION
														*/
		nav{
			margin-bottom: 0px;
		}
			nav div{
				display: inline;
			}
			nav ul{
				display: none;
			}
				nav ul li{
					text-align: left;
					padding-left: 2.2em;
					display: list-item;
				}
}

@media screen and (max-device-width: 568px) and (orientation: portrait){
	
	/*	//////////////////////////////////////////////////
		FORM
														*/
		input, select{
			width: 10em;
			padding: 0.3em 0.5em;
		}
		
		input[type=text].smaller,
		input[type=number].smaller{
			width: 1.5em;
		}
}	/*	@media screen and (max-device-width: 568px) and (orientation: portrait){	*/

@media screen and (max-device-width: 568px) and (orientation: landscape){
}