body,
textarea{
    font-family: Arial, Helvetica, sans-serif;
}
textarea {
    font-size: 14px;
}
#page {
    max-width: 1465px;
    margin-left: auto;
    margin-right: auto;
}
.companyLogo {
    height: 45px;
    padding: 11px 0px;
}
.pageSection {
    width: 180px;
    height: 110px;
    border: 1px solid #000000;
    border-radius: 5px;
    position: relative;
    display: inline-block;
    margin-right: 25px;
    box-shadow: 2px 2px #EFEFEF, -2px -1px #EFEFEF;
    margin-bottom: 10px;
    text-align: center;
}
.carousel-control-next-icon, .carousel-control-prev-icon{
    background-color: #000 !important;
}
.carousel-inner{
    left: 130px;
}
.center {
    text-align: center;
}
.circle {
    display: inline-block;
    vertical-align: middle;
    width: 30px;
    height: 30px;
    background-color: white;
    border: solid 1px black;
    border-radius: 50%;
    position: absolute;
    left: -14px;
    top: 25px;
    text-align: center;
    /*font-size: 1.2em;*/
    font-weight: bold;
    padding-top: 2px;
}
/*.active {*/
/*    border: 2px solid rgb(197, 219, 236);*/
/*}*/
.inactiveBox {
    border: 1px solid rgb(233, 237, 241);
    color: #C3CBD0;
}
.card{
    border: none !important;
}
.activeCircle {
    color: #1D5987;
    font-family: Arial, Helvetica, sans-serif;
}
.inactiveCircle {
    border: 2px solid rgb(233, 237, 241);
}
.verifiedBox,
.verifiedCircle,
.verifiedBox .sectionLabel {
    color: rgb(55, 186, 119);
}
.verifiedBox {
    cursor: pointer;
}
.verifiedBox,
.verifiedCircle {
    border: 2px solid rgb(79, 220, 145);
}
.label {
    color: #707070;
    font-weight: bold;
    font-size: 13px;
    padding: 10px 0px;
}
.boxInfo,
.companyInfobox {
    display: inline-grid;
    text-align: left;
}
.boxInfo span {
    display: block;
}

.verifiedBox .verifiedLogo,
.addButton,
.display-inline-block {
    display: inline-block !important;
}
.boxInfo span.verifiedLogo {
    background: url(../images/buttons/green_check.png) 0 0 no-repeat;
    width: 27px;
    height: 26px;
    top:10px;
    right: 0px;
    display: none;
    position: absolute;
    /*float: right;*/
    margin-left: 10px;

}
.sectionLabel {
    color: #2E6E9E;
    font-size: 12px;
    font-weight: bold;
    width: 100px;
}
.inactiveSectionLabel {
    color: #C0C8CD;
}
.signUpIcon {
    background: url(../images/design/login.png) 0 0 no-repeat;
}
.companyInfoIcon {
    background: url(../images/design/companyInfo.png) 0 0 no-repeat;
}
.paymentsIcon {
    background: url(../images/design/payments.png) 0 0 no-repeat;
}
.accountsIcon {
    background: url(../images/design/payments.png) 0 0 no-repeat;
}
.importsIcon {
    background: url(../images/design/imports_icon.svg) 0 0 no-repeat;
}
.agreementIcon {
    background: url(../images/design/agreement_icon.svg) 0 0 no-repeat;
}
.paymentIcon {
    background: url(../images/design/payment_icon.svg) 0 0 no-repeat;
}
.creditCardIcon {
    background: url(../images/design/credit_card_icon.svg) 0 0 no-repeat;
}
.bankAccountIcon {
    background: url(../images/design/bank_icon.svg) 0 0 no-repeat;
}
.creditCardActiveIcon {
    background: url(../images/design/credit_card_active_icon.svg) 0 0 no-repeat;
}
.bankAccountActiveIcon {
    background: url(../images/design/bank_active_icon.svg) 0 0 no-repeat;
}
.paymentInfoIcon {
    background: url(../images/design/payment_info_icon.svg) 0 0 no-repeat;
}
.paymentWarningIcon {
    background: url(../images/design/payment_warning_icon.svg) 0 0 no-repeat;
}
.paymentNote {
    font-size: 13px;
    text-align: left;
    padding: 10px 0;
    background-color: #fcfdfd;
}
#tabs,
#creditCard,
#bankAccount,
.ui-widget-content {
    background: #efefef;
    background-color: #efefef;
}
.infoIcon,
.frequencyTooltip,
.endDateToolTip {
    background: url(../images/design/info_icon.svg) 0 0 no-repeat;
    height: 16px;
    width: 16px;
    display: inline-block;
    margin-left: 30px;
}
.pageIcon {

    width: 26px;
    height: 23px;
    display: inline-block;
    vertical-align: middle;
}
.pageLabel {
    color: #707070;
    font-size: 1.2em;
    vertical-align: middle;
    padding-left: 10px;
}
.userForm {
    width: 100%;
    padding-top: 20px;
    display: inline-block;
}
.leftSection {
    margin-right: 20px;
}

