/*
	this is a CSS class to be used through out the wordpress plugins
*/
.fixed .column-actions {
	width: 7%;
}

span.icon, span.icon20, span.icon50, span.icon90 {
	margin: 2px;
	height:16px;
	width:16px;
	display: block;
	cursor: pointer;
}
span.icon20 { margin: 4px !important; height: 20px; width: 20px;}
span.icon50 { margin: 0px;	height: 50px; width: 50px;}
span.icon80 { height: 80px; width: 80px; }
span.icon90 {height: 70px; width: 90px; }

.lb-note {
	background-color: #F8F8BB;
	padding: 5px;
	box-shadow: 2px 2px 2px grey;
	display: none;
}

.lb-container label { margin-left: 10px;}

.float_center {position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);}
.lb-telecom {background-position: 0px 0px;}
.lb-merchant-icon {background-position: -90px 0px;}
.lb-shipping-icon {background-position: -180px 0px;}
.lb-waste-icon {background-position: -270px 0px;}
.lb-eld-icon {background-position: -360px 0px;}
.lb-esignature-icon {background-position: -450px 0px;}
.lb-utilities-icon {background-position: -540px 0px;}
.lb-fuel-icon {background-position: -630px 0px;}
.lb-icon{ background-image: url('images/lightbox_icons20.png'); }
.lb-icon50{ background-image: url('images/lightbox_icons50.png'); }
.lb-services{background-image: url('images/services_spritesheet.png');}
.play-button {background-image: url('../images/play_button.png'); opacity:0.9; background-size:cover;}
.photos-icon { background-position: -60px 0px; }
.videos-icon { background-position: -120px 0px; }
.documents-icon { background-position: -20px 0px; }
.documents-icon50 { background-position: -50px 0px; }
.podcasts-icon { background-position: 0px 0px; }
.lightbox-icon { background-position: -80px 0px; }
.download-icon { background-position: -40px 0px;}

.lb-sample {position: relative; cursor: pointer;overflow:auto;}
.lb-sample { padding: 5px; }
.lb-sample.photos, .lb-sample.video { 
	margin-bottom:  30px;
	box-shadow: 2px 2px 2px grey;
	border: 1px solid grey;
	border-radius: 4px;
}
.lb-sample.photos:hover, .lb-sample.video:hover {
	background-color: #E4EAF2;
}
.lb-sample.video:hover .play-button{opacity:1;}
.lb-element {
	border-radius:4px;
	border:1px solid #8699BD;
	text-shadow: 1px 1px 1px #3B5068;
	cursor: pointer;
	margin: 10px 0px;
}

.lb-element.service {border:none;}

.lb-content-column {
	width: 32%;
	float:left;
	margin-right:1%;
}

