/* ==========================================================================
   NORMALIZE HTML5 display definitions
   ========================================================================== */

article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block}audio,canvas,video{display:inline-block}audio:not([controls]){display:none;height:0}[hidden]{display:none}html{background:#fff;color:#000;font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}a:focus{outline:dotted thin}a:active,a:hover{outline:0}h1{font-size:2em;margin:.67em 0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:700}dfn{font-style:italic}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0}mark{background:#ff0;color:#000}code,kbd,pre,samp{font-family:monospace,serif;font-size:1em}pre{white-space:pre-wrap}q{quotes:"\201C" "\201D" "\2018" "\2019"}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:0}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0}button,input,select,textarea{font-family:inherit;font-size:100%;margin:0}button,input{line-height:normal}button,select{text-transform:none}button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=search]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}textarea{overflow:auto;vertical-align:top}table{border-collapse:collapse;border-spacing:0}

/* ==========================================================================
   End Normalization, Begin Standard CSS Declarations
   ========================================================================== */

html, body {
    min-height: 100% !important; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
}

html { height: 100%; }

body { margin: 0; padding: 20px; background: #8E44AD; }
body.fullheight { height: 100%; }

img { border: 0; max-width: 100%; }

.twocols { display: table; table-layout: fixed; position: relative; width: 100%; border-collapse: collapse; height: 100%; }
.twocol { display: table-cell; position: relative;  width: 50%; margin: 0px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; vertical-align: top; font-size: 12px; line-height: auto; height: 100%; }

.twocol:first-child { padding: 0px 10px 0px 0px; }
.twocol:nth-child(2n-2) { padding: 0px 0px 0px 10px; }

.fourcols { font-size: 0px; text-align: center; }
.fourcol { display: inline-block; width: 23.5%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; margin-right: 2%; vertical-align: top;  }
.fourcol:nth-child(4n-4), .fourcol:last-child { margin-right: 0px; }

.fivecols { font-size: 0px; text-align: center; }
.fivecol { display: inline-block; width: 19%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; margin-right: 1.25%; vertical-align: top;  }
.fivecol:nth-child(5n-5), .fivecol:last-child { margin-right: 0px; }

.fourcol, .fivecol { font-size: 14px; line-height: 120%; }

.FullHeight { height:100%; display:inline-block; width: 100%; }

.fullwidth { width: 100%; }

.centered { text-align: center; }

.TopPartHTML { display: none; }

.HTMLEditor, .LiveHTMLPreview { position: relative; width: 100%; height: 100%; min-height: 400px; padding: 10px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

.HTMLEditor, .HTMLTextEditor { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", "Courier New", "Courier", sans-serif; font-size: 12px; line-height: 120%; }

.HTMLEditor.PreviewStage { height: calc(100% - 46px); }
input.HeadlineEditor { margin: 0px 0px 10px 0px; padding: 0px 6px; height: 36px; line-height: 36px; font-size: 18px; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; }

.LiveHTMLPreview { background: #fff; border: 1px solid #000; overflow: scroll; font: 14px/18px serif; }

.page { position: relative; width: 1080px; max-width: 100%; margin: 0px auto; padding: 20px; background: #fff; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; }

.page.fullwidth { width: 100%; height: 100%; overflow-y: scroll; }

.page.fullwidth form { height: 77%; }

.page h1 { text-align: center; line-height: 120%; }

.page label { cursor: pointer; }

.buttoncontainer { margin: 40px 0px 0px 0px; padding: 0px 0px 20px 0px; text-align: center; }
.buttoncontainer::after { content: ' '; position: relative; display: block; clear: both; }

.PrevButton { float: left; }
.NextButton { float: right; }

.page:not(.admin) button, .page input[type=submit] { background: #8E44AD; color: #fff; border-radius: 12px; -moz-border-radius: 12px; -webkit-border-radius: 12px; padding: 18px 36px; border: 0px; box-shadow: 3px 3px 6px #000; font-size: 18px; font-weight: bold; }

.page button.primary, .page input[type=submit].primary { background: #FF6F3D;  }

.page button:hover, .page input[type=submit]:hover { box-shadow: inset 2px 2px 6px #000; }



.page.admin button, .page.admin .button, .page.admin input[type=submit] { outline: 0; color: #fff; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.33); -webkit-font-smoothing: antialiased; border-radius: 6px; -webkit-border-radius: 6px; -moz-border-radius: 6px; border: 1px solid #303030; padding: 6px 20px; font-size: 16px; color: #fff; cursor: pointer; background: #cecece; background: -moz-linear-gradient(top,  #cecece 0%, #6d6d6d 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#cecece), color-stop(100%,#6d6d6d)); background: -webkit-linear-gradient(top,  #cecece 0%,#6d6d6d 100%); background: -o-linear-gradient(top,  #cecece 0%,#6d6d6d 100%); background: -ms-linear-gradient(top,  #cecece 0%,#6d6d6d 100%); background: linear-gradient(to bottom,  #cecece 0%,#6d6d6d 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cecece', endColorstr='#6d6d6d',GradientType=0 ); }


.page.admin button:hover, .page.admin .button:hover, .page.admin input[type=submit]:hover { background: #cecece; background: -moz-linear-gradient(top,  #cecece 0%, #898989 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#cecece), color-stop(100%,#898989)); background: -webkit-linear-gradient(top,  #cecece 0%,#898989 100%); background: -o-linear-gradient(top,  #cecece 0%,#898989 100%); background: -ms-linear-gradient(top,  #cecece 0%,#898989 100%); background: linear-gradient(to bottom,  #cecece 0%,#898989 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cecece', endColorstr='#898989',GradientType=0 ); }

.page.admin button.primary, .page.admin .button.primary, .page.admin button.blue, .page.admin .button.blue { color: #fff; border: 1px solid #006399; background-color: hsl(201, 100%, 30%) !important; background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#00a5ff", endColorstr="#006399"); background-image: -khtml-gradient(linear, left top, left bottom, from(#00a5ff), to(#006399)); background-image: -moz-linear-gradient(top, #00a5ff, #006399); background-image: -ms-linear-gradient(top, #00a5ff, #006399); background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #00a5ff), color-stop(100%, #006399)); background-image: -webkit-linear-gradient(top, #00a5ff, #006399); background-image: -o-linear-gradient(top, #00a5ff, #006399); background-image: linear-gradient(#00a5ff, #006399); border-color: #006399 #006399 hsl(201, 100%, 25%); }

.page.admin button.primary:hover, .page.admin .button.primary:hover, .page.admin button.blue:hover, .page.admin .button.blue:hover { color: #fff; background-color: hsl(201, 100%, 39%) !important; background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#2db5fe", endColorstr="#0081c6"); background-image: -khtml-gradient(linear, left top, left bottom, from(#2db5fe), to(#0081c6)); background-image: -moz-linear-gradient(top, #2db5fe, #0081c6); background-image: -ms-linear-gradient(top, #2db5fe, #0081c6); background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #2db5fe), color-stop(100%, #0081c6)); background-image: -webkit-linear-gradient(top, #2db5fe, #0081c6); background-image: -o-linear-gradient(top, #2db5fe, #0081c6); background-image: linear-gradient(#2db5fe, #0081c6); border-color: #0081c6 #0081c6 hsl(201, 100%, 34%); color: #fff !important; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.33); -webkit-font-smoothing: antialiased; }




.page .ClientSelectContainer { display: block; position: relative; font-size: 0px; /* overflow-x: scroll; overflow-y: hidden; white-space: nowrap; */ }

.page .ClientSelectRadio { display: inline-block; width: 18%; margin-right: 2.5%; font-size: 16px; }

.page .ClientSelectRadio:nth-child(5n-5), .page .ClientSelectRadio:last-child { margin-right: 0px; }


.page .ClientSelectContainer input[type=radio] { display: none; }
.page .ClientSelectContainer input[type=radio] +label { display: block; vertical-align: middle; background: #fff; margin: 0px 0px 0px 0px; padding: 10px; text-align: center; }
.page .ClientSelectContainer:last-child input[type=radio] +label { margin: 0px; }
.page .ClientSelectContainer input[type=radio]:checked +label { background: #ededed; background: #FF6F3D; }

.page .ClientSelectContainer input[type=radio] +label img { display: block; vertical-align: middle; margin: 0px auto; padding: 0px 5px 0px 0px; }

.NextButton.InputStage0:not(.nojs), .NextButton.InputStage1:not(.nojs) { display: none; }

.ADParentContainer h3 { text-align: center; color: #fff; background: #8e44ad; margin: 5px auto; padding: 15px; cursor: pointer; }
.ADParentContainer h3:hover, .ADParentContainer.active h3 { background: #FF6F3D; }

.ADTemplateSelectCols { margin-bottom: 25px; }
.ADTemplateSelectCols .fourcol, .ADTemplateSelectCols .fivecol { text-align: center; }
.ADTemplateSelectCols input[type=radio] { display: none; }
.ADTemplateSelectCols input[type=radio] +label { display: block; }
.ADTemplateSelectCols input[type=radio] +label:hover { background: #FF6F3D; color: #fff; }

input#BlankTemplateRadio { display: none; }
input#BlankTemplateRadio +label { display: inline-block; margin: 10px auto; padding: 20px; background: #ededed; border: 1px solid #8e44ad; }
input#BlankTemplateRadio +label:hover { background: #FF6F3D; color: #fff; }


.copyable { position: relative; }
.CopyToClipboard { position: absolute; right: 10px; top: 10px; padding: 5px 10px; background: #000; color: #fff; opacity: .56; cursor: pointer; font-size: 13px; text-transform: uppercase; font-weight: bold; font-family: arial, sans-serif; }
.CopyToClipboard:hover { opacity: 1; }
.CopyToClipboard.LastCopied { background: #008800; }
.CopyToClipboard::after { content: 'copy'; }
.CopyToClipboard.LastCopied::after { content: 'last copied'; }

table.FinalizedOutputSteps { width: 100%; }
table.FinalizedOutputSteps tr:nth-child(even) { background: #ededed; }
table.FinalizedOutputSteps tr td { width: 50%; padding: 0px 20px; }
table.FinalizedOutputSteps tr td:first-child { text-align: right; }

table.FinalizedOutputSteps tr td input[type=text], table.FinalizedOutputSteps tr td textarea { width: 100%; padding: 10px; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; }

table.FinalizedOutputSteps tr td input[type=text] { height: 45px; }


div.StatusResponseIcon { width: 52px; height: 52px; background-size: contain; }
div.StatusResponseIcon.success { background: url(images/success-icon-52.png); }
div.StatusResponseIcon.failure { background: url(images/failure-icon-52.png); }
div.StatusResponseIcon.warning { background: url(images/warning-icon-52.png); }


.hidden-textarea { display: none; }


table.editor { width: 100%; margin: 20px 0px; border-collapse: collapse; }
table.editor tr { background: #f1f1f1; }
table.editor tr td, table.editor tr th { padding: 8px; }
table.editor tr:nth-child(odd) { background: #eaeaea; }
table.editor tr:nth-child(odd):hover, table.editor tr:nth-child(even):hover { background: #fff; }
table.editor tr.header, table.editor tr.header:hover { background: #f1f1f1; }
table.editor tr td textarea { width: 100%; height: 140px; }
table.editor tr td input[type=text] { width: 100%; }
table.editor tr td p { margin: 0px 0px 15px 0px; padding: 0px; }
table.editor tr td label { margin: 0px 10px 0px 0px; padding: 0px; }
table.editor#JobPositionManualLinks td:first-child { width: 30%; }
table.editor#JobPositionManualLinks td:nth-child(2n-2) { width: 70%; }
table.editor tr th { text-align: left; }


table.editor div.StatusIcon { position: relative; height: 28px; width: 28px; background-size: contain; background-position: center center; background-repeat: no-repeat; }
table.editor div.StatusIcon.Enabled { background-image: url(images/success-icon-52.png); }
table.editor div.StatusIcon.Disabled { background-image: url(images/failure-icon-52.png); }


table.editor tbody#DynamicTemplateFields, table.editor tbody#StaticTemplateFields { display: none; }
table.editor tbody#DynamicTemplateFields.visible, table.editor tbody#StaticTemplateFields.visible { display:table-row-group; }

table.editor .JobPositionTemplateFields { display: none; margin: 0px 0px 20px 0px; }
table.editor .JobPositionTemplateFields.visible { display: block; }

table.TemplateFilters { width: 100%; }
table.TemplateFilters td { padding: 20px; width: 50%; }
table.TemplateFilters tr:nth-child(2) td { padding-top: 0px; }
table.TemplateFilters select { width: 100%; }
table.TemplateFilters button { display: block; margin: 0px auto; }

a.ReviewErrorCheckResults { display: block; text-align: center; text-decoration: underline; color: #0000ff; cursor: pointer; }
div.ErrorCheckResults { margin: 0px 0px 50px 0px; }


table.TemplateJobSelectionAdditionalFields { margin: 0px 0px 20px 0px; width: 100%; }
table.TemplateJobSelectionAdditionalFields tr td:first-child { text-align: right; width: 38%; }
table.TemplateJobSelectionAdditionalFields tr td { padding: 6px 12px; }


@media(max-width:639px) {

.page .ClientSelectContainer { text-align: center; }
.page .ClientSelectRadio { width: auto; }
.page .ClientSelectRadio:nth-child(5n-5) { margin-right: 2.5%; }
.page .ClientSelectRadio:last-child { margin-right: 0px; }


}