.leftSection,
.rightSection {
    width: 49%;
    background-color: #F1F1F1;
    float: left;
    border: 1px solid #ed1c24;
    margin-left: 1px;
    margin-bottom: 10px;
}
.fieldSet {
    margin: 20px 10px;
    border: 1px solid #cccccc;
    padding-top: 25px;
    padding-left: 15px;
    padding-bottom: 15px;
}
legend {
    font-size: 1.1em;
}
.row {
    width: 100%;
}
.required {
    display: block;
    margin-bottom: 5px;
}
.required::after {
    content: "*";
    color: red;
    margin-left: 5px;
}
.required label {
    font-size: 14px;
}
.userDetail div {
    display: inline-block;
}
.col-sm2 {
    width: 35%;
    margin-left: 20px;
    margin-right: 30px;
}
.col-sm3 {
    width: 46%;
}
.col-sm4 {
    width: 48%;
    margin-right: 30px;
}
.col-sm .firstName {
    width: 200px;
}
.userDetail input,
.userDetail select {
    height: 35px;
    background-color: white;
    border: 1px solid #cccccc;
    font-size: 14px;
    padding: 2px 5px;
}
.userDetail select {
    height: 41px;
}
.col-title select {
    width: 55px;
    height: 38px;
}
.userDetail input {
    width: 96%;
}
.userDetailRow,
.newCompanyLogo {
    margin-top: 15px;
}
.province,
.countryID {
    width: 100%;
}
.extNumber {
    width: 45px;
}
.col-ext,
.col-office-phn,
.margin-right-30 {
    margin-right: 30px;
}
.margin-top-10 {
    margin-top: 10px;
}
.col-ext {
    width: 7%;
}
.col-office-phn {
    margin-left: 0px;
}
.rightFieldSet {
    padding-bottom: 40px;
}
.nextButtonRow {
    margin-top: 40px;
    margin-bottom: 40px;
    display: block;
    text-align: right;
}
.nextButton,
.button {
    border: 2px solid #c5dbec;
    background-color: #dfeffc;
    font-size: 1.2em;
    color: #2e6e9e;
    width: 110px;
    height: 55px;
    border-radius: 5px;
}
.comparePlanLink {
    color: #2e6e9e;
    text-decoration: underline;
    cursor: pointer;
    font-size: 1.2em;
}
.customizeButton {
    margin-top: 70px;
}
.button {
    height:35px;
    font-size: 14px;
    cursor: pointer;
}
.paymentSection {
    width: 28%;
    height: 480px;
    border-radius: 25px;
    background-color: #f4f9fd;
    display: inline-block;
    margin-right: 55px;
}
.paymentLastSection {
    margin-right: 0;
}
.pageTitle {
    padding: 30px 0;
}
.businessLogo {
    width: 100%;
    height: 200px;
    display: inline-block;
    text-align: center;
}
.businessLogo img {
    height: 180px;
}
.selectedLabel {
    padding: 5px;
    background-color: #ed1c24;
    color: white;
    font-size: 13px;
    border-radius: 5px;
    transform: rotate(-35deg);
    display: inline-block;
}
.selectedSection {
    visibility: hidden;
    padding-top: 15px;
}
.selected {
    border: 1px solid #ed1c24;
}
.businessPlanLabel,
.businessAmountLabel {
    color: #004E95;
    text-align: center;
    font-size: 20px;
    text-transform: uppercase;
}
.businessAmountLabel {
    font-size: 18px;
    margin-top: 20px;
    text-transform: none;
}
.unselected {
    opacity: 0.5;
}
.businessDetailsSection {
    height: auto;
    padding-bottom: 20px;
    background-color: #F1F1F1;
    border: 1px solid #ed1c24;
}
.col-sm5 {
    width: 50%;
}
.planID {
    width: 100%;
}
.planForm {
    width: 80%;
}
.margin-none {
    margin: 0px;
}
.planListRow,
.signatureField,
.declarationClearButton,
.vertical-align-top {
    vertical-align: top;
}
.link {
    color: #306ea7;
    text-decoration: underline;
    cursor: pointer;
}
.boldFont {
    font-weight: bold;
}
.detailsLink {
    margin: 0 10px;
}
.planTotalAmount {
    margin-left: auto;
}
.planTotalAmount .fieldValue {
    width: 150px;
}
.businessPlanTable th {
    font-size: 12px;
}
.sectionName {
    width: 200px;
}
.businessPlanTable .parentSectionName,
.businessPlanTable .sectionName {
    text-align: left;
    font-size: 12px;
    height: 22px;
}
.comparePlan {
    padding: 10px;
    background-color: #efefef;
    border: 1px solid #ed686d;
    display: inline-block;
}
.comparePlan fieldset {
    margin-top: 0px;
}
.mainSection {
    background-color: #e1effb;
}
.mainSection td {
    border: 1px solid #c6deef
}
.planForm .backButton {
    margin-right: 20px;
}
.requiredLabel:after {
    content: " *";
    color: red;
    font-size: 1.2em;
    line-height: 1em;
}
.addressType div {
    display: inline-block;
    margin-right: 20px;
    font-size: 15px;
}
.uploadFile .dragMessage {
    background: white;
    opacity: 0.5;
    margin-top: 10px;
    font-size: 8pt;
    font-style: italic;
    font-weight: normal;
    text-align: center;
}
#myDropzone {
    background: none;
    min-height: 50px;
    border: 1px solid #bdbdbd;
    margin-top: -45px;
}
.additionalAddressLink {
    padding-left: 25px;
    text-decoration: none;
}
.marginBottom {
    margin-bottom: 10px;
}
.hidden {
    display: none !important;
}
.positionRelative {
    position: relative;
}
.inlineBlock {
    display: inline-block;
}
div.block {
    display: block;
}

