.info-sec-title {
    font-size: 24px;
    color: #000000;
    font-weight: 400;
    margin: 0;
}

a.border-button {
    font-size: 15px;
    color: #505050;
    text-align: center;
    display: inline-flex;
    width: 100px;
    height: 44px;
    border-radius: 4px;
    border: 1px solid #dddddd;
    text-decoration: none;
    justify-content: center;
    align-items: center;
}

.top-title-wrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #e9ebec;
    padding-bottom: 12px;
    padding-top: 30px;
}


.plan-grid {
    display: flex;
    padding: 0;
    margin-bottom: 50px;
}

.price-card {
    background-color: #fff;
    border-radius: 6px;
    position: relative;
    width: 340px;
    margin-right: 40px;
}
span.plan-details p {
    opacity: 0.7;
}
.radio {
    top: 32px;
    position: absolute;
    right: 32px;
}

@supports (-webkit-appearance: none) or (-moz-appearance: none) {
    .radio {
        -webkit-appearance: none;
        -moz-appearance: none;
        border-radius: 50%;
        cursor: pointer;
        height: var(--radio-size);
        outline: none;
        transition: background 0.2s ease-out, border-color 0.2s ease-out;
        width: var(--radio-size);
    }

    .radio::after {
        border: 2px solid #ffffff;
        border-top: 0;
        border-left: 0;
        content: "";
        display: block;
        height: 0.75rem;
        left: 25%;
        position: absolute;
        top: 48%;
        transform: rotate(45deg) translate(-50%, -50%);
        width: 0.375rem;
    }

    .radio:checked {
        background: #175cff;
        border-color: #175cff;
    }

    .price-card:hover .radio {
        border-color: var(--color-dark-gray);
    }

    .price-card:hover .radio:checked {
        border-color: #e9ebec;
    }
}

.plan-details {
    width: 100%;
    border: 1px solid #e9ebec;
    border-radius: 6px;
    cursor: pointer;
    padding: 30px 35px;
    transition: border-color 0.2s ease-out;
    display: inline-block;
    font-size: 15px;
    color: #303030;
    height: 100%;
}

.price-card:hover .plan-details {
    border-color: var(--color-dark-gray);
    box-shadow: 2px 3.464px 6px rgb(0 0 0 / 10%);
}

.radio:checked~.plan-details {
    border-color: #175cff;
    box-shadow: 2px 3.464px 6px rgba(0,0,0,0.1);
}


.plan-type {
    font-size: 1.5rem;
    font-weight: bold;
    line-height: 1em;
}

.plan-cost {
    font-size: 2.5rem;
    font-weight: bold;
    padding: 0.5rem 0;
}

.slash {
    font-weight: normal;
}

.plan-cycle {
    font-size: 2rem;
    font-variant: none;
    border-bottom: none;
    cursor: inherit;
    text-decoration: none;
}

.plan-summery-wrap {
    background: #f4f9fe;
    padding: 40px;
}

.plan-summery-wrap ul {
    list-style: none;
    padding: 40px 0px 0px;
    /* border-top: 2px solid #e9ebec;
    border-bottom: 2px solid #e9ebec; */
    margin: 0;
}

.plan-summery-wrap ul li {
    padding-bottom: 40px;
    font-size: 20px;
    letter-spacing: 0px;
    color: #505050;
    font-weight: 500;
}

.plan-summery-wrap ul li span,h4.summery-label {
    display: block;
    font-size: 15px;
    letter-spacing: 0px;
    text-transform: uppercase;
    font-weight: 400;
    color: #989d9f;
    padding-bottom: 3px;
}
.plan-summery-wrap p.prize-text {
    color: #175cff;
    font-size: 20px;
}

p.prize-text span {
    font-size: 170%;
}

.plan-details ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.plan-details ul li {
    margin-top: 7px;
}

