.hidden {
		display: none;
	}
	
	.ellipsis {
	    display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
		overflow: hidden;
		text-overflow: ellipsis;
	}

	.offer_box {
		border: 1px solid #d5d5d5;
		-webkit-transition: all 0.2s ease;
	}
	
	.offer_box:hover,
	.offer_box:focus {
		box-shadow: 0px 0px 10px 0px rgb(0 0 0 / 18%);
	}
	
	.fb_box {
		border: 1px solid #d5d5d5;
		-webkit-transition: all 0.2s ease;
	}
	
	.fb_box:hover,
	.fb_box:focus {
		box-shadow: 0px 0px 10px 0px rgb(0 0 0 / 18%);
	}
	
	.adoption_box {
		border: 1px solid #d5d5d5;
		-webkit-transition: all 0.2s ease;
	}
	
	.adoption_box:hover,
	.adoption_box:focus {
		box-shadow: 0px 0px 10px 0px rgb(0 0 0 / 18%);
	}
	
	
	.icon_img {
		max-height: 30px;
	}
    .landing_headline30 {
    color: #000000;
    font-family: 'Rokkitt', tahoma,verdana,Arial,sans-serif;
    font-size: 30px;
    }
    .landing_headline28 {
    color: #000000;
    font-family: 'Rokkitt', tahoma,verdana,Arial,sans-serif;
    font-size: 26px;
    }
    .landing_headline20 {
    color: #000000;
    font-family: 'Rokkitt', tahoma,verdana,Arial,sans-serif;
    font-size: 20px;	
    }
    .landing_headline16 {
    color: #000000;
    font-size: 14px;	
    font-weight: 500;
    }
    
    .landing_intro{
    font-family: Arial, tahoma, verdana, sans-serif;
    font-size: 14px;
    color: #666666;}
    
    .form_input {
        font-family: arial;
        width:90%;
        padding: 12px 20px;
        margin: 8px 8px;
        border-radius: 8px;
    }
    .submit_button {
        font-family: arial;
        padding: 12px 20px;
        margin: 8px 8px;
        border-radius: 8px;
        background: #404040;
        color: #ffffff;
        font-size: 20px;
        width: 200px;
    }
    .footer {
    	position: absolute;
 		bottom: 0;
 		width: 100%;
    }
	
	A.side-button {
		padding: 12px 20px;
		border-radius: 15px;
		color: #000000 !important;
		text-decoration: none;
    	font-family: 'Rokkitt', tahoma,verdana,Arial,sans-serif;
    	font-size: 22px;
	}
	A:hover,
	A:focus {
		background-color: #d3d3d3;
	}
	
	A.side-button-highlight {
		padding: 12px 20px;
		border-radius: 15px;
		text-decoration: none;
		color: #1F7D8E !important;
    	font-family: 'Rokkitt', tahoma,verdana,Arial,sans-serif;
    	font-size: 22px;
	}
	
	.menu {
      height: 100vh; 
      width: 0;
      position: absolute;
      z-index: 5; 
      left: 0;
      bottom: 0;
      top: 65px !important;
      background-color: #C7CCB8; 
      opacity: 0.95;
      overflow-x: hidden; 
      padding-top: 0px; 
      transition: 0.5s;
    }
    
    .sidemenubutton {
      height: 30px; /* 100% Full-height */
      width: 80px; /* 0 width - change this with JavaScript */
      position: absolute; /* Stay in place */
      z-index: 6; 
      left: -35px;
      background-color: #E1E1C9; 
      opacity: 0.95;
      overflow-x: hidden; /* Disable horizontal scroll */
      overflow-y: hidden;
      transition: 0.5s; /* 0.5 second transition effect to slide in the sidenav */
      color: #000000;
      font-family: 'Rokkitt', tahoma,verdana,Arial,sans-serif;
    }
    
    
    /* Position and style the close button (top right corner) */
    .sidemenu .closebtn {
      position: absolute;
      top: 0;
      right: 25px;
      font-size: 36px;
      margin-left: 50px;
    }
    
    .sidemenu .list-group-item:hover {
        color: #A9A9A9;
        cursor: pointer;
    }
    
    .location_heading {
    	font-family: 'Roboto';
    	color: #5A5758;
    }
    
    .program_menu {
		color: #FFF;
		background-color: #81B7DD;
		padding-top:10px; 
		padding-bottom:10px; 
		position: relative;
		cursor:pointer;
		min-height:250px;
		max-height:250px;
		border: 10px solid white; 
	}
    
    .program_menu_heading {
    	padding-top: 20px;
    	font-family: 'Open Sans';
    	color: #FFF;
    	font-size: 25px;
    }
    
    .headline30New {
    	font-family: 'Open Sans';
    	font-size: 30px;
    	color: #5A5758;
    }
    
    .sans-content {
    	font-family: 'Open Sans';
    	color: #5A5758;
    }
    
    .roboto-content {
    	font-family: 'Roboto';
    }
    
    .program_menu_subheading {
    	font-family: 'Roboto';
    	color: #FFF;
    	font-size: 15px;
    }
    
    .program_menu_button {
		background-color: #3f8fca;
		font-family: 'Roboto';
		font-weight: 700;
		font-size: 16px;
		margin: auto;
		position: absolute;
		left: 0;
		right: 0;
		bottom: 20px;
		max-width: 150px;
		color:#FFF;
	}
	
	.program_menu_highlight {
		background-color: #3f8fca;
		color: #FFF;
		padding-top:10px;
		padding-bottom:10px;
		border: 10px solid white; 
		position: relative;
		cursor:pointer;
		min-height:250px;
		max-height:250px;
	}
	
	.program_menu:hover,
	.program_menu:focus {
		background-color: #3f8fca;
	}

	.card_menu_text {
		font-family: 'Georgia';
		font-size: 16px;
	}

	
	 
	.program_menu_button:hover,
	.program_menu_button:focus {
		color: #FFF;
	}
	
	.mfg_heading {
		font-family: 'Roboto';
		font-weight: 700;
		font-size: 16px;
		color: #5A5758;
	}
	
	.offer_title {
		font-family: 'Roboto';
		font-weight: 600;
		font-size: 14px;
		color: #231F20;
	}
	
	.roboto_heading {
		font-family: 'Roboto';
		font-weight: 700;
		font-size: 26px;
		color: #5A5758;
	}
	
	.roboto_content {
		font-family: 'Roboto';
		font-weight: 400;
		color: #231F20;
	}
	
	.open_sans_heading {
		font-family: 'Open Sans';
		font-weight: 700;
		font-size: 26px;
		color: #706E6E;
	}
	
	.top-icon {
		font-size: 20px;
		color: #b1b7dd;
		padding-left:10px;
		background-color: #FFF;
	}
	
	.top-icon:hover,
	.top-icon:focus {
		color: #3f8fca;
		background-color:#FFF;
		cursor: pointer;
	}
	
	.login-button {
		color:#FFF;
		background-color: #b1b7dd;
	}
	
	.login-button:hover,
	.login-button:focus {
		color: #FFF;
		background-color: #3f8fca;
	}
	
	.logged_in_menu {
		color: #0e76bc;
		font-family: Roboto; 
		text-decoration: none;
	}
	
	.logged_in_menu:hover,
	.logged_in_menu:focus {
		color:  #0e76bc;
	}
	
	.rainbow_heading {
		font-family: 'Over the Rainbow';
		font-size: 24px;
	}
	.playfair_heading {
		font-family: 'Playfair Display';
		font-size: 14px;
		font-weight: 500;
	}
	
	.btn-primary {
		background-color: #B83D24;
		border-color: #A33620;
	}
	
	.btn-primary:hover,
	.btn-primary:focus {
		color:#fff;
		background-color:#8d2f1c;
		border-color:#38130b
	}
	
	.text-primary {
		background-color: #B83D24;
		border-color: #A33620;
	}
	
	.menu_icon {
		text-decoration: none;
	}
	
	.menu_icon:hover,
	.menu_icon:focus {
		text-decoration: none;
	}
	
    /* Style page content - use this if you want to push the page content to the right when you open the side navigation */
    #main {
      transition: margin-left .5s;
      padding: 20px;
    }
    
    /* On smaller screens, where height is less than 450px, change the style of the sidenav (less padding and a smaller font size) */
    @media screen and (max-height: 450px) {
      .menu {padding-top: 15px;}
      .sidenav a {font-size: 18px;}
    }   
    
    .adoption_button {
    	border: 2px solid rgb(184, 61, 36);
	    color: rgb(184, 61, 36);
	    min-height: 66px;
	    white-space: nowrap;
	    padding: 18px;
	    font-family: georgia, palatino, "book antiqua", "palatino linotype", serif;
	    font-style: italic;
	    background-color: #fff;
	    text-decoration: none;
	    transition: 0.4s ease 0s;
    }
    
    .adoption_button:hover,
    .adoption_button:focus {
    	background-color: rgb(184, 61, 36);
    	color: #fff;
    }
    
    .adoption_button_alt {
    	border: 2px solid;
    	min-height: 40px;
    	white-space: nowrap;
	    padding: 10px;
    	color: rgb(168, 156, 126);
    	border-color: rgb(168, 156, 126);
	    font-family: georgia, palatino, "book antiqua", "palatino linotype", serif;
	    font-style: italic;
	    background-color: #fff;
	    text-decoration: none;
	    transition: 0.4s ease 0s;
    }
    
    .adoption_button_alt:hover,
    .adoption_button_alt:focus {
    	background-color: rgb(168, 156, 126);;
    	color: #fff;
    }
    
    .appstore:hover {   
		  text-decoration: none;
		  color: white;
    	background: transparent;
    }

    .appstore {
      background:  transparent;
      color: transparent;
    }

    .add-pet-card {
      height: 375px; 
      margin-top:30px; 
      cursor:pointer; 
      box-shadow: 0px 0px 10px 0px rgb(0 0 0 / 18%);
    }

    .card-collected-star {
      position:absolute; 
      z-index:99; 
      right:20px; 
      top:40px; 
      color: var(--gold-600);
    }

    .notification-bell {
      background-color: var(--gold-600); 
      border-radius:25px; 
      max-width:100px; 
      min-width:100px;
      max-height:100px;
      min-height: 100px;
    }

    .notification-bell.mobile {
      background-color: var(--gold-600); 
      border-radius:5px; 
      max-width:50px; 
      min-width:50px;
      max-height:50px;
      min-height:50px;
    }

    .current-offers-title.mobile {
      font-size:20px;
    }

    .add-pet-card:hover {
      box-shadow: 0px 0px 10px 0px rgba(0, 255, 0, 0.8);
      border-color: rgba(0, 255, 0, 0.8);
      background-color: rgba(0, 255, 0, 0.1);
    }
    
    .retailer_heading {
		font-family: 'Roboto';
		font-weight: 700;
		font-size: 32px;
		color: #5A5758;
	}
	
	.view_rewards {
		font-family: "Staatliches";
		font-size: 28px;
		font-weight: bold;
		color: #C6C6C6;
	}
	
	.login_download {
		font-family: "Roboto";
		font-weight: bold;
		color: #b83d26;
	}
	
	.coming_soon {
		font-family: "Staatliches";
		font-size: 16px;
		font-weight: bold;
		color: #b83d26;
		letter-spacing: 3px;
	}

	.offer-ready {
		border-radius: 15px;
		padding-top:5px;
		padding-bottom:5px;
		padding-left: 10px;
		padding-right: 10px;
		margin-left:10px;
		cursor: help;
		font-size: 14px;
		font-weight: bold;
		color: rgb(15,110,86);
		background-color: rgb(225, 245, 238);
	}

	*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

    body {
      font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
      background: #f4f2ee;
      display: flex;
      align-items: center;
      justify-content: center;
      min-height: 100vh;
      padding: 24px;
    }

    .demo-card {
      background: #fff;
      border-radius: 14px;
      border: 0.5px solid rgba(0,0,0,0.1);
      padding: 28px;
      width: 100%;
      max-width: 520px;
    }

    /* ── Field label ── */
    .field-label {
      font-size: 11px;
      font-weight: 600;
      color: #6b7280;
      text-transform: uppercase;
      letter-spacing: 0.6px;
      margin-bottom: 10px;
      display: block;
    }

    /* ── Grid ── */
    .pet-type-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 8px;
    }

    /* ── Individual tile ── */
    .pet-type-btn {
      position: relative;
      border: 1px solid #e5e7eb;
      border-radius: 10px;
      padding: 12px 6px 10px;
      text-align: center;
      cursor: pointer;
      background: #fafafa;
      transition: border-color 0.15s, background 0.15s, transform 0.1s;
      user-select: none;
      -webkit-tap-highlight-color: transparent;
    }

    .pet-type-btn:hover {
      border-color: #52b788;
      background: #f0faf4;
    }

    .pet-type-btn:active {
      transform: scale(0.97);
    }

    /* Selected state */
    .pet-type-btn.selected {
      border: 1.5px solid #2d6a4f;
      background: #d8f3dc;
    }

    /* Check badge — hidden by default */
    .pet-type-btn .check {
      position: absolute;
      top: 6px;
      right: 6px;
      width: 16px;
      height: 16px;
      border-radius: 50%;
      background: #2d6a4f;
      display: flex;
      align-items: center;
      justify-content: center;
      opacity: 0;
      transform: scale(0.6);
      transition: opacity 0.15s, transform 0.15s;
    }

    .pet-type-btn.selected .check {
      opacity: 1;
      transform: scale(1);
    }

    .check svg {
      width: 9px;
      height: 9px;
      stroke: #fff;
      stroke-width: 2.5;
      fill: none;
      stroke-linecap: round;
      stroke-linejoin: round;
    }

    /* Icon */
    .pet-type-icon {
      font-size: 26px;
      line-height: 1;
      margin-bottom: 6px;
      display: block;
    }

    /* Label */
    .pet-type-label {
      font-size: 12px;
      color: #6b7280;
      line-height: 1;
    }

    .pet-type-btn.selected .pet-type-label {
      color: #1b4332;
      font-weight: 600;
    }

    /* "Other" icon — text-based fallback */
    .pet-type-other-icon {
      font-size: 18px;
      line-height: 1;
      margin-bottom: 6px;
      display: block;
      color: #9ca3af;
      padding-top: 4px;
    }

    /* ── Focus ring for keyboard nav ── */
    .pet-type-btn:focus-visible {
      outline: 2px solid #2d6a4f;
      outline-offset: 2px;
    }

    /* ── Hidden radio inputs for semantics ── */
    .pet-type-btn input[type="radio"] {
      position: absolute;
      opacity: 0;
      width: 0;
      height: 0;
    }

    /* ── Reduced motion ── */
    @media (prefers-reduced-motion: reduce) {
      .pet-type-btn, .pet-type-btn .check { transition: none; }
    }

    /* ── Responsive: 2-col on narrow viewports ── */
    @media (max-width: 380px) {
      .pet-type-grid { grid-template-columns: repeat(2, 1fr); }
    }


    .pet-picture {
        border-radius:50%;
        height:100px;
        width:100px;
        border:dotted 1px;
        background-color: '#D2D2D2';
    }


    /* ── Icon ── */
    .gender-icon {
      display: block;
      margin: 0 auto 7px;
      color: #9ca3af;
      transition: color 0.15s;
    }

    .gender-btn.selected .gender-icon {
      color: #2d6a4f;
    }

    .gender-btn:hover .gender-icon {
      color: #52b788;
    }

    /* ── Label ── */
    .gender-label {
      font-size: 12px;
      color: #6b7280;
      line-height: 1;
      display: block;
    }

    .gender-btn.selected .gender-label {
      color: #1b4332;
      font-weight: 600;
    }

    /* ── Hidden radio ── */
    .gender-btn input[type="radio"] {
      position: absolute;
      opacity: 0;
      width: 0;
      height: 0;
    }

    /* ── Keyboard focus ── */
    .gender-btn:focus-visible {
      outline: 2px solid #2d6a4f;
      outline-offset: 2px;
    }

    @media (prefers-reduced-motion: reduce) {
      .gender-btn, .gender-btn .check { transition: none; }
    }

    /* ── Grid ── */
    .gender-grid {
      display: grid;
      grid-template-columns: 1fr 1fr 1fr;
      gap: 8px;
    }

    /* ── Individual tile ── */
    .gender-btn {
      position: relative;
      border: 1px solid #e5e7eb;
      border-radius: 10px;
      padding: 14px 6px 12px;
      text-align: center;
      cursor: pointer;
      background: #fafafa;
      transition: border-color 0.15s, background 0.15s, transform 0.1s;
      user-select: none;
      -webkit-tap-highlight-color: transparent;
    }

    .gender-btn:hover {
      border-color: #52b788;
      background: #f0faf4;
    }

    .gender-btn:active {
      transform: scale(0.97);
    }

    .gender-btn.selected {
      border: 1.5px solid #2d6a4f;
      background: #d8f3dc;
    }

    /* ── Check badge ── */
    .gender-btn .check {
      position: absolute;
      top: 6px;
      right: 6px;
      width: 16px;
      height: 16px;
      border-radius: 50%;
      background: #2d6a4f;
      display: flex;
      align-items: center;
      justify-content: center;
      opacity: 0;
      transform: scale(0.6);
      transition: opacity 0.15s, transform 0.15s;
    }

    .gender-btn.selected .check {
      opacity: 1;
      transform: scale(1);
    }

    /* ── Wrapper positions the badge over the circle ── */
    .photo-wrap {
      position: relative;
      width: 150px;
      height: 150px;
    }

    /* ── Upload zone ── */
    .photo-zone {
      width: 150px;
      height: 150px;
      border-radius: 50%;
      background: #f0faf4;
      border: 2px dashed #52b788;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 5px;
      cursor: pointer;
      transition: background 0.15s, border-color 0.15s;
      overflow: hidden;
    }

    .photo-zone:hover {
      background: #d8f3dc;
      border-color: #2d6a4f;
    }

    .photo-zone:hover .camera-icon {
      color: #2d6a4f;
    }

    .photo-zone:hover .zone-label {
      color: #2d6a4f;
    }

    /* State: has a preview image */
    .photo-zone.has-image {
      border-style: solid;
      border-color: #52b788;
    }

    .photo-zone.has-image .camera-icon,
    .photo-zone.has-image .zone-label {
      display: none;
    }

    .photo-zone img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: none;
    }

    .photo-zone.has-image img {
      display: block;
    }

    /* ── Camera SVG icon ── */
    .camera-icon {
      color: #52b788;
      transition: color 0.15s;
      flex-shrink: 0;
    }

    /* ── "Add photo" text label ── */
    .zone-label {
      font-size: 16px;
      font-weight: 600;
      color: #52b788;
      letter-spacing: 0.3px;
      transition: color 0.15s;
    }

    /* ── Edit badge (shown after image is set) ── */
    .photo-edit-badge {
      position: absolute;
      bottom: 2px;
      right: 2px;
      width: 26px;
      height: 26px;
      border-radius: 50%;
      background: #2d6a4f;
      border: 2px solid #fff;
      display: flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      opacity: 0;
      transform: scale(0.7);
      transition: opacity 0.15s, transform 0.15s;
      color: #fff;
    }

    .photo-wrap.has-image .photo-edit-badge {
      opacity: 1;
      transform: scale(1);
    }

    /* ── Remove link (shown after image is set) ── */
    .photo-remove {
      font-size: 12px;
      color: #9ca3af;
      cursor: pointer;
      text-decoration: underline;
      text-underline-offset: 2px;
      display: none;
      transition: color 0.15s;
    }

    .photo-remove:hover { color: #a32d2d; }

    .photo-wrap.has-image ~ .photo-remove {
      display: block;
    }

    /* ── Hidden file input ── */
    input[type="file"] {
      position: absolute;
      opacity: 0;
      width: 0;
      height: 0;
    }

    /* ── Focus ring on the zone ── */
    .photo-zone:focus-visible {
      outline: 2px solid #2d6a4f;
      outline-offset: 3px;
    }

    @media (prefers-reduced-motion: reduce) {
      .photo-zone, .photo-edit-badge, .camera-icon, .zone-label { transition: none; }
    }

    :root {
      /* Core gold ramp */
      --gold-50:  #fdf8ee;   /* page background tint */
      --gold-100: #fdf3dc;   /* alert bar, badge fill */
      --gold-200: #f7d98a;   /* hover states */
      --gold-400: #c8972a;   /* primary brand color  */
      --gold-600: #a07420;   /* button hover         */
      --gold-800: #856012;   /* active text on gold  */
      --gold-900: #3d2a08;   /* dark text on gold bg */

      /* Supporting teal (accent / secondary)  */
      --teal-50:  #e5f0f2;
      --teal-400: #1f4e5f;
      --teal-800: #0e2f3a;

      /* Supporting tan (neutral)              */
      --tan-50:   #f2ede4;
      --tan-400:  #7a6a52;
      --tan-800:  #3d2a08;

      /* Neutrals                              */
      --white:    #ffffff;
      --gray-50:  #f9fafb;
      --gray-100: #f3f4f6;
      --gray-300: #d1d5db;
      --gray-500: #6b7280;
      --gray-900: #111111;

      /* Semantic aliases                      */
      --color-primary:        var(--gold-400);
      --color-primary-hover:  var(--gold-600);
      --color-primary-light:  var(--gold-100);
      --color-primary-text:   var(--gold-900);
      --color-accent:         var(--teal-400);
      --color-accent-light:   var(--teal-50);
      --color-accent-text:    var(--teal-800);

      /* Typography                            */
      --font-sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

      /* Radii                                 */
      --radius-sm:  6px;
      --radius-md:  8px;
      --radius-lg:  12px;
      --radius-xl:  16px;
      --radius-full: 9999px;
    }

	.alert-gold {
      background: var(--gold-100);
      color: var(--gold-800);
      border-top: 0.5px solid var(--gold-200);
    }
	
	.landing-menu-text {
		color: rgba(19, 50, 42, 0.9);
		cursor: pointer;
		font-weight: bold;
		padding: 12px;
		font-size: 18px;
		font-family: 'Alfa Slab One';
		border: none;
		background: transparent;
		transition: all 0.2s ease-in-out;
	}

	.landing-menu-text:hover{
		color: #A07420 !important;
		background: transparent !important;
	}

	.landing-menu-text.button:hover{
		color: #A07420 !important;
		background: transparent !important;
	}

	.landing-menu-text-highlight {
		font-weight: bold;
		cursor: pointer;
		padding: 12px;
		font-size: 18px;
		font-family: 'Alfa Slab One';
		color: #A07420 !important;
		border: none;
		font-weight: 600;
		background: transparent;
	}

	.logged-in-menu {
		color: rgba(19, 50, 42, 0.9);
    font-family:'Georgia';
		transition: all 0.2s ease-in-out;
	}

	.logged-in-menu-highlight {
		color: #A07420;
    font-family:'Georgia';
		font-weight: bold;
	}

	.logged-in-menu:hover {
		color: #A07420;
    font-family:'Georgia';
		font-weight: bold;
		background:none;
	}

	.logged-in-menu-highlight:hover {
		color: #A07420;
		font-weight: bold;
		background:none;
	}

  .logged-in-nav-menu-btn {
    color: rgba(19, 50, 42, 0.9); 
    border: solid 1px #C2C2C2; 
    border-radius:26px; 
    height:55px; 
    min-width:150px;
  }

  .logged-in-nav-menu {
    min-width:350px; 
    background-color:#FFFFFF;
  }

	.offers-sub-title {
		font-style: italic;
		font-size: 22px;
		color: rgba(186, 61, 36, 1);
		font-family: 'Georgia';
	}

	.offers-sub-title-small {
		font-style: italic;
		font-size: 16px;
		color: rgba(186, 61, 36, 1);
		font-family: 'Georgia';
	}
	
	.offers-title {
		font-weight: bold;
		font-size: 60px;
		font-family: 'HWT Artz W00 Regular';
		font-weight: bold;
		letter-spacing: 0.1rem;
		color: var(--gold-600);
	}

	.offers-title-note {
		color: #666666;
		font-size: 16px;
	}

	.current-offers-title {
		color: #666666;
		font-size: 30px;
		margin-right: 10px;
	}

	.active-offers {
		border-radius: 15px;
		padding-top:5px;
		padding-bottom:5px;
		padding-left: 10px;
		padding-right: 10px;
		font-size: 14px;
		color: #444444;
		background-color: rgba(140,140,140,0.4);
	}

	.social-media {
		color: #CDC7AF;
		font-size:18px;
	}

	.social-media:hover {
		color: #FFFFFF;
		background-color: transparent;
	}

	.clamp-2-lines {
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 3;
		overflow: hidden;
	}

  .top-link {
		color: #CDC7AF !important;
	}

	.top-link:hover {
		color: #FFFFFF !important;
		background-color: transparent;
	}


	.menu-top {
		position: sticky;
		top: 0;
		display: flex;
		width:100vw !important; 
		margin-left:-24px; 
		min-height:100px;
		background-color: #FFFFFF; 
    color: rgba(19, 50, 42, 0.9);
		z-index:1000;
	}

  .contact-menu {
    display:flex; 
    height: 50px; 
    padding-bottom:10px; 
    padding-top:10px; 
    background-color:rgba(19, 50, 42, 0.9); 
    color:#CDC7AF; 
    width:100vw; 
    margin-left:-25px; 
    top:0; 
    flex-shrink:0; 
    position:fixed;
  }

	.card_menu {
		color: #000;
		background-color: white;
		margin-right:5px; 
		cursor:pointer;
		min-height:40px;
		max-height:40px;
		border: 1px solid #A9A9A9; 
		border-radius: 7px;
	}
	
	.card_menu_highlight {
		background-color: var(--gold-600);
		color: #FFF;
		margin-right: 5px;
		cursor:pointer;
		min-height:40px;
		max-height:40px;
		border: 1px solid #A9A9A9; 
		border-radius: 7px;
	}
	
	.card_menu:hover,
	.card_menu:focus {
		background-color: var(--gold-600);
		color: white;
	}

	.scroll-top-btn {
		border-radius: 50%;
		height: 40px;
		width: 40px;
		color: #FFF;
		background-color: #b83d26;
		position:fixed;
		text-decoration: none;
		right:30px;
		bottom:50px;
		justify-content: center;
		align-items: center;
		display:none;
	}

	.referral-link {
		border-radius: 10px;
    background: var(--gold-100);
		border: var(--gold-600) dashed 1px;
		color: var(--gold-900);
		margin-left:20px; 
		margin-right:20px; 
		padding-top:10px; 
		padding-bottom:10px;
	}

	.referral-offer {
		border-radius: 10px;
    background: #f0faf4;
		border: #52b788 solid 1px;
		margin-left:20px; 
		margin-right:20px; 
		padding-top:10px; 
		padding-bottom:10px;
	}

	.referral-share {
		padding-top:30px;
		padding-bottom:30px;
		margin-right: 20px;
    border: 1px solid #e5e7eb;
		font-size: 20px;
		border-radius: 10px;
		cursor:pointer;
    color: #666666;
    z-index: 10;
	}

	.referral-share:focus,
	.referral-share:hover,
  .referral-share:is-active {
		border-color: #52b788;
		background: #f0faf4;
		box-shadow: 0px 0px 10px 0px rgb(0 0 0 / 18%);
	}

	.referral-note {
		margin-top:20px; margin-left:20px; margin-right:20px;
	}

  .offers-title.mobile {
    font-size:32px;
  }