div.errorSummary {
    width: 400px;
    margin-left: auto !important;
    margin-right: auto !important;
}
input.error,
textArea.error,
select.error {
    background: #FEE;
    border-color: #C00;
}
#deleteLogo {
    position: absolute;
    right: 0;
    cursor: pointer;
    width: 18px;
    height: 18px;
}
.iframeFiscalPeriod {
    height: 500px;
}
.highlightTooltip {
    max-width: 450px;
}
.highlightTooltip .ui-tooltip-content {
    padding: 1em;
}
.highlightTooltip .ui-tooltip-content .tooltipDownArrow {
    position: absolute;
    width: 310px;
    height: 20px;
    top: 30px;
    left: 0%;
}
.highlightTooltip .ui-tooltip-content .tooltipDownArrow div {
    width: 0;
    height: 0;
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    border-right:20px solid #65A5CC;
    margin-left: -20px;
}
#setupOwnAccount {
    width: auto;
    height: auto;
}
.col-sm-4 {
    width: 33.33333333%;
}
.col-sm-3 {
    width: 25%;
}
.col-sm-2 {
    width: 16.66666667%;
}
.col-sm-1 {
    width: 8.33333333%;
}
.vertical-align-bottom {
    vertical-align: bottom;
}
.vertical-align-middle {
    vertical-align: middle;
}
.importType input,
.deleteAttachmentBtn {
    height: 18px;
    width: 18px;
}
.autocomplete-loading {
    background: white url(/v2/app/images/buttons/loading.gif) center center no-repeat;
    display: inline-block;
    width: 16px;
    height: 16px;
}
.agreementSection {
    display: block;
    width: 80%;
    height: 400px;
    overflow-y: scroll;
    border-color: grey;
}
.agreementSection ul {
    list-style: decimal;
}
.agreementSection ul li {
    padding-left: 5px;
}
.signaturePad {
    width: 510px;
    height: 120px;
    display: inline-block;
    border: 1px solid #ccc;
    border-radius: 4px;
}
.agreementDeleteButton {
    background-color: gray;
}
.signatureImg {
    border-bottom: 1px solid black;
}
.deleteButton {
    border-color: gray;
    color: white;
    margin-bottom: 0;
    font-weight: normal;
    text-align: center;
    white-space: nowrap;
    cursor: pointer;
    background-image: none;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    border-radius: 4px;
    text-decoration: none;
}
 .removeLabel {
     position: relative;
     top: 1px;
     display: inline-block;
     font-style: normal;
     font-weight: bolder;
     font-size: 1.2em;
     line-height: 1;
 }
 .signatureImg {
     height: 130px;
 }
 .has-error canvas {
     border: 1px solid red;
 }
 .nowrap {
     white-space: nowrap;
 }

 .note-primary {
    background-color: rgb(252, 253, 253);
    border-color: rgb(46, 110, 158);
  }
  .note {
    padding: 10px;
    border-left: 6px solid;
      border-left-color: rgb(46, 110, 158);
    border-radius: 5px;
    font-size: 14px;
  }
