/* @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    */
/*****************************************/

/*
* The Typekit service used to deliver this font or fonts for use on websites
* is provided by Adobe and is subject to these Terms of Use
* http://www.adobe.com/products/eulas/tou_typekit. For font license
* information, see the list below.
*
* interface:
*   - http://typekit.com/eulas/00000000000000003b9ae112
*   - http://typekit.com/eulas/00000000000000003b9ae113
*   - http://typekit.com/eulas/00000000000000003b9ae115
*   - http://typekit.com/eulas/00000000000000003b9ae114
*
* © 2009-2021 Adobe Systems Incorporated. All Rights Reserved.
*/
/*{"last_published":"2021-07-07 20:19:42 UTC"}*/

@import url("https://p.typekit.net/p.css?s=1&k=vbn7pyu&ht=tk&f=9739.9740.9741.9742&a=61337288&app=typekit&e=css");
<link rel=“stylesheet” href=“https://use.typekit.net/hfb6vta.css”>

@font-face {
  font-family:"interface";
  src:url("https://use.typekit.net/af/2837a6/00000000000000003b9ae112/27/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("woff2"),url("https://use.typekit.net/af/2837a6/00000000000000003b9ae112/27/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("woff"),url("https://use.typekit.net/af/2837a6/00000000000000003b9ae112/27/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("opentype");
  font-style:normal;font-weight:400;
}

@font-face {
  font-family:"interface";
  src:url("https://use.typekit.net/af/233853/00000000000000003b9ae113/27/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3") format("woff2"),url("https://use.typekit.net/af/233853/00000000000000003b9ae113/27/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3") format("woff"),url("https://use.typekit.net/af/233853/00000000000000003b9ae113/27/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3") format("opentype");
  font-style:italic;font-weight:400;
}

@font-face {
  font-family:"interface";
  src:url("https://use.typekit.net/af/8882b8/00000000000000003b9ae115/27/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3") format("woff2"),url("https://use.typekit.net/af/8882b8/00000000000000003b9ae115/27/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3") format("woff"),url("https://use.typekit.net/af/8882b8/00000000000000003b9ae115/27/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3") format("opentype");
  font-style:normal;font-weight:700;
}

@font-face {
  font-family:"interface";
  src:url("https://use.typekit.net/af/dd4de0/00000000000000003b9ae114/27/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i7&v=3") format("woff2"),url("https://use.typekit.net/af/dd4de0/00000000000000003b9ae114/27/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i7&v=3") format("woff"),url("https://use.typekit.net/af/dd4de0/00000000000000003b9ae114/27/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i7&v=3") format("opentype");
  font-style:italic;font-weight:700;
}

.tk-interface { font-family: "interface",sans-serif; }

.custom-menu-primary {
  display:none;
}

.custom-menu-primary .hs-menu-wrapper,
.custom-menu-primary .hs-menu-children-wrapper{
  display: none;
}

body {
  margin: 0;
  font-family:"interface";
}

h1, h2, h3, h4, h5, h6, p {
  margin: 0;
}

h1 {
  font-size: 60px;
  line-height: 76px;
}

h2 {
  font-size: 52px;
  line-height: 64px;
}

h3, summary, .accordion {
  font-size: 40px;
  line-height: 56px;
}

h4 {
  font-size: 32px;
  line-height: 48px;
}

h5 {
  font-size: 24px;
  line-height: 40px;
}

p {
  font-size: 17px;
  line-height: 25px;
}

img {
  /*   max-width: 1220px !important; */
  float: none;
  margin: 0 auto;
  display: block;
}

.mobile-only {
  display: none !important;
}

.desktop-only {
  display: block !important;
}

.white-text {
  color: #ffffff;
}

.vertical-align {
  display: flex;
  align-items: center;
  justify-content: center;
}

.container-header {
  padding-top: 48px;
  padding-bottom: 0;
}

.logo-img img {
  display: inline-block;
  margin-left: 0;
}

.p2 {
  font-size: 14px;
  line-height: 21px;
}

.subheading {
  font-size: 17px;
  line-height: 20px;
  font-weight: bold;
}

.text-link {
  font-size: 17px;
  line-height: 25px;
}

.container-inner {
  max-width: 1440px;
  margin: 0 auto !important;
  float: none !important;
}

.container-1220 {
  max-width: 1220px;
  margin: 0 auto !important;
  float: none !important;
}

.container-524 {
  max-width: 524px;
  margin: 0 auto !important;
  float: none !important;
}

.primary-button, input[type="submit" i] {
  font-size: 17px;
  line-height: 20px;
  box-sizing: border-box;
  padding: 17px;
  border: 2px solid #0F0F0F;
  border-radius: 32px;
  background-color: #0F0F0F;
  height: 56px;
  width: 180px;
  color: #FFFFFF;
  font-weight: bold;
  letter-spacing: 0.2px;
  text-align: center;
  text-decoration: none;
  display: block;
}

.secondary-button {
  font-size: 17px;
  line-height: 20px;
  box-sizing: border-box;
  padding: 17px;
  border: 2px solid #0F0F0F;
  border-radius: 32px;
  background-color: #FFFFFF;
  height: 56px;
  width: 180px;
  color: #0A0A0E;
  font-weight: bold;
  letter-spacing: 0.2px;
  text-align: center;
  text-decoration: none;
  display: block;
}

.tertiary-button {
  font-size: 17px;
  line-height: 20px;
  box-sizing: border-box;
  padding: 17px;
  border: 2px solid #ffffff;
  border-radius: 32px;
  background-color: transparent;
  height: 56px;
  width: 180px;
  color: #ffffff;
  font-weight: bold;
  letter-spacing: 0.2px;
  text-align: center;
  text-decoration: none;
  display: block;
}

.quaternary-button {
  font-size: 17px;
  line-height: 20px;
  box-sizing: border-box;
  padding: 17px;
  border: 2px solid #ffffff;
  border-radius: 32px;
  background-color: #1C73E5;
  height: 56px;
  width: 180px;
  color: #ffffff;
  font-weight: bold;
  letter-spacing: 0.2px;
  text-align: center;
  text-decoration: none;
  display: block;
}

.show {
  display: block !important;
}

.hide {
  display: none !important;
}

form {
  font-size: 24px;
  line-height: 40px;
  font-weight: bold;
}

form ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
}

