body,
div,
h1, h2, h3, h4, h5, h6,
a, p, span,
table, tr, td
{
	font-family: Open Sans, sans-serif !important;
}

body,
p,
table,
form,
li,
.prefix, .postfix
{
	font-size: 10pt;
}

body
{
	background-color: #FFF;
	display: flex;
	flex-direction: column;
	height: 100%;
	width: 100%;
	border: 0;
	margin: 0;
	-webkit-overflow-scrolling: touch;
}

form input::-webkit-input-placeholder
{
   color: #CCC;
}

form input:-moz-placeholder
{
   color: #CCC;
}

form input::-moz-placeholder
{
   color: #CCC;
}

form input:-ms-input-placeholder
{
   color: #CCC;
}

form input.field-error::-webkit-input-placeholder
{
   color: #F66;
}

form input.field-error:-moz-placeholder
{
   color: #F66;
}

form input.field-error::-moz-placeholder
{
   color: #F66;
}

form input.field-error:-ms-input-placeholder
{
   color: #F66;
}

hr
{
	margin-top: 0;
	margin-bottom: 10px;
}

.error
{
	color: red;
}

input.ng-invalid,
select.ng-invalid,
.field-error
{
	color: red !important;
	border-left: 1px solid #F50;
}

.warning
{
	color: orange;
}

.calendar-icon {
	display: flex;
	justify-content: center;
	font-size: 1.4375rem;
}

.noselect {
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	cursor: default;
}

[ng\:cloak], [ng-cloak], .ng-cloak {
  display: none !important;
}

.helptext {
   display: none;
}

.subordinate
{
	color: #999;
}

input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

input[type="number"] {
	-moz-appearance: textfield;
}

.top-bar
{
	flex: none;
}

.top-bar.expanded,
.top-bar.expanded ul,
.top-bar.expanded li
{
	z-index: 10000;
}

.top-bar img.logo
{
	height: 45px;
	position: relative;
}

.top-bar-section .has-dropdown.not-click:hover>.dropdown.scroll-list{
  height: 285px !important;
  /* Forced to use !important to overwrite Foundation styles */
  overflow: auto;
  overflow-x: hidden;
}

.main-body {
	overflow: auto;
	padding: 1rem;
	flex: 1 1 auto;
}

.profile-icon
{
	font-size: 1.5rem;
	line-height: 0;
	position: relative;
	top: 0.25rem;
	margin-right: 0.5rem;
}

.entity-action,
.entity-action a
{
	color: #CCC;
}

.clickable-list-item
{
	cursor: pointer;
	border-top: 1px solid #EEE;
}

.clickable-list-item.selected
{
	background-color: #EEE;
}

.clickable-list-item.selected:hover
{
	background-color: #EEE;
}

.clickable-list-item.disabled,
.clickable-list-item.disabled:hover
{
	background-color: inherit;
	cursor: default;
}

.clickable-list-item .message
{
	font-style: italic;
	color: #999;
}

.clickable-list-item:hover
{
	background-color: #fafafa;
}

.clickable-list-item:hover .message,
.clickable-list-item .message:hover
{
	background-color: inherit;
}

form .row .row.clickable-list-item .columns,
.clickable-list-item .columns, .table-padding
{
	padding: 0.5rem 1rem;
}

.list-item-trailer
{
	color: #CCC;
	font-family: 'Inconsolata' !important;
}

.list-item-trailer,
.numerical
{
	text-align: right;
}

.sign-photo-carousel
{
	width: 100%;
	height: 14rem;
	color: #FFF;
	text-shadow: 0px 1px 3px rgba(0,0,0,0.5);
	background-color: #CCC;
	padding-top: 6rem;
	text-align: center;
	position: relative;
	top: -1rem;
}

.sign-preview-marketplace-ad {
	display: flex;
	justify-content: center;
	align-items: center;
	border: 5px dashed rgb(155, 155, 158);
}

.sign-preview-blip-logo {
	height: 40px;
	width: auto;
}

.button
{
	font-size: 110%;
	line-height: 75%;
}

.button.icon
{
	font-size: 130%;
	padding: 0.5rem 0;
}

.button.icon.active
{
	background-color: #CCC;
}

.ad-group-key {
	font-size: 13px;
}

.drag-drop-grip {
	font-size: 20px;
	color: rgb(80, 80, 80);
	padding-left: 10px;
	padding-right: 10px;
}

