assets/css/devtool-main.css in appscms-tools-theme-4.6.2 vs assets/css/devtool-main.css in appscms-tools-theme-4.6.3

- old
+ new

@@ -1,1351 +1,1351 @@ -@import url("https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800&display=swap"); - -* { - box-sizing: border-box; - font-family: "Inter", sans-serif; -} - -body { - padding: 0; - margin: 0; - -webkit-font-smoothing: antialiased; - font-family: var(--font-family); - overflow-x: hidden; - background: radial-gradient(var(--main-bg-color)); -} -/* appscms navbar */ -.appscms-navbar { - background-color: var(--white-color); - height: 45px; - position: sticky; - top: 0; - z-index: 999; -} - -.appscms-navbar-nav { - display: flex; - width: 100%; - height: 100%; - justify-content: space-between; -} -.appscms-navbar-nav a { - display: flex; - align-items: center; -} -.appscms-navbar-nav-links { - width: 100%; - height: 100%; - display: flex; - justify-content: flex-end; - gap: 45px; - align-items: center; -} - -.appscms-nav-link { - font-size: 15px; - color: var(--black-light); - font-weight: 450; -} -.appscms-nav-link:hover { - color: var(--black-color); - text-decoration: underline; -} -.arrow-svg { - display: none; -} - -.appscms-toolbar { - background-color: var(--primary-color); - box-shadow: 1px 4px 10 #00000026; - position: sticky; - z-index: 999; - top: 45px; -} - -.appscms-toolbar .appscms-toolbar-list { - list-style: none; - display: flex; - padding: 0; - margin: 0; - height: 40px; - gap: 59px; -} - -.appscms-toolbar .appscms-toolbar-list .appscms-toolbar-list-item { - color: var(--black-light); - display: block; - font-size: 16px; - line-height: 24px; - padding: 10px; - position: relative; - text-decoration: none; - display: flex; - align-items: center; - justify-content: center; - cursor: pointer; -} -.appscms-toolbar .appscms-toolbar-list .appscms-toolbar-list-item:first-child { - padding-left: 0px; -} -.appscms-toolbar .appscms-toolbar-list .appscms-toolbar-list-item:first-child { - padding-right: 0px; -} -.appscms-toolbar - .appscms-toolbar-list - .appscms-toolbar-list-item:hover - > .list-item-dropdown { - display: block; - opacity: 1; -} - -.appscms-toolbar .appscms-toolbar-list .appscms-toolbar-list-item:hover { - border-bottom: 2px solid white; - padding-bottom: 8px; - position: relative; -} - -/* smooth scrolling code */ -.appscms-toolbar-list { - overflow-y: hidden; - overflow-x: auto; -} - -.appscms-toolbar-list::-webkit-scrollbar { - width: 0; - height: 0; -} - -.appscms-toolbar-list::-webkit-scrollbar-track { - background-color: transparent; -} - -.appscms-toolbar-list::-webkit-scrollbar-thumb { - background-color: transparent; -} - -.appscms-toolbar .list-item-dropdown { - left: 0px; - position: fixed; - top: 85px; - min-width: 500px; - width: 90vw; - box-shadow: 3px 10px 40px rgba(24, 29, 32, 0.05); - z-index: 200; - border-bottom-left-radius: 10px; - border-bottom-right-radius: 10px; - padding: 25px 50px 50px 50px; - display: none; - background-color: var(--white-color); - border: none; -} - -.list-item-dropdown-heading { - font-weight: 600; - font-size: 13px; - color: var(--black-light); - margin-bottom: 8px; -} -.list-item-dropdown li { - padding-top: 1px; - padding-bottom: 1px; - list-style: none; -} -.list-item-dropdown li .toolbar-link { - font-weight: 600; - line-height: 1.7; - color: var(--dark-gray); - padding-top: 10px; - padding-bottom: 8px; - align-items: center; - width: 100%; - font-size: 16px; - text-decoration: none; - text-transform: capitalize; - white-space: nowrap; -} - -.list-item-dropdown li .toolbar-link:hover { - background-color: rgba(241, 241, 241, 0.279); - box-shadow: 0px 0px 5px rgba(241, 241, 241, 0.279); - border-radius: 5px; - color: #323232; -} -.appscms-toolbar-list-item-span { - color: var(--white-color); - display: block; - font-size: 15px; - line-height: 24px; - width: 100%; - white-space: nowrap; - padding: 8px 0; - position: relative; - text-decoration: none; -} -.hamburger { - display: none; -} - -.appscms-faq-section { - max-width: 1140px; -} - -@media (max-width: 768px) { - .close-nav-ham { - display: flex !important; - justify-content: end; - } - .hamburger { - display: block; - cursor: pointer; - position: absolute; - right: -20px; - /* top: 5px; */ - z-index: 9999; - } - .appscms-toolbar { - background-color: var(--black-color); - box-shadow: 1px 4px 10 #00000026; - overflow-x: hidden; - } - .appscms-navbar-nav-links { - display: none; - } - .appscms-toolbar { - top: 0px; - position: fixed; - transition: all 0.3s ease; - width: 272px; - right: -272px; - display: none; - z-index: 1000; - } - .appscms-toolbar .appscms-toolbar-list { - height: 100vh; - flex-direction: column; - gap: 0px; - overflow-y: scroll; - overflow-x: hidden; - } - .appscms-toolbar .appscms-toolbar-list .appscms-toolbar-list-item { - align-items: flex-start; - flex-direction: column; - } - .appscms-toolbar - .appscms-toolbar-list - .appscms-toolbar-list-item:first-child { - padding-left: 10px; - } - .appscms-toolbar .appscms-toolbar-list .appscms-toolbar-list-item:hover { - border-bottom: none; - padding-bottom: 10px; - } - - .appscms-toolbar - .appscms-toolbar-list - .appscms-toolbar-list-item:first-child { - padding-right: 10px; - } - .list-item-dropdown li .toolbar-link { - color: var(--white-color); - font-size: 15px; - } - .appscms-toolbar-list-item-span { - font-size: 17px; - font-weight: 600; - } - .list-item-dropdown-heading { - display: none; - } - .appscms-toolbar .list-item-dropdown { - padding: 0px; - width: 100%; - position: static; - display: block; - overflow: hidden; - transition: all 0.3s ease; - background-color: transparent; - opacity: 0; - height: 0px; - max-height: 0px; - } - .appscms-toolbar - .appscms-toolbar-list-item:nth-child(1) - > .list-item-dropdown { - opacity: 1; - height: auto; - max-height: 200px; - } - - .arrow-svg { - display: block; - } -} -.bg-primary { - background-color: #1b2fe7; -} -/* headings section */ -.appscms-h1, -.success-msg { - font-size: 50px; - font-weight: 799; - font-family: "inter", sans-serif; - margin: 20px 0px; - color: var(--mid-gray); -} -.appscms-h3 { - font-size: 30px; - color: var(--mid-gray); -} -.appscms-h2 { - font-size: 20px; - padding-top: 8px; - font-weight: 500; - color: var(--light-gray); -} - -/* searchbar */ -#appscms-searchbar { - border-radius: 50px; - padding: 10px; - background-color: white; -} -.form-control:focus { - border-color: transparent; - box-shadow: none; -} -.btn-search:hover { - transform: scale(1.2); -} -.btn-search:focus, -.btn-search:active { - background-color: transparent; - border-color: transparent; - box-shadow: none; -} -/* category section */ -.toolfilters { - margin-top: 80px; - cursor: pointer; - background-color: rgb(255, 255, 255); - display: flex; - height: 30px; - box-shadow: 1px 4px 10px rgba(0, 0, 0, 0.15); - height: 53px; - align-items: center; - border-radius: 27px; - overflow: hidden; - margin: 20px; - color: #000; -} -.toolfilter { - margin: auto; - padding: 0px 30px; -} -/* test scroll */ -.toolfilters { - overflow-y: hidden; - overflow-x: auto; -} - -.toolfilters::-webkit-scrollbar { - width: 0; - height: 0; -} - -.toolfilters::-webkit-scrollbar-track { - background-color: transparent; -} - -.toolfilters::-webkit-scrollbar-thumb { - background-color: transparent; -} -/* margin: 4px; */ -/* overflow: hidden; */ - -.toolfilter:hover { - background-color: var(--primary-color); - color: white; - height: 90%; - border-radius: 26px; - display: flex; - align-items: center; -} - -/* tools section */ -.appscms-tool-container:nth-child(even) .appscms-tool .tool-top { - background-color: rgb(233, 107, 34); -} - -#appscms-tools-section { - padding-top: 50px; -} - -.appscms-tool { - border-radius: 10px; - box-shadow: 2px 3px 7px 2px rgba(0, 0, 0, 0.158); - cursor: pointer; - height: 169px; - margin-bottom: 25px; - background-color: rgba(255, 255, 255, 0.7); - transition: all 0.2s ease; -} - -.appscms-tool:hover { - transform: translate(0, -4px) scale(1.01); - box-shadow: 2px 5px 7px 2px rgba(0, 0, 0, 0.236); -} - -.appscms-tool .tool-top { - background: #4b5cf4; - overflow: hidden; - height: calc(171px - 57px); - border-top-right-radius: 10px; - border-top-left-radius: 10px; - display: flex; - align-items: center; - transition: all 0.5s ease; -} - -.appscms-tool .tool-top:hover { - transform: translate(0, 0px) scale(1.001); - animation: moveGradient 10s linear infinite; - filter: hue-rotate(15deg) saturate(125%) brightness(104%); -} -.appscms-tool .tool-top:active { - transform: translate(0, 0px) scale(1.003); - animation: moveGradient 10s linear infinite; - filter: hue-rotate(-15deg) saturate(105%) brightness(95%); -} - -@keyframes moveGradient { - 0% { - background-position: 0% 50%; - } - 100% { - background-position: 100% 50%; - } -} -.appscms-tool .tool-top .tool-img { - padding: 0px; - margin-right: 21px; - background: rgba(255, 255, 255, 25%); - border-radius: 300px; - margin-left: 20px; - height: 58px; - width: 58px; - display: flex; - align-items: center; - border: 1px solid #ffffff12; -} - -.appscms-tool .tool-top .tool-img img { - height: 34px; - width: 72px; - transition: filter 0.3s ease-in-out; /* Smooth transitions for transform and box-shadow */ -} - -.appscms-tool .tool-top .tool-img img:hover { - transform: scale(1.001); /* Slightly scale up the image on hover */ - filter: drop-shadow(0 0 10px rgba(255, 255, 255, 0.355)); -} - -.appscms-tool .tool-text { - color: var(--white-color); - padding-right: 33px; - font-weight: 300; - font-size: 16px; - line-height: 20.57px; -} -.appscms-tool .tool-heading { - padding-top: 14px; - padding-bottom: 19px; - color: var(--dark-gray); - height: 57px; - font-weight: 500; - font-size: 17px; - text-align: center; -} -.text-primary { - font-size: 30px; - font-weight: 600; -} - -.description { - font-size: 12px; - line-height: 0.2; -} - -/* blog section */ -.appscms-blogs { - border-radius: 10px; - padding-top: 20px; - background-color: rgba(55, 55, 55, 0); -} - -.contenttool-img-wrap-blog{ - padding: 14px; -} -.appscms-blog-cards { - background: #34314170; - margin-bottom: 10px; - border-radius: 10px !important; - /* max-width: 340px; */ - /* min-width: 300px; */ - -} -.extrapaddingforimg{ - padding: 15px; -} -.card-title{ - font-size: 16px; -} - -.card-footer{ - border: none !important; - border-radius: 10px !important; - background: unset; -} - -.post-read-more{ - font-size: 13px; - display: flex; - align-items: center; -} - -.blog-readmore-link{ - color: rgb(239, 239, 239) !important ; -} - -.appscms-blog-cards img { - border-radius: 10px; - height: auto; -} -.card-body { - display: flex; - flex-direction: column; -} - - -@media (min-width: 768px) { - .appscms-h1 { - margin-top: 50px; - } -} - -/* recent post blog heading */ - -/* author in blog */ -.wrapfooter { - display: flex; - margin-top: 50px; - margin-bottom: -0px; -} -.wrapfooter img { - width: 42px; - height: 42px; - border-radius: 50%; -} -.wrapfooter .author-meta { - padding: 0px 15px 0px 10px; - align-items: center; -} -.wrapfooter .author-meta a { - font-size: 15px; - font-weight: 500; - color: #3e3e3e; - text-transform: capitalize; - text-decoration: none; -} -.post-date { - color: #878787; - font-size: 12px; - font-weight: 500; - display: block; - text-align: left; -} - -/* footer */ -#copyright-text { - font-size: 13px !important; -} -.footer-prducts-div-heading { -} - -.appscms-product-footer { - background-color:#4f4f4f24; - margin-top: 50px; -} -.appscms-footer-products { - opacity: 100%; -} - -.footer-product-link { - font-size: 15px; -} -.appscms-footer-products a { - text-decoration: none; - color: #000; -} -/* footer i89 modal css */ -.privacy-links-item { - font-stretch: 400; - font-weight: 400; - font-size: 16px; - line-height: 24px; - color: rgba(26, 26, 26, 1); - margin: 0 20px; -} -.privacy-links-item:last-child { - margin-right: 0; -} -.drop-down-btn { - cursor: pointer; - outline: 0px; - border: 0px; - width: auto; - overflow: visible; - display: flex; - -webkit-box-align: center; - align-items: center; - background-color: transparent; - transition: background-color 0.1s cubic-bezier(0.455, 0.03, 0.515, 0.955) 0s; - font-weight: 400; - font-size: 13px; - line-height: 24px; - color: rgb(26, 26, 26); -} -.language-drop-down-menu { - display: flex; - justify-content: space-between; - margin: 0; - padding: 0; - flex-wrap: wrap; -} -.language-drop-down-item { - list-style: none; - width: 50%; - text-align: center; - font-size: 15px; - margin-bottom: 0; -} -.language-drop-down-item:hover{ - background-color: #767baa3b !important; -} -.language-drop-down-item a:hover { - background-color: #767baa3b !important; - border-radius: 3px; -} -.language-drop-down-item a { - text-decoration: none; - display: flex; - width: 100%; - align-items: center; - padding: 9px 9px; - color: #1e1e1e; - font-size: 13px; - border-bottom: 1px solid rgb(224, 224, 224); -} - -@media (max-width: 575.98px) { - .appscms-h1, - .success-msg { - font-size: 30px; - font-weight: 799; - } - .appscms-h2 { - font-size: 12px; - font-weight: 400; - color: var(--mid-gray); - } - #appscms-tools-section { - padding-top: 10px; - } - /* category section */ - - .toolfilters { - font-size: 10px; - height: 30px; - padding: 3px; - } - .toolfilter { - margin: auto; - padding: 0px 15px; - } - /* search bar */ - #appscms-searchbar { - border-radius: 50px; - padding: 0px; - font-size: 8px; - } - #searchbar-placeholder { - font-size: 12px; - } - .text-primary { - font-size: 20px; - font-weight: 600; - } - - .description { - font-size: 12px; - line-height: 0.2; - } - .footer-product-link { - font-size: 12px; - } - - /* recent post and blog section phone */ - /* blog section */ - .appscms-blogs { - border-radius: 10px; - padding-top: 20px; - background-color: rgba(255, 255, 255, 0.112); - } - - .appscms-blog-cards { - box-shadow: 1px 2px 5px rgba(0, 0, 0, 0.06); - margin-bottom: 20px; - border-radius: 10px; - /* max-width: 340px; */ - /* min-width: 300px; */ - } - - .appscms-blog-cards img { - border-radius: 10px 10px 0px 0px; - height: 180px; - } - .card-body { - display: flex; - flex-direction: column; - justify-content: space-between; - } - - /* recent post blog heading */ - - /* author in blog */ - .wrapfooter { - display: flex; - margin-top: 50px; - margin-bottom: -0px; - } - .wrapfooter img { - width: 42px; - height: 42px; - border-radius: 50%; - } - .wrapfooter .author-meta { - padding: 0px 15px 0px 10px; - } - .wrapfooter .author-meta a { - font-size: 15px; - font-weight: 500; - color: #3e3e3e; - text-transform: capitalize; - text-decoration: none; - } - .post-date { - color: #878787; - font-size: 12px; - font-weight: 500; - display: block; - text-align: left; - } -} -/* Small devices (tablets) */ -@media (min-width: 576px) and (max-width: 767.98px) { - .toolfilters { - font-size: 10px; - height: 40px; - padding: 1px; - } - #searchbar-placeholder { - font-size: 13px; - } - #appscms-searchbar { - padding: 3px; - } - /* - toolfilter { - margin: auto; - padding: 0px 20px; - } */ -} - -/* Medium devices (desktops) */ -@media (max-width: 768px) { - #appscms-tools-section-row { - gap: 15px; - justify-content: center; - margin-top: 35px; - } - .appscms-tool .tool-top .tool-img img { - border-radius: 0; - } - - .appscms-tool .tool-top .tool-img { - justify-content: center; - background: unset; - border: 5px solid #ffffff08; - } - .appscms-tool { - box-shadow: none; - margin-bottom: 25px; - height: auto; - background-color: transparent; - display: flex; - flex-direction: column; - align-items: center; - } - - .appscms-tool:hover { - box-shadow: unset; - } - - .appscms-tool .tool-top { - background-color: transparent; - flex-direction: column; - justify-content: center; - border-radius: 10px; - height: 64px; - width: 64px; - border-radius: 21px; - } - .appscms-tool .tool-img { - padding: 0px !important; - } - - .appscms-tool .tool-img img { - height: 38px !important; - width: 38px !important; - } - - .appscms-tool .tool-text { - display: none; - } - - .appscms-tool .tool-heading { - font-size: 12px; - line-height: 14.52px; - margin-top: 14px; - padding: 0px; - height: 15px; - font-weight: 400; - } - - .appscms-tool-container { - /* margin: 0 auto; */ - width: auto !important; - } - .appscms-tool-container:nth-child(even) .appscms-tool .tool-top { - background-color: transparent; - } -} -@media (min-width: 768px) and (max-width: 991.98px) { - .toolfilters { - font-size: 12px; - } -} - -/* Large devices (desktops) */ -@media (min-width: 992px) and (max-width: 1199.98px) { - /* Insert CSS code here */ -} - -/* Extra Large devices (large desktops) */ -@media (min-width: 1200px) and (max-width: 1399.98px) { - /* Insert CSS code here */ -} - -/* Extra Extra Large devices (larger desktops) */ -@media (min-width: 1400px) { - /* Insert CSS code here */ -} - -/* animations */ - -.appscms-product-footer li { - list-style: none; -} -.modal-content{ - background-color: #191b4e; -} -.language-drop-down-item a:hover{ - background-color: #767baa3b; -} - -.footer-product-link { - border-radius: 5px; - color: #5e5e5f; - display: block; - font-weight: 500; - font-size: 14px; - line-height: 19px; - padding: 15px 20px 14px 10px; - position: relative; - transition: none; -} -.footer-product-link:hover { - background-color: #f3f3f451; - color: #262628; - text-decoration: none; -} - -.appscms-footer { - background-color: var(--white-color); - padding: 44px 10px 10px 10px; - border-top: 1px solid rgb(148, 148, 148); -} - -.appscms-footer-link { - list-style: none; -} - -.appscms-footer-link a { - color: #6b6b6b; - display: block; - margin-top: 18px; - font-size: 14px; - font-weight: 500; - line-height: 18px; -} -.appscms-footer-link a:hover { - color: var(--black-color); -} -.appscms-footer-category { - font-size: 14px; - padding-bottom: 12px; - font-weight: 700; - line-height: 12px; - color: var(--mid-gray); - list-style: none; -} - -.upload-from-drives { - display: flex; - gap: 20px; - margin-top: 10px; -} -.upload-from-drives img { - cursor: pointer; -} -#appscms-tools-section a { - text-decoration: none; -} -.success-msg { - text-align: center; - margin: 30px 0px; - color: var(--primary-color); -} -.go-back-block { - display: flex; - align-items: center; - justify-content: center; - margin: 30px 0px; -} -.go-back-block button { - background-color: var(--primary-color); - color: var(--white-color); - border: none; - border-radius: 10px; - padding: 10px 15px; - font-size: 15px; - height: 48px; - min-width: 212px; -} -.go-back-block button i { - color: var(--black-color); - background-color: var(--white-color); - padding: 8px; - border-radius: 50%; - font-size: 12px; -} -#rating-img { - height: 1px; - width: 1px; - filter: brightness(); - filter: brightness(100); - position: absolute; -} -.rating-tool { - display: flex; - justify-content: center; - align-items: center; - background-color: rgb(252, 252, 252); - border-radius: 50px; - height: 70px; - margin: 40px 0px; -} -#rating { - font-size: 25px; - font-weight: 600; -} -.rating-text { - font-size: 16px; -} - -.rating-stars { - padding: 0px 10px; - display: flex; - justify-content: space-between; - gap: 4px; -} - -.rating-stars i { - font-size: 20px; -} -.download-social-share { - background: #d0d3ed; - padding: 40px 0px; - display: flex; - justify-content: space-between; -} -.share-icons { - display: flex; - gap: 30px; - justify-content: end; -} -.download-social-share a { - color: #000; - font-size: 17px; - height: 40px; - width: 40px; - display: flex; - align-items: center; - justify-content: center; - padding: 10px 10px; - border: 2px solid var(--black-color); - border-radius: 50%; -} -.appscms-heading { - font-size: 25px; - text-align: center; - font-weight: 500; -} -.website-img { - height: 50px; - width: 50px; -} -.website-showcases { - padding: 50px 0px; -} -.website-showcase { - display: flex; - flex-direction: column; - justify-content: center; - align-items: center; - margin-bottom: 25px; - overflow: hidden; -} -.website-showcase a { - color: var(--black-color); - font-size: 15px; - margin-top: 10px; -} -.feature-showcase { - padding: 50px 0px; -} -.feature-showcase-div { - display: flex; - flex-direction: column; - justify-content: center; - align-items: center; - margin-bottom: 25px; -} -.feature-showcase-div img { - height: 45px; - width: 45px; -} -.feature-showcase a span { - margin-top: 15px; - font-size: 14px; -} -.feature-showcase a { - color: var(--black-color); -} - -.video-h1, -.audio-h1 { - font-weight: 600; - font-size: 53px; -} - -.video-h2, -.audio-h2 { - font-size: 22px; -} -.shareModal { - display: none; - position: fixed; - z-index: 100000000000; - left: 0; - top: 0; - width: 100%; - height: 100%; - overflow: auto; - background-color: rgba(0, 0, 0, 0.5); -} - -.shareModal .share-modal-content { - background-color: #fefefe; - margin: 15% auto; - padding: 20px; - /* border: 1px solid #888; */ - width: 70%; - height: 200px; - text-align: center; -} - -.shareModal .close-share-modal { - color: #aaa; - float: right; - display: none; - font-size: 28px; - font-weight: bold; -} -.shareModal h5 { - color: #000; - padding-top: 10px; - font-weight: 700; -} -.shareModal .close-share-modal:hover, -.shareModal .close-share-modal:focus { - color: black; - text-decoration: none; - cursor: pointer; -} - -.share-modal-social { - display: flex; - gap: 30px; - height: 100%; - padding-bottom: 60px; - align-items: center; - justify-content: center; -} -.share-modal-social a { - color: #000; -} -.share-modal-social a i { - font-size: 30px; -} -.authors-list a { - color: white !important; -} -.featurePageAuthor { - display: flex; - flex-direction: column; - width: 100%; - justify-content: center; -} - -.featurePageAuthor .author-meta { - width: 500px; - margin: 0 auto; - padding-bottom: 5rem; -} - -.featurePageAuthor .author-meta .authorName { - font-size: 20px; - padding: 1rem 0px; - font-weight: 900; - text-align: center; -} - -.featurePageAuthor .author-img { - width: 100px; - height: 100px; - border-radius: 100%; -} - -.featurePageAuthor .author_bio { - font-size: 16px; -} - -@media (max-width: 768px) { - .authors-list { - padding: 25px; - } - - .featurePageAuthor .author-meta { - width: 100%; - } -} -.contributor { - width: 100px; -} -.contributor .contributor-name { - font-size: 13px; - margin-top: 8px; - text-transform: capitalize; -} -.infographics_section { - width: 100%; - padding: 50px 0px 50px 0px; - border-top: 1px solid rgb(224, 224, 224); -} - -.infographics_section .infographics-desc { - position: absolute; - color: #000; - bottom: 0; -} - -.infographics_section .slider { - position: relative; - max-width: 40rem; - height: 26.625rem; - margin: 0 auto; - overflow: hidden; -} - -.infographics_section .slide { - position: absolute; - top: 0; - width: 100%; - height: 26.625rem; - display: flex; - align-items: center; - justify-content: center; - transition: transform 1s; -} - -.infographics_section .slide img { - width: 200px; - height: 100%; - transition-duration: 0.27s; - /* object-fit: contain; */ -} - -.infographics_section button { - background: none; - border: none; -} - -.infographics_section button .fas { - color: #000; -} - -.infographics_section .btn-slide { - position: absolute; - top: 50%; - z-index: 10; - height: 5.5rem; - width: 5.5rem; - cursor: pointer; -} - -.infographics_section .prev { - left: 3rem; - transform: translate(-50%, -50%); -} - -.infographics_section .next { - right: 3rem; - transform: translate(50%, -50%); -} - -.infographics_section .dots-container { - display: flex; - justify-content: center; - align-items: center; - position: relative; -} - -.infographics_section .dot { - width: 25px; - height: 5px; - margin: 15px 5px; - border-radius: 0.5rem; - background: rgba(39, 39, 39, 0.5); - cursor: pointer; -} - -.infographics_section .dot.active { - background: #272727; -} -.slide img { - transition-duration: 0.27s; -} -.slide img:hover { - transform: scale(1.02); - box-shadow: 1px 2px 5px rgba(0, 0, 0, 0.12); -} -.no-result-found-msg { - font-size: 20px; - color: var(--black-light); - text-align: center; - width: 100%; - font-weight: 500; -} -.close-nav-ham { - display: none; -} -.active-lang { - background: #f4f5ff3b; - border-radius: 3px; -} - - -/* overrides for dev tools */ - -.appscms-how-to-section,.faq-item,.rating-tool{ - background-color: #ffffff14; -} -.blog-pagination a, .blog-pagination span{ - background-color: #00000009; -} -.explore{ - background: #2f79f23b !important; -} -.authors-info{ - background: #1f1a2570 !important; - box-shadow: unset !important; -} - -.authors-posts-count{ - color: white !important; -} - -.cat{ - background: #ffffff2b !important; - color: rgb(241, 241, 241) !important; -} - -.left-sidebar,.right-sidebar{ - background:transparent !important; -} -#safeui-alert{ - background:#cce5ff29; - border: none; -} - -.ace_content{ - background: #353535; -} - -.ace_folding-enabled{ - background-color: rgb(88, 88, 88); -} - -.ace_gutter-cell{ - background-color: red; -} - -.ace_gutter-active-line{ - background-color: rgb(117, 117, 117) !important; -} - -.ace-tm { - background-color: rgb(63, 63, 63); -} - -.input_editor_bar, .output_editor_bar,.format_json{ - background: var(--primary-color) !important; -} - -.blog-pagination a:hover{ - background: #ffffff4f; -} - -.toaster{ - background: ; +@import url("https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800&display=swap"); + +* { + box-sizing: border-box; + font-family: "Inter", sans-serif; +} + +body { + padding: 0; + margin: 0; + -webkit-font-smoothing: antialiased; + font-family: var(--font-family); + overflow-x: hidden; + background: radial-gradient(var(--main-bg-color)); +} +/* appscms navbar */ +.appscms-navbar { + background-color: var(--white-color); + height: 45px; + position: sticky; + top: 0; + z-index: 999; +} + +.appscms-navbar-nav { + display: flex; + width: 100%; + height: 100%; + justify-content: space-between; +} +.appscms-navbar-nav a { + display: flex; + align-items: center; +} +.appscms-navbar-nav-links { + width: 100%; + height: 100%; + display: flex; + justify-content: flex-end; + gap: 45px; + align-items: center; +} + +.appscms-nav-link { + font-size: 15px; + color: var(--black-light); + font-weight: 450; +} +.appscms-nav-link:hover { + color: var(--black-color); + text-decoration: underline; +} +.arrow-svg { + display: none; +} + +.appscms-toolbar { + background-color: var(--primary-color); + box-shadow: 1px 4px 10 #00000026; + position: sticky; + z-index: 999; + top: 45px; +} + +.appscms-toolbar .appscms-toolbar-list { + list-style: none; + display: flex; + padding: 0; + margin: 0; + height: 40px; + gap: 59px; +} + +.appscms-toolbar .appscms-toolbar-list .appscms-toolbar-list-item { + color: var(--black-light); + display: block; + font-size: 16px; + line-height: 24px; + padding: 10px; + position: relative; + text-decoration: none; + display: flex; + align-items: center; + justify-content: center; + cursor: pointer; +} +.appscms-toolbar .appscms-toolbar-list .appscms-toolbar-list-item:first-child { + padding-left: 0px; +} +.appscms-toolbar .appscms-toolbar-list .appscms-toolbar-list-item:first-child { + padding-right: 0px; +} +.appscms-toolbar + .appscms-toolbar-list + .appscms-toolbar-list-item:hover + > .list-item-dropdown { + display: block; + opacity: 1; +} + +.appscms-toolbar .appscms-toolbar-list .appscms-toolbar-list-item:hover { + border-bottom: 2px solid white; + padding-bottom: 8px; + position: relative; +} + +/* smooth scrolling code */ +.appscms-toolbar-list { + overflow-y: hidden; + overflow-x: auto; +} + +.appscms-toolbar-list::-webkit-scrollbar { + width: 0; + height: 0; +} + +.appscms-toolbar-list::-webkit-scrollbar-track { + background-color: transparent; +} + +.appscms-toolbar-list::-webkit-scrollbar-thumb { + background-color: transparent; +} + +.appscms-toolbar .list-item-dropdown { + left: 0px; + position: fixed; + top: 85px; + min-width: 500px; + width: 90vw; + box-shadow: 3px 10px 40px rgba(24, 29, 32, 0.05); + z-index: 200; + border-bottom-left-radius: 10px; + border-bottom-right-radius: 10px; + padding: 25px 50px 50px 50px; + display: none; + background-color: var(--white-color); + border: none; +} + +.list-item-dropdown-heading { + font-weight: 600; + font-size: 13px; + color: var(--black-light); + margin-bottom: 8px; +} +.list-item-dropdown li { + padding-top: 1px; + padding-bottom: 1px; + list-style: none; +} +.list-item-dropdown li .toolbar-link { + font-weight: 600; + line-height: 1.7; + color: var(--dark-gray); + padding-top: 10px; + padding-bottom: 8px; + align-items: center; + width: 100%; + font-size: 16px; + text-decoration: none; + text-transform: capitalize; + white-space: nowrap; +} + +.list-item-dropdown li .toolbar-link:hover { + background-color: rgba(241, 241, 241, 0.279); + box-shadow: 0px 0px 5px rgba(241, 241, 241, 0.279); + border-radius: 5px; + color: #323232; +} +.appscms-toolbar-list-item-span { + color: var(--white-color); + display: block; + font-size: 15px; + line-height: 24px; + width: 100%; + white-space: nowrap; + padding: 8px 0; + position: relative; + text-decoration: none; +} +.hamburger { + display: none; +} + +.appscms-faq-section { + max-width: 1140px; +} + +@media (max-width: 768px) { + .close-nav-ham { + display: flex !important; + justify-content: end; + } + .hamburger { + display: block; + cursor: pointer; + position: absolute; + right: -20px; + /* top: 5px; */ + z-index: 9999; + } + .appscms-toolbar { + background-color: var(--black-color); + box-shadow: 1px 4px 10 #00000026; + overflow-x: hidden; + } + .appscms-navbar-nav-links { + display: none; + } + .appscms-toolbar { + top: 0px; + position: fixed; + transition: all 0.3s ease; + width: 272px; + right: -272px; + display: none; + z-index: 1000; + } + .appscms-toolbar .appscms-toolbar-list { + height: 100vh; + flex-direction: column; + gap: 0px; + overflow-y: scroll; + overflow-x: hidden; + } + .appscms-toolbar .appscms-toolbar-list .appscms-toolbar-list-item { + align-items: flex-start; + flex-direction: column; + } + .appscms-toolbar + .appscms-toolbar-list + .appscms-toolbar-list-item:first-child { + padding-left: 10px; + } + .appscms-toolbar .appscms-toolbar-list .appscms-toolbar-list-item:hover { + border-bottom: none; + padding-bottom: 10px; + } + + .appscms-toolbar + .appscms-toolbar-list + .appscms-toolbar-list-item:first-child { + padding-right: 10px; + } + .list-item-dropdown li .toolbar-link { + color: var(--white-color); + font-size: 15px; + } + .appscms-toolbar-list-item-span { + font-size: 17px; + font-weight: 600; + } + .list-item-dropdown-heading { + display: none; + } + .appscms-toolbar .list-item-dropdown { + padding: 0px; + width: 100%; + position: static; + display: block; + overflow: hidden; + transition: all 0.3s ease; + background-color: transparent; + opacity: 0; + height: 0px; + max-height: 0px; + } + .appscms-toolbar + .appscms-toolbar-list-item:nth-child(1) + > .list-item-dropdown { + opacity: 1; + height: auto; + max-height: 200px; + } + + .arrow-svg { + display: block; + } +} +.bg-primary { + background-color: #1b2fe7; +} +/* headings section */ +.appscms-h1, +.success-msg { + font-size: 50px; + font-weight: 799; + font-family: "inter", sans-serif; + margin: 20px 0px; + color: var(--mid-gray); +} +.appscms-h3 { + font-size: 30px; + color: var(--mid-gray); +} +.appscms-h2 { + font-size: 20px; + padding-top: 8px; + font-weight: 500; + color: var(--light-gray); +} + +/* searchbar */ +#appscms-searchbar { + border-radius: 50px; + padding: 10px; + background-color: white; +} +.form-control:focus { + border-color: transparent; + box-shadow: none; +} +.btn-search:hover { + transform: scale(1.2); +} +.btn-search:focus, +.btn-search:active { + background-color: transparent; + border-color: transparent; + box-shadow: none; +} +/* category section */ +.toolfilters { + margin-top: 80px; + cursor: pointer; + background-color: rgb(255, 255, 255); + display: flex; + height: 30px; + box-shadow: 1px 4px 10px rgba(0, 0, 0, 0.15); + height: 53px; + align-items: center; + border-radius: 27px; + overflow: hidden; + margin: 20px; + color: #000; +} +.toolfilter { + margin: auto; + padding: 0px 30px; +} +/* test scroll */ +.toolfilters { + overflow-y: hidden; + overflow-x: auto; +} + +.toolfilters::-webkit-scrollbar { + width: 0; + height: 0; +} + +.toolfilters::-webkit-scrollbar-track { + background-color: transparent; +} + +.toolfilters::-webkit-scrollbar-thumb { + background-color: transparent; +} +/* margin: 4px; */ +/* overflow: hidden; */ + +.toolfilter:hover { + background-color: var(--primary-color); + color: white; + height: 90%; + border-radius: 26px; + display: flex; + align-items: center; +} + +/* tools section */ +.appscms-tool-container:nth-child(even) .appscms-tool .tool-top { + background-color: rgb(233, 107, 34); +} + +#appscms-tools-section { + padding-top: 50px; +} + +.appscms-tool { + border-radius: 10px; + box-shadow: 2px 3px 7px 2px rgba(0, 0, 0, 0.158); + cursor: pointer; + height: 169px; + margin-bottom: 25px; + background-color: rgba(255, 255, 255, 0.7); + transition: all 0.2s ease; +} + +.appscms-tool:hover { + transform: translate(0, -4px) scale(1.01); + box-shadow: 2px 5px 7px 2px rgba(0, 0, 0, 0.236); +} + +.appscms-tool .tool-top { + background: #4b5cf4; + overflow: hidden; + height: calc(171px - 57px); + border-top-right-radius: 10px; + border-top-left-radius: 10px; + display: flex; + align-items: center; + transition: all 0.5s ease; +} + +.appscms-tool .tool-top:hover { + transform: translate(0, 0px) scale(1.001); + animation: moveGradient 10s linear infinite; + filter: hue-rotate(15deg) saturate(125%) brightness(104%); +} +.appscms-tool .tool-top:active { + transform: translate(0, 0px) scale(1.003); + animation: moveGradient 10s linear infinite; + filter: hue-rotate(-15deg) saturate(105%) brightness(95%); +} + +@keyframes moveGradient { + 0% { + background-position: 0% 50%; + } + 100% { + background-position: 100% 50%; + } +} +.appscms-tool .tool-top .tool-img { + padding: 0px; + margin-right: 21px; + background: rgba(255, 255, 255, 25%); + border-radius: 300px; + margin-left: 20px; + height: 58px; + width: 58px; + display: flex; + align-items: center; + border: 1px solid #ffffff12; +} + +.appscms-tool .tool-top .tool-img img { + height: 34px; + width: 72px; + transition: filter 0.3s ease-in-out; /* Smooth transitions for transform and box-shadow */ +} + +.appscms-tool .tool-top .tool-img img:hover { + transform: scale(1.001); /* Slightly scale up the image on hover */ + filter: drop-shadow(0 0 10px rgba(255, 255, 255, 0.355)); +} + +.appscms-tool .tool-text { + color: var(--white-color); + padding-right: 33px; + font-weight: 300; + font-size: 16px; + line-height: 20.57px; +} +.appscms-tool .tool-heading { + padding-top: 14px; + padding-bottom: 19px; + color: var(--dark-gray); + height: 57px; + font-weight: 500; + font-size: 17px; + text-align: center; +} +.text-primary { + font-size: 30px; + font-weight: 600; +} + +.description { + font-size: 12px; + line-height: 0.2; +} + +/* blog section */ +.appscms-blogs { + border-radius: 10px; + padding-top: 20px; + background-color: rgba(55, 55, 55, 0); +} + +.contenttool-img-wrap-blog{ + padding: 14px; +} +.appscms-blog-cards { + background: #34314170; + margin-bottom: 10px; + border-radius: 10px !important; + /* max-width: 340px; */ + /* min-width: 300px; */ + +} +.extrapaddingforimg{ + padding: 15px; +} +.card-title{ + font-size: 16px; +} + +.card-footer{ + border: none !important; + border-radius: 10px !important; + background: unset; +} + +.post-read-more{ + font-size: 13px; + display: flex; + align-items: center; +} + +.blog-readmore-link{ + color: rgb(239, 239, 239) !important ; +} + +.appscms-blog-cards img { + border-radius: 10px; + height: auto; +} +.card-body { + display: flex; + flex-direction: column; +} + + +@media (min-width: 768px) { + .appscms-h1 { + margin-top: 50px; + } +} + +/* recent post blog heading */ + +/* author in blog */ +.wrapfooter { + display: flex; + margin-top: 50px; + margin-bottom: -0px; +} +.wrapfooter img { + width: 42px; + height: 42px; + border-radius: 50%; +} +.wrapfooter .author-meta { + padding: 0px 15px 0px 10px; + align-items: center; +} +.wrapfooter .author-meta a { + font-size: 15px; + font-weight: 500; + color: #3e3e3e; + text-transform: capitalize; + text-decoration: none; +} +.post-date { + color: #878787; + font-size: 12px; + font-weight: 500; + display: block; + text-align: left; +} + +/* footer */ +#copyright-text { + font-size: 13px !important; +} +.footer-prducts-div-heading { +} + +.appscms-product-footer { + background-color:#4f4f4f24; + margin-top: 50px; +} +.appscms-footer-products { + opacity: 100%; +} + +.footer-product-link { + font-size: 15px; +} +.appscms-footer-products a { + text-decoration: none; + color: #000; +} +/* footer i89 modal css */ +.privacy-links-item { + font-stretch: 400; + font-weight: 400; + font-size: 16px; + line-height: 24px; + color: rgba(26, 26, 26, 1); + margin: 0 20px; +} +.privacy-links-item:last-child { + margin-right: 0; +} +.drop-down-btn { + cursor: pointer; + outline: 0px; + border: 0px; + width: auto; + overflow: visible; + display: flex; + -webkit-box-align: center; + align-items: center; + background-color: transparent; + transition: background-color 0.1s cubic-bezier(0.455, 0.03, 0.515, 0.955) 0s; + font-weight: 400; + font-size: 13px; + line-height: 24px; + color: rgb(26, 26, 26); +} +.language-drop-down-menu { + display: flex; + justify-content: space-between; + margin: 0; + padding: 0; + flex-wrap: wrap; +} +.language-drop-down-item { + list-style: none; + width: 50%; + text-align: center; + font-size: 15px; + margin-bottom: 0; +} +.language-drop-down-item:hover{ + background-color: #767baa3b !important; +} +.language-drop-down-item a:hover { + background-color: #767baa3b !important; + border-radius: 3px; +} +.language-drop-down-item a { + text-decoration: none; + display: flex; + width: 100%; + align-items: center; + padding: 9px 9px; + color: #1e1e1e; + font-size: 13px; + border-bottom: 1px solid rgb(224, 224, 224); +} + +@media (max-width: 575.98px) { + .appscms-h1, + .success-msg { + font-size: 30px; + font-weight: 799; + } + .appscms-h2 { + font-size: 12px; + font-weight: 400; + color: var(--mid-gray); + } + #appscms-tools-section { + padding-top: 10px; + } + /* category section */ + + .toolfilters { + font-size: 10px; + height: 30px; + padding: 3px; + } + .toolfilter { + margin: auto; + padding: 0px 15px; + } + /* search bar */ + #appscms-searchbar { + border-radius: 50px; + padding: 0px; + font-size: 8px; + } + #searchbar-placeholder { + font-size: 12px; + } + .text-primary { + font-size: 20px; + font-weight: 600; + } + + .description { + font-size: 12px; + line-height: 0.2; + } + .footer-product-link { + font-size: 12px; + } + + /* recent post and blog section phone */ + /* blog section */ + .appscms-blogs { + border-radius: 10px; + padding-top: 20px; + background-color: rgba(255, 255, 255, 0.112); + } + + .appscms-blog-cards { + box-shadow: 1px 2px 5px rgba(0, 0, 0, 0.06); + margin-bottom: 20px; + border-radius: 10px; + /* max-width: 340px; */ + /* min-width: 300px; */ + } + + .appscms-blog-cards img { + border-radius: 10px 10px 0px 0px; + height: 180px; + } + .card-body { + display: flex; + flex-direction: column; + justify-content: space-between; + } + + /* recent post blog heading */ + + /* author in blog */ + .wrapfooter { + display: flex; + margin-top: 50px; + margin-bottom: -0px; + } + .wrapfooter img { + width: 42px; + height: 42px; + border-radius: 50%; + } + .wrapfooter .author-meta { + padding: 0px 15px 0px 10px; + } + .wrapfooter .author-meta a { + font-size: 15px; + font-weight: 500; + color: #3e3e3e; + text-transform: capitalize; + text-decoration: none; + } + .post-date { + color: #878787; + font-size: 12px; + font-weight: 500; + display: block; + text-align: left; + } +} +/* Small devices (tablets) */ +@media (min-width: 576px) and (max-width: 767.98px) { + .toolfilters { + font-size: 10px; + height: 40px; + padding: 1px; + } + #searchbar-placeholder { + font-size: 13px; + } + #appscms-searchbar { + padding: 3px; + } + /* + toolfilter { + margin: auto; + padding: 0px 20px; + } */ +} + +/* Medium devices (desktops) */ +@media (max-width: 768px) { + #appscms-tools-section-row { + gap: 15px; + justify-content: center; + margin-top: 35px; + } + .appscms-tool .tool-top .tool-img img { + border-radius: 0; + } + + .appscms-tool .tool-top .tool-img { + justify-content: center; + background: unset; + border: 5px solid #ffffff08; + } + .appscms-tool { + box-shadow: none; + margin-bottom: 25px; + height: auto; + background-color: transparent; + display: flex; + flex-direction: column; + align-items: center; + } + + .appscms-tool:hover { + box-shadow: unset; + } + + .appscms-tool .tool-top { + background-color: transparent; + flex-direction: column; + justify-content: center; + border-radius: 10px; + height: 64px; + width: 64px; + border-radius: 21px; + } + .appscms-tool .tool-img { + padding: 0px !important; + } + + .appscms-tool .tool-img img { + height: 38px !important; + width: 38px !important; + } + + .appscms-tool .tool-text { + display: none; + } + + .appscms-tool .tool-heading { + font-size: 12px; + line-height: 14.52px; + margin-top: 14px; + padding: 0px; + height: 15px; + font-weight: 400; + } + + .appscms-tool-container { + /* margin: 0 auto; */ + width: auto !important; + } + .appscms-tool-container:nth-child(even) .appscms-tool .tool-top { + background-color: transparent; + } +} +@media (min-width: 768px) and (max-width: 991.98px) { + .toolfilters { + font-size: 12px; + } +} + +/* Large devices (desktops) */ +@media (min-width: 992px) and (max-width: 1199.98px) { + /* Insert CSS code here */ +} + +/* Extra Large devices (large desktops) */ +@media (min-width: 1200px) and (max-width: 1399.98px) { + /* Insert CSS code here */ +} + +/* Extra Extra Large devices (larger desktops) */ +@media (min-width: 1400px) { + /* Insert CSS code here */ +} + +/* animations */ + +.appscms-product-footer li { + list-style: none; +} +.modal-content{ + background-color: #191b4e; +} +.language-drop-down-item a:hover{ + background-color: #767baa3b; +} + +.footer-product-link { + border-radius: 5px; + color: #5e5e5f; + display: block; + font-weight: 500; + font-size: 14px; + line-height: 19px; + padding: 15px 20px 14px 10px; + position: relative; + transition: none; +} +.footer-product-link:hover { + background-color: #f3f3f451; + color: #262628; + text-decoration: none; +} + +.appscms-footer { + background-color: var(--white-color); + padding: 44px 10px 10px 10px; + border-top: 1px solid rgb(148, 148, 148); +} + +.appscms-footer-link { + list-style: none; +} + +.appscms-footer-link a { + color: #6b6b6b; + display: block; + margin-top: 18px; + font-size: 14px; + font-weight: 500; + line-height: 18px; +} +.appscms-footer-link a:hover { + color: var(--black-color); +} +.appscms-footer-category { + font-size: 14px; + padding-bottom: 12px; + font-weight: 700; + line-height: 12px; + color: var(--mid-gray); + list-style: none; +} + +.upload-from-drives { + display: flex; + gap: 20px; + margin-top: 10px; +} +.upload-from-drives img { + cursor: pointer; +} +#appscms-tools-section a { + text-decoration: none; +} +.success-msg { + text-align: center; + margin: 30px 0px; + color: var(--primary-color); +} +.go-back-block { + display: flex; + align-items: center; + justify-content: center; + margin: 30px 0px; +} +.go-back-block button { + background-color: var(--primary-color); + color: var(--white-color); + border: none; + border-radius: 10px; + padding: 10px 15px; + font-size: 15px; + height: 48px; + min-width: 212px; +} +.go-back-block button i { + color: var(--black-color); + background-color: var(--white-color); + padding: 8px; + border-radius: 50%; + font-size: 12px; +} +#rating-img { + height: 1px; + width: 1px; + filter: brightness(); + filter: brightness(100); + position: absolute; +} +.rating-tool { + display: flex; + justify-content: center; + align-items: center; + background-color: rgb(252, 252, 252); + border-radius: 50px; + height: 70px; + margin: 40px 0px; +} +#rating { + font-size: 25px; + font-weight: 600; +} +.rating-text { + font-size: 16px; +} + +.rating-stars { + padding: 0px 10px; + display: flex; + justify-content: space-between; + gap: 4px; +} + +.rating-stars i { + font-size: 20px; +} +.download-social-share { + background: #d0d3ed; + padding: 40px 0px; + display: flex; + justify-content: space-between; +} +.share-icons { + display: flex; + gap: 30px; + justify-content: end; +} +.download-social-share a { + color: #000; + font-size: 17px; + height: 40px; + width: 40px; + display: flex; + align-items: center; + justify-content: center; + padding: 10px 10px; + border: 2px solid var(--black-color); + border-radius: 50%; +} +.appscms-heading { + font-size: 25px; + text-align: center; + font-weight: 500; +} +.website-img { + height: 50px; + width: 50px; +} +.website-showcases { + padding: 50px 0px; +} +.website-showcase { + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + margin-bottom: 25px; + overflow: hidden; +} +.website-showcase a { + color: var(--black-color); + font-size: 15px; + margin-top: 10px; +} +.feature-showcase { + padding: 50px 0px; +} +.feature-showcase-div { + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + margin-bottom: 25px; +} +.feature-showcase-div img { + height: 45px; + width: 45px; +} +.feature-showcase a span { + margin-top: 15px; + font-size: 14px; +} +.feature-showcase a { + color: var(--black-color); +} + +.video-h1, +.audio-h1 { + font-weight: 600; + font-size: 53px; +} + +.video-h2, +.audio-h2 { + font-size: 22px; +} +.shareModal { + display: none; + position: fixed; + z-index: 100000000000; + left: 0; + top: 0; + width: 100%; + height: 100%; + overflow: auto; + background-color: rgba(0, 0, 0, 0.5); +} + +.shareModal .share-modal-content { + background-color: #fefefe; + margin: 15% auto; + padding: 20px; + /* border: 1px solid #888; */ + width: 70%; + height: 200px; + text-align: center; +} + +.shareModal .close-share-modal { + color: #aaa; + float: right; + display: none; + font-size: 28px; + font-weight: bold; +} +.shareModal h5 { + color: #000; + padding-top: 10px; + font-weight: 700; +} +.shareModal .close-share-modal:hover, +.shareModal .close-share-modal:focus { + color: black; + text-decoration: none; + cursor: pointer; +} + +.share-modal-social { + display: flex; + gap: 30px; + height: 100%; + padding-bottom: 60px; + align-items: center; + justify-content: center; +} +.share-modal-social a { + color: #000; +} +.share-modal-social a i { + font-size: 30px; +} +.authors-list a { + color: white !important; +} +.featurePageAuthor { + display: flex; + flex-direction: column; + width: 100%; + justify-content: center; +} + +.featurePageAuthor .author-meta { + width: 500px; + margin: 0 auto; + padding-bottom: 5rem; +} + +.featurePageAuthor .author-meta .authorName { + font-size: 20px; + padding: 1rem 0px; + font-weight: 900; + text-align: center; +} + +.featurePageAuthor .author-img { + width: 100px; + height: 100px; + border-radius: 100%; +} + +.featurePageAuthor .author_bio { + font-size: 16px; +} + +@media (max-width: 768px) { + .authors-list { + padding: 25px; + } + + .featurePageAuthor .author-meta { + width: 100%; + } +} +.contributor { + width: 100px; +} +.contributor .contributor-name { + font-size: 13px; + margin-top: 8px; + text-transform: capitalize; +} +.infographics_section { + width: 100%; + padding: 50px 0px 50px 0px; + border-top: 1px solid rgb(224, 224, 224); +} + +.infographics_section .infographics-desc { + position: absolute; + color: #000; + bottom: 0; +} + +.infographics_section .slider { + position: relative; + max-width: 40rem; + height: 26.625rem; + margin: 0 auto; + overflow: hidden; +} + +.infographics_section .slide { + position: absolute; + top: 0; + width: 100%; + height: 26.625rem; + display: flex; + align-items: center; + justify-content: center; + transition: transform 1s; +} + +.infographics_section .slide img { + width: 200px; + height: 100%; + transition-duration: 0.27s; + /* object-fit: contain; */ +} + +.infographics_section button { + background: none; + border: none; +} + +.infographics_section button .fas { + color: #000; +} + +.infographics_section .btn-slide { + position: absolute; + top: 50%; + z-index: 10; + height: 5.5rem; + width: 5.5rem; + cursor: pointer; +} + +.infographics_section .prev { + left: 3rem; + transform: translate(-50%, -50%); +} + +.infographics_section .next { + right: 3rem; + transform: translate(50%, -50%); +} + +.infographics_section .dots-container { + display: flex; + justify-content: center; + align-items: center; + position: relative; +} + +.infographics_section .dot { + width: 25px; + height: 5px; + margin: 15px 5px; + border-radius: 0.5rem; + background: rgba(39, 39, 39, 0.5); + cursor: pointer; +} + +.infographics_section .dot.active { + background: #272727; +} +.slide img { + transition-duration: 0.27s; +} +.slide img:hover { + transform: scale(1.02); + box-shadow: 1px 2px 5px rgba(0, 0, 0, 0.12); +} +.no-result-found-msg { + font-size: 20px; + color: var(--black-light); + text-align: center; + width: 100%; + font-weight: 500; +} +.close-nav-ham { + display: none; +} +.active-lang { + background: #f4f5ff3b; + border-radius: 3px; +} + + +/* overrides for dev tools */ + +.appscms-how-to-section,.faq-item,.rating-tool{ + background-color: #ffffff14; +} +.blog-pagination a, .blog-pagination span{ + background-color: #00000009; +} +.explore{ + background: #2f79f23b !important; +} +.authors-info{ + background: #1f1a2570 !important; + box-shadow: unset !important; +} + +.authors-posts-count{ + color: white !important; +} + +.cat{ + background: #ffffff2b !important; + color: rgb(241, 241, 241) !important; +} + +.left-sidebar,.right-sidebar{ + background:transparent !important; +} +#safeui-alert{ + background:#cce5ff29; + border: none; +} + +.ace_content{ + background: #353535; +} + +.ace_folding-enabled{ + background-color: rgb(88, 88, 88); +} + +.ace_gutter-cell{ + background-color: red; +} + +.ace_gutter-active-line{ + background-color: rgb(117, 117, 117) !important; +} + +.ace-tm { + background-color: rgb(63, 63, 63); +} + +.input_editor_bar, .output_editor_bar,.format_json{ + background: var(--primary-color) !important; +} + +.blog-pagination a:hover{ + background: #ffffff4f; +} + +.toaster{ + background: ; } \ No newline at end of file