/* Variables */
:root {
 --color-navy: #001D42;
 --color-navy-gray: #172941;
 --color-blue: #004079;
 --color-light-blue: #81D0F5;
 --color-orange: #F58546;

 --color-white: #ffffff;
 --color-black: #000000;
 --color-gray: #DEDEDE;

 --color-danger: #e76f7b;

 /* Shades */
 --color-navy-50: #B8C0CA;
 --color-navy-100: #A3AEBD;
 --color-navy-200: #7A899D;
 --color-navy-300: #52657E;
 --color-navy-400: #294160;
 --color-navy-500: var(--color-navy);
 --color-navy-600: #001837;
 --color-navy-700: #00142D;
 --color-navy-800: #000F22;
 --color-navy-900: #000A18;

 --color-blue-50: #B8CAD9;
 --color-blue-100: #A3BACF;
 --color-blue-200: #7A9CB9;
 --color-blue-300: #527DA4;
 --color-blue-400: #295F8E;
 --color-blue-500: var(--color-blue);
 --color-blue-600: #003666;
 --color-blue-700: #002C52;
 --color-blue-800: #00213F;
 --color-blue-900: #00172C;

 --color-light-blue-50: #DCF2FC;
 --color-light-blue-100: #D2EEFB;
 --color-light-blue-200: #BDE7FA;
 --color-light-blue-300: #A9DFF8;
 --color-light-blue-400: #95D8F7;
 --color-light-blue-500: var(--color-light-blue);
 --color-light-blue-600: #6CAFCE;
 --color-light-blue-700: #588DA7;
 --color-light-blue-800: #436C7F;
 --color-light-blue-900: #2E4B58;

 --color-orange-50: #FCDDCB;
 --color-orange-100: #FBD3BC;
 --color-orange-200: #FAC09F;
 --color-orange-300: #F8AC81;
 --color-orange-400: #F79964;
 --color-orange-500: var(--color-orange);
 --color-orange-600: #CE703B;
 --color-orange-700: #A75A30;
 --color-orange-800: #7F4524;
 --color-orange-900: #583019;

 --color-gray-50: #F6F6F6;
 --color-gray-100: #F3F3F3;
 --color-gray-200: #EEEEEE;
 --color-gray-300: #E9E9E9;
 --color-gray-400: #E3E3E3;
 --color-gray-500: var(--color-gray);
 --color-gray-600: #BABABA;
 --color-gray-700: #979797;
 --color-gray-800: #737373;
 --color-gray-900: #505050;

 /* Fonts */
 --font-family-body: "Gotham Book", sans-serif;
 --font-family-heading: "Gotham Bold", sans-serif;
 --font-family-light: "Gotham Light", sans-serif;
 --font-family-ultra: "Gotham Ultra", sans-serif;
}

/* Fonts */
@font-face {
 font-family: "Gotham Book";
 src:
   local("gotham-book"),
   url("./asssets/fonts/gotham/book/Gotham-Book.ttf") format("truetype"),
   url("./assets/fonts/gotham/book/Gotham-Book.woff") format("woff"),
   url("./assets/fonts/gotham/book/Gotham-Book.woff2") format("woff2");
 font-weight: normal;
 font-style: normal;
 font-display: swap;
}

@font-face {
 font-family: "Gotham Bold";
 src:
   local("gotham-bold"),
   url("./assets /fonts/gotham/bold/Gotham-Bold.ttf") format("truetype"),
   url("./assets/fonts/gotham/bold/Gotham-Bold.woff") format("woff"),
   url("./assets/fonts/gotham/bold/Gotham-Bold.woff2") format("woff2");
 font-weight: normal;
 font-style: normal;
 font-display: swap;
}

@font-face {
 font-family: "Gotham Light";
 src:
   local("gotham-light"),
   url("./assets /fonts/gotham/light/Gotham-Light.ttf") format("truetype"),
   url("./assets/fonts/gotham/light/Gotham-Light.woff") format("woff"),
   url("./assets/fonts/gotham/light/Gotham-Light.woff2") format("woff2");
 font-weight: normal;
 font-style: normal;
 font-display: swap;
}

@font-face {
 font-family: "Gotham Ultra";
 src:
   local("gotham-ultra"),
   url("./assets /fonts/gotham/ultra/Gotham-Ultra.ttf") format("truetype"),
   url("./assets/fonts/gotham/ultra/Gotham-Ultra.woff") format("woff"),
   url("./assets/fonts/gotham/ultra/Gotham-Ultra.woff2") format("woff2");
 font-weight: normal;
 font-style: normal;
 font-display: swap;
}

/* Body/Global Styles */
body {
 color: var(--color-navy);
 font-family: var(--font-family-body);
 font-size: 16px;
 font-weight: 400;
 line-height: 1.5;
  -webkit-font-smoothing: antialiased; /* For Chrome, Safari */
  -moz-osx-font-smoothing: grayscale; /* For Firefox on macOS */
  text-rendering: optimizeLegibility; /* Prioritizes legibility over speed, enabling kerning and ligatures */
}

/* Containers */
.sticky-footer #main-content {
 min-height: calc(100vh - 48px - 93px - 223px); /* Height of Top Header, Navigation and Footer */
}

@media (max-width: 767px) {
 .sticky-footer #main-content {
  min-height: calc(100vh - 82px - 223px); /* Height of Mobile Header and Footer */
 }
}

@media (max-width: 550px) {
 .sticky-footer #main-content {
  min-height: calc(100vh - 82px - 325px); /* Height of Mobile Header and Footer */
 }
}

@media (max-width: 389px) {
 .sticky-footer #main-content {
  min-height: calc(100vh - 82px - 344px); /* Height of Mobile Header and Footer */
 }
}

#main-content > .container.body-container {
 overflow: hidden;
 margin: 0 !important;
 max-width: none !important;
 padding: 0 !important;
}

.main-content > .col-12 {
 padding: 0 !important;
}

.container {
 margin: 0 auto;
 max-width: 1140px;
 padding: 0 24px;
 width: 100%;
}

@media (max-width: 767px) {
 .container {
  margin: 0 auto;
  max-width: none;
  padding: 0 16px;
 }
}

.row {
 margin: 0 !important;
}

#middle-content {
 padding: 0;
}

/* Hide Breadcrumbs */
.breadcrumb_container {
 display: none;
}

/* Utilities */
.mb-20 {
 margin-bottom: 20px !important;
}

.mt-0 {
 margin-top: 0 !important;
}

.mb-0 {
 margin-bottom: 0 !important;
}

.tagline {
 font-family: "Gotham Bold", sans-serif !important;
 font-weight: 600 !important;
 font-size: 14px !important;
 color: var(--color-orange);
 letter-spacing: 1px !important;
 margin-bottom: 8px;
 text-transform: uppercase;
 transform: translateX(2px);
}

.center {
 text-align: center;
}

/* Images */
img {
 height: auto;
 line-height: 1;
 max-width: 100%;
 width: 100%;
}

/* Typography */
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
 color: var(--color-blue);
 font-family: var(--font-family-heading);
 margin: 0;
 padding: 0;
}

h1, .h1 {
 font-size: 48px;
 letter-spacing: -0.055rem;
 line-height: 1.05;
}

h2, .h2 {
 font-size: 40px;
 letter-spacing: -0.055rem;
 line-height: 1.1;
}

h3, .h3 {
 font-size: 33px;
 letter-spacing: -0.03rem;
 line-height: 1.15;
}

h4, .h4 {
 font-size: 27px;
 letter-spacing: -0.02rem;
 line-height: 1.2;
}

h5, .h5 {
 font-size: 23px;
 line-height: 1.25;
}

h6, .h6 {
 font-size: 19px;
 line-height: 1.3;
}

p {
 color: var(--color-navy);
 font-size: 16px;
 line-height: 1.6;
 margin: 0 0 20px 0;
}

@media (max-width: 960px) {
 h1, .h1 {
  font-size: 40px;
 }
}

@media (max-width: 767px) {
 h1, .h1 {
  font-size: 32px;
 }
}


@media (max-width: 600px) {
 h1, .h1 {
  font-size: 28px;
 }

 h2, .h2 {
  font-size: 32px;
 }
}

/* Modifiers - Typography */
p.large {
 font-size: 18px;
}

@media (max-width: 600px) {
 p.large {
  font-size: 16px;
 }
}

p.small {
 font-size: 13px;
}

p.tiny {
 font-size: 11px;
}

p.light {
 color: var(--color-white);
}

.accent-bar {
 position: relative;
 padding-left: 24px;
}

.accent-bar.narrow {
 padding-left: 18px;
}

.accent-bar::before {
 background-image: linear-gradient(to bottom right, rgb(252, 99, 4), rgb(230, 142, 5)) !important;
 content: "";
 position: absolute;
 left: 0;
 top: 50%;
 transform: translateY(-50%);
 width: 8px;
 height:100%;
}

.text-danger {
 color: var(--color-danger);
}

.text-dark,
.text-primary {
 color: var(--color-blue) !important;
}

/* List Elements */
ul, ol {
 margin: 0;
 padding: 0 0 0 20px;
}

li {
 margin-bottom: 10px;
}

li:last-child {
 margin-bottom: 0;
}

li ul {
 margin-top: 12px;
 padding: 0 0 0 40px;
}

.custom-list {
 list-style-type: none;
 padding-left: 30px;
}

.custom-list li {
 margin-bottom: 12px;
 position: relative;
}

.custom-list li::before {
 /* content: url("./assets/images/checkmark-circle-gradient.png"); */
 content: url("https://hgropsqsdx.s3.us-west-1.amazonaws.com/midlandon/images/common/checkmark-circle-gradient.png");
 width: 24px;
 height: 24px;
 position: absolute;
 left: -30px;
 top: 1px;
}

/* Buttons & Links */
a {
 color: var(--color-orange);
 text-decoration: none;
 transition: color 400ms ease-in-out;
}

a:hover {
 color: var(--color-orange-300);
}

.btn-primary,
.btn-success {
 background-color: none !important;
 background-image: linear-gradient(to right, rgb(205, 64, 29), rgb(253, 155, 5)) !important;
 border: none !important;
 border-radius: 6px;
 box-shadow: 0 42px 12px 0 rgba(0, 0, 0, 0.00),
  0 27px 11px 0 rgba(0, 0, 0, 0.01),
  0 15px 9px 0 rgba(0, 0, 0, 0.05),
  0 7px 7px 0 rgba(0, 0, 0, 0.09),
  0 2px 4px 0 rgba(0, 0, 0, 0.10);
 color: var(--color-white);
 min-width: 150px;
 opacity: 1;
 padding: 10px 20px;
 transition: all 400ms ease-in-out;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-success:hover,
.btn-success:focus,
.btn-success:active {
 background-color: none !important;
 background-image: linear-gradient(to right, rgb(205, 64, 29), rgb(253, 155, 5));
 box-shadow: none;
 opacity: 1;
}

.btn-primary:hover, .btn-primary:focus, .btn-primary:not(:disabled):not(.disabled):active, .btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active:focus {
 background-color: none !important;
 background-image: linear-gradient(to right, rgb(205, 64, 29), rgb(253, 155, 5)) !important;
 box-shadow: none !important;
}

.btn-secondary {
 background-color: none !important;
 background-image: linear-gradient(to right, rgb(15, 44, 83), rgb(19, 67, 117)) !important;
 border: none !important;
 border-radius: 6px;
 box-shadow: 0 42px 12px 0 rgba(0, 0, 0, 0.00),
  0 27px 11px 0 rgba(0, 0, 0, 0.01),
  0 15px 9px 0 rgba(0, 0, 0, 0.05),
  0 7px 7px 0 rgba(0, 0, 0, 0.09),
  0 2px 4px 0 rgba(0, 0, 0, 0.10);
 color: var(--color-white);
 min-width: 150px;
 padding: 10px 20px;
 transition: all 400ms ease-in-out;
}

.btn-secondary:hover,
.btn-secondary:focus,
.btn-secondary:active {
 background-color: none !important;
 background-image: linear-gradient(to right, rgb(15, 44, 83), rgb(19, 67, 117)) !important;
 border: none !important;
 box-shadow: none;
}

.btn-secondary:hover, .btn-secondary:focus, .btn-secondary:not(:disabled):not(.disabled):active, .btn-secondary:not(:disabled):not(.disabled).active, .btn-secondary:not(:disabled):not(.disabled):active:focus {
 background-color: var(--color-navy-400) !important;
 border-color: var(--color-navy-400) !important;
 color: var(--color-white) !important;
}

.btn-outline-primary {
 background-color: transparent !important;
 border-color: var(--color-white) !important;
 border-radius: 6px;
 box-shadow: 0 42px 12px 0 rgba(0, 0, 0, 0.00),
  0 27px 11px 0 rgba(0, 0, 0, 0.01),
  0 15px 9px 0 rgba(0, 0, 0, 0.05),
  0 7px 7px 0 rgba(0, 0, 0, 0.09),
  0 2px 4px 0 rgba(0, 0, 0, 0.10);
 color: var(--color-white) !important;
 min-width: 150px;
 padding: 10px 20px;
 transition: all 300ms ease-in-out;
}

.btn-outline-primary:hover,
.btn-outline-primary:focus,
.btn-outline-primary:active {
 background-color: var(--color-white) !important;
 border-color: var(--color-white) !important;
 color: var(--color-navy) !important;
}

.btn-outline-secondary {
 background-color: transparent !important;
 border-color: var(--color-white) !important;
 border-radius: 6px;
 box-shadow: 0 42px 12px 0 rgba(0, 0, 0, 0.00),
  0 27px 11px 0 rgba(0, 0, 0, 0.01),
  0 15px 9px 0 rgba(0, 0, 0, 0.05),
  0 7px 7px 0 rgba(0, 0, 0, 0.09),
  0 2px 4px 0 rgba(0, 0, 0, 0.10);
 color: var(--color-white) !important;
 min-width: 150px;
 padding: 10px 20px;
 transition: all 300ms ease-in-out;
}

.btn-outline-secondary:hover,
.btn-outline-secondary.text-light:hover,
.btn-outline-secondary:focus,
.btn-outline-secondary:active {
 background-color: var(--color-white) !important;
 color: var(--color-navy) !important;
 border-color: var(--color-white) !important;
}

/* Forgot Password Modal */
.fancybox__backdrop {
 background-color: rgba(23, 41, 65, 0.8) !important;
}

.with-fancybox .fancybox__carousel .fancybox__viewport .fancybox__slide:not(.has-image) .fancybox__content {
 border-radius: 12px;
 box-shadow: 0 42px 12px 0 rgba(0, 0, 0, 0.00),
  0 27px 11px 0 rgba(0, 0, 0, 0.01),
  0 15px 9px 0 rgba(0, 0, 0, 0.05),
  0 7px 7px 0 rgba(0, 0, 0, 0.09),
  0 2px 4px 0 rgba(0, 0, 0, 0.10);
 padding: 32px !important;
}

.popup_page_inner,
.popup_page_inner .col-12 {
 padding: 0 !important;
}

#frmlogin > .row > .col-12 > h3 {
 margin-bottom: 12px;
}

#frmlogin > .row > .col-12 > p {
 margin-bottom: 6px;
}

.popup_page_inner .input-group-require {
 display: none;
}

.popup_page_inner #submit {
 margin-top: 6px !important;
}

.fancybox__container .f-button.is-close-btn {
 background-color: var(--color-orange);
 border: 2px solid var(--color-white);
 transition: all 400ms ease-in-out;
}

.fancybox__container .f-button.is-close-btn svg {
 stroke : var(--color-white);
 transition: stroke 400ms ease-in-out;
}

.fancybox__container .f-button.is-close-btn:hover {
 background-color: var(--color-white);
 border: 2px solid var(--color-orange);
}

.fancybox__container .f-button.is-close-btn:hover svg {
 stroke: var(--color-orange);
}

/* Password Reset Page */
.password-reset-page > .container {
 padding: 0 !important;
}

.password-reset-page .password-header {
 align-items: center;
 display: flex;
 flex-direction: column;
 gap: 24px;
 justify-content: space-between;
 margin: 48px 0 32px;
}

.password-reset-page .password-header .password-logo-wrap {
 width: 180px;
}

.password-reset-page .password-header .password-logo-wrap > div {
 text-align: left !important;
}

.password-reset-page .password-header .password-logo-wrap > div > img {
 width: 100% !important;
}

.password-reset-page .password-header .heading-wrap {
 width: auto;
}

#reset_password .text-danger {
 display: none !important;
}

#reset_password > form {
 margin: 0 auto;
 max-width: 500px;
}

#reset_password > form > .form-group.row {
 display: block !important;
 margin-bottom: 16px !important;
}

#reset_password > form > .form-group.row > .input-group {
 align-items: center;
 display: flex;
 justify-content: space-between;
}

#reset_password > form > .form-group.row > .input-group > span.control-label {
 flex: 0 0 auto;
 max-width: 100% !important;
 padding: 0;
 width: auto;
}

#reset_password > form > .form-group.row > .input-group > .form-control-static {
 flex: 0 0 auto;
 padding: 0;
 width: auto;
}

#reset_password > form input[type="password"] {
 border: 1px solid #ced4da;
}

#reset_password > form .password_toggle {
 border-color: #ced4da;
}

#reset_password .form-control:focus + .input-group-append .input-group-text, .custom-select:focus + .input-group-append .input-group-text {
 border: 1px solid #ced4da !important;
 border-left-color: transparent !important;
}

/* Scroll Top Button in Footer & Modal Close Button*/
.scroll-top {
 /* background-color: var(--color-orange); */
 background-image: linear-gradient(to right, rgb(205, 64, 29), rgb(253, 155, 5)) !important;
 border: 2px solid var(--color-white);
 transform: scale(1);
 transition: transform 300ms ease-in-out;
}

.scroll-top:hover {
 border: 2px solid var(--color-white);
 transform: scale(1.15);
}

.scroll-top a i {
 color: var(--color-white) !important;
}

.scroll-top:hover a i {
 color: var(--color-white) !important;
}

.f-button.is-close-btn {
 background-image: linear-gradient(to right, rgb(205, 64, 29), rgb(253, 155, 5)) !important;
 border: 2px solid var(--color-white) ;
 transform: scale(1);
 transition: transform 300ms ease-in-out;
}

.f-button.is-close-btn:hover {
 background-image: linear-gradient(to right, rgb(205, 64, 29), rgb(253, 155, 5)) !important;
 border: 2px solid var(--color-white) !important;
 transform: scale(1.15);
 transition: transform 300ms ease-in-out;
}

.f-button.is-close-btn:hover svg {
 stroke: var(--color-white) !important;
}

/* Main Page Header */
.page-header {
 display: none; /* Hide default page header */
}

.main-header {
 margin: 48px 0;
}

.main-header.centered-header {
 text-align: center;
}

.main-header .container {
 display: flex;
 flex-direction: column;
 gap: 16px;
 justify-content: center;
 max-width: 1140px;
 margin: 0 auto;
}

.main-header.narrow-header .container {
 display: flex;
 flex-direction: column;
 gap: 24px;
 justify-content: center;
 max-width: 760px;
 margin: 0 auto;
}

@media (max-width: 767px) {
 .main-header .container {
  margin: 0 auto;
  max-width: none;
  padding: 0 16px;
 }

 .main-header.narrow-header .container {
  margin: 0 auto;
  max-width: none;
  padding: 0 16px;
 }
}

.main-header h2 {
 color: var(--color-blue);
}

.main-header p {
 margin: 0;
}

.main-hedaer.centered-header p {
 margin: 0 auto;
 max-width: 650px;
}

/* 404 Page */
.page-not-found .page-header {
 margin: 24px;
 padding: 0;
}

.page-not-found .page-header h1 {
 color: var(--color-blue);
}

.page-not-found .btn-secondary {
 background-color: none !important;
 background-image: linear-gradient(to right, rgb(205, 64, 29), rgb(253, 155, 5)) !important;
 border: none !important;
 border-radius: 6px;
 box-shadow: 0 42px 12px 0 rgba(0, 0, 0, 0.00),
  0 27px 11px 0 rgba(0, 0, 0, 0.01),
  0 15px 9px 0 rgba(0, 0, 0, 0.05),
  0 7px 7px 0 rgba(0, 0, 0, 0.09),
  0 2px 4px 0 rgba(0, 0, 0, 0.10);
 color: var(--color-white);
 margin-top: 8px;
 min-width: 150px;
 padding-top: 10px;
 padding-bottom: 10px;
 transition: all 400ms ease-in-out;
}

.page-not-found .btn-secondary:hover,
.page-not-found .btn-secondary:focus,
.page-not-found .btn-secondary:active {
 background-color: none !important;
 background-image: linear-gradient(to right, rgb(205, 64, 29), rgb(253, 155, 5));
 box-shadow: none;
}

#middle_bottom_bg > p {
 color: var(--color-navy);
 font-size: 16px;
}

/* Form Elements */
.form-horizontal > .row:not(.mt-2) {
 display: grid;
 gap: 16px;
 grid-template-columns: repeat(2, 1fr);
 grid-template-rows: repeat(4, auto);
}

.form-horizontal > .row > div {
 max-width: none;
 padding: 0 !important;
 width: 100%;
}

.form-horizontal > .row > div:last-of-type {
 grid-column: 1 / span 2;
}

.form-horizontal > .row > div > .row > .col {
 padding: 0 !important;
}

.form-horizontal .input-group-require {
 display: none;
}

.form-group .col-form-label {
 top: 11px !important;
}

input[type="text"],
input[type="email"],
input[type="tel"],
textarea {
 box-shadow: none;
 color: var(--color-navy);
 padding-left: 8px !important;
 padding-right: 8px !important;
 transition: border-color 400ms ease-in-out;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="tel"]:focus,
textarea:focus {
 border-color: var(--color-orange) !important;
}

.has-value > label {
 filter: alpha(opacity=100);
 font-size: 75%;
 opacity: 1;
 top: 8px !important;
 transform: translate3d(0, -100%, 0);
 -webkit-transform: translate3d(0, -100%, 0);
}

.form-group .input-valid~.col-form-label {
 color: var(--color-navy) !important;
 left: 5px !important;
}

.phone-has-value > label,
.phone-has-focus > label {
 color: var(--color-navy) !important;
 filter: alpha(opacity=100);
 font-size: 75%;
 left: 0 !important;
 opacity: 1;
 top: 8px !important;
 transform: translate3d(0, -100%, 0);
 -webkit-transform: translate3d(0, -100%, 0);
}

.form-group .col-form-label {
 color: var(--color-navy);
}

.form-group .form-control:focus ~ .col-form-label {
 color: var(--color-navy);
}

@media (max-width: 500px) {
 .form-horizontal > .row:not(.mt-2) {
  gap: 6px;
  grid-template-columns: repeat(1, 1fr);
  grid-template-rows: repeat(7, auto);
 }

 .form-horizontal > .row > div {
  grid-column: 1 / span 1;
 }
}

/* Form Success Page */
.form-success-page .page-header {
 display: none !important;
}

/* Login Page */
.popup_page_inner:has(#corporate_login) {
 padding: 0 !important;
}

#corporate_login .container {
 height: 100% !important;
 max-width: none !important;
 padding: 0 !important;
 width: 100% !important;
}

