.mo_saml_help_title {
    font-size: 17px;
    width: 100%;
    color: #1b79ae;
    cursor: pointer;
    font-weight: 700
}

.mo_saml_help_desc {
    font-size: 13px;
    border-left: solid 2px rgba(128, 128, 128, .65);
    margin-top: 10px;
    padding-left: 10px
}

.mo_saml_help {
    border-top: solid 1px grey;
    width: 95%
}

.mo_saml_help_cell {
    padding: 20px;
    border-bottom: solid 1px grey
}

.mo_saml_support_layout {
    width: 90%;
    background-color: #fff;
    border: 1px solid #ccc;
    padding: 0 20px
}

.mo_saml_table_layout {
    background-color: #fff;
    border: 1px solid #ccc;
    padding: 0 10px 10px 10px;
    margin-bottom: 10px
}

.mo_saml_table_layout input[type=text] {
    width: 80%
}

.mo_saml_table_layout td strong {
    margin-left: 10px
}

.panel_toggle {
    cursor: pointer
}

.panel_toggle:hover {
    text-decoration: underline
}

.mo_saml_table_textbox {
    width: 80%
}

.mo_saml_settings_table {
    width: 100%
}

.mo_saml_settings_table tr td:first-child {
    width: 30%
}

.mo_saml_heading_margin {
    margin-left: 0
}

.error_wid_login {
    background-color: #ffebe8;
    border: 1px dashed red;
    color: red;
    float: left;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-weight: 500;
    padding: 6px;
    margin-left: 200px;
    width: 80%;
    clear: both!important
}

.login_wid li {
    margin: 5px
}

.login_wid {
    list-style-type: none;
    border: 1px dashed #999;
    width: 98%;
    float: left;
    padding: 5%
}

.login_wid li {
    width: 48%;
    float: left;
    margin: 2px
}

.openid_social_login {
    padding: 5px 0 0 0;
    clear: both;
    width: 100%!important
}

.login_wid li input {
    width: 85%;
    float: left;
    margin: 2px
}

.mo_saml_local_pricing_free_tab {
    background-color: rgba(34, 153, 221, .82)!important
}

.mo_saml_local_pricing_paid_tab {
    background-color: #1a71a4!important
}

.mo_saml_local_pricing_text {
    font-size: 14px!important;
    color: #fff!important;
    font-weight: 600!important
}

.mo_saml_local_pricing_sub_header {
    margin: 2px!important;
    color: #fff!important
}

.mo_saml_local_pricing_header {
    color: #fff!important;
    margin: 4px!important
}

.mo_saml_local_pricing_table {
    text-align: center;
    font-size: 15px!important;
    background-color: #fff
}

.mo_saml_premium_thumbnail {
    width: 350px;
    padding: 4px;
    margin-bottom: 10px;
    line-height: 1.42857143;
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 4px;
    -webkit-transition: border .2s ease-in-out;
    -o-transition: border .2s ease-in-out;
    transition: border .2s ease-in-out
}

.mo-fa-icon>tr>td>i.fa {
    color: #5b8a0f
}

.mo_align-center>tr>td {
    text-align: center!important
}

.mo_table-bordered,
.mo_table-bordered>tbody>tr>td {
    border: 1px solid #ddd
}

.mo_table-striped>tbody>tr:nth-of-type(odd) {
    background-color: #f9f9f9
}

.mo_table-bordered>thead>tr>th {
    vertical-align: top!important
}

.mo_plan-desc {
    font-size: 14px!important
}

.mo-display-logs {
    color: #3c763d;
    background-color: #dff0d8;
    padding: 2%;
    margin-bottom: 20px;
    text-align: center;
    border: 1px solid #aedb9a;
    font-size: 18pt
}

.mo-display-block {
    color: #050505;
    width: -moz-available;
    min-height: 300px!important;
    overflow: auto;
    display: inline-block;
    background-color: #f6f6f6;
    padding: 2%;
    margin-bottom: 20px;
    text-align: left;
    border: 1px solid #aedb9a;
    font-size: 12pt
}

.mo_divider {
    width: 5px;
    height: auto;
    display: inline-block
}

.tooltip {
    position: relative;
    display: inline-block;
    size: letter
}

.tooltip .tooltiptext {
    visibility: hidden;
    width: 120px;
    background-color: grey;
    color: #fff;
    text-align: center;
    padding: 5px 0;
    border-radius: 6px;
    font-size: 12px;
    position: absolute;
    z-index: 1;
    bottom: 125%;
    left: 50%;
    margin-left: -60px;
    font-size: small;
    opacity: 50;
    transition: opacity .3s
}

.tooltip .tooltiptext::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: #555 transparent transparent transparent
}

.tooltip:hover .tooltiptext {
    visibility: visible;
    opacity: 1
}

.mo_modal {
    display: none;
    overflow: hidden;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1050;
    -webkit-overflow-scrolling: touch;
    outline: 0
}

.mo_modal-content {
    position: relative;
    background-color: #fff;
    border: 1px solid #999;
    border: 1px solid rgba(0, 0, 0, .2);
    border-radius: 6px;
    -webkit-box-shadow: 0 3px 9px rgba(0, 0, 0, .5);
    box-shadow: 0 3px 9px rgba(0, 0, 0, .5);
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    outline: 0;
    margin-left: 20%;
    margin-right: 24%;
    margin-top: 6%
}

.mo_close {
    color: #aaa;
    float: right;
    font-size: 28px;
    font-weight: 700
}

.overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background: #000;
    opacity: .5;
    z-index: 0
}

.fade {
    opacity: 0;
    -webkit-transition: opacity .15s linear;
    -o-transition: opacity .15s linear;
    transition: opacity .15s linear
}

.fade.in {
    opacity: 1
}

.modal-header {
    padding: 15px;
    /* border-bottom: 1px solid #e5e5e5 */
}

.modal-header .close {
    margin-top: -2px
}

.modal-body {
    position: relative;
    padding: 15px;
    /* max-height: calc(90vh - 280px); */
    overflow-y: auto;
    overflow-x: hidden;
}

.modal-dialog {
    position: relative;
    width: auto;
    margin: 10px
}

.modal.fade .modal-dialog {
    -webkit-transform: translate(0, -25%);
    -ms-transform: translate(0, -25%);
    -o-transform: translate(0, -25%);
    transform: translate(0, -25%);
    -webkit-transition: -webkit-transform .3s ease-out;
    -o-transition: -o-transform .3s ease-out;
    transition: transform .3s ease-out
}

.modal.in .modal-dialog {
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    -o-transform: translate(0, 0);
    transform: translate(0, 0)
}

.modal-footer {
    /* padding: 15px; */
    text-align: center;
    /* border-top: 1px solid #e5e5e5; */
    /* margin-top: -10%; */
    background-color: #fff
}

.modal-footer .btn+.btn {
    margin-left: 5px;
    margin-bottom: 0
}

.modal-footer .btn-group .btn+.btn {
    margin-left: -1px
}

.modal-footer .btn-block+.btn-block {
    margin-left: 0
}

.close {
    float: right;
    font-size: 21px;
    font-weight: 700;
    line-height: 1;
    color: #000;
    text-shadow: 0 1px 0 #fff;
    opacity: .2
}

.close:focus,
.close:hover {
    color: #000;
    text-decoration: none;
    cursor: pointer;
    opacity: .5
}

button.close {
    padding: 0;
    cursor: pointer;
    background: 0 0;
    border: 0;
    -webkit-appearance: none
}

.mo-span-circle {
    display: inline-block;
    padding: 15px;
    line-height: 100%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    background-color: #000;
    color: #fff;
    text-align: center;
    font-size: 2em
}

.mo-saml-nav-tab-cstm {
    color: #1d2238;
    font-size: 1rem;
    font-weight: 500;
    padding: 0.9rem 1rem;
    cursor: pointer;
    transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.mo-saml-nav-tab-cstm:hover {
    background-color: #e5e7e9;
    color: #000;
}

.mo-saml-nav-tab-active {
    border-bottom: 3px solid #384e7e;
}

.mo-saml-nav-tab-active:hover {
    background: #d6e2f2;
    border-bottom: 3px solid rgb(4, 7, 42)
}

.mo_copy {
    border: 1px solid #ccc;
    padding: 8px;
    background-color: #fbfbfb;
    cursor: pointer
}

.mo_copy:active {
    background-color: #ccc
}

.copytooltip {
    position: relative;
    display: inline-block;
    size: letter
}

.copytooltip .copytooltiptext {
    visibility: hidden;
    width: 120px;
    background-color: grey;
    color: #fff;
    text-align: center;
    padding: 5px 0;
    border-radius: 6px;
    font-size: 12px;
    position: absolute;
    z-index: 1;
    bottom: 125%;
    left: 50%;
    margin-left: -60px;
    font-size: small;
    opacity: 50;
    transition: opacity .3s
}

.copytooltip .copytooltiptext::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: #555 transparent transparent transparent
}

.copytooltip:hover .copytooltiptext {
    visibility: visible;
    opacity: 1
}

.mo_demo_layout {
    margin-bottom: 10px;
    padding-left: 100px;
    padding-right: 100px;
    border: none
}

.idp-guides-btns {
    display: flex;
    justify-content: center;
    text-align: center;
    padding: .5em 0 .5em 0
}

.guide-btn {
    background-color: #fff;
    border: 1px solid #007cba;
    padding: .5em 0 .5em 1em;
    margin-right: 2em;
    color: #007cba;
    font-weight: 600;
    font-size: 13px;
    border-radius: 4px;
    box-shadow: 2px 2px 5px rgba(0, 0, 0, .25);
    width: 11em;
    letter-spacing: .4px;
    cursor: pointer
}

.idp-guides-logo.SimpleSAMLphp {
    width: 18px;
    height: 25px;
    margin-left: -9px;
    margin-right: 2px;
    float: left
}

.idp-guides-logo {
    height: 25px;
    width: 24px;
    margin-right: 2px;
    margin-left: -4px;
    float: left
}

.guide-btn:hover {
    background-color: #007cba;
    color: #fff
}

.modal {
    display: none;
    position: fixed;
    z-index: 3;
    padding-top: 100px;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: #000;
    background-color: rgba(0, 0, 0, .4);
    transition: all 1s
}

.modal-content {
    padding: 20px;
    width: 70%;
    border-radius: 20px;
    box-shadow: 5px 5px 5px rgba(0, 0, 0, .25);
    position: fixed;
    top: 50%;
    left: 55%;
    margin-right: -50%;
    transform: translate(-50%, -50%);
    height: 650px;
}

.modal-button {
    width: 15%;
    height: 50px;
    font-size: 20px!important
}

.editable {
    text-align: center;
    width: 1em;
    height: 1em
}
.sm {
    text-align: center;
    width: 2vw;
    height: 2vw;
    padding: 1vw
}
 /* input[type=radio]  {
    display: none
}  */
.mo_modal input[type=radio] {
    display: none;
}

