* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

:root {
    --tw-ring-offset-color: #fff;
    --tw-ring-color: rgb(59 130 246 / .5);
    --tw-ring-offset-shadow: 0 0 #0000;
    --tw-ring-shadow: 0 0 #0000;
    --tw-shadow: 0 0 #0000;
    --tw-shadow-colored: 0 0 #0000;
    --tw-text-opacity: 1;
    --tw-ring-offset-width: 0px;
    --tw-border-spacing-x: 0;
    --tw-border-spacing-y: 0;
    --tw-translate-x: 0;
    --tw-translate-y: 0;
    --tw-rotate: 0;
    --tw-skew-x: 0;
    --tw-skew-y: 0;
    --tw-scale-x: 1;
    --tw-scale-y: 1;

    --tw-scroll-snap-strictness: proximity;


}

body, html {
    font-family: "Lexend", sans-serif;
    font-optical-sizing: auto;
    font-style: normal;
    font-display: swap;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}


.antialiased {
    --tw-bg-opacity: 1;
    background: rgb(37 99 235 / var(--tw-bg-opacity));
    padding: 20px 10px 100px 10px;
    position: relative;
}


.container_wp {
    background: linear-gradient(106.89deg, rgba(192, 132, 252, 0.11) 15.73%, rgba(14, 165, 233, 0.41) 15.74%, rgba(232, 121, 249, 0.26) 56.49%, rgba(79, 70, 229, 0.4) 115.91%);
    filter: blur(118px);
    position: absolute;
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    width: 100%;
}

.integration h2 {
    font-size: 54px;
    line-height: 1;
    font-weight: 500;
    letter-spacing: -.025em;
    color: #fff;
}

.integration {
    text-align: center;
    padding: 100px 0px 100px 0px;
    position: relative;
}


.body p{
    color: #6b7280 !important;
    margin-bottom: 0 !important;
}



.integration p {
    font-size: 12px;
    font-family: "Inter", sans-serif;
    font-weight: 300;
    color: #fff;
    margin-bottom: 0 !important;
}


.body p br{
    display: none;
}



.suggestion-item:hover .body p{
    color: #fff !important;
}

.search-container {
    position: relative;
    width: 100%;
    max-width: 700px;
    margin: 50px auto 0px auto;
}

#search {
    width: 100%;
    padding: 18px 30px 18px 50px;
    border-radius: 100px;
    border-color: #6b7280;
    border: none;
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;
    transition-timing-function: cubic-bezier(.4, 0, .2, 1);
    transition-duration: .15s;
    --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / .05);
    --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
    outline: none;
    background-color: #fff3;
    --tw-text-opacity: 1;
    color: rgb(255 255 255 / var(--tw-text-opacity));
    font-size: 16px;
    font-weight: 300;
}

.svg_search {
    position: relative;
}

.svg_search svg {
    position: absolute;
    width: 20px;
    height: 20px;
    top: 50%;
    transform: translateY(-50%);
    left: 20px;
    color: #fff;
}

.suggestions {
    position: absolute;
    top: 122%;
    left: 0;
    right: 0;
    border-radius: 4px;
    background-color: white;
    z-index: 10;
    display: none;
    --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / .1), 0 1px 2px -1px rgb(0 0 0 / .1);
    --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
    /* Hidden by default */
    height: 450px;
    overflow-y: auto;
}


.suggestions::before {
    position: absolute;
    content: '';
    height: 13px;
    left: 40px;
    background-color: #fff;
    top: -7px;
    width: 13px;
    --tw-rotate: 45deg;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.suggestion-item {
    padding: 10px 20px;
    cursor: pointer;
    line-height: 1.25rem;
    font-size: 14px;
    font-family: "Inter", sans-serif;
    font-weight: 400;
    margin-bottom: 0;
    color: rgb(51 65 85 / var(--tw-text-opacity));
    text-align: left;
    background-color: #fff;
    margin: 8px 0px;
}

.suggestion-item:hover {
    background-color: rgb(37 99 235 / var(--tw-bg-opacity));
    color: #fff;
}



#search::placeholder {
    --tw-text-opacity: 1;
    color: rgb(255 255 255 / var(--tw-text-opacity));

}