.grab {
	cursor: -webkit-grab; cursor: -moz-grab; cursor: grab;
}
.grabbing {
	cursor: -webkit-grabbing; cursor: -moz-grabbing; cursor: grabbing;
}

.grabbable-slot {
	color: #848484;
}

.button.disabled,
.button.disabled:hover,
.button.disabled:focus,
.button[disabled],
.button[disabled]:hover,
.button[disabled]:focus,
button.disabled,
button.disabled:hover,
button.disabled:focus,
button[disabled],
button[disabled]:hover,
button[disabled]:focus
{
	color: rgba(255,255,255,0.33);
}

/* Overrides */

.ngdialog.ngdialog-theme-default .ngdialog-content
{
	padding: 1rem 0 0 0;
	border-radius: 3px;
}

#toast-container > div
{
	opacity: 0.99;
	filter: alpha(opacity=99);
	border-top-left-radius: 0;
	border-top-right-radius: 0;
}

.accordion {
  margin-left: 0;
  margin-bottom: 1em;
}

.accordion .accordion-navigation>.content,
.accordion dd>.content
{
	padding: 0.9375rem 0;
}

.tooltip
{
	font-size: 9pt;
}

.spreedly-modal-overlay
{
	top: 0;
}

/* Custom */
.transparent {
	color: transparent;
}

.form-sections
{
	margin: 0 0 0.5rem 0;
	padding: 0;
	font-size: 10pt;
}

.form-sections .section
{
	display: block;
	margin: 0;
	padding: 0;
	text-indent: 0;
	color: #CCC;
	text-align: center;
	border: 1px transparent solid;
}

.form-sections .section.active:not(.live),
.form-sections .section.live a,
.form-sections .section:not(.active) a
{
	padding: 0.25rem;
	display: block;
}

.form-sections .section a
{
	border-radius: 4px;
	width: 100%;
	transition: background 300ms ease-out;
}

.form-sections .section.active
{
	border-color: #CCC;
	transition: border 300ms ease-out;
}

.form-sections .section.active:not(.live) a
{
	cursor: default;
}

.form-sections .section:not(.active) a:hover
{
	background: #EEE;
}

.form-sections .section.active,
.form-sections .section.active a
{
	border-radius: 4px;
	color: inherit;
}

.panel-form .form-sections .section:not(.active) a:hover
{
	background: rgba(255,255,255,0.1);
}

.form-instructions
{
	font-size: 10pt;
	font-style: italic;
	color: #999;
	margin-bottom: 0.5rem;
}

.slide-form
{
	background: rgba(75,75,75,0.95);
	max-width: 100%;
	height: auto;
}

.slide-form,
.slide-form h1,
.slide-form h2,
.slide-form h3,
.slide-form h4,
.slide-form h5,
.slide-form h6
{
	color: white;
}

.ad-group-edit-expander {
	margin-bottom: 13.2px;
}

.ad-group-header {
	height: 100px;
	width:100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding-left: 15px;
	padding-right: 15px;
}

.thumbnail-container {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}

.image-thumbnail {
	width: 70px;
	height: auto;
}

.reset-button-container {
	display: flex;
	align-items: center;
}

.item-list
{
	overflow-y: scroll;
}

.item-list.primary
{
	min-height: 40%;
}

.form-panel
{
	display: none;
}

.form-panel.active
{
	display: inherit;
}

.slide-form h1,
.slide-form h2,
.slide-form h3,
.slide-form h4,
.slide-form h5,
.slide-form h6,
.slide-form p,
.slide-form li,
.slide-form label
{
	color: white;
}

.slide-form label.prefix
{
	color: #333;
}

.form-feedback
{
	color: #999;
	font-style: italic;
}

.help-bubble
{
	color: white;
	background-color: #CCC;
	padding: 1px 4px 0;
	font-size: 8pt;
	border-radius: 2px;
	position: relative;
	top: -1px;
}

.help-bubble:hover
{
	color: #0078a0;
	border: none;
}

.form-tabs .tab-title
{
	position: relative;
	min-width: 47%;
	margin-right: 0.2rem;
}

.form-tabs .tab-title a
{
	font-size: 10pt;
	width: 100%;
	text-align: center;
	padding: 0.4rem 2.5rem;
	background-color: #EEE;
	border: 1px solid #DDD;
	border-bottom: none;
	border-radius: 4px 4px 0 0;
	color: #999;
}