.sm:hover {
    opacity: .6;
    cursor: pointer
}

.sm:active {
    opacity: .4;
    cursor: pointer
}

input[type=radio]:checked+label>.sm {
    border: 2px solid #21ecdc
}

@media (min-width:768px) {
    .grid_view {
        width: 33.33%;
        float: left
    }
}

@media screen and (max-width:1000px) {
    .grid_view {
        float: left;
        width: 100%
    }
}

@media screen and (max-width:1400px) {
    .grid_view {
        float: left;
        width: 50%
    }
}

@keyframes fadeInScale {
    0% {
        transform: scale(.9);
        opacity: 0
    }
    100% {
        transform: scale(1);
        opacity: 1
    }
}

.card {
    border: 0;
    margin: 10px;
    transition: all .3s ease-in-out;
    padding: 1.5rem 1rem;
    text-align: center;
    will-change: transform;
    border-radius: 8px;
    box-shadow: 0 20px 35px 0 rgba(0, 0, 0, .08);
    max-height: 100%;
    min-height: 260px
}

.card:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 0%;
    height: 5px;
    background-color: #3473b4;
    transition: .5s
}

.card:hover {
    cursor: default;
    transform: scale(1.05);
    -webkit-box-shadow: 0 20px 35px 0 rgba(0, 0, 0, .08);
    box-shadow: 0 20px 35px 0 rgba(0, 0, 0, .18)
}

.card:hover:after {
    width: 100%
}

.addon-img {
    float: right;
    width: 40px;
    height: 40px;
    align-self: center
}

.card .card-title {
    font-size: 1.3rem;
    font-weight: 600;
    text-align: left;
    padding-left: 10px
}

.addon-heading {
    float: left;
    width: 90%;
    text-align: center
}

.addon-header {
    display: flex;
    line-height: 1.2;
    text-align: center
}

.card-text {
    padding: 0 5px;
    min-height: 100px
}

.btn-addon {
    text-transform: uppercase;
    font-size: 10px;
    font-weight: 700;
    color: #fff;
    border: 0;
    border-radius: 3px;
    padding: .65rem 1.15rem;
    letter-spacing: 1px
}

.btn-addon-grad {
    background-color: #3473b4;
    transition: background .3s ease-in-out
}

.btn-addon-grad:hover {
    color: #fff;
    cursor: pointer;
    background-color: #3473b4cc
}

.demo-request-div {
    background: #f2f5fb;
    border-radius: 2px;
    margin-right: 20px;
    margin-bottom: 10px;
    padding-top: 10px;
    padding-bottom: 10px;
    border-style: solid;
    border-color: #2f6062;
    padding-left: 10px
}

.call-setup-div {
    background: #d5e2ff;
    border-radius: 5px;
    margin-top: 10px;
    margin-right: 10px;
    padding: 10px;
}

#call_setup_dets {
    display: none;
}

.mo-saml-select-timezone {
    width: 95%;
}

.call-setup-heading {
    margin-top: 0;
    margin-left: 5px
}

.call-setup-label {
    padding-left: 5px;
    font-size: 15px
}

.call-setup-details {
    margin-left: 5px;
    margin-top: 5px
}

.call-setup-datetime {
    width: 50%;
    float: left;
    position: relative;
    height: auto;
    min-height: 100%!important
}

.call-setup-textbox {
    width: 90%!important
}

.call-setup-notice {
    font-size: 1rem;
}

.saml-debug-button {
    min-width: 200px;
    width: auto;
    margin: 5px!important
}

a {
    outline: 0!important
}

a,
a:active,
a:hover,
a:visited {
    text-decoration: none!important
}

.lic-body {
    width: 98%
}

#demo,
#demo1 {
    margin-right: 1.4em;
    margin-left: 0
}

td.text-left {
    padding: 10px 15px
}

.nav-menu {
    display: flex;
    position: sticky;
    width: 102%;
    top: 32px;
    align-items: center;
    background: #2f4f4f;
    justify-content: space-evenly;
    z-index: 1;
    box-shadow: 2px 11px 10px #f7f7f7;
    height: 3.1em
}

.goto-opt {
    padding: 5px 0;
    font-size: 1.6em!important
}

.goto-opt a {
    color: #fff;
    font-size: 25px;
    font-weight: 300
}

.goto-opt a:active,
.goto-opt a:focus {
    color: #fff;
    box-shadow: none!important
}

.goto-opt a:hover {
    color: #fff
}

.goto-active {
    border-bottom: 2px solid #fff;
    transition: 2s;
    color: #fff
}

.plan-head-saml {
    color: #000;
    text-align: center;
    font-weight: 350;
    margin-bottom: .1em;
    margin-top: .7em;
    width: 100%
}

.faq-container {
    max-width: 600px;
    margin: 0 auto
}

.faq {
    background-color: transparent;
    border: 1px solid #9fa4a8;
    border-radius: 10px;
    padding: 23px 22px 10px;
    position: relative;
    overflow: hidden;
    transition: .3s ease
}

.faq.active {
    background-color: #fff;
    box-shadow: 0 3px 6px rgba(0, 0, 0, .1), 0 3px 6px rgba(0, 0, 0, .1)
}

.faq-title {
    margin: 1px 35px 0 0;
    color: #000;
    margin-bottom: 1.2em;
    font-weight: 400;
    font-size: 1.2em;
    text-align: left
}

