

/*

* {
box-sizing:border-box;
-moz-box-sizing:border-box; 
}

*/ 

body	{
	height: 100%;
/*    overflow: hidden; */
}

.right	{
	float: right;
}

.left	{
	float: left;
}

.center	{
	margin-left: auto;
	margin-right: auto;
}

video	{
width: 100%;
/* height: 100%; leads to a margin at top but is required by iOS, browserDetect takes care now */
}

img[usemap]	{
	border: none;
}

.player169-368	{
	width: 368px;
/*	height: 207px; will be calculated*/ 
}

.generalPlayer, .playerCanvasSize {
	min-height: 1px; /* avoid fully hidden players, they might not play */
}

.composeError	{
	font-family: Arial;
	font-size: 11px;
	font-weight: bold;
}

.composeError_warning	{
	color: orange;	
}

.composeWarning_Box	{
	 -webkit-box-shadow: 0 0 40px 5px orange inset;
	 box-shadow: 0 0 40px 5px orange inset;
}

.composeError_critical	{
	color: red;	
}

.composeError_error	{
	color: white;	
	background-color: red;
}


input	{
	
	font-size: 11px;

}

input[type="text"], input[type="password"], select{
   -moz-box-sizing:    border-box;
   -webkit-box-sizing: border-box;
    box-sizing:        border-box;
    padding-left: 3px;
}



.list	{
	border-left: 1px solid #cfd2d5;
	border-right: 1px solid #cfd2d5;
	overflow: hidden;
}

.c_contentContainer {
/*	do NOT set width: 100%;  we want the contentContainer to be dynamic! */
	height: 100%;
/* overflow: hidden is required to limit the inner content to the width */	
	overflow: hidden;
	
}

/* this should be part of customer design:
.contentData	{
	margin: 10px 0 20px 0;
}

.contentData_head	{
	width: 94%;
	height: 30px;
	line-height: 30px;
	margin: 0 10px 20px 10px;
	padding: 0 0 0 10px;
	border-bottom: 1px dotted #dddddd;
	font-size: 14px;
	font-weight: bold;
}

.contentData_inner	{
	margin: 10px;
	overflow: hidden;
}
*/

.contentborder	{
/*	border-top: 1px solid #cfd2d5; */
	border-bottom: 1px solid #cfd2d5;
	overflow: hidden;
}


/* contentSlot is used by makroTemplates and is prepared for LT */
.contentSlot	{
	overflow: hidden;
	position: relative;
}

.contentSlotInner	{
	height: 100%;
	width: 100%;
	overflow: hidden;
	position: relative;
}



.header	{
	margin-bottom: 5px;
	font-size: 14px;
	font-weight: bold;
	text-align: center;
}



