main {
    font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !important;
}

#mu-demo {
    background: #b9efff;
}

img {
    border: none;
}

h1 {
    text-align: center;
    margin-bottom: 25px;
    margin-top: 5px;
}

hr {
    margin-top: 40px;
    margin-bottom: 20px;
    border: 0;
    border-top: 1px solid rgba(0, 0, 0, .2);
}

.blog-card .ftr div {
    display: inline-block;
}

.blog-author-avatar {
    display: inline-block;
    max-width: 35px;
    border-radius: 30px;
    margin-right: 8px;
}

.blog-author-name {
    color: #0e0e0e;
    font-size: 14px;
    font-weight: 600;
}

.blog-card-blog {
    margin-top: 30px;
}

.blog-card {
    display: inline-block;
    position: relative;
    width: 100%;
    margin-bottom: 30px;
    border-radius: 6px;
    color: rgba(0, 0, 0, 0.87);
    background: #fff;
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
}

.blog-card-description {
    font-size: 16px;
    margin-top: 10px;
    color: #0e0e0e;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.blog-card .blog-card-image {
    /*
    height: 60%;
    position: relative;
    overflow: hidden;
    margin-left: 15px;
    margin-right: 15px;
    margin-top: -30px;
    border-radius: 6px;
    box-shadow: 0 16px 38px -12px rgba(0, 0, 0, 0.56), 0 4px 25px 0px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2);
  */
    max-height: 286px;
    height: auto;
    position: relative;
    overflow: hidden;
}

.blog-card .blog-card-image img {
    width: 100%;
    height: 100%;
    border-radius: 0px;
    pointer-events: none;
}

.text-justify {
    text-align: justify;
    color: #0e0e0e;
    font-size: 14px;
    font-weight: 500;
}

.blog-card .blog-table {
    padding: 15px 30px;
}

.blog-table {
    margin-bottom: 0px;
}

.blog-category {
    position: relative;
    line-height: 0;
    margin: 15px 0;
}

.tag-helpdesk {
    color: #038aff!important;
    border: 2px solid #038aff;
    padding: 16px;
    width: fit-content;
    background: #0089ff0d;
    border-radius: 8px;
    margin-top: 40px;
}

.tag-teams {
    color: #089d0a!important;
    border: 2px solid #089d0a;
    padding: 16px;
    width: fit-content;
    background: #089d0a0d;
    border-radius: 6px;
    font-size: 12px;
}

.blog-text-success3 {
    color: #ba8b05!important;
    border: 2px solid #ba8b05;
    padding: 6px;
    width: fit-content;
    background: #ba8b051a;
    border-radius: 8px;
}

.blog-card-blog .blog-card-caption {
    margin-top: 5px;
}

.blog-card-caption {
    font-weight: 900;
    font-size: 1.75em;
    font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !important;
}

.fa {
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.blog-card-caption,
.blog-card-caption a {
    color: #0e0e0e;
    text-decoration: none;
}

p {
    color: #0e0e0e;
}

p {
    margin-top: 0;
    margin-bottom: 1rem;
}

.blog-card .ftr {
    margin-top: 15px;
}

.blog-card .ftr .author {
    color: #888;
}

.blog-card .ftr div {
    display: inline-block;
}

.blog-card .author .avatar {
    width: 36px;
    height: 36px;
    overflow: hidden;
    border-radius: 50%;
    margin-right: 5px;
    blog-
}

.blog-card .ftr .stats {
    position: relative;
    top: 1px;
    font-size: 14px;
}

.blog-card .ftr .stats {
    float: right;
    line-height: 30px;
}


/*Book a demo*/

.slack-deco-l {
    position: absolute;
    top: 0;
    left: 0;
}

.slack-deco-r {
    position: absolute;
    bottom: 0;
    right: 0;
}

.add_to_slack,
.add_to_msteams {
    padding: 15px 46px 15px 46px;
    font-size: 18px;
    background-color: #02adff;
    color: #fff;
    font-weight: 900;
    margin: 16px 0;
}

.add_to_slack:hover,
.add_to_msteams:hover {
    padding: 15px 46px 15px 46px;
    font-size: 18px;
    background-color: #009de8;
    color: #fff;
    font-weight: 900;
    margin: 16px 0;
}

.slack-btn-icon {
    padding-bottom: 3px;
    display: inline-block;
}

#mu-demo a {
    text-decoration: none;
    color: #42c2ff;
    font-weight: 500;
    margin: 0 20px;
}