.plan-details ul li {
    padding-left: 25px;
    position: relative;
    opacity: .9;
}
.plan-details ul li:before {
    content: "";
    width: 22px;
    height: 22px;
    background-image: url(/middleware/pub/server/ui/assets/img/check.svg);
    position: absolute;
    left: 0;
    top: 0;
    background-size: 20px;
    background-repeat: no-repeat;
}
.choose-plan-row {
    /* margin: 0 -25px; */
    display: flex;
}
.choose-plan-column {
    flex: 1;
    margin-right: 50px;
    padding-bottom: 10px;
}

.plan-summary-column {
    width: 625px;
}
.choose-plan-column,.plan-summary-column {
    height: calc(100vh - 145px );
    overflow: auto;
}
.price-card:last-child {
    margin: 0;
}


.cnp-accordion button.accordion-button {
    padding: 35px 70px 35px 0px;
    font-size: 25px;
    color: #101010;
    font-weight: 600;
    display: flex;
    justify-content: space-between;
}
.cnp-accordion {
    border-top: 2px solid #e9ebec;
    border-bottom: 2px solid #e9ebec;
    /* margin-bottom: 20px; */
}
.cnp-accordion span {
    margin-left: auto;
    font-weight: 400;
    font-size: 20px;
}
.cnp-accordion span a {
    text-decoration: none;
}
.cnp-accordion .accordion-button::after {
    position: absolute;
    right: 10px;
}

.cnp-accordion .accordion-button:not(.collapsed) {
    background: transparent;
    box-shadow: none;
}

.cnp-accordion .accordion-button:focus {
    border: none;
    box-shadow: none;
}

.accordion-body {
    padding: 0px 0px 25px;
    border: none !important;
    font-size: 15px;
    color: #303030;
    /* opacity: .9; */
}
.accordion-flush .accordion-item {
    border-bottom: 2px solid #e9ebec;
}
.cnp-accordion.no-border {
    border: none;
}
label {
    display: block;
    opacity: 1;
    /* padding-bottom: 10px; */
}

.cnp-form input,.cnp-form select {
    display: block;
    width: 100%;
    border-radius: 5px;
    background-color: rgb(229 229 229 / 20%);
    border: 1px solid rgb(32 32 32 / 20%);
    padding: 10px 20px;
    margin-bottom: 20px;
}
.cnp-form select {
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    background-image: var(--bs-accordion-btn-icon);
    background-repeat: no-repeat;
    background-size: 15px;
    background-position-y: center;
    background-position-x: calc(100% - 15px);
}
.cnp-form select::-ms-expand {
    display: none ;
}



.cnp-form input:focus,.cnp-form select:focus {
    outline: none;
    border-color: #999;
}
.form-row {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-right: 5px;
}

.form-row .input-wrap-full {
    width: 100%;
}

.form-row .input-wrap-half {
    width: calc(50% - 15px);
}
.accordion-body p {
    opacity: 0.7;
}

.cnp-form input::placeholder,
.cnp-form select::placeholder {
    opacity: .4;
}
.cnp-form h5 {
    font-size: 17px;
    margin-top: 20px;
}
hr {
    margin: 0;
    border-top: 2px solid #e9ebec;
    opacity: 1;
}
.plan-summary-column hr {
    max-width: 400px;
}
.cnp-accordion .accordion-button:not(.collapsed)::after {
    background-image: var(--bs-accordion-btn-icon);
}
.plan-summery-wrap p {
    color: #989d9f;
    font-size: 14px;
}
.plan-summary-column .cnp-btn {
    width: 320px;
}
.accordion-body table {
    width: calc(100% - 10px);
}

.accordion-body table td {
    padding: 12px 5px;
    border-bottom: 1px solid rgb(233 235 236 / 50%);
    color: #303030;
    font-weight: 500;
    opacity: 1;
}

.accordion-body table tr td:nth-child(2) {
    text-align: right;
}