.faq-text {
    display: none;
    border-top: 1px solid #f4f4f4;
    text-align: left;
    font-size: 1rem
}

.faq.active .faq-text {
    display: block
}

.faq-toggle {
    background-color: transparent;
    color: #000;
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    padding: 0;
    position: absolute;
    top: 16px;
    right: 20px;
    height: 40px;
    width: 30px;
    border: none
}

.faq-toggle .fa-times {
    display: none
}

.faq.active .faq-toggle .fa-times {
    display: block
}

.faq.active .faq-toggle .fa-chevron-down {
    display: none
}

.works-step div {
    color: #e67e22;
    border: 2px solid #e67e22;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    text-align: center;
    float: left;
    font-size: 20px;
    margin-right: 25px;
    margin-bottom: 27px
}

.plugin-banner-text-saml {
    color: #1f3668;
    line-height: 2
}

.text-color {
    color: #fe7e00!important
}

.reg-plans-saml {
    background: linear-gradient(45deg, #ffeabc, #ffe194);
    border-radius: 9px;
    height: 35.4em
}

.common-rot {
    transition: .3s
}

.single-site {
    display: flex;
    justify-content: center;
    margin-left: 3px
}

.single-site-rot {
    transform: rotateY(0)
}

.multi-site-rot {
    transform: rotateY(180deg)
}

.reg-plans-saml:hover {
    background: linear-gradient(125deg, #ffeabc, #ffe194)
}

.incl-plan-saml {
    background: linear-gradient(145deg, #c1f4ff, #dcdcdc);
    border-radius: 9px;
    padding: .1em 1em 1.5em;
    height: 35.4em
}

.incl-plan-saml:hover {
    background: linear-gradient(254deg, #7ee8ff, #dcdcdc)
}

.display-1 {
    font-size: 2.5em;
    font-weight: 200
}

.header-h3 {
    font-size: 1.5em;
    margin-top: 20px;
    margin-bottom: -20px;
    color: #585858
}

.header-h4 {
    color: #000;
    font-weight: 500;
    font-size: 1.2em
}

.price-list {
    border-top: 1px solid #fff;
    border-bottom: 1px solid #fff;
    font-size: 1.3em;
    background: #ffecbb;
    border-radius: 10px;
    height: 280px
}

.price-list-incl {
    background: linear-gradient(145deg, #e2faff, #e1e1e1)
}

.upg-btn {
    display: inline-block
}

.license-btn-saml {
    color: #fff!important;
    font-size: 1em;
    padding: .5em 2rem;
    border-radius: 6px;
    background: #2f4f4f;
    cursor: pointer;
    margin-top: 10px;
    width: 160px;
    height: 43px
}

.border-rad-saml {
    border-radius: 50px;
    padding: .7em .1rem;
    margin-right: 15px
}

.license-btn-saml:hover {
    background: linear-gradient(15deg, #2f4f4f, #669a9a)
}

.box-shadow-saml {
    border-bottom: 1px solid #ddd!important;
    margin-bottom: 0!important;
    padding: 10px 15px
}

.feat-head-saml {
    text-align: center;
    padding: 12px;
    font-size: 25px;
    font-weight: 400
}

.choose-plan-saml {
    display: block;
    font-weight: 350;
    color: #000;
    padding: 10px 0 0 15px
}

.clk-icn {
    border: .2px solid rgb(0 0 0);
    font-weight: 700;
    margin-top: 2em;
    padding: .5em 2em;
    color: #000!important
}

.saml-pills {
    background: #e1e1e1;
    list-style: none;
    display: inline-flex;
    padding-top: 1em;
    padding-left: .5em;
    padding-right: .5em;
    padding-bottom: .6em;
    border-radius: 40px
}

.price-tag {
    width: 100px;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 47px;
    border-radius: 8px 8px 0 8px;
    background: #f4c346;
    z-index: 99;
    position: absolute;
    top: -24px;
    left: 70%
}

.price-tag-mult {
    left: 75.7%
}

.product::after {
    content: '';
    position: absolute;
    border-right: 25px solid transparent;
    border-top: 10px solid #e7b32e;
    left: 93%;
    z-index: -1;
    top: 22px
}

.price {
    margin-top: 10px;
    color: #fff;
    font-size: 16px
}

.sticky-menu-saml {
    position: sticky;
    top: 5.2em;
    padding-top: 3em;
    background-color: #fff;
    z-index: 0
}

.hover-saml {
    border-right: 5px solid #fcf0d3;
    border-radius: 10px;
    height: 35.4em
}

.hover-saml:hover {
    background: linear-gradient(45deg, #ffebbf, #fdefcc);
    height: 35.4em;
    border-radius: 9px
}

.tabs {
    margin-bottom: 1em;
    margin-top: 1.5em
}

.tabs a.active {
    background: #2f4f4f;
    cursor: default;
    padding: 12px 3em;
    color: #fff;
    transition: .5s;
    pointer-events: none
}

.tabs a {
    cursor: pointer;
    padding: 12px 3em;
    font-size: 17px;
    text-align: center;
    font-weight: 600;
    border-radius: 30px;
    color: #000
}

.saml-text {
    text-align: left;
    font-size: 1rem
}

.faq-toggle:focus {
    outline: 0
}

.tooltip-saml {
    position: relative
}

.tooltip-saml .tooltiptext {
    display: none;
    width: 250px;
    background-color: #000000d4;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 1em 2em;
    left: 7.7em;
    bottom: -12.8em;
    position: absolute;
    z-index: 1
}

.tooltip-saml .tooltiptext::after {
    content: " ";
    position: absolute;
    top: 50%;
    right: 100%;
    margin-top: -28px;
    border-width: 5px;
    border-style: solid;
    border-color: transparent #000 transparent transparent
}

.tooltip-saml:hover {
    cursor: pointer
}

.tooltip-saml:hover .tooltiptext {
    display: block
}

.plan-box {
    height: 18em;
    background-color: #cab9c81a;
    border-radius: 10px;
    margin: 0 10px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, .2);
    transition: .3s
}

.plan-box-up {
    padding: 20px;
    border-bottom: 4px solid #fff
}

.plan-box p {
    padding: 20px;
    font-size: 1rem;
    line-height: 1.5
}

.tab-des {
    display: flex;
    padding: 0;
    max-width: 1200px;
    margin: 0 auto 0;
    list-style: none;
    justify-content: center
}

.tab-link {
    display: block;
    padding: 10px 15px;
    color: #2f4f4f;
    cursor: pointer;
    overflow: hidden
}

.active-tab {
    border-bottom: 4px solid #2f4f4f!important;
    background-color: #08705c14
}

.integration-section {
    background: #f4f4f4;
    padding: 0 2em 1em;
    border-radius: 5px
}

@media screen and (min-width:1688px) {
    .product::after {
        display: none
    }
}

@media screen and (max-width:1519px) {
    .price-list {
        height: 335px
    }
    .price-list-multi {
        height: 269px
    }
    .price-tag {
        left: 61%
    }
    .price-tag-mult {
        left: 74%
    }
    .product::after {
        display: none
    }
    .hover-saml,
    .hover-saml:hover,
    .incl-plan-saml,
    .reg-plans-saml {
        height: 37.6em
    }
    .multi-site-height,
    .multi-site-height:hover {
        height: 33.3em
    }
}

@media screen and (max-width:1380px) {
    .price-list {
        height: 405px
    }
    .price-tag {
        left: 56%
    }
    .price-list-multi {
        height: 296px
    }
    .price-tag-mult {
        left: 69%
    }
    .product::after {
        left: 38px
    }
    .hover-saml,
    .hover-saml:hover,
    .incl-plan-saml,
    .reg-plans-saml {
        height: 40.9em
    }
    .multi-site-height,
    .multi-site-height:hover {
        height: 34.3em
    }
}

.cstm-iframe {
    padding: 1rem;
    border: 1px solid #dcdcde;
    background-color: #fff
}

.cstm-addon-row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    line-height: 1.2;
    margin-right: -15px;
    margin-left: -15px;
    padding: 1rem 1rem 0;
}

.mt-2 {
    margin-top: .5rem!important
}

.cstm-h4 {
    font-size: 1.5rem;
}

.cstm-h5 {
    font-size: 1.25rem;
    margin: 0.5rem 0 1rem;
}

.cstm-input {
    box-shadow: 1px 1px 6px #e3e1e1!important;
    border: 1px solid #d5d5d5!important;
    padding: 0rem 1rem!important;
}

label {
    font-size: 13px;
}

.form-head:after {
    content: '';
    display: block;
    height: 5px;
    background: #1f3668;
    /* margin-top: 24px; */
    margin-top: 9px;
    border-radius: 30px;
}

.form-head-bar:after {
    width: 50px;
}

.form-sep:after {
    width: 100%;
    background: #6c757d;
    height: 2.3px;
    margin-top: -13px;
}

.prem-info {
    padding: 1rem;
    background: #f4f4f4;
    border: 4px solid #d5e2ff;
    border-radius: 5px;
}

.entity-info-text,
.prem-info-text,
.provide-metadata-text,
.attr-info-text,
.anonymous-text,
.nameid-prem-text,
.role-prem-text,
.role-admin-prem-text {
    display: none;
    width: 442px;
    background-color: #000000d4;
    color: #fff;
    font-size: 1.1rem;
    text-align: center;
    border-radius: 6px;
    padding: 0.6em 0.5em;
    left: 19em;
    bottom: -0.2em;
    position: absolute;
    z-index: 1;
}

.prem-info-text {
    left: -25.5em;
    bottom: -2em;
}


/* .entity-info-text {
    bottom: -0.9em;
} */

.mo-saml-provide-metadata-txt {
    left: 13.4em;
    bottom: 0;
}

.mo-saml-redir-opts-txt {
    left: 26em;
    bottom: 0;
}

.provide-metadata-text {
    left: 18.8em;
    bottom: 55.8em;
}

.attr-info-text {
    left: 14.1em;
    bottom: 0.2em;
}

.role-map-info-text {
    left: 11.1em;
    bottom: 0.2em;
}

.anonymous-text {
    left: -25.3em;
    bottom: -2.7em;
}

.nameid-prem-text {
    bottom: -4.4em;
    left: -25.2em;
}

.auto-redir-text {
    bottom: -4.3em;
}

.auto-redir-wp-text {
    bottom: -4.3em;
}

.shortcode-text {
    bottom: -2.7em;
}

.role-prem-text {
    bottom: -4.7em;
    left: -25.3em;
}

.role-admin-prem-text {
    bottom: -4.6em;
    left: -25.3em;
}

.sso-btn-prem-text {
    bottom: -4.3em;
    left: -25.3em;
}

.mo-saml-sso-log-txt {
    bottom: 0.1em;
    left: 25.9em;
}

.mo-saml-sso-widget-txt {
    bottom: 0.1em;
    left: 16.9em;
}

.mo-saml-redir-site-txt {
    bottom: 0.1em;
    left: 25.1em;
}

.mo-saml-redir-wp-log-txt {
    bottom: 0.1em;
    left: 33.4em;
}

.mo-saml-sso-shortcode-txt {
    bottom: 0.1em;
    left: 18.9em;
}

.prem-icn {
    position: absolute;
    z-index: 10;
    display: inline-flex;
    right: 45px;
    filter: drop-shadow(#f6f6f6 9px 4px 1px);
}

.auto-redir-prem-img {
    right: 54px;
}

.sso-btn-prem-img {
    right: 53px;
}

.entity-info-text::after,
.prem-info-text::after,
.provide-metadata-text::after,
.attr-info-text::after,
.anonymous-text::after,
.nameid-prem-text::after,
.role-prem-text::after,
.role-admin-prem-text::after,
.mo-saml-error-tip::after {
    content: " ";
    position: absolute;
    top: 84%;
    right: 100%;
    margin-top: -28px;
    border-width: 5px;
    border-style: solid;
    border-color: transparent black transparent transparent;
}

.prem-info-text::after,
.anonymous-text::after,
.nameid-prem-text::after,
.role-prem-text::after,
.sso-btn-prem-text::after,
.role-admin-prem-text::after {
    border-color: transparent transparent transparent #000000fa;
    left: 100%;
}

.mo-saml-error-tip {
    display: none;
    align-items: center;
    background: #fff;
    border: 1px solid #767676;
    border-radius: 4px;
    padding: .2rem .5rem;
    position: absolute;
    left: 56.3%;
    top: 6.9em;
    color: #414141;
}

.mo-saml-error-tip::after {
    top: 1.1em;
    right: 51.1%;
    border-color: #ff7a7a00 #0000 #000000c7 transparent;
}

@media screen and (width:1228.80px) {
    .mo-saml-error-tip {
        top: 6.9em;
        width: 46%;
    }
    .mo-saml-error-tip::after {
        top: 1.1em;
    }
}

.role-prem-text::after,
.sso-btn-prem-text::after,
.auto-redir-text::after,
.auto-redir-wp-text::after,
.nameid-prem-text::after,
.role-admin-prem-text::after {
    top: 49%;
}

.entity-info:hover,
.prem-info:hover {
    cursor: pointer;
}

.entity-info:hover .entity-info-text,
.prem-info:hover .prem-info-text,
.provide-metadata-info:hover .provide-metadata-text,
.attr-info:hover .attr-info-text,
.prem-info:hover .anonymous-text,
.prem-info:hover .sso-btn-prem-text,
.prem-info:hover .role-prem-text,
.prem-info:hover .role-admin-prem-text,
.prem-info:hover .nameid-prem-text {
    display: block!important;
}

.mo-saml-switch[type=checkbox] {
    height: 0;
    width: 0;
    visibility: hidden;
}

.mo-saml-switch-label {
    cursor: pointer;
    margin-top: -1.5rem;
    text-indent: -9999px;
    width: 56px;
    height: 30px;
    background: #bfbdbd;
    display: block;
    border-radius: 100px;
    position: relative;
}

.mo-saml-switch-label:after {
    content: '';
    position: absolute;
    top: 5px;
    left: 5px;
    width: 20px;
    height: 20px;
    background: #fff;
    border-radius: 90px;
    transition: 0.3s;
}

.mo-saml-switch:checked+.mo-saml-switch-label {
    background: #163d77;
}

.mo-saml-switch:checked+.mo-saml-switch-label:after {
    left: calc(100% - 5px);
    transform: translateX(-100%);
}

.mo-saml-switch-label:active:after {
    width: 40px;
}

.btn-cstm {
    background: linear-gradient(0deg, rgb(14 42 71) 0%, rgb(26 69 138) 100%)!important;
    border: none;
    margin-right: 10px;
    font-size: 1.1rem;
    padding: 0.3rem 1.5rem;
    color: #fff!important;
    cursor: pointer;
}

.w-176 {
    width: 179px;
}

.w-372 {
    width: 375px;
}

.mo-saml-alredy-have-btn:hover {
    color: #76bdd0!important;
    cursor: pointer;
}

.btn-cstm:hover {
    background-color: #1f3668c4!important;
}

.shadow-cstm {
    box-shadow: 0px 2px 5px rgb(0 0 0 / 12%);
}

.bg-main-cstm {
    background: #f4f4f4;
}

.mo-saml-margin-left {
    margin-left: -20px;
}

.bg-cstm {
    background: #d5e2ff;
}

.contact-us-cstm {
    bottom: 4%;
    position: fixed;
    right: 1%;
    box-sizing: border-box;
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
    z-index: 10;
    height: 58px;
    width: 209px;
    background-color: #1f3668;
    cursor: pointer;
    border-radius: 50px;
    box-shadow: 4px 3px 6px 0px #272727d9;
}

.mo-saml-scroll-cstm {
    overflow-y: auto;
    height: 236px;
}

.logo-saml-cstm {
    padding: 1em 0;
    border-radius: 15px;
    background: #fff;
    max-width: 90px;
    margin-right: 7px;
    margin-top: 1rem;
    height: 83px;
    box-shadow: inset 2px 2px 2px 0 rgb(255 255 255 / 50%), 7px 7px 20px 0 rgb(0 0 0 / 10%), 4px 4px 5px 0 rgb(0 0 0 / 10%);
    cursor: pointer;
}

.logo-saml-cstm h6 {
    font-size: 0.8rem;
    word-break: break-all;
}

.logo-saml-cstm:hover {
    opacity: 0.7;
    transition: 0.2s;
}

.mo-saml-scroll-cstm::-webkit-scrollbar-track {
    box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
    border-radius: 10px;
    background-color: #F5F5F5;
}

.mo-saml-scroll-cstm::-webkit-scrollbar {
    width: 12px;
    background-color: #F5F5F5;
}

.mo-saml-scroll-cstm::-webkit-scrollbar-thumb {
    border-radius: 10px;
    box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);
    background-color: #555;
}

.idp-search-box {
    background: transparent!important;
    border: none!important;
    border-bottom: 2px solid #FFFFFF!important;
    color: #FFFFFF;
    padding: 10px 54px!important;
    font-size: 18px;
    height: 2.64285714em;
    width: 100%;
    /* box-shadow: 4px 4px 6px 0 rgb(255 255 255 / 50%), -4px -4px 6px 0 rgb(116 125 136 / 8%), inset -4px -4px 6px 0 rgb(255 255 255 / 20%), inset 4px 4px 6px 0 rgb(0 0 0 / 3%)!important; */
}

.idp-search-box:focus {
    box-shadow: none!important;
}

.idp-search-glass {
    top: 13px;
    left: 35px;
    position: absolute;
}

.btn-prem {
    color: #fff;
    padding: 10px 25px;
    cursor: pointer;
    border-radius: 50px;
    transition: all 0.3s ease;
    position: relative;
    display: inline-block;
    box-shadow: inset 2px 2px 2px 0px rgba(255, 255, 255, .5), 7px 7px 20px 0px rgba(0, 0, 0, .1), 4px 4px 5px 0px rgba(0, 0, 0, .1);
}

.prem-btn-cstm {
    border: none;
    background: #ffa500;
    color: #fff;
    overflow: hidden;
}

.prem-btn-cstm:before {
    position: absolute;
    content: '';
    display: inline-block;
    top: -180px;
    left: 0;
    width: 15px;
    height: 100%;
    background-color: #fff;
    animation: shiny-btn1 3s ease-in-out infinite;
}

.prem-btn-cstm:hover {
    opacity: .7;
}

.faq-btn-cstm {
    background-color: #89d8d3;
    background-image: linear-gradient(315deg, #89d8d3 0%, #03c8a8 74%);
    border: none;
    z-index: 1;
}

.faq-btn-cstm:after {
    position: absolute;
    content: "";
    width: 100%;
    height: 0;
    bottom: 0;
    left: 0;
    z-index: -1;
    border-radius: 5px;
    background-color: #4dccc6;
    background-image: linear-gradient(315deg, #4dccc6 0%, #96e4df 74%);
    box-shadow: -7px -7px 20px 0px #fff9, -4px -4px 5px 0px #fff9, 7px 7px 20px 0px #0002, 4px 4px 5px 0px #0001;
    transition: all 0.3s ease;
}

.faq-btn-cstm:hover {
    color: #fff;
}

.faq-btn-cstm:hover:after {
    top: 0;
    height: 100%;
}

.faq-btn-cstm:active {
    top: 2px;
}

@keyframes shiny-btn1 {
    0% {
        -webkit-transform: scale(0) rotate(60deg);
        opacity: 0;
    }
    80% {
        -webkit-transform: scale(0) rotate(60deg);
        opacity: 0.5;
    }
    81% {
        -webkit-transform: scale(4) rotate(60deg);
        opacity: 1;
    }
    100% {
        -webkit-transform: scale(30) rotate(60deg);
        opacity: 0;
    }
}

.pop-up-btns {
    line-height: 10px;
    box-shadow: inset 2px 2px 2px 0px rgb(255 255 255 / 50%), 7px 7px 20px 0px rgb(0 0 0 / 10%), 4px 4px 5px 0px rgb(0 0 0 / 10%);
    border-radius: 80px;
    color: #fff;
    background-color: #ffa500;
}

.pop-up-btns:hover {
    opacity: .7;
    color: #000;
}

.contact-form-cstm {
    width: 136%;
}

.contact-form-head {
    padding: 1rem;
    border-radius: 8px;
    font-family: 'Gotham';
    color: #4a4a4a;
    background: url('../../images/contact-form-bg.svg');
    background-size: cover;
}

.contact-form-head p {
    line-height: 1.8;
}

.mo-saml-card-glass {
    background: url(../../images/dotted-bg-mo-saml.png) right center / contain no-repeat, linear-gradient(153.07deg, rgb(213 226 255) -2.47%, rgb(243 247 255) 102.78%);
    border-radius: 10px;
    padding: 2em;
    width: 136%;
}

.mo-saml-ads-text {
    background: linear-gradient(135deg, rgb(255 255 255), rgba(255, 255, 255, 0.67));
    padding: 1.6rem 1.5rem 2.3em;
    border-radius: 30px;
    backdrop-filter: blur(2.5em);
}

.mo-saml-why-reg {
    font-family: 'Gotham';
    font-size: 0.9rem;
}

.reg-form {
    background: linear-gradient(153.07deg, rgb(213 226 255) -2.47%, rgb(249 249 249) 102.78%);
}

.reg-form input {
    border: 1px solid #2b4d7f;
    background: 0 0;
    border-radius: 5px;
}

.reg-form input:focus {
    box-shadow: none;
}

.mo-saml-already-reg-field,
#mo_saml_reg_login_btn,
#mo_saml_reg_back_btn,
.mo-saml-why-login-txt {
    display: none;
}

.contact-form-body input,
.contact-form-body textarea {
    background-color: #f3f7ff;
    border: 1px solid #7090d5;
    padding: .2rem 1rem;
    width: 100%;
}

.contact-form-body input:focus,
.contact-form-body textarea:focus {
    box-shadow: none;
}

.mo-saml-call-setup {
    background: #f7f7f7;
    border-radius: 20px;
    font-family: 'Gotham';
}

.bg-light {
    background-color: #d7d7d7!important;
}

.cursor-disabled:hover {
    cursor: not-allowed;
}

html {
    scroll-behavior: smooth;
}


/*SP Switch tab css */

.mo-saml-tab-content,
.mo-saml-tab-content1 {
    display: none;
}

#mo-saml-idp-manual-tab,
#mo-saml-provide-metadata {
    display: block;
}

.switch-tab-sp {
    background: #f7f7f7;
    padding: 0.5rem 1rem 0;
    /* display: flex; */
    border-radius: 10px;
    align-items: baseline;
    justify-content: center;
}

.mo-saml-current {
    border-bottom: 3px solid #042160;
    background: #f0f0f1;
    border-radius: 2px;
}

.switch-tab-sp a:hover {
    background-color: #e5e7e9;
}

.switch-tab-sp a {
    color: #5d5d5d;
    font-weight: 500;
}

.switch-tab-sp a:focus {
    box-shadow: none;
}


/* .or {
    filter: drop-shadow(0 0px 1px);
} */

a:focus {
    box-shadow: none;
}

.meta-data-table {
    border: 1px solid #ddd;
    margin: 1rem auto;
}

.meta-data-table td {
    padding: 0.5rem 0.7rem;
}

.meta-data-table tr:nth-child(even) {
    background-color: #ebf1ff;
}

#cstm-idp-section,
#sp-meta-tab-form,
#attr-role-tab-form,
#account-info-form,
#redir-sso-tab-form,
#demo-tab-form,
#addon-tab-form,
#headless-tab-form,
#headless-setting-tab-form {
    transform: translate(-35px);
}

.mo-saml-opt-add-ons {
    margin-top: .6rem;
}

.mo-saml-padding-block {
    padding: 1.4rem 0;
}

.mo-saml-btn-size {
    width: 50px;
    background: #f8f9fa!important;
    margin-left: .5rem;
}


/* add-ons css */

.mo-saml-addons-logo {
    max-width: 17%;
    height: auto;
    position: absolute;
    right: 15px;
    top: 80%;
    /* z-index: 99; */
}

.mo-saml-addons-head {
    margin: 1.1em;
    font-size: 1.5rem;
    color: #5b5b5b;
    height: 50px;
}

.mo-saml-add-ons-cards {
    font-family: 'Gotham';
    width: 31.13%;
    float: left;
    height: 336px;
    box-shadow: inset 2px 2px 2px 0px rgb(255 255 255 / 50%), 7px 7px 20px 0px rgb(0 0 0 / 10%), 4px 4px 5px 0px rgb(0 0 0 / 10%);
    display: block;
    background-size: cover;
    border-radius: 15px;
    background: #fff;
    position: relative;
    overflow: hidden;
    margin-right: 0.6rem;
    /* margin: 4rem auto; */
}

.mo-saml-addons-readmore {
    position: absolute;
    top: 86%;
    left: 3.8%;
    color: #0a0a0a;
    font-size: 1.1rem;
    z-index: 8;
    transition: all 0.6s ease;
    opacity: 0.8;
}

.mo-saml-addons-readmore:hover {
    opacity: 1;
    color: #000;
}

.mo-saml-add-ons-tri {
    border-top: 44px solid transparent;
    border-bottom: 150px solid transparent;
    border-right: 288px solid #f4f4f400;
    opacity: 0.4;
    position: absolute;
    display: block;
    top: 0;
    right: -40%;
    /* transition: all 0.3s ease-in-out; */
}

.mo-saml-add-ons-tri:before {
    border-top: 254px solid transparent;
    border-bottom: 136px solid transparent;
    border-right: 206px solid #e6eefd;
    position: absolute;
    content: "";
    display: block;
    top: -198px;
    right: -312px;
    z-index: -18;
}

.mo-saml-add-ons-rect {
    width: 475px;
    height: 200px;
    /* background: #fff; */
    /* display: block; */
    position: absolute;
    top: 75%;
    left: -78%;
    transform: rotate(30deg);
    z-index: 5;
    filter: blur(1px);
    opacity: 0.9;
    transition: all 0.3s ease-in-out;
}

.mo-saml-add-ons-rect:before {
    content: "";
    display: block;
    height: 100%;
    background: #d5e2ff;
    z-index: 2;
    transition: all 0.3s ease-in-out;
}

code {
    line-height: 1.9;
}

.mo-saml-error-box {
    border: 3px solid #ff0000;
}

/**
 * license plan css
 */
.hsso-lic-head {
    background: #133664!important;
    color: #fff;
}
.p-3 {
    padding: 1rem!important
}
.p-2 {
    padding: .5rem!important
}
.bg-white {
    background-color: #fff!important
}
.hsso-license-plan tr:nth-child(odd) {
    background-color: #e9f0ff;
}
.rotate-45 {
    transform: rotate(45deg);
}
.pt-3,
.py-3 {
    padding-top: 1rem!important;
    padding-bottom: 1rem!important;
}
/* .btn-cstm:hover {
    text-decoration: none;
    opacity: .9;
    color: #fff;
} */