/*Taiwind Cusotome*/

@import url('https://fonts.googleapis.com/css2?family=Dancing+Script:wght@600&family=Merriweather:wght@300;400&family=Oxygen:wght@300;400;700&family=Satisfy&display=swap');
@tailwind base;
@tailwind components;
@tailwind utilities;
html {
    scroll-behavior: smooth;
}

body {
    /*font-family: 'Oxygen', sans-serif;*/
    font-weight: 700;
    letter-spacing: 1px;
}

.dropdown {
    position: relative;
    display: inline-block;
}

.dropdown-content {
    display: none;
    position: absolute;
    min-width: 160px;
    z-index: 1;
}

.center-cropped {
    width: 100%;
    height: 100%;
    background-position: center center;
    background-repeat: no-repeat;
    overflow: hidden;
}


/* Set the image to fill its parent and make transparent */

.center-cropped img {
    min-height: 100%;
    min-width: 100%;
    /* IE 8 */
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    /* IE 5-7 */
    filter: alpha(opacity=0);
    /* modern browsers */
    opacity: 0;
}

.dropdown:hover .dropdown-content {
    display: block;
}

.dropdown-content-mobile {
    display: none;
    position: absolute;
    z-index: 1;
}

.dropdown-mobile:hover .dropdown-content-mobile {
    display: inline-block;
    position: relative;
}

p {
    font-weight: 400;
}

em {}

blockquote {
    font-weight: 600;
}

main,
section,
aside {
    animation: fadein .5s ease;
}

@keyframes fadein {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

main img {
    /*  height: 500px;
  width: 100%;
  */
}

button {
    font-weight: 700;
}

label {
    font-size: 16px;
    font-weight: 300;
}

.px-4 {
    padding-left: 1rem;
    padding-right: 1.4rem;
}

.text-gray-600 {
    --text-opacity: 1;
    color: #0e0e0e;
}

.text-indigo-700 {
    color: #42c2ff;
    font-weight: 500;
}

.hover\:text-indigo-500:hover {
    --text-opacity: 1;
    color: #008df2;
}

.bg-facebook {
    background-color: #3b5998;
}

.bg-facebook:hover {
    background-color: #344e86;
}

.bg-twitter {
    background-color: #1da1f2;
}

.bg-twitter:hover {
    background-color: #0d95e8;
}

.bg-medium {
    background-color: #000000;
}

.bg-medium:hover {
    background-color: #222222;
}

.bg-instagram {
    background-color: #000000 !important;
}

.bg-instagram:hover {
    background-color: #222222;
}

.about-roby {
    border-bottom: none;
    display: inline-block;
}

#title {
    color: #0e0e0e;
    font-weight: 900;
    text-shadow: -1px 0 black, -5px 5px #ffffff, -8px 8px #1e7aa6, -12px 12px #08c6ff;
    /*animation: slidein .5s ease;*/
    font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    line-height: 65px;
}

@keyframes slidein {
    from {
        margin-left: 200%;
        width: 500%;
    }
    to {
        margin-left: 0%;
        width: 100%;
    }
}

.mt-20 {
    margin-top: 10rem;
}

#social-links li {
    transition: all .3s ease;
}

#social-links li:hover {
    transform: scale(1.1);
}

#image-grid img {
    width: 100%;
    height: 80px;
}

#blog-cards img {
    width: 100%;
    height: 300px;
}

.show {
    display: block;
}

.p-2 {
    padding: 1.25rem;
}


/*header*/

.bg-indigo-900 {
    --bg-opacity: 1;
    background-color: #fff;
    background: #42c2ff;
}

.hover\:text-white:hover {
    --tw-text-opacity: 1;
    color: #42c2ff;
}

.h-8 {
    height: 3rem;
}

.w-48 {
    width: 12rem;
    padding: 11px 20px !important;
}

.text-gray-200 {
    --text-opacity: 1;
    color: #0e0e0e;
}

.text-white {
    --text-opacity: 1;
    color: #fff !important;
}


/*Button header*/

.bg-indigo-800 {
    --bg-opacity: 1;
    background-color: #0e0e0e;
}


/*body*/