.lb-element.service .lb-element-title {height: 5em; background-image: none; background-color: #3B5068; }
.lb-element.service .lb-element-title:hover {background-image: none; background-color: black; }
.lb-element-title {position:relative; height: 4em; background-image: url('images/button.png');background-repeat:repeat-x; background-size: auto 100%; border-radius:4px;color:white;}
.lb-element:hover .lb-element-title, .lb-element-title:hover { background-image: url('images/button_hover2.png');color:#fff79d;}
.lb-element-title h4{
	width: 90%;
	font-family: Oswald;
	text-align:center;
	margin:0px;
	text-shadow: 2px 2px 2px #3B5068;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.lb-sample h4{
	font-family: Oswald;
	margin:0px;
	position:absolute;
	top:50%;
	left:65px;
	transform: translate(0px,-50%);
}
.lb-sample.documents:hover, .lb-sample.podcasts:hover { background-image: url('images/button.png');background-repeat:repeat-x; background-size: auto 100%;}
.lb-sample:hover h4{ text-decoration:underline;}

.lb-element-body {margin:4px 0px; display:none;}
.lb-content-type {overflow:auto;padding:3px 10px;}
.lb-content-type:hover {background-color: #E4EAF2}
.lb-content-type label {padding-top:3px;}
.lb-content-type label:hover {text-decoration:underline;}


.white-icons { background-image: url('images/ui-icons_e0fdff_256x240.png'); }
.edit-button { background-position: -64px -112px; }
.trash-button { background-position: -176px -96px; }
.undo-btn {background-position: 0px -64px;}
.add-btn {margin:17px; background-position: -16px -128px; }

.add-btn, .edit-button, .trash-button, .undo-btn {
	background-color: #3B5068;
	border-radius: 2px; 
	box-shadow: 1px 1px 1px grey;
}

.edit-button:hover, .trash-button:hover, .add-btn:hover, .undo-btn:hover { background-color: #8699BD; }

.deactivated { background-color: lightgrey;}
.office_identifier { display:block; font-size:10px;}
.wpbody .add-new-h2 { cursor:pointer; }
.lightbox-edit-row {	background-color: #E6E9F1; }

.close-container, .front-close-container{
	position: absolute;
	top:0px;
	right:0px;
	font-family: arial black,sans-serif;
	color:grey;
	text-align: center;
	padding: 10px;
	font-size:20px;
	cursor:pointer;
}

.front-close-container {
	font-size: 14px;
}

.close-container:hover, .front-close-container:hover { color:black; background-color: lightgrey; }

.editor-header {
	overflow:auto;
}

.editor-header h3 {
	float:left;
}

.editor-header input {
	margin: 1em 0px;
	width: 100%;
	font-size: 18px;
}

input.faded_text {
	color: grey;
}

.lb-header {
	padding: 10px;
	margin-bottom: 10px;
	box-shadow: 1px 0px 2px #E7EBF5;
	border-bottom: 2px solid #3B5068;
	background-color:white;
	height:42px;
}
.lb-body, .lb-footer {
	overflow:auto;
	padding:10px;
	height: 75vh;
}


.lb-save {
	margin-left: 10px;
}

.loading_lightbox, .lightbox-edit-content {
	padding: 5px;
}

.lightbox-edit-content { height: 300px; }

#lb-content-container {
	width: 50%;
	left: 25%;
}
#lb-group-container {
	width: 90%;
	left: 50%;
	margin-left:-45%;
}

.lightbox-container{
	position: fixed;
	z-index: 10001;
	top:10%;
	background-color:#F1F1F1;
	display: none;
	max-height:90%;
}

.lightbox-backdrop {
	position: fixed;
	top: 0px;
	left: 0px;
	right: 0px;
	bottom: 0px;
	min-height: 360px;
	background: #000 none repeat scroll 0% 0%;
	opacity: 0.7;
	z-index: 10000;
	display: none;
}

.container-level2 { z-index: 10003; }
.backdrop-level2 { z-index: 10002; }

#lb-content-editor.lb-container {
	height: 100%;
	background-color:white;
}

#lb-content-container {
	overflow:auto;
}


.lb-content-container {
	float:left;
	width: 23%;
	margin:1%;
	box-shadow: 2px 2px 4px grey;
	background-color:white;
	overflow:auto;
}

.lb-content-header {
	border-bottom: 1px solid #3B5068;
	padding: 4%;
	overflow:auto;
}

.lb-content-header h3 {
	color: #3B5068;
	font-family: Oswald;
	float:left;
	margin-top:2px;
	margin-bottom:0px;
}

.lb-content-container ul {
	list-style-type: none;
	padding: 0px;
	max-height: 55vh;
	overflow:auto;
}
.lb-content-container li { position:relative; margin: 0px; padding:5px; cursor:pointer;}
.lb-content-container li.ordering{border:1px dashed #CCC; margin-bottom: 5px;}
.lb-content-container li.ordering.selected{border:2px dashed #3B5068;}
.lb-content-container li:hover {background-color: #8699BD !important;}
.lb-content-container li:nth-child(odd){background-color:#E7EBF5;}

#lb-front-content-container {
	background-color: white;
	left:50%;
	margin-left:-25vw;
	width:50vw;
}
#lb-front-content-container .lb-content-header {
	border:none;
	padding: 10px;
}
#lb-front-content-container .lb-content-body {
	padding: 10px;
	max-height: 75vh;
	overflow-y:auto;
}
#lb-front-content-container .lb-content-footer {
	overflow:auto;
	padding: 10px;
	background-color: #E7EBF5;
}

.lb-previous, .lb-next { cursor:pointer; }
.lb-previous:hover, .lb-next:hover { text-decoration:underline;}
.lb-page{position:absolute;left:50%; transform: translate(-50%, 0px);}

.back-button, .next-button { background-image: url('images/back_next_spritesheet.png');  background-size: auto 100%;} 
.back-button {background-position: -200% 0%;}
.next-button {background-position:0% 0%;}
.lb-previous:hover .back-button {background-position: -300% 0%;}
.lb-next:hover .next-button {background-position: -100% 0%;}

.wp-video {
	margin: auto;
}

.play-media, .time-media, .vol-media, .fullscreen-media {
	width: 27px;
	height: 27px;
	display:block;
	float:left;
}

.play-media { background-image: url("../images/play_media.png"); }
.bar-media{ height:27px; background-image: url("../images/bar_media.png"); background-repeat: repeat-x; margin-left: 27px; overflow: auto; margin-right: 91px; }
.fullscreen-media{ background-image: url("../images/screen_media.png"); }
.vol-media{ background-image: url("../images/vol_media.png"); width:64px; }
.time-media { background-color:#1a1717; color: white; width: 40px; padding: 2px 5px;}

.the_big_three {
	width: 95%;
	position: absolute;
	overflow: auto;
	background-color: #E4EAF2;
	border-radius: 5px;
	z-index: 50;
	box-shadow: 5px 5px 5px #B0B0B0
}

.the_big_three_column {
	float:left;
	width: 40%;
	padding: 1%;
}


@media screen and (max-width: 1250px) {
	.lb-content-column {
		width: 49%;
	}
	
	#lb-content-container {
		width: 70%;
		left: 15%;
	}
	.the_big_three_column {
		width: 50%;
	}
}

@media screen and (max-width: 950px) {
	#lb-front-content-container {
		left:0px;
		margin-left:0px;
		width:97vw;
	}
	
	#lb-content-container {
		width: 80%;
		left: 10%;
	}
	.lb-content-column {
		width: 100%;
		margin: 0px;
	}
}


@media screen and (max-width: 750px) {
	
	#lb-content-container {
		width: 100%;
		left:0px;
	}
}