input[type="checkbox"] {
  width: auto !important;
  margin-right: 16px;
}

.hs-form-checkbox {
  font-size: 17px !important;
  line-height: 25px !important;
  font-weight: normal !important;
}

fieldset {
  max-width: none !important;
}



textarea {
  font-family:"interface";
  padding: 16px;
  width: 100%;
  box-sizing: border-box;
  margin-bottom: 60px;
  font-size: 24px;
  line-height: 40px;
  font-weight: bold;
  height: 220px;
  margin-top: 40px;
  max-width: 845px;
}

select {
  font-family:"interface";
  margin-bottom: 60px;
  font-size: 17px;
  line-height: 25px;
  padding: 16px 23px;
  margin-top: 12px;
}

.field>label {
  margin-top: 60px;
  display: inline-block;
}

.hs-input {
  width: 100% !important;
}

input[type="text"], input[type="email"], input[type="tel"] {
  -webkit-appearance: none;
  outline: none;
  border:none;
  background-image:none;
  background-color:transparent;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;  
  padding: 16px !important;
  width: 100%;
  max-width: 390pxt;
  box-sizing: border-box;
  border-top: 0;
  border-left: 0;
  border-right: 0;
  border-bottom: 1px solid #0f0f0f;
  font-size: 24px;
  line-height: 40px;
  font-weight: normal;
  color: #4A4A4A;
  outline: none;
}

.hs-error-msgs, .hs-error-msg {
  color: #EE2F2F;
  font-size: 17px;
  line-height: 25px;
  list-style-type: none;
  font-weight: normal;
  padding: 0;
  margin-top: 12px;
}

.select-wrapper {
  position: relative;
  /*Don't really need this just for demo styling*/

  float: left;
  width: 100%;
  max-width: 390px;
}

.select-wrapper:after {
  content: '\f078';
  font: normal normal normal 17px/1 FontAwesome;
  color: #0F0F0F;
  right: 11px;
  top: 6px;
  height: 34px;
  padding: 18px 10px 0px 8px;
  position: absolute;
  pointer-events: none;
}