.bg-indigo-100 {
    --bg-opacity: 1;
    background-color: #fff;
}

.border-b-2 {
    --border-opacity: 1;
    border-color: #42c2ff;
    border-bottom-width: 3px;
}

.bg-gray-100 {
    --bg-opacity: 1;
    background-color: #ffffff;
    border: 2px solid #0e0e0e;
}

.bg-gray-100-1 {
    --bg-opacity: 1;
    background-color: transparent;
}

.small-icon {
    /*
  display: inline-block;
  max-width: 36px;
  */
    display: inline-block;
    max-width: 45px;
    padding: 2px 5px 17px 3px;
    margin-right: 6px;
}

.p-4 {
    padding: 4rem;
}

.border-indigo-200 {
    --bg-opacity: 1;
    background-color: #ffffff;
    border: 2px solid #0e0e0e;
}

.text-3xl {
    font-size: 4.5rem;
    font-weight: 900 !important;
    padding-bottom: 20px;
    text-align: left;
    font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}


/*Footer*/

.bg-indigo-600 {
    --bg-opacity: 1;
    background-color: #42c2ff;
}

.text-xl {
    font-size: 1.65rem;
    font-weight: 700;
    color: #0e0e0e;
    /*padding-left: 1.25rem;*/
    padding-top: 0px;
}

.text-gray-100 {
    --text-opacity: 1;
    color: #0e0e0e;
}


/*Article*/

.py-3 {
    padding: 1.25rem;
}

.py-2 {
    border: none;
}

.text-base {
    font-size: 1.5rem;
}

.text-sm {
    font-size: 1.5rem;
    font-family: Georgia, serif;
    font-weight: 500;
}

.text-base,
.text-xs {
    font-size: 1.5rem;
}

#header {
    --bg-opacity: 1;
    background-color: #fff;
    background: #f3fbff;
}

.text-green-500 {
    --tw-text-opacity: 1;
    color: #42c2ff;
}

.text-xl-2 {
    font-size: 1.25rem;
    font-weight: 700;
    color: #0e0e0e;
}

.text-6xl {
    font-size: 3rem;
    animation: none;
}

.pt-20 {
    padding-top: 10rem;
}

.book-a-demo-div {
    background: rgb(255, 255, 255);
    background: linear-gradient(0deg, rgb(129 226 255) 0%, rgba(66, 194, 255, 1) 100%);
}

.book-a-demo-title {
    margin-bottom: 20px;
    margin-top: 0px;
}

.book-a-demo-des {
    font-size: 14px;
    color: #0e0e0e;
}

.subtitle-ol-h4 {
    color: #275d93;
    font-weight: 900;
    font-size: 2.5rem;
    margin: 40px 0px 10px 0px;
}

li.article-ol-li {
    margin: 20px 20px;
    font-size: 2.5rem;
    color: #0f549a;
    font-style: unset;
    font-weight: 700;
    font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}

.post-img-mid {
    padding: 6rem;
}

.h-10 {
    height: 50px;
    margin-bottom: 13px;
    margin-right: 18px;
    width: 50px;
}

.from-green-100 {
    --tw-gradient-from: #42c2ff;
    --tw-gradient-stops: #42c2ff, #daffff;
}

.bg-green-500 {
    --tw-bg-opacity: 1;
    background-color: #42c2ff;
}

.border-green-500 {
    --tw-border-opacity: 1;
    border-color: #42c2ff;
}

.border-gray-400 {
    --tw-border-opacity: 1;
    border: 1px solid #0e0e0e !important;
}

.border-t {
    border-top-width: 1px !important;
    border-bottom-width: 0px !important;
    border-left-width: 0px !important;
    border-right-width: 0px !important;
}

.article-ul {
    list-style: disc;
    margin: 1em;
    padding: 0;
}

.article-ol {
    list-style: decimal;
    margin: 1em;
    padding: 0;
}

.article-li {
    margin: 20px 12px;
    font-size: 1.75rem;
    color: #0e0e0e;
    font-style: italic;
    font-weight: 500;
    font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}

.pt-20 {
    padding-top: 10rem;
    max-width: 100%;
    padding-top: 12rem;
}

.top-0 {
    top: -15px;
    position: relative;
}

.img-wrapper {
    width: 100%;
    /*height: 38vh;*/
    height: auto;
    overflow: hidden;
}