
@media screen {

/* HTML-Struktur:
div#lbx_wrapper > div#lbx_body > 
	1) div#top_btns > a#btn_close
	2) h2
	3) div#lbx_content >
			a) h3
			b) div#selectBox >
				I)   div > a
				II)	 div > a
				III) h4
				IV)  table#selectTable ...
			c) div#shareBoxBtn >
					A) span#smnSaveBtn
					B) span#smnResetBtn
*/

#lbx_wrapper {
    background: rgba(64, 64, 64, 0.5) none repeat scroll 0 0;
    left: 0;
    min-height: 2500px;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 1000;
}

div#lbx_wrapper div#lbx_body {
    background-color: rgb(60, 80, 110); /* Fallback1, old browsers */
    background-color: rgba(60, 80, 110, 0.8); /* Fallback2, missing image */
	background: transparent url("../images/system_bilder/blue-background_1px_tr_80pr.png") repeat scroll 0 0 !important;
	color: #3b3b3b;
	margin: 0 auto;
	min-width: 150px !important;
	max-width: 830px;
	min-width: 400px;
	z-index: 10000;
}

#lbx_body h3 {
    clear: both;
	font-size: 24px;
    color: #fff;
    padding-left: 38px;
	text-transform: none;
}

#lbx_body #lbx_content {
    background: #fff none repeat scroll 0 0;
}

#lbx_body #selectBox,
#lbx_body #selectBox h4 {
    font-size: 17px;
	font-weight: normal;
	font-family: "BentonSans-Regular",Georgia,"Times New Roman",Times,serif;
	text-transform: none;
	color: #3b3b3b;
}

#lbx_body #selectBox h4 {
	margin: 1em 0 0.5em;
}

#lbx_body #selectBox div > a {
    font-weight: bold;
}

#selectBox div > a {
    font-weight: bold;
}

#lbx_wrapper_sb a,
#lbx_wrapper_sb a:hover 
#lbx_wrapper_sb a:link, 
#lbx_wrapper a,
#lbx_wrapper a:hover 
#lbx_wrapper a:link, 
#lbx_content .smnBtn, 
#lbx_content .smnBtn:hover {
	color: #3c506e !important;
    text-transform: none !important;
}

#lbx_content #selectBox table#selectTable {
    -moz-border-bottom-colors: none !important;
    -moz-border-left-colors: none !important;
    -moz-border-right-colors: none !important;
    -moz-border-top-colors: none !important;
    border-color: #ccc -moz-use-text-color !important;
    border-image: none !important;
    border-style: solid none !important;
    border-width: 1px 0 !important;
	width: 100% !important;
}

#lbx_content #selectBox table#selectTable tr {
    background: white none repeat scroll 0 0 !important;
}

#lbx_content #selectBox table#selectTable tr.header th {
    background: #eaeff6 none repeat scroll 0 0 !important;
	color: #000;
    padding: 5px;
}

#lbx_content #selectBox table#selectTable th {
    font-weight: normal;
    text-align: left;
    vertical-align: top;
}

/* Social-Media - Umschalt-Buttons */
#lbx_content #selectBox table#selectTable tr th span.selectStatusBtn,
#lbx_content #selectBox table#selectTable tr td span.selectStatusBtn {
    background-image: url("../images/system_bilder/socialbookmarks_activate.png");
    background-position: left top;
    cursor: pointer;
    display: block;
    float: left;
    height: 12px;
    margin: 5px 0 0 10px;
    width: 23px;
}

#lbx_content #selectBox table#selectTable td {
    padding: 5px;
    font-weight: bold;
    vertical-align: top;
}

#lbx_content #selectBox table#selectTable tr th span.selectStatusBtn.status1,
#lbx_content #selectBox table#selectTable tr td span.selectStatusBtn.status1 {
    background-position: left -12px;
}

#lbx_content #selectBox table#selectTable .smnlabel {
    cursor: pointer;
}

/* /Social-Media - Umschalt-Buttons */


/* ToDo: eigentlich reine table-Styles! Ggf. ins allgemeine Stylesheet auslagern, wenn generell passend! */
#lbx_content #selectBox table#selectTable {
	font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
    border-bottom: 15px solid #3c506e;
	border-collapse: collapse;
    margin: 10px 0 0 !important;
    overflow: hidden;
    border-spacing: 0;
    font-size: 0.857em; /* TODO: in rem umwandeln */
    margin: 10px 0;
    width: 100%;
}

#lbx_content #selectBox table#selectTable tbody {
    border-top: 1px solid #ccc;
}

#lbx_content #selectBox table#selectTable  tr th,
#lbx_content #selectBox table#selectTable  tr td {
	border: 0 none;

}
/* /ToDo: ggf. ins allgemeine Stylesheet auslagern, wenn generell passend! */


/* Social Media - Lightbox - Buttons (ohne Umschalter) */

/* oberer Button (STK: 'top_btns' statt 'close_btn'!) */
#lbx_body #close_btn a#btn_close {
    background: rgba(0, 0, 0, 0) url("../images/system_bilder/closeBtn.png") no-repeat scroll right top;
    color: #fff !important;
    cursor: pointer;
    float: right;
    height: 47px;
    line-height: 47px;
    padding: 0 55px 0 15px;
}

#lbx_body #close_btn a#btn_close:hover {
	background-color: rgba(64, 64, 64, 0.5);
	text-decoration: underline;
}
/* /oberer Button (STK: 'top_btns' statt 'close_btn'!) */


/* untere Buttons (STK: anderer Name 'shareBoxBtn'!) */

#lbx_content #save_break_Btns {
    margin: 15px 0 15px 15px !important;
	text-align: right;
}

/* - Speichern - Button - */
#lbx_content .smnBtn, 
#lbx_content .smnBtn:hover {
    background: transparent url("../images/system_bilder/save_submitBtn.png") no-repeat scroll right center;
    color: #3c506e;
    cursor: pointer;
    font-family: "BentonSans-Bold";
    font-size: 12px !important;
    font-weight: normal;
    height: 40px;
    margin-top: 20px;
    padding: 10px 55px 10px 10px;
    text-transform: uppercase;
}
/* - /Speichern - Button - */

/* - Abbrechen - Button - */
#lbx_content #smnResetBtn {
    background: transparent url("../images/system_bilder/break_resetBtn.png") no-repeat scroll right center !important;
}
/* /- Abbrechen - Button  - */

/* /untere Buttons (STK: anderer Name 'shareBoxBtn'!) */

}


@media only screen and (max-width: 549px)  {

	#lbx_body h3 {
		font-size: 20px;
		padding: 0 20px;
	}

	#lbx_body {
		padding: 20px;
		width: 95%; /* land: 80%; */
	}
	
	#lbx_content {
		padding: 20px;
	}
	
	.smnBtn {
		display: block;
	}

}
/* Ende: '@media only screen and (max-width: 549px)' */


@media only screen and (min-width: 550px)  {

	#lbx_body h3 {
		font-size: 24px;
		padding-left: 38px;
	}

	#lbx_body {
		width: 70%;
		padding: 30px;
	}
	
	#lbx_content {
		padding: 30px 40px;
	}

}
/* Ende: '@media only screen and (min-width: 550px)' */