/* IE11 hide native button (thanks Matt!) */
select::-ms-expand {
  display: none;
}

.select-wrapper select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  /* Add some styling */

  display: block;
  width: 100%;
  max-width: 390px;
  height: 50px;
  float: left;
  margin: 5px 0px;
  padding: 0px 24px;
  font-size: 16px;
  line-height: 1.75;
  color: #333;
  background-color: #ffffff;
  background-image: none;
  border: 1px solid #0F0F0F;
  -ms-word-break: normal;
  word-break: normal;
}

@media only screen and (max-width: 768px) {
  .design-workshop, .design-workshop p, .design-workshop h1, .case-intro h1, .case-intro p, .case-study h1, .case-study p, .case-study {
    text-align: left !important;
  }
  .process-flow {
    display: none;
  }
  .case-study .white-spacer, .design-workshop .white-spacer {
    height: 40px !important;
  }

}

@media only screen and (max-width: 1220px) {
  .container-1220 {
    padding-left: 16px;
    padding-right: 16px;
  }
  .case-intro {

  }
}


/* Menu CSS */

.mobile-trigger i, .mobile-trigger i:before, .mobile-trigger i:after {
  width: 48px;
  height: 4px;
  background-color: #1C73E5;
}

.custom-menu-primary.js-enabled {
  margin: 0;
}

.mobile-trigger {
  border: none;
}

.mobile-trigger:hover i, .mobile-trigger:hover i:before, .mobile-trigger:hover i:after, .mobile-open .mobile-trigger i, .mobile-open .mobile-trigger i:before, .mobile-open .mobile-trigger i:after {
  background-color: #1c73e5;
}

.mobile-open .mobile-trigger {
  background: transparent;
}

.mobile-trigger i:before {
  top: -10px;
  width: 32px;
}

.mobile-trigger-hover i:before {
  width: 48px;
}

.mobile-trigger:hover, .mobile-trigger:visited {
  background-color: transparent;
}

.mobile-trigger i:after {
  top: 10px;
}

.hs-menu-flow-vertical {
  background: #0F0F0F;
  z-index: 9999;
  position: fixed !important;
}

.custom-menu-primary.js-enabled {
  float: right;
}

.custom-menu-primary.js-enabled .hs-menu-wrapper {
  left: auto !important;
  float: right !important;
  max-width: 605px;
  position: absolute;
  right: 0;
  padding: 50px 40px 50px 120px;
  box-sizing: border-box;
  height: 100vh;
}

.custom-menu-primary .hs-menu-wrapper>ul>li {
  padding-bottom: 32px;
  height: 56px;
  border-top: none;
}

.custom-menu-primary .hs-menu-wrapper>ul>li a {
  font-size: 40px;
  line-height: 36px;
  font-weight: bold;
}

.custom-menu-primary .hs-menu-wrapper>ul>li a:hover {
  text-decoration: underline;
}

.close-btn {
  max-width: 36px;
  display: block;
  margin-right: 0;
}

ul[role='menu'] {
  padding-top: 80px !important;
}

.container-footer {
  background: #0F0F0F;
  color: #FFFFFF;
  font-size: 17px;
  line-height: 25px;
  padding: 60px 0 48px 0;
}

.container-footer a {
  text-decoration: none;
  color: #FFFFFF;
}

.container-footer ul {
  padding-left: 0;
  margin-top: 0;
  margin-bottom: 0;
}

.container-footer ul li {
  list-style-type: none;
  display: inline-block;
  margin-right: 80px;
  padding: left;
}

.container-footer img {
  list-style-type: none;
  display: inline-block;
  margin-right: 32px;
  margin-top: 48px;
}

.copyright {
  margin-top: 48px;
}

@media (max-width: 1139px) {
  .vertical-align {
    display: block;=
  }
  .container-pulsingbutton {
    width: 100%;
  }
}

@media only screen and (max-width: 991px) {
  .container-footer ul li {
    list-style-type: none;
    display: block;
    margin-right: 80px;
    padding: left;
  }
  h1 {
    font-size: 32px;
    line-height: 48px;
  }
  h2 {
    font-size: 32px;
    line-height: 48px;
  }
  h3 {
    font-size: 24px;
    line-height: 40px;
  }
  p {
    font-size: 17px;
    line-height: 25px;
  }
  .white-text {
    color: #000000;
  }
  .mobile-only {
    display: block !important;
  }

  .desktop-only {
    display: none !important;
  }
}

