﻿@import url('https://fonts.googleapis.com/css?family=Poppins:300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i&display=swap');

body {font-family: 'Poppins', sans-serif; margin: 0px; padding: 0px; background:#fff;}
input, textarea, select{font-family: 'Poppins', sans-serif;}
input[type="text"] {
	display: inline-block;	background: #ffffff; border:0px; border-bottom: 1px solid #d2d2d2; width: 100%; margin: 0px;
	font-size: 15px; cursor: text; -moz-appearance: none; text-indent: 0.01px; text-overflow: ""; transition: all 0.3s ease 0s;
	box-sizing: border-box; color: #151515; margin:5px 0px 0px 0px; padding:5px 0px; outline: none; letter-spacing: 0.2px;;
}
input[type="text"]::placeholder {  
    text-align: center; 
} 
input[type="submit"], input[Type="button"], .searchbtn{ 
    background: #861211; 
    border-radius: 6px; 
    color: #ffffff; 
    font-size: 14px; 
    text-transform: uppercase; 
    padding: 3px 20px; 
    border:0px; 
    outline: none; 
    cursor: pointer; 
    letter-spacing: 1px; 
    font-weight: 500; 
    box-shadow: 0 2px 2px 2px rgba(0,0,0,0.2), 0 3px 5px 0 rgba(0,0,0,0.19);
}

textarea {
    border-top-style: dashed !important;
    border-top-width: 2px !important;
    border-left-style: dashed !important;
    border-left-width: 2px !important;
    border-right-style: dashed !important;
    border-right-width: 2px !important;
    border-color: #d2d2d2 !important;
    resize: none; 
}
select, .selectBox {
    display: inline-block;	
    background: #ffffff; 
    border:0px; 
    border-bottom: 1px solid #d2d2d2; 
    width: 100%; 
    margin: 0px;
	font-size: 15px; 
    text-indent: 0.01px; 
    text-overflow: ""; 
    transition: all 0.3s ease 0s;
	box-sizing: border-box; 
    color:#151515; 
    margin:5px 0px 0px 0px; 
    padding:5px 0px; 
    outline: none; 
    letter-spacing: 0.2px;
    box-shadow: none; 
    cursor: pointer;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-image:
            linear-gradient(45deg, transparent 50%, black 50%),
            linear-gradient(135deg, black 50%, transparent 50%),
            linear-gradient(to right, white, white);
    background-position:
            calc(100% - 7px) calc(1em + 2px),
            calc(100% - 2px) calc(1em + 2px),
            100% 0;
    background-size:
            5px 5px,
            5px 5px,
            2.5em 2.5em;
    background-repeat: no-repeat;
}



h1, h2, h3{ color:#891313; margin:0px; padding: 0px; font-size: 20px; font-weight: 500; text-transform: none;  }

.containerDiv{  margin:auto; background: #eaecf0; padding: 15px; box-sizing: border-box; margin-top:96px;padding-top:0px; position:relative;}
.clearFix{ clear: both; }
.alignCenter{ text-align: center; }
.topHeader {width:100%; background-color:#fff;position:fixed;z-index:1000020; top:0;}
.leftCol1{width:200px; position:fixed; height: 100%;z-index: 700;background-color: #891313;}
.logoDiv{padding: 0px; background: #fff; overflow: hidden;float: left;}
.logoDiv img{ width: 100%; }
.rightCol2{position:relative; margin-left:200px; width: calc(100% - 200px); min-width:1280px;}
.headTab{background: #ffffff; padding-right: 20px; overflow: hidden;float: right;}
.headFixedBar{top:100px;position:fixed;background:#eaecf0; min-height:15px;width:100%;z-index:100;}

.welcomeTxt{ font-size: 14px; font-weight: 500; color: #8c1b1a; padding-top: 5px; width: auto; float: right; text-transform: uppercase; letter-spacing: 1px;text-align: right;}
.welcomeTxt span{ color: #000000; }
.searchBox{ border-bottom: 1px solid #c5c5c5; overflow: hidden; padding-top: 5px; margin-left:80px; }
.searchIcon{width:14px; float: right; padding:5px 10px;}
.searchLftDiv{width: 285px; float: right; overflow: hidden;}
.searchLftDiv input{ background: none; outline: none; border:0px; padding:5px; color: #5d5d5d; letter-spacing: 1px;}
.searchLftDiv input::placeholder {font-size: 9px;}
/* Menu styles Starts here */
.menuDiv{clear:both; overflow: hidden;}
.menuDiv ul{ list-style: none; margin: 0px; padding: 0px; }
.menuDiv ul li{ padding: 5px 10px; width: 100%; border-bottom: 1px solid #e5e5e5; }
.menuDiv ul li a{ text-decoration: none; font-size: 14px; color:#ffffff; text-transform: uppercase; letter-spacing: 0.2px; }
.menuDiv ul ul {position: absolute; left: 0; top: 100%; visibility: hidden; opacity: 0; background: #891313; width:230px;}
.menuDiv li:hover > ul {visibility: visible; opacity: 1;}
/* Ends here */

/* Content Styles */
.wrapperDiv{ background: #ffffff; padding: 15px; position:relative; overflow: visible;min-height:743px;}
.contentTopBtm{ padding: 10px 0px; }
.selctCustomerWidth{ width: 400px; float: left; margin-right: 20px;}
.textBox {
	display: inline-block;	background: #ffffff; border:0px; border-bottom: 1px solid #d2d2d2; width: 100%; margin: 0px;
	font-size: 15px; cursor: text; -moz-appearance: none; text-indent: 0.01px; text-overflow: ""; transition: all 0.3s ease 0s;
	box-sizing: border-box; color:#5d5d5d; margin:5px 0px 0px 0px; padding:5px 0px; outline: none; letter-spacing: 0.2px;min-height: 34px;
}

.textBox img {
    cursor:pointer;
}
.appendFontSize{ font-size: 13px; }
/*.selectBox {background: #ffffff; box-shadow: none; cursor: pointer;}*/
.defaultBtn{ background: #861211; border-radius: 6px; color: #ffffff; font-size: 16px; text-transform: uppercase; padding: 5px 30px; border:0px; outline: none; cursor: pointer; letter-spacing: 1px; font-weight: 500; }
.headingBgDiv, .searchResults{ background: #f4f4f4; overflow: hidden; padding:10px 15px !important; border-radius:6px; box-sizing: border-box; }
.searchResults{ color:#891313; margin:0px; padding: 0px; font-size: 20px; font-weight: 500; text-transform: none;  }
.leftDiv{ float: left; width: auto; }
.rightDiv{ float: right; width: auto; }
.tabbingDiv{ margin: 0px; padding: 0px; }
.tabbingDiv span{ font-size: 14px; text-transform: uppercase; color: #000000; font-weight: 500; background: #ffffff; border:2px solid #000000; border-radius: 4px; padding:2px 10px; margin-top:1px; display: inline-block; cursor: pointer;}
.tabbingDivTop span{ margin-top: 5px; }
span.active{border:2px solid #891313; color: #891313;}
.getPri-col-1{ width:16%; overflow: hidden; overflow: hidden; padding:5px; float: left; box-sizing: border-box;
	margin-right: 15px; }
.getPri-col-2{ width:7%; overflow: hidden; overflow: hidden; padding:5px; float: left; box-sizing: border-box;
	margin-right:5px; }
.getPri-col-3{ width:22%; overflow: hidden; overflow: hidden; padding:5px; float: left; box-sizing: border-box;}
.getPri-col-4{ width:58%; overflow: hidden; overflow: hidden; padding:5px; float: left; box-sizing: border-box;
	margin-right: 15px; }
.getPri-col-5 {
    width: 18%;
    overflow: hidden;
    overflow: hidden;
    padding: 5px;
    float: left;
    box-sizing: border-box;
    margin-right: 15px;
}
.getPri-col-6 {
    width: 10%;
    overflow: hidden;
    overflow: hidden;
    padding: 5px;
    float: left;
    box-sizing: border-box;
    margin-right: 15px;
}

.appendWidthTxtBx{ width: 50% !important; }
.smallRedtxt{ color: #891313; font-size: 14px;  font-weight: 600; line-height:16px; }
.smallgreytxt{ color: #696969; font-size: 11px;  font-weight: normal; line-height:14px; padding-top:2px; padding-bottom:2px; font-weight:bold; }

.quoteHeadingTxt{ font-size: 16px; font-weight: 500; color: #000000; }
p{ font-size: 14px; letter-spacing: 1px; color: #717171; }
.emptyMinHeight{margin-top:15px; }

.footerDiv{background: #eaecf0; padding: 10px 0px; text-align: center; font-size: 14px; color: #000000; letter-spacing: 1px;}

.dropbtn {color: white; border: none; cursor: pointer;}
.dropdown { position: relative; display: inline-block;}
.dropdown-content { display: none;position: fixed; background-color: #f1f1f1;
  min-width: 160px; overflow: auto; box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1; font-size: 14px; right:20px;}
.dropdown-content a { color: black; padding:8px 16px; text-decoration: none; display: block;}
.dropdown a:hover {background-color: #ddd;}
.show {display: block;}

/* Grid Styles */
.bordertable{ border:2px solid #f5f5f5; border-collapse:collapse; font-size:12px;}
.borderBtm{ border-bottom:2px solid #f5f5f5;}
.tabHeading{ background:#f4f4f4; text-transform:uppercase; font-weight:500; line-height:16px;}
.tabHeading th { font-weight: 600; color:#767676;}
.tabHeading th a{ color:#767676; text-decoration:none;}
.descriptTxt{ text-transform:none; color:#333333; line-height:16px; font-weight:normal; letter-spacing:1px;}

/* Quote History Edit Starts */
.row{ margin: 0px -20px; }
.paddRow{ padding:0px 20px; }
.col-xs-2{ width: 50%; float: left; }
.col-xs-3{ width: 33.33333%; float: left;}
.col-xs-4{ width: 25%; float: left; }
.col-xs-5{ width: 20%; float: left; }
.col-xs-6{ width: 10%; float: left; }
.col-xs-7{ width: 5%; float: left; }
.col-xs-8{ width: 40%; float: left;}
.col-xs-9{ width: 15%; float: left;}
.col-xs-10{ width: 70%; float: left;}
.col-xs-11{ width: 12.5%; float: left;}
.shipmenTopGap{ margin-top: 15px; }
.quote-his-1{ width:7%; overflow: hidden; overflow: hidden; padding:5px; float: left; box-sizing: border-box;
	margin-right: 15px; }
.addressWidth1{ width: 48%; float: left; }

.addressWidth2{ width: 48%; float: right; }
.descriptionWidth{ width:400px; overflow: hidden; overflow: hidden; padding:5px; float: left; box-sizing: border-box;}
.borderGrid{    border: 1px solid #f4f4f4;}

/* Get Pricing UK */
.get-pricing-1{width: 22%; float: left; overflow: hidden;}
.get-pricing-2{width: 34%; float: left; overflow: hidden;}
.getPricingPadd{ padding: 10px; overflow: hidden; }
.accesTxt{ font-size: 14px; }
.accesTxt td {padding:0px 15px 0px 0px !important; height:19px !important;}
.acceBldTxt{ font-weight: 600; }
.postionTop { margin-top: -10px !important; }
.smallhdngTxt{ font-size: 12px; background:#f4f4f4; text-transform:uppercase; font-weight:500; line-height:20px;
	font-weight: 600;}
.contentLftDivInn{width: auto; padding: 10px 0px; overflow: hidden; float: left;}
.contentRgtDivInn{width: 60%; padding: 10px 0px; overflow: hidden; float: right;}
.ListDiv{ margin:0px; padding: 0px; }
.ListDiv ul{ margin:0px; padding: 0px; list-style: none; }
.ListDiv ul li{ margin:0px; padding: 0px; float: left; padding:5px;  font-size: 14px;}
.ListDiv ul li div{ float: left; padding-left:10px; color: #696969;}
.ListDiv ul li div:hover { color:#891313;}
.ListPop ul li{width:95%; font-weight:500; font-weight:bold;}
.ListPop ul li:hover {background-color: #e5e5e5; color:#891313;}
.fixedWidth ul li{ width: 24%; }
.imageAling{ vertical-align: middle; }
.InnertabbingDiv{ margin: 0px; padding: 0px; text-align: center; }
.InnertabbingDiv span{ font-size: 11px; text-transform: uppercase; color: #000000; font-weight: 500; background: #ffffff; border:2px solid #000000; border-radius: 4px; padding:2px 5px; margin-top:10px; display: inline-block; cursor: pointer;}
span.active{border:2px solid #891313; color: #891313;}

.widgetTableTxt { font-size: 12px;  }
.widgetTableTxt a{ color: #891313;text-decoration: underline;}
.map-col-1{width:20%; float: left; overflow: hidden; padding: 0px 30px 0px 0px; box-sizing: border-box;}
.map-col-2{width:25%; float: left; overflow: hidden; box-sizing: border-box;}
.map-col-3{width:30%; float: left; overflow: hidden; box-sizing: border-box;}
.map-col-4{width:20%; float: right; overflow: hidden; box-sizing: border-box; font-size: 12px;}
.map-col-5{width:40%; float: right; box-sizing: border-box; }
.breakTxt{ display: block; }

/* Quote History Screen */
.quoteCol3{ width: 33.3333%; float: left; }
.padd10{ padding: 10px; }

/* Tracking History Screen */
.trackingCol3{ width: 25%; float: left; }
.padd10{ padding: 10px; }

/* user checkBox*/
.usercol-2 { width: 50%; float: left; padding-bottom:5px; }
.carriedcol-2{width: 50%; float: left;}
.carriedcol-3{ width: 33%; float: left; }
.serviceList{ margin:15px 0px 0px 0px; padding: 0px; }
.serviceList ul{ list-style: none; margin: 0px; padding:0px; }
.serviceList ul li { padding: 5px 10px 5px 0px; }

.innerBox3{ width: 30%; float: left; }
.paddLftRgt{ padding: 0px 10px; }

.recentTrasactionDiv{ width: 100%; margin: 10px 0px;}
.recentTrasactionDiv ul{ margin: 0px; padding: 0px; border:1px solid #eeeeee; overflow: hidden; }
.recentTrasactionDiv ul li { float: left; list-style: none; }
.recentTrasactionDiv ul li a{ padding: 12px 27px; display: block; color: #6d6d6d; text-decoration: none; }
.border-Rgt{ border-right: 1px solid #eeeeee }
.activeTab{ background: #861211; color: #ffffff !important; }
.popUp , .statusPop
{   
   
    border: 2px solid #861211;
    background-color:#fff;
    border-radius: 6px;
    box-sizing: border-box;
    box-shadow: 0 2px 2px 2px rgba(0,0,0,0.2), 0 3px 5px 0 rgba(0,0,0,0.19);
    z-index:1000021 !important;
}

.statusPop {
    position: absolute;
    right:0px;
}

.popUp {
     font-size: 14px;
     padding-bottom:15px;
}
.valBox {
    padding: 10px 10px;
    font-size:14px;
    font-weight: 500; 
    color: #861211 !important;
    background-color: #ffcccc; /*rgba(242, 17, 15, 0.21);*/
    text-align:center;
}
.valBox ul {
    display:none;
    text-align:left;
}
.showErrors ul {
    display:block !important;
}
.headerTxt
{ 
    color:#891313; 
    font-size: 16px; 
    font-weight: 500; 
    text-transform: none; 

}

.warningBox 
{
    border: solid 1px gray; 
    background-color: #edf6fb; 
    padding: 2px;
    position: absolute; 
    color: Red; 
    width: 220px; 
    height: auto; 
    text-align: left; 
    z-index:1001;
    border-radius: 5px;
    box-sizing: border-box;
}
.invisible {
    display: none !important;
}

.requiredVal, .requiredVal ~ label {
    border-bottom-color:red !important;
}

.requiredVal ~ div {
    color:red !important;
}

.requiredTxt {
    color:red !important;
}

.comboRequiredVal, multiVal {
   display: none !important;
}

.comboRequiredVal[style*=visible] ~ div, .multiVal[style*=visible] ~ div {
    color: red;
}

.multiVal[style*=visible] ~ input,.multiVal[style*=visible] ~ select, .multiVal[style*=visible] ~ span > input, .multiVal[style*=visible] ~ span > select {
    border-bottom-color:red !important;
}
.padTop {
    padding-top:15px;
}

.padBtm {
    padding-bottom:10px;
}

.padTopBtm {
    padding-top:15px;
    padding-bottom:15px;
}

.floatRight {
    float:right;
}

.floatLeft {
    float:left;
}
.link, .link:visited
{
    color: #891313;
    cursor: pointer;
    text-decoration: underline;
}

.link a
{
    color: #891313 !important;
    font-weight:normal !important;
    cursor: pointer;
    text-decoration: underline;
}
.hyperLink {
    color: #0185dd !important;
    cursor: pointer;
    text-decoration: underline;
}
.newZipwidth{ width: 16%; }
.newCitywidth{ width: 60%; }

.warningMsg
{
    color: Red;
    font-weight: bold; /*width:200px;*/
}
.alignleft { text-align:left;}
.alignright { text-align:right;}
.aligncenter { text-align:center;}

.waiting
{
    cursor: wait;
    z-index: 100005 !important;
}

.waiting table
{
    align: center;
}

.waiting p
{
    visibility:hidden; /*This is to hide the 'Please wait' text*/
    text-align:center;
    padding-top:300px !important;
}

.waiting img
{
    width:300px;
}

 .progressBar {
            
            height: 300px;
            width: 300px;
            border: 1px solid #861211;
            background-color: #fff;
            z-index: 100010 !important;
            text-align: center;
            border-radius: 6px;
            box-sizing: border-box;
        }

 .box {
     border: 1px solid #d2d2d2;
 }

 .noborder td
{
    border-right-style: none !important; 
    border-left-style: none !important; 
    border-top-style:none !important; 
    border-bottom-style:none !important; 
}

.tableFontTxt{ font-size: 14px; }
.tariffCol-3{float: left; width:15%; padding-right: 10px; box-sizing: border-box;}
.emailDocumentDiv{ width: 600px; }

.fr-col-1{width:15%;float:left;padding:5px;border-bottom:2px solid #f5f5f5;border-left: 2px solid #f5f5f5; }
.fr-col-2{width:10%;float:left;padding:5px;border-bottom:2px solid #f5f5f5;}
.fr-col-3, .fr-col-3-2{width:5%;float:left;padding:5px;border-bottom:2px solid #f5f5f5; border-right: 2px solid #f5f5f5; text-align:center;}
.fr-col-1 input{width:75%;}
.fr-col-2 input{width:75%;}
.fr-col-3 img{ padding:5px 0px; margin-top:9px; cursor:pointer;}

.fr-col-4{width:20%;float:left;padding:5px;border-bottom:2px solid #f5f5f5;border-left: 2px solid #f5f5f5; }
.fr-col-5{width:15%;float:left;padding:5px;border-bottom:2px solid #f5f5f5;}
.fr-col-6, .fr-col-6-2{width:5%;float:left;padding:5px;border-bottom:2px solid #f5f5f5; border-right: 2px solid #f5f5f5; text-align:center;}
.fr-col-4 input{width:75%;}
.fr-col-5 input{width:75%;}
.fr-col-6 img{ padding:5px 0px; margin-top:9px; cursor:pointer;}


.tblAccessorial {
    border: 2px solid #f5f5f5; border-collapse: collapse;
}
.tblAccessorial img{cursor:pointer;}

.quickRequestTL-col-4{ width: 25%; float: left; }	

.smallItalic {
        font-style: italic !important; 
        font-size: 10px !important; 
        font-weight:normal !important;
        color: Gray !important;
}
.phoneWidth {
    width: 100px !important;
}

.subCustomCols {
    width: 10%;
    float: left;
    padding-right: 10px;
}

.hideControl input {
    display:none;
}

.service fieldset {
    min-height: 180px;
}
fieldset legend {
    font-weight: 600;
    color: #831211;
    font-family: 'Poppins', sans-serif;
}

.showLoader table {
    display: table !important;
}

.nowrap, .nowraptxt, .showMsg {
    white-space:nowrap;
}

.flexDisplay {
    display:flex;
}

.tariffDisclaimer{
    color: red;
    font-size: 15px;
    padding: 15px 0px 15px 0px;
   
}

.ellipsisTxt {
    white-space: nowrap;
    overflow: hidden;
    text-overflow:ellipsis;
    display: inline-block;
    width: 150px;
}

.customScreenRight{
    width: 64%; 
    float: right; 
    overflow: hidden;
    color: #333333;
    font-size: 14px;
}

 .progressBox {
            width: 100%;
            height: 100%;
            display: none;
            position: fixed;
            top: 0;
            right: 0;
            bottom: 0;
            left: 0;
            text-align: center;
            opacity: .75;
            filter: alpha(opacity=75);
            -moz-opacity: 0.75;
            z-index: 101;
        }

.content {
    display: none;
    height: 300px;
    width: 300px;
    border: 1px solid #861211;
    background-color: #fff;
    z-index: 100010 !important;
    text-align: center;
    border-radius: 6px;
    box-sizing: border-box;
}

.modalBackground
{
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    height: 100%;
    width: 100%;
    margin: 0;
    padding: 0;
    background-color: #fff;
    opacity: .75;
    filter: alpha(opacity=75);
    -moz-opacity: 0.75;
    z-index: 101;
}

#alertBox {
    top:0;
    position:fixed;
    width:500px;
    min-height:100px;
    margin-top:300px;
    background-color:#fff;
    background-repeat:no-repeat;
    background-position:20px 30px;
}

#alertBox p {
    padding:10px;
}

#modalContainer > #alertBox {
    position:fixed;
}

.font20 {font-size: 20px; padding: 5px 0px 5px 0px;}

.sidePadding{ padding: 5px 15px 5px 15px}

.notification {
    text-decoration: none;
    position: relative;
    display: block;
    border: 0px;
}

.notification span.badge {
     position: absolute;
     background: red;
     clip-path: circle(50%);
     height: 15px;
     width: 15px;
     color: white;
     /* text-align: center; */
     font-size: 10px;
     /* vertical-align: middle; */
     font-family: 'Poppins', sans-serif;
     margin-right: -5px;
     margin-top: -5px;
     right: 0;
     top: 0;
}