div.editable{ margin-bottom: 12px; background-color: white; padding: 8px; border: 1px solid #ccc; min-height: 150px; padding: 8px; border-radius: 8px; }	
	
.dropzone {
	min-height: auto;
	border-radius: 12px;
	background: transparent;
	padding: 12px 12px;
	border: 4px dashed #ccc;
}
.dropzone .dz-preview.dz-image-preview { background: transparent; }

.dropzone .dz-preview .dz-image {
	border-radius: 0px;
	width: 100%;
	height: auto;
}

div.tile-preview-container{ padding-top: 6px; padding-bottom: 16px; }
article.tile-preview img[not:#video]{ max-height: 200px; max-width: 100%; width: auto; margin: 0 auto; border-radius: 8px; }
article.tile-preview a{ margin: 0px; border-radius: 8px; }
article a{ height: auto; }
div#contact_template{ display: none; }

.multicol
{
	-webkit-column-count: 3;
	-moz-column-count: 3;
	column-count: 3;
	-webkit-column-gap: 24px;
	-moz-column-gap: 24px;
	column-gap: 24px;
	height: 280px;
}
@media screen and (max-width: 800px) 
{
	.multicol
	{	
		-webkit-column-count: 2;
		-moz-column-count: 2;
		column-count: 2;
		height: 400px;
	}
}
@media screen and (max-width: 560px) 
{
	.multicol
	{	
		-webkit-column-count: 1;
		-moz-column-count: 1;
		column-count: 1;
		height: auto;
	}
}

.live-event-container
{
	height: 50px;
	width: 50px;
	position: relative;
	float: right;
}
article .live-event-container
{
	height: 50px;
	width: 50px;
	position: absolute;
	bottom: 0px;
	right: 0px;
}
.live-event 
{
	height: 50px;
	width: 50px;
	background-color: red;
	animation-name: pulse-red;
	animation-duration: 1.5s; 
	animation-timing-function: ease-out; 
	animation-delay: 0;
	animation-direction: forward;
	animation-iteration-count: infinite;
	animation-fill-mode: none;
	animation-play-state: running;
	border-radius: 50%;
	display: block;
}
.live-dot
{
	background-color: red;
	border-radius: 50%;
	width: 8px;
	height: 8px;
	position: absolute;
	top: 21px; left: 21px;
	opacity: 1;
}

article .video-icon
{
	max-width: 24px;
	position: absolute;
	bottom: 12px;
}
@keyframes pulse-red
{
	0% { transform: scale(.1); background-color: red; opacity: 0.5; }
	100% { transform: scale(1); opacity: 0; }
}

.sticky{ padding-top: 0px; }
.sticky span{ display: none; }
.sticky div.content-section-margin{ padding-top: 0px; padding-bottom: 0px; }
img#video{ /*float: right; width: 48px; height: 48px;*/ max-width: 24px; }

div.contact div.content-section-inner, div.contact div.flex-inner{ border: 0px solid #ccc; border-radius: 8px; }

.narrow .dashboard-header .content-section{ max-width: 640px; }

/* placement contacts */
.contact-select div.contact div.content-section-inner
{
	margin: 8px;
	border: 3px dashed #ccc;
}
.contact-select div.contact.selected div.content-section-inner
{
	background-color: #ffffff;
	border: 3px solid black;
}
.contact-select .contact:hover .content-section-inner
{
	background-color: rgb(255,232,0);
	cursor:pointer;
}

main div.content-section p a.like-employer { border: 0; }
a.like-employer img{ max-width: 96px; }
article img.liked-icon{ position: absolute; bottom: 12px; max-width: 24px; left: 0; 
  right: 0; 
  margin-left: auto; 
  margin-right: auto;  }

.video-inner{ background-color: black; }
.video-inner iframe{ max-width: 100%; }

div.timeslots { padding-left: 12px; padding-right: 12px; }
div.timeslots div.timeslots-inner{ padding-left: 6px; padding-right: 6px; }
div.timeslots ul.radio-buttons li { width: 25%; }
div.timeslots ul.radio-buttons li span{ display: block; margin: 6px; }
div.timeslots ul.radio-buttons li label{ padding: 8px; text-align: center; border: 1px solid black; border-radius: 8px; }

div.timeslots ul.radio-buttons li.not-available span{ text-decoration: line-through; text-decoration-color: black; }
div.timeslots ul.radio-buttons li.not-available label{ color: black; cursor: not-allowed; background-color: #ccc; border-color: transparent;  }
div.timeslots ul.radio-buttons li.available:hover label, div.timeslots ul.radio-buttons li.available label:focus{ background-color: white; }
div.timeslots ul.radio-buttons li.available:hover label, div.timeslots ul.radio-buttons li.available label:focus{ color: black; border-color: black; }
div.timeslots ul.radio-buttons li.available:hover input[type=radio]:checked ~ label { color: black; background-color: rgb(253, 230, 0); }

div.timeslots ul.radio-buttons input[type=radio]:checked ~ label { color: black; background-color: rgb(253, 230, 0); }

@media screen and (max-width: 640px)
{
	div.timeslots { padding-left: 0px; padding-right: 0px; }
}