@media only screen and (max-width: 767px) {
  .custom-menu-primary.js-enabled {
    float: none;
  }
  .custom-menu-primary.js-enabled .hs-menu-wrapper {
    max-width: none;
    position: relative;
    padding: 50px 40px;
  }
  .container-logo .span11, .container-logo .span1 {
    display: inline-block;
    width: 49%;
    margin-left: 0 !important;
  }
  .container-footer ul li {
    margin-top: 32px;
  }
  .custom-menu-primary .hs-menu-wrapper>ul li a {
    text-align: center;
  }
}



/* Custom Input */
ul.inputs-list.multi-container li.hs-form-checkbox {
  margin: 16px 0;
}
ul.inputs-list.multi-container li.hs-form-checkbox label {
  position: relative;
}
ul.inputs-list.multi-container li.hs-form-checkbox label span {
  display: inline-block;
  margin-left: 40px; /* Width of the new radio select and any additional spacing on the left */
  margin-right: 16px; /* Additional spacing on the right */
}
/* Hide the original checkbox */
ul.inputs-list.multi-container li.hs-form-checkbox label input {
  height: 24px;
  left: 0;
  opacity: 0;
  position: absolute;
  top: 0;
  width: 24px;
}
/* Add new checkbox */
ul.inputs-list.multi-container li.hs-form-checkbox label span::before {
  border: 2px solid #1C73E5;
  content: "";
  height: 20px;
  left: 0;
  position: absolute;
  top: 0;
  width: 20px;
  border-radius: 4px;
}
/* Style new checked item */
ul.inputs-list.multi-container li.hs-form-checkbox label span::after {
  content: "";
  border: 4px solid #1c73e5;
  border-left: 0;
  border-top: 0;
  height: 14px;
  left: 7px;
  opacity: 0;
  position: absolute;
  top: 1px;
  transform: rotate(
    45deg);
  transition: opacity .2s ease-in-out;
  width: 6px;
}
/* Show when checked */
ul.inputs-list.multi-container li.hs-form-checkbox label input:checked + span::after {
  opacity: 1;
}
/* Style when focused */
ul.inputs-list.multi-container li.hs-form-checkbox label input:focus + span::after {
  outline: 3px solid transparent; /* For Windows high contrast mode. */
}




.blogroll-2023 * { box-sizing: border-box; -webkit-box-sizing: border-box; -moz-border-sizeing: border-box; }