.form-tabs .tab-title.active a
{
	background-color: transparent;
	border-bottom: 2px solid white;
	margin-bottom: -2px;
	color: inherit;
}

.fi-arrow-up:hover, .fi-arrow-down:hover {
	color: black;
	cursor: pointer;
}

.inline-radio-group
{
	display: inline-block;
	padding: 0.2rem 0.5rem;
	margin-bottom: 0.5rem;
	border: 1px solid #EEE;
	border-radius: 4px;
}

.inline-radio-group.active
{
	border-color: #CCC;
	background-color: #EEE;
}

.inline-radio-group:not(.active):hover
{
	background-color: #DEEEFF;
}

.inline-radio-group input
{
	padding: 0;
	margin: 0;
}

/* thumbnails of ad images */
.mini-thumb
{
	width: 2rem;
	/*height: 1.5rem;*/
	margin-right: 0.25rem;
	overflow-x: hidden;
	text-align: center;
	display: inline-block;
	position: relative;
	top: 6px;
}

.mini-thumb img
{
	height: 1.5rem;
	max-width: unset;
	position: relative;
	left: -50%;
}

.mini-thumb.wide
{
	width: unset;
	overflow-x: unset;
}

.mini-thumb.wide img
{
	left: unset;
}

/* stuff for ng-file-upload */
.thumb {
    width: 24px;
    height: 24px;
    float: none;
    position: relative;
    top: 7px;
}

form .progress {
    line-height: 15px;
}

.progress {
    display: inline-block;
    width: 100px;
    border: 3px groove #CCC;
}

.progress div {
    font-size: smaller;
    background: orange;
    width: 0;
}
/* End stuff for ng-file-upload */
/* Beginning of Moderation Styles */
.da-section {
	padding: 10px 10px 10px 10px;
	margin-bottom: 10px;
	border: 1px solid #ddd;
}
.da-section:hover {
	background-color: #f1f1f1;
}
.dashboard-img {
	max-height: 220px;
}
.none-text {
	padding-bottom: 10px;
	font-size: 20px;
	text-align: center;
	color: #8e8d8d;
}

.no-right-radius {
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
}
.no-left-radius {
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;

}
.mod-block,
.row.mod-block,
.row.collapse.mod-block
{
	margin: 0 0 0.75rem 0;
	/*
	transition: all linear 0.5s;
	*/
}
.mod-image
{
	/* change this once you put an image in */
	display: inline-block;
	height: 100%;
	width: 100%;
	vertical-align: middle;
	/*border: 1px solid #CCC;*/
	margin: 0 0 0.25rem 0;
	text-align: center;
	/*padding: 4rem 0;*/
}
.mod-actions .button
{
	padding-left: 0.5rem;
	padding-right: 0.5rem;
	width: 4rem;
}
.mod-action-icon
{
	font-size: 12pt !important;
}
.mod-actions .dropdown.button.tiny:after, button.dropdown.tiny:after
{
	right: 0.5rem;
}
.reject-reason-list a
{
	font-size: 80%;
}
.mod-actions .button-group,
.mod-actions .button-group .button
{
	margin: 0;
}
.button-group {
	flex-shrink: 0;
}
.mod-actions .f-dropdown:before,
.mod-actions .f-dropdown:after
{
	display: none;
}
.mod-actions .f-dropdown:focus
{
	outline: none;
}
.mod-actions .alert
{
	background-color: #DE3B1F;
}
.mod-actions .success,
.mod-actions.success
{
	background-color: #006903;
}
.mod-action-undo-block
{
	padding: 0.25rem;
	color: #999;
	font-style: italic;
	/*
	background: rgba(0,0,0,0.03);
	*/
}
.message-approved {
	color: #359C35;
}
.message-rejected {
	color: #DE4E4E;
}
.mod-action-undo-block .message-approved
{
	color: #359C35;
}
.mod-action-undo-block .message-rejected
{
	color: #DE4E4E;
}
.modded-image-thumbnail
{
	border: 1px solid #CCC;
	background: #EEE;
	width: 9rem;
	height: 100%;
	display: inline-block;
	position: relative;
	top: 0;
	text-align: center;
	margin-right: 0.25rem;
}
.mod-block .undo
{
	font-style: normal;
}
.mod-block .button.undo
{
	margin: 0;
	padding: 0.3rem 0.5rem;
	color: #777;
}