#corporate_login .container > .row {
 display: block !important;
 height: 100% !important;
 margin: 0 !important;
 max-width: none !important;
 width: 100% !important;
}

#corporate_login .container > .row > div {
 height: 100% !important;
 max-width: none !important;
 padding: 0 !important;
 width: 100% !important;
}

.login-page{
 display: flex;
 flex-direction: row;
 flex-wrap: wrap;
 align-items: center;
 justify-content: center;
}

.login-page__left {
 height: 100vh;
 position: relative;
 width: 40%;
}

.login-page__content {
 align-items: center;
 justify-content: center;
 display: flex;
 flex-direction: column;
 height: 100%;
 padding: 56px 0 128px;
 position: relative;
}

.logo-wrap {
 margin-bottom: 24px;
 padding: 0 15px;
 width: 100%;
}

.logo-wrap > div {
 margin: 0 auto;
 max-width: 400px;
 text-align: center;
 width: 100%;
}

.logo-wrap > div > img {
 max-width: 180px;
 width: 100%;
}

.login-block {
 align-items: center;
 display: flex;
 flex-direction: column;
 justify-content: center;
 margin: 0 auto;
 max-width: 400px;
 padding: 0 15px;
 width: 100%;
}

.login-block > h2 {
 color: var(--color-blue);
 font-size: 20px;
 margin-bottom: 24px;
 text-align: left;
 width: 100%;
}

.form-wrap {
 width: 100%;
}

.corp_login_form {
 display: inline-flex;
 max-width: 400px;
 width: 100%;
}

.corp_login_form .form-group .has-value > label {
 left: 5px !important;
}

.corp_login_form .form-group .input-group input:is(:autofill, :-webkit-autofill) {
 background-color: var(--color-white) !important;
}

#login_sidebar {
 border: none;
 width: 100%;
}

#login_sidebar > div {
 padding: 0 !important;
}

#login_sidebar #corploginsignin > .form-group.mb-0 > a.p-0.mt-1.float-right{
 margin-top: 8px !important;
}

#email_signup,
#password_signup {
 color: var(--color-navy);
}

#email_signup:focus,
#password_signup:focus {
 border: 1px solid var(--color-orange) !important;
 border-right-color: transparent !important;
 box-shadow: none;
}

#email_signup,
#password_signup {
 background: transparent !important;
 background-color: transparent !important;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
  transition: all 5000s ease-in-out 0s;
}

.login-block .input-group-require {
 display: none;
}

.form-group .col-form-label {
 top: 13px;
}

.form-control + .input-group-append .input-group-text, .custom-select + .input-group-append .input-group-text {
 border-top-right-radius: 4px !important;
 border-bottom-right-radius: 4px !important;
}

.form-control:focus + .input-group-append .input-group-text, .custom-select:focus + .input-group-append .input-group-text {
 border: 1px solid var(--color-orange) !important;
 border-left-color: transparent !important;
}

label[for="email_signup"],
label[for="password_signup"] {
 background-color: var(--color-white) !important;
 color: var(--color-navy) !important;
 font-size: 14px;
}

#btnlogin {
 background-color: var(--color-blue) !important;
 border: none;
 border-radius: 4px;
 box-shadow: 0 42px 12px 0 rgba(0, 0, 0, 0.00),
  0 27px 11px 0 rgba(0, 0, 0, 0.01),
  0 15px 9px 0 rgba(0, 0, 0, 0.05),
  0 7px 7px 0 rgba(0, 0, 0, 0.09),
  0 2px 4px 0 rgba(0, 0, 0, 0.10);
 color: var(--color-white);
 padding: 8px 16px;
 width: 140px;
}

#btnlogin i {
 display: none;
}

#btnlogin:hover {
 background-color: var(--color-blue-400) !important;
}

.sign-up-wrap {
 color: var(--color-blue);
 margin-top: 24px;
 width: 100%;
}

.sign-up-wrap a,
.login-block .form-group > a.float-right {
 color: var(--color-orange);
 font-size: 14px;
 transition: color 400ms ease-in-out;
}

.sign-up-wrap a:hover,
.login-block .form-group > a.float-right:hover {
 color: var(--color-blue) !important;
}

.login-copyright {
 align-items: center;
 bottom: 0;
 border-top: 1px solid var(--color-gray-400);
 color: var(--color-gray-600);
 display: flex;
 justify-content: center;
 padding: 15px 15px;
 position: absolute;
 text-align: center;
 width: 100%;
}

.login-copyright .copyright {
 font-size: 12px;
 margin-bottom: 0;
}

.login-page__right {
 background-image: url('https://hgropsqsdx.s3.us-west-1.amazonaws.com/midlandon/images/common/login-bg_11171330202509.jpg');
 background-position: center;
 background-repeat: no-repeat;
 background-size: cover;
 height: 100vh;
 position: relative;
 width: 60%;
}

.login-content {
 align-items: center;
 display: flex;
 flex-direction: column;
 height: 100%;
 justify-content: center;
 padding: 80px;
 position: relative;
 z-index: 2;
}

.login-copy__header {
 display: flex;
 flex-direction: column;
 gap: 24px;
 margin-bottom: 40px;
}

.login-copy h1 {
 color: var(--color-white);
}

.login-copy p {
 color: var(--color-white);
 margin-bottom: 0;
 max-width: 700px;
}

.login-copy__grid {
 display: grid;
 grid-template-columns: repeat(2, 1fr);
 grid-template-rows: repeat(2, 1fr);
 gap: 48px 32px;
}

.login-copy__grid-item {
 display: flex;
 flex-direction: column;
 gap: 16px; 
}

.login-copy__grid-item h6 {
 color: var(--color-white);
 padding-left: 20px;
 position: relative;
}

.login-copy__grid-item h6::before {
 background-color: var(--color-orange-400);
 content: "";
 left: 0;
 height: 24px;
 width: 6px;
 position: absolute;
 top: 50%;
 transform: translateY(-50%);
}

.login-copy__cta {
 margin-top: 32px;
}

.login-copy__cta h4 {
 color: var(--color-white);
}

@media (max-width: 1120px) {
 .login-content {
  padding: 40px;
 }

 .login-copy__grid {
  gap: 32px 32px;
 }
}

@media (max-width: 1024px) {

 .login-copy__header h1 {
  font-size: 40px;
 }

 .login-copy__header p {
  font-size: 16px;
 }

 .login-copy__grid-item h6 {
  font-size: 18px;
 }

 .login-copy__grid-item p {
  font-size: 14px;
 }

 .login-copy__cta h4 {
  font-size: 24px;
 }
}

@media (max-width: 960px) {

 .login-page {
  flex-direction: row;
 }

 .login-content {
  padding: 60px 40px;
 }
 .login-page__left {
  height: auto;
  width: 100%;
 }

 .login-page__right {
  height: auto;
  width: 100%;
 }

 .login-copy__header p {
  max-width: 600px;
 }
}

@media (max-width: 500px) {
 .login-copy__header h1 {
  font-size: 32px;
 }

 .login-page__content {
  padding: 56px 0 152px;
 }

 .login-content {
  padding: 40px 15px 60px;
 }

 .login-copy__grid {
  grid-template-columns: 1fr;
  grid-template-rows: repeat(4, 1fr);
 }

 #btnlogin {
  padding: 12px 16px;
  width: 100%;
 }

 .login-block .form-group > a.float-right {
  display: inline-block !important;
  float: none !important;
  margin-top: 24px !important;
  text-align: center !important;
  width: 100% !important;
 }

 .sign-up-wrap {
  margin-top: 16px !important;
 }
}

/* GDPR Pop-up */
#cookiewarning {
 background-color: var(--color-navy-gray);
}

.cookie-content {
 color: var(--color-white);
}

.cookie-content h3 {
 background-image: linear-gradient(to right, rgb(205, 64, 29), rgb(253, 155, 5)) !important;
 background-clip: text;
 -webkit-background-clip: text;
 -webkit-text-fill-color: transparent;
 margin-bottom: 6px;
 text-transform: capitalize;
}

.cookie-btn .btn-secondary {
 background-color: none !important;
 background-image: linear-gradient(to right, rgb(205, 64, 29), rgb(253, 155, 5)) !important;
 border: none !important;
 border-radius: 6px;
 box-shadow: 0 42px 12px 0 rgba(0, 0, 0, 0.00),
  0 27px 11px 0 rgba(0, 0, 0, 0.01),
  0 15px 9px 0 rgba(0, 0, 0, 0.05),
  0 7px 7px 0 rgba(0, 0, 0, 0.09),
  0 2px 4px 0 rgba(0, 0, 0, 0.10);
 color: var(--color-white);
 min-width: 150px;
 opacity: 1;
 padding: 10px 20px;
 transition: all 400ms ease-in-out;
}

.cookie-btn .btn-secondary:hover,
.cookie-btn .btn-secondary:focus,
.cookie-btn .btn-secondary:active,
.cookie-btn .btn-secondary:hover,
.cookie-btn .btn-secondary:focus,
.cookie-btn .btn-secondary:active {
 background-color: none !important;
 background-image: linear-gradient(to right, rgb(205, 64, 29), rgb(253, 155, 5));
 box-shadow: none;
 opacity: 1;
}

.cookie-btn .btn-secondary:hover {
 background-color: var(--color-orange-600);
}

.cookie-btn .btn-outline-secondary {
 border-color: var(--color-white) !important;
 color: var(--color-white) !important;
 transition: background-color 400ms ease-in-out;
}

.cookie-btn .btn-outline-secondary:hover {
 background-color: rgba(255, 255, 255, 0.10) !important;
}

/* Forgot Password Modal */
#forgate_password_popup .page-header {
 display: none;
}

/* Registration Page */
.registration-page .main-content > .col-12 h1 {
    display: none !important;
}

#frmuser_register {
    margin: 0 auto;
    max-width: 1140px;
    padding: 0 24px;
}

.input-group-require.text-danger {
    display: none !important;
}

.registration-page .container > h1,
.registration-page .container > p,
.registration-page .container .page-sub-header {
 display: none !important;
}

.registration-page .container .text-center {
 margin: 48px 0 32px;
 width: 100%;
}

.registration-page .container .text-center > img {
 margin: 0 !important;
 max-width: 200px;
}

.registration-page .page-header.d-flex {
   border-bottom: none !important;
   margin: 0 auto 24px !important;
   padding: 0 24px 12px !important;
   width: 100%;
}

#user_signup {
    margin-bottom: 72px !important;
}


@media (max-width: 700px) {
    .registration-page .page-header {
        margin-top: 0px !important;
    }
}



.registration-page .page-header h1.d-inline {
 display: inline-flex !important;
 font-size: 40px !important;
 margin-bottom: 0 !important;
 width: auto !important;
}

.registration-page .page-header a {
 align-items: center !important;
 display: inline-flex !important;
 margin: 0 !important;
 transition: color 400ms ease-in-out;
}

.registration-page .page-header a:hover {
 color: var(--color-orange);
}

.event_userRegister > .row:first-of-type {
 display: grid;
 grid-template-columns: repeat(2, 1fr);
 grid-template-rows: auto;
 gap: 24px 16px;
}

.event_userRegister > .row > .form-group {
 margin: 0;
 padding: 0;
 max-width: 100%;
 width: 100%;
}


#frmuser_register > .row:nth-of-type(2) > .col-md-6.mb-3 button[type="submit"] {
 display: inline-block;
 margin-right: 12px;
}

#frmuser_register > .row:nth-of-type(2) > .col-md-6.mb-3 button[type="reset"] {
 display: inline-block;
 margin-left: 12px;
}

#frmuser_register input[type="text"]#phone {
 padding-left: 34px !important
}

.event_userRegister > .row > .form-group input {
 margin: 0;
 padding: 0;
}

.event_userRegister > .row:nth-of-type(2) > .col-12.col-md-6 {
 display: grid;
 flex: 0 0 100%;
 grid-template-columns: repeat(4, 1fr);
 grid-template-rows: auto;
 gap: 24px 16px;
 max-width: 100%;
 padding-left: 0 !important;
 padding-right: 0 !important;
 width: 100%;
}

.event_userRegister > .row:nth-of-type(2) > .col-12.col-md-6 > .form-group {
 margin-bottom: 0;
 max-width: 100%;
 width: 100%;
}

.event_userRegister > .row:nth-of-type(2) > .col-12.col-md-6 > .form-group:nth-of-type(1) {
 grid-column-start: 1;
 grid-column-end: 3;
}

.event_userRegister > .row:nth-of-type(2) > .col-12.col-md-6 > .form-group:nth-of-type(2) {
 grid-column-start: 1;
 grid-column-end: 3;
}

.event_userRegister > .row:nth-of-type(2) > .col-12.col-md-6 > .form-group:nth-of-type(3) {
 grid-column-start: 1;
 grid-column-end: 3;
}

.event_userRegister > .row:nth-of-type(2) > .col-12.col-md-6 > button[type="submit"] {
 grid-column-start: 1;
 grid-column-end: 2;
 max-width: 100px;
}

.event_userRegister > .row:nth-of-type(2) > .col-12.col-md-6 > button[type="reset"] {
 color: var(--color-navy);
 grid-column-start: 2;
 grid-column-end: 3;
 max-width: 100px;
 position: relative;
 transition: color 400ms ease-in-out;
}

.event_userRegister > .row:nth-of-type(2) > .col-12.col-md-6 > button[type="reset"]:hover {
 color: var(--color-orange);
}

.registration-subheader {
 margin: 48px 0 24px;
}

@media (max-width: 600px) {

 .registration-page .container .text-center > img {
  margin: 0 !important;
  max-width: 180px;
 }

 .registration-page .page-header h1.d-inline {
  font-size: 27px !important;
 }
 
 .event_userRegister > .row:first-of-type,
 .event_userRegister > .row:nth-of-type(2) > .col-12.col-md-6 {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: auto;
  gap: 24px 16px;
 }
}

/* Top Header */
.top-header {
 background-color: var(--color-blue) !important;
 padding: 4px 0 !important;
}

.top-header .container {
 padding-top: 0 !important;
}

.top-header .typeahead {
 background-color: var(--color-blue-400) !important;
 border: none;
 border-radius: 4px;
 box-shadow: none;
 color: var(--color-white) !important;
 height: 28px;
}

.top-header .typeahead::placeholder {
 color: var(--color-white) !important;
}

.top-header .top-links .list-inline-item:nth-of-type(1) {
 margin: 0 1rem 0 0 !important;
}

.search-icon .twitter-typeahead:after {
 align-items: center;
 color: var(--color-white) !important;
 display: flex;
 justify-content: center;
}

.tt-dropdown-menu {
 background-color: var(--color-white);
 border: none !important;
 border-radius: 6px;
 box-shadow: 0 42px 12px 0 rgba(0, 0, 0, 0.00),
  0 27px 11px 0 rgba(0, 0, 0, 0.01),
  0 15px 9px 0 rgba(0, 0, 0, 0.05),
  0 7px 7px 0 rgba(0, 0, 0, 0.09),
  0 2px 4px 0 rgba(0, 0, 0, 0.10);
 padding: 0 !important;
}

.tt-suggestion {
 border: none !important;
 border-bottom: 1px solid var(--color-gray-200) !important;
 margin: 0 !important;
 padding: 8px 12px !important;
}

.tt-suggestion:hover,
.tt-suggestion:focus,
.tt-suggestion:active,
.tt-suggestion.is-under-cursor {
 background-color: var(--color-navy) !important;
}

.tt-suggestion:hover a {
 color: var(--color-white) !important;
}

.tt-suggestion:last-of-type {
 border: none !important;
 border-bottom: 1px solid transparent !important;
 border-bottom-left-radius: 6px !important;
 border-bottom-right-radius: 6px !important;
}

.tt-suggestion:last-of-type > a {
 border-bottom-left-radius: 6px !important;
 border-bottom-right-radius: 6px !important;
}

.tt-suggestion:last-of-type:hover > a {
 border-bottom-left-radius: 6px !important;
 border-bottom-right-radius: 6px !important;
}

.tt-suggestion > a {
 color: var(--color-navy);
 font-size: 14px;
}

.tt-highlight {
 color: var(--color-orange);
 font-family: var(--font-family-body);
 font-weight: 400;
}

.tt-suggestion:hover a .tt-highlight,
.tt-suggestion.is-under-cursor a .tt-highlight {
 color: var(--color-orange-400) !important;
}

.top-header .top-links .navbar-text {
 color: var(--color-white);
}

.top-header .top-links a {
 color: var(--color-light-blue);
 transition: color 400ms ease-in-out;
}

.top-header .top-links a:hover {
 color: var(--color-orange) !important;
}

.top-header .top-links .dropdown {
 margin: 0 !important;
}

.top-header .top-links .dropdown-menu > a {
 color: var(--color-navy) !important;
 transition: all 400ms ease-in-out;
}

.top-header .top-links .dropdown-menu > a:hover {
 background-color: var(--color-gray-50) !important;
 color: var(--color-orange) !important;
}

/* Navbar*/
.navbar {
 background-color: var(--color-white) !important;
 padding: 0 15px !important;
}

@media (min-width: 768px) {
 .navbar {
  padding: 0 !important;
 }
}

.navbar > .container {
 position: relative;
}

.navbar-brand {
 margin-right: 0 !important;
 max-width: 180px !important;
 padding: 16px 0;
 position: relative;
 z-index: 10;
}

.navbar-expand-md .navbar-collapse {
 display: inline-flex !important;
 justify-content: flex-end;
 padding-right: 100px !important;
 width: auto !important;
 z-index: 1;
}

.navbar-collapse .navbar-nav .nav-item span {
 color: var(--color-navy) !important;
 transition: color 400ms ease-in-out;
}

.navbar-collapse .navbar-nav .nav-item:hover span,
.navbar-collapse .navbar-nav .nav-item.active span {
 color: var(--color-orange) !important;
}

/* Resources Subnav */
.dropdown-menu:has(.resources-subnav) {
 box-shadow: 0 42px 12px 0 rgba(0, 0, 0, 0.00),
  0 27px 11px 0 rgba(0, 0, 0, 0.01),
  0 15px 9px 0 rgba(0, 0, 0, 0.05),
  0 7px 7px 0 rgba(0, 0, 0, 0.09),
  0 2px 4px 0 rgba(0, 0, 0, 0.10);
}

@media (max-width: 767px) {
 .dropdown-menu:has(.resources-subnav) {
  box-shadow: none !important;
 }
}

.resources-subnav  {
 background-color: var(--color-white) !important;
 list-style: none;
 margin: 0;
 padding: 0;
}

.resources-subnav li {
 margin: 0;
 transition: background-color 400ms ease-in-out;
}

.navbar-nav .nav-item .resources-subnav li > a {
 border-bottom: none;
 display: inline-flex;
 padding: 10px 20px;
 text-indent: 12px !important;
 transition: all 400ms ease-in-out;
 width: 100%;
}

.navbar-nav .nav-item .resources-subnav li:hover {
 background-color: var(--color-navy-gray) !important;
}

.navbar-nav .nav-item .resources-subnav li:hover a {
 color: var(--color-orange-400) !important;
}

.nav-item.submenu_custom_link a::after {
 color: var(--color-navy) !important;
 transition: color 400ms ease-in-out;
}

.nav-item.submenu_custom_link:hover a::after {
 color: var(--color-orange) !important;
}

/* Mobile Nav */
@media (max-width: 767px) {

 .navbar-toggler.open + .navbar-brand {
  z-index: 1 !important;
 }

 .navbar-expand-md .navbar-collapse.show {
  display: inline-flex !important;
  justify-content: flex-end;
  padding: 0 !important;
  width: calc(100% - 56px) !important;
  z-index: 1;
 }

 .navbar-expand-md .navbar-collapse.show .navbar-nav {
  margin-right: 0 !important;
 }

 .navbar-collapse~.navbar-bg-outside {
  background: rgba(0, 0, 0, 0.75);
 }

 .navbar-nav > .d-md-none {
  margin-bottom: 0 !important;
 }

 .navbar-collapse .navbar-nav .nav-item {
  margin-right: 0 !important;
  transition: background-color 400ms ease-in-out;
 }

 .navbar-collapse .navbar-nav .nav-link {
  padding: 0.8rem !important;
 }

 .navbar-collapse .navbar-nav .nav-item span {
  transition: all 400ms ease-in-out;
 }

 .navbar-collapse .navbar-nav .nav-item:hover {
  border-bottom: none !important;
  background-color: var(--color-navy) !important;
 }

 .navbar-nav .nav-item .resources-subnav li a {
  border-bottom: 1px solid #CCC;
  padding: 16px !important;
 }

 .navbar-collapse .navbar-nav .nav-item:hover span {
  color: var(--color-orange-400) !important;
 }

 .navbar-nav .nav-item .resources-subnav li:hover {
  background-color: var(--color-navy) !important;
 }

 .navbar-collapse .navbar-nav .nav-item.lang-contact {
  border-bottom: none !important;
 }

 .navbar-collapse .user-info {
  background-color: var(--color-blue) !important;
 }

 .navbar-bg-outside::after {
  display: none !important;
 }

 .resources-subnav {
  border-bottom: none !important;
 }
}

.navbar-collapse .navbar-nav {
 margin-left: 0 !important;
}

.navbar-nav .nav-item {
 margin: 0 0.8rem 0 0 !important;
}

.navbar-nav .nav-link {
 padding: 0.75rem !important;
}

@media (max-width: 865px) {
 .navbar-nav .nav-item {
  margin: 0 !important;
 }
}

.navbar-nav .nav-item a {
 color: var(--color-navy) !important;
}

.navbar-nav .nav-item.dropdown a::after {
 display: none !important;
}

.navbar-nav .nav-item:nth-of-type(5).dropdown a::after,
.navbar-nav .nav-item:nth-of-type(2).dropdown a::after {
 display: inline-block !important;
 transform: rotate(0deg) !important;
}

@media (max-width: 774px) {
 .dropdown.exlink.nav-item {
  display: none !important;
 }

 .top-header > .container > .mr-3 {
  margin-right: 0 !important;
 }
}

/* Mobile Search and Cart Wrapper */
.navbar > .container > .d-md-none {
 display: flex;
 height: 82px;
 justify-content: flex-end;
 overflow: visible;
 position: absolute;
 right: 0;
 top: 0;
 width: 100%;
}

.navbar > .container > .d-md-none .btn-link {
 padding: 6px 8px;
}

.navbar > .container > .d-md-none .btn-link:last-of-type {
 padding-right: 0 !important;
}

.navbar > .container > .d-md-none .btn-link i {
 color: var(--color-navy);
 font-size: 16px;
 transition: color 400ms ease-in-out;
}

.navbar > .container > .d-md-none .btn-link:hover i {
 color: var(--color-orange) !important;
}

.navbar > .container > .d-md-none .search-toggle {
 background-color: var(--color-blue);
 box-shadow: none !important;
 overflow: visible;
 padding: 12px 0;
 top: 100%;
}

.navbar > .container > .d-md-none .search-toggle::before {
 background-color: var(--color-blue);
 content: "";
 height: 100%;
 position: absolute;
 left: -50px;
 top: 0;
 width: 200%;
}

.navbar > .container > .d-md-none .search-toggle .typeahead {
 background-color: var(--color-blue-400);
 box-shadow: none !important;
 border: none;
 color: var(--color-white);
}

.navbar > .container > .d-md-none .search-toggle .typeahead::placeholder {
 color: var(--color-white);
}