.blog-body-wrapper { padding-top: 146px; padding-bottom: 80px; } 
.blog-body-wrapper .blog-outer > div > div { display: flex; flex-wrap: wrap; }
.blog-body-wrapper .blog-outer .blog-left { width: calc(100% - 392px); }
.blog-body-wrapper .blog-outer .blog-right { width: 392px; margin-left: 0; }
.blog-body-wrapper .blog-heading { padding-bottom: 32px; } 
.blog-outer .post-listing { display: flex; flex-wrap: wrap; }
.blog-outer .post-listing .post-item { width: 50%; padding-right: 24px; padding-bottom: 32px; padding-top: 32px; }
.blog-outer .post-listing .post-item .post-item-img { height: 261px; display: block; }
.blog-outer .post-listing .post-item .post-item-img img { width: 100% !important; height: 100% !important; float: none; margin: 0px; max-width: 100% !important; object-fit: cover; }
.blog-outer .post-listing .post-item .post-item-content { padding-top: 10px; }
.blog-outer .post-listing .post-item .post-item-content .text { font-family: InterFace; font-size: 17px; font-style: normal; font-weight: 400; line-height: 147.059%; color: #0F0F0F; padding-top: 10px; padding-bottom: 10px; }
.blog-outer .post-listing .post-item .post-item-content .bottom-con { display: flex; align-items: center; color: #0F0F0F; font-family: InterFace; font-size: 14px; font-weight: 400; line-height: 150%; }
.blog-outer .post-listing .post-item .post-item-content .bottom-con .author a { color: #0F0F0F; text-decoration: none; }
.blog-outer .post-listing .post-item .post-item-content .bottom-con .author { position: relative; padding-left: 10px; margin-left: 10px; }
.blog-outer .post-listing .post-item .post-item-content .bottom-con .author:before { content: ''; position: absolute; top: 0; left: 0; border-left: 1px solid currentColor; bottom: 0; height: 70%; margin: auto; }
.blog-outer .post-listing .post-item .post-item-content .bottom-con .author a:hover { color: #1c73e5; }
.blog-outer .post-listing .post-item .post-item-content h5 a { text-decoration: none; line-height: normal; color: #0F0F0F; }
.blog-outer .post-listing .post-item .post-item-content h5 { font-family: InterFace; color: inherit; line-height: normal; }
.blog-outer .post-listing .post-item .post-item-content h5 a:hover { color: #1c73e5; }


.blog-outer .blog-pagination { padding-top: 48px; }
.blog-outer .blog-pagination .pagination { margin: 0; padding: 0; list-style-type: none; display: flex; flex-wrap: wrap; align-items: center; }
.blog-outer .blog-pagination .pagination .number a { width: 30px; height: 30px; background-color: transparent; border-radius: 100%; display: flex; align-items: center; justify-content: center; color: #1C73E5; text-decoration: none; font-family: InterFace; font-size: 24px; font-weight: 700; }
.blog-outer .blog-pagination .pagination .number.active a { background-color: #1C73E5; color: #fff; }
.blog-outer .blog-pagination .pagination .number { margin: 0px 20px; }
.blog-outer .blog-pagination .pagination li:not(.number) a { display: flex; align-items: center; flex-wrap: wrap; }
.blog-outer .blog-pagination .pagination li:not(.number) a svg { display: block; width: auto; height: auto; }
.blog-outer .blog-pagination .pagination li:not(.number) { display: flex; align-items: center; flex-wrap: wrap; }
.blog-outer .blog-pagination .pagination li:not(.number):first-child { transform: rotate(180deg); margin-right: 20px; }
.blog-outer .blog-pagination .pagination li:not(.number):last-child { margin-left: 20px; }
.blog-outer .blog-pagination .pagination li:not(.number).disabled { display: none; }
.blog-outer .blog-pagination .pagination li:not(.number) a > span { font-family: InterFace; font-size: 24px; font-weight: 700; display: inline-block; margin-right: 15px; color: #1C73E5; }
.blog-outer .blog-pagination .pagination li:not(.number) a { text-decoration: none; }
.blog-outer .blog-pagination .pagination li:not(.number):first-child a > span { transform: rotate(180deg); }

.blog-body-wrapper .blog-outer .blog-right > div { border-radius: 2px; background: #F5F5F5; padding: 40px 40px 80px 40px; position: sticky; top: 70px; }
.featured-main .featured-outer .featured-heading { font-family: InterFace; font-size: 24px; font-weight: 700; color: #0F0F0F; }
.featured-main .featured-outer .featured-list { margin-top: 40px; }
.featured-main .featured-outer .featured-list h5 { font-family: InterFace; font-size: 20px; font-weight: 700; line-height: 125%; }
.featured-main .featured-outer .featured-list h5 a { text-decoration: none; line-height: normal; color: #0F0F0F; display: inline-block; }
.featured-main .featured-outer .featured-list h5 a:hover { color: #1c73e5; }
.featured-main .featured-outer .featured-list .bottom-con { margin-top: 9px; font-family: InterFace; font-size: 14px; font-weight: 400; line-height: 150%; color: #0F0F0F; }
.featured-main .featured-outer .featured-list .bottom-con a.author-link { text-decoration: none; color: #0F0F0F; }
.featured-main .featured-outer .featured-list .bottom-con a.author-link:hover { color: #1c73e5; }
.featured-main .featured-outer .featured-list .bottom-con .author { position: relative; padding-left: 10px; margin-left: 10px; }
.featured-main .featured-outer .featured-list .bottom-con .author:before { content: ''; position: absolute; top: 0; left: 0; border-left: 1px solid currentColor; bottom: 0; height: 70%; margin: auto; }

.slpwork-main { background: #1C73E5; padding: 76px 0px; position: relative; z-index: 1; overflow: hidden; }
.slpwork-main .slpwork-outer { text-align: center; max-width: 805px; margin: 0 auto; }
.slpwork-main .slpwork-outer h2 { color: #FFF; text-align: center; font-family: InterFace; font-size: 52px; font-style: normal; font-weight: 700; line-height: 123.077%; margin: 0; }
.slpwork-main .slpwork-outer .text { color: #FFF; text-align: center; font-family: InterFace; font-size: 17px; font-style: normal; font-weight: 400; line-height: 147.059%; padding-top: 32px; max-width: 600px; margin: 0px auto; }
.slpwork-main .slpwork-outer .btn { text-align: center; padding: 54px 0px 0px; }
.slpwork-main .slpwork-outer .btn a.primary-button { display: inline-block; line-height: 1em; }
.slpwork-main:before { content: ''; z-index: -1; pointer-events: none; position: absolute; bottom: 0; left: 0; background-image: url(https://1546566.fs1.hubspotusercontent-na1.net/hubfs/1546566/Images-2023/Dot%20Pattern%20Mask%20Copy%203.png); background-repeat: no-repeat; background-position: center; background-size: contain; width: 774px; height: 426px; }
.slpwork-main:after { content: ''; z-index: -1; pointer-events: none; position: absolute; top: 0; right: 0; background-image: url(https://1546566.fs1.hubspotusercontent-na1.net/hubfs/1546566/Images-2023/Dot%20Pattern%20Mask%20Copy%203.png); background-repeat: no-repeat; background-position: center; background-size: contain; width: 774px; height: 426px; transform: rotate(180deg); }



@media(max-width: 1199px){
    
    .blog-body-wrapper { padding-top: 80px; padding-bottom: 60px; }
    .blog-body-wrapper .blog-outer .blog-right { width: 350px; }
    .blog-body-wrapper .blog-outer .blog-left { width: calc(100% - 350px); }

}
@media(max-width: 991px){

    .slpwork-main .lpwork-outer h2 { font-size: 40px; line-height: 1.3; }

    .blog-body-wrapper .blog-outer .blog-left { width: 100%; }
    .blog-body-wrapper .blog-outer .blog-right { width: 100%; }
    .blog-outer .post-listing .post-item { width: calc(50% - 24px); padding-right: 0; margin: 0px 12px; padding-left: 0; }
    .blog-outer .post-listing { margin: 0px -12px; }
    .blog-body-wrapper .blog-heading { padding-bottom: 10px; }
    .blog-body-wrapper .blog-outer .blog-right > div { padding: 40px 40px 80px 40px; position: initial; top: 0; margin-top: 40px; }

    
}
@media(max-width: 767px){

    .slpwork-main .slpwork-outer h2 { font-size: 32px; line-height: 150%; }
    .slpwork-main .slpwork-outer .text { font-size: 20px; line-height: 160%; max-width: 100%; padding-top: 24px; }
    .slpwork-main .slpwork-outer .text * { font-size: 20px; line-height: 160%; }
    .slpwork-main .slpwork-outer .btn { padding: 24px 0 0; }
    .slpwork-main:before { right: 0; left: inherit; transform-origin: 77% 3%; }
    .slpwork-main:after { display: none; }
    .slpwork-main:after,
    .slpwork-main:before { height: 370px; width: 648px; transform: rotate(270deg) translateX(148px) translateY(-216px); }
    .slpwork-main { padding: 80px 0; }

    .blogroll-2023 h1 { font-size: 40px; line-height: normal; }
    .blog-outer .post-listing .post-item { width: 100%; padding-right: 0; margin: 0; padding-left: 0; padding-bottom: 20px; padding-top: 20px; }
    .blog-outer .post-listing { margin: 0; }
    .blog-body-wrapper .blog-heading { padding-bottom: 30px; }
    .blog-outer .post-listing .post-item .post-item-content h5 { font-size: 20px; }
    .blog-outer .post-listing .post-item .post-item-content .text { font-size: 14px; }
    .blog-outer .post-listing .post-item .post-item-img { height: 192px; }
    .blog-body-wrapper .blog-outer .blog-right > div { padding: 40px 16px 56px 16px; margin-left: -16px; margin-right: -16px; }
    .blog-body-wrapper { padding-top: 80px; padding-bottom: 0; }

    
}