*{box-sizing:border-box}
  :root{--primary:#855432;--secondary:#DDCAB5;--tertiary:#C7806C;--heading:#666F63;--body:#5b5b5b;--desktopfont:16px;--mobilefont:14px}
  html{scroll-behavior:smooth}
  h1{font-size:2.2em;margin:.32em 0;font-family:'Cormorant',serif;color:var(--heading);font-weight:600}
  h2{font-size:5em;margin:.3em 0;color:var(--heading);font-family:'Cormorant',serif;font-weight:400;text-transform:lowercase;opacity:.5;line-height:.9}
  h3{font-size:1.17em;margin:1em 0;color:var(--tertiary);font-family:'Roboto Condensed',sans-serif;text-transform:uppercase;font-weight:lighter;text-align:left}
  h4{font-size:1em;margin:1.33em 0}
  h5{font-size:.83em;margin:1.67em 0}
  h6{font-size:.67em;margin:2.33em 0}
  .lg-body{font-size:1.15em;margin:.3em auto;max-width:550px;line-height:1.4}
  .subheading{margin-bottom:.3em}
  #recentWorks .subheading {display: flex;justify-content: space-between; align-items: center;}
  .subheading h3{position:relative;margin: 0;}
  .subheading p{margin:.3em 0}
  .subheading h3::after{height:2px;background:var(--tertiary);display:block;z-index:-1;content:'';width:50px;position:absolute;top:14px;left:-68px}
  .section-copy h2{text-align:center}
  .section-copy p{margin:.5rem 0}

  .embtn{position:relative;overflow:hidden;}
  .embtn-hover::before{left:-100%;transition:all 0.65s ease-in-out;}
  .embtn-hover:hover::before{left:100%}
  .btn-eff::before,.ebtn-eff::after{content:"";display:block;position:absolute;height:100%;top:0}
  .btn-eff::before{background:rgba(255,255,255,0.5);width:60px;left:0;filter:blur(30px);animation:shine-alt1 1.5s ease-in-out infinite}
  .embtn-alt::after{background:rgba(255,255,255,0.2);width:30px;left:30px;filter:blur(5px);animation:shine-alt2 1.5s ease-in-out infinite}
  @keyframes shine-alt1 {
  0%{opacity:.5;transform:translateX(-100px) skewX(-15deg);transition-property:opacity,transform}
  100%{opacity:.6;transform:translateX(300px) skewX(-15deg);transition-property:opacity,transform}
  }
  @keyframes shine-alt2 {
  0%{opacity:0;transform:translateX(-100px) skewX(-15deg);transition-property:opacity,transform}
  100%{opacity:1;transform:translateX(300px) skewX(-15deg);transition-property:opacity,transform}
  }


  @media only screen and (max-width : 900px) {
  h2{font-size:4em;margin:.2em 0 .1em}
  }
  @media only screen and (max-width : 600px) {
  h2{font-size:3em;margin:.2em 0 .1em}
  .lg-body{font-size:18px;margin: 1em auto;}
  }
  @media only screen and (max-width : 1200px) {
  h1{font-size:1.8em}
  }
  img{vertical-align:middle;width:100%}
  .desktop-img{display:block}
  .mobile-img{display:none}
  @media only screen and (max-width : 600px) {
  .mobile-img{display:block}
  .desktop-img{display:none}
  }
  .body-line-height{line-height:2}
  body{font-size:1.2rem;line-height:1.4;font-family:'Lato',sans-serif;font-weight:lighter;background-color:#EFECE3;color:var(--body);margin:0}
  body:after{content:'';width:0;height:100%;position:fixed;border:.05em solid #DBD3C0;top:0;right:35px;z-index:-1}
  body:before{content:'';width:0;height:100%;position:fixed;border:.05em solid #DBD3C0;top:0;left:35px;z-index:-1}
  @media screen and (max-width: 1400px) {
  body:before,body:after{display:none}
  }
  .supportMenu{position:fixed;bottom:0;color:#fff;width:100%;border-top:1px solid #fff;z-index:2;transition:all .5s;background:#bf7a66f0;right:0;padding:.7em 1.5em}
  .supportMenu a{color:#fff;text-decoration:none;margin-bottom:.5rem;padding:0 1em;font-size:18px;line-height:25px;font-family:'Roboto Condensed';text-transform:uppercase;font-weight:300;letter-spacing:1.2px}
  .supportMenu a:hover{color:#504832}
  .hide{opacity:0}
  .show{opacity:1}
  .socials-nav{align-items:center;float:right;display:flex}
  .con{display:none}
  @media screen and (max-width: 600px) {
  .socials-nav{display:none}
  .con{display:inline-block}
  .supportMenu{text-align:center;padding:0.8em .3em}
  .supportMenu a{padding:0 .6em;font-size:17px;margin-bottom: 0;}
  }
  @media screen and (max-width: 370px) {
    .supportMenu a{padding:0 .5em;font-size:16px;}
  }
  .flex-container{display:flex;flex-direction:row;flex-wrap:wrap;gap:50px 30px}
  .flex-item{flex-basis:360px;margin:4px}
  @media only screen and (max-width : 600px) {
  .flex-container{flex-direction:column}
  }
  .myname .logo {display:none}
  .main-banner::after,.with-imp::before~{content:"";height:50px;display:block;position:relative;clear:both;width:100%}
  .main-banner .left-text h1{line-height:1.3;margin-bottom:6px}
  .main-banner .left-text p{margin:0;font-size:23px;line-height:1.5;max-width:480px;width:100%}
  .main-banner .desktop-img{max-width:460px;margin:auto}
  .main-banner.container-lg{padding:0 2.4rem;max-width:1250px}
  .myname{margin-top:1.6em}
  .myname p{color: #887f6d;font-size: 17px!important; text-transform: uppercase;}
  .myname p .uiux-role{font-size: 15px !important; }
  .name-desk{font-weight: 400}
  .life-upd{padding:0 3em 2em}
  .life-upd .four-col{margin:3px}
  .life-upd .four-col:nth-child(odd) img{margin-top:6em}
  .intro-text{text-align:center}
  .intro-sec{justify-content:center}
  .intro-sec .intro-text p{margin:0;font-size:23px;line-height:1.6;max-width:550px;width:100%;color: var(--heading);}
  @media only screen and (max-width : 1440px) {.main-banner.container-lg{max-width:1200px}}
  @media only screen and (max-width : 1200px) {
  .main-banner .left-text p{font-size:20px}
  .main-banner.container-lg { max-width: 1000px; }
  .main-banner .desktop-img { max-width: 380px; }
  .recent-works { max-width: 1150px !important}
  }
  @media only screen and (max-width : 1100px) {
  .more-info{left:unset!important;top:unset!important;right:0!important;text-align:right!important;bottom:0!important}
  .more-info p{display:none!important}
  .img-highlight:hover .overlay{background:none!important}
  .more-info{opacity:1!important}
  .img-highlight a:after{content:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-9 -10 45 45' fill='none'%3E%3Cpath d='M22.3162 1.78614C22.2774 1.78737 22.2386 1.79076 22.2002 1.79631H17.1282C16.9902 1.79436 16.8531 1.81986 16.725 1.87133C16.5969 1.92281 16.4803 1.99922 16.382 2.09615C16.2837 2.19307 16.2057 2.30856 16.1524 2.43591C16.0991 2.56326 16.0717 2.69993 16.0717 2.83798C16.0717 2.97603 16.0991 3.1127 16.1524 3.24005C16.2057 3.3674 16.2837 3.48289 16.382 3.57981C16.4803 3.67673 16.5969 3.75315 16.725 3.80462C16.8531 3.8561 16.9902 3.8816 17.1282 3.87965H19.8219L10.1417 13.5598C10.0417 13.6558 9.96191 13.7708 9.90692 13.898C9.85194 14.0252 9.82289 14.1621 9.82148 14.3007C9.82007 14.4393 9.84633 14.5768 9.89871 14.7051C9.9511 14.8334 10.0286 14.9499 10.1266 15.0479C10.2246 15.1459 10.3411 15.2234 10.4694 15.2758C10.5977 15.3282 10.7352 15.3544 10.8738 15.353C11.0124 15.3516 11.1493 15.3226 11.2765 15.2676C11.4037 15.2126 11.5187 15.1328 11.6147 15.0328L21.2949 5.35263V8.04631C21.2929 8.18434 21.3184 8.32139 21.3699 8.44948C21.4213 8.57757 21.4978 8.69416 21.5947 8.79246C21.6916 8.89076 21.8071 8.96882 21.9345 9.0221C22.0618 9.07538 22.1985 9.10281 22.3365 9.10281C22.4746 9.10281 22.6112 9.07538 22.7386 9.0221C22.8659 8.96882 22.9814 8.89076 23.0784 8.79246C23.1753 8.69416 23.2517 8.57757 23.3032 8.44948C23.3546 8.32139 23.3801 8.18434 23.3782 8.04631V2.97022C23.3989 2.82025 23.3867 2.66755 23.3425 2.52277C23.2982 2.37799 23.2229 2.2446 23.1218 2.13189C23.0207 2.01919 22.8962 1.92986 22.7571 1.87015C22.618 1.81044 22.4675 1.78177 22.3162 1.78614Z' fill='white'/%3E%3Cpath d='M12.7297 4H8C5.79086 4 4 5.79086 4 8V17C4 19.2091 5.79086 21 8 21H17C19.2091 21 21 19.2091 21 17V13.3947' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");position:absolute;width:24px;height:24px;bottom:6px;right:6px;background:rgba(0, 0, 0, 0.22);border-radius:50px;}
  .subheading {margin-top: 1.8em; }
  .subheading h3 {text-align: center;}
  .subheading h3::after { display: none;}
  .subheading p { text-align: center;margin: 0;}
  }
  @media only screen and (max-width : 900px) {
  .main-banner{flex-direction:column-reverse}
  .header-right{width:400px}
  .main-banner .left-text p{max-width:600px !important}
  .main-banner .desktop-img{max-width:360px}
  .main-banner.container-lg{gap:10px}
  .myname{margin:1.4em 0 1em}
  .myname p { font-size: 15px !important;}
  .main-banner .left-text p{margin-top:.5em;font-size: 18px;line-height: 1.4;}
  .left-text { text-align: center;}
      .home-nav, .name-desk{display:none}
      .myname .logo {display:block}
      .myname .logo img{max-width:93px}
      .main-banner.container-lg{padding:1em;background-color:#eae2dba8;border-bottom:1px solid #dbd7cf}
      .main-banner .right-img img{margin:auto;mix-blend-mode:darken}
  
  }
  @media only screen and (max-width : 600px) {
  .main-banner.container-lg {padding: 1.5rem 0.5rem;}
  .main-banner{padding:1rem 0}
  .main-banner .desktop-img{display:block!important;max-width: 240px;margin-left: 2em !important;}
  .main-banner.container-lg{gap: 4px;}
  .main-banner .left-text h1{font-size: 30px;margin-bottom: 4px;}
  .myname p {font-size: 13px !important;}
  .main-banner .left-text p{font-size: 17px;}


  }
  .column{-ms-flex-item-align:auto;align-self:auto;padding:8px}
  .two-col{flex:45%}
  .three-col{flex:0 31%}
  .four-col{flex:23%}
  .un-col{flex:80%}
  .mid-col{flex:55%}
  .small-col{flex:20%}
  .pf-content .column img{border:3px solid #fff;box-shadow:2px 2px 7px #dbad3b82}
  .side-left{max-width:420px}
  .pf-grid{display:flex;flex-wrap:nowrap;align-items:center}
  .pf-gridItems-left{padding:38px;flex-basis:80%}
  .pf-gridItems-right{position:absolute;right:0}

  @media screen and (max-width: 1220px) {
    .three-col { flex: 0 30%; }

  }
  @media screen and (max-width: 600px) {
    .three-col { flex: 0 47%; }

  }
  .center-align{text-align:center}
  .displayFlex{display:flex;flex-direction:row;flex-wrap:wrap}
  .container-sm{align-items:center;padding:60px 30px;max-width:800px;margin:auto}
  .container-md{align-items:center;padding:90px 30px;max-width:1000px;margin:auto}
  .container-lg{align-items:center;max-width:1300px;margin:auto;padding:3rem 2.4rem}
  .socials{display:flex;justify-content:center;gap:24px;margin:1em 0}
  .social-icon{display:flex;border-radius:50px;padding:6px;height:60px;width:60px;background-color:var(--primary);opacity:.9}
  .social-icon:hover{opacity:1}
  .social-icon img{width:35px;margin:auto}
  .socials a{display:inline-block}
  .thanks p::after{content:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='27' viewBox='0 0 26 27' fill='none'%3E%3Cpath d='M12.9821 13.2317L12.5822 13.2356L13.3723 13.32L12.9821 13.2317ZM17.3428 4.66502L17.0617 4.38039L17.3428 4.66502ZM24.2797 6.60086L23.891 6.69518L24.2797 6.60086ZM19.6573 18.7041L19.9728 18.95L19.9728 18.95L19.6573 18.7041ZM13.8928 26.1002L13.5609 26.3235C13.6324 26.4298 13.7507 26.4955 13.8788 26.4999C14.0069 26.5044 14.1294 26.4472 14.2082 26.3461L13.8928 26.1002ZM7.85001 17.1189L7.50328 17.3184L7.51028 17.3305L7.51813 17.3422L7.85001 17.1189ZM4.2183 10.8052L3.86838 10.9991L3.87157 11.0047L4.2183 10.8052ZM10.4581 2.02203L10.1614 2.29025L10.4581 2.02203ZM13.3723 13.32C13.6411 12.1318 14.2169 10.5154 14.9763 8.94916C15.7377 7.37858 16.6658 5.89563 17.6238 4.94964L17.0617 4.38039C16.0096 5.41924 15.0343 6.99561 14.2564 8.60017C13.4764 10.209 12.877 11.8836 12.592 13.1435L13.3723 13.32ZM17.6238 4.94964C18.6078 3.97803 19.9431 3.36339 21.1158 3.49691C21.6919 3.56251 22.2422 3.80856 22.7177 4.30203C23.1975 4.79991 23.6172 5.56695 23.891 6.69518L24.6684 6.50654C24.3711 5.28122 23.8975 4.3734 23.2938 3.7469C22.6858 3.11599 21.9623 2.78812 21.2063 2.70205C19.7148 2.53222 18.1526 3.30321 17.0617 4.38039L17.6238 4.94964ZM23.891 6.69518C24.3138 8.43786 23.692 10.739 22.6681 12.9735C21.6536 15.1872 20.2872 17.2453 19.3418 18.4582L19.9728 18.95C20.9489 17.6976 22.3505 15.5868 23.3953 13.3067C24.4307 11.0474 25.1593 8.52953 24.6684 6.50654L23.891 6.69518ZM19.3418 18.4582L13.5773 25.8543L14.2082 26.3461L19.9728 18.95L19.3418 18.4582ZM14.2246 25.8769L8.18188 16.8956L7.51813 17.3422L13.5609 26.3235L14.2246 25.8769ZM8.19674 16.9195L4.56503 10.6058L3.87157 11.0047L7.50328 17.3184L8.19674 16.9195ZM4.56818 10.6113C3.76734 9.16607 3.2348 7.61025 3.06455 6.16334C2.89389 4.71298 3.09027 3.40545 3.70378 2.41935L3.02451 1.99674C2.28451 3.18616 2.08614 4.69406 2.27003 6.25683C2.45432 7.82305 3.02561 9.47805 3.86842 10.9991L4.56818 10.6113ZM3.70378 2.41935C4.44737 1.22416 5.70703 0.826897 6.99942 0.922575C8.30781 1.01944 9.55451 1.61882 10.1614 2.29025L10.7549 1.75381C9.98405 0.900986 8.5297 0.233674 7.05849 0.124758C5.57128 0.014658 3.9728 0.472534 3.02451 1.99674L3.70378 2.41935ZM10.1614 2.29025C10.7675 2.96084 11.3221 3.48298 11.7619 4.91369C12.2122 6.37838 12.5389 8.79635 12.5822 13.2356L13.3821 13.2278C13.3387 8.77117 13.0122 6.25794 12.5266 4.67859C12.0306 3.06526 11.3665 2.43051 10.7549 1.75381L10.1614 2.29025Z' fill='%23855432'/%3E%3Cpath d='M22.1371 2.69486C15.624 1.49571 14.3666 8.57161 12.9292 13.1249C12.3099 6.62717 7.39244 -1.26364 2.67207 3.04625C-0.957088 6.35982 5.23158 14.6168 6.77612 16.9707C7.76492 18.4776 11.7463 24.1493 14.8974 26.1747C16.5324 23.9061 20.8204 17.5085 23.1165 14.2375C25.9866 10.1487 26.8411 3.56093 22.1371 2.69486Z' fill='%23C7806C' fill-opacity='0.29' stroke='%23855432' stroke-width='0.8' stroke-linejoin='round'/%3E%3C/svg%3E");position:relative;margin-left:8px;top:6px}
  .thanks p{font-size:22px;color:#80756e}
  .sticky{position:fixed;top:0;left:0;width:100%}
  .container-lg.main-nav{padding:1rem 2.4rem}
  .currpage{position:relative;color: #bf7a66 !important;}
  .currpage::after{content:'';height:6px;background-color:#d9bcb499;position:absolute;width:80%;bottom:13px;left:50%;transform:translate(-50%,-50%);z-index:-1}
  @media only screen and (min-width : 1450px) {
  .main-nav{max-width:1500px!important;padding:1rem 4.6rem!important}
  }
  .header{display:flex;align-items:center;justify-content:space-between;position:relative}
  .header a{color:#504832;text-align:center;padding:12px;text-decoration:none;font-size:20px;line-height:25px;border-radius:4px;font-family:'Roboto Condensed';text-transform:uppercase;font-weight:300;letter-spacing:1.2px}
  .header a:hover{color:var(--tertiary)}
  .sb-active{color:var(--tertiary)}
  .header-right{width:500px;display:flex;justify-content:space-between;max-width:600px;margin:0;min-width:350px}
  .header .logo img{width:180px}
  @media only screen and (max-width : 1200px) {
  .header .logo img{width:150px}
  .header a{font-size:18px}
  .header-right{width:440px}
  }
  @media only screen and (max-width : 850px) {
    .container-lg {padding:2rem 1rem}
  }
  @media screen and (max-width: 600px) {
  .header{flex-direction:column}
  .header-right{width:100%}
  .main-nav{width:100%;padding:0 2rem;position:relative}
  .container-lg{padding:1.5rem 0.5rem}
  .intro-sec {background-color: #eae2dba8;border-bottom: 1px solid #dbd7cf;padding: 1em 0.5em 2em;}
  .intro-sec .intro-text p { font-size: 18px; line-height: 1.4; }
  .subheading p{margin:0;margin:0 auto;font-size:17px;line-height:1.2}
  .recent-works .flex-container {padding: 1.5em 0;}
  .subheading h3 {font-size: 20px;margin-bottom: 0.3em;}
  .currpage::after {height: 4px;width: 95%;}
  }
  @media screen and (max-width: 428px) {
  .header a{font-size:15px;padding:8px 4px}
  .header-right{min-width:280px}
  }
  .img-highlight{position:relative;margin:auto;margin:auto;}
  .overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0);transition:background .5s ease;border-radius:8px}
  .img-highlight:hover .overlay{display:block;background:rgba(138,118,96,0.79)}
  .img-highlight img{border-radius:8px}
  .three-col:first-child .img-highlight img{box-shadow:0 12px 13px rgba(0,0,0,0.09)}
  .recent-works{max-width:1250px}
  .recent-works .flex-container{padding:2em 0;justify-content:center;gap:50px 40px}
  .recent-works .subheading {margin-top: 2em;}
  .more-info{position:absolute;width:100%;left:0;top:42%;text-align:center;opacity:0;transition:opacity .35s ease;z-index:1}
  .more-info p{background-color:#efece3;color:#8f6243;text-transform:uppercase;display:inline-block;padding:.3rem 1em;border:1px solid #8f6243;font-size:18px;font-weight:400}
  .img-highlight:hover .more-info{opacity:1}
  .tools-box{border-radius:16px;border:1px solid #FFF;background:rgba(255,252,252,0.45);box-shadow:0 15px 18px 0 rgba(0,0,0,0.08);margin-bottom:2em;}
  .tools-box img{max-width:240px;padding:0 0 2em;margin:auto;display:block}
  .tools-box p{font-weight:500;text-transform:uppercase;margin-top:2em;text-align:center}
  .web-tools{display:flex;flex-direction:column;justify-content:center}
  .web-tools .button.btn-contain {display:none;}

  @media screen and (max-width: 1060px) {
  .recent-works .flex-container{gap: 28px 16px;margin:auto;flex-direction: row;}
  .web-tools .button.btn-contain, .mock-devs .subheading div:nth-child(2) {display:none;}
  .web-tools .button.btn-contain {display:block;}
  #recentWorks .subheading {justify-content: center; }
  .tools-box {box-shadow: none;border-radius: 8px; }
  .tools-box img {
    max-width: 184px;
    padding: 0 0 1em;
    }
    .tools-box p {
      margin-top: 1em;
      font-size: 16px;
    }
  }
  @media screen and (max-width: 730px) {
  .recent-works .flex-container{justify-content:center}
  .recent-works .mock-devs .flex-container .three-col:nth-child(5), .recent-works .pdp-des .flex-container .three-col:nth-child(3)  {display:none;}
  }

  @media screen and (max-width: 600px) {
    .web-tools {
      flex-basis: 100%;
      }
    .tools-box p {
        margin-top: 1em;
        margin-bottom: 0.5em;
      }
      .tools-box img {
        max-width: 200px;
        padding: 0 0 0.5em;
        }
    
  }
  /* @media screen and (max-width: 600px) {
  .recent-works .flex-container{max-width:fit-content}
  } */
  .contact.container-lg{padding-bottom:0}
  .thank-you{padding:3rem 2.4rem}
  .ux-study{background-image:url(../img/ux-bg.jpg);background-size:cover;background-repeat:no-repeat}
  .ux-study .container-lg {max-width: 1700px !important;padding: 1rem 4.6rem ;}
  .ux-study .subheading h3 {text-align: left;}
  .gv-hub h3{font-weight:800;font-size:42px;letter-spacing:.08em;text-transform:uppercase;color:#444;font-family:'Lato';margin:0}
  .gv-hub p{margin:0;font-size:25px}
  .gv-hub-img p{font-style:italic;font-size:16px;line-height:21px;color:#876F57;text-align:center;margin-top:-20px}
  .gv-hub .btn-grp{margin-top:10px;display:flex;flex-direction:column}
  .gv-hub .btn-grp .button{margin:4px 0}
  .button{padding:10px 28px;text-align:center;text-decoration:none;display:inline-block;font-size:16px;margin:4px auto;cursor:pointer;transition:.3s;position:relative;width:205px}
  .btn-contain{background-color:#855432;color:#fff;border:1px solid #855432;border-radius: 6px;}
  .btn-contain:hover{background-color:transparent;color:#855432;border:1px solid #855432}
  .btn-outline{background-color:transparent;color:#855432;border:1px solid #855432;border-radius: 6px;}
  .btn-outline:hover{background-color:#855432;color:#fff}
  @media only screen and (max-width : 1400px) { .mid-col { flex: 50%; }.ux-study .container-lg {padding: 1rem ;}}
  @media only screen and (max-width : 1080px) {
  .ux-study .container-lg{flex-direction:column;gap:0;}
  .gv-hub{display:flex;align-items:center;gap:26px;margin: 2em 0;}
  .ux-study .subheading h3  { text-align: center ;}
  .gv-hub-img img {max-width: 600px;}
  .gv-hub h3{font-size:36px}
  .gv-hub p{font-size:22px}
  .section-copy p { text-align: center; }
  }
  @media screen and (max-width: 600px) {
  .gv-hub .button{padding:8px 20px;width:144px}
  }
  @media only screen and (max-width : 412px) {
  .gv-hub h3{font-size:23px}
  .gv-hub p{font-size:14px}
  .gv-hub-img p{font-size:14px;padding-top:1.5em}
  }