#search::-ms-input-placeholder {
    --tw-text-opacity: 1;
    color: rgb(255 255 255 / var(--tw-text-opacity));
}

.Knowladge_grid {
    border-radius: 8px;
    --tw-shadow-color: rgb(59 130 246 / .5);
    --tw-shadow: var(--tw-shadow-colored);
    background-color: #fff;
    padding: 0px 20px;
    max-width: 1240px;
    margin: auto;
    --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.Knowladge_grid:hover{
    --tw-shadow-color: rgba(59, 131, 246, 0.74);
    --tw-shadow: var(--tw-shadow-colored);
    background-color: #fff;
    padding: 0px 20px;
    max-width: 1240px;
    margin: auto;
    --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}


.Knowladge_grid .row .col-md-4 {
    border-right: 1px solid #e5e7eb;
    cursor: pointer;
    padding-bottom: 25px;
    padding-top: 25px;
}

.Knowladge_grid .row .col-md-4:last-child {
    border-right: none;
}

.quick-links-title {
    position: absolute;
    left: 0;
    right: 0;
    margin: 0px 50px;
}


.svg_1_box {
    --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
    --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color);
    box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
    --tw-bg-opacity: 1;
    background-color: rgb(239 246 255 / var(--tw-bg-opacity));
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
}


.svg_1_box svg {
    width: 30px;
    height: 30px;
    --tw-text-opacity: 1;
    color: rgb(29 78 216 / var(--tw-text-opacity));
}

.btn_div {
    text-align: right;
}

.btn_div button {
    border: none;
    background-color: transparent;
    color: #6b7280a6;
}

.Knowladge_grid .row {
    align-items: center;
}

.base_para {
    margin: 25px 0px 0px 0px;
}

.base_para h3 {
    font-size: 18px;
    line-height: 1.25rem;
    font-weight: 500;
    color: rgb(100 116 139 / var(--tw-text-opacity));
}

.base_para p {
    --tw-text-opacity: 1;
    color: rgb(100 116 139 / var(--tw-text-opacity));
    line-height: 1.25rem;
    font-family: "Inter", sans-serif;
    font-weight: 300;
    font-size: 14px;
}




@media screen and (max-width: 640px) {
    .quick-links-title {
        margin: 0px 20px;
    }
}

@media screen and (max-width: 568px) {
    .integration h2 {
        font-size: 45px;
    }
}


.Topics_Browse {
    padding: 230px 10px 80px 10px;
}

.cont_sect {
    text-align: center;
}

.cont_sect h3 {
    letter-spacing: -.025em;
    color: rgb(15 23 42 / var(--tw-text-opacity));
    line-height: 2.5rem;
    font-size: 36px;
    font-weight: 500;
}

.cont_sect p {
    color: rgb(51 65 85 / var(--tw-text-opacity));
    letter-spacing: -.025em;
    font-size: 18px;
    margin-top: 10px;
    font-family: "Inter", sans-serif;
    font-weight: 400;
    line-height: 1.75rem;
}

.bg_divide {
    margin: 60px 10px;
}

.bg_divide ol, ul, menu {
    list-style: none;
    margin: 0;
    padding: 0;
}

.bg_divide svg {
    color: rgb(51 65 85 / var(--tw-text-opacity));
    width: 20px;
    height: 20px;
    margin-right: 10px;
}

.dark_te {
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;
    transition-timing-function: cubic-bezier(.4, 0, .2, 1);
    transition-duration: .15s;
    border-radius: 10px;
    border: 1px solid #e5e7eb;
    cursor: pointer;
}

.dark_te hr {
    background-color: #e5e7eb;
    opacity: 1;
    margin: 0;
}

.divide_slate {
    padding: 0px 20px;
}

.divide_slate li {
    border-bottom: 1px solid rgb(226 232 240);
    padding: 18px 0px;
}


.divide_slate li a {
    color: rgb(51 65 85 / var(--tw-text-opacity));
    text-decoration: none;
    font-size: 14px;
    margin-bottom: 0;
    line-height: 1.25rem;
    font-family: "Inter", sans-serif;
    font-weight: 400;
}