.tableHead	{
	height: 24px;
	margin: 0;
	padding: 0 10px 0 10px;

	list-style-position: outside;
	list-style-type: none;
	
	background-color: #F1F1F1;

	background-image: linear-gradient(top, #F1F1F1 0%, #F8F8F8 50%, #FFFFFF 100%);
	background-image: -moz-linear-gradient(top, #F1F1F1 0%, #F8F8F8 50%, #FFFFFF 100%);
	background-image: -o-linear-gradient(top, #F1F1F1 0%, #F8F8F8 50%, #FFFFFF 100%);
	background-image: -webkit-linear-gradient(top, #F1F1F1 0%, #F8F8F8 50%, #FFFFFF 100%);
	background-image: -ms-linear-gradient(top, #F1F1F1 0%, #F8F8F8 50%, #FFFFFF 100%);

	
/*	border-top: 1px solid #c3c7cd; */
	border-bottom: 1px solid #f08925;
	
	line-height: 20px;
	font-weight: bold;
}


.tableHead li	{
	float: left;
	margin-right: 3px;
}



.evenLine	{
	background-color: #f0f0f0;
}

.oddLine	{
	background-color: #ffffff;
}

/* table for data show and edit */

.ul_table	{
	height: auto;
	margin: 3px 0 3px 0;
	padding: 3px 0;
	
	list-style-position: outside;
	list-style-type: none;
	overflow: hidden;

	line-height: 18px;
	

}


.ul_table li	{
	margin-right: 3px;
	float: left;
	overflow: hidden;
}

.contentList .ul_table	{
	line-height: 18px;
	margin: 0;
}

 .ul_table li:first-child	{
	margin-left: 10px;	
}

.linkList li	{
	cursor: pointer;
	padding: 0;
}

/* sublists have a reduced height! */
.contentList .contentList .ul_table	{
	padding: 4px 10px 4px 10px;
}


.contentList .contentList .contentList .ul_table	{
	padding: 2px 10px 0 10px;
}



.contentShow, .contentShow .tabContainer .contentShow {
  background-color: #F1F1F1;
    border-bottom: 1px solid #DDDDDD;
    border-left: 1px solid #DDDDDD;
    border-right: 1px solid #DDDDDD;
    padding: 10px;
    margin: 0 0 10px 0;
	
	overflow: hidden;
	cursor: default;
	clear: both;
}




.contentShow .contentShow	{
	margin: 0px;
	border: none;
}

.contentShow .showPreviewPicture	{
	margin: 5px 5px 0 0;
	float: right;

}

.contentShow .ul_table	{
	line-height: 18px;
	padding: 2px 0 2px 0;
}

.contentEdit	{
	background-color: #f0f2f4;
}

.contentEdit .ul_table	{
	line-height: 18px;
	padding: 2px 0 2px 0;
}

.contentEdit .ul_table input[type="text"] {
	width: 100%;
}

.contentEdit .ul_table textarea	{
	width: 100%;
	overflow: visible;
	height: auto;
}






.showFieldName	{
	width: 100px;
	margin-right: 10px;
	text-align: right;
	font-weight: bold;
	cursor: default;
}



.showFieldValue	{
	margin-right: 10px;
	cursor: default;
}


.contentShow .showFieldValue	{
	height: auto;
}

.showIDValue	{
	width: 30px;	
	margin-right: 10px;
	cursor: default;
}

#textSearchLeft_mainSearch	{
	width: 100%;
}

#textSearchLeft_mainSearch	table, #textSearchLeft_CMS_t_ObjectObject_Search table {
	width: 100%;
}

.textSearchInput {
	width:100%;
	height:19px;
	text-align:left;
	
	font-size: 12px;
	font-weight: normal;
	color: #000000;
}


/*xxxxxxxxxxxxx Video */

.c_player	{		/* this is the default */
/*	width: 640px;  do not set a width for the default player. this is the job of the classes below!
/*	height: 360px; never define a player height!! If you want a fix height, use a wrapping container */
	height: auto;
	overflow: hidden;
}

.c_player640	{
	width: 640px; 
}


.c_player480	{
	width: 480px; 
}


.c_player320	{
	width: 320px; 
}


.fullscreen .c_player	{
	width: 960px;
	height: auto;
}



.playerContainer	{
	height: 100%;
	width: 100%;
	float: left; 
}

.playerInitFailed {
	margin: 20px;
	font-size: 14px;
	font-weight: bold;
	color: #ffffff;
}

.b_Search	{
	padding: 10px;
}

/* action menu on top or bottom of a dataset */

.actionMenuTop	{
	height: auto;
	clear: both;
	overflow: hidden;
}

.actionMenuBottom	{
	min-height: 50px;	/* for IE only... */
	margin: 0 10px;
	padding: 0 5px;
	overflow: hidden;
	clear: both;
}

/* do not add outer margins to actionXXX: add them to actionMenuBottom for example */
.actionHR	{
	margin: 5px 0;
	clear: both;
}

.actionleft	{
	height: 20px;
	margin: 0 10px 10px 0;
	float: left;
}

.actionright	{
	height: 20px;
	margin: 0 0 10px 10px;
	float: right;
}

.actionright a, .actionleft a {
    color: #3A444E;
    font-weight: bold;
    line-height: 20px;
    text-decoration: none;
}

.resultArea	{
	clear: both;
	margin-bottom: 10px;
}

.ok	{
	clear: both;
	margin: 10px;
	line-height: 25px;
	padding: 5px;
	text-align: center;
	
	/* border: 2px solid #00AA00; */
	background-color: lightgreen;
	text-align: center;
	padding: 5px;

}

.frontend .ok	{
	background-color: transparent;
	color: #00AA00;
}

.nok	{
	clear: both;
	margin: 10px;
	line-height: 25px;
	padding: 5px;
	text-align: center;
	
	text-align: center;
	padding: 5px;
	
	color: white;
	background-color: red;
}

.debugArea	{
	clear: both;
	margin: 10px;
	background-color: orange;
}





/* ++++++++++++++++ uploadFile ++++++++++++++++++++ */

.uploadFile	{
	float: left; 
	height: auto; 
	margin-right: 5px; 
	display: inline; 
	overflow: hidden;
}

.uploadFile input	{
	width: 100%;
}


.uploadFileSubmitButton	{
	float: left; 
	margin-left: 5px;
}

.uploadFileAltButton	{
	margin-left: 5px;
	float: right; 
	cursor: pointer;
}

.uploadProgressContainer	{
	height:100%; 
	overflow: hidden; 
	border-left: 1px solid #CFD2D5;
	border-right: 1px solid #CFD2D5;


}

/* ++++++++++++++++ listFile/sendFile ++++++++++++++++++++ */

.listFile_ul{
	height: auto;
	padding: 3px 0 3px 0;
	margin: 0;
	list-style-position: outside;
	list-style-type: none;
	overflow: hidden;
	clear: both;
	cursor: pointer;
}

*html .listFile_ul	{
	height: 25px;
	padding: 5px 0 3px 0;

}


.listFile_ul li {
	margin-right: 3px;
	float: left;
}


.sendFile_ul{
	height: auto;
	padding: 3px 0 3px 0;
	margin: 0;
	list-style-position: outside;
	list-style-type: none;
	overflow: hidden;
	clear: both;
	cursor: pointer;
}

*html .sendFile_ul	{
	height: 25px;
	padding: 5px 0 3px 0;

}


.sendFile_ul li {
	margin-right: 3px;
	float: left;
}

.sortLink		{
	padding: 0;
	background-color: transparent;
	background-image: none;
	color: black;
	text-decoration: none;
}

.sortLink:active	{
	color: black;
}

.sortLink:visited	{
	color: black;
}

.sortLink:hover	{
	text-decoration: underline; 
}

.sortLinkAsc	{
	padding: 0 0 0 15px;
	background-image: url(../../images/sortAsc.gif);
	background-repeat: no-repeat;
}

.sortLinkDesc	{
	padding: 0 0 0 15px;
	background-image: url(../../images/sortDesc.gif);
	background-repeat: no-repeat;
}


/* always combine .downloadlink with the filetype below! */
.downloadlink {
	background-position: 0 0;
	background-repeat: no-repeat;
	padding-left: 33px;
	display: inline;
}

.downloadlink a {
	font-size: 11px;
	font-weight: normal;
	color: #5e6b79;
	text-decoration: underline;
}

.downloadlink  a:hover {
	color: #ef7f00;
}


.pdflink {
	background-image: url(../../images/i_pdf.gif);
}

.xlslink {
	background-image: url(../../images/i_xls.gif);
}

.xlsxlink {
	background-image: url(../../images/i_xlsx.gif);
}

.doclink {
	background-image: url(../../images/i_doc.gif);
}

.docxlink {
	background-image: url(../../images/i_docx.gif);
}

.pptlink {
	background-image: url(../../images/i_ppt.gif);
}

.pptxlink {
	background-image: url(../../images/i_ppt.gif);
}

.txtlink {
	background-image: url(../../images/i_txt.gif);
}

.jpglink {
	background-image: url(../../images/i_jpg.gif);
}

.mp3link {
	background-image: url(../../images/i_mp3.gif);
}



.addlink {
	margin: 0 0 0 13px;
	background-image: url(../../images/b_addLink.gif);
	background-position: 0 8px;
	background-repeat: no-repeat;
	padding-left: 15px;
	display: inline;
	padding-left: 15px;
	display: block;
	color: #5e6b79;
}

.addlink:hover {
	color: #ef7f00;
}

.adminlink {
	font-size: 10px;
}

.adminlink:hover {
	color: #ef7f00;
}



.simplecmslink {
	background-image: url(../../images/b_cmsLink.gif);
	background-position: 0 0px;
	background-repeat: no-repeat;
	padding-left: 15px;
	margin-left: 3px;
	display: inline;
}

#syswarning .simplecmslink {
	color: #ef7f00;
}



.unitPlay {
	height: 30px;
	background-image: url(../../images/bg_unitPlay.gif);
	line-height: 29px;
	text-align: center;
	overflow: hidden;
}


.sortLink1 {
	padding: 0 0 0 15px;
	background-image: url(../../images/sortAsc.gif);
	background-repeat: no-repeat;
}

.sortLink0 {
	padding: 0 0 0 15px;
	background-image: url(../../images/sortDesc.gif);
	background-repeat: no-repeat;
}



.listOf_t_comData	{
	overflow: hidden;
}

#t_comData0	{
	height: auto;
	clear: both;	
	overflow: hidden;

}


.searchResult 		{
	margin: 10px 0;
}

.textSearch		{
	margin: 10px 0;
}


.footerCopyright	{
	margin-top: 10px;
	color: #21272D;
	text-align: center;
	font-size: 11px;
	clear: both;
	float: left;
}

.loginstartPage_Welcome	{
	text-align: center;
}

/* ------------- Video ----------------- */



.upload_Picture_inner	{
	overflow: hidden;
}

.rbmSortList_Container	{
	height: auto;
	background-color: #F0F0F0;	

	overflow-x: auto;
	overflow-y: hidden;
	

}


.pictureList_ul	{
	height: 230px;
	/* padding helps to keep sortobjects IN the parent area */
	padding: 15px;
	margin: 0;
	list-style-position: outside;
	list-style-type: none;
	clear: both;
	overflow: hidden;
}

.pictureList_ul li	{
	width: 200px;
	margin-right: 10px;
	float: left;
}	

.picListNavi	{
	background-color: #eaeaea;
}

.picListNaviText	{
	width: 185px; 
	height: 13px; 
	overflow: hidden; 
	float: left; 
	font-size: 9px;
	color: #666666;
}

.picListContainer	{
	text-align: center;
}

.picListContainer img	{
	max-width: 200px; 
	max-height: 200px;
	cursor: pointer; 
}


.rbmSortList.vertical li	{
	clear: both;
}


.showFieldValue	{
	width: 400px;
}

.showFieldValue p	{
	margin: 0;
}

.IEdummy	{
	display: none;
}


.gapsCheckImage	{
	margin-right: 10px;
}

.specialKeys	{
	margin: 5px;
	padding: 5px;
	border: 1px solid #b0b0b0;
	background-color: yellow;

	
}

 


.show {
	display: block;
}

.hide {
	display:none;
}

.iconEdit	{
	float: right; 
	overflow: visible; 
	text-align: right; 
	width: 0; height: 0; 
	cursor: pointer;
	margin-right: 20px;
}

.addInfo	{
	float: right;
	overflow: visible; 
	text-align: right; 
	position: relative;  
	width: 0; height: 0; 
}

.showFieldValue ul 	{
	list-style-type: circle;
	height: auto;
	overflow: hidden;
}

.showFieldValue ul li	{
	clear: both;
}

.wrapImage	{
    overflow: hidden;
 
}





.c_previewPlayer	{
	height: 70%;
}

.wnd_videoPreview .captions	{

	padding: 10px;
	font-size: 12px;
	font-weight: bold;
	height: 30px;
}


.t_ClientContract_show .showFieldValue	{
	
	width: 180px;
	
}

.rbmWindow .c_contentLeft	{
	margin-bottom: 0;
	padding-bottom: 0;
}

.rbmWindow #c_contentInner	{
	min-height: 10px;

}