.accordion-body table tr:last-child td {border: none;}
.aws-image {
    padding: 40px 30px;
    width: 330px;
    height: 200px;
    border: 1px solid #175cff;
    box-shadow: 0px 0px 14px rgb(0 0 0 / 10%);
    display: flex;
    border-radius: 6px;
    justify-content: center;
    align-items: center;
}

.aws-image img {
    width: 140px;
}
.dashboard-body {
    display: flex;
}

a.refesh-button svg {
    width: 20px;
    fill: #175cff;
    margin-right: 5px;
    height: auto;
}

a.refesh-button {
    font-size: 15px;
    color: #175cff;
    text-align: center;
    display: inline-flex;
    height: 44px;
    border-radius: 4px;
    border: 1px solid #175cff;
    text-decoration: none;
    justify-content: center;
    align-items: center;
    width: 100%;
}

a.refesh-button:hover {
        background: #175cff;
        color: #fff;
}
a.refesh-button:hover svg {
    fill: #fff;
}
header img {
    max-height: 100%;
}

.child-info-wrap {
    display: flex;
    flex-wrap: wrap;
}

.child-info-wrap .child-info {
    padding: 10px 8px;
}

.child-info-wrap .child-info span {
    text-transform: none;
}


@media only screen and (max-width: 1600px){
    .plan-summery-wrap ul li {
        padding-bottom: 25px;
        font-size: 18px;
    }
    .plan-summery-wrap ul {
        padding: 30px 0px 0px;
    }
    .price-card {
        margin-right: 30px;
        width: 320px;
    }
    .plan-details{
        padding: 25px 30px;
    }

    .choose-plan-column {
        margin-right: 30px;
    }

    .plan-summary-column {
        width: 425px;
    }
    .plan-summery-wrap {
        padding: 30px;
    }
    p.prize-text {
        font-size: 18px;
    }
    .btn {
        font-size: 15px;
    }
    .cnp-accordion button.accordion-button {
        padding: 25px 50px 25px 0px;
        font-size: 20px;
    }
    .plan-summary-column hr {
        max-width: 300px;
    }
    .plan-summary-column .cnp-btn {
        width: 300px;
    }
    .cnp-accordion span {
        font-size: 18px;
    }
    .aws-image {
        width: 250px;
        height: 150px;
    }
    .aws-image img {
        width: 100px;
    }

}

div#header-toggle {
    width: 85px;
    height: 25px;
    margin-right: 0px;
    text-align: center;
    cursor: pointer;
    position: relative;
}

div#header-toggle span.menu-close{
    opacity: 0;
}
.sidebar-hide div#header-toggle span.menu-close{
    opacity: 1;
}
.sidebar-hide div#header-toggle span.menu-open{
    opacity: 0;
}
div#header-toggle span {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
div#header-toggle span img {
    height: 32px;
}

body.sidebar-hide ul.nav.nav-pills {
    width: 0;
}

/********************Tree view start************************/
.main-body-wrap {
    height: calc(100vh - 25rem);
    overflow-y: auto;
}

.treeview-wrap ul.treeview {
    margin-left: 0;
    padding-top: 25px;
}

.treeview-wrap ul li {
    display: flex;
    width: 100%;
    flex-wrap: wrap;
    align-items: center;
    position: relative;
}
.treeview-wrap ul {
    list-style: none;
    padding: 0;
    margin-left: 30px;
    width: 100%;
}

.treeview li > input {
    height: 22px;
    width: 22px;
    /* opacity: 0; */
    filter: alpha(opacity=0); /* internet explorer */
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=0)"; /*IE8*/
    cursor: pointer;
}


.treeview-wrap ul li label {
    padding: 10px 30px 10px 60px;
    border: 1px solid #ddd;
    margin: 5px 0px;
    border-radius: 5px;
    width: 100%;
    position: relative;
}
.treeview-wrap ul li>input {
    position: absolute;
    z-index: 55;
    top: 15px;
    left: 32px;
}


.vertical-tree{
    padding-top: 0px;
    padding-bottom: 40px;
    padding-right: 10px;
}

