/* @import url('http://example.com/example_style.css'); */

/***********************************************/
/* CSS @imports must be at the top of the file */
/* Add them above this section                 */
/***********************************************/

/*****************************************/
/* Start your style declarations here    */
/*****************************************/
@font-face {
    font-family: 'Roc Grotesk';
    src: url('https://bluetuskr.com/hubfs/Blue%20Tusker/fonts/RocGroteskMedium/RocGroteskWideMedium.eot');
    src: url('https://bluetuskr.com/hubfs/Blue%20Tusker/fonts/RocGroteskMedium/RocGroteskWideMedium.eot?#iefix') format('embedded-opentype'),
        url('https://bluetuskr.com/hubfs/Blue%20Tusker/fonts/RocGroteskMedium/RocGroteskWideMedium.woff2') format('woff2'),
        url('https://bluetuskr.com/hubfs/Blue%20Tusker/fonts/RocGroteskMedium/RocGroteskWideMedium.woff') format('woff'),
        url('https://bluetuskr.com/hubfs/Blue%20Tusker/fonts/RocGroteskMedium/RocGroteskWideMedium.ttf') format('truetype'),
        url('https://bluetuskr.com/hubfs/Blue%20Tusker/fonts/RocGroteskMedium/RocGroteskWideMedium.svg#FONTSPRINGDEMO-RocGroteskWideMediumRegular') format('svg');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Roc Grotesk';
    src: url('RocGrotesk-WideBold.eot');
    src: url('https://bluetuskr.com/hubfs/Blue%20Tusker/fonts/RocGroteskBold/RocGrotesk-WideBold.eot?#iefix') format('embedded-opentype'),
        url('https://bluetuskr.com/hubfs/Blue%20Tusker/fonts/RocGroteskBold/RocGrotesk-WideBold.woff2') format('woff2'),
        url('https://bluetuskr.com/hubfs/Blue%20Tusker/fonts/RocGroteskBold/RocGrotesk-WideBold.woff') format('woff'),
        url('https://bluetuskr.com/hubfs/Blue%20Tusker/fonts/RocGroteskBold/RocGrotesk-WideBold.ttf') format('truetype'),
        url('https://bluetuskr.com/hubfs/Blue%20Tusker/fonts/RocGroteskBold/RocGrotesk-WideBold.svg#RocGrotesk-WideBold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Roc Grotesk';
    src: url('https://bluetuskr.com/hubfs/Blue%20Tusker/fonts/RocGroteskBold/RocGroteskWideBold.eot');
    src: url(https://bluetuskr.com/hubfs/Blue%20Tusker/fonts/RocGroteskBold/RocGroteskWideBold.eot?#iefix') format('embedded-opentype'),
        url('https://bluetuskr.com/hubfs/Blue%20Tusker/fonts/RocGroteskBold/RocGroteskWideBold.woff2') format('woff2'),
        url('https://bluetuskr.com/hubfs/Blue%20Tusker/fonts/RocGroteskBold/RocGroteskWideBold.woff') format('woff'),
        url('https://bluetuskr.com/hubfs/Blue%20Tusker/fonts/RocGroteskBold/RocGroteskWideBold.ttf') format('truetype'),
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Area';
    src: url('https://bluetuskr.com/hubfs/Blue%20Tusker/fonts/Area-Regular/Area-Regular.eot');
    src: url('https://bluetuskr.com/hubfs/Blue%20Tusker/fonts/Area-Regular/Area-Regular.eot?#iefix') format('embedded-opentype'),
        url('https://bluetuskr.com/hubfs/Blue%20Tusker/fonts/Area-Regular/Area-Regular.woff2') format('woff2'),
        url('https://bluetuskr.com/hubfs/Blue%20Tusker/fonts/Area-Regular/Area-Regular.woff') format('woff'),
        url('https://bluetuskr.com/hubfs/Blue%20Tusker/fonts/Area-Regular/Area-Regular.ttf') format('truetype'),
        url('https://bluetuskr.com/hubfs/Blue%20Tusker/fonts/Area-Regular/Area-Regular.svg#Area-Regular') format('svg');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Area';
    src: url('https://bluetuskr.com/hubfs/Blue%20Tusker/fonts/Area-Bold/Area-Bold.eot');
    src: url('https://bluetuskr.com/hubfs/Blue%20Tusker/fonts/Area-Bold/Area-Bold.eot?#iefix') format('embedded-opentype'),
        url('https://bluetuskr.com/hubfs/Blue%20Tusker/fonts/Area-Bold/Area-Bold.woff2') format('woff2'),
        url('https://bluetuskr.com/hubfs/Blue%20Tusker/fonts/Area-Bold/Area-Bold.woff') format('woff'),
        url('https://bluetuskr.com/hubfs/Blue%20Tusker/fonts/Area-Bold/Area-Bold.ttf') format('truetype'),
        url('https://bluetuskr.com/hubfs/Blue%20Tusker/fonts/Area-Bold/Area-Bold.svg#Area-Bold') format('svg');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}
.ds-container {
    width: 100% !important;
    padding-right: 15px !important;
    padding-left: 15px !important;
    margin-right: auto !important;
    margin-left: auto !important;
    float: none !important
}
@media (min-width: 576px) {
  .ds-container {
    max-width: 540px !important;
  }
}
@media (min-width: 768px) {
  .ds-container {
    max-width: 720px !important;
  }
}
@media (min-width: 992px) {
  .ds-container {
    max-width: 960px !important;
  }
}
@media (min-width: 1200px) {
  .ds-container {
    max-width: 1140px !important;
  }
}
@media (min-width: 1400px) {
  .ds-container {
    max-width: 1260px !important;
  }
}
@media (min-width: 1600px) {
  .ds-container {
    max-width: 1450px !important;
  }
}
@media (min-width: 1800px) {
  .ds-container {
    max-width: 1550px !important;
  }
}
.site-header-2024 .header-wrapper .logo .hs_cos_wrapper a img {
    max-width: 146px;
}
body.design-service-page h1,
body.design-service-page h2,
body.design-service-page h3,
body.design-service-page h4,
body.design-service-page h5,
body.design-service-page h6 {
    font-family: Roc Grotesk;
    font-weight: 700;
}
/* Header */
.design-service-header {
    background-color: #fff;
    padding-top: 35px;
    padding-bottom: 35px;
}
.design-service-header .site-logo a img {
    max-width: 126px;
}
.design-service-header .row-fluid {
    align-items: center;
    justify-content: space-between;
}
.design-service-header .row-fluid .span6 {
    -ms-flex: inherit;
    flex: auto;
    max-width: none;
    width: auto;
}
.design-service-header .row-fluid .span6.contact-btn .hs-button {
    font-size: 16px;
    line-height: 20px;
    color: #0C0C7B;
    font-family: 'Area';
    font-weight: 700;
    border: 1px solid #0C0C7B;
    border-radius: 25px;
    max-width: 152px;
    width: 100%;
    text-align: center;
    padding-top: 13px;
    padding-bottom: 13px;
    margin-left: auto;
    display: block;
}
.design-service-header .row-fluid .span6.contact-btn .hs-button:hover {
    background-color: #0C0C7B;
    color: #fff;
}
body.design-service-page p {
    font-family: 'Area';
    font-size: 21px;
    font-weight: 400;
    line-height: 150%;
    color: #000;
}
.ds-btn .hs-button {
    border-radius: 100px;
    background: linear-gradient(90deg, #0C0C7B 17.16%, #616199 114.2%);
    box-shadow: 0px 0px 29px -3px rgba(12, 12, 123, 0.40);
    color: #FFF;
    font-family: 'Area';
    font-size: 21px;
    font-weight: 700;
    line-height: normal;
    max-width: 235px;
    width: 100%;
    padding: 18px 40px;
    margin-top: 30px;
    position: relative;
}
.ds-btn .hs-button:after {
    content: "";
    position: absolute;
    background-image: url(https://bluetuskr.com/hubfs/Blue%20Tusker/Arrow%201-1.svg);
    width: 18px;
    height: 18px;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    top: 50%;
    transform: translateY(-50%);
    right: 40px;
}
/* Hero */
body.design-service-page {
    background-image: none !important;
    background-color: #ffffff;
}
body.design-service-page .body-container-wrapper {
    background-image: none !important;
}
.ds-hero {
    padding-top: 122px;
    padding-bottom: 164px;
    background-color: #f9f9f9;
    background-color: #f9f9f9;
    background-image: url(https://bluetuskr.com/hubfs/Blue%20Tusker/ds-hero-shape.png);
    background-repeat: no-repeat;
    background-position: bottom;
}
.ds-hero .wrapper .content-block {
    padding-right: 135px;
}
.ds-hero .wrapper .content-block .title h1 {
    font-size: 40px;
    font-style: normal;
    font-weight: 700;
    line-height: 105%; /* 42px */
    text-transform: uppercase;
    background: linear-gradient(92deg, #0C0C7B -9.03%, rgba(86, 86, 140, 0.77) 92.93%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.ds-hero .description p {
    max-width: 580px;
}
.ds-btn .hs-button:hover {
    background: linear-gradient(90deg, #616199 17.16%, #0C0C7B 114.2%);
}
.ds-get-started .content-block {
    padding-right: 90px;
}
/* About Section */
.gradient-bg {
  background: linear-gradient(151deg, #F9F9F9 53.45%, rgba(161, 161, 202, 0.04) 189.65%);
}
.ds-image-text {
    padding-top: 160px;
    padding-bottom: 110px;
}
.ds-image-text .image-block {
    padding-right: 95px;
}
.ds-image-text .content-block .title {
    max-width: 480px;
}
.ds-image-text .content-block .title h3 {
    text-transform: uppercase;
    color: #2B2B2B;
    font-size: 40px;
    line-height: 103%;
    margin-bottom: 20px;
}
.ds-image-text .content-block {
    padding-right: 72px;
}
.ds-image-text .content-block p {
    max-width: 592px;
    margin-bottom: 25px;
}
/* How it Works */
.ds-how-it-works {
    background: linear-gradient(130deg, #06063A 20.03%, #545495 127.4%);
    padding-top: 140px;
    padding-bottom: 140px;
}
.ds-how-it-works .title-block .title h2 {
    color: #FFF;
    font-size: 40px;
    font-weight: 700;
    line-height: 103%;
    text-transform: uppercase;
}
.ds-how-it-works .title-block .description p {
    color: #FFF;
}
.ds-how-it-works .title-block .ds-btn a.hs-button {
    max-width: 387px;
    background: transparent;
    border-radius: 500px;
    border: 1.5px solid #FFF;
    box-shadow: 0px 0px 29px -3px rgba(12, 12, 123, 0.40);
}
.ds-how-it-works .title-block .ds-btn a.hs-button:hover {
    background: linear-gradient(90deg, #0C0C7B 17.16%, #616199 114.2%);
}
.ds-how-it-works .title-block .ds-btn {
    padding-top: 10px;
}
.ds-how-it-works .content-block {
    padding-left: 100px;
}
.ds-how-it-works .content-block .how-item {
    border-radius: 3px;
    background: rgba(222, 222, 222, 0.60);
    margin-bottom: 25px;
}
.ds-how-it-works .content-block .bottom-text span.hs_cos_wrapper_type_text {
    color: #FFF;
    font-weight: 600;
    font-size: 21px;
}
.ds-how-it-works .content-block .how-item .image {
    background: rgba(255, 255, 255, 0.80);
    -ms-flex: inherit;
    flex: auto;
    max-width: 100px;
    width: 100px !important;
    display: flex;
    justify-content: center;
    align-items: center;
}
.ds-how-it-works .content-block .how-item .text {
    -ms-flex: inherit;
    flex: auto;
    max-width: none;
    width: calc(100% - 100px);
    display: flex;
    align-items: center;
    padding: 10px 35px;
    min-height: 95px;
}
.ds-how-it-works .content-block .how-item .text span.hs_cos_wrapper_type_text {
    color: #FFF;
    font-size: 18px;
    font-weight: 500;
    line-height: 130%; /* 23.4px */
    letter-spacing: 0.18px;
    text-transform: uppercase;
}
.ds-how-it-works .content-block .how-item .image .hs_cos_wrapper_type_linked_image {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 20px 10px;
}
/* Form */
.design-service-page .contact-section {
    padding-top: 210px;
    padding-bottom: 150px;
    background-image: url(https://bluetuskr.com/hubfs/Blue%20Tusker/Group%20353%201.png);
    background-repeat: no-repeat;
    background-position: bottom;
}
.design-service-page .contact-section .text-center,.design-service-page .contact-section .contact-form {
    max-width: 842px;
    margin: 0 auto;
}
.design-service-page .contact-section .text-center h2 {
    font-size: 40px;
    line-height: 42px;
}
.design-service-page .contact-section .text-center p {
    max-width: 100%;
    font-size: 20px;
    line-height: 150%;
}
.design-service-page .contact-section .contact-form {
    padding: 40px 60px 55px 60px;
}
.ds-our-works {
    background: linear-gradient(101deg, rgba(6, 6, 58, 0.93) 39.83%, rgba(84, 84, 149, 0.28) 146.62%);
    padding-top: 65px;
    padding-bottom: 50px;
}
.ds-our-works .title h2, .ds-our-works .desc p {
    color: #fff;
}
.ds-our-works .desc p {
    max-width: 1040px;
    margin: 0 auto;
}
/* Footer */
.ds-footer {
    background-color: #fff;
    padding-top: 90px;
    padding-bottom: 90px;
}
.ds-footer .logo img {
    max-width: 293px;
}
.ds-footer .content .hs_cos_wrapper_type_rich_text {
    display: flex;
    justify-content: flex-end;
    align-items: center;
}
.ds-footer .content .hs_cos_wrapper_type_rich_text ul li a {
    color: #000;
    text-align: right;
    font-size: 18px;
    font-weight: 600;
    line-height: normal;
    font-family: 'Area';
}
.ds-footer .content .hs_cos_wrapper_type_rich_text ul li {
    padding-left: 12px;
    padding-right: 12px;
    position: relative;
}
.ds-footer .content .hs_cos_wrapper_type_rich_text ul {
    display: flex;
}
.ds-footer .content .hs_cos_wrapper_type_rich_text ul li:after {
    content: "";
    position: absolute;
    width: 2px;
    height: 90%;
    background-color: #000;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
}
.ds-footer .content .hs_cos_wrapper_type_rich_text ul li:last-child:after {
    display: none;
}
.ds-footer .content .hs_cos_wrapper_type_rich_text p {
    color: #858585;
    font-size: 18px;
    font-weight: 600;
    line-height: normal;
    margin-left: 20px;
}
.ds-footer .logo .hs_cos_wrapper_type_logo,.ds-footer .logo .hs_cos_wrapper_type_logo a {
    display: flex;
}
.ds-footer .row-fluid {
    align-items: center;
}
body.design-service-page p {
    font-size: 18px;
}
.kl-social-email-marketing .content-block {
    padding-right: 70px;
}
.ds-how-it-works .content-block .bottom-text span.hs_cos_wrapper_type_text {
    font-size: 20px;
}
/* Klaviyo Auto Emails */
.ds-hero.kl-hero .wrapper .content-block .form-block {
    border-radius: 16px;
    background: #FCFCFF;
    box-shadow: 0px 4px 37px 0px rgba(144, 144, 144, 0.25);
    margin-top: 65px;
    padding: 50px;
}
.ds-hero.kl-hero .wrapper .content-block .form-block .submitted-message h2,.ds-hero.kl-hero .wrapper .content-block .form-block .submitted-message h2 span {
    font-family: Roc Grotesk !important;
    font-weight: 700 !important;
    font-size: 28px;
    line-height: 36px;
}
.ds-hero.kl-hero .wrapper .content-block .form-block.thankyou-message .hs_cos_wrapper_type_header h2 {
    display: none !important;
}
.ds-hero.kl-hero .wrapper .content-block .form-block h3,
.ds-hero.kl-hero .wrapper .content-block .form-block .hs_cos_wrapper_type_header h2{
    color: #474747;
    font-size: 26px;
    font-weight: 700;
    line-height: 103%;
    text-transform: uppercase;
    margin-bottom: 30px;
}
.ds-hero.kl-hero .wrapper .content-block .form-block form .hs-form-field label span {
    color: #0F0F0F;
    font-size: 14px;
    font-weight: 400;
    line-height: 150%;
    font-family: 'Area';
}
.ds-hero.kl-hero .wrapper .content-block .form-block form .hs-form-field .input input,
.ds-hero.kl-hero .wrapper .content-block .form-block form .hs-form-field .input select{
    border-radius: 10px;
    border: 0.75px solid #A1A1A1;
    height: 43px;
    width: 100%;
    background-color: transparent;
    margin-top: 4px;
    padding: 0 15px;
    font-size: 14px;
    font-weight: 400;
    font-family: 'Area';
}
.ds-hero.kl-hero .wrapper .content-block .form-block form .form-columns-2 {
    max-width: 100%;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
}
.ds-hero.kl-hero .wrapper .content-block .form-block form .form-columns-2 .hs-form-field {
    width: 100% !important;
    float: none !important;
    margin: 0 !important;
}
.ds-hero.kl-hero .wrapper .content-block .form-block form .form-columns-2 .input {
    margin: 0 !important;
}
.ds-hero.kl-hero .wrapper .content-block .form-block form .hs_submit.hs-submit .actions input[type="submit"] {border-radius: 100px;background: linear-gradient(90deg, #0C0C7B 17.16%, #616199 114.2%);box-shadow: 0px 0px 29px -3px rgba(12, 12, 123, 0.40);color: #FFF;font-family: 'Area';font-size: 18px;font-weight: 700;line-height: normal;max-width: 260px;width: 100%;padding: 16px 0 16px 50px;position: relative;border: 0;text-align: left;cursor: pointer;}
.ds-hero.kl-hero .wrapper .content-block .form-block form .hs_submit.hs-submit .actions:after {
    content: "";
    position: absolute;
    background-image: url(https://bluetuskr.com/hubfs/Blue%20Tusker/Arrow%201-1.svg);
    width: 18px;
    height: 18px;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    top: 50%;
    transform: translateY(-50%);
    right: 40px;
}
.ds-hero.kl-hero .wrapper .content-block .form-block form .hs_submit.hs-submit .actions {
    position: relative;
    max-width: 260px;
    margin-top: 30px;
}
.ds-hero.kl-hero .wrapper .content-block .form-block form .hs_submit.hs-submit .actions input[type="submit"]:hover {
    background: linear-gradient(90deg, #616199 17.16%, #0C0C7B 114.2%);
}
.ds-hero.kl-hero .wrapper .content-block .form-block form .form-columns-1 {
    max-width: 100%;
}
.ds-hero.kl-hero .wrapper .content-block .form-block form .form-columns-1 .input {
    margin-right: 0;
}
.ds-hero.kl-hero .wrapper .content-block .form-block form .form-columns-1 .input,.ds-hero.kl-hero .wrapper .content-block .form-block form .form-columns-2 .input {
    margin-bottom: 10px !important;
}
.ds-hero.kl-hero .wrapper .content-block .form-block form .hs-form-field .input select {
    appearance: none;
    background-image: url(https://bluetuskr.com/hubfs/Bluetuskr%202024/angle_down.svg);
    background-repeat: no-repeat;
    background-position: center right 14px;
    background-size: 10px;
}
.ds-hero.kl-hero .wrapper .content-block .form-block form .form-columns-1 {
    max-width: 100%;
}
.ds-hero.kl-hero .wrapper .content-block .form-block form .form-columns-1 .input {
    margin-right: 0;
}
.ds-hero.kl-hero .wrapper .content-block .form-block form .form-columns-1 .input,.ds-hero.kl-hero .wrapper .content-block .form-block form .form-columns-2 .input {
    margin-bottom: 10px !important;
}
.ds-hero.kl-hero .wrapper .content-block .form-block form .hs-form-field .input select {
    appearance: none;
}
.ds-hero.kl-hero {
    background-image: none;
    background: var(--Hero-Gradient, linear-gradient(257deg, rgba(248, 248, 251, 0.50) 42.65%, rgba(237, 237, 250, 0.50) 108.08%));
    padding-top: 100px;
    padding-bottom: 100px;
}
.ds-hero.kl-hero .wrapper .image-block img {
    max-height: 700px;
    margin: 0 auto;
    display: block;
}
.klaviyo-page .design-service-header .site-logo a img {
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
}
.klaviyo-page .design-service-header {
    padding-top: 30px;
    padding-bottom: 30px;
}
.kl-what-you-recive {
    padding-top: 80px;
    padding-bottom: 80px;
}
.kl-what-you-recive .wrapper > .row-fluid-wrapper > .row-fluid {
    align-items: center;
}
.kl-what-you-recive .wrapper .content-block ul li {
    color: #0F0F0F;
    font-family: 'Area';
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: 275%;
    list-style: disc;
}
.kl-what-you-recive .wrapper .content-block ul {
    padding-left: 20px;
}
.kl-what-you-recive .wrapper .content-block .sub-title span {
    color: #0F0F0F;
    font-size: 18px;
    font-weight: 400;
    line-height: 150%; 
    font-family: 'Area';
    margin-bottom: 20px;
    display: block;
    max-width: 675px;
}
.kl-about-author {
    background-color: #ffffff;
    padding-top: 120px;
    padding-bottom: 120px;
    border-bottom: 1px solid #DDDDDD;
}
.kl-about-author .image img {
    width: 375px !important;
    height: 375px !important;
    border-radius: 50%;
    object-fit: cover;
    margin: 0 auto;
    display: block;
}
.kl-about-author .content h2 {
    margin-bottom: 30px;
}
.kl-about-author .content h6 {
    font-family: 'Area';
    font-size: 20px;
    font-weight: 700;
    line-height: 150%;
}
.kl-about-author .content h6 span {
    background: linear-gradient(91deg, #212152 0.98%, #54548B 22.19%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.kl-about-author .content p {
    margin-top: 20px;
}
.kl-social-email-marketing {
    padding-top: 80px;
    padding-bottom: 120px;
    background-color: #F9F9F9;
}
.kl-social-email-marketing .wrapper > .row-fluid-wrapper > .row-fluid {
    align-items: center;
}
.kl-social-email-marketing .wrapper .content-block h3 {
    text-transform: uppercase;
}
.kl-social-email-marketing .wrapper .image-block {
    padding-right: 60px;
}
.kl-social-email-marketing .content-block .content h2,
.kl-about-author .content h2,
.kl-what-you-recive .content-block h2 {
    font-size: 44px;
    line-height: 103%;
}
.kl-social-email-marketing .content-block .hs-button {
    max-width: 260px;
    width: 100%;
    padding: 18px 30px;
    margin-top: 40px;
}
.ds-btn .hs-button:after {
    right: 30px;
}
.ds-hero.kl-hero .description p {
    max-width: 100%;
}
.ds-hero.kl-hero .wrapper .content-block {
    padding-right: 115px;
}
/*Media Responsive CSS*/

@media (max-width:1799px){
  .ds-hero .wrapper .content-block{padding-right:100px}
  .ds-footer {
      padding-top: 80px;
      padding-bottom: 80px;
  }
  .design-service-page .contact-section {
      padding-top: 180px;
      padding-bottom: 120px;
  }
  .ds-hero.kl-hero .wrapper .content-block {
      padding-right: 85px;
  }
  .ds-hero.kl-hero .description p {
      font-size: 16px;
  }
  .ds-hero.kl-hero .wrapper .content-block .form-block {
      margin-top: 50px;
      padding: 40px;
  }
  .ds-hero.kl-hero .wrapper .content-block .form-block form .hs_submit.hs-submit .actions {
      margin-top: 40px;
  }
  .ds-hero.kl-hero .wrapper .image-block img {
      max-height: 600px;
  }
}
@media only screen and (max-width: 1599px) {
  .kl-social-email-marketing .content-block {
      padding-right: 40px;
  }
  .ds-how-it-works {
      padding-top: 100px;
      padding-bottom: 100px;
  }
  .ds-how-it-works .title-block .title h2 {
      font-size: 36px;
  }
  body.design-service-page p {
      font-size: 18px;
      line-height: 140%;
  }
  .ds-how-it-works .content-block .bottom-text span.hs_cos_wrapper_type_text {
      font-size: 18px;
      line-height: 120%;
  }
  .ds-btn .hs-button {
      font-size: 18px;
      padding: 16px 26px;
  }
  .ds-btn .hs-button:after {
      right: 26px;
  }
  .ds-how-it-works .title-block .ds-btn a.hs-button {
      max-width: 360px;
  }
  .ds-how-it-works .content-block .how-item .image {
      max-width: 80px;
      width: 80px !important;
  }
  .ds-how-it-works .content-block .how-item .text {
      width: calc(100% - 80px);
      padding: 10px 20px;
  }
  .ds-how-it-works .content-block .how-item .image .hs_cos_wrapper_type_linked_image {
      padding: 16px 10px;
  }
  .ds-footer {
      padding-top: 60px;
      padding-bottom: 60px;
  }
  .ds-footer .logo img {
      max-width: 260px;
  }
  .ds-footer .content .hs_cos_wrapper_type_rich_text ul li a,.ds-footer .content .hs_cos_wrapper_type_rich_text p {
      font-size: 16px;
      line-height: 20px;
  }
  .design-service-page .contact-section {
      padding-top: 150px;
      padding-bottom: 120px;
  }
  .ds-how-it-works .content-block .how-item .image .hs_cos_wrapper_type_linked_image img {
      max-height: 36px;
      max-width: 36px !important;
  }
  .ds-how-it-works .content-block .how-item .image .hs_cos_wrapper_type_linked_image {
      padding: 0;
  }
  .ds-how-it-works .content-block .how-item .image {
      max-width: 60px;
      width: 60px !important;
  }
  .ds-how-it-works .content-block .how-item .text span.hs_cos_wrapper_type_text {
      font-size: 14px;
  }
  .ds-how-it-works .content-block .how-item .text {
      min-height: 60px;
      padding: 10px 15px;
  }
  .ds-how-it-works .content-block .bottom-text span.hs_cos_wrapper_type_text {
      font-size: 14px;
  }
  .ds-btn .hs-button {
      font-size: 14px;
      line-height: 18px;
  }
  .ds-btn .hs-button:after {
      background-size: 14px;
      right: 22px;
  }
  .ds-btn .hs-button {
      padding: 14px 22px;
  }
  .ds-how-it-works {
      padding-top: 55px;
      padding-bottom: 55px;
  }
  .ds-faq-section {
      padding-top: 120px;
      padding-bottom: 100px;
  }
  .ds-faq-section .wrapper .faqs-wrapper .faq-item .title h6 {
      font-size: 20px;
      line-height: 24px;
  }
  .ds-faq-section .wrapper .faqs-wrapper .faq-item .title {
      padding-top: 22px;
      padding-bottom: 22px;
  }
  .ds-faq-section .wrapper .faqs-wrapper .faq-item .title h6:before {
      top: 5px;
  }
  .ds-faq-section .wrapper .faqs-wrapper .faq-item .collapsible-block p, .ds-faq-section .wrapper .faqs-wrapper .faq-item .collapsible-block li {
      font-size: 16px;
      line-height: 24px;
  }
  .ds-faq-section .wrapper .title-block .c-btn {
      font-size: 18px;
      padding: 18px 30px;
      margin-top: 15px;
  }
  .ds-faq-section .wrapper .title-block .c-btn:after {
      right: 30px;
  }
  .ds-image-text {
      padding-top: 120px;
      padding-bottom: 80px;
  }
  .ds-image-text .content-block .title h3 {
      font-size: 36px;
  }
  .kl-social-email-marketing .content-block .content h2,
  .kl-about-author .content h2,
  .kl-what-you-recive .content-block h2 {
      font-size: 36px;
  }
  .kl-social-email-marketing .content-block .hs-button {
      max-width: 220px;
  }
  .kl-social-email-marketing {
      padding-top: 60px;
      padding-bottom: 80px;
  }
  .kl-about-author .content h6 {
      font-size: 18px;
  }
  .kl-about-author .content h2 {
      margin-bottom: 20px;
  }
  .kl-about-author .image img {
      width: 320px !important;
      height: 320px !important;
  }
  .kl-about-author .wrapper > .row-fluid-wrapper > .row-fluid {
      align-items: center;
  }
  .kl-what-you-recive .wrapper .content-block .sub-title span {
      font-size: 16px;
  }
  .kl-what-you-recive .wrapper .content-block ul li {
      font-size: 16px;
      line-height: 250%;
  }
  .kl-what-you-recive {
      padding-top: 60px;
      padding-bottom: 60px;
  }
  .ds-hero.kl-hero .wrapper .content-block {
      padding-right: 40px;
  }
  .ds-hero.kl-hero .wrapper .content-block .title h1 {
      font-size: 36px;
  }
  .ds-hero.kl-hero .wrapper .content-block .form-block .submitted-message h2, .ds-hero.kl-hero .wrapper .content-block .form-block .submitted-message h2 span {
      font-size: 22px !important;
      line-height: 26px !important;
  }
}
@media only screen and (max-width:1439px){
  .ds-hero .wrapper .content-block{padding-right:50px}
  .ds-image-text .content-block{padding-right:0}
  .ds-image-text .image-block{padding-right:50px}
  .ds-how-it-works .title-block .title h2 {
      font-size: 32px;
  }
  body.design-service-page p {
      font-size: 16px;
  }
  .ds-btn .hs-button {
      font-size: 16px;
  }
  .ds-how-it-works .title-block .ds-btn a.hs-button {
      max-width: 320px;
  }
  .ds-how-it-works .content-block .how-item .image .hs_cos_wrapper_type_linked_image img {
      max-height: 48px;
      max-width: 48px !important;
  }
  .ds-how-it-works .content-block .how-item .text span.hs_cos_wrapper_type_text {
      font-size: 16px;
  }
  .ds-how-it-works .content-block .how-item .text {
      min-height: 80px;
  }
  .ds-how-it-works .content-block .how-item {
      margin-bottom: 20px;
  }
  .ds-how-it-works .content-block .bottom-text span.hs_cos_wrapper_type_text {
      font-size: 16px;
  }
  .ds-how-it-works {
      padding-top: 80px;
      padding-bottom: 80px;
  }
  .ds-how-it-works .content-block {
      padding-left: 60px;
  }
  .ds-image-text {
      padding-top: 100px;
      padding-bottom: 80px;
  }
  .kl-about-author {
      padding-top: 80px;
      padding-bottom: 80px;
  }
  .ds-hero.kl-hero .wrapper .content-block .title h1 {
      font-size: 32px;
  }
  .ds-hero.kl-hero .wrapper .content-block .form-block {
      margin-top: 40px;
      padding: 30px;
  }
  .ds-hero.kl-hero .wrapper .content-block .form-block form .hs_submit.hs-submit .actions input[type="submit"] {
      font-size: 18px;
  }
  .ds-hero.kl-hero {
      padding-top: 80px;
      padding-bottom: 80px;
  }
  .ds-hero.kl-hero .wrapper .image-block img {
      max-height: 520px;
  }
}
@media only screen and (max-width:1199px){
  .ds-hero .wrapper .content-block .title h1{font-size:30px}
  body.design-service-page p{font-size:16px}
  .ds-hero {padding:60px 0}
  .ds-image-text{padding-top:70px}
  .ds-how-it-works .content-block {padding-left: 80px;}
  .ds-footer .content .hs_cos_wrapper_type_rich_text ul li a, .ds-footer .content .hs_cos_wrapper_type_rich_text p {
      font-size: 14px;
      line-height: 18px;
  }
  .ds-footer .content .hs_cos_wrapper_type_rich_text ul li:after {
      height: 80%;
  }
  .ds-footer .logo img {
      max-width: 220px;
  }
  .ds-footer {
      padding-top: 40px;
      padding-bottom: 40px;
  }
  .design-service-page .contact-section {
      padding-top: 100px;
      padding-bottom: 100px;
  }
  .design-service-page .contact-section .text-center h2 {
      font-size: 32px;
      line-height: 38px;
  }
  .design-service-page .contact-section .text-center p {
      font-size: 16px;
  }
  .design-service-page .contact-section .contact-form {
      padding: 30px 50px 50px 50px;
  }
  .ds-how-it-works .content-block {
      padding-left: 60px;
  }
    .ds-faq-section {
     padding: 65px 0;
  }
  .ds-get-started .content-block {
      padding-right: 90px;
  }
  .ds-get-started .content-block {
      padding-right: 60px;
  }
  .ds-get-started .content-block h2 {
      font-size: 30px;
      line-height: 105%;
  }
  .ds-get-started .content-block .ds-btn {
      padding-top: 10px;
  }
  .ds-image-text .content-block .title h3 {
      font-size: 30px;
  }
  .kl-social-email-marketing .wrapper .image-block {
      padding-right: 40px;
  }
  .kl-social-email-marketing .content-block .content h2,
  .kl-about-author .content h2,
  .kl-what-you-recive .content-block h2 {
      font-size: 32px;
  }
  .kl-social-email-marketing .content-block .hs-button {
      margin-top: 30px;
  }
  .kl-what-you-recive .wrapper .content-block ul li {
      font-size: 16px;
      line-height: 150%;
  }
  .kl-what-you-recive .wrapper .content-block ul li:not(:last-child) {
      margin-bottom: 15px;
  }
  .ds-hero.kl-hero .wrapper .content-block .form-block h3,
  .ds-hero.kl-hero .wrapper .content-block .form-block .hs_cos_wrapper_type_header h2{
      font-size: 24px;
      margin-bottom: 20px;
  }
  .ds-hero.kl-hero .wrapper .content-block .form-block form .form-columns-2 {
      gap: 15px;
  }
  .ds-hero.kl-hero .wrapper .content-block .form-block form .hs_submit.hs-submit .actions {margin-top: 30px;max-width: 220px;}
  .ds-hero.kl-hero .wrapper .content-block .form-block form .hs_submit.hs-submit .actions input[type="submit"] {
      font-size: 16px;
      max-width: 220px;
      padding: 16px 0 16px 35px;
  }
  .ds-hero.kl-hero .wrapper .content-block .form-block form .hs_submit.hs-submit .actions:after {
      width: 14px;
      height: 14px;
      right: 30px;
  }
  .ds-hero.kl-hero .wrapper .content-block .title h1 {
      font-size: 26px;
  }
}
@media only screen and (max-width:991px){
  .kl-social-email-marketing .wrapper .content-block {
      order: 2;
  }
  .kl-social-email-marketing .wrapper .image-block {
      order: 1;
  }
  .design-service-header{padding-top:25px;padding-bottom:25px}
  .ds-hero .ds-container .row-fluid{flex-direction:column-reverse}
  .ds-hero{padding:60px 0}
  .ds-hero .wrapper .content-block,.ds-hero .wrapper .video-block{width:100%;max-width:100%;flex:100%;padding:0}
  .ds-hero .wrapper .video-block{margin-bottom:30px}
  .ds-hero .wrapper .content-block .title h1{font-size:30px}
  .ds-btn .hs-button{padding:14px 30px;font-size:18px;max-width:190px}
  .ds-btn .hs-button:after{right:30px}
  .ds-image-text .row-fluid>div{width:100%;flex:100%;max-width:100%}
  .ds-image-text .content-block{margin-top:30px}
  .ds-image-text .image-block{padding-right:0}
  .ds-image-text .content-block .title h3{font-size:30px}
  .ds-image-text .content-block .ds-btn .hs-button{margin-top:0}
  .ds-footer .row-fluid .logo,
  .ds-footer .row-fluid .content{
      -ms-flex: 0 0 100%;
      flex: 0 0 100%;
      max-width: 100%;
  }
  .ds-footer .row-fluid .logo {
      margin-bottom: 25px;
  }
  .ds-footer .content .hs_cos_wrapper_type_rich_text ul li:first-child {
      padding-left: 0;
  }
  .ds-footer .content .hs_cos_wrapper_type_rich_text {
      justify-content: flex-start;
  }
  .design-service-page .contact-section .contact-form {
      padding: 40px 40px 40px 40px;
      margin-top: 40px !important;
  }
  .design-service-page .contact-section {
      padding-top: 80px;
      padding-bottom: 80px;
  }
  .ds-how-it-works .wrapper .title-block,.ds-how-it-works .wrapper .content-block {
      -ms-flex: 0 0 100%;
      flex: 0 0 100%;
      max-width: 100%;
  }
  .ds-how-it-works .wrapper .content-block {
      padding-left: 0;
      padding-top: 40px;
  }
  .ds-get-started .image-block {
      display: none !important;
  }
  .ds-get-started .content-block {
      padding-top: 0;
      padding-right: 0;
      -ms-flex: 0 0 100%;
      flex: 0 0 100%;
      max-width: 100%;
  }
  .ds-get-started {
      padding-bottom: 50px;
      padding-top: 50px;
  }
  .kl-social-email-marketing .wrapper .span6 {
      -ms-flex: 0 0 100%;
      flex: 0 0 100%;
      max-width: 100%;
      padding-right: 0;
  }
  .kl-social-email-marketing {
      padding-top: 60px;
      padding-bottom: 60px;
  }
  .kl-about-author .wrapper .content,.kl-about-author .wrapper .image {
      -ms-flex: 0 0 100%;
      flex: 0 0 100%;
      max-width: 100%;
  }
  .kl-about-author .wrapper .content {
      order: 2;
      padding-top: 40px;
  }
  .kl-about-author .wrapper .image {
      order: 1;
  }
  .kl-about-author .image img {
      width: 220px !important;
      height: 220px !important;
  }
  .kl-about-author {
      padding-top: 30px;
      padding-bottom: 60px;
  }
  .kl-what-you-recive .span6 {
      -ms-flex: 0 0 100%;
      flex: 0 0 100%;
      max-width: 100%;
  }
  .ds-hero.kl-hero {
      padding-top: 40px;
      padding-bottom: 60px;
  }
  .ds-hero.kl-hero .wrapper .span6 {
      width: 100%;
      max-width: 100%;
      padding-right: 0;
  }
  .ds-hero.kl-hero .wrapper .content-block {
      padding-top: 50px;
      text-align: center;
  }
  .ds-hero.kl-hero .wrapper .content-block .form-block form .hs-form-field label {
      text-align: left;
      display: block;
  }
  .ds-hero.kl-hero .wrapper .content-block .form-block form .hs_submit.hs-submit .actions input[type="submit"],.ds-hero.kl-hero .wrapper .content-block .form-block form .hs_submit.hs-submit .actions {
      margin-left: auto;
      margin-right: auto;
      max-width: 240px;
  }
  .ds-hero.kl-hero .wrapper .content-block .form-block form .hs_submit.hs-submit .actions:after {
      right: 24px;
  }
}
@media only screen and (max-width:767px){
  .ds-container{padding-right:30px!important;padding-left:30px!important}
  .site-logo a{justify-content:center}
  .design-service-header .contact-btn{display:none}
  .ds-hero{padding:40px 0}
  .ds-image-text{padding-top:40px}
  .design-service-page .contact-section .text-center {
      text-align: left;
  }
  .design-service-page .contact-section .text-center h2 {
      font-size: 30px;
      line-height: 36px;
  }
  .design-service-page .contact-section .contact-form {
      padding: 40px 20px 40px 20px;
  }
  .design-service-page .contact-section {
      padding-top: 80px;
      padding-bottom: 60px;
  }
  .ds-how-it-works .title-block .title h2 {
      font-size: 30px;
  }
  .ds-how-it-works {
      padding-top: 60px;
      padding-bottom: 60px;
  }
  .ds-faq-section .wrapper .faqs-wrapper .faq-item .title h6 {
      font-size: 21px;
      line-height: 31.5px;
  }
  .kl-social-email-marketing .content-block .content h2,
  .kl-about-author .content h2,
  .kl-what-you-recive .content-block h2 {
      font-size: 28px;
  }
  .ds-hero.kl-hero .wrapper .content-block .form-block form .form-columns-2 {
      display: block;
  }
  .ds-hero.kl-hero .wrapper .content-block .title h1 {
      font-size: 24px;
  }
  .klaviyo-page .design-service-header .site-logo a img {
      max-width: 140px;
  }
  .klaviyo-page .design-service-header {
      padding-top: 22px;
      padding-bottom: 22px;
  }
}
@media only screen and (max-width: 575px) {
  .ds-footer .content .hs_cos_wrapper_type_rich_text ul,.ds-footer .content .hs_cos_wrapper_type_rich_text p {
      width: 100%;
  }
  .ds-footer .content .hs_cos_wrapper_type_rich_text {
      flex-wrap: wrap;
  }
  .ds-footer .content .hs_cos_wrapper_type_rich_text p {
      margin-left: 0;
      margin-top: 18px;
  }
  body.design-service-page h2 {
      font-size: 20px;
      line-height: 28px;
  }
  .ds-hero.kl-hero .wrapper .content-block .form-block .submitted-message h2, .ds-hero.kl-hero .wrapper .content-block .form-block .submitted-message h2 span {
      font-size: 18px !important;
      line-height: 24px !important;
  }
}
@media only screen and (max-width:480px){
  .ds-hero .wrapper .content-block .title h1,
  .ds-image-text .content-block .title h3,
  .ds-image-text .content-block .title h3,
  .ds-get-started .content-block h2 {
      font-size: 26px;
  }
  .design-service-page .contact-section .text-center h2 {
      font-size: 26px;
      line-height: 32px;
  }
  .ds-how-it-works .content-block .how-item .image .hs_cos_wrapper_type_linked_image img {
      max-height: 36px;
      max-width: 36px !important;
  }
  .ds-how-it-works .content-block .how-item .image .hs_cos_wrapper_type_linked_image {
      padding: 0;
  }
  .ds-how-it-works .content-block .how-item .image {
      max-width: 60px;
      width: 60px !important;
  }
  .ds-how-it-works .content-block .how-item .text span.hs_cos_wrapper_type_text {
      font-size: 14px;
  }
  .ds-how-it-works .content-block .how-item .text {
      min-height: 60px;
      padding: 10px 15px;
  }
  .ds-how-it-works .content-block .bottom-text span.hs_cos_wrapper_type_text {
      font-size: 14px;
  }
  .ds-btn .hs-button {
      font-size: 14px;
      line-height: 18px;
  }
  .ds-btn .hs-button:after {
      background-size: 14px;
      right: 22px;
  }
  .ds-btn .hs-button {
      padding: 14px 22px;
  }
  .ds-how-it-works {
      padding-top: 55px;
      padding-bottom: 55px;
  }
  .kl-social-email-marketing .content-block .content h2,
  .kl-about-author .content h2,
  .kl-what-you-recive .content-block h2 {
      font-size: 24px;
  }
  .kl-about-author .content h6 {
      font-size: 16px;
  }
  .kl-about-author .content h2 {
      margin-bottom: 15px;
  }
  .kl-about-author {
      padding-top: 50px;
      padding-bottom: 50px;
  }
}