.navbar-toggler {
 height: 26px;
 margin: 0 !important;
 overflow: visible;
 padding: 0;
 position: absolute;
 right: 0;
 top: 42px;
 width: 26px;
 z-index: 10;
}

.navbar-toggler.open {
 gap: 0px;
}

.navbar-toggler .navbar-toggler-icon {
 display: none;
}

.navbar-toggler span {
 background-color: var(--color-blue);
 border-radius: 3px;
 display: inline-flex;
 height: 3px;
 position: absolute;
 left: 0;
 right: 0;
 transition: top 200ms ease-in-out, transform 200ms ease-in-out 100ms, background-color 400ms ease-in-out;
 width: 26px;
}

.navbar-toggler span:nth-of-type(2) {
 top: 9px;
}

.navbar-toggler span:nth-of-type(3) {
 top: 17px;
}

/* Nav Open */
.navbar-toggler[aria-expanded="true"] span {
 background-color: var(--color-white);
}

.navbar-toggler.open span:nth-of-type(2) {
 top: 13px;
 transform: rotate(45deg);
}

.navbar-toggler.open span:nth-of-type(3) {
 top: 13px;
 transform: rotate(-45deg);
}

.cart-wrap {
 align-items: center;
 background-color: var(--color-navy);
 color: var(--color-white);
 display: none;
 height: 100%;
 justify-content: center;
 position: absolute;
 right: 24px;
 width: 100px;
 z-index: 2;
}

.cart-wrap a::after {
 content: "";
 display: block;
 position: absolute;
 top: -25px;
 left: -13px;
 width: 70px;
 height: 50px;
}

@media (min-width: 768px) {
 .cart-wrap {
  display: flex;
 }
}

.cart-wrap a {
 align-items: center;
 color: var(--color-light-blue);
 display: inline-flex;
 justify-content: center;
 margin-right: 16px;
 transform: scale(1);
 transition: transform 300ms ease-in-out;
}

.cart-wrap a:hover  {
 transform: scale(1.15);
}



/* Footer */
#footer {
 margin-top: 0 !important;
}

.footer-content {
 color: var(--color-white) !important;
}

.footer-content > .container {
 max-width: none !important;
 padding: 0;
 width: 100%;
}

/* Footer Upper */
.footer-upper {
 background-color: var(--color-navy) !important;
 display: flex;
 flex-direction: column;
 justify-content: center;
 padding: 48px 0;
}

.footer-nav {
 margin-top: 24px;
 width: 100%;
}

.footer-nav > .container {
 text-align: center;
}

.footer-nav ul {
 display: inline-flex;
 justify-content: center;
 list-style: none;
 margin: 0;
 padding: 0;
}

@media (max-width: 550px) {
 .footer-nav ul {
  flex-direction: column;
  grid-row-gap: 10px;
 }
}

.footer-nav ul li {
 margin: 0 16px;
}

.footer-nav ul li a {
 color: var(--color-white);
 font-size: 14px;
 transition: color 400ms ease-in-out;
}

.footer-nav ul li a:hover {
 color: var(--color-orange);
}

.social-links ul {
 display: flex;
 justify-content: center;
 list-style: none;
 margin: 0;
 padding: 0;
}

.social-links ul li {
 margin: 0 16px;
}

.social-links ul li a {
 color: var(--color-light-blue);
 font-size: 20px;
 transition: color 400ms ease-in-out;
}

.social-links ul li a:hover {
 color: var(--color-orange);
}

/* Footer Lower */
.footer-lower {
 background-color: var(--color-blue) !important;
 padding: 15px;
 text-align: center;
}

.footer-lower .copyright {
 color: var(--color-white);
 font-size: 12px;
 margin: 0;
}

footer.bg-light {
 display: none;
}

/* Hero Styles */
.hero {
 display: flex;
 flex-direction: column;
 margin-bottom: 72px;
 width: 100%;
}

.hero__content {
 align-items: center;
 display: flex;
 flex-direction: column;
 justify-content: center;
 padding: 80px 15px;
 position: relative;
 z-index: 2;
}

@media (max-width: 768px) {
 .hero {
  margin-bottom: 80px;
 }

 .hero__content {
  padding: 64px 15px;
 }
}

.hero__copy {
 text-align: center;
}

.hero__copy h1 {
 margin-bottom: 24px;
}

.hero__copy p {
 max-width: 650px;
}

.hero__buttons {
 display: flex;
 justify-content: center;
 margin-top: 32px;
 width: 100%;
}

.hero__image {
 object-fit: cover;
 margin-bottom: -9vw;
 position: relative;
 top: -9.5vw;
 width: 100%;
 z-index: 1;
}

.hero-mobile {
 display: none;
}

.hero-desktop {
 display: block;
}

@media (max-width: 800px) {

 .hero__image {
  margin-bottom: -7vw;
  top: -7vw;
 }

 .hero-mobile {
  display: block;
 }

 .hero-desktop {
  display: none;
 }
}

@media (max-width: 500px) {

 .hero__image {
  margin-bottom: -5vw;
  top: -5vw;
 }
}

/* Feature */
.feature {
 margin: 112px 0;
 width: 100%;
}

.feature__content {
 align-items: center;
 display: flex;
 flex-direction: row;
 flex-wrap: wrap;
 justify-content: space-between;
}

.feature__copy {
 width: 45%;
}

.feature__copy p:last-of-type {
 margin-bottom: 0;
}

.feature__copy .tagline {
 font-family: "Gotham Bold", sans-serif !important;
 font-weight: 600 !important;
 font-size: 14px !important;
 color: var(--color-orange);
 letter-spacing: 1px !important;
 margin-bottom: 8px;
 text-transform: uppercase;
 transform: translateX(2px);
}

.feature__copy h2 {
 color: var(--color-blue);
 margin-bottom: 24px;
}

.feature__image {
 width: 45%;
}

.feature__image img {
 border-radius: 12px;
 box-shadow: 0 129px 36px 0 rgba(0, 0, 0, 0.00),
  0 83px 33px 0 rgba(0, 0, 0, 0.01),
  0 46px 28px 0 rgba(0, 0, 0, 0.05),
  0 21px 21px 0 rgba(0, 0, 0, 0.09),
  0 5px 11px 0 rgba(0, 0, 0, 0.10);
 transform: rotate(3deg) translateY(8px);
}

.feature__buttons {
 display: flex;
 margin-top: 32px;
 width: 100%;
}

.feature__buttons a {
 min-width: 180px;
}

.feature__content .custom-list {
 margin: 26px 0 36px;
}

/* Modifier - reduce margin bottom */
.feature.margin-small {
 margin-bottom: 112px;
}

/* Modifier - Flip Images */
.image-left .feature__content {
 flex-direction: row-reverse;
}

/* Modifier Alt 1 */
.images--alt-1 {
 margin: 112px 0 160px;
}

.images--alt-1 .feature__image {
 display: flex;
 justify-content: center;
 position: relative;
}

.images--alt-1 .left-image {
 max-width: 275px;
 z-index: 2;
}

.images--alt-1 .left-image img {
 transform: rotate(-10deg) translate(0px, 20%);
}

.images--alt-1 .right-image {
 max-width: 300px;
 z-index: 1;
}

.images--alt-1 .right-image img {
 transform: rotate(10deg) translate(0px, 2.5%);
}

/* Modifier Alt 2 */
.images--alt-2 {
 margin: 160px 0 176px;
}

.images--alt-2 .feature__image {
 display: flex;
 justify-content: center;
 position: relative;
}

.images--alt-2 .feature__image-wrap {
 max-width: 92%;
 max-width: 350px;
}

.images--alt-2 .feature__image img {
 transform: rotate(-5deg) translateX(0px);
}

@media (max-width: 960px) {
 .feature__copy {
  width: 48%;
 }

 .feature__image {
  width: 48%;
 }

 .images--alt-1 {
  margin: 88px 0 120px;
 }

 .images--alt-2 {
  margin: 120px 0 112px;
 }
}

@media (max-width: 768px) {

 .feature {
  margin: 112px 0 60px;
 }

 .feature__copy {
  width: 100%;
 }

 .feature__image {
  margin-top: 60px;
  width: 100%;
 }

 .images--alt-1 {
  margin: 88px 0 100px;
 }
 
 .images--alt-1 .left-image img {
  transform: rotate(-10deg) translate(0px, 25%);
 }
 
 .images--alt-1 .right-image img {
  transform: rotate(10deg) translate(-20px, 2.5%);
 }

 .images--alt-2 {
  margin: 100px 0 112px;
 }
}

@media (max-width: 600px) {

 .feature {
  margin: 112px 0 80px;
 }

 .feature__copy .tagline {
  font-size: 12px !important;
 }

 .images--alt-1 {
  margin: 72px 0 100px;
 }

 .images--alt-2 {
  margin: 100px 0 112px;
 }
}

/* Testimonials */
.testimonials {
 align-items: center;
 background-color: rgb(252, 99, 4);
 clip-path: polygon(0 15%, 100% 0%, 99% 85%, 0% 100%);
 display: flex;
 flex-direction: column;
 height: 800px;
 left: -25%;
 justify-content: center;
 overflow: hidden;
 position: relative;
 width: 150%;
 z-index: 1;
}

.testimonials__inner {
 align-items: center;
 /* background-image: url("./assets/images/testimonials-bg.png"); */
 background-image: url("https://hgropsqsdx.s3.us-west-1.amazonaws.com/midlandon/images/common/testimonials-bg_09201222202509.png");
 background-position: center;
 background-repeat: no-repeat;
 background-size: cover;
 clip-path: polygon(0 15%, 100% 0%, 99% 85%, 0% 100%);
 display: flex;
 flex-direction: column;
 height: calc(100% - 20px);
 justify-content: center;
 padding: 10px 25%;
 width: 100%;
}

.testimonials__content h2 {
 color: var(--color-white);
 text-shadow: 0 0 10px rgba(0, 0, 0, 0.50);
}

.testimonials__grid {
 display: grid;
 /* grid-template-columns: repeat(3, 1fr); */
 grid-template-columns: repeat(3, minmax(0, 1fr));
 grid-template-rows: 1fr;
 gap: 32px;
 margin-top: 48px;
}

.testimonials__item {
 background: linear-gradient(297deg, rgba(255, 255, 255, 0.25) -6.76%, rgba(255, 255, 255, 0.05) 90.13%);
 background-blend-mode: overlay;
 border: 1px solid rgba(255, 255, 255, 0.20);
 border-radius: 8px;
 box-shadow: 0 129px 36px 0 rgba(0, 0, 0, 0.00),
  0 83px 33px 0 rgba(0, 0, 0, 0.01),
  0 46px 28px 0 rgba(0, 0, 0, 0.05),
  0 21px 21px 0 rgba(0, 0, 0, 0.09),
  0 5px 11px 0 rgba(0, 0, 0, 0.10);
 backdrop-filter: blur(12px);
 -webkit-backdrop-filter: blur(12px); /* For Safari compatibility */
 display: flex;
 flex-direction: column;
 justify-content: space-between;
}

.testimonials__quote {
 padding: 24px 24px 16px 24px;
}

.testimonials__quote p {
 color: var(--color-white);
 font-size: 14px;
 margin: 0;
}

.testimonials__meta {
 align-items: center;
 display: flex;
 gap: 16px;
 padding: 0 24px 24px 24px;
}

.testimonials__image {
 align-items: center;
 display: inline-flex;
 flex-direction: row;
 justify-content: center;
 max-width: 60px;
}

.testimonials__image img {
 width: 100%;
}

.testimonials__citation-wrap {
 display: flex;
 flex-direction: column;
}

.testimonials__citation-wrap span {
 color: var(--color-white);
 display: inline-block;
}

.testimonials__citation-name {
 font-family: var(--font-family-heading);
 color: var(--color-white);
}

.testimonials__citation-company {
 font-size: 14px;
}

@media (max-width: 1050px) {
 .testimonials {
  height: 900px;
 }

 .testimonials__grid {
  grid-template-columns: 1fr 1fr;
  grid-template-rows: repeat(3, auto);
  gap: 15px 15px;
 }

 .item--1 {
  grid-column: 1 / span 2;
  grid-row: 1 / span 1;
 }

 .item--2 {
  grid-column: 1 / span 1;
  grid-row: 2 / span 2;
 }

 .item--3 {
  grid-column: 2 / span 1;
  grid-row: 2 / span 2;
 }
}

@media (max-width: 960px) {

 .testimonials {
  clip-path: polygon(0 7%, 100% 0%, 99% 93%, 0% 100%);
  left: -5%;
  height: 910px;
  width: 110%;
 }

 .testimonials__content h2 {
  width: 100%;
 }

 .testimonials__inner {
  align-items: center;
  clip-path: polygon(0 7%, 100% 0%, 99% 93%, 0% 100%);
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 10px 5% 30px;
 }

 .testimonials__inner .container {
  max-width: none;
 }

 .testimonials__grid {
  grid-template-columns: 1fr 1fr;
  grid-template-rows: repeat(3, auto);
  gap: 15px 15px;
 }

 
}

@media (max-width: 650px) {

 .testimonials {
  height: 1020px;
 }
}

@media (max-width: 500px) {

 .testimonials {
  clip-path: polygon(0 4%, 100% 0%, 99% 96%, 0% 100%);
  left: -5%;
  height: 1200px;
  width: 110%;
 }

 .testimonials__inner {
  align-items: center;
  clip-path: polygon(0 4%, 100% 0%, 99% 96%, 0% 100%);
  padding: 10px 5% 30px;
 }

 .testimonials__grid {
  grid-template-columns: 1fr;
  grid-template-rows: repeat(3, auto);
 }

 .item--1 {
  grid-column: 1 / span 1;
  grid-row: 1 / span 1;
 }

 .item--2 {
  grid-column: 1 / span 1;
  grid-row: 2 / span 1;
 }

 .item--3 {
  grid-column: 1 / span 1;
  grid-row: 3 / span 1;
 }
}

@media (max-width: 450px) {

 .testimonials {
  clip-path: polygon(0 4%, 100% 0%, 99% 96%, 0% 100%);
  left: -5%;
  height: 1300px;
  width: 110%;
 }

 .testimonials__inner {
  align-items: center;
  clip-path: polygon(0 4%, 100% 0%, 99% 96%, 0% 100%);
  padding: 10px 5% 30px;
 }

 .testimonials__quote {
  padding: 24px 16px 16px 16px;
 }
 
 
 .testimonials__meta {
  padding: 0 16px 24px 16px;
 }
}

@media (max-width: 350px) {

 .testimonials {
  height: 1460px;
 }
}

/* Bento */
.bento {
 margin: 80px 0 96px;
 width: 100%;
}

.bento__grid {
 display: grid;
 grid-template-columns: 1fr 1.5fr;
 grid-template-rows: repeat(3, auto);
 gap: 16px;
}

.bento__item {
 border-radius: 12px;
}

.bento--1 {
 grid-column: 1 / span 1;
 grid-row: 1 / span 3;
}

.bento__nested {
 display: grid;
 grid-template-columns: 1.5fr 1fr;
 grid-template-rows: 1fr;
 gap: 16px;
}

.bento__nested-item {
 border-radius: 12px;
 box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.nested--2 {
 grid-template-columns: 1fr 1.5fr;
}

.bento--1 {
 align-items: center;
 /* background-color: var(--color-navy-400); */
 background-color: #092041;
 /* background-image: linear-gradient(to bottom right, rgb(205, 64, 29), rgb(253, 155, 5)) !important; */
 box-shadow: 0 42px 12px 0 rgba(0, 0, 0, 0.00),
  0 27px 11px 0 rgba(0, 0, 0, 0.01),
  0 15px 9px 0 rgba(0, 0, 0, 0.05),
  0 7px 7px 0 rgba(0, 0, 0, 0.09),
  0 2px 4px 0 rgba(0, 0, 0, 0.10);
 display: flex;
 flex-direction: column;
 gap: 24px;
}

.bento--1 .bento__copy {
 align-items: center;
 display: flex;
 flex: 0 0 auto;
 flex-direction: column;
 gap: 8px;
 justify-content: center;
 padding: 64px 15px 0;
}

.bento--1 .bento__copy .logo {
 margin-bottom: 24px;
 max-width: 200px;
}

.bento__copy h5 {
 color: var(--color-white);
}

.bento--1 .bento__copy h2 {
 color: var(--color-white);
 line-height: 1.1;
 text-align: center;
 text-transform: uppercase;
 margin: 0 auto;
 max-width: 230px;
 width: 100%;
}

.bento--1 .bento__copy .squiggle {
 max-width: 74px;
}

.bento--1 .bento__image {
 position: relative;
 display: flex;
 min-height: 350px;
 width: 100%;
}

.bento--4 .bento__copy h6 {
 color: var(--color-white); 
}

@media (max-width: 960px) {

 .bento {
  margin: 70px 0 90px;
 }

 .bento__grid {
  grid-template-columns: 1fr;
  grid-template-rows: repeat(4, auto);
 }

 .bento--1 {
  align-items: center;
  display: flex;
  flex-direction: column; 
  gap: 0;
  grid-column: 1 / span 1;
  grid-row: 1 / span 1;
  justify-content: center;
 }

 .bento--1 .bento__image {
  overflow: visible;
  margin: 24px auto 66px;
  max-width: 400px;
 }
 
 .bento--1 .bento__image img {
  height: auto;
  left: 0;
  max-width: 100% !important;
  min-height: 0;
  object-fit: contain;
  position: static;
  top: 0;
  transform: translateX(0%);
  width: 100% !important; 
 }

 .bento--2 {
  grid-column: 1 / span 1;
  grid-row: 2 / span 1;
 }

 .bento--3 {
  grid-column: 1 / span 1;
  grid-row: 3 / span 1;
 }

 .bento--4 {
  grid-column: 1 / span 1;
  grid-row: 4 / span 1;
 }
}

@media (max-width: 600px) {

 .bento--1 .bento__image {
  margin: 0 auto;
 }
 
 .nested--1,
 .nested--2 {
  grid-template-columns: 1fr;
  grid-template-rows: repeat(2, auto);
 }

 .item-1-1,
 .item-1-2,
 .item-2-1,
 .item-2-2 {
  min-height: 240px;
 }
}

.item-1-1 {
 background-color: var(--color-navy-300);
 background-image: url("https://hgropsqsdx.s3.us-west-1.amazonaws.com/midlandon/images/common/blurred-printing.jpg");
 background-position: center;
 background-repeat: no-repeat;
 background-size: cover;
 box-shadow: 0 42px 12px 0 rgba(0, 0, 0, 0.00),
  0 27px 11px 0 rgba(0, 0, 0, 0.01),
  0 15px 9px 0 rgba(0, 0, 0, 0.05),
  0 7px 7px 0 rgba(0, 0, 0, 0.09),
  0 2px 4px 0 rgba(0, 0, 0, 0.10);
}

.item-1-2 {
 /* background-color: var(--color-navy-400); */
 background-color: #092041;;
 box-shadow: 0 42px 12px 0 rgba(0, 0, 0, 0.00),
  0 27px 11px 0 rgba(0, 0, 0, 0.01),
  0 15px 9px 0 rgba(0, 0, 0, 0.05),
  0 7px 7px 0 rgba(0, 0, 0, 0.09),
  0 2px 4px 0 rgba(0, 0, 0, 0.10);
 display: flex;
 flex-direction: column;
 justify-content: center;
}

.item-1-2 .bento__copy {
 align-items: center;
 display: flex;
 flex-direction: column;
 gap: 6px;
 justify-content: center;
 padding: 15px;
}

.item-1-2 .bento__copy .box__heading {
 align-items: center;
 display: flex;
 flex-direction: column;
 gap: 6px;
 justify-content: center;
}

.item-1-2 .bento__copy .h1 {
 background-image: linear-gradient(to right, rgb(205, 64, 29), rgb(253, 155, 5)) !important;
 background-clip: text;
 -webkit-background-clip: text;
 -webkit-text-fill-color: transparent;
 text-align: center;
}

.item-1-2 .bento__copy .years {
 color: var(--color-white);
 text-align: center;
}

.item-1-2 .bento__copy .small {
 color: var(--color-white);
 max-width: 200px;
 text-align: center;
}

.item-2-1 {
 align-items: center;
 /* background-color: var(--color-light-blue); */
 background-color: #092041;
 /* background-image: linear-gradient(to right, rgb(15, 44, 83), rgb(19, 67, 117)) !important; */
 box-shadow: 0 42px 12px 0 rgba(0, 0, 0, 0.00),
  0 27px 11px 0 rgba(0, 0, 0, 0.01),
  0 15px 9px 0 rgba(0, 0, 0, 0.05),
  0 7px 7px 0 rgba(0, 0, 0, 0.09),
  0 2px 4px 0 rgba(0, 0, 0, 0.10);
 display: flex;
 flex-direction: column;
 justify-content: center;
 gap: 6px;
 padding: 15px;
}

.item-2-1 .bento__copy {
 display: flex;
 flex-direction: column;
 gap: 6px;
 justify-content: center;
 height: 100%;
}

.item-2-1 .box__heading {
 align-items: center;
 display: flex;
 flex-direction: column;
 gap: 12px;
 justify-content: center;
}

.item-2-1 .globe {
 margin: 0 auto;
 max-width: 45px;
}

.item-2-1 h6 {
 color: var(--color-white);
}

.item-2-1 p {
 color: var(--color-white);
 text-align: center;
}

.item-2-2 {
 align-items: center;
 background-image: url("https://hgropsqsdx.s3.us-west-1.amazonaws.com/midlandon/images/common/international-reach.jpg");
 background-position: center;
 background-repeat: no-repeat;
 background-size: cover;
 box-shadow: 0 42px 12px 0 rgba(0, 0, 0, 0.00),
  0 27px 11px 0 rgba(0, 0, 0, 0.01),
  0 15px 9px 0 rgba(0, 0, 0, 0.05),
  0 7px 7px 0 rgba(0, 0, 0, 0.09),
  0 2px 4px 0 rgba(0, 0, 0, 0.10);
 display: flex;
 flex-direction: column;
 justify-content: center;
 padding: 15px;
 position: relative;
}

.item-2-2 .bento__copy {
 color: var(--color-white);
 display: flex;
 flex-direction: column;
 gap: 6px;
 text-align: center;
 z-index: 1;
}

.item-2-2 .bento__copy h6 {
 color: var(--color-white);
}

.item-2-2 .bento__copy p {
 color: var(--color-white);
 margin-bottom: 0;
}

.item-2-2 .bento__image {
 position: absolute;
 top: 0;
 left: 0;
 width: 100%;
 height: 100%;
}

.item-2-2 .bento__image img {
 border-radius: 12px;
 width: 100%;
 height: 100%;
 object-fit: cover;
 opacity: 0.5;
}

.item-3-1 {
 background-color: var(--color-navy-300);
 background-image: url("https://hgropsqsdx.s3.us-west-1.amazonaws.com/midlandon/images/common/author-support.jpg");
 background-position: center;
 background-repeat: no-repeat;
 background-size: cover;
 box-shadow: 0 42px 12px 0 rgba(0, 0, 0, 0.00),
  0 27px 11px 0 rgba(0, 0, 0, 0.01),
  0 15px 9px 0 rgba(0, 0, 0, 0.05),
  0 7px 7px 0 rgba(0, 0, 0, 0.09),
  0 2px 4px 0 rgba(0, 0, 0, 0.10);
}

.item-3-2 {
 /* background-color: var(--color-navy-400); */
 background-color: #092041;;
 box-shadow: 0 42px 12px 0 rgba(0, 0, 0, 0.00),
  0 27px 11px 0 rgba(0, 0, 0, 0.01),
  0 15px 9px 0 rgba(0, 0, 0, 0.05),
  0 7px 7px 0 rgba(0, 0, 0, 0.09),
  0 2px 4px 0 rgba(0, 0, 0, 0.10);
 display: flex;
 flex-direction: column;
 justify-content: center;
}

.item-3-2 .bento__copy {
 align-items: center;
 display: flex;
 flex-direction: column;
 height: 100%;
 gap: 6px;
 justify-content: center;
 padding: 15px;
}

.item-3-2 .bento__copy .box__heading {
 align-items: center;
 display: flex;
 flex-direction: column;
 gap: 12px;
 justify-content: center;
}

.item-3-2 .hand-shake {
 width: 60px;
}

.item-3-2 .bento__copy .h1 {
 background-image: linear-gradient(to right, rgb(205, 64, 29), rgb(253, 155, 5)) !important;
 background-clip: text;
 -webkit-background-clip: text;
 -webkit-text-fill-color: transparent;
 text-align: center;
}

.item-3-2 .bento__copy .years {
 color: var(--color-white);
 text-align: center;
}

.item-3-2 .bento__copy .small {
 color: var(--color-white);
 margin-bottom: 0 !important;
 max-width: 200px;
 text-align: center;
}

.bento__copy .small {
 margin-bottom: 0 !important;
}

/* .bento--4 {
 background-color: var(--color-navy-400);
 background-color: #092041;
 box-shadow: 0 42px 12px 0 rgba(0, 0, 0, 0.00),
  0 27px 11px 0 rgba(0, 0, 0, 0.01),
  0 15px 9px 0 rgba(0, 0, 0, 0.05),
  0 7px 7px 0 rgba(0, 0, 0, 0.09),
  0 2px 4px 0 rgba(0, 0, 0, 0.10);
 display: flex;
 flex-direction: column;
 justify-content: center;
 position: relative;
} */

/* .bento--4 .bento__copy {
 align-items: start;
 display: flex;
 flex-direction: column;
 gap: 6px;
 justify-content: center;
 padding: 24px;
 z-index: 1;
}

.bento--4 .bento__copy h5 {
 color: var(--color-white);
 padding: 0 0 0 20px;
}

.bento--4 .bento__copy p {
 color: var(--color-white);
 margin: 0;
 max-width: 400px;
}

.bento--4 .bento__image {
 position: absolute;
 top: 0;
 left: 0;
 width: 100%;
 height: 100%;
}

.bento--4 .bento__image img {
 border-radius: 12px;
 height: 100%;
 object-fit: cover;
 opacity: 0.3;
 width: 100%;
} */

.bento--2,
.bento--3,
.bento--4,
.bento__nested {
 min-height: 240px;
}

@media (max-width: 480px) {
 .bento {
  margin: 60px 0 80px;
 }
 
 .bento__nested,
 .nested--2 {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 2fr;
  gap: 16px;
  min-height: 240px;
 }
 
 .item-1-1,
 .item-1-2,
 .item-2-1,
 .item-2-2 {
  min-height: 240px;
 }
}

/* Home CTA */
.home-cta {
 background-image: url('https://hgropsqsdx.s3.us-west-1.amazonaws.com/midlandon/images/common/home-cta-bg.png'),
  linear-gradient(to right, rgb(205, 64, 29), rgb(253, 155, 5));
 background-position: center;
 background-repeat: no-repeat;
 background-size: cover;
 margin: 0;
 padding: 60px 0;
}

.home-cta__content {
 display: flex;
 justify-content: space-between;
 align-items: center;
}

.home-cta__copy {
 display: flex;
 flex-direction: column;
 gap: 6px;
 padding-right: 32px;
}

.home-cta__copy h3 {
 color: var(--color-white);
}

.home-cta__copy p {
 color: var(--color-white);
 margin-bottom: 0;
 max-width: 650px;
}

.home-cta__buttons a {
 min-width: 180px;
}

@media (max-width: 768px) {
 .home-cta__copy h3 {
  font-size: 28px;
 }
}

@media (max-width: 600px) {
 .home-cta__content {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
 }

 .home-cta__copy {
  gap: 12px;
  padding-right: 0;
  text-align: center;
  width: 100%;
 }

 .home-cta__buttons {
  text-align: center;
  margin-top: 24px;
  width: 100%;
 }
}

/* Contact Page */
.contact-page .page-header {
 display: none; /* Hide default page header */
}

.contact-page .landing_page {
 margin-top: 16px;
}

.contact-page .form-horizontal {
 max-width: 760px;
 margin: 32px auto 96px;
 padding: 0 24px;
 width: 100%;
}

.contact-page .form-horizontal .iti__tel-input {
 padding-left: 44px !important;
}

@media (max-width: 767px) {
 .contact-page .form-horizontal {
  margin: 32px auto 72px;
  max-width: none;
  padding: 0 16px;
 }
}

/* FAqs Page */
.faq-listing {
 margin: 0 auto 96px;
 max-width: 1140px;
 padding: 0 24px;
 position: relative;
}

@media (max-width: 767px) {
 .faq-listing {
  margin: 0 auto 72px;
  padding: 0 16px;
 }
}

.faq-listing .main-header .container {
 padding: 0 !important;
}

#faq_details .page-header,
#cms_page .page-header {
 display: none;
}

