/* #00a4e4 - link color from public website */
/* #333333 - also used on public website */
/* #012E3F - used as a darker header on public website */



.hidden, tr.hidden.white { display: none; }
.hiddenImp { display: none !important; }
ul.choices { 
	list-style: none;
	padding-left: 21px;
	text-indent: -21px;
 }
ul.choices li { padding: 3px 0; }
ul.choices div.warning, ul.choices div.error { text-indent: 0; }

/* -----------------------------------------------
BUTTONS
-------------------------------------------- */


th button.small, td button.small { margin-top: 1px; }


/* -----------------------------------------------
	TABLE
	-------------------------------------------- */

p.instructions, div.instructions { font-style: italic; }

tr#template, div#questionTemplate, tr.template, div.questionTemplate, table.template, div.template { display: none; }

/* tr.uneditable td { color: #555; } */

.top td .up { opacity: 0.3; filter:alpha(opacity=30%); cursor: default;  }
.bottom td .down { opacity: 0.3; filter:alpha(opacity=30%); cursor: default; }
.up, .down { cursor: pointer; }
.children > div.ordered:first-child > div > .up { opacity: 0.3; filter:alpha(opacity=30%); cursor: default; }
.children > div.ordered:last-child > div > .down { opacity: 0.3; filter:alpha(opacity=30%); cursor: default; }
.children table th, .children table td { padding: 2px; border: 2px solid #ffffff;}
.children .indent img { max-width: 800px; max-height: 500px; width: auto; height: auto; }

span.money.narrow { width: 75px; }
span.percent { width: 95px; text-align: right; display: inline-block; }
span.error, div.errormsg { color: #990000; }
p.error::before, div.error:not(.required-label)::before { content: '\f071'; font-family:"Font Awesome 5 Free"; color: #b40000; font-weight: 900; margin-right: 10px; margin-left: -30px; font-size: 18px;}
p.warning::before, div.warning::before, p.important::before, div.important::before { content: '\f071'; font-family:"Font Awesome 5 Free"; color: #ECB22E; font-weight: 900; margin-left: -30px; margin-right: 10px; font-size: 18px;}
a.ext-link::before, p.ext-link::before, div.ext-link::before { content: '\f35d'; font-family:"Font Awesome 5 Free"; color: #002050; font-weight: 900; margin-right: 6px; font-size: 16px;}
p.warning, p.error, div.warning, div.ext-link, p.ext-link, p.important, div.important, div.error { padding-left: 30px; }
.cost div span.money { line-height:27px; }
#Pricing tr:not(.custom) input.money { width: 95px; padding: 0; background: url('/images/money-r.png') no-repeat left transparent; background-size: 12px 14px; border: 0; box-shadow: none; cursor: text; }



tr.subheading th { cursor: pointer; border: solid #ffffff; border-width: 1px 0;  }
tr.subheading  th:first-child .minus { display: inline; }
tr.subheading.collapsed  th:first-child .minus { display: none; }
tr.subheading  th:first-child .plus { display: none; }
tr.subheading.collapsed  th:first-child .plus { display: inline; }
span.order { display: inline-block; height: 28px; background-position: 3px 4px; }

span.expandable { background-image: none; display: inline-block; height: 28px; width: 19px; background-position: 2px 4px; cursor: pointer; line-height:28px }
.collapsible > div > span.expandable::before, .haschildren > div > span.expandable::before, .hasChildren > td > span.expandable::before { content:'\f0d7'; }
.collapsed.collapsible > div >  span.expandable::before, .haschildren.collapsed> div > span.expandable::before, .hasChildren.collapsed> td > span.expandable::before { content:'\f0da';   }
.general > .w800, .general > .w150 { color: #777; }
.general > .w50 .order, .general > .w150 button { display: none; }
.chide { display: none; } /*for collapsed rows*/
.dhide, .phide { display: none; } /*for dependent rows*/
.collapsible > td:first-child { width: 19px; }
tr.collapsible { cursor: pointer; }

td.text ol { list-style-type: decimal; }
td.text ol ol { list-style-type: lower-alpha; }
td.text ol ol ol { list-style-type: lower-roman; }
td.text li { margin-bottom: .5em; }

/* for qw compare */
tr.same, td.same, div.same { color: #666666; }
tr.different, td.different, div.different { font-weight: 700; }
span.qty { display: inline-block; width: 30px; text-align: right; }

/* ------------------------------------------
 * Sticky header table
 * -------------------------------------------*/

/* sticky left col */
table.color tr td.sticky, table.color tr th.sticky, td.sticky, th.sticky { left: 40px; position: absolute; top: auto; width: 325px; }
.col-scroller { margin-left: 339px; overflow-x: scroll; overflow-y: visible;  }
table.col-sticky { position: inherit; }

/* SUBCONCTRACTOR TABLE */

td.verticalAlignTop{ vertical-align: top !important;}
.orderTabelDataAlign{ background-position: 4px 14px !important;}


  /* -----------------------------------------------
	INPUTS
	-------------------------------------------- */


input::-ms-clear {
  display: none;
}

input[type="file"].visible { display: inline-block; border: 0; padding: 0; }
input[type="file"] { display: none; }
input[type="file"] + label { display: inline-block;
	text-align: left;
	background: white;
	padding: 3px 5px; 
	border: 1px solid #888; 
	box-shadow: 0 0 2px rgba(150, 95, 0, 0.25) inset ; 
	font-size: 11pt; 
	border-radius: 3px; margin-bottom: 4px; width: 150px; height: 1.2em; }
input[type="file"].wide + label { width: 500px; }
input[type="file"].upload + label { width: 500px;
    border: none;
    box-shadow: none;
    border-radius: none;
	font-size: 12pt; 
	text-align: center;
    cursor: pointer; }

select  {  font-family: arial, helvetica, sans-serif; font-size: 11pt; padding: 3px; border: 1px solid #888; 
	box-shadow: 0 0 2px rgba(150, 95, 0, 0.25) inset ; border-radius: 3px; max-width: 200px; }
select:focus { background: #fff; }
/*select:disabled, select:disabled:hover { border: #bbb 1px solid; }*/
select:disabled { background: white; color: black; }
select.wide { max-width: 500px; }
option { padding: 0 8px; }
textarea { font-family: arial, helvetica, sans-serif; font-size: 11pt; border: 1px solid #888; padding:3px 5px; width: 250px; border-radius: 3px; height: 47px;}
textarea.short { height:2.5em; }
textarea.wide, input.wide { width:400px; }
textarea.medwide, input.medwide { width: 350px; }
textarea.medium, input.medium { width: 300px; }
input.medsmall { width: 250px; }
textarea.small { width: 200px; font-size: 10pt; }
input.xsmall { width: 60px; }
input.numeric { width: 30px; text-align: right;  }
input.date { width: 72px; text-align:right; }
input.numeric.wide { width: 44px; }
input.numeric.xwide, .typeN input.def, .typeV input.def { width: 65px; text-align:right; }
input.small { width: 100px; font-size: 10pt; }
input.percent, .typeP input.def { width: 50px; text-align: right; background-image: url('/images/percent-r.png'); background-repeat: no-repeat; background-position: right; background-size: 12px 14px; padding-right: 13px }
input.percent.small { width: 30px; }
input.percent:disabled, input[readonly].percent {background-image: url('/images/percent-r.png'); background-repeat: no-repeat; background-position: right; background-size: 12px 14px; }
input[type="checkbox"].error+ label { color: #9f0000; }
input.custommedium { width: 261px; }



/* -----------------------------------------------
	HISTORY
	-------------------------------------------- */
#modal, #note {
	position: absolute;
	width: 700px;
	border: 2px solid #012E3F;
	z-index: 100;
	background: white;
	-webkit-box-shadow: 0px 0px 5px 3px #012E3F;
	box-shadow: 0px 0px 6px 1px #012E3F; 
	display: none;
	padding: 40px 20px 20px 20px;
}
#history_header, #modal_header {
    cursor:move;
    display:block;
    z-index: 101;
    margin: -10px -30px 10px -30px;
    height:30px;
    font-size:20px;
    background-color:#012E3F;
    color:#fff;
    overflow:hidden;
    padding:2px 150px 2px 30px;
    font-weight: normal;
}

#history h1, #modal h1 { margin-top: 0; }
#history th { text-align: left; }
#history button.close+h3, #history button.close+h2, #history button.close+h1, 
#modal button.close+h3, #modal button.close+h2, #modal button.close+h1,
#modal_header + h3, #modal_header + h2
	{ text-transform: uppercase; position: absolute; color: white; top: 0; margin-top: 4px; font-weight: normal; font-size: 20px; padding-top: 0; }

/* -----------------------------------------------
	SPECIAL
	-------------------------------------------- */
table.color #tasks tr td { vertical-align: top; }
tr.overridden { background: #e1e9f4; }
.reviews h3 { color: black;  }
.reviews p { margin-top: 0; }
.reviews img { margin-top: 19px; }
.reviews.color tr td { vertical-align: top; }
.reviews h3.disabled { color: #777777; }
div.row:hover div.row.edited, div.row.edited{ background: #DAD2E4; border-bottom-color: #8D74AC; }
.editedBeforeReject {background: #DAD2E4; border: #8D74AC solid 2px; padding:8px; margin-top:10px; font-style: italic;}

li.html { list-style-image: url('/images/html.png'); line-height: 20px; }


#supportItems .prices, #supportItems .cost input { display: none; }
#supportItems.on tr .on .prices { display: block; }

.hasDepends { cursor: pointer; }
.hasDepends.closed td:first-child { background-image: url('/images/plus.png'); background-repeat: no-repeat; background-position: 5px; padding-left: 25px; }
.hasDepends.open td:first-child { background-image: url('/images/down.png'); background-repeat: no-repeat; background-position: 5px; padding-left: 25px; }
table.color tr.dependant td:nth-child(2) { padding-left: 35px; }

.expander { cursor: pointer; }
.expander::after { color: #00AEEF; content:'\f0da'; font-weight: 900; font-family: "Font Awesome 5 Free"; padding-left: 5px; display:inline-block;  vertical-align:bottom; }
.expander.inactive::after { color: #999;   }
.expander.open::after { color: #00AEEF; content:'\f0d7';  }

a .fa-file-text { color: #666; } 
.noteBox { display: none; position: absolute; background: white; padding: 0px; z-index: 100; }
a.inactive i { color: #aaa; cursor: default; }

tr.onlyif, tr.oneif { display: none; }
th > button:first-child { margin-left: 0; }

.largeMargin {
    font-size: 26px;
    color: #00a4e4;
    font-weight: bold;
}

/* for Project Details */
.addons { display: inline-block; margin-left: 30px; }
.addons > em { font-size: 10pt; text-transform: uppercase }
.addons .dependentTech { margin: 2px 0; }
.dependentTech.required-label::before { display: none; }
/* -----------------------------------------------
	TOOLTIP
	-------------------------------------------- */

    .lefttip span { margin-left: -300px; margin-top: -2em;}
	
	/* new css-only tips */
	.tip {  display: inline-block; }
	td.tip { display: table-cell; position: relative; }
	.tip:hover span { display:block;  opacity: 1; }
	.tip img { max-width: 300px; max-height: 300px; width: auto; height: auto;}

	#history.appmap { width: auto; top:25px; left:25px; right:25px; bottom:25px; position:fixed; overflow-y:scroll; }
	.uploadForm { max-width: 50%; width: auto; max-height: 90%; left: 25%; right: 25%; top: 50px; margin: auto auto; bottom: auto; position:fixed; padding: 50px 20px 20px 20px !important; outline: 2px dashed #92b0b3; outline-offset: -10px; transition: outline-offset .15s ease-in-out, background-color .15s linear; }
	tr.removed { text-decoration: line-through; color: #888; } 
	.fa-trash-alt {font-size:12pt;}
	tr.removed .fa-trash-alt { display: none; }
	tr .fa-trash-restore-alt { display: none; }
	tr.removed .fa-trash-restore-alt { display: inline; }
	
/* ----------------
 * TABS
 *---------------- */


table.fromTab {  display: none; width: 100%; }

#explanation {line-height: 1.4em;}
a.formula { text-decoration:none; border-bottom: 1px dashed #00AEEF; color: #000; margin: 0 4px; }
#explanation .recent { background-color: #ffff66; }

.headerDiv{
	background-color: #b8b7b5;  
	padding: 4px; 
	color: #000; 
	text-transform: uppercase; 
	font-size: 10pt;
	font-weight: bold;
}

#binIcon{font-size: 1.5em; cursor: pointer;}

.headerDiv label {margin-left: 1.5em;}
.headerDiv input {margin-left: .3em;}
#selectLaborTypeHeader{margin-left: .3em;}
#from{ margin-left: .3em; }
#from_dropdown{ margin-left: .3em;}
#destination{margin-left: .3em;}
#labelFrom{margin-left: 1.5em;}
#labelNoOfTrips{margin-left: 1.5em;}
#numberOfTrips{ margin-left: .3em;}
#addNewDestination{margin-top: .5em;}
#zipInput{ margin-left: .3em; }
#zipLabel{margin-left: 1.5em;}
#destinationDivM{margin-top: 1.5em;}
.mainDiv{padding-top: 2.5em;}
.buttons + .mainDiv { padding-top: 0; }
#addDestination { padding-top: 2em; }

.replySection {margin-left:40px; } 
.commentSection { font-size: 11pt;} 
.commentSection .commentTitle { font-size: 9pt; margin-top: 10px} 
.commentSection .comment { color: #555; margin: 6px 0; white-space: pre-wrap;} 
.hiddenComment {display: none;}
.hiddenLabor {display: none;}
.showMoreLessSection {margin-top: 5px;}
.ui-autocomplete {z-index: 400;}
.ui-front { background: white; border: 1px solid rgba(1, 173, 239, 0.75); padding:0; }
.ui-menu { list-style: none;  }
.ui-menu li div { padding: 2px 10px; cursor: pointer; }
.ui-menu li:hover, .ui-menu li .ui-state-active { color:white; background: #1E90FF;  font-weight:600; }

/* Date Picker */
input.datepicker { width: 150px; }
input.datepicker.narrow { width: 100px; }
.ui-datepicker{
    width: 271px !important;
    padding: 1px;
}
.ui-widget-content.ui-datepicker { border: 0; }

.ui-datepicker-header {
    background: #51658c;
    border: 0px solid #51658c;
    border-radius: 0;
}

.ui-datepicker-title{
    text-align: center;
    color: white;
}

.ui-datepicker-prev {
    height: 25px;
    float: left;
    display: inline-block;
    overflow: hidden;
    cursor: pointer;   
}

.ui-datepicker-prev:before {
    content: '\f0d9';
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    font-size: 18pt;
    margin-left: 4px;
}
.ui-datepicker .ui-datepicker-prev span, .ui-datepicker .ui-datepicker-next span { display: none; }


.ui-datepicker-next {
    height: 25px;
    text-align:right;
    padding-right: 2px;
    display: inline-block;
    overflow: hidden;
    cursor: pointer;
}

.ui-datepicker-next:before {
    content: '\f0da';
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    font-size: 18pt;
}

.ui-state-hover{
    background: none;
    border: none;
    color: none;
}

.ui-datepicker-prev-hover.ui-state-hover {
    background: #51658c !important;
    border: none !important;
    height: 25px !important;
    color: #cee8f2 !important;
    text-decoration: none !important;
    left: 2px; top: 2px;
}

.ui-datepicker-next-hover.ui-state-hover {
    background: #51658c !important;
    border: none !important;
    height: 25px !important;
    color: #cee8f2 !important;
    text-decoration: none !important;
    right: 2px; top: 2px;
}

.ui-datepicker-calendar{
    margin-bottom: 0 !important;
    border: 1px solid #a9a9a9c9;
}

.ui-datepicker-calendar thead {
    border-bottom: 1px solid #cacaca;
}

.ui-datepicker-calendar thead th{
    padding: 3px;
}

.ui-state-default{
    width: 100% !important;
    background: transparent !important;
    border: none !important;
    text-decoration: none !important;
}

.ui-icon-circle-triangle-e{
    background-position: -50px 195px !important;
}
.ui-datepicker tbody td{
    padding: 0 !important;
    border-right: 1px solid #bbb !important;
}

.ui-datepicker tbody td:last-child {
    border-right: 0px !important;
}

.ui-datepicker tbody tr{
    border-bottom: 1px solid #bbb !important;
}

.ui-datepicker tbody tr:last-child{
    border-bottom: 0px !important;
}

.ui-datepicker td span, .ui-datepicker td a {
    display: inline-block !important;
    font-weight: bold !important;
    text-align: center !important;
    line-height: 30px !important;
    width: 25px;
    height: 25px;
    filter: dropshadow(color=#fff, offx=1, offy=1) !important;
}

.ui-datepicker td span, .ui-datepicker td a {
    padding:0;
}

.ui-datepicker-calendar .ui-state-default {
    background: #ededed !important;
    background: -moz-linear-gradient(top, #ededed 0%, #dedede 100%) !important;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ededed), color-stop(100%,#dedede)) !important;
    background: -webkit-linear-gradient(top, #ededed 0%,#dedede 100%) !important;
    background: -o-linear-gradient(top, #ededed 0%,#dedede 100%) !important;
    background: -ms-linear-gradient(top, #ededed 0%,#dedede 100%) !important;
    background: linear-gradient(top, #ededed 0%,#dedede 100%) !important;
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ededed', endColorstr='#dedede',GradientType=0 ) !important;
    -webkit-box-shadow: inset 1px 1px 0px 0px rgba(250, 250, 250, .5) !important;
    -moz-box-shadow: inset 1px 1px 0px 0px rgba(250, 250, 250, .5) !important;
    box-shadow: inset 1px 1px 0px 0px rgba(250, 250, 250, .5) !important;
}

.ui-datepicker-unselectable .ui-state-default {
    background: #f4f4f4 !important;
    color: #b4b3b3 !important;
}

.ui-datepicker-calendar .ui-state-hover {
    background: #f7f7f7 !important;
    color: #012E3F;
}

.ui-datepicker-calendar .ui-state-active {
    color: #012E3F;
    background: #b8b7b5 !important;
    -webkit-box-shadow: inset 0px 0px 10px 0px rgba(0, 0, 0, .1);
    -moz-box-shadow: inset 0px 0px 10px 0px rgba(0, 0, 0, .1);
    box-shadow: inset 0px 0px 10px 0px rgba(0, 0, 0, .1);
    filter: dropshadow(color=#4d7a85, offx=0, offy=1);
    border: 1px solid #55838f;
    position: relative;
    margin: -1px;
}
.imagesGroup { display: flex; flex-direction: row; width: 10%; justify-content: space-between; align-items: center;}
.wrapperDiv{ display: flex; flex-direction: row;}
.mt-10 { margin-top: 10px;}
.mt-14 { margin-top: 14px; }
.pt-14 { padding-top: 14px !important;}
.pt-17 { padding-top: 17px !important;}

/*Export Section*/
li.pdf { list-style-type: none !important;}
li.excel { list-style-type: none !important;}
li.word { list-style-type: none !important;}
.wrapperDocsParent{ display: grid; grid-template-columns: 1fr 1fr; grid-column-gap: 1em;}
.listDocuments { display: grid; grid-template-columns: 1fr; grid-auto-rows: auto; grid-row-gap: .5em;}
.excel:before, .icon-xlsx:before, .icon-xls:before { content:'\f1c3'; font-family: "Font Awesome 5 Free";  display:inline-block;  vertical-align:bottom; font-size: 1.6em; color: #32b61e; margin-right: 8px; font-weight: 300}
li.pdf:before, .icon-pdf:before { content: '\f1c1'; font-family: "Font Awesome 5 Free"; display:inline-block;  vertical-align:bottom; font-size: 1.6em; color: red; margin-right: 8px; }
.icon-jpg:before, .icon-jpeg:before, .icon-png:before { content: '\f1c5'; font-family: "Font Awesome 5 Free"; display:inline-block;  vertical-align:bottom; font-size: 1.6em; color:#00AEEF; margin-right: 8px; }
li.word:before, .icon-doc:before, .icon-docx:before { content: '\f1c2'; font-family: "Font Awesome 5 Free"; display:inline-block;  vertical-align:bottom; font-size: 1.6em; color:#01648b; margin-right: 8px; }
li.word:before, li.excel:before, li.pdf:before { margin-left: -26px; vertical-align: middle; }
li.word, li.excel, li.pdf { padding: 5px 0 5px 30px; }
.wrapperIconLink { display: grid; grid-template-columns: 20px 1fr; grid-auto-rows: auto; grid-column-gap: 1em;}
.wrapperDocs1 ul { padding: 0 !important; margin:0;}
li.word select { margin: 5px 0; }
li.word button { margin: 0 0 10px 0; }

.column { display: flex; flex-direction: column;}
.right { float: right; }
td.right, th.right { text-align: right !important; float: none; }

.notification { width: 50%;	
	border: 2px solid #2C60B1;
	z-index: 100;
	background: white;
	-webkit-box-shadow: 0px 0px 5px 3px #2c60b1;
	box-shadow: 0px 0px 6px 1px #2c60b1; 
	padding: 20px; 
	top: 50px; 
	left: 50%;
	margin-left: -25%; 
	position: fixed; }
	
.parent-container{ display: flex; flex-direction: column;}
.content { margin-bottom: 25.5em; }
#submit-data { max-width: 150px; margin-left: 0;}

.error-blur-div{ max-width: 50%; height: 50%; left:25%; position: absolute; font-size: 2.5em; color: #d82c2cf0; margin-left: auto; margin-right: auto; transition: .3s;}
.ul-errors{ list-style-type: none; text-align: left;}
.blur-me { filter: blur(5px); transition: .4s;}
.ext p{ float: right; width: 2.5em; }
.ext p i:hover { color: #e04141f0; cursor: pointer;}

.divExpand{ width: 30vw; max-height: 100%; animation: animateDiv .5s; animation-fill-mode: forwards; animation-timing-function: ease-in; white-space: normal; }
table.color .divExpand table td { text-align: left; }
.expandPreview { color: rgb(86, 131, 255); }
.expandPreview:hover { color: blue; cursor: pointer; }

@keyframes animateDiv{ 0% {opacity: 0} 50% {opacity: .5} 100% {opacity: 1} }

/* not 100% sure this is needed.  Came from OQ-582 merge which was a branch off develop */
@media only screen and (max-width: 900px){
    .wrapperDocsParent{ grid-template-columns: 1fr; grid-auto-rows: auto;}
}

#atlwdg-trigger { z-index: 20; }

/* spinner class for infinite rotating */
.infiniteSpinning {
    -webkit-animation: infinite-spinning 1s linear 0s infinite normal;
    animation: infinite-spinning 1s linear 0s infinite normal;
}
@keyframes infinite-spinning {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}