.vertical-tree ul{
    padding-left: 30px;
    padding-top: 5px;
}
.vertical-tree>ul {
    padding-left: 0;
    margin: 0;
}


.vertical-tree li {
    margin: 0px 0;
	text-align: left;
    list-style-type: none;
    position: relative;
    padding: 6px 0px 6px 5px;
}
.vertical-tree li::before{
    content: '';
    position: absolute;
    top: -5px;
    width: 1px;
    height: 100%;
    right: auto;
    left: -25px;
    border-left: 2px solid #e78282;
    bottom: 50px;
}
.vertical-tree li::after{
    content: '';
    position: absolute;
    top: 29px;
    width: 30px;
    height: 20px;
    right: auto;
    left: -25px;
    border-top: 2px solid #e78282;
}

.vertical-tree > ul > li::before,
.vertical-tree > ul > li::after{
    border: 0;
}
.vertical-tree li:last-child::before{
        height: 34px;
}

.vertical-tree label {
    background: #fcfcfc;
    padding: 10px 25px 10px 65px;
    border: 1px solid #ddd;
    border-radius: 5px;
    position: relative;
}

.vertical-tree li input {
    position: absolute;
    top: 7px;
    width: 22px;
    height: 42px;
    left: 6px;
    z-index: 2;
    width: calc(100% - 5px);
    cursor: pointer;
    opacity: 0;
}

.vertical-tree span.plus-minus-icon {
    position: absolute;
    left: -32px;
    top: 22px;
    z-index: 5;
    border: 1px solid;
    border-radius: 50%;
    width: 15px;
    height: 15px;
    line-height: 11px;
    text-align: center;
    background: #fff;
    /* opacity: 0; */
    cursor: pointer;
}
.vertical-tree ul li:last-child {
    padding-bottom: 0;
}

.vertical-tree label:before {
    content: "";
    width: 8px;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    border-radius: 5px 0px 0px 5px;
}

.vertical-tree span.plus-minus-icon:before {
    content: "+";
}
.vertical-tree span.plus-minus-icon.expend-hide:before {
    content: "-";
}

.vertical-tree label:after {content: "";display: inline-block;vertical-align: text-top;width: 22px;height: 22px;border: 1px solid #e9e9e9;background: #fff;border-radius: 3px;position:absolute;left:35px;}

.vertical-tree label.custom-checked:after {
    border: 1px solid #175cff;
    background-image: url(/middleware/pub/server/ui/assets/img/check-solid.svg);
    background-repeat: no-repeat;
    background-size: 15px;
    background-position: center center;
}

/*****1st step color change*****/

.vertical-tree ul.tree-step1>li>label:before {
    background: #e78282;
}


/*****2nd step color change*****/
.vertical-tree ul.tree-step2>li>label:before {
    background: #7fbf7c;
}

.vertical-tree ul.tree-step2>li:after,
.vertical-tree ul.tree-step2>li:before  {
    border-color: #e78282;
}
.vertical-tree ul.tree-step2>li>.plus-minus-icon{
    color: #e78282;
}



/*****3rd step color change*****/
.vertical-tree ul.tree-step3>li>label:before {
    background: #7c84bf;
}

.vertical-tree ul.tree-step3>li:after,
.vertical-tree ul.tree-step3>li:before  {
    border-color: #7fbf7c;
}
.vertical-tree ul.tree-step3>li>.plus-minus-icon{
    color: #7fbf7c;
}


/*****4th step color change*****/


.vertical-tree ul.tree-step4>li>label:before {
    background: #dd2d00;
}

.vertical-tree ul.tree-step4>li:after,
.vertical-tree ul.tree-step4>li:before  {
    border-color: #7c84bf;
}
.vertical-tree ul.tree-step4>li>.plus-minus-icon{
    color: #7c84bf;
}



/*****5th step color change*****/
.vertical-tree ul.tree-step5>li>label:before {
    background: #e782cf;
}


/********************Tree view End************************/