#faq_details > .row.mb-4 {
 margin-bottom: 0 !important;
 position: absolute;
 right: 24px;
 top: 174px;
 z-index: 1;
}

#faq_details #accordion20 > .card:nth-of-type(3) .card-body .spine-links {
 display: flex;
 gap: 16px;
}

#faq_details #accordion20 > .card:nth-of-type(3) .card-body .spine-links a {
 background-color: transparent;
 border: 1px solid var(--color-white) !important;
 border-radius: 20px;
 color: var(--color-white) !important;
 font-size: 80%;
 padding: 8px 16px;
 transition: all 400ms ease-in-out;
}

#faq_details #accordion20 > .card:nth-of-type(3) .card-body .spine-links a:hover {
 background-color: var(--color-white) !important;
 color: var(--color-blue) !important;
}

@media (max-width: 755px) {
 #faq_details > .row.mb-4 {
  top: 204px;
 }
}

@media (max-width: 742px) {
 #faq_details > .row.mb-4 {
  top: 250px;
 }
}

#faq_details .navbar-form {
 align-items: center;
 display: flex;
}

#faq_details .navbar-form .form-group {
 flex: 1;
}

#faq_details .navbar-form .form-group #keywords {
 box-shadow: none;
 transition: border 400ms ease-in-out;
}

#faq_details .navbar-form .form-group #keywords:focus {
 box-shadow: none;
 border: 1px solid var(--color-orange);
}

.hide_panel {
 margin-bottom: 18px;
}

.hide_panel h4 {
 color: var(--color-blue) !important;
 font-size: 28px !important;
 position: relative;
 padding-left: 18px;
}

.hide_panel h4::before {
 background-color: var(--color-orange);
 content: "";
 position: absolute;
 left: 0;
 top: 50%;
 transform: translateY(-50%);
 width: 8px;
 height:100%;
}

.faq-listing .mb-4 {
 margin-bottom: 48px !important;
}

#faq_details .navbar-form button {
 color: var(--color-orange);
 transition: color 400ms ease-in-out;
}

#faq_details .navbar-form button:hover {
 color: var(--color-orange-300);
}

#faq_details .navbar-form button#collapseall {
 color: var(--color-gray-700);
}

#faq_details .navbar-form button#collapseall:hover {
 color: var(--color-gray-900);
}

.faq-listing .card {
 background-image: linear-gradient(to right, var(--color-navy), var(--color-blue));
 border-radius: 6px !important;
 box-shadow: 0 42px 12px 0 rgba(0, 0, 0, 0.00),
  0 27px 11px 0 rgba(0, 0, 0, 0.01),
  0 15px 9px 0 rgba(0, 0, 0, 0.05),
  0 7px 7px 0 rgba(0, 0, 0, 0.09),
  0 2px 4px 0 rgba(0, 0, 0, 0.10);
 color: var(--color-white);
 cursor: pointer;
 margin-bottom: 16px !important;
}

#faq_details .card-header {
 display: flex;
 flex-direction: column;
 justify-content: center;
 min-height: 48px;
 padding: 10px 16px !important;
}

#faq_details .card .card-body,
#faq_details .card .card-body p,
#faq_details .card .card-body li {
 color: var(--color-white) !important;
}

#faq_details .card .card-body a {
 color: var(--color-light-blue) !important;
 transition: color 400ms ease-in-out;
}

#faq_details .card .card-body a:hover {
 color: var(--color-orange) !important; 
}

.faq-listing .card .collapse.show{
 border-top: 1px solid var(--color-navy-300);
}

#faq_details .card-header .card-title {
 line-height: 0;
}

#faq_details .card-header .card-title a {
 color: var(--color-white) !important;
 display: inline-flex;
 font-family: var(--font-family-body);
 font-size: 18px;
 justify-content: space-between;
 line-height: 1.2;
 width: 100%;
}

#faq_details .card-header .card-title a:hover {
 color: var(--color-orange) !important;
}

@media (max-width: 600px) {

 #faq_details .main-header {
  margin-bottom: 32px !important;
 }
 
 #faq_details > .row.mb-4 {
  background-color: var(--color-white);
  border: 1px solid var(--color-gray);
  border-radius: 6px;
  margin-bottom: 48px !important;
  padding: 8px 0;
  position: static;
  width: 100%;
  z-index: 1;
 }

 #faq_details .navbar-form {
  display: flex;
  gap: 8px;
  justify-content: space-between;
  padding: 0;
 }

 #faq_details .navbar-form #keywords {
  background-color: var(--color-gray-200);
  border: none;
  color: var(--color-navy);
 }

 #faq_details .navbar-form #keywords::placeholder {
  color: var(--color-gray-800);
 }
}

@media (max-width: 500px) {

 #faq_details .card-header .card-title a {
  font-size: 16px;
  line-height: 1.3;
 }
}

@media (max-width: 380px) {

 #faq_details > .row.mb-4 {
  padding-top: 16px;
 }

 #faq_details .navbar-form {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: space-between;
  padding: 0;
 }

 #faq_details .navbar-form .form-group,
 #faq_details .navbar-form .button-wrap {
  width: 100%;
 }

 #faq_details .navbar-form .button-wrap {
  display: flex;
  justify-content: start;
 }

 #faq_details .navbar-form .button-wrap #btnreset {
  padding-left: 0 !important;
 }
}


/* File Guidelines */
.file-guidelines-page .main-content {
 margin: 0 auto !important;
 max-width: 960px;
 padding: 0 24px;
 width: 100%;
}

.file-guidelines-page .main-header > .container{
 padding: 0;
}

.file-guidelines-page .guidelines-wrap {
 margin-bottom: 48px;
}

.file-guidelines-page .guidelines-wrap:last-of-type {
 margin-bottom: 96px;
}

@media (max-width: 767px) {
 .file-guidelines-page .guidelines-wrap:last-of-type {
  margin-bottom: 72px;
 }
}

.file-guidelines-page h4 {
 color: var(--color-blue);
 margin-bottom: 20px;
}

/* My Account Page */
.my-account-page .page-header {
 display: none;
}

.my-account-page #account_btns {
 padding-bottom: 72px !important;
}

#user_dashboard {
 max-width: 1140px;
 padding: 0;
 width: 100%;
}

#user_dashboard > .row,
#user_dashboard > .row > .col-12 {
 padding: 0;
}

#account_btns {
 max-width: 1140px;
 padding: 0 24px !important;
 width: 100%;
}

#account_btns > .col-12 {
 padding: 0;
}

#user_dashboard .main-header .container p {
 max-width: 650px;
}

#account_btns .card-aligned {
 display: grid;
 grid-template-columns: repeat(3, 1fr);
 grid-template-rows: auto;
 gap: 24px;
 width: 100%;
}

#account_btns .card-aligned > div {
 border: none !important;
 flex: 1 1 auto;
 max-width: none;
 margin: 0 !important;
 padding: 0 !important;
 width: 100%;
}

.account_dashboard_box {
 align-items: center;
 box-shadow: 0 42px 12px 0 rgba(0, 0, 0, 0.00),
  0 27px 11px 0 rgba(0, 0, 0, 0.01),
  0 15px 9px 0 rgba(0, 0, 0, 0.05),
  0 7px 7px 0 rgba(0, 0, 0, 0.09),
  0 2px 4px 0 rgba(0, 0, 0, 0.10);
 display: flex;
 gap: 16px;
 height: auto;
 min-height: 0;
}

.account_dashboard_box img {
 max-width: 30%;
}

.account_dashboard_box span {
 align-items: center;
 display: flex;
 flex-direction: column;
 gap: 6px;
 justify-content: center;
 margin: 0 !important;
 max-width: 70%;
}

.account_dashboard_box span strong,
.account_dashboard_box span > span {
 display: inline-block;
 text-align: left;
 max-width: none !important;
 width: 100% !important;
}

.account_dashboard_box span strong {
 color: var(--color-blue) !important;
 font-size: 20px !important;
}

.account_dashboard_box span > span {
 color: var(--color-navy) !important;
}



/* Sidebar Styles */
.myAccountSidebar .user-profile {
 align-items: center;
 box-shadow: 0 42px 12px 0 rgba(0, 0, 0, 0.00),
  0 27px 11px 0 rgba(0, 0, 0, 0.01),
  0 15px 9px 0 rgba(0, 0, 0, 0.05),
  0 7px 7px 0 rgba(0, 0, 0, 0.09),
  0 2px 4px 0 rgba(0, 0, 0, 0.10) !important;
 display: flex;
 flex-direction: row;
 gap: 16px;
 justify-content: center;
 margin: 48px 0 !important;
}

.myAccountSidebar .user-profile .profile-avatar {
 margin: 0 !important;
}

.profile-info {
 display: flex;
 flex-direction: column;
 gap: 0;
}

.profile-avatar {
 background-image: linear-gradient(to right, rgb(205, 64, 29), rgb(253, 155, 5)) !important;
 flex: 0 0 50px !important;
 height: 50px !important;
 width: 50px !important;
}

.profile-info .profile-name {
 color: var(--color-blue) !important;
 font-size: 20px;
 line-height: 1.1;
 text-align: left;
}

.profile-info .profile-email {
 margin: 0 !important;
 text-align: left;
}

.myAccountSidebar .shadow {
 border-radius: 8px;
 box-shadow: 0 42px 12px 0 rgba(0, 0, 0, 0.00),
  0 27px 11px 0 rgba(0, 0, 0, 0.01),
  0 15px 9px 0 rgba(0, 0, 0, 0.05),
  0 7px 7px 0 rgba(0, 0, 0, 0.09),
  0 2px 4px 0 rgba(0, 0, 0, 0.10) !important;
}

.myAccountSidebar .shadow.card {
 margin-bottom: 48px !important;
 min-height: 117px;
 padding: 24px !important;
}

#myaccount_menu {
 display: grid;
 grid-template-columns: repeat(2, 1fr);
 grid-template-rows: auto;
 gap: 24px;
}

#myaccount_menu li {
 align-items: center;
 display: flex;
 flex-direction: column;
 gap: 8px;
 justify-content: center;
 margin: 0;
 padding: 0 !important;
 position: relative;
}

#myaccount_menu li img {
 width: 25%;
}

#myaccount_menu li a {
 display: inline-block;
 font-family: var(--font-family-heading);
 margin: 0;
 padding: 0 !important;
 text-align: center;
 width: 100%;
}

#myaccount_menu li a::after {
 background-color: transparent;
 content: "";
 position: absolute;
 left: 0;
 top: 0;
 width: 100%;
 height: 100%;
}

#myaccount_menu li.active a {
 color: var(--color-orange) !important;
}

@media (max-width: 1199px) {
 .myAccountSidebar  {
  display: block !important;
  margin: 0 auto !important;
  max-width: 960px;
 }

 .myAccountSidebar .shadow.card {
  margin-bottom: 32px !important;
 }

 #user_dashboard {
  margin: 0 auto !important;
  max-width: 960px;
 }

 #user_dashboard .main-header {
  margin-top: 0 !important;
 }

 #account_btns {
  padding: 0 15px !important;
 }
}

@media (max-width: 960px) {
 #account_btns .card-aligned > div > a {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 24px !important;
  text-align: center;
 }

 #account_btns .card-aligned > div > a img {
  height: 100px;
  max-width: none;
  width: 100px;
 }

 #account_btns .card-aligned > div > a > span {
  display: flex;
  flex-direction: column;
  max-width: none;
  text-align: center;
  width: 100%;
 }

 #account_btns .card-aligned > div > a > span > strong {
  text-align: center;
 }

 #account_btns .card-aligned > div > a > span > span {
  text-align: center;
 }
}

@media (max-width: 767px) {

 #account_btns .card-aligned {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: auto;
  gap: 24px;
  width: 100%;
 }

 #account_btns .card-aligned > div > a {
  display: flex;
  flex-direction: row;
  gap: 24px;
  padding: 24px !important;
  text-align: left;
 }

 #account_btns .card-aligned > div > a > span > strong {
  text-align: left;
 }

 #account_btns .card-aligned > div > a > span > span {
  text-align: left;
 }
}

@media (max-width: 500px) {

 #account_btns .card-aligned > div > a {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 16px !important;
  text-align: center;
 }

 #account_btns .card-aligned > div > a img {
  height: 100px;
  max-width: none;
  width: 100px;
 }

 #account_btns .card-aligned > div > a > span {
  display: flex;
  flex-direction: column;
  max-width: none;
  text-align: center;
  width: 100%;
 }

 #account_btns .card-aligned > div > a > span > strong {
  text-align: center;
 }

 #account_btns .card-aligned > div > a > span > span {
  text-align: center;
 }
}

/* Orders Page */
.page-header {
 display: block;
 margin: 48px 24px;
 max-width: 1140px;
 padding: 0 24px 12px;
}

.page-header h1 {
 font-size: 40px;
 letter-spacing: -0.055rem;
 line-height: 1.1;
}

@media (max-width: 600px) {
 .page-header h1 {
  font-size: 32px;
 }
} 

.savedImage {
 margin: 0 24px;
 max-width: 1140px;
 padding: 0 24px;
}

#user_order {
 margin: 0 24px 72px;
 max-width: 1140px;
 padding: 0 24px;
}

#user_order > .row > .col-12 {
 padding: 0 !important;
}

.page-header.d-flex form > .input-group .input-group-append > button,
.page-header.d-flex form > .input-group .input-group-append {
 min-width: 0 !important;
 width: 50px !important;
}

#frm_search_tmp > .bootstrap-select,
#frm_search_tmp > .bootstrap-select button {
 height: 41px !important;
}

#frm_search_tmp > .bootstrap-select button .filter-option {
 display: flex;
 align-items: center;
}

#order_status_search {
 height: 41px !important;
}

#order_search {
 height: 41px;
}

@media (max-width: 767px) {
 .page-header {
  padding: 0 16px;
 }

 .savedImage,
 #user_order {
  padding: 0 16px;
 }
}

@media (max-width: 700px) {

 .col-12:has(.page-header.d-flex) {
  padding: 0 16px !important;
 }

 .page-header.d-flex {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin: 48px 0 16px 0 !important;
  width: 100%;
 }

 .page-header.d-flex h1 {
  margin-bottom: 12px !important;
  text-align: left;
  width: 100%;
 }

 .page-header.d-flex > div {
  text-align: left;
  width: 100%;
 }

 .page-header.d-flex form {
  display: flex;
  flex-wrap: nowrap;
  gap: 12px;
  justify-content: space-between;
  width: 100%;
 }

 .page-header.d-flex form .dropdown {
  width: 110px !important;
 }

 .page-header.d-flex form > .input-group {
  width: calc(100% - 110px) !important;
 }

 .page-header.d-flex form > .input-group .form-control {
  width: calc(100% - 50px) !important;
 }

 .page-header.d-flex form .form-group {
  width: 100%;
 }

 .savedImage,
 #user_order {
  padding: 0 16px;
 }

 #portfolio_search .input-group {
  width: 100% !important;
 }
}

@media (max-width: 500px) {

 .page-header.d-flex form {
  display: flex;
  flex-direction: column;
  gap: 12px;
 }

 .page-header.d-flex form .dropdown {
  max-width: none !important;
  width: 100% !important;
 }

 .page-header.d-flex form > .input-group {
  max-width: none !important;
  width: 100% !important;
 }

 .page-header.d-flex form > .input-group .form-control {
  max-width: none !important;
  width: calc(100% - 50px) !important;
 }
}

/* Saved Designs */
#portfolio_search .input-group .search_txt {
 height: 41px !important;
}

#user_portfolio {
 padding-bottom: 72px !important;
}

/* Profile Page */
.frmprofileinfo {
 padding: 0 24px;
}
.frmprofileinfo small {
 display: none !important;
}

.frmprofileinfo .form-group .text-danger {
 display: none !important;
}

#user_profile {
 max-width: 1140px;
 padding-bottom: 72px !important;
}

/* About Page */
.basic-hero {
 display: flex;
 flex-direction: column-reverse;
 overflow: hidden;
}

.basic-hero__content {
 background-image: linear-gradient(to left, var(--color-navy), var(--color-blue-600));
 /* background-image: linear-gradient(to right, var(--color-navy), var(--color-blue-600)); */
 padding: 40px 0 48px;
}

.basic-hero__wrap {
 display: flex;
 flex-wrap: wrap;
 justify-content: space-between;
}

.basic-hero__heading {
 flex: 0 0 46%;
}

.basic-hero__heading h2 {
 color: var(--color-white);
 margin: 0;
}

.basic-hero__copy {
 flex: 0 0 46%;
}

.basic-hero__copy p {
 color: var(--color-white);
}

.basic-hero__buttons {
 display: flex;
 gap: 16px;
}

.basic-hero__image {
 background-position: center;
 background-repeat: no-repeat;
 background-size: cover;
 height: 780px;
}

.about-hero .basic-hero__image {
 background-image: url('https://hgropsqsdx.s3.us-west-1.amazonaws.com/midlandon/images/common/about-hero_09504007202510.jpg');
}

.services-hero .basic-hero__image{
 background-image: url('https://hgropsqsdx.s3.us-west-1.amazonaws.com/midlandon/images/common/services-hero_09504007202510.jpg');
}

@media (max-width: 1200px) {

 .basic-hero__image {
  height: 550px;
 }
}

@media (max-width: 960px) {
 .basic-hero__heading {
  flex: 0 0 48%;
 }

 .basic-hero__copy {
  flex: 0 0 48%;
 }
}

@media (max-width: 768px) {

 .basic-hero__heading {
  flex: 0 0 100%;
  margin-bottom: 24px;
 }

 .basic-hero__copy {
  flex: 0 0 100%;
 }

 .basic-hero__buttons {
  margin-top: 24px;
 }

 .basic-hero__image {
  height: 450px;
 }
}

@media (max-width: 500px) {

 .basic-hero__image {
  height: 300px;
 }
}