.top_head {
    padding: 15px 20px;
}

.top_head h3 {
    margin-bottom: 0;
    font-size: 18px;
    line-height: 1.75rem;
    font-weight: 500;
}

.top_head p {
    margin-bottom: 0;
    font-size: 14px;
    line-height: 1.75rem;
    font-family: "Inter", sans-serif;
    font-weight: 400;
    text-align: right;
    color: rgb(59 130 246 / var(--tw-text-opacity));
}

.dark_te:hover {
    --tw-ring-color: rgb(191 219 254 / var(--tw-ring-opacity));
    --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
    --tw-shadow-color: rgb(59 130 246 / .5);
    --tw-shadow: var(--tw-shadow-colored);
}

@media screen and (max-width: 768px) {
    .Topics_Browse {
        padding: 600px 0px 80px 0px;
    }
}

@media screen and (max-width: 568px) {
    .Topics_Browse {
        padding: 700px 0px 80px 0px;
    }
}

.grend_touch {
    background-image: url('../img/background.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    padding: 100px 0px;
}

.grend_touch h3 {
    color: #fff;
    letter-spacing: -.025em;
    font-weight: 500;
    font-size: 36px;
    line-height: 2.5rem;
}

.get_touch {
    max-width: 600px;
    margin: auto;
    text-align: center;
    position: relative;
    z-index: 2;
}

.grend_touch p {
    color: #fff;
    letter-spacing: -.025em;
    font-family: "Inter", sans-serif;
    font-weight: 400;
    font-size: 18px;
    line-height: 1.75rem;
}


.grend_touch button {
    margin-top: 25px;
    font-size: 14px;
    background-color: #fff;
    color: rgb(15 23 42 / var(--tw-text-opacity));
    border: none;
    padding: 10px 20px;
    border-radius: 100px;
}




.easy_wave {
    background: linear-gradient(106.89deg, rgba(192, 132, 252, 0.11) 15.73%, rgb(14 165 233 / 16%) 15.74%, rgb(232 121 249 / 12%) 56.49%, rgb(79 70 229 / 19%) 115.91%);
    filter: blur(118px);
    position: absolute;
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    width: 100%;
}

.bg_wave {
    padding: 150px 0px 80px 0px;
    position: relative;
}

.div_styl h3 {
    font-size: 36px;
    color: rgb(15 23 42 / var(--tw-text-opacity));
    line-height: 2.5rem;
    font-weight: 500;
    margin-bottom: 20px;
}

.div_styl {
    position: relative;
    max-width: 1080px;
    margin: auto;
}

.div_styl p {
    color: rgb(51 65 85 / var(--tw-text-opacity));
    letter-spacing: -.025em;
    font-family: "Inter", sans-serif;
    font-weight: 400;
    font-size: 18px;
    line-height: 1.75rem;
}

.list_sty {
    margin: 80px 20px;
}

.list_sty h3 {
    line-height: 1.75rem;
    font-size: 18px;
    font-weight: 500;
    margin-bottom: 0;
    color: rgb(15 23 42 / var(--tw-text-opacity));
}

.list_sty p {
    line-height: 1.25rem;
    font-size: 14px;
    font-family: "Inter", sans-serif;
    font-weight: 400;
    margin-bottom: 0;
    color: rgb(51 65 85 / var(--tw-text-opacity));
}

.list_sty li {
    margin: 20px 0px;
}





.footer {
    text-align: center;
    max-width: 900px;
    margin: auto;
    padding: 10px 20px;
}

.footer p {
    color: rgb(100 116 139 / var(--tw-text-opacity));
    font-size: 14px;
    font-family: "Inter", sans-serif;
    font-weight: 400;
}

.grid_tempheader {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    position: relative;
}

.last_grid {
    text-align: end;
    z-index: 9;
}

.last_grid a {
    text-decoration: none;
    color: #ffffff;
    font-weight: 500;
    font-size: 16px;
}


.last_grid button {
    margin-left: 15px;
    font-size: 14px;
    background-color: #fff;
    color: rgb(15 23 42 / var(--tw-text-opacity));
    border: none;
    padding: 10px 20px;
    font-weight: 500;
    border-radius: 100px;
}


.last_grid a {
    text-decoration: none;
    color: #ffffff;
    font-weight: 400;
    font-size: 16px;
}

.login_grid img {
    width: 100%;
    max-width: 120px;
}


@media screen and (max-width: 568px) {
    .grid_tempheader {
        text-align: center;
        grid-template-columns: repeat(1, 1fr);
    }

    .last_grid {
        text-align: center;
        margin: 10px 0px 0 0;
    }
}

.Knowladge_grid a{
    text-decoration: none;
}



.icon-description i {
    font-size: 24px;
}

.modal-backdrop {
    z-index: initial !important;
}


.modal {
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.1);
}

