body{ font-family: 'Lato', sans-serif; font-size:14px; color:#44465F; background: #222426; } h1,h2,h3,h4,h5,h6{ color: #121416; } .main-wrap{ background: #fff; margin: 0px auto; position: relative; } .container{ max-width: 1216px; } a:hover, a:focus{ text-decoration: none; color: #055DA0; } section{ padding: 80px 0; } body .main-wrap > .has-max-width { max-width: min(calc(100% - 32px), 1216px); /* max-width: 1216px; */ margin: auto; } body .main-wrap > .hero.has-max-width { max-width: 2060px; margin: auto; } .header { padding: 24px 16px; position: absolute; top: 0; left: 0; width: 100%; z-index: 2; display: flex; } .header .container-fluid { max-width: 1216px; } .header__logo img{ max-width: 180px; margin-top: 8px; } .foot-list img { max-width: 180px; } .header__btn{ text-align: right; } .btn-add{ border-radius: 4px; background: linear-gradient(180deg, #F22E06 0%, #CF2307 100%); border-color: #F22E06; color: #FFFFFF; font-size: 16px; font-weight: bold; letter-spacing: 0; line-height: 16px; text-align: center; padding: 12px 24px; display: inline-block; height: 45px; transition: all .25s; } .btn-add:hover, .btn-add:focus{ background: linear-gradient(180deg, #DF2D09 0%, #CF2307 100%); border-color: #DF2D09 ; color: #fff; } .hero{ background: url(../images/blob_large.svg) no-repeat bottom center; min-height: 720px; padding:148px 0 48px; background-size: cover; position: relative; z-index: 1; } .hero__img img{ max-width: 420px; } .color-red{ color: #E1563D; } h1 { color: #ffffff; font-family: Lato; font-size: 64px; font-weight: 900; letter-spacing: 0; line-height: 72px; text-align: center; margin-bottom: 20px; } h2 { color: #fff; font-size: 72px; font-weight: 900; letter-spacing: 0; line-height: 100px; text-align: center; } .hero__content p { color: rgba(255, 255, 255, 0.8); font-size: 24px; letter-spacing: 0; line-height: 36px; text-align: center; } .hero__btn{ display: inline-block; margin-top: 20px; } .hero__btn .btn-add{ min-width: 256px; color: #FFFFFF; font-size: 20px; font-weight: bold; letter-spacing: 0; line-height: 56px; text-align: center; height: 60px; border-radius: 6px; } .hero__btn p{ color: #828486; font-size: 14px; font-weight: bold; letter-spacing: 0; line-height: 20px; text-align: center; margin-top: 10px; margin-bottom: 0px; } .header__menu{ text-align: right; } .header__menu ul{ list-style: none; margin: 0; padding: 0; } .header__menu ul li{ display: inline-block; } .header__menu ul li a{ display: inline-block; padding: 8px 16px; text-decoration: none; color: #fff; font-size: 16px; border-radius: 4px; margin: 0 0 0 24px; } .header__menu ul li a:hover, .header__menu ul li a.active{ display: inline-block; background: #055da0; } .fa-angle-right::before { content: "\f105"; font-weight: bold; } .review__box{ box-shadow: 0 2px 12px 0 rgba(0,0,0,0.04); margin: 30px 0; transition: all .5s; border-radius: 4px; } .review__box:hover{ box-shadow: 0 2px 12px 0 rgba(0,0,0,0.24); margin: 32px 0; } .products__box_wrapper { display: grid; grid-gap: 8px; grid-template-columns: 1fr 1fr 1fr 1fr; } @media (max-width: 767px) { .products__box_wrapper { grid-template-columns: 1fr 1fr; } } @media only screen and (max-width: 480px) { .products__box_wrapper { grid-template-columns: 1fr; } } .products__box { border-radius: 12px; border: 1px solid #E2E4E6; background: #FFF; box-shadow: 0px 4px 16px 0px rgba(0, 0, 0, 0.08); padding: 24px; display: flex; flex-flow: column nowrap; } .products__box > * { margin-left: auto; margin-right: auto; } .products__box > .products__btn { margin-top: auto; } .green-box{ background: rgba(65,160,87,.1); } .green-box .review__name p{ color: rgba(65,160,87,.6); } .green-box .review__name p b { color: rgba(65,160,87,.99); } .green-box .review__content { color: rgba(65,160,87,.99); } .blue-box { border-radius: 12px; } .blue-box1{ background: rgba(5,93,160,.1); } .blue-box1 .review__name p{ color: rgba(5,93,160,.6); } .blue-box1 .review__name p b { color: rgba(5,93,160,.99); } .blue-box1 .review__content { color: rgba(5,93,160,.99); } .yellow-box{ background: rgba(179,123,2,.1); } .yellow-box .review__name p{ color: rgba(179,123,2,.6); } .yellow-box .review__name p b { color: rgba(179,123,2,.99); } .yellow-box .review__content { color: rgba(179,123,2,.99); } .red-box{ background: rgba(151,56,39,.1); } .red-box .review__name p{ color: rgba(151,56,39,.6); } .red-box .review__name p b { color: rgba(151,56,39,.99); } .red-box .review__content { color: rgba(151,56,39,.99); } .products { padding-top: 60px !important; padding-bottom: 160px; /* max-width: min(calc(100% - 32px), 1216px); margin-right: auto; margin-left: auto; */ } .review__content{ padding: 32px; } .value__box { margin: 16px 0; } .article { padding-top: 60px !important; } .article__box { margin: 16px 0; } .review__content{ font-size: 20px; letter-spacing: 0; line-height: 24px; margin-top: 10px; } .review__content .content-box{ min-height: 120px; } .review__name p { font-family: Lato; font-size: 16px; letter-spacing: 0; line-height: 24px; margin-bottom: 4px; } .review__name p b { font-family: Lato; font-size: 16px; font-weight: bold; letter-spacing: 0; line-height: 24px; } .products__logo img{ max-width: 148px; } .products__logo { margin-bottom: 20px; } .products__content p{ color: #323436; font-family: Lato; font-size: 16px; letter-spacing: 0; line-height: 24px; text-align: center; margin-bottom: 32px; } .btn-blue{ background: #2072B8; } .btn-grey{ background: rgba(0,0,0,0.5); } .btn-gqueues-blue { background: #4285F4; } .btn-blue:hover, .btn-blue:focus{ background: #0F5693; } .btn-grey:hover, .btn-grey:focus{ background: rgba(0,0,0,0.7); } .btn-gqueues-blue:hover, .btn-gqueues-blue:focus{ background: #1869F0 } .sub-para { color: #323436; font-family: Lato; font-size: 20px; letter-spacing: 0; line-height: 32px; text-align: center; } .quote__icon{ text-align: center; margin-bottom: 16px; } .quote__content{ margin-bottom: 32px; min-height: 148px; display: flex; align-items: center; } .quote__content p{ margin-bottom: 0px; display:inline-block; vertical-align: middle; color: #222222; font-size: 24px; letter-spacing: 0; line-height: 36px; text-align: center; } .quote__name{ color: #222222; font-size: 20px; font-weight: bold; letter-spacing: 0; line-height: 32px; text-align: center; } .quote__position { color: #444444; font-size: 14px; letter-spacing: 0; line-height: 20px; text-align: center; } .youtube-video { } .video-box{ position: relative; top: -60px; } .bg-grey{ background: #F2F4F6; } .bg-blue{ background: linear-gradient(180deg, #0774C7 0%, #055DA0 100%); } .quote2{ padding: 48px 0; background: #1A7AC4 url(../images/paperplane.png) ; background-size: 80%; background-repeat: no-repeat; background-position: top center; } .logo-box img { max-height: 48px; margin: 0 20px; opacity: 0.7; transition: all .5s; } .press-logo img:hover, .logo-box:focus { opacity: 0.99; cursor: pointer; } .logo-box{ text-align: center; margin-top: 32px; } .press-logo{ padding: 48px 0 !important; } .customer-logo{ position: relative; } .customer-logo::before{ content: ""; width: 176px; height: 256px; position: absolute; background: url(../images/hugboomerang.svg) no-repeat left center; bottom: -80px; left: -16px; z-index: 99; background-size: contain; } .blue-box{ background: linear-gradient(180deg, #0774C7 0%, #055DA0 100%); margin: 60px 0; } .footer-line{ border-color: rgba(255,255,255,.3); } .social-icons a{ margin-right: 12px; display: inline-block; opacity: 0.7; transition: all .5s; } .social-icons a:hover, .social-icons a:focus { opacity: 0.99; } .color-white{ color: #fff; } .sub-para.color-white { color: rgba(255,255,255,.8); } .everything__box{ max-width: 17%; display: inline-block; text-align: center; margin: 0 1%; vertical-align: top; } .everything__box{ font-family: 'Patrick Hand', cursive; } .everything__box p{ color: #525456; font-size: 20px; letter-spacing: 0; line-height: 24px; text-align: center; } .everything__box h4{ color: #121416; font-size: 72px; letter-spacing: 0; line-height: 80px; text-align: center; margin-top: 16px; margin-bottom: 8px; } .everything__img img{ max-width: 176px; } .world-where { color: #FFFFFF; font-family: Lato; font-size: 40px; font-weight: 900; letter-spacing: 0; line-height: 48px; } .we-create { color: rgba(255, 255, 255, 0.7); font-family: Lato; font-size: 20px; letter-spacing: 0; line-height: 32px; } .value__box h5{ color: #121416; font-family: Lato; font-size: 20px; font-weight: bold; letter-spacing: 0; line-height: 32px; } .value__box p{ color: #323436; font-family: Lato; font-size: 16px; letter-spacing: 0; line-height: 24px; } .article h5{ margin-top: 20px; } .article h5 a{ color: #323436; font-family: Lato; font-size: 20px; font-weight: bold; letter-spacing: 0; line-height: 24px; } .article h5 a:hover,.article h5 a:focus{ color: #055DA0; } .article p{ color: #525456; font-family: Lato; font-size: 16px; letter-spacing: 0; line-height: 24px; margin-top: 15px; } .read-more { color: #055DA0; font-family: Lato; font-size: 16px; font-weight: bold; letter-spacing: 0; line-height: 24px; } .quote2_content h4 { color: #fff; font-size: 24px; font-weight: bold; letter-spacing: 0; line-height: 32px; font-style: italic; margin-bottom: 30px; } .quote2_content h4 span{ background: #034D84; color: #fff; } .quote2_content h5 { color: #fff; font-size: 16px; font-weight: bold; letter-spacing: 0; line-height: 28px; margin-bottom: 0px; } .quote2_content p{ color: #fff; font-size: 14px; letter-spacing: 0; line-height: 24px; } .quote2_img{ min-height: auto; padding:10px 0; position: relative; } .review .container-fluid { width: 98%; padding-left: 0px; padding-right: 0px; } .owl-nav .owl-prev .fa { color: #055DA0; font-size: 20px; width: 40px; height: 40px; line-height: 38px; border: 1px solid rgba(5,93,160,0.6); display: inline-block; border-radius: 100%; margin: 0 3px; } .owl-nav{ text-align: center; /* padding-right: 120px; */ width: 98%; } .owl-nav button{ margin: 0 5px; } .owl-nav button:hover, .owl-nav button: focus{ outline: none; } button:focus { outline: 0px dotted none; outline: 0px auto none; } .owl-nav .owl-next .fa { color: #055DA0; font-size: 20px; width: 40px; height: 40px; line-height: 48px; border: 1px solid rgba(5,93,160,0.6); display: inline-block; border-radius: 100%; margin: 0 3px; } .owl-dots{ text-align: center; } .owl-dot span { display: inline-block; width: 10px; height: 10px; background: #D2D4D6; margin: 0 5px; border-radius: 100%; } .owl-dot.active span { display: inline-block; width: 10px; height: 10px; background: #055DA0; margin: 0 3px; border-radius: 100%; } .quote2_img img { } h3.sub-heading{ color: #121416; font-size: 48px; font-weight: 800; letter-spacing: 0; line-height: 60px; text-align: left; margin-bottom: 20px; } .sub-para{ line-height: 32px; } .howitworks__content{ margin-top: 48px; } h3 { color: #121416; font-size: 48px; font-weight: 900; letter-spacing: 0; line-height: 60px; text-align: center; } .quote { } .paid-only{ color: #F9BF41; font-size: 20px; font-weight: 900; letter-spacing: 0; line-height: 32px; text-align: center; } .quote__para{ color: #525456; font-size: 20px; letter-spacing: 0; line-height: 32px; text-align: center; } h3 b{ font-weight: bold; } .howitworks__content p{ color: #525456; font-size: 20px; letter-spacing: 0; margin-bottom: 20px } .howitworks__btn{ margin-top: 32px; } .howitworks__btn .btn-add{ min-width: 160px; } footer { min-height: 200px; background: linear-gradient(180deg, #0774C7 0%, #055DA0 100%); padding-top: 60px; padding-bottom: 30px; } ul { list-style: none; padding: 0; margin: 0; } .foot-list h5{ color: #FEFFFF; font-size: 20px; font-weight: 600; letter-spacing: 0; line-height: 20px; margin-bottom: 20px; } .foot-list ul li a{ opacity: 0.8; color: #FEFFFF; font-size: 16px; letter-spacing: 0; line-height: 20px; display: inline-block; margin-bottom: 20px; } .foot-list ul li a:hover { opacity: 0.99; } .footer__copy{ margin-bottom: 16px; } .footer__copy span { Color: #FFF; opacity: 0.6; } .footer__copy a { color: #FFF; opacity: 0.8; font-size: 16px; margin: 0 5px; } .footer__copy a:hover { opacity: 0.99; cursor: pointer; } .footer__bottom { text-align: center; margin-top: 48px; opacity: 0.8; color: #FEFFFF; font-size: 14px; letter-spacing: 0; line-height: 20px; text-align: center; } .f-b{ opacity: 0.5; } .quote .owl-carousel .owl-item img{ display: inline-block; width: auto; } .quote .owl-dots{ text-align: center; margin-top: 15px; } .quote .owl-dot span { width: 10px; height: 10px; display: inline-block; background: #1487C1; opacity: 0.3; margin: 0 5px; border-radius: 50%; } .quote .owl-dot.active span{ opacity: 1; } .bg-image{ max-width: 800px; max-height: 540px; } .my-tabs .nav-tabs { display: none; } @media (min-width: 768px) { .my-tabs .nav-tabs { display: flex; } .my-tabs .card { border: none; } .my-tabs .card .card-header { display: none; } .my-tabs .card .collapse { display: block; } } @media (max-width: 767px) { .my-tabs .tab-content > .tab-pane { display: block !important; opacity: 1; } } .my-tabs .nav-tabs .nav-link { border: 0; border-radius: .25rem; background: transparent; color: rgba(255,255,255,.7); font-size: 20px; padding: .5rem 1.5rem; } .my-tabs .nav-tabs .nav-link.active { color: #0687BB; background-color: #fff; box-shadow: 0 4px 16px 0 rgba(0,0,0,0.3); font-weight: 600; } .my-tabs .nav-tabs{ border: none; } .hero__btn p .btn-learn{ color: #055DA0; font-size: 16px; letter-spacing: 0; line-height: 24px; text-align: center; font-weight: normal; margin-top: 12px; display: inline-block; } .owl-stage{ padding-left: 0 !important; } .owl-carousel{ padding-left: 20px; } /**********media for mobile***********/ @media only screen and (min-width: 1920px) { .hero__content p{ margin-bottom: 32px; } .pt-150{ padding-top: 80px; } .products__box{ margin: 0 5%; } .value, .article { padding: 148px 0; } } @media only screen and (min-width: 1440px) { .hero{ min-height: 720px; padding-top: 160px; } } @media only screen and (max-width: 1439px) { .container{ padding: 0 30px; } h1 { color: #ffffff; font-family: Lato; font-size: 55px; font-weight: 900; letter-spacing: 0; line-height: 1.23; text-align: center; margin-bottom: 20px; } h3.sub-heading { color: #121416; font-size: 42px; font-weight: 800; letter-spacing: 0; line-height: 48px; text-align: left; margin-bottom: 20px; } .review__content { padding: 20px; } } @media only screen and (min-width: 991px) and (max-width: 1200px) { .hero{ padding: 148px 0 48px; } h1 { font-size: 52px; font-weight: 900; letter-spacing: 0; line-height: 68px; text-align: center; margin-bottom: 20px; } .hero__btn{ width: 100%; text-align: center; margin-bottom: 48px; } .hero__video { text-align: center; } .ord-2{ order: 2; } .howitworks__content { margin-top: 0; } section{ padding: 72px 0; } .howitworks__image { margin-top: 48px; text-align: center; } .howitworks__image img{ max-width: 70%; } h3.sub-heading { font-size: 38px; line-height: 1; } .logo-box img { margin: 0px 7px; } .customer-logo::before { height: 252px; left: 1%; } .we-create { font-size: 14px; letter-spacing: 0; line-height: 26px; } .everything__img img { max-width: 126px; } .everything__box h4 { color: #121416; font-size: 52px; } .world-where { font-size: 30px; font-weight: 900; letter-spacing: 0; line-height: 38px; } .products__logo img { max-width: 120px; } .customer-logo::before{ display: none; } } @media only screen and (min-width: 768px) and (max-width: 990px){ .hero{ padding: 148px 0 48px; } h1 { font-size: 52px; font-weight: 900; letter-spacing: 0; line-height: 68px; text-align: center; margin-bottom: 20px; } .hero__btn{ width: 100%; text-align: center; margin-bottom: 48px; } .hero__video { text-align: center; } .ord-2{ order: 2; } .howitworks__content { margin-top: 0; } section{ padding: 48px 0; } .howitworks__image { margin-top: 48px; text-align: center; } .howitworks__image img{ max-width: 70%; } h3.sub-heading { font-size: 36px; line-height: 1; } .logo-box img { max-height: 35px; margin: 0px 5px; } .customer-logo::before { height: 252px; left: 1%; } .we-create { font-size: 14px; letter-spacing: 0; line-height: 26px; } .everything__img img { max-width: 126px; } .everything__box h4 { color: #121416; font-size: 52px; } .world-where { font-size: 30px; font-weight: 900; letter-spacing: 0; line-height: 38px; } .products__logo img { max-width: 120px; } .customer-logo::before{ display: none; } .subscribe { margin-left: 33.33%; } } @media only screen and (max-width: 767px) { .header__btn { display: none; } .header__logo img { max-width: 148px; margin: 0; } .foot-list img { max-width: 148px; } h1 { font-size: 32px; line-height: 40px; margin-bottom: 15px; } .howitworks__image img { max-width: 248px; margin: 0 auto; display: block; } .hero{ padding: 110px 0 30px; min-height: 560px; } .youtube-video { min-height: 153px; } .header { padding: 20px 0px; } .video-box { top: 0; } .quote { padding-top: 50px; } .comparison_v2 .comparison-table td:first-child { padding-left: 15px; } .comparison_v2 .comparison-table .comparison-table__title { color: #121416; font-size: 16px; font-weight: bold; letter-spacing: 0; line-height: 26px; } .paid-only { font-size: 16px; } .comparison-table__header img { max-width: 80px; } .quote2_content h4 { color: #fff; font-size: 22px; font-weight: bold; letter-spacing: 0; line-height: 40px; font-style: italic; margin-bottom: 30px; } .pt-100 { padding-top: 50px; } h3.sub-heading { color: #121416; font-size: 30px; font-weight: 800; letter-spacing: 0; line-height: 32px; text-align: left; } .products__box { margin: 25px 0; } .customer-logo::before{ display: none; } .logo-box img { max-height: 36px; margin: 15px; } .sub-para { line-height: 26px; font-size: 16px; } .howitworks__content p { color: #525456; font-size: 16px; letter-spacing: 0; margin-bottom: 15px; } .start::after{ display: none; } .start::before{ display: none; } section{ padding: 48px 0; } .hero__btn .btn-add { min-width: 200px; font-size: 16px; line-height: 45px; height: 48px; border-radius: 4px; } .hero__btn{ width: 100%; text-align: center; margin-bottom: 30px; margin-top:30px; } .hero__content p { color: rgba(255,255,255,.8); font-size: 16px; letter-spacing: 0; line-height: 24px; } .hero__btn p{ display: none; } .quote__content p{ font-size: 20px; line-height: 32px; } .quote__content { margin-bottom: 30px; min-height: 70px; } .quote__name{ font-size: 16px; line-height: 24px; } .quote__position{ font-size: 14px; } .quote__icon img{ max-width: 56px; } .ord-2{ order: 2; } .howitworks__content { margin-top: 0px; } h3{ font-size: 24px; line-height: 36px; } .howitworks__image { margin-top: 32px; } .feature__box h4{ font-size: 20px; line-height: 32px; } .feature__box p{ margin-bottom: 30px; } .start__title{ font-size: 24px; line-height: 36px; text-align: center; margin-bottom: 30px; } .start__btn .btn-add { min-width: 200px; color: #FFFFFF; font-size: 16px; font-weight: bold; letter-spacing: 0; line-height: 45px; text-align: center; height: 48px; border-radius: 4px; } .start__btn{ text-align: center; } .foot-list ul{ margin-bottom: 30px; } .footer__bottom{ margin-top: 0px; } .footer__copy .copy{ display: block; margin-top: 12px; opacity: 0.7; } .quote2_img { text-align: center; margin: 0 auto; max-width: 180px; } .quote2_content { text-align: center; } .quote2 .card-header a.collapsed{ border-radius: .25rem; display: block; padding: .75rem 1.25rem; color: #fff; background-color: transparent; box-shadow: none; font-weight: normal; } .quote2 .card-header a{ border-radius: .25rem; display: block; padding: .75rem 1.25rem; color: #0687BB; background-color: #fff; box-shadow: 0 4px 16px 0 rgba(0,0,0,0.3); font-weight: 600; } .my-tabs .tab-content > .tab-pane { display: block !important; opacity: 1; border:0; margin-bottom: 15px; } .my-tabs .card-header{ border-bottom: 0; background: transparent; padding: 0; } .quote2 .card-header a .fa { position:absolute; right: 15px; top: 13px; } .myaccordion .card-body { padding: 0rem 1rem .25rem; } .accordion-right img { border-radius: 8px 8px 8px 8px; } .myaccordion .btn{ white-space: normal; text-align: left; } .start { position: relative; padding: 50px 0; } .everything__box { max-width: 100%; display: inline-block; text-align: center; margin: 15px 2%; } .everything__box h4 { font-size: 55px; } .owl-carousel { padding-left: 21px; } .owl-nav{ padding-right: 0 !important; } .review__content { font-size: 16px; } .products { padding-bottom: 50px; } .world-where { color: #FFFFFF; font-size: 30px; font-weight: 800; letter-spacing: 0; line-height: 38px; } .we-create { font-size: 16px; letter-spacing: 0; line-height: 29px; margin-top: 20px; } .value__box { text-align: center; } .header__menu ul li a { padding: 7px 15px; margin-left: 0px; } .ord-2{ order: 2; } } @media only screen and (max-width: 540px){ } @media only screen and (max-width: 320px){ }