body		{padding-top:80px; color:#3d3d4c;}

h1			{color:#3d3d4c}

header		{background-image: linear-gradient(to bottom, #424251, #3b3b49); padding: 25px 35px}

.no-campaign	{font-size: 18px; margin: 20px 0}

.hidden { display: none !important; }


/* HOME TABLE PAGE */
.btn-create-new 		{background-color:#44c767; text-align: left; -moz-border-radius:28px; -webkit-border-radius:28px;	border-radius:28px;	display:inline-block; cursor:pointer; color:#ffffff; font-size:17px; padding:16px 25px; text-decoration:none;	text-shadow:0px 1px 0px #2f6627; float: right}
.btn-create-new:hover 	{background-color:#5cbf2a;}
.btn-create-new:active 	{position:relative;	top:1px;}
input.btn-create-new	{width:18%;}

.btn-create-new 		{background-image:url(/_assets/icon-plus.png);  background-size: 28px; background-position: 90% 12px; background-repeat: no-repeat;}

/* SEARCH CONTAINER */
section.search-filter-section			{border:none; background-color: #d9d9dc}
.search-container						{border:none; border-radius: 30px;}
.search-container .dk-selected			{height:45px; line-height: 45px; border-left: 2px solid #ececee; color:#8e8e97;}
.search-container input[type="text"]	{font-size:18px; width: calc(100% - 245px);}

/* SEARCH DROPKICK */
.dk-selected:before									{border-top-color: #8e8e97;}
.dk-select-options-highlight .dk-option-selected	{background-color:#3d3d4d;}
.dk-select-options .dk-option-highlight				{background-color:#3d3d4d;}
.dk-option-selected									{background-color:#d9d9dc;}
.dk-select-options									{border-color:#d9d9dc}
.dk-option											{color:#7b7b86;}
.dk-select-options									{max-height:40em; max-height:200px;}

.search-container .dk-selected	{}

.filter-btn								{border-radius:50px; background-color: #0097f1; padding: 14px 25px; text-shadow:0px 1px 0px #1b455d; font-size: 16px; background-size: 28px; background-position: 90% 8px;}
.filter-btn:hover						{background-color:#4eaade;}

.new-filter-name	{background-color: #3f3f4e; padding: 15px;}


.filter-cell { padding: 10px 5px; padding-top: 0}
.filter-inner { width: 1100px; max-width: 100%; margin: auto; }
.filter-dropdown-container { background-color: #686874; }
.filter-dropdown-container .dk-selected { border-radius: 5px; padding-right: 30px; height: 35px; line-height: 30px; border-color:rgba(255,255,255,0.7); color:rgba(255,255,255,0.7); font-size: 12px;}
.filter-dropdown-container .dk-selected:before	{opacity:0.7;}


.filter-dropdown-container .dk-selected:hover,
.filter-dropdown-container .dk-selected:focus	{border-color:rgba(255,255,255,1); color:rgba(255,255,255,1);}
.filter-dropdown-container .dk-selected:focus:before	{opacity:1;}
.filter-dropdown-container .dk-option	{font-size:12px;}


.filter-col 		{width:220px;}
.filter-col.divider {border-color: rgba(255,255,255,0.3); min-height:275px;}
.filter-col label 	{font-size: 14px; margin-bottom: 5px;}
.filter-dropdown-container:before { position: absolute; right: 100px; top: -20px; content: ''; width: 0; height: 0; border-style: solid; border-width: 0 20px 20px 20px; border-color: transparent transparent #555563 transparent; }
.filter-cell input[type=text] { width: 100%; background-color: transparent; color: #ffffff; border-color: rgba(255,255,255,0.75); border-radius: 5px; height: 35px; margin-bottom: 0; }
.filter-cell input[type=text]:focus	{border-color:rgba(255,255,255,1)}


.search-btn 					{position: absolute; right: 35px; top: 0; width: 200px !important; height: 100%; display: block; text-align: center; background-color:#555563;}
.search-btn  					{font-size: 18px; color: #ffffff; text-decoration: none; display: block; transition: 0.2s ease-out;}
.search-btn .btn				{background-color: #f3802c; text-shadow:0px 1px 0px #cb6c25}
.search-btn .btn:hover			{background-color:#ff842b}
.search-btn .btn img 			{display: inline-block; margin: 0 0 0 20px; width: 32px; height: 32px; transition: 0.2s ease-out; }

.search-btn a					{color:#ffffff; margin-top: 10px; font-size: 13px; text-decoration: underline; display: block;}
.search-btn a:hover				{color:rgba(255,255,255,0.6)}

.save-filter-buttons .btn-small	{font-size:12px; padding: 5px 10px; border-radius: 10px; border:none; margin-top: 10px; text-shadow: none}
.btn.btn-save					{background-color: #44c767; color:#ffffff;}

.btn.btn-cancel	{background-color:#f32c5b; color:#ffffff;}

.campaign-table div.new-note		{padding:25px; background-color: #3d3d4c;}
.campaign-table div.new-note-arrow	{border-bottom-color: #3d3d4c;}


label.checkbox { position: relative; padding-left: 24px; }
label.checkbox input[type=checkbox] { position: absolute; z-index: -1; opacity: 0; }
label.checkbox span.checkbox-marker { position: absolute; top: 4px; left: 0; width: 16px; height: 16px; display: block; border-width: 1px; border-style: solid; border-color: rgba(255,255,255,0.75); border-radius: 3px; }
label.checkbox:hover span.checkbox-marker { border-color: #ffffff; }

label.checkbox input[type=checkbox]:checked ~ span.checkbox-marker:after { content: ''; position: absolute; top: 1px; left: 4px; width: 3px; height: 7px; border-bottom: 3px solid #ffffff; border-right: 3px solid #ffffff; border-top: 0; border-left: 0; transform: rotate(40deg); }

/* CAMPAIGN EDIT */
.tabs					{border-bottom:none;}
.tabs button.tab.active	{background-color:#424251;}
.tabs button.tab		{background-color:#b3b3b9;}
.tabs button.tab.active:hover,
.tabs button.tab:hover	{background-color:#353541;}
.tab-section { border: none; margin-top: 0; }

table.listing th		{color:#ffffff;}

.fixed-header-section.sticky .page-title-section	{padding-top:30px;}

/*TASKS */

/* SWITCH */
.switch-container				{display: inline-block; margin-bottom: 10px;}
.switch-container span			{font-size:12px; display: inline-block; vertical-align: middle; font-weight: bold;}
.switch-container span.live		{color:#43c772;}
.switch-container span.draft	{color:#f8c62e;}
.switch 						{position: relative; display: inline-block; width: 60px; height: 34px; margin-bottom: 0;}
.switch input 					{opacity: 0; width: 0; height: 0;}
.slider							{position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0; background-color: #f8c62e; -webkit-transition: .4s; transition: .4s;}
.slider:before			 		{position: absolute; content: ""; height: 26px; width: 26px; left: 4px; bottom: 4px; background-color: white; -webkit-transition: .4s; transition: .4s;}
input:checked + .slider 		{background-color: #43c772;}
input:focus + .slider 			{box-shadow: 0 0 1px #43c772;}
input:checked + .slider:before 	{-webkit-transform: translateX(26px); -ms-transform: translateX(26px); transform: translateX(26px);}
.slider.round					{border-radius: 34px;}
.slider.round:before 			{border-radius: 50%;}
.form-group label.switch		{padding-top:0; margin: 0 10px;}

/* CAMPAIGN POS CHECKER */
.page-title-section h1			{display: inline-block; margin-bottom: 0}
.campaign-id h2					{font-size:16px; font-weight: normal; margin-top: 10px; margin-bottom: 0; line-height: 20px; color:#7b7b86}
span.important-information { position: relative; transition: all 0.2s; }
span.important-information .icon { display: inline-block; width: 14px; height: 14px; background-image: url("/_assets/icon-information.png"); background-size: cover; background-repeat: no-repeat; }
span.important-information .content { display: none; position: absolute; top: 0; height: 0; right: 0; opacity: 0; font-size: 12px; width: 350px; background-color: #ffffff; padding: 5px; border: 1px solid #cccccc; border-radius: 5px; transition: all 0.2s; z-index: 1; }
span.important-information .icon:hover .content{ display: block; opacity: 1; height: auto; }

table.listing { margin-top: 30px; width: 100%; }
table.listing.small-margin { margin-top: 10px; }

table.listing th { background-color: #8e8e97; padding: 8px 10px; vertical-align: top; }
table.listing td { padding: 5px 8px; border-top: 1px solid #cccccc; vertical-align: middle; }
table.listing td input { margin-bottom: 0; }

table.listing td.no-wrap { white-space: nowrap; }

table.listing tr.additional-row td { border-top: 1px dashed #e0e0e0; }

td.asset-upload { position: relative; white-space: nowrap; }
button.btn-tp-upload { width: 24px; height: 24px; margin-right: 10px; background-color: #43c772; background-image: url("/_assets/icon-upload-white.png"); background-size: 14px; background-position: center; background-repeat: no-repeat; cursor: pointer; border-radius: 5px; }
button.btn-tp-remove-asset {  width: 30px; height: 30px; background-position: center; background-color: transparent; background-size: 12px 12px; background-image: url("/_assets/icon-red-disc-x.png"); background-repeat: no-repeat; }

td.asset-upload .btn-tp-remove-asset,
td.asset-upload a { display: none; }

td.asset-upload.has-file .btn-tp-remove-asset,
td.asset-upload.has-file a { display: inline-block; }

.pos-checker-project,
.pos-checker-container { border: 1px solid #cccccc; padding: 0; border-radius: 5px; background-color: #fcfcfc; }


.pos-checker-project .pos-checker-id,
.pos-checker-container .pos-checker-id,
.pos-checker-project .pos-checker-uploader { padding: 10px 20px; }

.pos-checker-project .pos-checker-score { display: flex; flex-direction: row; align-items: center; margin-top: 20px; gap: 5px; font-size: 14px; line-height: 20px; }
.pos-checker-project .pos-checker-score label { margin: 0 5px 0 0; padding: 0; }
.pos-checker-project .pos-checker-score input[type=text] { width: 5em; }

.pos-checker-project .pos-checker-id h3,
.pos-checker-container .pos-checker-id h3,
.pos-checker-project .pos-checker-uploader h3 { margin: 0 0 10px 0; }

.pos-checker-project .pos-checker-id label { width: auto; margin-right: 10px; display: inline-block; vertical-align: middle; padding-top: 0; }
.pos-checker-project .pos-checker-id input[type=text] { width: 4em; display: inline-block; margin-right: 10px; }
.pos-checker-project .pos-checker-id input[type=button] { padding: 5px 15px; vertical-align: top; margin-top: 2px; font-size: 14px; }
.pos-checker-project .pos-checker-details { border-top: 1px dotted #cccccc; padding: 10px 20px 20px 20px; }
.pos-checker-project .pos-checker-image { text-align: center; margin-top: 10px; }
.pos-checker-project .pos-checker-image img { height: 240px; }

.pos-checker-project .pos-checker-score-container { display: flex; flex-direction: row; justify-content: center; margin-bottom: 20px; }
.pos-checker-project .pos-checker-project-scores { display: inline-block; padding: 0; border: 0; }
.pos-checker-project .pos-checker-project-scores td { padding: 0; font-size: 16px; color: #000000; vertical-align: middle; height: 28px; }
.pos-checker-project .pos-checker-project-scores td.label { background-color: transparent; width: 60px; padding-right: 10px; display: table-cell;  }


.pos-checker-container .pos-checker-scores { display: flex; font-size: 0; flex-direction: row; flex-wrap: wrap; }
.pos-checker-container .pos-checker-scores .pos-checker-score { flex-basis: 50%; justify-content: center; }

.pos-checker-container .pos-checker-scores .pos-checker-score-panel { width: 150px; height: 150px; border-radius: 100%; margin: 0 auto; background-color: #43c772; }

.pos-checker-container .pos-checker-score { font-size: 16px; margin-bottom: 5px; }
.pos-checker-container .pos-checker-score label { display: inline-block; font-weight: bold; margin-right: 10px; width:60px; font-size: 16px;}

.pos-checker-container.improvement .pos-checker-score { margin-bottom: 15px; }
.pos-checker-container.improvement .pos-checker-score.equal .pos-checker-score-panel { background-color: #f8c62e; }
.pos-checker-container.improvement .pos-checker-score.positive .pos-checker-score-panel { background-color: #43c772; }
.pos-checker-container.improvement .pos-checker-score.negative .pos-checker-score-panel { background-color: #f32c48; }

.pos-checker-container.improvement .pos-checker-score label { font-size: 18px; color: #ffffff; margin: 0; text-shadow: 0px 1px 0px #000000; width: auto; padding: 0 10px; }
.pos-checker-container.improvement .pos-checker-score span { display: block; font-size: 26px; color: #ffffff; margin: 0; text-shadow: 0px 1px 0px #000000; width: auto; }
.pos-checker-container.improvement .pos-checker-score-inner { width: 100%; height: 100%; text-align: center; display: flex; flex-direction: column; justify-content: center; }

.pos-checker-container.improvement .pos-checker-scores { width: 100%; text-align: center; display: flex; flex-wrap: wrap; justify-content: center; }

.pos-checker-container.improvement .pos-checker-id { padding-bottom: 0; }
.pos-checker-container.improvement .pos-checker-details { border-top: none; }


.pos-checker-feedback { margin-top: 20px; padding-top: 20px; border-top: dotted 1px #cccccc; }

div.pos-checker-status-icon { display: inline-block; width: 24px; height: 24px; background-size: cover; background-repeat: no-repeat; vertical-align: middle; background-position: 0 0; padding: 0; }
.pos-checker-status-icon.pass { background-image: url("/_assets/icon-tick-green.png"); }
.pos-checker-status-icon.warning { background-image: url("/_assets/icon-tick-amber.png"); }
.pos-checker-status-icon.fail { background-image: url("/_assets/icon-tick-red.png"); }


.tooltip { display: block !important; z-index: 10000; position: absolute; padding: 0; }
.tooltip .tooltip-inner { background: white; border: 0; padding: 8px; font-size: 12px; line-height: 1.1em; font-weight: normal; font-style: normal; -webkit-box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14),0 3px 1px -2px rgba(0,0,0,0.12),0 1px 5px 0 rgba(0,0,0,0.2); box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14),0 3px 1px -2px rgba(0,0,0,0.12),0 1px 5px 0 rgba(0,0,0,0.2); text-align: left; color: #000000; }
.tooltip .tooltip-arrow { width: 0; height: 0; border-style: solid; position: absolute; margin: 5px; border-color: #000000; z-index: 1; }
.tooltip[x-placement^="top"] { margin-bottom: 5px; }
.tooltip[x-placement^="top"] .tooltip-arrow { border-width: 5px 5px 0 5px; border-left-color: transparent !important; border-right-color: transparent !important; border-bottom-color: transparent !important; bottom: -5px; left: calc(50% - 5px); margin-top: 0; margin-bottom: 0; }
.tooltip[x-placement^="bottom"] { margin-top: 5px; }
.tooltip[x-placement^="bottom"] .tooltip-arrow { border-width: 0 5px 5px 5px; border-left-color: transparent !important; border-right-color: transparent !important; border-top-color: transparent !important; top: -5px; left: calc(50% - 5px); margin-top: 0; margin-bottom: 0; }
.tooltip[x-placement^="right"] { margin-left: 5px; }
.tooltip[x-placement^="right"] .tooltip-arrow { border-width: 5px 5px 5px 0; border-left-color: transparent !important; border-top-color: transparent !important; border-bottom-color: transparent !important; left: -5px; top: calc(50% - 5px); margin-left: 0; margin-right: 0; }
.tooltip[x-placement^="left"] { margin-right: 5px; }
.tooltip[x-placement^="left"] .tooltip-arrow { border-width: 5px 0 5px 5px; border-top-color: transparent !important; border-right-color: transparent !important; border-bottom-color: transparent !important; right: -5px; top: calc(50% - 5px); margin-left: 0; margin-right: 0; }
.tooltip[aria-hidden='true'] { visibility: hidden; opacity: 0; transition: opacity .15s, visibility .15s; }
.tooltip[aria-hidden='false'] { visibility: visible; opacity: 1; transition: opacity .15s; }

/* POPUP */
.ui-widget	{font-family: 'Sarabun', sans-serif!important;}
.ui-widget .btn	{/*color:#ffffff !important;*/ border:none !important;}



.lightbox-container	{border:none; padding: 30px;}

/* RADIO LIST */
.radio-list td	{padding:5px 0}

/* COLOURS */
.red { background-color: #f32c48 !important; }
.green { background-color: #43c772 !important; }
.amber { background-color: #f8c62e !important; }
.white { background-color: #f0f0f0 !important; }

/** BUTTONS **/
.btn { border-radius: 50px; background-color: #0097f1; text-shadow: 0px 1px 0px #1b455d; font-size: 16px; color: #ffffff; padding: 10px 25px; border: none; }

.btn.btn-small { padding: 7px 14px; font-size: 12px; }

.btn:focus { outline: none; outline-style: none; outline-width: 0; }

.btn.btn-green:hover,	
.btn.btn-blue:hover,	
.btn.btn-red:hover,
.btn:hover	{background-color:#4eaade; color:#ffffff;}

.btn.btn-green { background-color: #44c767; color: #ffffff; }
.btn.btn-blue { background-color: #0097f1; color: #ffffff; }
.btn.btn-red { background-color: #f32c5b;  color: #ffffff; }
.btn.btn-amber { background-color: #f8c62e; color: #000000; text-shadow: 0 1px 0 #999999; }

.ui-dialog-buttonset .btn { font-size:13px; padding: 8px 16px; outline: none; }
.ui-dialog-buttonset .btn:hover { border: none; }

.ui-dialog.no-close .ui-dialog-titlebar-close { display: none; }







/* POSSIBLY DELETE THESE OR CHANGE THEM */
button.btn-campaign-action { width: 18px; height: 18px; background-color: transparent; transition: 0.2s ease-out; background-position: center center; background-size: 14px 14px; background-repeat: no-repeat; border: 0; margin: 0 1px; position: relative; }
button.btn-campaign-action:hover { background-color: rgba(0, 0, 0, 0.2); }
button.btn-campaign-action.edit { background-image: url("/_assets/icon-edit.png"); }
button.btn-campaign-action.delete { background-image: url("/_assets/icon-delete.png"); }

button.btn-campaign-action.notes { background-image: url("/_assets/icon-notes.png"); }
button.btn-campaign-action.notes.content { background-image: url("/_assets/icon-notes-content.png"); }

button.btn-campaign-action.all-notes { background-image: url("/_assets/icon-notes-white.png"); }

th.has-prompt { position: relative; }


select.dropkick { opacity: 0; }




.ui-datepicker { z-index: 10000!important; }






@-moz-document url-prefix() { 
  table {
     border-collapse: separate !important;
  }
}

@media print { 
   .btn { display: none; visibility: hidden; }
}