#c_topBanner	{
	overflow: hidden;
}

.videoPreview	{
	position: relative;
}

.videoPreviewImage	{
	position: relative; 
}

.videoPreviewOverlay	{
	position: absolute;
	top: 0;

}


.actionMenuTop .actionleft	{
	margin: 10px 15px;
}

.statusGIF	{
	display: inline;
}

.listFunction	{
	margin: 6px 0 0 0;
	display: inline;
}


.toolbarIcons16 img	{
	display: inline;
	margin: 0 5px 0 5px;
	cursor: pointer;
}

.handleDispute {
	display: none;
	margin: 20px;
}

.makroTemplateSelection		{
	margin: 0 5px 0 5px;
}

.configure .showFieldValue ul li	{
	float: left;	
}




.questionInfo	{
	left: 150px; 
	top: 0;
	position: absolute; 	
	width: 450px;
	text-align: center;
}

.c_contentRight .questionInfo	{
	width: 100px;
}

.waitElement	{
	background-image: url(../../images/ajax2.gif);
	background-position: 0 0px;
	background-repeat: no-repeat;
	padding: 1px 0 2px 22px;
	margin-left: 3px;
	display: inline;
}

.c_contentContainer > .waitElement	{
	position: absolute;
	top: 10px;
	left: 0;
	
    width: 100%;
	height: 50px;
    z-index: 1000;
    background-image: none;
    
    text-align: center;
    
}

/* full waitElement covering the whole content */
.c_contentContainer > .waitElement.composeWait2	{
    top: 0;
	bottom: -500px; /* to cover the footer as well */

    width: 100%;
    height: auto;

    margin-top: 5px;
    padding: 80px 0 0 0;
    z-index: 1000;

    background-color: rgba(240, 240, 240, 0.6);
    background-image: none;
    border: 0 none;

}

.errorArea	{
	clear: both;
	margin: 10px;
	background-color: red;
	color: white;
	line-height: 25px;
	padding: 5px;
}

.notice	{
	text-align: center;
}

.warning	{
	clear: both;
	margin: 10px;
	line-height: 25px;
	padding: 5px;
	text-align: center;
	color: #ef7f00;
}


	
.generalPlayer {
	width: 100%;
	position: relative;
}