.left-column-list
{
	border-right: 1px solid #ddd;
}

.presold-detail
{
	border-left: 1px solid #EEE;
}

.prompt {
	font-style:italic;
}

.dark-arrows {
	color: rgb(123,123,123);
}

.highlight-selected-ad {
	background-color: #ccc;
}

.no-date-range {
	padding-left: 32px;
	color: grey;
}

.repeated-da-item {
	padding-bottom: 10px;
}

.repeated-da-item:hover {
	cursor: pointer;
	background-color: #ccc;
	color: black;
}

.repeated-da-item:hover .hover-blacken {
	color: black;
}

.shaded {
	background-color: #EEE;
}

.inline-icon {
	font-size: 150%;
	position: relative;
	top: 2px;
}

.breadcrumbs > li {
	cursor: pointer;
	outline: none;
}

.slot-table {
	overflow-y: auto;
	max-height: 225px;
}

.slot-table > table {
	margin-bottom: 0;
	width: 100%;
}

.copy-section {
	padding-top: 15px;
	padding-bottom: 15px;
}

.copy-section select {
	margin: 0;
}

.copy-section-title {
	font-size: 27px;
	display: flex;
	align-items: center;
}

.hr-marginless {
	margin-bottom: 0;
}

.slot-table-row-enabled:hover {
	background-color: #cfcfcf;
	cursor: pointer;
}

.copy-slot-tip, .copy-slot-tip:hover {
	font-weight: normal;
	cursor: default;
	color: #888888;
	border: none;
	background-color: initial;

}
.flex-center-container {
	display: flex;
	justify-content: center;
	align-items: center;
}
.slot-buttons, .slot-buttons:hover {
	height: 19px;
	width: 40%;
	border: none;
	cursor: pointer;
}
@media only screen and (max-width: 40em) {
	.hide-mobile {
		display: none;
	}
	.no-top-padding {
		padding-top: 0 !important;
	}
}
@media only screen and (min-width: 40.1em) {
	.hide-not-mobile {
		display: none;
	}
}
.slot-buttons-small {
	padding-bottom: 0;
	margin: 0;
}

.hanging-icon {
	text-indent: -0.7rem;
	margin-left: 1.3rem;
	line-height: 125%;
}
.search .fi-magnifying-glass {
  font-size:16px;
  position: relative;
  top: 2px;
  left: 14px;
  z-index:1;
  color: #CCC;
}

.search-nav .fi-magnifying-glass {
  font-size:16px;
  position: relative;
  top: 7px;
  left: 14px;
  z-index:1;
  color: #CCC;
}

.search-nav input {
	text-indent: 25px;
	border:none;
	margin-top:-30px;
	margin-bottom:13px;
	-webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    border-radius: 15px;

}

.search input {
	text-indent: 26px;
	margin-top:-30px;
}

.selected
{
	background-color: #EEE;
}

.selected:hover
{
	background-color: #EEE;
}

.terms-wrapper {
	overflow-y: scroll;
	height: 200px;
	border: solid thin gray;
	padding: 10px;
	margin-bottom: 1em;
}

.terms-heading {
	font-weight:bold;
}

.terms-subheading {
	text-decoration:underline;
}

ul.terms {
	list-style-type: none;
}

ul.terms li {
	margin-bottom:10px;
}

.campaign-edit-panel {
	border:solid 1px #CCCCCC;
	border-radius: 4px;
	padding:20px;
	margin-top:20px;
	margin-bottom:20px;
	background-color:#FAFAFA;
}

.budget-edit-panel {
	padding: 20px 12px 20px 12px;
}

.orange {
	color:orange;
}

.plot-container .svg-container svg {
	border: 1px solid #CCC;
}

@media screen and (max-width: 768px) and (min-width: 640px) {
	#password-confirmation {
		line-height: 18px;
		overflow-x: hidden;
		text-overflow: ellipsis;
	 }
}
@media screen and (max-width: 484px) {
	#password-confirmation {
		line-height: 18px;
		overflow-x: hidden;
		text-overflow: ellipsis;
	 }
}
@media screen and (max-width: 428px) {
	#sales-org-name {
		line-height: 18px;
		overflow-x: hidden;
		text-overflow: ellipsis;
	 }
}
@media screen and (max-width: 268px) {
	#sales-first-name, #sales-last-name {
		line-height: 18px;
		overflow-x: hidden;
		text-overflow: ellipsis;
	 }
}
.metric-weight-20 {
    font-weight: bold
}