/* Values Section */
.values {
 /* background-image: url('./assets/images/values-bg.png'); */
 background-image: url('https://hgropsqsdx.s3.us-west-1.amazonaws.com/midlandon/images/common/values-bg.png');
 background-size: cover;
 background-position: center;
 background-repeat: no-repeat;
 height: auto;
 padding: 112px 0;
}

.values__grid {
 display: grid;
 grid-template-columns: repeat(12, 1fr);
 grid-template-rows: repeat(7, 1fr);
 gap: 24px;
}

.values__grid-heading {
 display: flex;
 flex-direction: column;
 gap: 16px;
 grid-column: 1 / span 6;
 grid-row: 1 / span 3;
}

.values__heading-wrap {
 display: flex;
 flex-direction: column;
}

.values__grid-heading .tagline {
 color: var(--color-orange);
}

.values__grid-heading h2 {
 color: var(--color-white);

}

.values__grid-heading p {
 color: var(--color-white);
 margin-bottom: 0;
}

.values__grid-item {
 background: linear-gradient(297deg, rgba(255, 255, 255, 0.20) -6.76%, rgba(255, 255, 255, 0.05) 90.13%);
 background-blend-mode: overlay;
 border: 1px solid rgba(255, 255, 255, 0.20);
 border-radius: 12px;
 box-shadow: 0 129px 36px 0 rgba(0, 0, 0, 0.00),
  0 83px 33px 0 rgba(0, 0, 0, 0.01),
  0 46px 28px 0 rgba(0, 0, 0, 0.05),
  0 21px 21px 0 rgba(0, 0, 0, 0.09),
  0 5px 11px 0 rgba(0, 0, 0, 0.10);
 backdrop-filter: blur(12px);
 -webkit-backdrop-filter: blur(12px); /* For Safari compatibility */
 display: flex;
 flex-direction: column;
 gap: 8px;
 padding: 20px;
}

.values__grid-header {
 align-items: center;
 display: flex;
 gap: 16px;
}

.values__grid-header svg {
 width: 40px;
 fill: var(--color-white);
}

.values-icon-1 {
 width: 50px !important;
}

.values-icon-3 {
 width: 36px !important;
}

.values__grid-item h3,
.values__grid-item p {
 color: var(--color-white);
}

.values__grid-item h3 {
 line-height: 1;
 padding: 4px 0;
}

.values__grid-item p {
 margin-bottom: 0;
}

.values__grid-item.item--1 {
 grid-column: 1 / span 3;
 grid-row: 3 / span 3;
 transform: translateY(34px);
}

.values__grid-item.item--2 {
 grid-column: 4 / span 3;
 grid-row: 5 / span 3;
 transform: translateY(-12px);
}

.values__grid-item.item--3 {
 grid-column: 7 / span 3;
 grid-row: 2 / span 3;
 transform: translateY(24px);
}

.values__grid-item.item--4 {
 grid-column: 10 / span 3;
 grid-row: 4 / span 3;
 transform: translateY(-32px);
}

@media (max-width: 930px) {

 .values {
  padding: 72px 0 64px;
 }

 .values__grid {
  grid-template-rows: repeat(3, auto);
  gap: 16px;
 }

 .values__grid-heading {
  grid-column: 1 / span 10;
  grid-row: 1 / span 1;
 }
 
 .values__grid-item {
  padding: 20px 20px 56px;
 }
 
 .values__grid-item.item--1 {
  grid-column: 1 / span 5;
  grid-row: 2 / span 1;
  transform: translateY(24px);
 }
 
 .values__grid-item.item--2 {
  grid-column: 2 / span 5;
  grid-row: 3 / span 1;
  transform: translateY(-30px);
 }
 
 .values__grid-item.item--3 {
  grid-column: 7 / span 5;
  grid-row: 2 / span 1;
  transform: translateY(24px);
 }
 
 .values__grid-item.item--4 {
  grid-column: 8 / span 5;
  grid-row: 3 / span 1;
  transform: translateY(-30px);
 }
}

@media (max-width: 700px) {

 .values {
  background-position: 20% 60%;
  padding: 72px 0 56px;
 }

 .values__grid {
  grid-template-rows: repeat(5, 1fr);
  gap: 0;
  margin-bottom: -32px;
 }

 .values__grid-heading {
  grid-column: 1 / span 12;
  grid-row: 1 / span 1;
 }
 
 .values__grid-item {
  padding: 20px;
 }
 
 .values__grid-item.item--1 {
  grid-column: 1 / span 9;
  grid-row: 2 / span 1;
  transform: translateY(32px);
 }
 
 .values__grid-item.item--2 {
  grid-column: 2 / span 9;
  grid-row: 3 / span 1;
  transform: translateY(0px);
 }
 
 .values__grid-item.item--3 {
  grid-column: 3 / span 9;
  grid-row: 4 / span 1;
  transform: translateY(-32px);
 }
 
 .values__grid-item.item--4 {
  grid-column: 4 / span 9;
  grid-row: 5 / span 1;
  transform: translateY(-64px);
 }
}

@media (max-width: 523px) {

 .values {
  background-position: 40% 50%;
  padding: 72px 0 64px;
 }

 .values__grid {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-bottom: 16px;;
 }

 .values__grid-heading {
  grid-row: 1 / span 1;
  margin-bottom: 20px;
 }

 
 .values__grid-item.item--1 {
  grid-column: 1 / span 1;
  grid-row: 2 / span 1;
  transform: translateY(0px);
 }
 
 .values__grid-item.item--2 {
  grid-column: 2 / span 9;
  grid-row: 3 / span 1;
  transform: translateY(0px);
 }
 
 .values__grid-item.item--3 {
  grid-column: 3 / span 9;
  grid-row: 4 / span 1;
  transform: translateY(0px);
 }
 
 .values__grid-item.item--4 {
  grid-column: 4 / span 9;
  grid-row: 5 / span 1;
  transform: translateY(0px);
 }
}

/* Services CTA */
.services-cta {
 background-color: #f3f3f3;
 padding: 96px 0 104px;
}

.services-cta__heading {
 align-items: center;
 display: flex;
 flex-direction: column;
 gap: 16px;
 justify-content: center;
 margin: 0 auto 56px;;
 max-width: 650px;
}

.services-cta__heading-wrap {
 display: flex;
 flex-direction: column;
 
}

.services-cta__heading h2,
.services-cta__heading p {
 margin-bottom: 0;
 text-align: center;
}

.services-cta__wrap {
 display: flex;
 flex-direction: column;
 gap: 40px;
}

.services-cta__item {
 background-color: var(--color-white);
 border-radius: 12px;
 box-shadow: 0 129px 36px 0 rgba(0, 0, 0, 0.00),
  0 83px 33px 0 rgba(0, 0, 0, 0.01),
  0 46px 28px 0 rgba(0, 0, 0, 0.05),
  0 21px 21px 0 rgba(0, 0, 0, 0.09),
  0 5px 11px 0 rgba(0, 0, 0, 0.10);
 display: flex;
 justify-content: space-between;
 padding: 24px;
}

.services-cta__item.reverse {
 flex-direction: row-reverse;
}

.services-cta__image,
.services-cta__copy {
 width: 50%;
}

.services-cta__image {
 align-items: center;
 display: flex;
}

.services-cta__image img {
 border-radius: 12px;
 box-shadow: 0 129px 36px 0 rgba(0, 0, 0, 0.00),
  0 83px 33px 0 rgba(0, 0, 0, 0.01),
  0 46px 28px 0 rgba(0, 0, 0, 0.05),
  0 21px 21px 0 rgba(0, 0, 0, 0.09),
  0 5px 11px 0 rgba(0, 0, 0, 0.10);
 width: 100%;
}

.services-cta__copy {
 display: flex;
 flex-direction: column;
 justify-content: center;
 padding: 0 24px;
}

.services-cta__copy-wrap {
 display: flex;
 flex-direction: column;
 gap: 6px;
 margin: 0 auto;
 max-width: 320px;
}

.services-cta__copy-wrap p {
 margin: 0;
}

.services-cta__buttons {
 margin-top: 40px;
}

@media (max-width: 767px) {

 .services-cta {
  padding: 64px 0 72px;
 }

 .services-cta__heading {
  margin: 0 auto 48px;;
 }

 .services-cta__wrap {
  gap: 40px;
 }

 .services-cta__item {
  flex-direction: column !important;
  margin: 0 auto;
  max-width: 650px;
  padding: 24px;
 }

 .services-cta__image,
 .services-cta__copy {
  width: 100%;
 }

 .services-cta__copy {
  margin-top: 32px;
  padding: 0;
 }

 .services-cta__copy-wrap {
  margin: 0;
  max-width: none;
 }
}

@media (max-width: 500px) {

 .services-cta__item {
  padding: 16px;
 }
}

/* Service Cards */
.cards {
 background-image: url('https://hgropsqsdx.s3.us-west-1.amazonaws.com/midlandon/images/common/scrolling-cards-bg.png');
 background-size: cover;
 background-position: center;
 background-repeat: no-repeat;
 padding: 72px 24px 96px;
 width: 100%;
}


.cards__header h2,
.cards__header p {
 color: var(--color-white) !important;
 margin-bottom: 0;
}

.cards__header .container {
 display: flex;
 flex-direction: column;
 gap: 24px;
 margin-bottom: 48px;
 max-width: 760px;
 text-align: center;
}

.cards__cards {
 display: grid;
 grid-template-columns: repeat(6, 1fr);
 grid-template-rows: repeat(2, auto);
 gap: 32px;
 margin: 0 auto;
 max-width: 1460px;
 width: 100%;
}

.cards__card {
 background: linear-gradient(297deg, rgba(255, 255, 255, 0.25) -6.76%, rgba(255, 255, 255, 0.05) 90.13%);
 background-blend-mode: overlay;
 border: 1px solid rgba(255, 255, 255, 0.20);
 border-radius: 8px;
 box-shadow: 0 129px 36px 0 rgba(0, 0, 0, 0.00),
  0 83px 33px 0 rgba(0, 0, 0, 0.01),
  0 46px 28px 0 rgba(0, 0, 0, 0.05),
  0 21px 21px 0 rgba(0, 0, 0, 0.09),
  0 5px 11px 0 rgba(0, 0, 0, 0.10);
 backdrop-filter: blur(12px);
 -webkit-backdrop-filter: blur(12px); /* For Safari compatibility */
 display: flex;
 flex-direction: column;
 padding: 20px;
}

.card--1 {
 grid-column: 1 / span 2;
}

.card--2 {
 grid-column: 3 / span 2;
}

.card--3 {
 grid-column: 5 / span 2;
}

.card--4 {
 grid-column: 2 / span 2;
}

.card--5 {
 grid-column: 4 / span 2;
}

.cards__heading {
 align-items: center;
 display: flex;
 gap: 16px;
 margin-bottom: 16px;
}

.cards__card h3,
.cards__card p {
 color: var(--color-white);
 margin-bottom: 0;
}

.cards__heading svg {
 fill: rgba(255, 255, 255, 0.90);
 width: 50px;
}

svg.scrolling-icon-4 {
 width: 60px;
}

@media (max-width: 960px) {

 .cards__cards {
  grid-template-columns: repeat(4, 1fr);
  grid-template-rows: repeat(4, auto);
  gap: 24px;
 }

 .card--1 {
  grid-column: 1 / span 2;
 }
 
 .card--2 {
  grid-column: 3 / span 2;
 }
 
 .card--3 {
  grid-column: 1 / span 2;
 }
 
 .card--4 {
  grid-column: 3 / span 2;
 }
 
 .card--5 {
  grid-column: 1 / span 4;
 }
}

@media (max-width: 767px) {
 .cards {
  padding: 72px 24px 72px;
 }
}

@media (max-width: 500px) {

 .cards {
  padding: 64px 24px 64px;
 }

 .cards__cards {
  grid-template-columns: repeat(1, 1fr);
  grid-template-rows: repeat(1, auto);
  gap: 16px;
 }

 .card--1 {
  grid-column: 1 / span 1;
 }
 
 .card--2 {
  grid-column: 1 / span 1;
 }
 
 .card--3 {
  grid-column: 1 / span 1;
 }
 
 .card--4 {
  grid-column: 1 / span 1;
 }
 
 .card--5 {
  grid-column: 1 / span 1;
 }
}


/* Contact CTA */
.contact-cta {
 padding: 144px 0;
 position: relative;
}

/* .contact-cta::after {
 content: '';
 background-image: url('https://hgropsqsdx.s3.us-west-1.amazonaws.com/midlandon/images/common/contact-bg.png');
 background-size: cover;
 background-position: center;
 background-repeat: no-repeat;
 height: 100%;
 left: 0;
 opacity: 0.15;
 position: absolute;
 top: 0;
 width: 100%;
 z-index: -1;
} */

.contact-cta__content {
 display: flex;
 flex-direction: column;
 gap: 16px;
 text-align: center;
}

.contact-cta__heading {
 display: flex;
 flex-direction: column;
}

.contact-cta__content h2 {
 margin-bottom: 0;
}

.contact-cta__content p {
 margin: 0 auto;
 max-width: 650px;
}

.contact-cta__btn-wrap {
 margin-top: 16px;
}

@media (max-width: 768px) {

 .contact-cta {
  padding: 88px 0;
 }
}

@media (max-width: 500px) {

 .contact-cta {
  padding: 64px 0;
 }
}

/* Privacy Policy Page */
.privacy-container {
 padding: 48px 0 96px;
}

.privacy-container h2 {
 margin-bottom: 24px;
}

.privacy-container .revision-date {
 color: var(--color-blue);
 margin-bottom: 24px;
}

.privacy-container h4 {
 margin-bottom: 8px;
 margin-top: 28px;
}

.privacy-container ul {
 margin-bottom: 24px;
}

/* Advanced Search Page */
#advance_search {
 margin: 0 auto;
 max-width: 1140px;
 padding: 0 24px;
 width: 100%;
}

#advance_search > .row > .col-12 {
 margin-bottom: 96px;
}

#advance_search > .row > .col-12 > form {
 padding: 0 15px;
}

@media (max-width: 767px) {

 #search_listing_area > .row > .col-12 {
  margin-bottom: 16px;
 }

 #search_listing_area > .row > .col-12:last-of-type {
  margin-bottom: 0;
 }
}

/* Reset Password Page */
#reset_password .page-header {
 display: none;
}


/* Print Page */
.print-page .page-header {
 display: none !important;
}

.print-page .main-content > .col-12 {
 padding: 0 !important;
}

#product-info {
 margin: 72px auto !important;
 max-width: 1540px;
 padding: 0 24px !important;
}

#product-info .ops_ad_annotation > .col-4 {
 display: none !important;
}

#product-info .ops_ad_annotation > .col-8 {
 flex: unset !important;
 max-width: none !important;
 padding: 0 !important;
 width: 100% !important;
}

#product-info .ops_ad_annotation > .col-8 .dropdown select,
#product-info .ops_ad_annotation > .col-8 .dropdown .dropdown-menu {
 display: none !important;
}

#product-info .ops_ad_annotation > .col-8 .dropdown-toggle {
 border: none !important;
 color: var(--color-navy) !important;
 cursor: auto !important;
 font-size: 16px !important;
 height: auto !important;
 opacity: 100% !important;
 padding: 0 5px !important;
 width: 100% !important;
}

#product-info .ops_ad_annotation > .col-8 .dropdown-toggle::after {
 display: none !important;
}

#product-info .ops_ad_annotation > .col-8 .dropdown-toggle .filter-option-inner-inner {
 color: var(--color-navy) !important;
 margin-bottom: 20px !important;
 white-space: wrap !important;
}

/* #product-info .ops_ad_annotation > .col-8 .dropdown-toggle .filter-option {
 display: none !important;
} */

#product_info > .col-12 {
 padding: 0 !important;
}

#product-info > .row:first-of-type,
#product-info > .row:nth-of-type(2) {
 justify-content: space-between;
}

#product-info > .row:nth-of-type(2) > .col-12 {
 flex: unset  !important;
 max-width: none !important;
 padding: 0;
 width: 48%;
}

#product-info > .row:first-of-type > .col-12 {
 flex: unset  !important;
 max-width: none !important;
 padding: 0;
 width: 48%;
}

#product-info #price_calculator {
 margin-bottom: 0 !important;
}

#product-info .fa-question-circle {
 background-image: linear-gradient(to right, rgb(205, 64, 29), rgb(253, 155, 5)) !important;
 background-clip: text;
 -webkit-background-clip: text;
 -webkit-text-fill-color: transparent;
 height: 30px;
 padding-left: 1px;
 width: 30px;
}

#product-info .card-header > .card-title > .row > .col-6:first-of-type {
 color: var(--color-blue);
 padding-left: 0;
}

#product-info .card-header > .card-title > .row > .col-6.text-right {
 padding-right: 0;
}

#product-info .card-header > .card-title > .row > .col-6.text-right a {
 background-image: linear-gradient(to bottom right, rgb(205, 64, 29), rgb(253, 155, 5)) !important;
 background-clip: text;
 -webkit-background-clip: text;
 -webkit-text-fill-color: transparent;
 transform: scale(1);
 transition: transform 400ms ease-in-out;
}

#product-info .card-header > .card-title > .row > .col-6.text-right a:hover {
 transform: scale(1.1);
}

#product-info .card-title {
 font-size: 23px;
}

#product-info .card-title > a {
 color: var(--color-blue);
}

#product-info .card-title > a > i {
 background-image: linear-gradient(to bottom right, rgb(205, 64, 29), rgb(253, 155, 5)) !important;
 background-clip: text;
 -webkit-background-clip: text;
 -webkit-text-fill-color: transparent;
}

#product-info .card-title > a[data-original-title="Help"],
#product-info .card-title > a[data-original-title="Help"] i {
 align-items: center;
 display: inline-flex;
 justify-content: center;
}

#product-info .card-title a[data-original-title="Help"] i::before {
 align-items: center;
 display: flex;
 height: 25px !important;
 justify-content: center;
 width: 25px !important;
}

#product-info label {
 font-size: 15px !important;
 margin-bottom: 0 !important;
}

@media (max-width: 1024px) {
 #product-info label {
  max-width: 200px !important;
 }
}

@media (max-width: 960px) {
 #product-info label {
  max-width: none !important;
 }
}

#product-info label a {
 display: inline-flex;
 transform: translateY(1px);
}

#product-info .text-danger {
 font-size: 13px !important;
 margin-top: 2px;
}

#product-info .card-header,
#product-info .page-section-header {
 border-bottom: 1px solid var(--color-gray-400) !important;
}

#producttotalprice {
 color: var(--color-blue);
 font-size: 18px;
}

#frmadditionalinfo > .row {
 align-items: center;
 display: flex;
 justify-content: space-between;
 margin-top: 32px !important;
}

#frmadditionalinfo > .row > .col-12 {
 display: inline-flex;
 flex: unset;
 padding-left: 0 !important;
 width: auto;
}

#div_addinfo_save_box {
 padding-right: 0 !important;
}

#div_addinfo_save_box #SubmitBtn.disabled {
 background-color: transparent !important;
 background-image: none !important;
 border: 1px solid var(--color-orange) !important;
 color: var(--color-orange) !important;
 margin-top: 0 !important;
 opacity: 0.4 !important;
}

#div_addinfo_save_box #SubmitBtn {
 background-color: none !important;
 background-image: linear-gradient(to right, rgb(205, 64, 29), rgb(253, 155, 5)) !important;
 border: none !important;
 color: var(--color-white) !important;
 margin-top: 0 !important;
 opacity: 1 !important;
}

#instructions_comments_user {
 justify-content: flex-start !important;
}

#instructions_comments_user .bootstrap-growl {
 margin-top: 6px !important;
}

#instructions_comments_user label a {
 color: var(--color-navy) !important;
}

#shipcountry,
#shipzipcode {
 padding-left: 0;
}

#shipstate,
#calculate_button {
 padding-right: 0;
}

#shiptypesdetail {
 margin: 0 !important;
}

#delivery_days_details {
 margin: 0 !important;
}

#delivery_days_details,
#shipestimatetotalprice {
 font-size: 18px;
}

#shipestimatetotalprice {
 position: relative;
 top: -20px !important;
}

#frmadditionalinfo {
 width: 100%;
}

#showuploadfile .uppy-multiple-filename > div > div:nth-of-type(2) {
 color: var(--color-navy) !important;
}

#shareProductLinkModal .modal-content {
 border: none !important;
 border-radius: 12px !important;
 box-shadow: 0 42px 12px 0 rgba(0, 0, 0, 0.00),
  0 27px 11px 0 rgba(0, 0, 0, 0.01),
  0 15px 9px 0 rgba(0, 0, 0, 0.05),
  0 7px 7px 0 rgba(0, 0, 0, 0.09),
  0 2px 4px 0 rgba(0, 0, 0, 0.10);
}

#shareProductLinkModal .modal-content .modal-title {
 color: var(--color-blue);
 font-size: 33px;
 letter-spacing: -0.03rem;
 line-height: 1.15;
}

#shareProductLinkModal .modal-header button {
 background-color: none !important;
 background-image: linear-gradient(to right, rgb(205, 64, 29), rgb(253, 155, 5)) !important;
 border: none !important;
 border-radius: 6px;
 box-shadow: 0 42px 12px 0 rgba(0, 0, 0, 0.00),
  0 27px 11px 0 rgba(0, 0, 0, 0.01),
  0 15px 9px 0 rgba(0, 0, 0, 0.05),
  0 7px 7px 0 rgba(0, 0, 0, 0.09),
  0 2px 4px 0 rgba(0, 0, 0, 0.10);
 color: var(--color-white);
 display: flex;
 align-items: center;
 justify-content: center;
 border-radius: 50%;
 height: 30px;
 margin: 0;
 opacity: 1;
 position: relative;
 width: 30px;
}

#shareProductLinkModal .modal-header button:hover {
 box-shadow: none !important;
}

#shareProductLinkModal .modal-header button span {
 display: none;
}

#shareProductLinkModal .modal-header button::after {
 content: "\2715";
 color: var(--color-white);
 font-weight: normal;
 position: absolute;
 top: 50%;
 left: 50%;
 transform: translate(-50%, -50%);
 font-size: 14px;
}

#shareLink {
 border-top-right-radius: 0.25rem;
    border-bottom-right-radius: 0.25rem;
}

#sendmail .d-flex {
 flex-direction: column;
}

#copy_msg {
 background-color: none !important;
 background-image: linear-gradient(to right, rgb(15, 44, 83), rgb(19, 67, 117)) !important;
 border: none !important;
 border-radius: 6px;
 box-shadow: 0 42px 12px 0 rgba(0, 0, 0, 0.00),
  0 27px 11px 0 rgba(0, 0, 0, 0.01),
  0 15px 9px 0 rgba(0, 0, 0, 0.05),
  0 7px 7px 0 rgba(0, 0, 0, 0.09),
  0 2px 4px 0 rgba(0, 0, 0, 0.10);
 color: var(--color-white);
 min-width: 150px;
 padding-bottom: 10px;
 padding-top: 10px;
 transition: all 400ms ease-in-out;
}

#copy_msg i {
 transform: scale(1);
 transition: transform 400ms ease-in;
}

#copy_msg:hover {
 box-shadow: none !important;
 color: var(--color-white) !important;
}