.videoOverlayWindow {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    display: none;
}

.generalPlayer video {
	width: 100%;
/*	height: 100%; leads to margin at top */
} 

.simpleTrainingBottom	{
	width: 640px;
	height: 41px;
	float: left;
	background-image: url(../../images/panel/linguaTVTrainingBottom/bg_panel.jpg);
	background-repeat: no-repeat;	
}

.simpleTrainingBottom .panel_navi	{
	margin: 10px;
}


.panel_navi 	{
	padding: 0;
	float: left;
	list-style-type: none;
	list-style-position: inside;
	display: inline;
}

.panel_navi li, .panel_navi .playerPanelButton {
	float: left;
	cursor: pointer;
}

.panel_navi li img, .playerPanelButton	{
	cursor: pointer;
}


.playerPanel_flexPanelBottom	{
	width: 100%;
	height: 35px;
	float: left;
/*	background-image: url(../../images/panel/flexPanelBottom/bg_panel.jpg);
	background-repeat: no-repeat;*/
	background-color: #F1F1F1;
	position: relative; /* to allow overlay */	
}


.playerPanel_flexPanelBottom .playerPanelLeft	{
	float: left;
	margin-top: -35px;
}

.playerPanel_flexPanelBottom .playerPanelCenter	{
	height: 35px;
	width: 100px;
	margin: 0 auto;

}

.playerPanel_flexPanelBottom .playerPanelRight	{
	float: right;
	margin-top: -35px;
}


.playerPanel_flexPanelBottom .panel_navi 	{
	width: 160px; 
	height: 30px;
	margin: 1px 22px 0 22px;
}


.playerPanel_flexPanelBottom .panel_navi li, .playerPanel_flexPanelBottom .panel_navi .playerPanelButton {
	width: auto;
	height: 30px;
	margin: 0;
}


.playerPanel_flexPanelBottom .panel_add li, .playerPanel_flexPanelBottom .panel_add .playerPanelButton  {
	float: right;
}

.playerPanel_flexPanelBottom .panel_time {
	margin: 6px 0 0 0;
/*	float: left; */
	text-align: center;
	line-height: 30px;
	color: #373833;
	font-weight: bold;
	
}	



.playerPanel_flexPanelBottom .volumeBar	{
	width: 7px;
	height: 30px;
	float: left;
	cursor: pointer;
}


.playerPanel_flexPanelBottom .timeElapsed	{
	width: 100%;
	line-height: 35px;
	text-align: center;
}

.transparentPanel	{
/*	background-image: -moz-linear-gradient(rgba(0, 0, 0, 0) -10%, rgba(0, 0, 0, 0.5) 75%); */
	background-color: rgba(0, 0, 0, 0.2);
}



/* show the overlay panel on mouseover */
.overlayPanel	{
	visibility: hidden;
}

.econtioPlayer:hover > .overlayPanel	{
	visibility: visible;
}


.c_player:hover > .overlayPanel	{
	visibility: visible;
}


.playerPanelButton	{
	width: 100%; 
	height: 100%;
}


.contractCancellation	{
	margin-right: 30px;
}

.b_Login	{
	margin-left: 7px;
	background-image: url(../../images/b_go.gif);
	background-repeat: no-repeat;
    border: medium none;
    height: 20px;	
}



.captcha .contentEdit .ul_table input {
	width: auto;
}

.captcha {
	margin-top: 25px;
}

.captcha .warning	{
	font-weight: bold;
	color: red;
}

#captchaCode {
	width: 50px;
}

/* search template */

.contentData_tab .searchResult {
	overflow: hidden;
	background-color: #ffffff;
	/*	border-left: 1px solid #cfd2d5;
	border-right: 1px solid #cfd2d5; */
}

.tabSearchListAll {
	width: 150px;
	height: 40px;
	float: right;
	line-height: 40px;
}

.tabSearchImage {
	margin-top: 10px;
	display: block;
	float: right;
	cursor: pointer;
}



.tabSearch {
	height: 40px;
	line-height: 40px;
	padding-left: 17px;
	background-color: #f3f4f5;
	border-left: 1px solid #cfd2d5;
	border-right: 1px solid #cfd2d5;
	border-bottom: 1px solid #cfd2d5;
}


.contentEdit {
	background-color: transparent;
}

.tabSearchListAll .simplecmslink,.addNews .simplecmslink {
	margin-left: 13px;
}

/* do not remove this! */
.IEdummy {
	display: none;
}


/* Group stuff */

.contentData_tabhead {
	height: 29px;
	overflow: hidden;
	background-color: #ffffff;
	/*	border-left: 1px solid #cfd2d5;
	border-right: 1px solid #cfd2d5; */
}

.add_tabhead {
	width: 150px;
	height: 29px;
	float: right;
	line-height: 29px;
}




.c_contentInner	.textList {
	margin: 0 0 10px 0;
	padding: 0 0 10px 0;
	list-style-type: none;
	list-style-position: inside;
	border-bottom: 1px solid #d6d6d6;
}

.c_contentInner	.textList li {
	padding: 0 0 0 15px;
	background-image: url(../../images/i_startPageList.gif);
	background-position: 0 6px;
	background-repeat: no-repeat;
	line-height: 20px;
	color: #373833;
	font-size: 12px;
}


.buttonDefault	{
	height: 34px;
	width: auto;
	padding: 0 20px 0 20px;
	line-height: 34px;
	border: 1px solid #b0b6bb;
	cursor: pointer;
	color: #3a444e;
	font-size: 14px;
	font-weight: bold;
	text-decoration: none;	
}