.empty-message {
	color: grey;
	display: flex;
	justify-content: center;
}

.clickable-table-row {
	cursor: pointer;
}
.clickable-table-row:hover {
	background-color: lightgrey !important;
}

.margin-bottom-5 {
	margin-bottom: 5px;
}

/* Blip-chip */
.chip-container {
	padding: 10px 15px;
	display: flex;
	overflow-x: scroll;
}
.blip-chip {
	margin-right: 5px;
	padding: 5px 12px 9px 12px;
	border-radius: 24px;
	min-width: 60px;
	max-width: 95px;
	height: 32px;
	color: white;
	background-color: #028cba;
	font-size: 10px;
	font-weight: 400;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	text-align: center;
	cursor: pointer;
}
.red-background {
	background-color: #f04123;
}

.select-filter-table {
	width: 100%;
	max-height: 350px;
	overflow: auto;
}

/* Grid stuff */

.flex-container-moderation {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	max-width: 1000px;
}
.grid-mod-container {
	margin-bottom: 10px;
	border: 1px solid #ddd;
	padding: 10px;
	display: grid;
	grid-gap: 10px 10px;
	grid-template-columns: 1fr 1fr;
	overflow: auto;
	border-radius: 3px;
}

@media only screen and (max-width: 870px) {
	.grid-mod-container {
		grid-template-columns: 1fr;
	}
}
.grid-mod-container:hover {
	background-color: #eee;
}
.grid-table {
	width: 100%;
	align-self: center;
	justify-self: stretch;
	margin-bottom: 0;
}
.table-row-title {
	width: 150px;
}

/* foundation overrides */
.row {
	max-width: 75rem !important;
}

.centered {
	text-align: center;
	justify-self: center;
}

.fi-percent:before {
	content: '%';
	height: 100%;
	width: 100%;
	font-weight: bold;
}

select.small-select {
	width: 54px;
	height: 20px;
	font-size: inherit;
	padding: 0;
	margin: 0;
}

/* diagnostics */
.diagnostics-table {
	display: grid;
	grid-template-rows: auto;
	grid-template-columns: 1fr;
}
.diagnostics-table-grid {
	display: grid;
	grid-template-rows: auto;
	/* set grid-template-columns in directive */
	grid-column-gap: 5px;
	align-items: center;
	border-bottom: 1px solid lightgrey;
}
.grid-table-body > div.diagnostics-table-grid:hover {
	background-color: rgba(158, 158, 158, 0.29);
}
.grid-table-header {
	padding-right: 15px;
	padding-bottom: 5px;
	font-weight: bold;
	height: 40px;
}
.grid-table-header > span {
	align-self: end;
	line-height: 1;
}
.grid-table-body {
	height: 238px;
	overflow-y: scroll;
}
.sortable-col {
	cursor: pointer;
}
.sortable-col:hover {
	color: #008CBA;
}
.left-padding {
	padding-left: 10px;
}
.grid-table-body > div {
	padding-top: 10px;
	padding-bottom: 10px;
}
.grid-table-body > div:nth-of-type(2n+1){
	background-color:#f9f9f9;
}
.grid-table-body > div:nth-last-of-type(1){
	border-bottom: 0;
}
.grid-table-body > div.dead-sign {
	background-color: #ffc9c9;
}
.grid-table-body > div.dead-sign:hover {
	background-color: #eababa;
}

.bold-red {
	font-weight: bold;
	color: red;
}

/* Operator App Prompt Styles */
#operator-app-prompt {
	align-items: center;
	background-color: #FFF291;
	display: flex;
	min-height: 50px;
	justify-content: space-between;
	padding: 0 16px;
}
#operator-app-prompt a {
	background-color: #FFFFFF;
	border: 1px solid #EFDC54;
	border-radius: 3px;
	color: #000000;
	font-family: 'Open Sans';
	margin: 8px 0;
	padding: 8px 16px;
}
#operator-app-prompt .close-prompt {
	height: 23px;
	opacity: 50%;
	width: 23px;
}
#operator-app-prompt .close-prompt:hover {
	cursor: pointer;
}
#operator-app-prompt .preview-message {
	align-content: space-between;
	align-items: center;
	display: flex;
	flex-wrap: wrap;
}
#operator-app-prompt span {
	margin: 8px 8px 8px 0;
}