#copy_msg:hover i {
 color: var(--color-white) !important;
 transform: scale(1.05);
}

#download_pricecalc {
 background-color: none !important;
 background-image: linear-gradient(to right, rgb(205, 64, 29), rgb(253, 155, 5)) !important;
 border: none !important;
 border-radius: 6px;
 box-shadow: 0 42px 12px 0 rgba(0, 0, 0, 0.00),
  0 27px 11px 0 rgba(0, 0, 0, 0.01),
  0 15px 9px 0 rgba(0, 0, 0, 0.05),
  0 7px 7px 0 rgba(0, 0, 0, 0.09),
  0 2px 4px 0 rgba(0, 0, 0, 0.10);
 color: var(--color-white);
 margin: 16px 0 12px 0 !important;
 min-width: 150px;
 padding-top: 10px;
 padding-bottom: 10px;
 transition: all 400ms ease-in-out;
}

#download_pricecalc i {
 transform: scale(1);
 transition: transform 400ms ease-in;
}

#download_pricecalc:hover {
 box-shadow: none !important;
 color: var(--color-white) !important;
}

#download_pricecalc:hover i {
 color: var(--color-white) !important;
 transform: scale(1.05);
}

#email_id {
 width: calc(100%-10px);
}

#pricecalc {
 box-shadow: none !important;
}

.uppy-Dashboard-inner {
 border: 2px dashed var(--color-blue) !important;
 border-radius: 12px !important;
}

#documentPrintFileUpload > .col-12 {
 padding: 0 !important;
}

.uppy-custom-ui-container .fa-cloud-upload {
 background-image: linear-gradient(to bottom right, rgb(205, 64, 29), rgb(253, 155, 5)) !important;
 background-clip: text;
 -webkit-background-clip: text;
 -webkit-text-fill-color: transparent;
}

.uppy-custom-ui-container .uploader-title {
 color: var(--color-blue) !important;
}

.uppy-custom-ui-container .d-block.mb-2,
.uppy-custom-ui-container .uploader-text {
 color: var(--color-navy) !important;
}

.uppy-Dashboard-AddFiles .fa-cloud-upload {
 background-image: linear-gradient(to bottom right, rgb(205, 64, 29), rgb(253, 155, 5)) !important;
 background-clip: text;
 -webkit-background-clip: text;
 -webkit-text-fill-color: transparent;
}

.uppy-Dashboard-AddFiles .uppy-Dashboard-AddFiles-title {
 color: var(--color-navy) !important;
}

.uppy-Dashboard-AddFiles .uppy-Dashboard-browse:hover,
.uppy-Dashboard-AddFiles .uppy-Dashboard-browse:focus {
 border-bottom: 1px solid var(--color-orange) !important;
}

#printPreview .badge {
 background-color: none !important;
 background-image: linear-gradient(to bottom right, rgb(205, 64, 29), rgb(253, 155, 5)) !important;
 border: none !important;
 color: var(--color-white) !important;
 margin-top: 6px;
 padding-bottom: 10px;
 padding-top: 10px;
}

#printPreview #first-page,
#printPreview #last-page,
#printPreview #prev-page,
#printPreview #next-page,
#printPreview .change_rotation,
#printPreview #replaceImage,
#printPreview #resetImage,
#printPreview #expandIframe,
#printPreview #collapseIframe {
 background-color: none !important;
 background-image: linear-gradient(to right, rgb(15, 44, 83), rgb(19, 67, 117)) !important;
 border: none !important;
 border-radius: 6px !important;
 box-shadow: 0 42px 12px 0 rgba(0, 0, 0, 0.00),
  0 27px 11px 0 rgba(0, 0, 0, 0.01),
  0 15px 9px 0 rgba(0, 0, 0, 0.05),
  0 7px 7px 0 rgba(0, 0, 0, 0.09),
  0 2px 4px 0 rgba(0, 0, 0, 0.10);
 color: var(--color-white) !important;
 flex: 1 1 auto;
 min-width: 0 !important;
 padding-bottom: 10px;
 padding-top: 10px;
 transition: all 400ms ease-in-out;
}

#printPreview #first-page:hover,
#printPreview #last-page:hover,
#printPreview #prev-page:hover,
#printPreview #next-page:hover,
#printPreview .change_rotation:hover,
#printPreview #replaceImage:hover,
#printPreview #resetImage:hover,
#printPreview #expandIframe:hover,
#printPreview #collapseIframe:hover {
 box-shadow: none !important;
 color: var(--color-white) !important;
}

.document_print_main .custom-shadow {
 box-shadow: none !important;
}

.document_print_option {
 border-top: 1px solid #dee2e6 !important;
 padding: 0 !important;
 width: 100% !important;
}

.document_print_option > .row {
 padding: 0 16px 24px !important;
}

#printPreview #controls {
 width: 100%;
}

#printPreview #controls > div:nth-of-type(2) {
 margin-left: 0 !important;
}

/* Hide Expand Toggle - interface is bad and broken on mobile */
#printPreview #controls > div:nth-of-type(2) > .ml-2.d-md-block {
 display: none !important;
}

#printPreview #controls > div {
 padding: 0 !important;
 width: 100% !important;
}

#printPreview #controls > div:first-of-type {
 margin-top: 12px !important;
}

#printPreview #controls > div:first-of-type #page-info {
 margin-right: 0 !important;
 text-align: center;
 width: 100%;
}

#printPreview #controls > div:first-of-type > div {
 margin-top: 12px !important;
 width: 100%;
}

#printPreview #controls #page-navigation {
 width: 50px;
}

#printPreview #controls > div:nth-of-type(2) > div {
 flex: 1 1 auto;
 max-width: 100px;
}

#printPreview #controls > div:nth-of-type(2) > div > a {
 width: 100%;
}

#printPreview #controls #resetImage {
 align-items: center;
 display: inline-flex;
 justify-content: center;
}

#printPreview #controls #resetImage svg {
 fill: var(--color-white);
 height: 15px;
 width: 15px
}

.print-page #InfoTab .nav-item a {
 background-color: none !important;
 background-image: linear-gradient(to right, rgb(15, 44, 83), rgb(19, 67, 117)) !important;
 border: none !important;
 border-top-left-radius: 6px;
 border-top-right-radius: 6px;
 color: var(--color-white);
 min-width: 150px;
 padding-bottom: 10px;
 padding-top: 10px;
 text-align: center;
 transition: all 400ms ease-in-out;
}

.print-page #InfoTab .nav-item a:hover {
 background-color: none !important;
 background-image: linear-gradient(to right, rgb(15, 44, 83), rgb(19, 67, 117)) !important;
 border: none !important;
}

#product-info > .row:nth-of-type(3) {
 border-top: none !important;
 margin-top: 40px !important;
 padding-top: 60px;
}

#product-info > .row:nth-of-type(3) > .col-12 {
 align-items: center;
 display: flex;
 flex-wrap: wrap;
 margin: 0 auto;
 max-width: 1160px;
 padding: 0 !important;
}

#product-info > .row:nth-of-type(3) > .col-12 .row {
 flex: 1 1 50%;
}

#product-info > .row:nth-of-type(3) > .col-12 > .row:nth-of-type(1) > .col-12 {
 padding: 0 !important;
}

#product-info > .row:nth-of-type(3) > .col-12 > .row:nth-of-type(1) .page-sub-header {
 border: none !important;
}

#product-info > .row:nth-of-type(3) > .col-12 > .row:nth-of-type(1) .page-sub-header h2 {
 display: flex;
 flex-direction: column;
 font-weight: normal !important;
 gap: 20px;
}

#product-info .related-copy-wrap {
 display: flex !important;
 flex-direction: column !important;
 gap: 24px !important;
}

#product-info .related-copy-wrap p {
 font-family: var(--font-family-body) !important;
 letter-spacing: 0.025rem !important;
 margin-bottom: 0 !important;
}

#product-info .related-btn-wrap a {
 font-family: var(--font-family-body) !important;
 font-weight: normal !important;
 letter-spacing: 0 !important;
}

#product-info > .row:nth-of-type(3) > .col-12 > #related_products > div {
 padding: 0 !important;
}

#product-info > .row:nth-of-type(3) > .col-12 > #related_products #related-product .product-box,
#product-info > .row:nth-of-type(3) > .col-12 > #related_products #related-product .product-box .card {
 border: none !important;
 width: 200px !important;
}

#product-info > .row:nth-of-type(3) > .col-12 > #related_products #related-product .product-box .card .caption {
 display: none !important;
}

.documentPrintPreview {
 max-height: 515px !important;
}

.documentPrintPreview.px-5.py-3 {
 padding-bottom: 48px !important;
}

#product-info {
 margin-bottom: -40px !important;
}

#product-info #InfoTab {
 transform: translateY(-125px);
}

#product-info > .row:nth-of-type(3),
#product-info > .row:nth-of-type(4) {
 display: none !important;
}

#calsummaryproductpricetotaldiv .d-flex.flex-wrap {
 padding: 0 15px !important;
}

#calsummaryproductpricetotaldiv .d-flex.flex-wrap small.unit_price {
 color: var(--color-orange) !important;
}

#producttotalprice #disp_product_price {
 font-family: var(--font-family-heading);
 font-weight: normal;
}

@media (max-width: 1400px) {

 #product-info {
  /* margin-bottom: -250px !important; */
 }

 #product-info #InfoTab {
  /* transform: translateY(-330px); */
 }
}

@media (max-width: 1200px) {

 #product-info {
  /* margin-bottom: -280px !important; */
 }

 #product-info #InfoTab {
  /* transform: translateY(-400px); */
 }
}

@media (max-width: 1024px) {
 #product-info #InfoTab {
  /* transform: translateY(-490px); */
 }
}

@media (max-width: 768px) {

 #product-info > .row:nth-of-type(3) {
  margin-top: 20px !important;
  padding-top: 40px;
 }

 #product-info > .row:nth-of-type(3) > .col-12 .row {
  flex: 1 1 100% !important;
 }

 #product-info #related-product .slick-track {
  display: flex !important;
  justify-content: center !important;
  margin: 0 auto !important;
  width: 100% !important;
 }

 #product-info > .row:nth-of-type(3) > .col-12 > #related_products {
  margin-top: 40px !important;
 }

 #product-info > .row:nth-of-type(3) > .col-12 > #related_products #related-product .product-box,
 #product-info > .row:nth-of-type(3) > .col-12 > #related_products #related-product .product-box .card {
  width: 300px !important;
 }
}

@media (max-width: 500px) {

 #product-info > .row:nth-of-type(3) {
  margin-top: 40px !important;
  padding-top: 40px;
 }

 #product-info > .row:nth-of-type(3) > .col-12 > #related_products #related-product .product-box,
 #product-info > .row:nth-of-type(3) > .col-12 > #related_products #related-product .product-box .card {
  width: 250px !important;
 }
}

/* #printPreview #controls #resetImage::after {
 content: "";
 background-image: url('https://hgropsqsdx.s3.us-west-1.amazonaws.com/midlandon/images/common/upload.png');
 background-size: contain;
 background-repeat: no-repeat;
 background-position: center;
 left: 50%;
 position: absolute;
 top: 50%;
 transform: translate(-50%, -50%);
 z-index: 10;
} */

/* Full Frame Styles */
/* .document_print_main.full-frame #printPreview {
 height: calc(100% - 182px) !important;
}

.document_print_main.full-frame #printPreview #controls {
 flex-direction: column !important;
 gap: 0.5rem !important;
}

.document_print_main.full-frame #printPreview #controls > div:first-of-type {
 flex-direction: column !important;
}

.document_print_main.full-frame #printPreview #controls > div:first-of-type > #page-info {
 margin-bottom: 12px !important;
 text-align: center !important;
 width: 100%;
}

.document_print_main.full-frame #printPreview #controls > div {
 background-color: transparent !important;
 margin: 0 !important;
 width: auto !important;
}

.document_print_main.full-frame #printPreview #controls > div:first-of-type > div {
 margin-top: 0 !important;
}

.document_print_main.full-frame .document_print_option {
 overflow-y: auto !important;
}

.document_print_main.full-frame .document_print_option > div {
 padding: 20px 32px 24px !important;
}

.document_print_main.full-frame .document_print_studio {
 background-color: #e5e5e5 !important
}

.document_print_main.full-frame .documentPrintPreview {
 padding-bottom: 0 !important;
}

.document_print_main.full-frame #canvasPreview {
 margin-top: 0 !important;
} */

@media (max-width: 960px) {

 #product-info {
  margin: 56px auto !important;
  max-width: 768px;
 }

 #product-info > .row:first-of-type > .col-12 {
  flex: unset !important;
  width: 100% !important;
 }

 #product-info > .row:nth-of-type(2) {
  flex-direction: column !important;
  margin-bottom: 0 !important;
 }

 #product-info > .row:nth-of-type(2) > .col-12 {
  flex: unset !important;
  margin-top: 40px !important;
  width: 100% !important;
 }

 #product-info > .row:nth-of-type(2) > .col-12.col-md-5 {
  flex: unset !important;
  margin-top: 0 !important;
  padding: 0 10px !important;
  width: 100% !important;
 }

 #product-info > .row:first-of-type > .col-12.col-md-5 {
  margin-top: 6px;
  padding: 0 10px !important;
 }

 #product-info > .row:nth-of-type(2) {
  margin-top: 16px;
 }

 #frmadditionalinfo,
 #frmadditionalinfo > .row {
  margin-top: 0 !important;
  width: 100% !important;
 }

 #frmadditionalinfo > .row > div {
  width: 50% !important;
 }

 #product-info #InfoTab {
  transform: translateY(0);
 }
}

@media (max-width: 767px) {

 #product-info {
  padding: 0 16px !important;
 }

 #product-info > .row:first-of-type > .col-12.col-md-5 {
  padding: 0 !important;
 }
}

@media (max-width: 574px) {

 #product-info {
  margin: 40px auto 72px !important;
 }

 #productpricetotal {
  box-shadow: none !important;
  min-height: 0 !important;
  position: static !important;
 }
}

@media (max-width: 479px) {

 #product-info > .row:nth-of-type(2) > .col-12:first-of-type {
  display: none !important;
 }

 #product-info > .row:nth-of-type(2) > .col-12.col-md-5 {
  flex: unset !important;
  width: 100% !important;
 }

 #frmadditionalinfo > .row > div {
  width: 100% !important;
 }

 #div_addinfo_save_box {
  margin-top: 16px !important;
 }

 #instructions_comments_user {
  margin: 0 auto !important;
 }

 #SubmitBtn {
  margin: 0 !important;
  width: 100% !important;
 }
}

@media (max-width: 400px) {

 .uppy-Dashboard-inner {
  aspect-ratio: unset !important;
 }

 .uppy-custom-ui-container {
  padding: 16px !important;
 }

 .uppy-custom-ui-container .fa-cloud-upload {
  font-size: 2.15rem !important;
  margin-bottom: 12px !important;
 }

 .uploader-title .uploader-title {
  font-size: 20px !important;
 }

 .uppy-custom-ui-container span.d-block.mb-2 {
  font-size: 14px !important;
  margin-bottom: 12px !important;
 }

 .uploader-text .uploader-text {
  font-size: 14px !important;
 }
}

.single-product-page #InfoTab .nav-tabs > li:first-of-type,
.single-product-page #InfoTab #image-gallery {
 display: none;
}

.single-product-page #InfoTab #product-description {
 display: block !important;
 opacity: 1 !important;
}

/* Spine Sizer Links */
.spine-links {
 display: flex;
 gap: 16px;
}

.spine-links a {
 background-color: transparent;
 border: 1px solid var(--color-orange);
 border-radius: 20px;
 color: var(--color-orange);
 font-size: 80%;
 padding: 8px 16px;
}

/* Cart Address Validation Modal */
.cart-page .fancybox__carousel .fancybox__viewport .fancybox__slide:not(.has-image) .fancybox__content {
 max-width: calc(750px + 48px) !important;
 min-height: 50% !important;
 width: 90% !important;
}

@media only screen and (max-width: 799px) {

    .cart-page .fancybox__carousel .fancybox__viewport .fancybox__slide:not(.has-image) .fancybox__content {
  max-width: calc(750px + 48px) !important;
  min-height: 0 !important;
  width: 90% !important;
    }
}

#user_address {
 display: flex;
 flex-wrap: wrap;
 justify-content: space-between;
 max-width: 1140px;
}

#user_address .page-header {
 width: 100% !important;
}

#user_address .page-header .addNewAdd {
 display: inline-flex !important;
 margin-top: 0 !important;
 text-align: right !important;
 width: auto !important;
}

#user_address .page-header .addNewAdd a {
 background-color: none !important;
 background-image: linear-gradient(to right, rgb(205, 64, 29), rgb(253, 155, 5)) !important;
 border: none !important;
 border-radius: 6px;
 box-shadow: 0 42px 12px 0 rgba(0, 0, 0, 0.00),
  0 27px 11px 0 rgba(0, 0, 0, 0.01),
  0 15px 9px 0 rgba(0, 0, 0, 0.05),
  0 7px 7px 0 rgba(0, 0, 0, 0.09),
  0 2px 4px 0 rgba(0, 0, 0, 0.10);
 color: var(--color-white);
 min-width: 150px;
 opacity: 1;
 padding: 10px 20px;
 transition: all 400ms ease-in-out;
}

#user_address .page-header .addNewAdd a:hover,
#user_address .page-header .addNewAdd a:focus,
#user_address .page-header .addNewAdd a:active,
#user_address .page-header .addNewAdd a:hover,
#user_address .page-header .addNewAdd a:focus,
#user_address .page-header .addNewAdd a:active {
 background-color: none !important;
 background-image: linear-gradient(to right, rgb(205, 64, 29), rgb(253, 155, 5));
 box-shadow: none;
 color: var(--color-white);
 opacity: 1;
}

#user_address .page-sub-header h3 {
 font-size: 23px !important;
}

#user_address > .row {
 display: flex;
 flex-direction: column;
 width: 48%;
}

#user_address > .row > .col-12 {
 flex: unset;
 max-width: none;
 width: 100%;
}

#user_address > .row > .col-12 > .row {
 display: flex;
 flex-direction: column;
}

#user_address > .row > .col-12 > .row:first-of-type p {
 font-size: 14px !important;
 margin-bottom: 0 !important;
}

#user_address > .row > .col-12 > .row > .col-12:nth-of-type(2) {
 max-width: none;
 flex: unset;
}

#user_address > .row > .col-12:nth-of-type(1) > .row > .col-12:nth-of-type(1) p {
 font-size: 14px !important;
}

#user_address > .row > .col-12 > .row > .col-12:nth-of-type(2) .current_addres {
 margin-top: 20px !important;
 float: left !important;
}

#user_address > .row > .col-12 > .row > .col-12:nth-of-type(2) .current_addres button {
 box-shadow: none !important;
 height: 44px !important;
}

#user_address > form {
 height: auto !important;
 width: 48%;
}

#user_address .page-sub-header {
 padding-bottom: 8px !important;
 margin-bottom: 16px !important;
}

#user_address .page-sub-header h3 {
 color: var(--color-blue);
}

.address_validation_popup > .row > .col-12 > .card-aligned > div {
 flex: unset !important;
 max-width: none !important;
 padding: 0 !important;
 width: 100% !important;
}
.address_validation_popup > .row > .col-12 > .card-aligned > div .card {
 border: none !important;
 margin-bottom: 0 !important;
}

.address_validation_popup > .row > .col-12 > .card-aligned > div .card-body {
 padding: 0 !important;
}

.address_validation_popup > .row > .col-12 > .card-aligned > div .card-text p {
 font-size: 14px !important;
 margin-bottom: 0 !important;
}

.address_validation_popup > .row > .col-12 > .card-aligned > div .card-footer {
 margin-top: 15px !important;
 padding: 0 !important;
 text-align: left !important;
}

.address_validation_popup > .row > .col-12 > .card-aligned > div .card-footer > button {
 box-shadow: none !important;
 height: 44px !important;
 margin-bottom: 0 !important;
}

#user_address {
 margin-bottom: 64px !important;
}

#user_address .page-header {
 align-items: center !important;
 display: flex !important;
 flex-direction: row !important;
 flex-wrap: nowrap !important;
 justify-content: space-between !important;
}

#user_address > .row {
 display: flex !important;
 flex-direction: row !important;
 padding: 0 16px !important;
 width: 100% !important;
}

#user_address_list {
 display: block !important;
 width: 48% !important;
}

#user_address_list > form > .row.card-aligned.narrow-gutter > .col-12 {
 padding-left: 0 !important;
}

@media (max-width: 1199px) {
 #user_address .page-header {
  margin-bottom: 24px !important;
  margin-left: 16px !important;
  margin-right: 16px !important;
  width: calc(100% - 32px) !important;
 }

 #user_address > .row {
  padding: 0 16px !important;
 }

 .addresses-page .myAccountSidebar {
  display: block !important;
        margin: 24px !important;
        max-width: 1140px !important;
        padding: 0 32px 12px !important;
 }
}

@media (max-width: 767px) {
 .addresses-page .myAccountSidebar {
        display: block !important;
        margin: 0 auto !important;
        max-width: 960px;
  padding: 0 16px 12px !important;
 }

 .addresses-page .myAccountSidebar > div:nth-of-type(2) {
  margin-bottom: 0 !important;
 }

 #user_address > .row {
  padding: 0 16px !important;
 }
}

@media (max-width: 415px) {

 #user_address .page-header {
  flex-direction: column !important;
 }

 #user_address .page-header h1 {
  margin-bottom: 0 !important;
 }

 #user_address .page-header .addNewAdd,
 #user_address .page-header .addNewAdd a {
  width: 100% !important;
 }

 #user_address .page-header .addNewAdd {
  margin-bottom: 16px !important;
 }
}

#user_address_frm {
 width: 48% !important;
}

#user_address_list > form > .row:nth-of-type(1) {
 margin-bottom: 12px !important;
 width: 100% !important;
}

#user_address_list > form > .row:nth-of-type(1) > .col {
 padding: 0 !important;
}

#user_address_list #searchdata {
 width: calc(100% - 50px) !important;
}

#user_address_list .card {
 cursor: default !important;
}

#user_address_list .card .card-footer {
 display: none !important;
}

#user_address_list > form > .row:nth-of-type(1) > .col > .form-inline .order-2 {
 margin: 0 !important;
 width: 100% !important;
}

#user_address_list > form > .row:nth-of-type(1) > .col button[type="submit"] {
 border-top-right-radius: 6px !important;
 border-bottom-right-radius: 6px !important;
 height: 41px !important;
 min-width: 0 !important;
 width: 50px !important;
}

#user_address_list small.alert {
 background-color: transparent !important;
 border: 1px solid var(--color-orange);
 color: var(--color-orange) !important;
}

#addressform > .text-danger {
 display: none !important;
}

.frmprofileinfo {
 transform: translateY(-12px) !important;
}

.frmprofileinfo > .row > .col-12:nth-of-type(13) .custom-control > .custom-control-label::before {
 background-color: var(--color-blue);

}

.frmprofileinfo #default_address {
 appearance: none;
 position: relative;
 width: 1rem;
 height: 1rem;
 border: 1px solid;
 line-height: 1;
 background: var(--color-blue);
}
 