.buttonLight	{
	color: #000000;
	font-weight: normal;
	background-color: #eeeeee;
	border: 1px solid #ddddddd;
	padding: 0 8px;
	
	background-image: linear-gradient(top, #F1F1F1 0%, #F8F8F8 75%, #FFFFFF 100%);
	background-image: -moz-linear-gradient(top, #F1F1F1 0%, #F8F8F8 75%, #FFFFFF 100%);
	background-image: -o-linear-gradient(top, #F1F1F1 0%, #F8F8F8 75%, #FFFFFF 100%);
	background-image: -webkit-linear-gradient(top, #F1F1F1 0%, #F8F8F8 75%, #FFFFFF 100%);
	background-image: -ms-linear-gradient(top, #F1F1F1 0%, #F8F8F8 75%, #FFFFFF 100%);

}

.buttonLight:hover	{
	color: #000000;
	background-image: none;
}

.buttonDefault span.buttonIcon	{
	background: no-repeat scroll 0 0 transparent;
    margin-top: 10px;
    min-height: 17px;
    text-indent: -10000px;
    width: 14px;
    display: none;
}


.buttonLowProfile {
	height: 26px;
	width: auto;
	padding: 0 15px 0 15px;
	line-height: 22px;

	cursor: pointer;
	color: #3a444e;
	font-weight: bold;
	text-decoration: none;
	font-size: 11px;
	
    border-top: 1px solid #CDD2D8;
    border-left: 1px solid #CDD2D8;
    /* border-top: 1px solid #CDD2D8 */;
    border-bottom: 1px solid #B9B9B9;
    border-right: 1px solid #B9B9B9;
    
	box-shadow: 2px 2px 10px -5px #000000;
}

.buttonGreen	{
	background-color: #20b300;
	color: #ffffff;
}


.buttonLowProfile:hover {
	color: #ef7f00;
}



.buttonLowProfile span.buttonIcon	{
	background: no-repeat scroll 0 0 transparent;
    margin-top: 3px;
    min-height: 17px;
    text-indent: -10000px;
    width: 14px;
    display: none;
}

.buttonIconRight span.buttonIcon	{
    float: right;
    margin-left: 15px;
}

.buttonIconLeft span.buttonIcon	{
    float: left;
    margin-right: 10px;
}


.buttonLowProfile span.solve	{
    background-image: url("/images/i_solve.png");
    display: inline; 
}



.buttonDefault span.order	{
    background-image: url("/images/icons_light.png");
    background-position: -456px -24px;
    display: inline;
}

.buttonLowProfile span.next, .buttonDefault span.next	{
    background-image: url("/images/icons_light.png");
    background-position: -264px -96px;
    display: inline;
}



/* if contentBlocks disable overflows their margin will not work in IE
.contentBlock {
	overflow: hidden;
}
*/

.contentBlock	.img {
	font-size: 12px;
	line-height: 16px;
}

.contentBlock_line {
	width: auto;
	height: auto;
	margin: 0 0 15px 0;
}

.contentBlock_sortlist {
	margin: 0;
	padding: 0;
	list-style-position: outside;
	list-style-type: none;
	overflow: hidden;
	clear: both;
}

.contentBlock_list {
	margin: 0;
	padding: 0;
	list-style-position: outside;
	list-style-type: none;
	overflow: hidden;
	clear: both;
}


#userForm	{
	display: none;
}


.radioButtonText	{
	cursor: pointer;
}

.unableToPlayVideo	{
	margin: 40px;
	padding: 20px;
	border: 1px solid red;
	color: red;
	font-weight: bold;
	line-height: 25px;
}


.orderDetailsList	{
    list-style-position: outside;
    list-style-type: none;
    padding: 0;
}

.orderAmount	{
	display: block;
    float: right;
    text-align: right;
    width: 60px;
}



.orderDetails	{
	margin: 10px;
}



.genericIMG	{
	border: none;
}

.genericIMG_Container	{
	position: relative;	/* for overlay images or texts */
}

.imgCaption {
	font-weight: normal;
	font-size: 12px;
	line-height: 22px;
	color: #666666;
	text-align: center;
	margin: 0;
}

.imgCaption	p	{
	padding: 5px;
	margin: 0;	
}




.imgCaption.bottomOverlay, .imgCaption.bottomOverlayWithArrow {
	width: 100%;
	position: absolute;
	pointer-events: none;
	bottom: 0;
}

.imgCaption.bottomOverlay {
	background-color: rgba(0,0,0, 0.5);
}



.imgCaption.bottomOverlay p	{
	color: #ffffff;
}

.imgCaption.bottomOverlayWithArrow {
	height: 80px;
	margin-top: -80px;
}

.imgCaption.bottomOverlay p {
	color: #ffffff;
}

.imgCaption.bottomOverlayWithArrow p {
	color: #ffffff;
	float:left;
	margin-left: 20px;
	max-width: calc(100% - 110px);
	text-align: left;
}

.imgCaption.bottomOverlayWithArrow i {
	color: black;
	background-color: white;
	float: right;
	height: 56px;
	line-height: 56px;
	width: 56px;
	font-size: 20px;
	border-radius: 30px;
	border: solid 2px grey;
	margin: 0 20px 0 0;
}

.imgCaption.topOverlay	{
	background-color: rgba(0,0,0, 0.5);
	width: 100%;
	position: absolute;
	top: 0;
	margin-top: 0;
	pointer-events: none;
}

.imgCaption.topOverlay p	{
	color: #ffffff;
}

.imgOverlay	{
	position: absolute;
}



/* for pageStructure visualisation */
.blockName	{
	font-size: 9px;
	color: #808080;
}
.hilightContainer	div:hover	{
	background-color: #d30030;
}

.hilightContainer	div div:hover	{
	background-color: orange;
}

.hilightContainer	div div div:hover	{
	background-color: yellow;
}

.hilightContainer	div div div div:hover	{
	background-color: green;
}

.hilightContainer	div div div div div:hover	{
	background-color: blue;
}

.hilightContainer	div div div div div div:hover	{
	background-color: lightgrey;
}

.hilightContainer	div div div div div div div:hover	{
	background-color: darkgrey;
}

.hilightContainer	div div div div div div div div:hover	{
	background-color: white;
}

.orderButton	{
	float: right; 
	margin: 15px 0 15px 15px;	
}

.enterVoucher	{
	line-height: 20px;
	text-align: right;
	font-weight: bold; 
}



.t_AccountingJD_CANCELLED	{
	background-color: #FFE900;
}

.t_AccountingJD_STANDARD	{
	background-color: #7AA85E;
}

.t_AccountingJD_INCOMPLETE	{
	background-color: #FF7200;
}

.t_AccountingJD_REFUND	{
	background-color: #AF158F;
}

.t_AccountingJD_ADYEN	{
	background-color: #c1c1c1;
}

.t_AccountingJD_CURRENCY	{
	background-color: #FFB900;
}

.t_AccountingJD_LINGORILLA	{
	background-color: #19CFA9;
}

.t_AccountingJD_PAYPAL	{
	background-color: #7DAEDF;
}

.t_AccountingJD_ERROR	{
	background-color: #DF0000;
}

/* xxxxxxxxxxxxxxxxxx system xxxxxxxxxxxxxxxxxxxxx */


.c_unitAdd .content-system	{
	width: auto;
	
}

.content-system {
	background-color: white;
}

.c_unitAdd	{
	overflow: auto;	
}




.content-system .c_top	{
	height: 63px;
	background-color: transparent;
	margin: 0;
}

.content-system .defaultLogo	{
	float: left;
	margin: 8px 0 0 0;
}



.content-system .c_contentInner	{
	overflow: auto;
}


/* textSetEditor */

.textSetTranslation	{
	border: 1px solid #F1F1F1;
	margin: 0 10px 10px 10px;
}

.textSetTranslationHeadLang	{
	font-weight: bold;
	font-size: 14px;
	text-transform: uppercase;
	margin-right: 7px;
}

.textSetTranslationBody	{
	height: 0px;
	overflow: hidden;
}

/* will be set to block in IE.css */
.nonPlaceholderHeader	{
	display: none;
}

.textSetEditorSlider h4	{
    margin: 0;
    padding: 3px;
    text-align: right;
    transform: rotate(-90deg) translate(-100%);
    transform-origin: left top 0;
	background-image: linear-gradient(right center , #EEEEEE 0%, #ffffff 100%);
	background-image: -moz-linear-gradient(right center , #EEEEEE 0%, #ffffff 100%);
	background-image: -o-linear-gradient(right center , #EEEEEE 0%, #ffffff 100%);
	background-image: -webkit-linear-gradient(right center , #EEEEEE 0%, #ffffff 100%);
	background-image: -ms-linear-gradient(right center , #EEEEEE 0%, #ffffff 100%);
	min-width: 70px;
	cursor: pointer;
    
}
    
    
.p_Payment .showFieldValue	{
	width: auto;
}

.dragDropParent	{
	background-color: #DFEBFF;
}

.CMS_t_Object_list_childObjects	{

	margin-left: 15px;
	
}

#SEPA input	{
	width: 90%;
}

#SEPA .showFieldValue {
	width: 370px;
}



.contentBodyContainer {
    overflow: hidden;
}


.makroTemplateGap {
	clear: both;
	/* overflow: auto;  this is to keep any 3D Perspective and to avoid collapsing to 0px height in case of floating children! */ 
	position: relative; /* we want this at least during configuration so that absolute positioned elements do not overlap */
		
}

.makroTemplateGap + .makroTemplateGap	{
	margin-top: 20px;

}


.textBlockWithImage	{
	/* to avoid border collapsing */
	overflow: hidden;
}

.textBlockImage	{
	margin-bottom: 10px;
}

.textBlockWithImage.imagePos_left .textBlockImage	{
	float: left;
	margin-right: 15px;
	margin-left: 0px
	
}

.textBlockWithImage.imagePos_right .textBlockImage	{
	float: right;
	margin-left: 15px;
	margin-right: 0px
	
}

.adminOpenObject	{
	float: right; 
	overflow: visible; 
	text-align: right; 
	position: relative;  
	width: auto; 
	height: 0; 
	top: 10px; 
	right: 25px; 
	cursor: pointer;
	z-index: 200;	
}



/* we MUST not set a witdth for the configuration container globally
since any content can require different values here which must be 
defined by the content itself!
.c_CMS_t_ObjectConfigurationContainer	{
	width: 700px;
}
*/



.c_rasterContainer + .c_rasterContainer	{
	margin-top: 10px;
}



.c_rasterContainer	{
	margin-bottom: 10px;
	clear: both;
	-moz-box-sizing: border-box;
	box-sizing: border-box;

}

.c_rasterContainer .c_rasterContainer	{
	margin-bottom: 10px;
	margin-top: 0;
}



.raster	{
	margin: 0;
	position: relative;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	padding-right: 5px;
}

.raster + .raster	{
	padding-right: 8px; /*SMD 0px originally */
	padding-left: 8px;
}

.raster:first-of-type	{
	padding-left: 0;
	padding-right: 16px;
}

.raster:last-of-type	{
	padding-left: 16px;
	padding-right: 0;
}


.rasterContainer21 .contentBlock_raster1	{
	width: 33.3%;
}

 .rasterContainer3 .contentBlock_raster1	{
	width: 33.3%;
}

.rasterContainer4 .contentBlock_raster1	{
	width: 25%;
}

.rasterContainer4 .contentBlock_raster2	{
	width: 50%;
}

.rasterContainer21 .contentBlock_raster2	{
	width: 66.6%
}


.rasterContainer11 .contentBlock_raster1, .rasterContainer11 .contentBlock_raster2	{
	width: 50%;
}


.rasterFloatLeft .raster	{
	float: left;
}

.rasterFloatRight .raster	{
	float: right;
}


.contentBlock_raster3	{
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	width: 710px;
}

.htmlClose {
    box-sizing: border-box;
	-moz-box-sizing: border-box;
    background-color: rgba(255, 255, 255, 0);
    color: #444444;
    border: 2px solid #444444;

    font-size: 15px;
    height: 20px;
    width: 20px;
	right: 0;
    top: 0;

    line-height: 20px;
    padding: 0 0 0 5px;
    position: absolute;
    transition: all 0.3s ease 0s; 
	box-shadow: 0px 0px 10px 3px #444444; 
	cursor: pointer;
}

.htmlClose:hover	{
	/* background-color: rgba(0, 138, 201, 0.7); */
	border-color: #000000;
	color: #000000;
	box-shadow: 0px 0px 5px 3px #000000;
	border-radius: 15px;
	
}


.composeDebug	{
	display: none;
}

.composeGlobalDebug .composeDebug	{
	display: block;
}

.actionIcon	{
	width: 16px;
	height: 16px;
	background-image: url(/images/icons_dark.png);
	display: block;
	float: right;
	margin-left: 2px;
	margin-right: 2px;
	cursor: pointer;
}

.actionIcon:hover	{
	background-image: url(/images/icons_light.png);
}

.actionView	{
	background-position: -96px -120px;
}

.actionPrint	{
	background-position: -96px -48px;
}


.composeProcess	{
	min-width: 300px;
}

.composeProcessError {
	border: 2px solid red; 
	padding: 10px; 
	margin: 5px;
}

.composeProcess .form	{
	width: 78%;
	height: 100%;
	border-right: 1px solid #DCDCDC;
	min-width: 330px;
}

.clickable	{
	cursor: pointer;
}

fieldset	{
	padding: 0;
	margin: 0;
	border: none;
}

.inputFieldset {
	 padding: 7px 0;
}

.formFieldset legend	{
  font-size: 16px;
  font-weight: 700;
  padding: 15px 0 5px 15px;
}

.form_label	{
	float: left;
    font-weight: 700;
    line-height: 20px;
    padding: 4px 0;
    text-align: right;
    width: 25%;
}

body[dir="rtl"] .form_label	{
	float: right;
	text-align: left;
}

.form_field_container	{
	width: 50%;
	float: left;
}

body[dir="rtl"] .form_field_container	{
	float: right;
}

.form_field_container_checkbox	{
	width: 50%; /* was 55% ... but this makes it wider than others */
}


.form_field_container_radioContent	{
	width: 100%;
	float: none;
}

.form_field {
    display: block;
    position: relative;
    clear: both;
    
}

.form_field:hover	{
	background-color: #FFFFE0;
}


.form_field:hover .form_help_bubble	{
	display: block;
} 

.form_field_icon.help_icon	{
	background-image: url(/images/i_question.png);
	visibility: visible;
	cursor: pointer;
}

.form_help	{
	width: 6%;
    padding: 0 4px 0 0;	
    float: left;	
    
}

.form_help_bubble	{
	position: absolute;
	right: -27%;
/*	top: -5px; */
	width: 25%;
	height: auto;
	background-color: #FFFFE0;
	border: 1px solid #DCDCDC;
	
	padding: 0 7px 10px 7px;
	
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	
	display: none;
	overflow: hidden;
}

.upper_help_bubble	{
	top: -5px;
}

.lower_help_bubble	{
	bottom: -5px;
}


.form_edit_field	{
	float: left;
    padding: 0 1% 0 0;	
    width: 95.5%;
} 

.form_field .form_edit_field input, .form_field .form_edit_field select	{
	height: 28px;
	padding: 4px;
	max-width: 100%;	
}


.form_edit_field_radioContent	{
	padding: 15px;
}

.form_field .form_edit_field textarea	{
	/* otherwise textareas are wider than the parent */
	width: 97%;
	max-width: 120%;
}

.form_field_icon {
    height: 100%;
    margin: 0 0 0 10px;
    padding-left: 30px;
	float: left;

    background-position: 0 1px;
    background-repeat: no-repeat;
    font-size: 25px;
    line-height: 28px;
	visibility: hidden;    
}

body[dir="rtl"] .form_field_icon {
	float: right;
    margin: 0 10px 0 0;
    padding-right: 30px;	
}


.inputFieldset.form_field_valid .form_field_valid_icon {
	 background-image: url("/images/ok.gif");
	 visibility: visible;
}

.inputFieldset.form_field_invalid .form_field_valid_icon {
	 background-image: url("/images/notok.gif");
	 visibility: visible;
}

.inputFieldset.waitElement	{
	margin: inherit;
	padding: inherit;
	display: inherit;
	background-image: none;
	background-position: inherit;
}

.inputFieldset.waitElement .form_field_valid_icon	{
	background-image: url(/images/ajax3.gif);
}

.form_field .form_edit_field input, .form_field .form_edit_field select {
    width: 100%;

    background: none repeat scroll 0 0 #FFFFFF;
    border: 1px solid #B4B4B4;
    box-shadow: 0 1px 1px #E5E5E5 inset;
    -moz-box-shadow: 0 1px 1px #E5E5E5 inset;
    color: #666666;
    
    font-size: 12px;
    height: 28px;
    line-height: normal;
    padding: 4px;
}

.inputFieldset legend	{
  font-size: inherit;
  font-weight: 700;
  padding: inherit;
  padding: 0;
}

.formFieldsetNoLegend legend	{
	display: none;
}

.form_edit_field_radio	{
	padding: 6px 0;
}

.radioContentValue	{
	float: left;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	
	cursor: pointer;
	
	padding: 5px; 
	border: 1px solid red;
}

.radioContentValue_selected	{
	background-color: orange;
}

.form_edit_field_checkbox	{
	padding: 8px 0;
}

.form_edit_field_display	{
	line-height: 20px;
	font-size: 15px;
	padding: 3px 0;
}

.form_edit_field_checkbox i.fa.fa-check {
	display: none;
}

.form_edit_field_radio	label, .form_edit_field_checkbox	label  {
	vertical-align: top;
	margin-left: 10px;

	width: 80%;
	display: inline-block;
}

.form_edit_field_radio .radioValue	{
	height: auto;
	margin-bottom: 7px;	
}


.form_field .form_edit_field input[type='radio'], .form_field .form_edit_field input[type='checkbox'] {
	width: auto;
	height: auto;
	margin: 0;
	padding: 0;
}


.form_field .edit_street, .form_field .edit_city {
	width: 65%
}

.form_field .edit_nr, .form_field .edit_zip {
	width: 30%
}

.form_field .edit_firstName, .form_field .edit_name {
	width: 47.5%
}


.clearfix:after { 
   content: " ";
   display: block; 
   height: 0; 
   clear: both;
}

.passiveForm	{
	height: 36px;	/* will be adjusted by template */
	
	background-color: #FCFCFC;

	background-image: linear-gradient(bottom, rgb(229,230,232) 0%, rgb(237,237,237) 25%, rgb(254,254,254) 83%);
	background-image: -o-linear-gradient(bottom, rgb(229,230,232) 0%, rgb(237,237,237) 25%, rgb(254,254,254) 83%);
	background-image: -moz-linear-gradient(bottom, rgb(229,230,232) 0%, rgb(237,237,237) 25%, rgb(254,254,254) 83%);
	background-image: -webkit-linear-gradient(bottom, rgb(229,230,232) 0%, rgb(237,237,237) 25%, rgb(254,254,254) 83%);
	background-image: -ms-linear-gradient(bottom, rgb(229,230,232) 0%, rgb(237,237,237) 25%, rgb(254,254,254) 83%);

    border-left: 1px solid #CDD2D8;
    /* border-top: 1px solid #CDD2D8 */;
    border-bottom: 1px solid #B9B9B9;
    border-right: 1px solid #B9B9B9;
	overflow: hidden;

	color: black;
	
	position: relative;
	
  	line-height: 36px;	
}

.passiveFormHeader	{
  font-size: 16px;
  font-weight: 700;

  padding-left: 1px;
}


.passiveForm_lookahead .passiveFormHeader	{
	color: #B9B9B9;
}

.passiveFormComment	{
	float: right;
	padding-right: 20px;
}

.passiveFormIcon	{
	background-image: url("/images/ok.gif");
    background-position: 0 6px;
    line-height: 36px;
    visibility: visible;
        
}

.passiveForm_lookahead .passiveFormIcon	{
	color: #B9B9B9;
}


.passiveFormLeft	{
	width: 78%;
}

.passiveFormRight	{
	width: 22%;
	height: 36px;
	
	position: absolute;
	right: 0;
	top: 0;
	
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	
	border-left: 1px solid #DCDCDC;
	background-color: #F1F1F1;

	text-align: right;

	
}

.processBarStep1	{
	display: none;
}


.processBarStep2	{
	width: 50%;
}

.processBarStep3	{
	width: 33%;
}

.processBarStep4	{
	width: 25%;
}

.processBarStep5	{
	width: 20%;
}


.processBar  li:nth-child(1) {
	z-index: 10;
}


.processBar  li:nth-child(2) {
	z-index: 9;
}

.processBar  li:nth-child(3) {
	z-index: 8;
}

.processBar  li:nth-child(5) {
	z-index: 7;
}
.processBar  li:nth-child(6) {
	z-index: 6;
}
.processBar  li:nth-child(7) {
	z-index: 5;
}
.processBar  li:nth-child(8) {
	z-index: 4;
}
.processBar  li:nth-child(9) {
	z-index: 3;
}


.toolbar ul	{
	padding: 0;
	list-style-type: none;
	margin: 0;
}

.toolbar ul li	{
	float: left; 
	margin: 0 3px;
	cursor: pointer;

}

.composeLogo	{
	float: right;
}

body[dir="rtl"] .composeLogo	{
	float: left;
}

#composePoweredByContainer	{
	background-color: #ffffff;
}


.genericTE_row:nth-child(even)	{
	background-color: #f0f0f0;
}

.genericTE_row:nth-child(odd)	{
	background-color: #ffffff;
}

.genericTE_row:hover	{
	background-color: #dddddd;
}

.genericTE_row:nth-child(even).genericTE_row_open:hover	{
	background-color: #f0f0f0;
}

.genericTE_row:nth-child(odd).genericTE_row_open:hover	{
	background-color: #ffffff;
}

.genericTE_row.showSendForm:nth-child(even):hover	{
	background-color: #f0f0f0;
}

.genericTE_row.showSendForm:nth-child(odd):hover	{
	background-color: #ffffff;
}

.genericTE_subList	{
	margin-left: 15px;
	padding-bottom: 15px;

	display: none;
}


.genericTE_pageCounter	{
	padding: 10px;
	margin: 0 0 15px 0;
	border-top: 1px solid #a0a0a0;
	text-align: center;
}

.genericTE_row_open .genericTE_subList	{
	display: block;
}

.genericTE_subList_filter	{
	border-top: 1px solid #CFD2D5;
	border-left: 1px solid #CFD2D5;
	border-right: 1px solid #CFD2D5;
	
	padding: 10px;
}

.genericTE_filterInfo	{
	font-weight: bold; 
	margin: 0 15px; 
	float: left;
}


.wndBody .contentData	{
	margin: 20px;
}



#messageArea {
  position: relative;
  
  margin-left: auto;
  margin-right: auto;
  max-width: 50em;
  max-height: 0;
  transition: max-height 0.5s ease-out;
  overflow: hidden;
}


#messageArea .dismissButton {
  margin-top: -3px;
  float: right;
  cursor: pointer;
  font-size: 16px;
  color: #888888;

}
#messageArea .dismissButton:hover {
  color: #546979;
}
#messageArea.open {
  display: block;
  max-height: 500px;
  transition: max-height 0.3s ease-in;
}


.composeMessage	{
	font-weight: bold;
    max-height: 0;
    min-height: 0;
    overflow: hidden;
    position: relative;
    transition: max-height 0.3s ease-out 0s;
}

.composeMessage.open {
    max-height: 500px;
    min-height: 30px;
}


.composeMessage.logLevel250	{
	color: #20B300;
}

.composeMessage.logLevel300	{
	color: orange;
}


.composeMessage.logLevel400	{
	color: red;
}


.c_mobilerotate_overlay {
	position: fixed;
	left: 0;
	top: 0;
	width: 100vw;
	height: 100vh;
	z-index: 800;
	line-height: 100vh;
	background-color: white;
	text-align: center;
	display: none;
	opacity: 0;
	visibility: hidden;
}

.fa-icon-green	{
	color: #00aa00;
}

.fa-icon-red	{
	color: #dd0000;
}

.fa-icon-toolbar	{
	cursor: pointer;
}