body { font-family: Segoe UI,Arial,Helvetica,sans-serif; color: #333; font-size: 15px; line-height: 20px; } .hot { background: rgba(241, 90, 36, .05); border:2px solid orange; color: #555; z-index: 2; padding: 20px 20px; font-size: 20px; border-radius: 2px; right: 10px; text-align:center; } .search { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; width: 170px; margin-bottom: 0px; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-flex: 0; -webkit-flex: 0 auto; -ms-flex: 0 auto; flex: 0 auto; } .search-button { width: 50px; height: 35px; padding: 0px; -webkit-box-flex: 0; -webkit-flex: 0 auto; -ms-flex: 0 auto; flex: 0 auto; background-color: #f15a24; background-image: url(../../images/magnifier.svg); background-position: 50% 50%; background-size: 17px; background-repeat: no-repeat; } .search-input { width: 100%; height: 35px; margin-bottom: 0px; -webkit-box-flex: 0; -webkit-flex: 0 auto; -ms-flex: 0 auto; flex: 0 auto; } .hero3-firstbutton-wrap { display: inline-block; margin-right: 10px; } .hero-content-wrapper { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; width: 50%; margin-right: 20px; padding-left: 100px; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .hero-content-wrapper.left { display: block; width: 63%; padding-left: 0px; -webkit-box-flex: 0; -webkit-flex: 0 auto; -ms-flex: 0 auto; flex: 0 auto; } .hero3-headline-wrap { margin-bottom: 20px; padding-top: 40px; } .hero-section { padding-top:50px; min-height: 500px; background: radial-gradient(ellipse at center, #477892 0%,#2c4756 100%); /*background-image: -webkit-gradient(linear, left top, left bottom, from(#2b3149), color-stop(25%, #272e4c), color-stop(50%, #232c4e), color-stop(75%, #1f2951), to(#1b2653)); background-image: linear-gradient(180deg, #2b3149, #272e4c 25%, #232c4e 50%, #1f2951 75%, #1b2653);*/ background-image:#293852!important; color: #fff; } .hero-section-cppdepend-ai { height:550px; min-height: 550px; background: radial-gradient(ellipse at center, #477892 0%,#2c4756 100%); /*background-image: -webkit-gradient(linear, left top, left bottom, from(#2b3149), color-stop(25%, #272e4c), color-stop(50%, #232c4e), color-stop(75%, #1f2951), to(#1b2653)); background-image: linear-gradient(180deg, #2b3149, #272e4c 25%, #232c4e 50%, #1f2951 75%, #1b2653);*/ background-image: #293852 !important; color: #fff; } .hero-section-sonar-plugin { height: 550px; min-height: 550px; background: radial-gradient(ellipse at center, #477892 0%,#2c4756 100%); /*background-image: -webkit-gradient(linear, left top, left bottom, from(#2b3149), color-stop(25%, #272e4c), color-stop(50%, #232c4e), color-stop(75%, #1f2951), to(#1b2653)); background-image: linear-gradient(180deg, #2b3149, #272e4c 25%, #232c4e 50%, #1f2951 75%, #1b2653);*/ background-image: #293852 !important; color: #fff; } .wrap { display: block; width: 100%; max-width: 1160px; margin-right: auto; margin-left: auto; } .wrap._w-custom.hero3 { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; height: 100%; padding-top: 20px; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .wrap.w50 { padding-top: 50px; padding-bottom: 50px; } .wrap.w80-50 { padding-bottom: 50px; } .wrap.w50 { padding-top: 50px; padding-bottom: 50px; } .wrap.w50-start { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; padding-top: 25px; padding-bottom: 25px; -webkit-box-align: start; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; } .btn { display: inline-block; min-width: 150px; margin-top: 10px; margin-bottom: 10px; padding: 11px 25px 11px 40px; float: none; border-radius: 0px; background-color: #37618c; background-image: url('../../images/001-windows.svg'); background-position: 10px 50%; background-size: 20px; background-repeat: no-repeat; -webkit-transition: color 200ms ease, box-shadow 200ms ease, background-color 200ms ease, -webkit-transform 400ms ease; transition: color 200ms ease, box-shadow 200ms ease, background-color 200ms ease, -webkit-transform 400ms ease; transition: color 200ms ease, box-shadow 200ms ease, background-color 200ms ease, transform 400ms ease; transition: color 200ms ease, box-shadow 200ms ease, background-color 200ms ease, transform 400ms ease, -webkit-transform 400ms ease; color: #fff; line-height: 24px; text-align: center; } .btn:hover { border-color: #333; border-radius: 0px; background-color: #333; box-shadow: 0 1px 3px 0 rgba(0, 0, 0, .1); color: #fff; } .btn:active { box-shadow: 0 1px 1px 0 rgba(0, 0, 0, .1); -webkit-transform: translate(0px, -1px); -ms-transform: translate(0px, -1px); transform: translate(0px, -1px); } .btn.btn-outline-dark { border-style: solid; border-width: 1px; border-color: hsla(0, 0%, 100%, .2); border-radius: 0px; background-color: hsla(0, 0%, 100%, .1); background-image: url('../../images/002-play-button.svg'); background-position: 10px 50%; background-size: 25px; -webkit-transition: color 200ms ease, box-shadow 200ms ease, background-color 200ms ease, border 200ms ease, -webkit-transform 400ms ease; transition: color 200ms ease, box-shadow 200ms ease, background-color 200ms ease, border 200ms ease, -webkit-transform 400ms ease; transition: color 200ms ease, box-shadow 200ms ease, background-color 200ms ease, transform 400ms ease, border 200ms ease; transition: color 200ms ease, box-shadow 200ms ease, background-color 200ms ease, transform 400ms ease, border 200ms ease, -webkit-transform 400ms ease; } .btn.btn-outline-dark:hover { border-color: hsla(0, 0%, 100%, .5); } .btn.btn-outline-dark.leftmargin { margin-left: 15px; background-image: url('../../images/symbol-c.png'); } .btn.green { background-color: #5fd83f; background-image: url('../../images/progress-report.svg'); background-size: 25px; } .btn.green:hover { background-color: #333; } .hero3-text-wrapper { padding-right: 0px; } .text-20 { opacity: 1; font-size: 20px; line-height: 30px; font-weight: 400; } .top-menu-general { position: absolute; left: 0px; top: 0px; right: 0px; } .navbar { position: relative; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; height: 70px; padding-top: 5px; padding-bottom: 0px; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; background-color: #f5f9fb; color: #333; text-align: left; border-bottom: 2px solid #efefef; } .logo-codergears { width: 116px; height: 45px; } .logo-cpp { width: 35px; margin-right: 10px; } .logo-jarchitect { width: 35px; margin-right: 10px; } .logo-sonar { width: 35px; margin-right: 10px; } .logo-vbdepend { width: 35px; margin-right: 10px; } .top-link { position: relative; padding-top: 10px; padding-bottom: 10px; color: #333; text-decoration: none; } .top-link.ct { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; padding-right: 20px; padding-left: 20px; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .top-menu-product { position: absolute; left: 0px; top: 0px; right: 0px; } .nav-product-wr { position: fixed; left: 0px; top: 0px; right: 0px; z-index: 50; background-color: #fff; box-shadow: 0 4px 14px 0 rgba(0,0,0,0.1); } .nav-product-wr-default { position: fixed; left: 0px; top: 0px; right: 0px; z-index: 50; background: transparent; } .nav-product-colored { position: fixed; left: 0px; top: 0px; right: 0px; z-index: 50; background-color: #fff; margin-top:70px; } .logo-product { width: 150px; } .logo-product.hidden { width: 220px; } .brand { padding-top: 20px; padding-bottom: 20px; } .brand.hidden { padding-top: 15px; padding-bottom: 15px; } .programming-svg { width: 135%; max-width: 135%; opacity: 0.9; position: relative; top: 20px; right: 5%; box-shadow: rgba(0, 0, 0, 0.9) 0px 4px 14px 0px; } .bottom-link-default { margin-right: 0px; margin-left: 0px; padding: 26px 14px; -webkit-box-flex: 0; -webkit-flex: 0 auto; -ms-flex: 0 auto; flex: 0 auto; font-size: 18px; } .released-link { margin-right: 0px; margin-left: 0px; padding: 26px 14px; -webkit-box-flex: 0; -webkit-flex: 0 auto; -ms-flex: 0 auto; flex: 0 auto; color: #fff; font-size: 18px; } .bottom-link-default.version { margin-top: 0px; margin-right: 20px; padding: 10px 12px; border: 1px solid #483; border-radius: 3px; -webkit-transition: all 200ms ease; transition: all 200ms ease; color: #483; font-size: medium; text-align: center; } .bottom-link { margin-right: 0px; margin-left: 0px; padding: 26px 14px; -webkit-box-flex: 0; -webkit-flex: 0 auto; -ms-flex: 0 auto; flex: 0 auto; color: #555; font-size: 18px; } .bottom-link.version { margin-top: 0px; padding: 10px 12px; border: 1px solid #483; border-radius: 3px; -webkit-transition: all 200ms ease; transition: all 200ms ease; color: #483; font-size: medium; text-align: center; } .bottom-link-default.version { margin-top: 0px; margin-right: 20px; padding: 10px 12px; border: 1px solid #48e0a6; border-radius: 3px; -webkit-transition: all 200ms ease; transition: all 200ms ease; color: #48e0a6; font-size: medium; text-align: center; } .bottom-link.version:hover { background-color: #48e0a6; color: #1d3060; text-decoration:none; font-weight:bold; } .bottom-link-default.version:hover { background-color: #48e0a6; color: #1d3060; text-decoration:none; font-weight:bold; } .bottom-link.dropdown { padding-right: 40px; padding-left: 13px; } .bottom-link-default.dropdown { padding-right: 40px; padding-left: 13px; } .cols { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; width: 100%; height: 100px; padding-bottom: 10px; -webkit-justify-content: space-around; -ms-flex-pack: distribute; justify-content: space-around; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; opacity:0.6; } .badgecg { height: 30px; margin: 10px; } .badgecg.orange { width: auto; } .badgecg.small { height: 30px; } .badgecg.l { height: 50px; } .text-16 { display: inline-block; font-size: 16px; line-height: 26px; } .text-16.text-16-60 { opacity: 1; } .section { padding-top: 10px; } .testimonialname { color:#555; } .section.c1 { background-color: rgba(241, 90, 36, .05); } .headline-6-col { width: 460px; margin-bottom: 50px; } ._2-col { display: inline-block; width: 300px; margin-right: 20px; -webkit-box-flex: 1; -webkit-flex: 1; -ms-flex: 1; flex: 1; } .testimonial1-item { padding-right: 30px; } .testimonial1-item.v { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: start; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; } .testimonial1-person-name { margin-top: -8px; -webkit-box-flex: 1; -webkit-flex: 1; -ms-flex: 1; flex: 1; } .testimonial1 { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: start; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; } .tagline { opacity: 0.6; font-size: 12px; letter-spacing: 2px; text-transform: uppercase; } .tagline.testimonial1-position { margin-top: -8px; } .testimonial1-person-wrapper { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; margin-top: 25px; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .casestudy-title { margin-top: 15px; margin-bottom: 15px; color: #4682b4; font-size: 20px; line-height: 30px; text-decoration: none; font-weight: 900; } .casestudy-title:hover { text-decoration: underline; } .logo-cs { width: 200px; } .text-14 { line-height: 24px; } .text-14.text-14-60 { opacity: 0.6; } .text-14.center { opacity: 0.6; font-style: italic; text-align: left; } .text-14.footertext { max-width: 200px; opacity: 0.6; } .dropdown-link { z-index: 999999; -webkit-transition: background-color 200ms ease; transition: background-color 200ms ease; color: #555; font-size: medium; line-height: 17px; } .dropdown-link:hover { color: #4F8DF9; text-decoration:none; } .dropdown-link.cg--current { color: #4F8DF9; font-weight:bold; } .dropdown-link.cg--current:hover { color: #4F8DF9; font-weight:bold; } .dropdown-link.green { background-color: #5fd83f; } .dropdown-link.green:hover { background-color: rgba(95, 216, 63, .77); } .dropdown-list { z-index: 9999; } .dropdown-list.cg--open { z-index: 99999; background-color: #fff; color: #555; border: 1px solid #efefef; padding: 10px 10px; border-radius:2px; box-shadow: 0 4px 14px 0 rgba(0,0,0,0.1); } .icon-top-menu { width: 15px; margin-right: 5px; } .icon-top-menu.mobile { display: none; } .nav-menu { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; font-size:medium; } .cta-wrapper { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .container-menu-bottom { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; width: 100%; max-width: 1160px; margin-right: auto; margin-left: auto; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .button-small { padding: 6px 14px 7px 14px; display: inline-block; margin: 10px 5px; float: none; border-radius: 20px; border: transparent; background-color: #fc801d; background-position: 10px 50%; background-size: 15px; background-repeat: no-repeat; -webkit-transition: color 200ms ease, box-shadow 200ms ease, background-color 200ms ease, -webkit-transform 400ms ease; transition: color 200ms ease, box-shadow 200ms ease, background-color 200ms ease, -webkit-transform 400ms ease; transition: color 200ms ease, box-shadow 200ms ease, background-color 200ms ease, transform 400ms ease; transition: color 200ms ease, box-shadow 200ms ease, background-color 200ms ease, transform 400ms ease, -webkit-transform 400ms ease; color: #fff; font-size: 16px; font-weight: initial; line-height: 22px; text-align: center; } .button-small:hover { border-color: #333; opacity:0.9; box-shadow: 0 1px 3px 0 rgba(0, 0, 0, .1); color: #fff; text-decoration: none; } .button-small:active { box-shadow: 0 1px 1px 0 rgba(0, 0, 0, .1); -webkit-transform: translate(0px, -1px); -ms-transform: translate(0px, -1px); transform: translate(0px, -1px); } .button-small-pricing:hover { background-color: rgba(39,40,44,.4); text-decoration: none; font-weight:bold; } .heading-5 { font-size: 34px; line-height: 50px; font-weight:600; color:#fff; } .lightbox-link { position: absolute; z-index: 2; text-decoration: none; } .play-button-wrapper { width: 100px; padding: 5px; border-radius: 360px; background-color: #37618c; } .hero-wrapper { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; overflow: hidden; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; } /*.nav-product-wr-scrolled { background-color:#fff; box-shadow: 0 4px 14px 0 rgba(0,0,0,0.1); }*/ .customers { position: absolute; padding-top:20px; left: 0px; right: 0px; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; height: 100px; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .slider { height: 100px; background-color: transparent; } .right-arrow { display: none; } .left-arrow { display: none; } .slide-nav { display: none; } .headline-6-col-2 { width: 460px; margin-bottom: 50px; } ._4-col { display: inline-block; width: 300px; margin-right: 20px; -webkit-box-flex: 1; -webkit-flex: 1; -ms-flex: 1; flex: 1; } ._4-col._4-col-last { display: inline-block; margin-right: 0px; } .feature5-item-wrap { padding-right: 30px; } .feature5-row-wrap { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; margin-top: 20px; padding-bottom: 20px; -webkit-box-align: start; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; } .learnmore { color: #f15a24; text-decoration: none; } .learnmore:hover { color: #ff4c0c; } .icon-f { margin-bottom: 15px; } .icon-feature { width:50px; margin-bottom: 15px; } .slider-2 { background-color: transparent; } .icon { color: #f15a24; } .testimonial-wrapper { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; width: 100%; height: 100%; padding-right: 100px; padding-left: 100px; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: start; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; } .testimonials { padding-top: 25px; padding-bottom: 25px; } .testimonials.padding { padding-top: 40px; padding-bottom: 40px; background-color: #fff; } .screenshot-wrapper { width: 100%; box-shadow: 2px 0 35px -3px rgba(0, 0, 0, .58); } .screenshot-thumbnail { width: 100%; -webkit-transition: all 200ms ease; transition: all 200ms ease; } .screenshot-thumbnail:hover { -webkit-transform: translate(0px, -10px); -ms-transform: translate(0px, -10px); transform: translate(0px, -10px); } .cta1 { background: radial-gradient(ellipse at center, #477892 0%,#2c4756 100%); color: #fff; } .cta1-wrap { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .cta1-content { margin-top: 5px; } .btn-big { display: inline-block; margin-top: 10px; margin-bottom: 10px; padding: 16px 35px; float: none; background-color: #fff; -webkit-transition: color 200ms ease, box-shadow 200ms ease, background-color 200ms ease, -webkit-transform 400ms ease; transition: color 200ms ease, box-shadow 200ms ease, background-color 200ms ease, -webkit-transform 400ms ease; transition: color 200ms ease, box-shadow 200ms ease, background-color 200ms ease, transform 400ms ease; transition: color 200ms ease, box-shadow 200ms ease, background-color 200ms ease, transform 400ms ease, -webkit-transform 400ms ease; color: #f15a24; font-size: 16px; line-height: 26px; text-align: center; } .btn-big:hover { border-color: #fff; background-color: #efefef; box-shadow: 0 1px 3px 0 rgba(0, 0, 0, .1); color: #f15a24; text-decoration:none; } .btn-big:active { box-shadow: 0 1px 1px 0 rgba(0, 0, 0, .1); -webkit-transform: translate(0px, -1px); -ms-transform: translate(0px, -1px); transform: translate(0px, -1px); } .h-calltoaction { margin-top: 0px; margin-bottom: 0px; font-size: 38px; line-height: 44px; color:#fff; } ._5-col { display: inline-block; width: 380px; margin-right: 20px; } ._2-col-2 { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; width: 140px; margin-right: 20px; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; } ._2-col-2._2nd { width: 180px; } .footer1-column-headline { margin-bottom: 20px; } ._3-col { display: inline-block; width: 220px; margin-right: 20px; } ._3-col._3-col-last { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; margin-right: 0px; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; } .link-light { opacity: 0.6; -webkit-transition: color 400ms ease, opacity 400ms ease, -webkit-transform 400ms ease; transition: color 400ms ease, opacity 400ms ease, -webkit-transform 400ms ease; transition: color 400ms ease, transform 400ms ease, opacity 400ms ease; transition: color 400ms ease, transform 400ms ease, opacity 400ms ease, -webkit-transform 400ms ease; color: #111212; line-height: 24px; cursor: pointer; } .link-light:hover { opacity: 1; -webkit-transform: translate(0px, -2px); -ms-transform: translate(0px, -2px); transform: translate(0px, -2px); color: #111212; } .link-light:active { opacity: 0.9; -webkit-transform: translate(0px, -1px); -ms-transform: translate(0px, -1px); transform: translate(0px, -1px); } .link-light.footer-link-12-link { margin-bottom: 10px; font-size: 12px; text-decoration: none; } .link-light.footer-link-12-link:hover { -webkit-transform: none; -ms-transform: none; transform: none; text-decoration: underline; } .footer1 { border-top: 1px solid rgba(17, 18, 18, .06); } .logo-footer { width: 116px; height:45px; } .nav-fixed { position: fixed; left: 0px; top: 0px; right: 0px; z-index: 9999; display: none; } .scrollwrite { display: inline-block; margin-top: 0px; margin-bottom: 0px; font-size: 30px; line-height: 34px; } .scrollwrite-wrapper { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: start; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; } .nav-container { position: static; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; width: 100%; max-width: 1160px; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .text-block { font-size: 16px; color: #9fb0b9; font-weight: 700; letter-spacing: 1px; margin-bottom:10px } .heading-6 { text-align: center; } .tabs-screenshots { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; } .tabs-menu { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; width: 50%; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: start; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; -webkit-box-flex: 0; -webkit-flex: 0 auto; -ms-flex: 0 auto; flex: 0 auto; } .tabs-content { width: 50%; padding-left: 50px; -webkit-box-flex: 0; -webkit-flex: 0 auto; -ms-flex: 0 auto; flex: 0 auto; } .description { padding-right: 0px; background-color: transparent; background-image: url('../../images/001-success.svg'); background-position: 0px 50%; background-size: auto 20px; background-repeat: no-repeat; } .description:hover { text-decoration:none; } .description.cg--current { background-color: transparent; background-image: url('../../images/002-success-1.svg'); font-weight:bold; } .bottom-nav-wrapper { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .m-wr { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; } html.cg-mod-js *[element-ix="logo-rotate-1"] { opacity: 0; -webkit-transform: translate(0px, -20px); -ms-transform: translate(0px, -20px); transform: translate(0px, -20px); } html.cg-mod-js *[element-ix="logo-rotate-2"] { opacity: 0; -webkit-transform: translate(0px, -20px); -ms-transform: translate(0px, -20px); transform: translate(0px, -20px); } .video-play-button { position: relative; z-index: 10; top: 50%; left: 50%; box-sizing: content-box; display: block; width: 32px; height: 44px; background: #fff; opacity:0.9; border-radius: 50%; padding: 18px 20px 18px 28px; box-shadow: 0 4px 14px 0 rgba(0,0,0,0.1); } .video-play-button:before { content: ""; position: absolute; z-index: 0; left: 50%; top: 50%; transform: translateX(-50%) translateY(-50%); display: block; width: 80px; height: 80px; background: rgb(106, 186, 46); border-radius: 50%; animation: pulse-border 1500ms ease-out infinite; } .video-play-button:after { content: ""; position: absolute; z-index: 1; left: 50%; top: 50%; transform: translateX(-50%) translateY(-50%); display: block; width: 80px; height: 80px; background: #fff; opacity:0.9; box-shadow: 0 4px 14px 0 rgba(0,0,0,0.1); border-radius: 50%; transition: all 200ms; } .video-play-button:hover:after { background-color: darken(#fff, 10%); } .video-play-button img { position: relative; z-index: 3; max-width: 100%; width: auto; height: auto; } .video-play-button span { display: block; position: relative; z-index: 3; width: 0; height: 0; border-left: 32px solid rgb(106, 186, 46); border-top: 22px solid transparent; border-bottom: 22px solid transparent; } @keyframes pulse-border { 0% { transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1); opacity: 1; } 100% { transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5); opacity: 0; } } .video-overlay { position: fixed; z-index: -1; top: 0; bottom: 0; left: 0; right: 0; background: rgba(0,0,0,0.80); opacity: 0; transition: all ease 500ms; } .video-overlay.open { position: fixed; z-index: 1000; opacity: 1; } .video-overlay-close { position: absolute; z-index: 1000; top: 15px; right: 20px; font-size: 36px; line-height: 1; font-weight: 400; color: #fff; text-decoration: none; cursor: pointer; transition: all 200ms; } .video-overlay-close:hover { color: #fff; } .video-overlay iframe { position: absolute; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%); /* width: 90%; */ /* height: auto; */ box-shadow: 0 0 15px rgba(0,0,0,0.75); } @media (max-width: 991px) { .hero-content-wrapper { width: 100%; margin-right: 0px; margin-bottom: 20px; padding-left: 0px; } .hero-section { height: auto; padding: 40px 0px 50px; } .wrap { width: 645px; } .wrap._w-custom.hero3 { padding-top: 50px; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; } .wrap.w50 { text-align: left; } .wrap.w50-start { -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; } .hero3-text-wrapper { margin-bottom: 30px; padding-right: 0px; text-align: center; } .navbar { height: 70px; padding-right: 10px; padding-left: 10px; } .top-link { padding-top: 20px; padding-bottom: 20px; color: #fff; } .nav-product-wr { display: block; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; } .nav-product-wr-default { display: block; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; } .programming-svg { width: 100%; max-width: 100%; position: relative; top: 20px; right: 10%; box-shadow: rgba(0, 0, 0, 0.9) 0px 4px 14px 0px; } .bottom-link { padding-top: 20px; padding-bottom: 20px; } .bottom-link.version { padding: 20px; border-style: none; color: #333; font-size: 16px; font-weight: 500; text-align: left; } .cols { height: auto; padding-bottom: 0px; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-justify-content: space-around; -ms-flex-pack: distribute; justify-content: space-around; -webkit-box-align: start; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; } .badgecg { width: 100px; } .badgecg.ea { width: auto; height: 40px; } .badgecg.small { width: 100px; height: auto; } .badgecg.l { height: auto; } .text-16.text-16-60 { width: 100%; } .headline-6-col { display: block; width: auto; margin-right: auto; margin-left: auto; text-align: left; } ._2-col { display: block; width: 100%; margin-bottom: 20px; } .testimonial1-item { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; width: 100%; margin-right: 0px; margin-bottom: 40px; margin-left: 0px; padding-right: 0px; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: start; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; text-align: left; } .testimonial1-person-name { text-align: left; } .testimonial1 { -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .text-14.footertext { max-width: 100%; } .dropdown-link { padding-top: 20px; padding-bottom: 20px; font-size: 14px; line-height: 20px; } .dropdown-link.green { margin-right: 20px; padding-right: 20px; background-color: #4ad725; } .dropdown-list.cg--open { /*background-color: #5fd83f;*/ } .icon-top-menu { display: none; } .icon-top-menu.mobile { display: block; } .nav-menu { background-color: #f15a24; } .cta-wrapper { -webkit-box-pack: end; -webkit-justify-content: flex-end; -ms-flex-pack: end; justify-content: flex-end; -webkit-box-flex: 1; -webkit-flex: 1; -ms-flex: 1; flex: 1; } .container-menu-bottom { width: auto; max-width: 100%; margin-right: 20px; margin-left: 20px; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .menu-button { background-color: transparent; } .menu-button.cg--open { background-color: #f15a24; } .menu-button-2 { padding: 5px 4px 4px; background-color: #333; } .menu-button-2.cg--open { background-color: #5fd83f; } .brand-2 { padding-top: 10px; } .hero-wrapper { overflow: visible; height: auto; } .customers { position: static; display: block; height: auto; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-align: start; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; -webkit-box-flex: 0; -webkit-flex: 0 auto; -ms-flex: 0 auto; flex: 0 auto; } .slider { height: auto; } .headline-6-col-2 { display: block; width: auto; margin-right: auto; margin-left: auto; text-align: center; } ._4-col { display: inline-block; width: 100%; margin-right: auto; margin-bottom: 20px; margin-left: auto; } ._4-col._4-col-last { margin-right: auto; margin-bottom: 0px; } .feature5-item-wrap { padding-right: 0px; text-align: center; } .feature5-row-wrap { -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; } .slider-2 { height: auto; } .cta1-wrap { -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; text-align: center; } .cta1-content { margin-bottom: 0px; } ._5-col { width: 100%; margin-right: 0px; margin-bottom: 20px; } ._2-col-2 { width: 100%; margin-right: 0px; margin-bottom: 20px; } ._2-col-2._2nd { width: 100%; } ._3-col { width: 100%; margin-right: 0px; margin-bottom: 20px; } .footer1 { text-align: center; } .nav-container { -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; } .tabs-screenshots { -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; } .tabs-menu { width: 100%; margin-bottom: 15px; } .tabs-content { width: 100%; padding-left: 0px; } .bottom-nav-wrapper { background-color: #fff; color:#555; } } @media (max-width: 767px) { .hero-content-wrapper.left { width: 100%; } .wrap { width: 100%; padding-right: 20px; padding-left: 20px; } .wrap._w-custom.hero3 { padding-top: 0px; } .badgecg { width: 75px; } .testimonial1-item { width: auto; } .heading-5 { text-align: left; } .hero-wrapper { height: auto; } .slider-2 { height: auto; } .testimonial-wrapper { padding-right: 69px; padding-left: 69px; } .scrollwrite-wrapper { min-height: 75px; } } @media (max-width: 479px) { .hero3-firstbutton-wrap { display: block; margin-right: 0px; } .hero-content-wrapper.left { width: 100%; } .hero3-headline-wrap { text-align: left; } .wrap.testimonial { padding-right: 10px; padding-left: 10px; } .btn { display: block; text-align: left; } .btn.btn-outline-dark { display: block; width: 100%; } .btn.btn-outline-dark.leftmargin { margin-left: 0px; } .top-menu-product { /*padding-top: 65px;*/ } .brand.cg--current { padding-top: 0px; padding-bottom: 0px; padding-left: 0px; } .brand.hidden { display: none; } .cols { height: auto; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; } .badgecg { width: 75px; height: auto; margin: 15px; padding: 0px; } .badgecg.ea { width: 75px; height: auto; } .badgecg.orange { width: 75px; height: auto; } .badgecg.l { width: 75px; } .section { padding-top: 0px; padding-bottom: 0px; } .text-14.center { text-align: left; } .cta-wrapper { width: 100%; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; } .container-menu-bottom { -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; } .button-small { display: block; text-align: center; text-decoration:none; } .heading-5 { font-size: 26px; line-height: 30px; } .lightbox-link { position: absolute; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; width: 100%; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; text-align: center; } .brand-2 { padding-top: 15px; } .customers { position: static; height: auto; -webkit-box-flex: 0; -webkit-flex: 0 auto; -ms-flex: 0 auto; flex: 0 auto; } .slider { position: relative; height: auto; } .slider-2 { position: relative; height: auto; } .testimonial-wrapper { padding-right: 5px; padding-left: 5px; -webkit-box-align: start; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; } .left-arrow-2 { display: none; } .right-arrow-2 { display: none; } .testimonials { padding-top: 0px; padding-bottom: 0px; } .cta1-wrap { -webkit-box-align: stretch; -webkit-align-items: stretch; -ms-flex-align: stretch; align-items: stretch; } .btn-big { display: block; padding: 14px 25px; text-align: center; } .nav-fixed { display: none; } .icon-2 { color: #fff; } .scrollwrite { font-size: 26px; line-height: 30px; } .description { background-size: auto 15px; font-size: 12px; line-height: 16px; } .m-wr { width: 100%; } }