.result-content {
    margin-left: 15px;
}

.modal_tes .form-control {
    padding: 12px 18px;
    font-size: 14px;
    background-color: #F8F6F2;
    border-color: #F8F6F2;
    color: #716D66;
    transition: color .2s ease;
    box-shadow: none !important;
    border: 1px solid #F8F6F2;
    border-radius: 8px;
}

.modal_tes .form-control:focus,
.modal_tes .form-control:hover {
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.1) !important;
    border: 1px solid rgb(37 99 235);
}

.modal_tes .modal-body {
    text-align: left;
    padding: 20px 30px;
}

.suggestion-item {
    text-decoration: none;
    display: flex;
    align-items: center;
    border-bottom: 1px solid #e0e0e0;
}

.title {
    font-weight: 500;
    margin-bottom: 5px;
    color: #5e6977;
    font-size: 16px;
}

.body {
    margin-bottom: 10px;
}


.inline {
    vertical-align: middle;
    border: 1px solid #e0e0e0;
    border-radius: 3px;
    padding: 3px 5px;
    color: rgba(0, 0, 0, .54);
    font-size: 12px;
}

.suggestion-item:hover .title,
.suggestion-item:hover .inline {
    color: #fff;
}

.help_svg {
    fill: rgb(29 78 216 / var(--tw-text-opacity));
}

.modal-dialog {
    max-width: 750px;
}

.modal_tes .select2-container {
    width: 100% !important;
}

.modal_tes .select2-container--default .select2-selection--single {
    padding: 8px 12px !important;
    font-size: 14px;
    background-color: #F8F6F2;
    border-color: #F8F6F2;
    color: #716D66;
    transition: color .2s ease;
    outline: none;
    border-radius: 8px;
    border: 1px solid #F8F6F2;
}

.modal_tes .select2-container .select2-selection--single {
    height: auto !important;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 40px !important;
}

.select2-container--open .select2-dropdown--below {
    top: 5px;
    border: 1px solid #F8F6F2;
    border-radius: 8px;
    box-shadow: 0px 0px 50px 0px rgba(82, 63, 105, 0.15) !important;
}

.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
    background-color: #F8F6F2;
    color: rgb(37 99 235);
}

.select2-container--default.select2-container--open.select2-container--below .select2-selection--single,
.select2-container--default.select2-container--open.select2-container--below .select2-selection--multiple {
    border-radius: 8px !important;
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.1) !important;
    border: 1px solid rgb(37 99 235);
}

.select2-container .select2-selection--single .select2-selection__rendered {
    padding: 0 !important;
}

.select2-container--default .select2-search--dropdown .select2-search__field {
    display: none;
}

.modal_tes .modal-header button {
    box-shadow: none;
    border: none;
    background-color: transparent;
}

.modal-footer .btn-secondary{
    background-color: #F6F1E9;
    border-color: #F6F1E9;
    color: #5e6977;
    padding: 10px 18px;
    border-radius: 8px;
}

.modal-footer .btn-primary{
    background-color: rgb(37 99 235);
    border-color: rgb(37 99 235);
    padding: 10px 18px;
    border-radius: 8px;
}

.modal-footer .btn-primary:focus{
    background-color: rgb(37 99 235);
    border-color: rgb(37 99 235);
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.1) !important;

}

.modal-footer .btn-secondary:focus{
    background-color: #F6F1E9;
    border-color: #F6F1E9;
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.1) !important;
}

.modal-footer{
    display: flex;
    align-items: center ;
    justify-content: space-between;
}