.frmprofileinfo #default_address::before {
 content: " ";
 height: 100%;
 left: 0;
 position: absolute;
 text-align: center;
 top: 0;
 white-space: pre;
 width: 100%;
}
 
.frmprofileinfo #default_address:checked::before {
 content: "\2713";
}

.frmprofileinfo > .row .col-12:nth-of-type(13) .custom-control {
 padding-left: 3px !important;
}

.frmprofileinfo > .row .col-12:nth-of-type(13) .custom-control > label {
 white-space: nowrap !important;
}

#user_address > .row > .col-12:nth-of-type(1) > .row > .col-12:nth-of-type(1) > p {
 margin-bottom: 0 !important;
}

.bootbox .modal-footer .bootbox-cancel {
 background-color: none !important;
 background-image: linear-gradient(to right, rgb(15, 44, 83), rgb(19, 67, 117)) !important;
 border: none !important;
 border-radius: 6px;
 box-shadow: 0 42px 12px 0 rgba(0, 0, 0, 0.00),
  0 27px 11px 0 rgba(0, 0, 0, 0.01),
  0 15px 9px 0 rgba(0, 0, 0, 0.05),
  0 7px 7px 0 rgba(0, 0, 0, 0.09),
  0 2px 4px 0 rgba(0, 0, 0, 0.10);
 color: var(--color-white);
 min-width: 150px;
 padding: 10px 20px;
 transition: all 400ms ease-in-out;
}

.bootbox .modal-footer .bootbox-cancel:hover,
.bootbox .modal-footer .bootbox-cancel:focus,
.bootbox .modal-footer .bootbox-cancel:active {
 background-color: none !important;
 background-image: linear-gradient(to right, rgb(15, 44, 83), rgb(19, 67, 117)) !important;
 border: none !important;
 box-shadow: none;
}

/* Validation */
#middle-content.col-12 #user_address > .row {
 width: 48% !important;
}

#middle-content.col-12 #user_address > .row > .col-12:nth-of-type(1) {
 width: 100% !important;
}

#middle-content.col-12 #user_address > form {
 width: 48% !important;
}

#middle-content.col-12 #user_address > .row > .col-12 {
 width: 48% !important;
}

@media (max-width: 800px) {

 #user_address_list {
  width: 100% !important;
 }

 .frmprofileinfo {
  padding-left: 15px !important;
  padding-right: 15px !important;
  transform: translateY(0px) !important;
  width: 100% !important;
 }

 
 #user_address_frm {
  width: 100% !important;
 }
}


@media (max-width: 700px) {

 .cart-page .fancybox__carousel .fancybox__viewport .fancybox__slide:not(.has-image) .fancybox__content {
  overflow: auto !important;
  padding: 16px !important;
  max-width: 400px !important;
 }

 #user_address {
  flex-direction: column !important;
 }

 #user_address > .row {
  margin-bottom: 24px !important;
  width: 100%;
 }

 #user_address .address_validation_popup {
  width: 100%;
 }
}

/* Cart Page */
.cart-page #main-content {
 background-color: #fcfcfc !important;
}

.cart-page .offcanvas {
 display: none !important;
}

.cart-page #main-content > .container.body-container {
 background-color: #fcfcfc !important;
 margin: 0 auto !important;
 max-width: 1140px !important;
 padding: 0 24px 72px !important;
 width: 100% !important;
}

#Frmship > .row > .col-12:nth-of-type(10) #phone_number {
 padding-left: 35px !important;
}

#bill_address .addedit_btns {
 bottom: -30px !important;
}

#Frmaddclient > .row:nth-of-type(1) > .form-group:nth-of-type(3) #phone {
 padding-left: 35px !important;
}

@media (max-width: 767px) {
 .cart-page #main-content > .container.body-container {
  margin: 0 auto !important;
  max-width: none !important;
  padding: 0 16px 72px !important;
 }
}

.cart_btn {
 margin-top: 24px !important;
}

.cart_btn .btn-info {
 background-color: none !important;
 background-image: linear-gradient(to right, rgb(205, 64, 29), rgb(253, 155, 5)) !important;
 border: none !important;
 border-radius: 6px;
 box-shadow: 0 42px 12px 0 rgba(0, 0, 0, 0.00),
  0 27px 11px 0 rgba(0, 0, 0, 0.01),
  0 15px 9px 0 rgba(0, 0, 0, 0.05),
  0 7px 7px 0 rgba(0, 0, 0, 0.09),
  0 2px 4px 0 rgba(0, 0, 0, 0.10);
 color: var(--color-white);
 min-width: 150px;
 padding-top: 10px;
 padding-bottom: 10px;
 transition: all 400ms ease-in-out;
}

.cart_btn .btn-info:hover,
.cart_btn .btn-info:focus,
.cart_btn .btn-info:active {
 background-color: none !important;
 background-image: linear-gradient(to right, rgb(205, 64, 29), rgb(253, 155, 5));
 box-shadow: none;
}

#collapseProductDetails .card-body {
 padding: 24px !important;
}

#expressCheckoutAccordion .card .card-header h3 button {
 padding: 20px !important;
}

#expressCheckoutAccordion .card,
.checkoutRightSide  > .shadow {
 border-radius: 12px;
 box-shadow: 0 42px 12px 0 rgba(0, 0, 0, 0.00),
  0 27px 11px 0 rgba(0, 0, 0, 0.01),
  0 15px 9px 0 rgba(0, 0, 0, 0.05),
  0 7px 7px 0 rgba(0, 0, 0, 0.09),
  0 2px 4px 0 rgba(0, 0, 0, 0.10) !important;
}

#shopping-cart {
 display: flex;
 flex-wrap: wrap;
 margin: 0 auto;
 max-width: 1140px !important;
 padding: 0 24px;
}

#shippingadd {
 width: 100%;
}

#productDetails > h2 > button,
.checkoutRightSide > div > h3 {
 padding: 20px !important;
}

#productDetails > h2 > button {
 padding-left: 20px !important;
 padding-right: 20px !important;
}

.checkoutRightSide > div > h3 {
 font-size: 23px !important;
 line-height: 1.25 !important;
 margin: 0 !important;
 padding: 20px !important;
}

#productDetails > h2 > button,
#cartDetails h3 > button > span,
.checkoutRightSide > div > h3 > small {
 color: var(--color-blue);
 line-height: 1.25;
 font-size: 23px;
}

.prod_category a {
 color: var(--color-blue);
 font-size: 23px;
 transition: color 400ms ease-in-out;
}

.prod_category a:hover {
 color: var(--color-orange);
}

.additionaloptions .cart-additional-info,
.order-details > .row > .col-md-9.d-flex > .row:nth-of-type(2) > .short-disc,
.order-details > .row > .col-md-9.d-flex .narrow-gutter > .col.col-md-6 {
 padding: 0 !important;
}

.order-details > .row > div {
 padding: 0 12px !important;
}

.order-details > .row > .col-md-9.d-flex > .row:nth-of-type(1) {
 display: flex !important;
 flex-wrap: nowrap !important;
 align-items: center !important;
 margin-bottom: 8px !important;
}

.order-details .quantity {
 margin-bottom: 0 !important;
 transform: translateY(5px) !important;
}

.order-details .quantity strong {
 color: var(--color-blue);
}

.order-details .quantity small {
 color: var(--color-blue-400) !important;
}

.order-details .text-muted {
 color: var(--color-blue-600) !important;
 font-family: var(--font-family-heading) !important;
 margin-right: 4px !important;
}

.order-details .orig_card_name_div > span,
.order-details .cart-additional-info > ul > li {
 color: var(--color-blue) !important;
}

.order-details .no_preview_text.text-center.col-md-3 {
 padding-left: 0 !important;
}

#cart_pricetotal .totalprice {
 color: var(--color-blue) !important;
}

/* .order-details > .row > .col-md-9.d-flex > .row:nth-of-type(2) .list-unstyled li:nth-of-type(1) {
 display: none !important;
} */

.additionaloptions > .col > ul.list-unstyled li:nth-of-type(1) {
 display: none !important;
}

.order-details > .row > .col-md-9.d-flex > .row:nth-of-type(6) > .col-12 {
 padding: 0 !important;
}

.order-details > .row > .col-md-9.d-flex > .row:nth-of-type(6) > .col-12 > div {
 margin-top: 0 !important;
}

.order-details > .row > .col-md-9.d-flex > .row:nth-of-type(6) > .col-12 > div.border-top {
 border-color: var(--color-gray-400) !important;
}

.order-details > .row > .col-md-9.d-flex > .row:nth-of-type(6) > .col-12 > div.border-top > a > i {
 color: var(--color-orange);
}

#expressCheckoutAccordion .card {
 border-radius: 12px !important;
 margin-bottom: 32px !important;
}

#expressCheckoutAccordion .card-header {
 border-color: var(--color-gray-400) !important;
 border-top-left-radius: 12px !important;
 border-top-right-radius: 12px !important;
 padding: 0 !important;
}


.order-details .orderbtn a {
 color: var(--color-orange) !important;
 transition: color 400ms ease-in-out;
}

.order-details .orderbtn a:hover {
 color: var(--color-blue) !important;
}

.order-details .col-md-7.align-self-center:has(.error-msg) {
 flex: unset !important;
 margin-bottom: 16px;
 max-width: none !important;
 padding: 0;
 width: 100%;
}

.order-details .col-md-7.align-self-center .error-msg {
 width: 100%;
}

/* Right Sidebar */
.checkoutRightSide > div > h3 > small {
 color: var(--color-blue);
 font-size: 23px;
}

#couponcodeprice {
 border: 1px solid var(--color-gray-400) !important;
 margin-bottom: 12px !important;
}

#cart_pricetotal {
 padding-left: 1.25rem !important;
 padding-right: 1.25rem !important;
}

#cart_pricetotal > div > p > small {
 color: var(--color-blue-600) !important;
 font-family: var(--font-family-heading) !important;
 font-size: 14px !important;
}

#cart_pricetotal > div > p > small > span {
 color: var(--color-blue) !important;
 display: inline-block;
 font-family: var(--font-family-body) !important;
 font-size: 14px !important;
 margin-left: 6px !important;
}

.paymentDetailsStep > .coupon {
 padding-left: 1.25rem !important;
 padding-right: 1.25rem !important;
}

.paymentDetailsStep .ordercontinue {
 padding-left: 1.25rem !important;
 padding-right: 1.25rem !important;
}

#cart_pricetotal .paymentDetailsStep > p:nth-of-type(3) > small #loadertax {
 display: none;
}

.shoppingCartStep .price.subtotal {
 font-size: 14px !important;
}

.ordercontinue button[type="submit"],
.ordercontinue .btn-success {
 background-color: none !important;
 background-image: linear-gradient(to right, rgb(205, 64, 29), rgb(253, 155, 5)) !important;
 border: none !important;
 border-radius: 6px;
 box-shadow: 0 42px 12px 0 rgba(0, 0, 0, 0.00),
  0 27px 11px 0 rgba(0, 0, 0, 0.01),
  0 15px 9px 0 rgba(0, 0, 0, 0.05),
  0 7px 7px 0 rgba(0, 0, 0, 0.09),
  0 2px 4px 0 rgba(0, 0, 0, 0.10);
 color: var(--color-white);
 font-size: 18px !important;
 min-width: 150px;
 padding-top: 10px;
 padding-bottom: 10px;
 transition: all 400ms ease-in-out;
}

.ordercontinue button[type="submit"]:hover,
.ordercontinue button[type="submit"]:focus,
.ordercontinue button[type="submit"]:active {
 background-color: none !important;
 background-image: linear-gradient(to right, rgb(205, 64, 29), rgb(253, 155, 5)) !important;
 border: none !important;
 border-radius: 6px;
 box-shadow: none !important;
 color: var(--color-white);
 min-width: 150px;
 padding-top: 10px;
 padding-bottom: 10px;
 transition: all 400ms ease-in-out;
}

.shippingdetails .col-md-5 {
 padding-left: 0 !important;
}

.shippingdetails> .row > .col-md-7 {
 padding-right: 0 !important;
}

.shippingdetails> .row > .col-md-7 .page-sub-header {
 margin-bottom: 12px !important;
 padding-bottom: 12px !important;
}

.shipping-section-step > div > h4 {
 color: var(--color-blue) !important;
 font-size: 16px;
}

.shipping_title {
 color: var(--color-blue) !important;
 font-size: 16px;
 margin-right: 0 !important;
 padding-bottom: 0 !important;
 position: relative;
}

.shipping_title span {
 border-top: 1px solid var(--color-gray-400) !important;
 color: var(--color-navy);
 display: block;
 font-family: var(--font-family-body);
 font-size: 14px !important;
 line-height: 1.4 !important;
 margin-top: 0.5rem !important;
 padding-top: 0.5rem !important;
}

.shipping_title a {
 align-items: center;
 bottom: 0;
 display: inline-flex;
 height: 20px;
 justify-content: center;
 position: absolute;
 right: 2px;
 width: 20px;
}

.shipping_title a {
 background-image: linear-gradient(to right, rgb(205, 64, 29), rgb(253, 155, 5)) !important;
 background-clip: text;
 -webkit-background-clip: text;
 -webkit-text-fill-color: transparent;
}

#ship_address > p {
 font-size: 14px;
 line-height: 1.4;
}

.order-total {
 margin-top: 0 !important;
}

.order-total > .row > div {
 padding-left: 0 !important;
}

.order-total .page-sub-header.billing-address-section {
 border: none !important;
 margin-top: 12px;
}

.order-total .page-sub-header.billing-address-section h4 {
 border-bottom: 1px solid var(--color-gray-400) !important;
 color: var(--color-blue) !important;
 font-size: 16px;
 padding-bottom: 0.5rem !important;
 margin-bottom: 0.5rem !important;
 width: 100%;
}

.addedit_btns {
 bottom: 0;
 display: flex;
 gap: 12px;
 top: auto !important;
 left: 0;
 right: auto;
}

.addedit_btns a {
 
 color: var(--color-orange) !important;
 
}

#couponcodeprice {
 width: 100%;
}

.paymentDetailsStep > .coupon .input-group button {
 border-top-left-radius: 6px !important;
 border-bottom-left-radius: 6px !important;
} 

#payment > div > h4,
#special_instructions > div > h4 {
 color: var(--color-blue);
 font-size: 23px;
 line-height: 1.5;
}

#special_instructions > div > h4 {
 border-bottom: 1px solid var(--color-gray-400) !important;
 margin-bottom: 20px !important;
 padding-bottom: 12px !important;
}

#payment_option .card {
 box-shadow: none !important;
 margin-bottom: 16px !important;
}

#payment_option .card .card-body {
 display: none;
}

#order_comments > .col-12 {
 padding-left: 0 !important;
 padding-right: 0 !important;
}

#payment_insruction > .col-12 {
 font-size: 14px !important;
 padding: 0;
}

#payment_insruction > .col-12 > small {
 font-size: 14px !important;
 line-height: 1.2 !important;
}

#ship_address {
 padding-bottom: 12px !important;
}

.shipping-details .text-danger {
 font-size: 12px;
 margin-top: 4px;
}

.save_for_later {
 background-color: var(--color-white);
 border-radius: 12px;
 box-shadow: 0 42px 12px 0 rgba(0, 0, 0, 0.00),
  0 27px 11px 0 rgba(0, 0, 0, 0.01),
  0 15px 9px 0 rgba(0, 0, 0, 0.05),
  0 7px 7px 0 rgba(0, 0, 0, 0.09),
  0 2px 4px 0 rgba(0, 0, 0, 0.10);
 flex: 0 0 66.666667% !important;
 max-width: calc(66.666667% - 30px) !important;
 margin: 0 auto 0 15px !important;
}

.save_for_later > .page-sub-header {
 border-bottom: 1px solid var(--color-gray-400) !important;
 padding: 20px !important;
}

.save_for_later > .page-sub-header h3 {
 
 font-size: 23px;
 line-height: 1.5;
}

.save_for_later > .shadow {
 box-shadow: none !important;
}

.save_for_later > .shadow > .row > div {
 flex: unset !important;
 max-width: 100%;
 width: 100%;
}

.save-for-later-desc {
 margin-bottom: 12px !important;
}

.save-for-later-desc > p.text-truncate {
 color: var(--color-blue);
 font-family: var(--font-family-heading);
 font-size: 20px;
}

.save-for-later-desc > p.short-disc .text-muted {
 font-family: var(--font-family-heading) !important;
 font-size: 14px !important;
 color: var(--color-blue-600) !important;
}

.save-for-later-desc > p.short-disc .text-truncate {
 font-size: 14px !important;
 color: var(--color-blue) !important;
 padding-left: 4px !important;
}

.save-for-later-desc > p.short-disc > a {
 background-image: linear-gradient(to right, rgb(205, 64, 29), rgb(253, 155, 5)) !important;
 background-clip: text;
 -webkit-background-clip: text;
 -webkit-text-fill-color: transparent;
}

.save_for_later > .shadow > .row > div {
 padding: 0;
}

.save_for_later > .shadow > .row > div .order-img {
 padding-left: 0 !important;
 padding-right: 12px !important; 
}

.save_for_later > .shadow > .row > div .order-desc {
 padding-left: 12px !important;
 padding-right: 0 !important; 
}

.save_for_later > .shadow > .row > div > .row > .order-desc > div:nth-of-type(2) a:nth-of-type(1) {
 background-image: linear-gradient(to right, rgb(205, 64, 29), rgb(253, 155, 5)) !important;
 border: none !important;
 border-radius: 6px;
 box-shadow: 0 42px 12px 0 rgba(0, 0, 0, 0.00),
  0 27px 11px 0 rgba(0, 0, 0, 0.01),
  0 15px 9px 0 rgba(0, 0, 0, 0.05),
  0 7px 7px 0 rgba(0, 0, 0, 0.09),
  0 2px 4px 0 rgba(0, 0, 0, 0.10);
 color: var(--color-white);
 font-size: 18px !important;
 min-width: 150px;
 padding-top: 10px;
 padding-bottom: 10px;
 transition: all 400ms ease-in-out;
}

.save_for_later > .shadow > .row > div > .row > .order-desc > div:nth-of-type(2) a:nth-of-type(1):hover {
 background-image: linear-gradient(to right, rgb(205, 64, 29), rgb(253, 155, 5)) !important;
 border: none !important;
 border-radius: 6px;
 box-shadow: none;
 color: var(--color-white) !important;
}

.save_for_later .order-desc > div:nth-of-type(2) {
 align-items: center;
 display: flex;
}

.save_for_later .order-desc > div:nth-of-type(2) .btn-outline-danger {
 align-items: center;
 border: none !important;
 display: inline-flex;
 padding: 0;
 margin: 0 12px !important;
 max-width: none;
 min-width: 0;
}

.save_for_later .order-desc > div:nth-of-type(2) .btn-outline-danger:hover {
 background-color: transparent !important;
}

.save_for_later .order-desc > div:nth-of-type(2) .btn-outline-danger i {
 color: var(--color-orange) !important;
 font-size: 16px !important;
 transform: translateY(-2px);
 transition: 400ms ease-in-out;
}

.save_for_later .order-desc > div:nth-of-type(2) .btn-outline-danger:hover i {
 color: var(--color-blue) !important;
}

@media (max-width: 991px) {
 .checkoutRightSide {
  margin-top: 0 !important;
 }

 .save_for_later {
  flex: 0 0 100% !important;
  max-width: calc(100% - 30px) !important;
  margin-right: 0 !important;
  margin-top: 32px !important;
 }
}

@media (max-width: 960px) {

 #middle-content .main-content > .col-12 > .page-header {
  margin-top: 32px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  max-width: calc(100% - 32px) !important;
 }

 .checkoutRightSide {
  margin-top: 0 !important;
 }

 .save_for_later {
  margin-top: 32px !important;
 }
}

@media (max-width: 767px) {
 #shopping-cart,
 .checkoutLeftSide  {
  padding: 0 !important;
 }

 .main-content > .col-12 > .page-header {
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-bottom: 12px !important;
 }

 .order-details .no_preview_text.text-center.col-md-3 {
  padding-right: 0 !important;
 }

 .paymentDetailsStep  > .ordercontinue {
  position: static !important;
 }

 .orderprice {
  margin: 0 !important;
 }

 .checkoutRightSide {
  margin-top: 0 !important;
  padding: 0 !important;
 }

 .ordercontinue {
  border-bottom-left-radius: 12px !important;
  border-bottom-right-radius: 12px !important;
  box-shadow: none !important;
 }

 .save_for_later {
  flex: 0 0 100% !important;
  max-width: 100% !important;
  margin: 32px 0 0 !important;
 }

 .order-details > .row > .col-md-9.d-flex .narrow-gutter > .col.col-md-6 {
  flex-grow: 1 !important;
  width: auto !important;
 }

 
 .order-details > .row > .col-md-9.d-flex .narrow-gutter > .col.col-md-3 {
  align-self: flex-end !important;
  flex-grow: 0 !important;
  min-width: 80px !important;
  padding-right: 0 !important;
  width: auto !important;
 }

 #quantity_0 {
  text-align: right !important;
  width: 100px !important;
 }

 .order-details > .row > .col-md-9.d-flex > .row:nth-of-type(1) {
  justify-content: flex-start !important;
 }

 .order-details > .row > .col-md-9.d-flex > .row:nth-of-type(2) .col-auto.col-md {
  padding-right: 0 !important;
 }

 .shippingdetails  > .row > div:nth-of-type(2) {
  padding-left: 0 !important;
 }

 .shipping_title {
  width: 100% !important;
 }
}

.prod_category a small {
 display: none !important;
}

@media (max-width: 700px) {
 #shopping-cart,
 .checkoutLeftSide  {
  padding: 0 !important;
 }

 #middle-content .main-content > .col-12 {
  padding: 0 !important;
 }

 #middle-content .main-content > .col-12 > .page-header {
  align-items: center;
  display: flex;
  flex-direction: row !important;
  justify-content: space-between; 
  padding: 0 16px 12px;
  margin-left: auto !important;
  margin-right: auto !important;
  max-width: calc(100% - 32px);
  padding: 0 0 12px !important;
 }

 #middle-content .main-content > .col-12 > .page-header > h1 {
  display: inline-block;
  width: auto;
 }

 #middle-content {
  padding: 0 !important;
 }

 #middle-content .main-content > .col-12 > .page-header.d-flex > h1 {
  margin-bottom: 0 !important;
 }
}

@media (max-width: 500px) {

 .prod_category a {
  font-size: 20px !important;
 }

 .order-details .quantity {
  font-size: 16px !important;
  transform: translateY(7px) !important;
 }

 .order-details .text-muted.d-none {
  display: block !important;
  font-size: 12px !important;
 }

 .order-details .orig_card_name_div {
  font-size: 12px !important;
 }

 .cart-additional-info ul li,
 .cart-additional-info ul li .text-muted {
  font-size: 12px !important;
 }

 .orderprice {
  font-size: 16px !important;
 }
}

/* Orders */
#user_order .btn-group a i {
 background-image: linear-gradient(to right, rgb(205, 64, 29), rgb(253, 155, 5)) !important;
 background-clip: text;
 -webkit-background-clip: text;
 -webkit-text-fill-color: transparent;
}

