/** * TODO while check in this file * * 1. append all images with ?p=Jan_28_2014 parameter in the end. * 2. Use images by give the full url path in from our static account. * 3. Remove the unused classes */ /* CSS Document */ @font-face { font-family: 'ZohoPuvi'; src: url('/fonts/zoho_puvi_regular.woff2') format('woff2'), /* Modern Browsers */ url('/fonts/zoho_puvi_regular.woff') format('woff'), url('/fonts/zoho_puvi_regular.ttf') format('truetype'), /* Safari, Android, iOS */ url('/fonts/zoho_puvi_regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('/fonts/zoho_puvi_regular.eot') format('embedded-opentype'); /* IE9 Compat Modes */ font-display: swap; font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'ZohoPuviSemBd'; src: url('/fonts/zoho_puvi_semibold.woff2') format('woff2'), /* Modern Browsers */ url('/fonts/zoho_puvi_semibold.woff') format('woff'), url('/fonts/zoho_puvi_semibold.ttf') format('truetype'), /* Safari, Android, iOS */ url('/fonts/zoho_puvi_semibold.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('/fonts/zoho_puvi_semibold.eot') format('truetype'); /* IE9 Compat Modes */ font-display: swap; font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'ZohoPuviBold'; src: url('/fonts/zoho_puvi_bold.woff2') format('woff2'), /* Modern Browsers */ url('/fonts/zoho_puvi_bold.woff') format('woff'), url('/fonts/zoho_puvi_bold.ttf') format('truetype'), /* Safari, Android, iOS */ url('/fonts/zoho_puvi_bold.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('/fonts/zoho_puvi_bold.eot') format('embedded-opentype'); /* IE9 Compat Modes */ font-display: swap; font-style: normal; font-weight: bold; text-rendering: optimizeLegibility; } @font-face { font-family: 'ZohoPuvi-RegIT'; src: url('/fonts/zoho_puvi_regular_italic.woff2') format('woff2'), /* Modern Browsers */ url('/fonts/zoho_puvi_regular_italic.woff') format('woff'), url('/fonts/zoho_puvi_regular_italic.ttf') format('truetype'), /* Safari, Android, iOS */ url('/fonts/zoho_puvi_regular_italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('/fonts/zoho_puvi_regular_italic.eot'); /* IE9 Compat Modes */ font-display: swap; font-style: italic; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'ZohoPuviMed'; src: url('/fonts/zoho_puvi_medium.woff2') format('woff2'), /* Modern Browsers */ url('/fonts/zoho_puvi_medium.woff') format('woff'), url('/fonts/zoho_puvi_medium.ttf') format('truetype'), /* Safari, Android, iOS */ url('/fonts/zoho_puvi_medium.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('/fonts/zoho_puvi_medium.eot'); /* IE9 Compat Modes */ font-display: fallback; font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } html { line-height: 1; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100% } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block } body { font-family: 'ZohoPuvi', sans-serif; font-size: 0.9375rem; line-height: 1.6; margin: 0; color: #000; text-rendering: optimizeLegibility; -moz-osx-font-smoothing: grayscale } h1, h2, h3, h4, h5 { margin-bottom: 1rem; } h1 { font: 2.375rem/1.3 ZohoPuviBold, sans-serif } h2 { font: 1.875rem/1.25 'ZohoPuviSemBd', sans-serif; } h3 { font: 1.5rem/1.2 'ZohoPuviSemBd', sans-serif; } h4 { font: 1.375rem/1.4 'ZohoPuviSemBd', sans-serif; } h5 { font: 1.125rem/1.4 'ZohoPuviSemBd', sans-serif; } h6 { font-size: 0.9375rem; font-family: 'ZohoPuviSemBd', sans-serif; line-height: 1.2; margin-bottom: 0.5rem; } p { font-size: 0.9375rem; line-height: 1.7; margin: 0 0 1rem 0; color: #000; } .content-wrap { width: 100%; padding-left: 15px; padding-right: 15px; margin-top: 4rem; margin-bottom: 4rem; margin-right: auto; margin-left: auto; } .hero-wrap { width: 100%; padding-left: 15px; padding-right: 15px; padding-top: 2rem; padding-bottom: 2rem; margin: 0 auto; } /* navbar css starts */ /* To be removed */ .nav-sticky { position: sticky; position: -webkit-sticky; top: 0; left: 0; right: 0; z-index: 999; box-shadow: 0 2px 10px rgba(0, 0, 0, .05); background: #fff; line-height: normal; } /* To be removed */ .nav-sticky { position: -webkit-sticky; position: sticky; top: 0; } .nav-header { background: #fff; z-index: 999; } /* To be removed */ #header-wrap { width: 100%; max-width: 1280px; margin: 0 auto; } /* To be removed */ .nav-header-wrap { width: 100%; max-width: 1280px; margin: 0 auto; } /* To be removed */ @media (min-width: 992px) { .navbar { height: 52px; } /* To be removed */ } @media (min-width: 992px) { .navbar-height { height: 52px; } } /* To be removed */ .s247-logo img { width: 100px; } /* To be removed */ /* To be removed */ @media (min-width: 768px) { .s247-logo { width: 204px; line-height: normal; } } /* To be removed */ @media (min-width: 992px) { .navbar-brand-width { width: 181px; } } /* To be removed */ @media only screen and (max-width: 767px) and (min-width: 320px) { .navbar-collapse { margin-top: 0.625rem; } } /* To be removed */ /* To be removed */ @media only screen and (max-width: 991px) and (min-width: 320px) { .nav-item-style { border-bottom: 1px solid #f1f1f1; } } /* To be removed */ @media only screen and (min-width : 320px) and (max-width : 991px) { .nav-item-sm-border-bottom { border-bottom: 1px solid #f1f1f1; } } /* To be removed */ .navbar-light .navbar-nav .nav-link { color: #000; } /* To be removed */ .nav-link-color { color: #000 !important; } .nav-link-color.active { color: #83b633 !important; } .nav-link-color.active.link-caret::after { border-top: 1px solid #83b633; border-right: 1px solid #83b633; } /* To be removed */ @media (min-width: 992px) { .navbar-light .navbar-nav .nav-item .nav-link { font-size: 0.8125rem; color: #000; padding-right: 1rem; padding-left: 1rem; } } /* To be removed */ @media (min-width: 992px) { .nav-link-text-size { font-size: 0.8125rem !important; } } /* To be removed */ @media (min-width: 992px) { .nav-item a.nav-link:hover { color: #83b633 } } /* To be removed */ @media (min-width: 992px) { .nav-link-color:hover { color: #83b633 !important } } /* navbar css ends */ /*dropdown css starts*/ .overflow-hidden { overflow: hidden; } .overflow-auto { overflow: auto; } .max-height { max-height: calc(100vh - 50px); } .link-caret::after { content: ''; position: absolute; border-top: 1px solid #000; border-right: 1px solid #000; width: 6px; height: 6px; cursor: pointer; transition: transform 200ms; } .link-caret--nav::after { -webkit-transform: rotate(134deg); transform: rotate(134deg); right: 3px; top: 12px; } .nav-link-color:hover.link-caret--nav::after { border-top: 1px solid #83b633; border-right: 1px solid #83b633; } .dropdown.show .link-caret--nav::after { -webkit-transform: rotate(314deg); transform: rotate(314deg); top: 17px; } .product-header { font-size: 1rem; font-family: 'ZohoPuviSemBd', sans-serif; line-height: 1; } .product-sub-header { font-size: 0.875rem; font-family: 'ZohoPuviSemBd', sans-serif; line-height: 1; display: inline-block; } .product-description { font-size: 12px; line-height: 1.4; color: #333; } .product-dropdown-bg { background: #FAFAFA; } .product-module { display: block; } .resource-menu-dropdown-item { color: #000; font-size: 0.8125rem; } @media (max-width: 576px) { #navbarDropdown:focus, #dropdownMenuLink:focus { outline: none; } } @media only screen and (min-width: 992px) { .product-menu-dropdown { min-width: 47rem; } .dropdown-shadow { box-shadow: 0 0 10px 0 rgba(0, 0, 0, .3); } .product-menu-dropdown-offset { top: 120%; } .resource-menu-dropdown-offset { top: 120%; left: 10px; } .resource-menu-dropdown-item:hover { background-color: #EEEEEE; border-color: #EEEEEE; } .product-header { font-size: 1rem; } .product-module:hover { background-color: #EEEEEE; border-radius: 2px; transition: all 250ms ease; } .product-module:hover .product-description { color: #000; } .product-module-active { background-color: #EEEEEE; } .product-module-active .product-description { color: #000; } .dropdown-menu { transition: .3s; -webkit-transition: all 0.3s ease 0s; } #menuDropdown .dropdown-menu:before { content: ''; position: absolute; width: 14px; height: 0; border: 7px solid transparent; border-bottom: 7px solid #fff; top: -14px; left: 80px; -ms-transform: translateX(-50%); transform: translateX(-50%); } #menuDropdown.show .dropdown-toggle:after { transform: rotate(-180deg); transition: transform 200ms; } .resource-menu-dropdown>.dropdown-item:first-child:hover::before, .resource-menu-dropdown::before { content: ''; position: absolute; width: 14px; height: 0; border: 7px solid transparent; border-bottom: 7px solid #fff; top: -14px; left: 80px; -ms-transform: translateX(-50%); transform: translateX(-50%); } .resource-menu-dropdown>.dropdown-item:first-child:hover::before { border-bottom-color: #EEEEEE; } } @media(min-width: 1200px) { .product-menu-dropdown { min-width: 56rem; } .navbar-brand-width { width: 201px; } } /*dropdown css ends*/ /* navbar toggler css starts */ .nav-toggler-menu { width: 20px; height: 12px; position: relative; } .nav-toggler-menu span { display: block; position: absolute; height: 2px; width: 100%; border-radius: 9px; opacity: 1; left: 0; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: .25s ease-in-out; -moz-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out; background: #000; } .nav-toggler-menu span:nth-child(1) { top: 0px; -webkit-transform-origin: left center; -moz-transform-origin: left center; -o-transform-origin: left center; transform-origin: left center; } .nav-toggler-menu span:nth-child(2) { top: 5px; -webkit-transform-origin: left center; -moz-transform-origin: left center; -o-transform-origin: left center; transform-origin: left center; } .nav-toggler-menu span:nth-child(3) { top: 10px; -webkit-transform-origin: left center; -moz-transform-origin: left center; -o-transform-origin: left center; transform-origin: left center; } .nav-toggler-menu.open span:nth-child(1) { -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); top: -2px; left: 4px; } .nav-toggler-menu.open span:nth-child(2) { width: 0%; opacity: 0; } .nav-toggler-menu.open span:nth-child(3) { -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); top: 12px; left: 4px; } .nav-toggler { background: transparent; } .nav-toggler:focus { outline: 0px; outline: -webkit-focus-ring-color auto 0px; } @media (min-width: 992px) { .navbar-expand-lg .nav-toggler { display: none; } } /* navbar toggler css ends */ .content-wrap__anchor { border-bottom: 1px dotted rgba(0, 0, 0, 0.5); } .metric-card { border: 1px solid #eee; box-shadow: 0 2px 4px 0 rgba(129, 129, 129, 0.2); padding: 10px; } .metric-card:hover { box-shadow: 4px 6px 8px 2px rgba(129, 129, 129, 0.15); transition: 0.3s; } .feature-icon-small { width: 30px; height: 30px; background-size: contain; background-repeat: no-repeat; } .feature-icon-medium { width: 35px; height: 35px; background-size: contain; background-repeat: no-repeat; } .feature-icon-large { width: 50px; height: 50px; background-size: contain; background-repeat: no-repeat; } .feature-icon { background-size: contain; background-repeat: no-repeat; display: inline-block; width: 35px; height: 28px; } .feature-grid { display: -ms-grid; display: grid; -ms-grid-rows: auto; grid-template-rows: auto; -ms-grid-columns: auto; grid-template-columns: auto; grid-template-areas: none; grid-auto-flow: initial; grid-auto-rows: initial; grid-auto-columns: initial; grid-gap: 60px 30px; } .icon-grid { display: -ms-grid; display: grid; -ms-grid-columns: 1fr 1fr; grid-template-columns: repeat(2, 1fr); } .footer-toggle::after { content: ''; position: absolute; border-top: 1px solid #000; border-right: 1px solid #000; transform: rotate(135deg); height: 6px; width: 6px; right: 0px; top: 5px; } .footer-toggle>h5, .footer-header { border-bottom: 1px solid #ccc; } .footer-links { display: none; } @media only screen and (min-width: 768px) { .feature-grid { -ms-grid-columns: 1fr 1fr; grid-template-columns: 1fr 1fr; } .icon-grid { -ms-grid-columns: 1fr 10px 1fr 10px 1fr 10px 1fr 10px 1fr; grid-template-columns: repeat(5, 1fr); grid-gap: 10px; } .footer-toggle::after { content: none; } .footer-toggle>h5, .footer-header { border-bottom: 0px; } .footer-links { display: block; } .divider { height: 1px; width: 100%; border-top: 1px solid #9e9e9e; } } @media only screen and (min-width: 880px) { .feature-grid { grid-gap: 60px; } } .update-banner { background: #000; } .update-banner__notification:hover { text-decoration: underline; } .update-banner__notification::after { content: ''; background-image: url(/images/keyboard-arrow-right-white.svg); width: 24px; height: 24px; background-size: contain; position: absolute; } .badge-green { color: #fff; background-color: #1b5e20; font-size: 85%; } .sub-header { font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.1rem; color: rgba(0, 0, 0, 0.8); } .carousel-indicators .active { background-color: #83b633; } .carousel-indicators { bottom: -20px; } .carousel-indicators li { height: 12px; border: 1px solid #ccc; width: 12px; border-radius: 10px; } /* .navbar-brand { padding: 0.5rem 1rem; margin: 0px; } */ .footer-all-in-one-li { position: relative; list-style: none; padding: 0 0.3125rem 0 0.3125rem; font-size: 14px; } .footer-all-in-one-li:after { content: ''; position: absolute; height: 12px; width: 1px; background: #000; right: 0; top: 6px; } .footer-all-in-one-li a { font-size: 0.938rem !important; } .footer-all-in-one-li:last-child:after { content: none; } .learnmore-anchor { display: inline-block; position: relative; text-decoration: none; color: #000; cursor: pointer; line-height: 1rem; font-size: 0.9375rem; } .learnmore-anchor:hover { text-decoration: underline #83b633; color: #83b633; } .learnmore-anchor:after { content: ''; position: absolute; border-top: 1px solid #000; border-right: 1px solid #000; -webkit-transform: rotate(45deg); transform: rotate(45deg); right: -10px; top: 5px; width: 6px; height: 6px; cursor: pointer; } .learnmore-anchor:hover:after { border-top: 1px solid #83b633; border-right: 1px solid #83b633; transform: rotate(45deg) translate(2px, -2px); transition: transform 250ms; } .fa { font-size: 1.75rem; color: #83b633; } .social-icons-new { width: 200px; } .footer-links li { font-size: 0.84375rem; margin-bottom: .1rem; } .product-menu-col-one-fourth { flex: 0 0 33.333333%; max-width: 33.333333%; } .price-annual-text { color: #999; text-decoration: line-through; } .free-plan-text { display: block; font-size: 0.8125rem; } .testimonial-index-carousel { width: 100%; margin: 0 auto; } @media (min-width: 1200px) { .testimonial-index-carousel { width: 80%; margin: 0 auto; } } .testimonial-index-carousel .carousel-inner { border-radius: 5px; background-color: #fff; box-shadow: 0 0 5px 0 rgba(0, 0, 0, .1); } .carousel-control-prev-icon { background-image: url(/images/rum-left-arrow.svg); } .carousel-control-next-icon { background-image: url(/images/rum-right-arrow.svg); } .carousel-control-prev { left: -15%; } .carousel-control-next { right: -15%; } .testimonial-card__quote { font-family: ZohoPuvi-RegIT, sans-seri; font-style: italic; padding: 1rem; font-size: 0.9375rem; } .testimonial-card-bio span { display: block; font-size: 11px; color: #333; } .testimonial-card-bio p { color: #000; } .testimonial-card-bio { position: relative; } .testimonial-card-bio:before { content: ''; border-top: 2px solid #a5d061; width: 100px; position: absolute; margin: 0 auto; top: -15px } @media (min-width:576px) { .content-wrap { max-width: 540px; } .hero-wrap { max-width: 540px; } } @media (min-width:768px) { .content-wrap { max-width: 720px } .hero-wrap { max-width: 720px; } } @media only screen and (min-width: 1200px) { .hero-banner { position: absolute; left: 68px; } } @media only screen and (min-width: 1400px) { .hero-banner { transform: scale(1.2); } } @media (min-width:992px) { .content-wrap { max-width: 960px; } .hero-wrap { max-width: 960px; } .tab-active { box-shadow: 0px 0px 15px 2px #e6e6e6; } } @media (min-width:1200px) { .content-wrap { max-width: 1140px; } .col-xl-one-fifth { flex: 0 0 20%; max-width: 20%; } .hero-wrap { max-width: 1140px; padding-top: 4rem; padding-bottom: 4rem; } } ol, ul { list-style: none; padding: 0px; margin: 0px; } t { border-collapse: collapse; border-spacing: 0 } embed, img, object, video { max-width: 100%; height: auto; } video { width: 100% } a { color: #000; text-decoration: none; } a:hover { color: #000; cursor: pointer; text-decoration: none; } *, :after, :before { -webkit-box-sizing: border-box; box-sizing: border-box } /*a:focus { outline:0; }*/ /************ Header *********/ @media (min-width: 992px) { .fixed-top { position: sticky; top: 0; right: 0; left: 0; z-index: 1030; } } @media only screen and (min-width : 320px) and (max-width : 991px) { .nav-item-btn-width { flex: 0 0 45%; } .nav-login-btn { background: #e2e6ea; text-align: center; padding: .35rem .7rem; display: block; border: 1px solid #dae0e5; } .nav-login-btn-ml { margin: 0px 10px; } } @media only screen and (min-width : 320px) and (max-width : 767px) { .navbar-toggler { border: none; border-radius: 0px; padding: 0px; } .navbar-toggler-icon { width: 1.2em; height: 1.2em; } } /* ---------------------------------------------------------------- Featured Boxes -----------------------------------------------------------------*/ .nav-pills .nav-link.active, .nav-pills .show>.nav-link { color: #333; background-color: #eee; } .grey_bg { background-color: #f3f4f4; } .breadcrumb { background-color: transparent; font-size: 11px; } .hero-bg { background-image: url(/images/index-bg-cloud.svg); background-repeat: no-repeat; background-position: bottom center; background-size: cover; } .nav-container { width: 100%; max-width: 1280px; margin: 0 auto; } /******** Content Section End***********/ /******** Pricing ********/ .panel { width: 100% !important; } .cd-panel { position: relative; top: -64px; z-index: 1; } .cd-panel-content { position: relative; top: 0px; overflow: inherit !important; } .enterprise_box_height { height: 586px; } .main_text { font-size: 0.9375rem; } .addon_section ul li div { font-size: 0.8125rem; color: #000; } ul.tab-nav:not(.tab-nav-lg) li { -moz-border-bottom-colors: none; -moz-border-left-colors: none; -moz-border-right-colors: none; -moz-border-top-colors: none; float: left; height: 45px; text-align: center; width: 20%; border-radius: 0px; } ul.tab-nav:not(.tab-nav-lg) li a { display: block; padding: 15px; } @media (min-width: 280px) { ul.tab-nav.tab-nav2 li a { background-color: #efefef; border-radius: 0px; height: 45px; line-height: 14px; font-size: 9px; font-weight: 500; border-radius: 0px; color: #888; padding: 6px 4px; } ul.tab-nav.tab-nav2 li.ui-state-active a { background-color: #fafafa !important; color: #000; font-size: 9px; font-weight: 700; height: 45px; line-height: 14px; top: 0; border-radius: 0px; border-bottom: 3px solid #83b633; } } @media (min-width: 576px) { ul.tab-nav.tab-nav2 li a { font-size: 11px; } ul.tab-nav.tab-nav2 li.ui-state-active a { font-size: 11px; ; } } @media (min-width: 768px) { ul.tab-nav.tab-nav2 li a { font-size: 0.9375rem; height: 60px; } ul.tab-nav.tab-nav2 li.ui-state-active a { font-size: 0.9375rem; height: 60px; } ul.tab-nav.tab-nav2 li.ui-state-active a p { color: #000; } ul.tab-nav.tab-nav2 li a p { color: #888; } .site24x7_text-2 { font-size: 11px; } } @media (max-width: 768px) { #header.full-header .container { width: 100% !important; } #header { text-align: left !important; } .pricing.pricing-5 .pricing-box { float: none; width: 100%; } ul.tab-nav.tab-nav2 { border: 1px solid #ddd; height: auto; width: auto; } } .addon_section ul li { font-size: 0.8125rem; line-height: 24px; } .accordion-control { display: block; padding: .75rem; position: relative; } .accordion-control.collapsed:after { content: '\002B'; position: absolute; right: 15px; } .accordion-control:not(.collapsed):after { content: '\2212'; position: absolute; right: 15px; } .pricing-title, .pricing-title h3 { font-size: 1.375rem; font-family: 'ZohoPuvi', sans-serif; } #website .pricing-title, #allinone .pricing-title { background-color: #f6f6f6; padding: 8px; } .currency a { font-size: 0.8125rem; color: #ddd; font-weight: 100; text-decoration: none; border-bottom: 0px !important; } .pricing-box { background-color: #fff; border: 1px solid rgba(0, 0, 0, 0.125) !important; } .pricing-box ul li { font-size: 0.8125rem; line-height: 2.2; } .hoverct { border: 1px solid rgb(255, 250, 202) !important; border-radius: 6px; font-size: 9px; padding: 8px 16px; position: absolute; display: block; width: 500px !important; z-index: 5; box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .15); background-color: #fffdce !important; display: none; bottom: 26px; left: -125px; } .hoverct>p { line-height: 1.2; margin: 0px 0px 0.5em; text-align: left; } .leftbox { position: relative; } .hoverct::after { border-color: rgb(255, 253, 206) transparent transparent !important; border-style: solid; border-width: 16px 16px 0px; bottom: -6px; content: ''; height: 0px; left: 61px; position: absolute; width: 0px; } .pop_text li { text-align: left !important; color: #444 !important; list-style-position: outside; padding: 0 10px; margin-left: 18px; } .pop_text { font-size: 12px; color: #000; } .pricing-box.best-price, .best-price.pack_header { margin: 0px; box-shadow: none; border: 2px solid #83b633 !important; } .site24x7_text-2 { font-size: 11px; } .pricing-box.pricing-extended .pricing-action-area { background-color: #f9f9f9; border-left: 1px solid rgba(0, 0, 0, 0.05); border-right: 1px solid rgba(0, 0, 0, 0.05); border-radius: 0 3px 3px 0; padding: 10px 8px 0px; position: relative; text-align: center; float: left; } .price-amount { font-size: 2.375rem; font-family: 'ZohoPuviSemBd', sans-serif; } /******** Pricing End *********/ /********* footer***********/ #footer { background-color: #eee; border-top: none; position: relative; } #copyrights { background-color: #ddd; font-size: 0.75rem; margin-bottom: 0.3125rem; } /****** footer end *******/ .icon-list { list-style-position: outside; list-style-type: disc; margin-left: 2rem; } .pricing-btn { display: inline-block; font-family: 'ZohoPuviSemBd', sans-serif; padding: 0.5rem 1.5rem; text-align: center; text-transform: uppercase; -webkit-transition: all .5s ease 0s; transition: all .5s ease 0s; margin: 0; border: 1px solid transparent; cursor: pointer; z-index: 1; font-size: 0.9375rem; } .pricing-btn--green { background: #83b633; color: #fff; } .pricing-btn:hover { color: #fff; text-decoration: none; } .pricing-btn__text { font-size: 11px; font-weight: 400; display: block; font-family: 'ZohoPuvi', sans-serif; pointer-events: none; } .signup-btn { display: inline-block; font-family: 'ZohoPuviSemBd', sans-serif; padding: 0.375rem .75rem; text-transform: uppercase; font-size: 0.9375rem; font-weight: 500; transition: color .15s ease-in-out, background-color .15s ease-in-out; } .signup-btn--green { background: #83b633; color: #fff !important; border: 1px solid #83b633; } .signup-btn__text { font-size: 11px; font-weight: 400; display: block; font-family: 'ZohoPuvi', sans-serif; } .nav-signup-btn { display: block; font-family: 'ZohoPuviSemBd', sans-serif; padding: 0.5rem 0.8125rem; font-size: 0.9375rem !important; text-transform: uppercase; line-height: normal; text-align: center; } .zoho-logo { background-image: url('../images/zoho-logo-web.svg'); background-repeat: no-repeat; background-position: center; background-size: 61px 27px; width: 61px; height: 27px; display: inline-block; margin-bottom: -7px; } .footer-wrap { width: 100%; max-width: 1280px; margin: 0 auto; padding: 2rem 1rem; } .footer-wrap h5 { font-size: 1rem; font-family: "ZohoPuviSemBd", sans-seri; font-weight: bold; } .related-feature-list { display: flex; flex-direction: row; justify-content: center; flex-wrap: wrap; } .related-feature-list__item { position: relative; list-style: none; padding: 0 0.3125rem 0 0.3125rem; } .related-feature-list__item a:hover { text-decoration: underline; color: #83b633; } .related-feature-list__item:after { content: ''; position: absolute; height: 12px; width: 1px; background: #000; right: 0px; top: 6px; } .related-feature-list__item:last-child:after { content: none; } .device-logo-tile { display: flex; justify-content: center; padding: 20px 0px; margin: 10px; border: 1px solid #ccc; } .device-logo-tile:hover { background-color: #eee; transition: background-color 0.2s linear; } .pricing-s247-logo { display: inline-block; background-image: url(/images/site24x7-blacklogo.svg); background-repeat: no-repeat; background-position: center; width: 50px; height: 10.19px; } .bg-banner-solid { width: 100%; position: relative; } .bg-banner-solid--yellow { background-color: #fcf3e4; } .bg-banner-solid--grey { background-color: #f8f9fa; } .bg-banner-solid--blue { background-color: #eaf5ff; } .modal-zoom-icon { position: absolute; bottom: 0%; left: 5%; } .terms-text { font-size: 0.8125rem; font-style: italic; display: block; } .video-container { position: relative; padding-bottom: 56.35%; padding-top: 35px; height: 0; overflow: hidden; } .video-container iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .ft-sec-nav { position: relative; padding: 10px; list-style: none; } .ft-sec-nav:after { position: absolute; content: ''; height: 10px; width: 1px; background: #000; right: 0; top: 14px; } .ft-sec-nav:last-child:after { content: none; } .testimonial-author { font-size: 1rem; display: block; } .testimonial-designation, .testimonial-company { display: block; font-size: 0.6875rem; color: #666; } .footer-social-icon { width: 20px; height: 20px; background-size: contain; background-repeat: no-repeat; } @media only screen and (min-width: 768px) { .scroll-spy-container { height: 800px; overflow: auto; } } .recap-cloud-bg { background-image: url(/images/recap-cloud.svg); background-repeat: no-repeat; background-position: bottom center; background-size: cover; } /*css rules for search on mobile devices*/ .s247-search-container { position: fixed; top: 0px; left: 0px; z-index: 1000; width: 100%; border-bottom: 1px solid #cdcdcd; transition: transform 700ms ease-in-out; will-change: transform; transform: translateY(-250px); } .s247-search-wrap { position: relative; background: #ffffff; z-index: 2; margin: 0 auto; } .s247-search-box { max-width: 700px; margin: 0 auto; padding: 32px 16px; } .s247-search-form { position: relative; } .s247-search-field { width: 100%; padding: 8px; border: 1px solid #C1C7D0; } .s247-search-submit { color: transparent; background-color: transparent; border: none; padding: 0px; background: url(/images/search-icon-asset.svg); background-repeat: no-repeat; background-size: 20px; width: 20px; height: 20px; position: absolute; top: 12px; right: 10px; } .global-search-icon { display: inline-block; background-image: url(/images/global-search-icon.svg); background-repeat: no-repeat; background-size: 13px auto; width: 14px; height: 14px; background-position: center; cursor: pointer; background-color: transparent; border: none; } .overlay { position: fixed; width: 100%; height: 100%; top: 0; bottom: 0; right: 0; left: 0; opacity: 0; visibility: hidden; background-color: rgba(0, 0, 0, 0.5); transition: opacity 700ms ease-in-out; } .overlay-active { opacity: 1; visibility: visible; z-index: 2; } .search-active { transform: translateY(0px); } #search-query:focus { outline-width: 2px; } @media only screen and (min-width: 992px) { .search-wrap { height: 52px; padding: 0px 1rem; display: flex; align-items: center; position: relative; } .search-btn, .close-btn { z-index: 2; } .search-wrap .search-field { width: 0px; height: 40px; opacity: 0; background: #f1f3f4; border-radius: 2px; border: 0px; font-size: 0.8125rem; font-family: 'ZohoPuvi', sans-serif; padding: 0.5rem 0.625rem; position: absolute; right: 10%; transition-property: width, opacity, visibility; transition-duration: 400ms; transition-timing-function: ease-in-out; } .search-wrap .search-field:focus { outline-width: 2px; } .search-field::placeholder { color: rgba(0, 0, 0, 0.25); } .search-wrap .search-close { display: none; } .search-wrap.search-visible .global-search-icon { display: none; } .search-wrap.search-visible .search-close { display: block; } .search-wrap.search-visible .search-field { width: calc(100vw - 350px); opacity: 1; } .search-close { display: inline-block; background: url(/images/search-close.svg); background-repeat: no-repeat; background-position: center; cursor: pointer; background-size: 13px; width: 13px; height: 13px; background-color: transparent; border: none; } } @media only screen and (min-width: 1200px) { .search-wrap.search-visible .search-field { width: calc(1280px - 375px); } } .cookie-banner { padding: 1rem; text-align: center; background-color: #f8f9fa; font-size: 0.8125rem; } .promo-resource-card-title { display: inline-block; color: #FF9900; text-transform: uppercase; font-size: 0.8125rem; line-height: 1.6; } .btn-outline { border: 1px solid #000; color: #000; background-color: transparent; font-size: 0.8125rem; border-radius: 0px; } .accordion-trigger { position: relative; display: block; } .accordion-trigger:not(.collapsed)::after { content: ''; position: absolute; background-image: url(/images/keyboard-arrow-up.svg); background-repeat: no-repeat; background-size: contain; width: 20px; height: 20px; top: 0px; right: 0px; } .accordion-trigger.collapsed::after { content: ''; position: absolute; background-image: url(/images/keyboard-arrow-down.svg); background-repeat: no-repeat; background-size: contain; width: 20px; height: 20px; top: 0px; right: 0px; } .signup-btn--outline { color: #83b633 !important; border: 1px solid #83b633; background: transparent; } @media (hover: hover) and (pointer: fine) { .signup-btn--outline:hover { color: #fff !important; background-color: #83b633; } } .main-feature-list>li { list-style: none; display: block; position: relative; padding-left: 1.5rem; font-size: 0.875rem; line-height: 2; } .main-feature-list>li:before { content: ''; position: absolute; width: 11px; height: 7px; border-left: 2px solid #83b633; border-bottom: 2px solid #83b633; transform: rotate(-50deg); top: 10px; left: 0px; } .scroll-more-container { position: absolute; bottom: 5%; left: 50%; transform: translate(-50%, -50%); cursor: pointer; } @media (max-width: 330px) { .s247-search-box { padding-right: 6px; padding-left: 6px; } } .main-heading { display: inline-block; font-family: 'ZohoPuviSemBd', sans-serif; font-size: 2.125rem; line-height: 1.2; } .content-heading { font-size: 1.375rem; } /* .webinar-group-item { font-size: .8125rem; position: relative; } .webinar-group-item::after { content: ''; position: absolute; height: 15px; width: 1px; right: 0px; top: 2px; background-color: #000; } .webinar-group-item-last::after { content: none; } */ @media(max-width: 307px) { .webinar-group-item-last { padding-left: 0px !important; } } .resource-menu-btn { padding: 0.5rem 0.8125rem; } .big-intro { height: 80%; background-image: linear-gradient(0deg, rgba(0, 0, 0, 0) 20%, rgba(30, 136, 229, 0.5) 100%); clip-path: none; } .heading-label__text { display: inline-block; position: relative; text-transform: uppercase; font-size: 14px; } @media only screen and (min-width: 1200px) { .big-intro { height: 100vh; clip-path: polygon(0% 0%, 100% 0%, 100% 95%, 0% 100%); position: relative; } } /*multi laguage styles starts*/ /*de cloud montoring css*/ .amazon-web-services { display: flex; flex-wrap: wrap; margin-right: -15px; margin-left: -15px; } .amazon-web-services img { width: 40px; height: 40px; margin-bottom: 10px; } .amazon-web-services>div { max-width: 25%; -ms-flex: 0 0 25%; flex: 0 0 25%; float: left; } .feature-header { font-size: 1.2rem; } .feature-list>li { position: relative; padding-left: 25px; margin-bottom: 8px; } .testimonal-quote { font-family: ZohoPuvi-RegIT, sans-seri; font-size: 1rem; font-weight: 300; margin: 0px; } .image-header { font-family: ZohoPuvi-RegIT, sans-seri; font-style: italic; font-size: .8125rem; } .testimonial-bio { font-family: 'ZohoPuviSemBd', sans-serif; margin-bottom: 0px; } .testimonial-bio-company { color: #333; } .line-divider { height: 1px; width: 25%; border-top: 1px solid #000; margin: 20px 0px; } .feature-list>li::before { content: ''; width: 11px; height: 7px; border-left: 2px solid #1a237e; border-bottom: 2px solid #1a237e; transform: rotate(-50deg); position: absolute; left: 0px; top: 8px; } blockquote p::before { content: '\201C' } blockquote p::after { content: '\201D'; } @media (min-width: 1200px) { .mb-17 { margin-bottom: 17rem; } .pb-8 { padding-bottom: 8.5rem; } } @media (min-width: 1200px) { .video-wrap { max-width: 800px; top: -7%; left: 49%; } } @media (min-width: 1400px) { .video-wrap { max-width: 900px; top: -15%; left: 50%; } } @media (min-width: 1200px) and (max-width: 1400px) { .img-display-none { display: none !important; } .img-position-1 { position: absolute; left: 65%; top: -1%; } .img-position-2 { position: absolute; left: 60%; top: 38%; } .img-position-3 { position: absolute; left: 67%; top: 10%; } } @media (min-width: 1400px) { .img-position-1 { position: absolute; left: 57%; top: -1%; } .img-position-2 { position: absolute; left: 54%; top: 38%; } .img-position-3 { position: absolute; left: 58%; top: 10%; } } /*english synthetic css*/ .sub-heading { font-family: 'ZohoPuvi', sans-serif; font-size: 1rem; } .main-heading { display: inline-block; font-family: 'ZohoPuviSemBd', sans-serif; font-size: 2.25rem; line-height: 1.2; } .content-heading { font-size: 1.5rem; } .testimonial-author { font-size: 1.125rem; } .testimonial-bio { color: #bdbdbd; font-size: .9375rem; } .mb-four-and-half { margin-bottom: 1.875rem; } .slider-counter-total { color: #bdbdbd; } .opacity-half { opacity: 0.5; } /*english cloud-monitoring css*/ .product-box { padding: 1.5rem; } .product-box__icon { display: inline-block; width: 45px; height: 33px; background-size: contain; background-repeat: no-repeat; } .product-box__heading { color: #ffffff; font-size: 1.0625rem; line-height: 1.2; } .product-box--web { background-color: rgb(32, 171, 142); } .product-box--server { background-color: #00204A; } .product-box--cloud { background-color: rgb(249, 187, 19); } /*spanish-index css*/ .spanish-product-box .product-box, .italiano-product-box .product-box, .vietnam-product-box .prduct-box, .thai-product-box .prduct-box { height: 150px; } .spanish-product-box .product-box__icon { margin-top: 10px; } .product-box--network { background-color: rgb(59, 106, 192); } .product-box--apm { background-color: rgb(17, 153, 158); } .product-box--rum { background-color: rgb(248, 88, 96); } /*spanish-apm css*/ .zoom-icon .fa { font-size: 1rem; color: #000; position: absolute; bottom: 5px; } /*es-contact support css*/ .social-logo-width { width: 24px; } .social-anchor { display: inline-block; margin-right: 1rem; } .bc-signup2 a { display: block; font-size: 16px; line-height: 20px; margin-top: 2px; text-align: center; text-transform: uppercase; background: none 0px 0px repeat scroll #eee; padding: 14px; } /*french-css*/ .french-product-box .product-box__icon { color: #fff; margin-top: 5px } .french-product-box .product-box { height: 140px; } /*portugues-css*/ .portugues-prdouct-box .product-box { height: 175px; } /*chinese css*/ .chinese-product-box .product-box, .korean-product-box .product-box { height: 130px; } .netharland-product-box .product-box { height: 150px; } .swedish-polish .product-box { height: 152px; } /*eleventy cloudspend index.html css added*/ .realign { position: absolute; top: 0; left: 0; height: 100%; width: 50%; overflow: hidden; } .realign>img { max-width: none; } .handle { /* Thin line seperator */ position: absolute; left: 50%; top: 0; bottom: 0; width: 4px; margin-left: -2px; background: #1e66a1; cursor: ew-resize; } .handle:after { /* Big orange knob */ content: "< >"; position: absolute; top: 50%; border-radius: 50%; left: 50%; width: 40px; height: 40px; color: white; font-size: 20px; text-align: center; vertical-align: center; background: #1e66a1; margin: -20px 0 0 -20px; line-height: 40px; } .draggable:after { width: 48px; height: 48px; margin: -24px 0 0 -24px; line-height: 48px; font-size: 30px; } .ba-container { position: relative; overflow: hidden; } .ba-container img { width: 100%; display: block; } /*eleventy cloudspend pricing.html css added*/ .german-pricing-table, .spanish-pricing-table, .french-pricing-table, .chinese-pricing-table, .indonesia-pricing-table, .thai-pricing-table, .vietnam-pricing-table { width: 80% !important; margin: 0 auto; } .german-pricing-card-header, .spanish-pricing-card-header, .french-pricing-card-header, .chinese-pricing-card-header, .indonesia-pricing-card-header, .thai-pricing-card-header, .vietnam-pricing-card-header { font-size: 1.75rem; } .german-pricing-table thead th, .spanish-pricing-table thead th, .french-pricing-table thead th, .chinese-pricing-table thead th, .indonesia-pricing-table thead th, .thai-pricing-table thead th, .vietnam-pricing-table thead th { vertical-align: middle; text-align: center; padding: 1rem; border-right: 1px solid rgba(0, 0, 0, .125); } .german-pricing-table td, .spanish-pricing-table td, .french-pricing-table td, .chinese-pricing-table td, .indonesia-pricing-table td, .thai-pricing-table td, .vietnam-pricing-table td { vertical-align: middle; text-align: center; width: 50%; padding: 1rem; border-right: 1px solid rgba(0, 0, 0, .125); } .german-pricing-table tr, .spanish-pricing-table tr, .french-pricing-table tr, .chinese-pricing-table tr, .indonesia-pricing-table tr, .thai-pricing-table tr, .vietnam-pricing-table tr { border: 1px solid rgba(0, 0, 0, .125); } /*eleventy german statusiq index.html css*/ .german-feature-card, .french-feature-card, .thai-feature-card, .vietnam-feature-card, .multilang-feature-card { position: relative; padding: 12px 22px; background-color: #fff; border-radius: 4px; box-shadow: 0 10px 30px 0 rgba(145, 145, 197, .1), 0 5px 15px 0 rgba(0, 0, 0, .07); display: flex; flex-direction: column; } /*eleventy statusiq pricing css*/ .german-tooltip-info-icon, .spanish-tooltip-info-icon, .french-tooltip-info-icon, .chinese-tooltip-info-icon, .indonesia-tooltip-info-icon, .thai-tooltip-info-icon, .vietnam-tooltip-info-icon { display: inline-block; background-image: url(/images/info-24px.svg); background-repeat: no-repeat; width: 16px; height: 16px; background-size: contain; position: absolute; margin-left: 4px; } .german-tooltip-feature-info-icon, .spanish-tooltip-feature-info-icon, .french-tooltip-feature-info-icon, .chinese-tooltip-feature-info-icon, .indonesia-tooltip-feature-info-icon, .thai-tooltip-feature-info-icon, .vietnam-tooltip-feature-info-icon { top: 6px; } .german-pricing-wrapper-row__card, .spanish-pricing-wrapper-row__card, .french-pricing-wrapper-row__card, .chinese-pricing-wrapper-row__card, .indonesia-pricing-wrapper-row__card, .thai-pricing-wrapper-row__card, .vietnam-pricing-wrapper-row__card { flex: 0 0 100%; max-width: 100%; border: 1px solid rgba(0, 0, 0, 0.125); background-color: #fff; padding: 1.5rem .75rem; margin-bottom: 3rem; border-radius: .25rem; } @media (min-width: 768px) { .german-pricing-wrapper-row__card, .spanish-pricing-wrapper-row__card, .french-pricing-wrapper-row__card, .chinese-pricing-wrapper-row__card, .indonesia-pricing-wrapper-row__card, .thai-pricing-wrapper-row__card, .vietnam-pricing-wrapper-row__card { flex: 0 0 45%; max-width: 45%; } } .german-pricing-currency, .spanish-pricing-currency, .french-pricing-currency, .chinese-pricing-currency, .indonesia-pricing-currency, .thai-pricing-currency, .vietnam-pricing-currency { display: inline-block; position: relative; top: -20px; font-size: 16px; line-height: 1.2; right: -3px; } .german-pricing-billed-annually, .spanish-pricing-billed-annually, .french-pricing-billed-annually, .chinese-pricing-billed-annually, .indonesia-pricing-billed-annually, .thai-pricing-billed-annually, .vietnam-pricing-billed-annually { display: inline-block; font-size: 48px; font-weight: 600; line-height: 1.2; } .german-pricing-metric, .spanish-pricing-metric, .french-pricing-metric, .chinese-pricing-metric, .indonesia-pricing-metric, .thai-pricing-metric, .vietnam-pricing-metric { font-size: 15px; margin-bottom: 8px; line-height: 1.2; position: relative; } .german-pricing-billed-monthly, .spanish-pricing-billed-monthly, .french-pricing-billed-monthly, .chinese-pricing-billed-monthly, .indonesia-pricing-billed-monthly, .thai-pricing-billed-monthly, .vietnam-pricing-billed-monthly { color: #9e9e9e; text-decoration: line-through; } .german-custom-select, .spanish-custom-select, .french-custom-select, .chinese-custom-select, .indonesia-custom-select, .thai-custom-select, .vietnam-custom-select { width: auto; } .dot-pattern { background-image: url(/images/dots.svg); width: 150px; height: 75px; position: absolute; background-repeat: repeat; z-index: -1; } .dot-pattern-left { bottom: 25px; left: -74px; } /*chinese web-site css added*/ @media (min-width: 1400px) { .chinese-video-wrap, .italian-video-wrap { max-width: 720px; top: 11%; } .vietnam-video-wrap { max-width: 720px; top: 5%; } .vietnam-network-video-wrap { max-width: 600px; top: 17%; } } @media (min-width: 1200px) { .chinese-video-wrap, .italian-video-wrap { max-width: 600px; top: 15%; left: 50%; } .vietnam-video-wrap { max-width: 600px; top: 15%; left: 50%; } .vietnam-network-video-wrap { max-width: 650px; top: 17%; } } /*korean img css*/ .ko-img-position-1 { top: -16%; } .ko-img-position-2 { top: 28%; } .customer-logo-grid { display: flex; flex-direction: row; justify-content: space-between; } /*plugins box css*/ @media (min-width: 768px) { .mult-lag-col-md-two-and-half { max-width: 20%; flex: 0 0 20%; } } @media only screen and (min-width: 1200px) { .multilang-hero-banner { position: absolute; left: 68px; } } @media only screen and (min-width: 1400px) { .multilang-hero-banner { transform: scale(1.7); position: absolute; left: 238px; } } .border-bottom-dotted { border-bottom: 1px dotted #cccccc; } @media (min-width: 1200px) { .hoverct-basic-xl>.hoverct { left: 140px; bottom: -180px; } .hoverct-basic-xl>.hoverct-multilanguage { bottom: -325px; } .hoverct-basic-xl>.hoverct-french { bottom: -415px; } .hoverct-enterprise-web>.hoverct { bottom: -65px; left: 110px; } .hoverct-basic-xl>.hoverct::after { left: -5%; transform: rotate(87deg); top: 61%; } .hoverct-offset>.hoverct { left: 235px; } .hoverct-advanced-xl>.hoverct { left: 190px; bottom: -125px; } .hoverct-advanced-xl>.hoverct::after { left: -5%; transform: rotate(87deg); top: 50%; } .tooltip-offset-server>.hoverct { left: 185px; bottom: -95px; } .tooltip-offset-apm>.hoverct { left: 105px; bottom: -106px; } .tooltip-offset-all>.hoverct { left: 150px; } .tooltip-offset-msp>.hoverct { left: 150px; } } .main-feature-list-ml li:before { top: 21px; left: 19px; } .main-feature-list-ml li { padding-left: 2.5rem; } .menu-item { display: inline-block; box-shadow: 0px 6px 10px 0px rgba(0, 0, 0, 0.15); padding: 0px 30px 0px 30px; } .bg-white { background-color: #fff !important; } @media (min-width: 992px) { .nav-menu { top: 80px; } } .nav-menu { position: -webkit-sticky; position: sticky; } .navlist:first-child { padding-left: 0px; } .navlist { list-style: none; float: left; padding: 15px; position: relative; cursor: pointer; } .navlist.active>span { color: #83b633 !important; } .navlist-link { color: #000; font-family: ZohoPuvi, Helvetica, sans-serif; font-size: 0.8125rem; cursor: pointer; } .navlist:after { content: ''; position: absolute; top: 50%; height: 10px; width: 1px; background-color: #333; -webkit-transform: translateY(-50%); transform: translateY(-50%); right: 0; } .privacy-policy ul li, .security-policy ul li { position: relative; padding: 0 0 0 35px; font-size: 16px; margin: 20px 0; } .privacy-policy ul li span, .security-policy ul li span { border: 1px solid #24cc8b; display: block; width: 22px; height: 22px; border-radius: 50%; position: absolute; left: 0; top: 5px; } .privacy-policy ul li span::before, .security-policy ul li span::before { background: #24cc8b; width: 2px; height: 5px; content: ""; position: absolute; left: 6px; top: 9px; transform: rotate(-45deg); -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -moz-transform: rotate(-45deg); } .privacy-policy ul li span::after, .security-policy ul li span::after { background: #24cc8b; width: 2px; height: 10px; content: ""; position: absolute; left: 11px; top: 6px; transform: rotate(45deg); -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); -moz-transform: rotate(45deg); } .customer-logo-grid { display: flex; flex-direction: row; justify-content: space-between; } .customer-logo-grid .logo { flex: 0 0 auto; } @media only screen and (max-width: 576px) { .customer-logo-grid { flex-wrap: wrap; } } .geo-filter { height: 36px; background-color: #f5f5f5; border: #f5f5f5; outline: none; } .industry-segment { position: absolute; height: 30px; background: #000; color: #fff; text-align: center; border-radius: 4px; display: block; top: -15px; left: 10px; padding: 8px; font-size: 14px; line-height: 14px; } .customers .customer { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } #resource-menu>a { color: #83b633; } #resource-menu>.link-caret::after { border-top: 1px solid #83b633; border-right: 1px solid #83b633; } .resource-menu-dropdown::before { border-bottom-color: #EEEEEE; } .card-label { position: absolute; width: 132px; top: 8px; left: 0px; background-color: #01579B; } .card-label-text { padding: 4px 13px 3px 8px; font-size: 1rem; line-height: 1.4; } .card-label-text::after { content: ''; border: 15px solid transparent; border-right-color: #fff; position: absolute; right: 0; top: 0; } .profile-img { width: 50px; } .btn--grey { background-color: #6c757d; border: 1px solid #6c757d; color: #fff; cursor: pointer; } .webinar-nav-pills .nav-link.active { color: #333; background-color: #f5bc4f; } .webinar-nav-item a.nav-link:hover { color: #000; } .webinar-arrow { position: absolute; color: #fff; left: 50%; top: 45%; font-size: 30px; line-height: 1; } /*multi laguage styles End*/ /* Start resources styles */ .info-block .card-title { font-size: 1.125rem; } .curve-line { border-bottom: 2px solid #84B640; } .dot-index { z-index: 1; } .dot-pattern-top { top: 0; left: -45px; height: 150px; } .info-block .video-container { padding-top: 0; } .video-container .video-cover, .video-container .play-text { top: 0; bottom: 0; margin: auto } .video-container .play-text { height: 1.5em; font-size: 30px; line-height: 1.5; text-shadow: 0 0 0.5em black } /* End resources styles */ /* floating start*/ .floating-buttons { display: flex; flex-direction: column; position: fixed; bottom: 55vh; right: 0; z-index: 998; background-color: #f5bc4e; padding: 10px; width: 75px; border-radius: 5px 0px 0px 5px; animation: slideIn 0.5s ease-out; } @media screen and (min-width: 800px) { .floating-buttons:lang(es) { width: 112px; } } @media screen and (min-width: 800px) { .floating-buttons:lang(de) { width: 85px; } } @media screen and (min-width: 800px) { .floating-buttons:lang(pt) { width: 120px; } } @media screen and (min-width: 800px) { .floating-buttons:lang(fr) { width: 95px; } } .floating-buttons a li { list-style-type: none; font-size: 15px; line-height: 18px; } .floating-buttons a button { font-size: .8rem; outline: none; border: none; color: #fff; max-width: max-content; font-family: 'ZohoPuviSemBd', sans-serif; background: #7cb330; /*border-top-left-radius: 10px; border-bottom-left-radius: 10px;*/ transition: .2s all ease-in-out; margin-top: 8px; animation: slideIn .5s ease-in forwards; } .floating-buttons a button:hover { cursor: pointer; background: #5d8327; } /*.floating-buttons a .request-demo::before { content: 'Request Demo'; } .floating-buttons a .request-quote::before { content: 'Request Quote'; } .floating-buttons a .site24x7-training::before { content: 'Site24x7 Training'; }*/ .floating-pop-up { z-index: 1000; display: flex; justify-content: center; align-items: center; width: 100%; height: 100%; position: fixed; overflow-y: auto; background-color: rgba(0, 0, 0, .5); } .floating-buttons a img { width: 40px; transition: all 0.5s ease; height: 26px; } .request-demo:hover img, .request-quote:hover img { transform: scale(1.1); } .request-demo { border-bottom: 2px solid #e19f22; } @keyframes slideIn { 0% { transform: translateX(100px); opacity: 0; } 50% { transform: translateX(30px); opacity: 0; } 100% { transform: translateX(0); opacity: 1; } } @keyframes fadeInUp { 0% { opacity: 0; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0) } to { opacity: 1; -webkit-transform: translateZ(0); transform: translateZ(0) } } @media screen and (max-width: 768px) { .floating-buttons { display: flex; flex-direction: none; position: fixed; bottom: 0; right: 0; z-index: 998; background-color: #f5bc4e; padding: 5px; width: 100%; border-radius: 5px 0px 0px 5px; animation: fadeInUp 0.5s ease-out; } } @media (max-width: 575px) { .siq_bR { bottom: 80px !important; right: 7px; } .request-demo { border-bottom: none !important; } } /* floating end*/ @media (max-width:767px) { .zsiq_flt_rel #titlediv { display: none; } } /* floating end*/ /* header style */ @media screen and (min-width: 1030px) { .navbar { height: 80px; } .navbar-brand img { width: 130px; } .dropdown-menu { top: 56px !important; border-top: 2.2px solid #83b633 !important; } } .dropdown-menu:before { display: none } .resource-menu-dropdown>.dropdown-item:first-child:hover::before, .resource-menu-dropdown::before { display: none; } /* header style */ /* left-nav-css-starts */ .side-bar-bg { background-color: #fafafa; } .nav-link-size { font-size: 0.875rem; line-height: 1.4; } .sidebar-toggle { border: 0px; padding: 0px; background-color: #e0e0e0; display: flex; position: fixed; right: 10px; top: 80px; height: 40px; width: 40px; align-items: center; justify-content: center; z-index: 10; border-radius: 50%; display: none; } .sidebar-toggle-menu { width: 20px; height: 12px; position: relative; } .nav-child-list { display: none; visibility: hidden; opacity: 0; transition: all 500ms ease-in-out; } .nav-link-child { font-size: 0.8125rem; } .nav-link-child::before { content: '\\FF0D'; position: absolute; left: -18px; top: -1px; } .sidebar-nav-link.active { color: #fff; font-weight: bold; } .nav-link-parent.active~.nav-child-list { display: block; visibility: visible; opacity: 1; } .sidebar-nav a { color: #000000; transition: 0.5s all ease; } .py-two-and-half.active a { color: #fff; transition: 0.5s all ease; } .sidebar.show { transform: translateX(0); } .side-bar-icon { margin-right: 15px; font-size: 16px !important; color: #bbc0ce; } .py-two-and-half.active { background-color: #1c464c; color: #fff; transition: 0.5s all ease; } .py-two-and-half.active:hover { background: #1c464c; } .py-two-and-half:hover { background-color: rgb(27 67 73 / 12%); color: #fff; transition: 0.5s all ease; } .py-two-and-half { transition: 0.5s all ease; } .py-two-and-half.active .side-bar-icon, .py-two-and-half:hover .side-bar-icon { color: #fff; transition: 0.5s all ease; } .sidebar-nav-link { display: flex; align-items: center; } .sidebar-nav-link.nav-link-parent img { width: 30px; height: 30px; margin: 0 auto; } .sidebar-nav-link.nav-link-parent span.sidebar-circle { width: 30px; height: 30px; background: #fafafa; padding: 5px; border-radius: 50px; margin-right: 15px; display: flex; align-items: center; } @media(min-width:576px) { .sidebar { max-width: 360px; } } @media(max-width:767px) { .sidebar-nav { overflow-y: scroll; height: 700px; display: none; } .sidebar { z-index: 9; } } @media(min-width:768px) { .sidebar { position: sticky; position: -webkit-sticky; top: 80px; transform: translateX(0); width: 100%; max-width: 100%; transition: none; will-change: initial; height: 100%; } #select-sec { display: none; } } /* left-nav-css-end */ /*end user html css*/ div#swipeGallery { width: 100%; max-width: 640px; margin: 0px; } div#swipeGallery2 { width: 100%; max-width: 640px !important; margin: 0px; } div#thumbHolder { height: 130px; width: 100%; background: #fff; text-align: center; overflow: hidden; position: relative; } div#thumbHolder2 { height: 130px; width: 100%; background: none; text-align: center; overflow: hidden; position: relative; } div#thumbHolder ul { height: 100px; padding: 0; margin: 0; list-style: none; white-space: nowrap; overflow-y: hidden; overflow-x: hidden; text-align: left; -webkit-overflow-scrolling: touch; scroll-behavior: smooth; } div#thumbHolder2 ul { height: 100px; padding: 0; margin: 20px 0px; list-style: none; white-space: nowrap; overflow-y: hidden; overflow-x: hidden; text-align: left; -webkit-overflow-scrolling: touch; scroll-behavior: smooth; } div#thumbHolder ul li { display: inline-block; vertical-align: top; padding: 5px 4px; } div#thumbHolder2 ul li { display: inline-block; vertical-align: top; padding: 5px 4px; } div#thumbHolder ul li:first-child { padding-left: 0; } div#thumbHolder2 ul li:first-child { padding-left: 0; } div#thumbHolder ul li:last-child { padding-right: 0; } div#thumbHolder2 ul li:last-child { padding-right: 0; } div#thumbHolder ul li img { display: block; margin: 0 auto; width: 86px; cursor: pointer; border: 2px solid rgba(191, 191, 191, 1.00); } div#thumbHolder2 ul li img { display: block; margin: 0 auto; width: 92px; cursor: pointer; border: 2px solid rgba(191, 191, 191, 1.00); } div#fullHolder { width: 100%; max-width: 500px; height: 380px !important; padding-bottom: 65%; position: relative; } div#fullHolder2 { width: 100%; max-width: 500px !important; height: 380px !important; padding-bottom: 65%; position: relative; } div#fullHolder ul { padding: 0; margin: 0; list-style: none; } div#fullHolder2 ul { padding: 0; margin: 0; list-style: none; } div#fullHolder ul li { position: absolute; left: 0; top: 0; } div#fullHolder2 ul li { position: absolute; left: 0; top: 0; } div#fullHolder ul li div { display: block; opacity: 0; transition: 0.5s; width: 100%; } div#fullHolder2 ul li div { display: block; opacity: 0; transition: 0.5s; width: 100%; } div#fullHolder ul li div img { display: block; padding-bottom: 5px; width: 460px; max-width: 500px; height: 380px; } div#fullHolder2 ul li div img { display: block; padding-bottom: 5px; width: 480px !important; max-width: 500px; height: 400px; } div#fullHolder ul li div span { display: block; text-align: center; font: normal 14px/18px 'ZohoPuvi', sans-serif; color: #444; text-rendering: optimizelegibility; } div#fullHolder2 ul li div span { display: block; text-align: center; font: normal 14px/18px 'ZohoPuvi', sans-serif; color: #444; text-rendering: optimizelegibility; } div#fullHolder ul li input { display: none; } div#fullHolder2 ul li input { display: none; } div#fullHolder ul li input:checked+div { opacity: 1; } div#fullHolder2 ul li input:checked+div { opacity: 1; } @media only screen and (min-device-width : 320px) and (max-device-width : 766px) { div#fullHolder ul li div img { display: block; height: 380px; max-width: 500px; padding-bottom: 5px; width: 100%; } div#fullHolder2 ul li div img { display: block; padding-bottom: 5px; max-width: 500px; height: 400px; width: 320px !important; } div#thumbHolder ul li img { border: 2px solid rgba(191, 191, 191, 1); cursor: pointer; display: block; margin: 0 auto; width: 60px; } div#thumbHolder2 ul li img { display: block; margin: 0 auto; width: 60px; cursor: pointer; border: 2px solid rgba(191, 191, 191, 1.00); } } /*end css*/ /* header style start*/ @media(min-width:1024px) { .navbar { padding-top: 0; padding-bottom: 0; } .navbar-expand-lg .navbar-collapse { height: 100%; } .navbar-expand-lg .navbar-nav { height: 100%; } .navbar-expand-lg .navbar-nav li { display: flex; align-items: center; height: 100%; } .dropdown { height: 100%; align-items: center; display: flex; } .link-caret--nav::after { -webkit-transform: rotate(134deg); transform: rotate(134deg); right: 3px; top: 50%; transform: translateY(-50%) rotate(134deg); } .dropdown.show.link-caret--nav::after:hover { -webkit-transform: rotate(-134deg); transform: rotate(-134deg); right: 3px; top: 50%; transform: translateY(-50%) rotate(134deg); } .dropdown.show .link-caret--nav::after { -webkit-transform: rotate(314deg); transform: rotate(314deg); right: 3px; top: 50%; transform: translateY(-50%) rotate(314deg); } .dropdown-menu.dropdown-shadow { top: 100% !important; border-top: -26.8px solid #83b633 !important; } } /* header style end*/ /* rating section start*/ .rating-section { box-shadow: 0 2px 7px 0 rgb(5 34 97 / 10%); background: #ffffff; position: relative; top: 82px; background-repeat: no-repeat; background-size: contain; border-radius: 10px; padding: 30px; } .rating-item { min-height: 180px; box-sizing: border-box; border-radius: 12px; background-color: #f7f7f7; display: flex; align-items: center; justify-content: center; flex-wrap: wrap; padding: 10px; } .rating-item p { font-size: 0.7rem; text-align: center; line-height: 16px; margin-bottom: 0; width: 100%; } /* rating section end*/ /* webinar footer promo start */ .footer-promo-empty { display: none !important; } .footer-promo-card { background-color: #f4feec !important; padding: 15px !important; } .webinar-badge { border: 1px solid #adbdd1; background-color: transparent; color: #000 !important; margin-bottom: 5px; } .webinar-title { font-size: 22px !important; } .webinar-group-item a { background: #83b633; padding: 7px 10px; border-radius: 5px; color: #fff !important; transition: all 0.3s; } .webinar-group-item:hover a { color: #fff !important; background: #6f9d28; } .webinar-title .webinar-span { background: rgb(131, 182, 51); background: linear-gradient(90deg, rgba(32, 129, 187, 1) 0%, rgba(19, 171, 60, 0.9948573179271709) 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } /* webinar footer promo end */