.ui-dialog .ui-dialog-titlebar-close span {
    margin: -8px !important;
}
.creditCardFrame {
    height: 212px;
}
.ui-widget-overlay {
    z-index: 1 !important;
}
#footer {
    text-align: center;
    color: #4b7a9f;
    font-size: 12px;
}
.introductionPopup {
    z-index: 1;
    width: 650px !important;
    font-size: 1em;
    border-color: black !important;
    padding: 0 !important;
    text-align: justify;
}
.introductionPopup .ui-dialog-titlebar {
    display: none;
}
.introductionPopup .ui-dialog-buttonpane {
    border: none;
    padding-top: 0px !important;
    margin-top: 0px !important;
}
.introductionPopup,
.introductionPopup .ui-dialog-buttonpane,
.introductionPopup .ui-dialog-content {
     background-color: #F2DCDB !important;
}
.introductionPopup .ui-button {
    font-size: .8em !important;
    color: #2e6e9e !important;
    width: 110px !important;
    height: 55px !important;
    padding: 0px;
}
.text-justify {
    text-align: justify;
}
.introductionPopup .ui-button,
.introductionPopup .ui-state-focus {
    background: #f8c5c7 !important;
    color: #ef3b42 !important;
    border: 1px solid #ef3b42 !important;
}
.formLabel {
    font-size: 14px;
}
@media (max-width:1243px) {
    .topAlign {
        white-space: nowrap;
    }
}
@media (max-width:968px) {
    .leftSection,
    .rightSection,
    .col-sm-1,
    .col-sm-4,
    .col-sm-3,
    .col-sm-2,
    .col-sm2,
    .col-sm4,
    .col-sm3,
    .col-sm5,
    .col-ext,
    .planForm,
    .userDetail input,
    .userDetail select,
    .planList {
        width: 98%;
        display: block;
        margin: 0;
    }
    .userDetail div {
        margin-bottom: 15px;
    }
    .planList {
        display: inline-table;
    }
    .rightSection {
        height: auto !important;
        margin-top: 10px;
    }
    .nextButtonRow {
        text-align: center;
    }
    #header .row {
        padding-left: 10px;
    }
    .agreementSection {
        width: 91%;
    }
    .paymentSection {
        margin-bottom: 10px;
    }
    .topAlign div,
    .detailsLink,
    .planButtons {
        margin-bottom: 0px;
    }
    .creditCardFrame {
        height: 385px;
    }
    .nextButtonRow {
        display: block !important;
    }
    .importType {
        white-space: nowrap;
    }
    .importType label {
        font-size: 15px;
    }
}

@media (min-width: 581px) and (max-width: 614px) {
    .businessPlanLabel, .businessAmountLabel {
        font-size: 12px;
    }
}
@media (min-width: 615px) and (max-width: 1030px) {
    .businessPlanLabel, .businessAmountLabel {
        font-size: 14px;
    }
    .comparePlanLink,
    .paymentSection {
        margin-bottom: 10px;
    }
}

@media (max-width:580px) {

    .paymentSection {
        width: 100%;
    }
    .comparePlanLink,
    .paymentSection {
        margin-bottom: 10px;
    }
    #footer{
        position: relative;
        top: -10px;
    }
    .introductionPopup{
        width: auto !important;
    }
    .carousel-inner{
        left: 0px;
    }
}

@media only screen
and (min-device-width: 991px)
and (max-device-width: 1300px)
and (-webkit-min-device-pixel-ratio: 1) {
    .leftSection, .rightSection {
        width: 60%;

        position: relative;
        left: 250px;
    }
    .mobile{
        text-align: center;
    }
}

div.modal-dialog {
    pointer-events: inherit !important;
}