#user_order .card:not(.bg-transparent) {
 border-radius: 8px !important;
 box-shadow: 0 42px 12px 0 rgba(0, 0, 0, 0.00),
  0 27px 11px 0 rgba(0, 0, 0, 0.01),
  0 15px 9px 0 rgba(0, 0, 0, 0.05),
  0 7px 7px 0 rgba(0, 0, 0, 0.09),
  0 2px 4px 0 rgba(0, 0, 0, 0.10);
 margin-bottom: 32px !important;
}

#user_order .card-header {
 background-image: linear-gradient(to right, var(--color-navy), var(--color-blue));
 border-top-left-radius: 8px !important;
 border-top-right-radius: 8px !important;
 color: var(--color-white);
 position: relative;
}

#user_order .card-header span {
 color: var(--color-white) !important;
}

#user_order .card-header > div span:nth-of-type(4) > span.d-md-block > span.text-primary {
 color: var(--color-orange) !important;
 font-family: var(--font-family-body) !important;
}

#user_order .card-header span.text-primary {
 font-family: var(--font-family-heading) !important;
}

#user_order .card-header .text-danger {
 color: var(--color-orange) !important;
}

#user_order .card-header a {
 background-color: none !important;
 background-image: linear-gradient(to right, rgb(205, 64, 29), rgb(253, 155, 5)) !important;
 border: none !important;
 border-radius: 6px;
 box-shadow: 0 42px 12px 0 rgba(0, 0, 0, 0.00),
  0 27px 11px 0 rgba(0, 0, 0, 0.01),
  0 15px 9px 0 rgba(0, 0, 0, 0.05),
  0 7px 7px 0 rgba(0, 0, 0, 0.09),
  0 2px 4px 0 rgba(0, 0, 0, 0.10);
 color: var(--color-white);
 min-width: 150px;
 opacity: 1;
 padding: 10px 20px;
 transition: all 400ms ease-in-out;
}

#user_order .card-header a:hover,
#user_order .card-header a:focus,
#user_order .card-header a:active,
#user_order .card-header a:hover,
#user_order .card-header a:focus,
#user_order .card-header a:active {
 background-color: none !important;
 background-image: linear-gradient(to right, rgb(205, 64, 29), rgb(253, 155, 5));
 box-shadow: none;
 opacity: 1;
}

#user_order .card-body .btn-sm.btn-link {
 color: var(--color-orange);
 transition: color 400ms ease-in-out;
}

#user_order .card-body .btn-sm.btn-link:hover {
 color: var(--color-blue);
}

#user_order .card .text-muted {
 color: var(--color-blue-600) !important;
 font-family: var(--font-family-heading) !important;
 margin-right: 4px !important;
}

@media (max-width: 825px) {
 #user_order .card-header > div {
  display: flex;
  flex-direction: column;
  width: 100%;
 }

 #user_order .card-header > div > span {
  align-items: center;
  display: flex !important;
  margin: 0;
  padding: 0;
  width: 100% !important;
 }

 #user_order .card-header > div > span > span {
  text-align: left !important;
  width: auto !important;
 } 

 #user_order .card-header > div > span::after {
  display: none;
 }

 #user_order .card-header span.text-primary {
  margin-right: 8px;
  text-align: left;
 }

 #user_order .card-header a {
  bottom: 0.5rem;
  position: absolute;
  right: 1rem;
 }
}

@media (max-width: 1199px) {
 .user-order-page .myAccountSidebar {
  display: block !important;
  margin: 24px !important;
  max-width: 1140px !important;
  padding: 0 32px 12px !important;
 }
}

@media (max-width: 768px) {

 .user-order-page .myAccountSidebar .shadow.card {
        margin-bottom: 24px !important;
  margin-top: 24px !important;
    }

 #user_order .card-header > div {
  display: flex;
  flex-direction: column;
  width: 100%;
 }

 #user_order .card-header > div > span {
  align-items: center;
  display: flex !important;
  margin: 0;
  padding: 0;
  width: 100% !important;
 }

 #user_order .card-header > div > span:nth-of-type(1) small {
  display: none !important;
 }

 #user_order .card-header > div > span:nth-of-type(2) {
  margin-bottom: 8px;
 }

 #user_order .card-header > div > span > span {
  font-size: 14px !important;
  text-align: left !important;
  width: auto !important;
 } 

 #user_order .card-header > div > span > small {
  display: inline-block;
  position: relative;
  width: auto !important;
 }

 #user_order .card-header > div > span > small > span.text-primary {
  display: none;
 }

 #user_order .card-header > div > span::after {
  display: none;
 }

 #user_order .card-header span.text-primary {
  display: inline-block;
  margin-right: 8px;
  text-align: left;
  width: auto !important;
 }

 #user_order .card-header span.text-primary > .d-md-none {
  display: none;
 }

 #user_order .card-header a {
  bottom: 0.5rem;
  position: absolute;
  right: 1rem;
 }
}

@media (max-width: 767px) {

 .user-order-page .myAccountSidebar {
  display: block !important;
  margin: 24px 0 !important;
  max-width: 1140px !important;
  padding: 0 32px 12px !important;
 }

 .user-order-page #middle-content .main-content > .col-12 > .page-header {
  margin-left: 16px !important;
  margin-right: 16px !important;
  padding-left: 24px !important;
  padding-right: 24px !important;
 }
}

@media (max-width: 500px) {

 .user-order-page #middle-content .main-content > .col-12 > .page-header {
  margin-left: 16px !important;
  margin-right: 16px !important;
  overflow: hidden !important;
  padding-left: 16px !important;
  padding-right: 16px !important;
  width: 100% !important;
 }

 .user-order-page #user_order {
  margin-left: 0 !important;
  margin-right: 0 !important;
 }

 .user-order-page #user_order .card-body .card-body .narrow-gutter {
  display: flex !important;
  flex-direction: column !important;
 }

 .user-order-page #user_order .card-body .card-body .narrow-gutter .col-8,
 .user-order-page #user_order .card-body .card-body .narrow-gutter .col-4 {
  flex: unset !important;
  max-width: none !important;
  margin-top: 16px !important;
  width: 100%;
 }

 .user-order-page #user_order .card-body .order-action-btn {
  align-items: center !important;
  display: flex !important;
  justify-content: space-between !important;
  margin-left: 0 !important;
  width: 100%;
 }
}

#user_order .card .product-link {
 color: var(--color-blue);
 font-size: 23px;
 transition: color 400ms ease-in-out;
}

#user_order .card .product-link:hover{
 color: var(--color-orange);
}

#user_order .card .list-unstyled li p.short-disc {
 display: flex;
 
}

#user_order .card .list-unstyled li p.short-disc .text-muted {
 display: inline-block;
 width: 50px;
}


#user_order .card .btn-outline-secondary {
 background-color: none !important;
 background-image: linear-gradient(to right, rgb(15, 44, 83), rgb(19, 67, 117)) !important;
 border: none !important;
 border-radius: 6px;
 box-shadow: 0 42px 12px 0 rgba(0, 0, 0, 0.00),
  0 27px 11px 0 rgba(0, 0, 0, 0.01),
  0 15px 9px 0 rgba(0, 0, 0, 0.05),
  0 7px 7px 0 rgba(0, 0, 0, 0.09),
  0 2px 4px 0 rgba(0, 0, 0, 0.10);
 color: var(--color-white);
 min-width: 150px;
 padding: 10px 20px;
 transition: all 400ms ease-in-out;
}

#user_order .card .btn-outline-secondary:hover,
#user_order .card .btn-outline-secondary:focus,
#user_order .card .btn-outline-secondary:active {
 background-color: none !important;
 background-image: linear-gradient(to right, rgb(15, 44, 83), rgb(19, 67, 117)) !important;
 border: none !important;
 color: var(--color-white) !important;
 box-shadow: none;
}

/* View Details - Order */
#user_order_info {
 margin: 0 24px;
 max-width: 1140px;
}

@media (max-width: 767px) {

 #user_order_info {
  margin: 0 16px;
  max-width: 100%;
 }
}

#user_order_info .h5 .text-danger {
 color: var(--color-orange) !important;
}

#user_order_info .text-muted {
 color: var(--color-blue-600) !important;
 font-family: var(--font-family-heading) !important;
 margin-right: 4px !important;
}

#user_order_info .alert {
 margin: 0 16px;
}

#user_order_info .btn-outline-secondary {
 background-color: none !important;
 background-image: linear-gradient(to right, rgb(15, 44, 83), rgb(19, 67, 117)) !important;
 border: none !important;
 border-radius: 6px;
 box-shadow: 0 42px 12px 0 rgba(0, 0, 0, 0.00),
  0 27px 11px 0 rgba(0, 0, 0, 0.01),
  0 15px 9px 0 rgba(0, 0, 0, 0.05),
  0 7px 7px 0 rgba(0, 0, 0, 0.09),
  0 2px 4px 0 rgba(0, 0, 0, 0.10);
 color: var(--color-white);
 min-width: 150px;
 padding: 10px 20px;
 transition: all 400ms ease-in-out;
}

#user_order_info .btn-outline-secondary i {
 color: var(--color-white) !important;
}

#user_order_info .btn-outline-secondary:hover,
#user_order_info .btn-secondary:focus,
#user_order_info .btn-secondary:active {
 background-color: none !important;
 background-image: linear-gradient(to right, rgb(15, 44, 83), rgb(19, 67, 117)) !important;
 border: none !important;
 box-shadow: none;
 color: var(--color-white) !important;
}

#user_order_info .btn-outline-secondary:hover i,
#user_order_info .btn-secondary:focus i,
#user_order_info .btn-secondary:active i {
 color: var(--color-white) !important;
}

#user_order_info .btn-outline-secondary .badge {
 background-color: transparent !important;
 color: var(--color-white) !important;
}

.order_box {
 margin-top: 32px;
}

@media (max-width: 767px) {
 .order_box {
  padding-left: 0 !important;
  padding-right: 0 !important;
 }
}


#price_detail {
 margin-bottom: 72px !important;
}

#myTab .nav-link {
 color: var(--color-blue);
}

#myTab .nav-link.active {
 color: var(--color-orange);
}

#myTab .nav-link.active::after {
 background-color: var(--color-orange);
}

#myTab .nav-link:hover {
 color: var(--color-orange);
}

#myTab .nav-link:hover::after {
 background-color: var(--color-orange);
}

#order-billing-details {
 margin-bottom: 48px !important;
}

#order-billing-details > div:nth-of-type(1),
#order-billing-details > div:nth-of-type(2) {
 flex: unset !important;
 margin-bottom: 0 !important;
 max-width: none;
 width: 30%;
}

#order-billing-details > div:nth-of-type(3) {
 flex: unset !important;
 max-width: none;
 width: 40%;
}

@media (max-width: 800px) {
 
 #order-billing-details > div:nth-of-type(1),
 #order-billing-details > div:nth-of-type(2) {
  width: 50%;
 }

 #order-billing-details > div:nth-of-type(1) {
  padding-left: 0 !important;
 }

 #order-billing-details > div:nth-of-type(2) {
  padding-right: 0 !important;
 }

 #order-billing-details > div:nth-of-type(3) {
  margin-bottom: 32px !important;
  padding: 0 !important;
  width: 100%;
 }
}

@media (max-width: 600px) {
 
 #order-billing-details > div:nth-of-type(1),
 #order-billing-details > div:nth-of-type(2) {
  padding: 0;
  margin-bottom: 16px !important;
  width: 100%;
 }

 #order-billing-details > div:nth-of-type(3) {
  margin-top: 0 !important;
 }
}

#order-billing-details h4.card-title {
 font-size: 20px;
}

#order_history > .row > div {
 flex: unset !important;
 margin-bottom: 16px !important;
 max-width: none !important;
 padding: 0 !important;
 width: 100%;
}

#order_history #comment_type {
 width: 100%;
}

#user_order table .list-unstyled li {
 color: var(--color-navy);
}

#order_history .card-body {
 display: none !important;
}

#order_history .card-header {
 border-bottom: none !important;
 padding-bottom: 0 !important;
}

#order_history .card-header .card-title {
 align-items: center;
 display: inline-flex;
}

/* #order_history .card .text-danger {
 color: var(--color-orange) !important;
 display: inline-block;
 margin-left: 2px !important;
} */

#add_comment {
 display: none !important;
}

/* #add_comment .card {
 border-radius: 8px !important;
 box-shadow: 0 42px 12px 0 rgba(0, 0, 0, 0.00),
  0 27px 11px 0 rgba(0, 0, 0, 0.01),
  0 15px 9px 0 rgba(0, 0, 0, 0.05),
  0 7px 7px 0 rgba(0, 0, 0, 0.09),
  0 2px 4px 0 rgba(0, 0, 0, 0.10);
}

#add_comment .card-header {
 background-image: linear-gradient(to right, var(--color-navy), var(--color-blue));
 border: none !important;
 border-top-left-radius: 8px !important;
 border-top-right-radius: 8px !important;
 color: var(--color-white);
}

#add_comment .card-header h5{
 color: var(--color-white);
} */

#history {
 margin-bottom: 112px;
}

/* Cart Detail */
#cart_detail {
 border-radius: 8px !important;
 box-shadow: 0 42px 12px 0 rgba(0, 0, 0, 0.00),
  0 27px 11px 0 rgba(0, 0, 0, 0.01),
  0 15px 9px 0 rgba(0, 0, 0, 0.05),
  0 7px 7px 0 rgba(0, 0, 0, 0.09),
  0 2px 4px 0 rgba(0, 0, 0, 0.10);
 overflow: hidden !important;
}

#cart_detail thead {
 background-image: linear-gradient(to right, var(--color-navy), var(--color-blue)) !important;
    color: var(--color-white) !important;
 font-family: var(--font-family-body) !important;
}

#cart_detail thead tr th {
    color: var(--color-white) !important;
 font-family: var(--font-family-body) !important;
 font-weight: normal !important;
 padding: 10px 16px !important;
}

#cart_detail tbody tr td {
 color: var(--color-navy) !important;
 padding: 10px 8px !important;
}

#cart_detail .page-section-header {
 padding-left: 8px !important;
}

#cart_detail .page-section-header a {
 color: var(--color-blue) !important;
 transition: color 400ms ease-in-out;
}

#cart_detail .page-section-header a:hover {
 color: var(--color-orange) !important;
}

#cart_detail table table > tbody > tr:nth-of-type(2) > td {
 padding-top: 0 !important;
}

#cart_detail tbody tr td:nth-of-type(2) {
 padding-top: 0 !important;
}

#cart_detail tbody .list-unstyled li {
 color: var(--color-navy) !important;
}

#cart_detail tbody .list-unstyled li:nth-of-type(3) {
 display: none !important;
}

/* Price Detail */
#price_detail {
 border-top: none !important;
 margin-top: 32px !important;
}

#price_detail .list-unstyled li {
 padding-bottom: 0 !important;
 margin-bottom: 8px !important;
}

@media (max-width: 767px) {

 #order-billing-details {
  margin-bottom: 24px !important;
 }

 #order-billing-details > div:nth-of-type(3) {
  margin-top: 16px !important;
  margin-bottom: 0 !important;
 }

 #cart_detail > table {
  border-top: none !important;
 }

 #cart_detail .page-section-header {
  padding-left: 0 !important;
 }

 #price_detail > .row > .col-12:nth-of-type(2) {
  padding-left: 0 !important;
  padding-right: 0 !important;
 }
}

@media (max-width: 600px) {
 #order-billing-details > div:nth-of-type(3) {
  margin-top: 0 !important;
 }
}

/* Checkout Success */
.checkout-sucess-page #main-content > .container {
 margin: 0 auto !important;
 max-width: 1140px !important;
}

.checkout-sucess-page .page-header {
 margin-bottom: 32px !important;
}

.checkout-sucess-page .text-muted {
 color: var(--color-blue-600) !important;
 font-family: var(--font-family-heading) !important;
 margin-right: 4px !important;
}

#checkout_success {
 margin-bottom: 112px !important;
 position: relative;
}

#checkout_success > div:nth-of-type(4) .row h1,
#checkout_success > div:nth-of-type(4) .row p {
 display: none !important;
}

#checkout_success > div:nth-of-type(4) .row {
 justify-content: space-between !important;
 padding-left: 36px;
 padding-right: 36px;
}

#checkout_success > div:nth-of-type(4) .row .col-12 a.btn-secondary {
 margin-top: 12px;
}

#checkout_success > div:nth-of-type(4) .row li.mb-1 .text-primary {
 color: var(--color-navy) !important;
 font-family: var(--font-family-body) !important;
 font-weight: normal !important;
}

#checkout_success > div:nth-of-type(4) .row .col-12 {
 flex: unset !important;
 max-width: none !important;
 width: 48%;
}

#checkout_success .page-sub-header h3 {
 font-size: 20px !important;
 margin-bottom: 8px !important;
}

#order_payment_detail {
 margin-top: 0 !important;
}

.checkout-sucess-page #user_dashboard {
 margin-top: 16px !important;
}

.checkout-sucess-page #user_dashboard > .row.card-aligned {
 padding-left: 16px !important;
 padding-right: 16px !important;
 width: 100%;
}

.checkout-sucess-page #user_dashboard > .row.card-aligned > div.col-12 {
 flex: unset !important;
 max-width: none !important;
 width: 100%;
}

#checkout_success > div:nth-of-type(5) {
 bottom: 0;
 flex: unset !important;
 max-width: none !important;
 position: absolute;
 right: 50px !important;
 width: auto !important;
}

#checkout_success .btn-info {
 background-color: none !important;
 background-image: linear-gradient(to right, rgb(205, 64, 29), rgb(253, 155, 5)) !important;
 border: none !important;
 border-radius: 6px;
 box-shadow: 0 42px 12px 0 rgba(0, 0, 0, 0.00),
  0 27px 11px 0 rgba(0, 0, 0, 0.01),
  0 15px 9px 0 rgba(0, 0, 0, 0.05),
  0 7px 7px 0 rgba(0, 0, 0, 0.09),
  0 2px 4px 0 rgba(0, 0, 0, 0.10);
 color: var(--color-white);
 min-width: 150px;
 opacity: 1;
 padding: 10px 20px;
 transition: all 400ms ease-in-out;
}

#checkout_success .btn-info:hover,
#checkout_success .btn-info:focus,
#checkout_success .btn-info:active {
 background-color: none !important;
 background-image: linear-gradient(to right, rgb(205, 64, 29), rgb(253, 155, 5));
 box-shadow: none;
 opacity: 1;
}

@media (max-width: 1199px) {

 .checkout-sucess-page #user_dashboard {
  margin-left: 0 !important;
  margin-right: 0 !important;
 }
}

@media (max-width: 768px) {

 .checkout-sucess-page .page-header {
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin: 48px 12px 24px !important;
 }

 #checkout_success > div:nth-of-type(4) .row {
  padding-left: 0 !important;
  padding-right: 0 !important;
 }

 #checkout_success > div:nth-of-type(4) .row .col-12 {
  margin-bottom: 32px !important;
  width: 100%;
 }

 .checkout-sucess-page #user_dashboard {
  margin-top: 0 !important;
 }

 #checkout_success > div:nth-of-type(5) {
  bottom: 0;
  flex: unset !important;
  margin-top: 0 !important;
  max-width: none !important;
  padding-left: 32px !important;
  padding-right: 32px !important;
  position: static;
  right: auto !important;
  width: 100% !important;
 }

 #checkout_success > div:nth-of-type(5) .float-right {
  width: 100% !important;
 }

 #checkout_success > div:nth-of-type(5) .float-right .btn-info {
  width: 100% !important;
 }
}

/* My Account */
.my-account-page .main-header {
 margin-bottom: 24px !important;
}

.my-account-page #account_tabs {
 margin-top: 0 !important;
 padding: 0 16px !important;
}

.my-account-page #orders {
 margin-bottom: 32px !important;
}

.my-account-page #orders .table-responsive-sm > table {
 color: var(--color-navy) !important;
}

.my-account-page #orders .table-responsive-sm > table > thead.bg-light {
 background-color: transparent !important;
}

.my-account-page #orders .list-unstyled li {
 color: var(--color-navy) !important;
}

.my-account-page #orders .list-unstyled li .text-primary,
.my-account-page #orders .list-unstyled li .text-danger {
 color: var(--color-orange) !important;
}

.my-account-page #orders .text-muted {
 color: var(--color-navy) !important;
 font-family: var(--font-family-heading) !important;
 font-weight: normal !important;
}

.my-account-page #orders .btn-outline-secondary {
 background-color: none !important;
 background-image: linear-gradient(to right, rgb(15, 44, 83), rgb(19, 67, 117)) !important;
 border: none !important;
 border-radius: 6px;
 box-shadow: 0 42px 12px 0 rgba(0, 0, 0, 0.00),
  0 27px 11px 0 rgba(0, 0, 0, 0.01),
  0 15px 9px 0 rgba(0, 0, 0, 0.05),
  0 7px 7px 0 rgba(0, 0, 0, 0.09),
  0 2px 4px 0 rgba(0, 0, 0, 0.10);
 color: var(--color-white);
 min-width: 100px;
 opacity: 1;
 padding: 10px 20px;
 transition: all 400ms ease-in-out;
}


#user_address .page-header .addNewAdd a:hover,
#user_address .page-header .addNewAdd a:focus,
#user_address .page-header .addNewAdd a:active,
#user_address .page-header .addNewAdd a:hover,
#user_address .page-header .addNewAdd a:focus,
#user_address .page-header .addNewAdd a:active {
 background-color: none !important;
 background-image: linear-gradient(to right, rgb(15, 44, 83), rgb(19, 67, 117)) !important;
 box-shadow: none;
 color: var(--color-white);
 opacity: 1;
}


@media (max-width: 768px) {
 
 .my-account-page .main-header {
  margin-bottom: 24px !important;
 }
}

/* Password Page */
.password-page form {
 max-width: 1140px !important;
 padding: 0 36px !important;
}

.password-page #changepass > .row > .col-md-9 > .text-danger {
 display: none !important;
}

.password-page #changepass > .row > .col-md-9 > .row {
 margin-bottom: 16px !important;
}

@media (max-width: 1199px) {
 .password-page form {
  margin-left: auto !important;
  margin-right: auto !important;
  max-width: 1140px !important;
  padding: 0 16px !important;
 }
}

/* Main Login Page */

.main-login-page #main-content .container {
 margin: 0 auto !important;
 max-width: 1140px !important;
 padding-left: 24px !important;
 padding-right: 24px !important;
}

.main-login-page .page-header {
 display: none !important;
}

#user_loginpage {
 margin: 48px 0 96px !important;
}

#user_loginpage .page-sub-header {
 border-bottom: 1px solid var(--color-gray-400) !important;
 margin-bottom: 16px !important;
 padding-bottom: 8px !important;
}

#user_loginpage .form-group .input-group-require {
 display: none !important;
}

@media (max-width: 767px) {

 .main-login-page #main-content .container {
  padding-left: 16px !important;
  padding-right: 16px !important;
 }

 #user_loginpage {
  margin: 32px 0 96px !important;
 }
}

/* Checkout Success Page */
#checkout_success {
 margin: 40px 0 112px !important;
}

#checkout_success .page-header {
 display: none !important;
}

#order_success_msg {
 margin-bottom: 32px !important;
}

#checkout_success > div.col-12:nth-of-type(4),
#checkout_success > div.col-12:nth-of-type(4) > .row {
 padding-left: 0 !important;
 padding-right: 0 !important;
}