

  .mobile-shop {
	display: block;
  }

  .desktop-shop {
	display: none;
  }

  footer,#subfooter {
	float: left;
	width: 100%;
  }
  .agent-banner {
    float: right;
    background: #5CA82B;
    padding: 5px;
    color: #fff;
}

  @media(min-width: 768px) {
	.mobile-shop {
	  display: none;
	}

	.desktop-shop {
	  display: block;
	}
  }

  #main {
	padding-top: 0;
  }


  #main .PrintFriendly {
	min-height: 0;
  }

  #shoptool {
	padding-bottom: 3rem;

  }

  header {
	display: none;
  }
  #final-acknowledgement input[type="checkbox"],
  div#installation-card input[type="checkbox"] {
	width: auto !important;
  }
  #psuedo-header {
	position: fixed;
	z-index: 10000;
	top: 0;
	left: 0;
	right: 0;
	width: 100%;
	background: white;
	padding-bottom: 4rem;
  }

  #psuedo-header .bar {
	background-color: #001332;
	width: 100%;
	height: 10px;
	margin-bottom: 2rem;
  }

  #psuedo-header .container {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: space-between;
	gap: 2rem;
  }

  @media(min-width: 1300px) {
	#psuedo-header .container {
	  flex-direction: row;
	}
  }

  #psuedo-header .left {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 2rem;
  }

  #psuedo-header .left p {
	font-size: 16px;
	color: #333;
	font-weight: 400;
	margin: 0;
  }

  #psuedo-header .left a {
	color: #6fb841;
	font-weight: 600;
  }

  #psuedo-header img.logo {
	width: 175px;
	max-width: 90%;
	margin-right: 0;
  }

  #psuedo-header .insert-address {
	font-size: 14px;
	font-weight: 400;
  }

  #psuedo-header .right {
	display: flex;
	align-items: center;
	gap: 2rem;
  }

  #psuedo-header .right svg {
	width: 20px;
	height: 20px;
	fill: #6fb841;
  }

  #psuedo-header .clear-button {
	border: none;
	background: white;
  }

  #psuedo-header .review-wrap {
	gap: 0;
  }

  /* button.go-back.green.lower-navigation.underline-link {
	background: #6FB841;
	border: 2px solid #6FB841;
	transition: all ease 0.6s;
	text-transform: uppercase;
	font-size: 16px;
	font-weight: 400;
	text-decoration:none;
	width: auto;
  }
  button.go-back.green.lower-navigation.underline-link:hover {
	background: none;
	border: 2px solid #6FB841;
	color:#6FB841;
  }
  button.go-back.green.lower-navigation.underline-link:hover svg {
	color:#6FB841;
	fill:#6FB841;
  } */

  @media(min-width: 678px) {
	#psuedo-header .left {
	  flex-direction: row;
	}

	#psuedo-header img.logo {
	  margin-right: 5rem;
	}

	#psuedo-header .insert-address {
	  font-size: 18px;
	  font-weight: 600;
	}
  }

  .incompletion-message {
	text-align: center;
	color: #F53838;
  }



  button.green,
  a.green {
	border: 2px solid #6FB841;
	border-radius: 3rem;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 1rem 2rem;
	min-width: 150px;
	transition: all ease 0.6s;
	color: white;
	background-color: #6FB841;
  }

  button.green:hover,
  a.green:hover,
  button.green.disabled-style {
	color: #6FB841;
	background-color: white;
  }

  button.green.disabled-style {
	cursor: default;
  }

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

  .return-home .green {
	display: inline-block;
  }

  .lower-navigation {
	margin: 1rem auto;
  }

  .checkout-section svg.check {
	display: block;
	margin-left: auto;
	width: 20px;
	fill: #5CA82B;
	cursor: pointer;
  }

  @media(min-width: 768px) {
	.checkout-section svg.check {
	  width: 40px;
	}
  }

  .checkout-section svg.pen-to-square {
	margin-left: 0;
	width: 20px;
	fill: #5CA82B;
	cursor: pointer;
  }

  .order-summary .video h5,.order-summary .voice h5 {
	cursor: pointer;
  }



  /* Controlled element styling */
  .stream-content {
	max-height: 10000px; /* Set a maximum height larger than your content */
	overflow: hidden;
  }

  /* Vue 2 Transition Classes */
  .slide-enter-active, .slide-leave-active {
	transition: max-height 0.3s ease-in-out, opacity 0.3s ease-in-out;
  }

  .slide-enter, .slide-leave-to {
	max-height: 0;
	opacity: 0;
  }

  .form-enter-active, .form-leave-active {
	transition: max-height 0.3s ease-in-out, opacity 0.3s ease-in-out;
  }

  .form-enter, .form-leave-to {
	max-height: 0;
	opacity: 0;
  }

  #agent-options-wrap {
	border: 2px solid black;
	padding: 1rem;
  }

  .add-on-header {
	color: #333;
	text-transform: uppercase;
	font-weight: 600;
	margin-bottom: 1rem;
  }

  h2.add-on-header {
	font-size: 22px;
  }

  h3.add-on-header {
	font-size: 18px;
  }

  h2.add-on-header.toggle {
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	align-items: center;
  }

  h2.add-on-header.toggle button {
	border: none;
	background: none;
  }

  h2.add-on-header.toggle svg {
	fill: #6FB841;
	width: 20px;
	height: 20px;
  }

  .add-premium-icon {
	width: 3em;
	height: 100%;
	margin-right: 12px;
	vertical-align: middle;
  }
  .add-on-description {
	margin-bottom: 2rem;
  }

  .add-on-box {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: space-between;
	border-radius: 2rem;
	padding: 3rem;
	border: 3px solid #EDEDED;
	transition: all ease 0.6s;
	margin-bottom: 2rem;
  }

  .add-on-box .full-width {
	width: 100%;
  }

  .add-on-wrap {
	cursor: pointer;
  }

  /*
  @media(min-width: 1400px) {
  .add-on-box .full-width {
  width: 100%;
  }
  }*/

  .add-on-box .left {
	margin-bottom: 1rem;
  }

  #video-card  .add-on-box {
	border-radius: 20px;
	border: 3px solid #6FB841;

  }

  @media(min-width: 576px) {
	.add-on-box.internet {
	  flex-direction: row;
	}

	.add-on-box .left {
	  margin-bottom: 0;
	  margin-right: 1rem;
	}

  }

  .add-on-box.active {
	border-color: #6FB841;
	background-color: #F2FFE9;
  }

  .add-on-box h3 {
	color: black;
	margin-bottom: 1rem;
  }

  .add-on-box .right {
	text-align: center;
  }

  .add-on-box p {
	font-size: 16px;
	font-weight: 400;
  }

  .add-on-box p.price {
	color: #828282;
	font-size: 32px;
	font-weight: 500;
	margin-bottom: 1rem;
	letter-spacing: -0.64px;
  }
  .add-on-box p.price small{
	font-size: 15px;
	font-weight: 500;
  }
  p.add-on-subtext {
	margin: 15px 0;
  }

  .add-on-box p.price span {
	color: #828282;
	font-size: 10px;
  }

  .add-on-box button.green  {
	border: 2px solid #6FB841;
	border-radius: 3rem;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #6FB841;
	background-color: white;
	padding: 1rem 2rem;
	min-width: 150px;
	transition: all ease 0.6s;
  }

  .add-on-box.active button.green {
	color: white;
	background-color: #6FB841;
  }

  .add-on-box button.underline {
	display: block;
	margin: 0 auto;
	font-size: 16px;
	font-weight: 300;
	text-decoration: underline;
	background: none;
	border: none;
	text-decoration-thickness: 1px;
	text-underline-offset: 1px;
	padding-left:0px;
  }
  .disclaimer-modal .modal-body {
	font-style: normal !important;
  }
  .modal-dialog {
	max-width: 850px;
	width: 100%;
  }

  .add-on-box .safeguard-popup-box button.underline {
	display: inline-block;
  }

  .safeguard-popup-box .disclaimer-link {
	display: inline-block;
	margin: 0;
  }
  #safeguard-disclaimer-modal a{
	color:009B67;
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 1px;

  }
  #safeguard-disclaimer-modal .modal-body {
	font-style: normal !important;
  }

  @media(max-width: 575px) {
	.safeguard-popup-box {
	  text-align: center;
	}
	#checkout-security-card label {
	  display: inline;
	}
	#final-acknowledgement input[type="checkbox"], div#installation-card input[type="checkbox"] {
	  width: 40px !important;
	}
	button.green.lower-navigation,#final-buttons-row button.green{width:100%;min-width: 250px;}
	.order-summary ul li {
	  clear: both;
	}
	.order-summary {
	  padding: 0;
	}
	button.green.lower-navigation {
	  width: 240px;

	}

	.choose-service input,.single-check input {
	  width: 22px !important;
	  height: 22px !important;
	}
	.choose-service h3, .complete h2 {
	  font-size: 22px !important;
	}
	#shop-wrap {

	  padding: 0 20px;
	}
	#psuedo-header .container { gap: 1rem;}
	#psuedo-header {

	  padding-bottom: 1rem;
	}
  }


  @media(min-width: 576px) {
	.add-on-box button.underline {
	  margin: inherit;
	}
  }


  /* TESTING BUTTONS */
  #testing-wrap {
	margin: 2rem; 
	padding: 2rem; 
	border: 2px solid black;
  }

  #testing-wrap h3 {
	color: black;
  }

  #testing-wrap p {
	margin: 0;
  }

  .test-btn {
	display: inline-block;
	padding: 10px 20px;
	font-family: 'Poppins', sans-serif;
	font-size: 14px;
	font-weight: 600;
	text-decoration: none;
	text-align: center;
	cursor: pointer;
	border: none;
	border-radius: 6px;
	transition: all 0.2s ease;
	background-color: grey; 
	color: #fff;
	margin: 10px 5px;
  }

  .test-btn.is-active {
	background-color: #6fb841; 
  }

  .test-btn:not(:disabled):hover {
	background-image: linear-gradient(rgba(0, 0, 0, 0.15), rgba(0, 0, 0, 0.15));
	transform: translateY(-1px);
  }
  /* /TESTING BUTTONS */



  .ssid-tip {
	position: absolute;
	background: #efefef;
	border: 1px solid #efefef;
	padding: 1rem;
	border-radius: 1rem;
	bottom: 40px;
	width: 420px;
	max-width: 100%;
  }

  .ssid-tip-content {
	margin: 0;
  }

  .mobile-only {
	display: block;
  }

  @media(min-width: 992px) {
	.ssid-tip {
	  max-width: 175%;
	}
	.mobile-only {
	  display: none;
	}
  }

  section.checkout-section {
	scroll-margin-top: 140px;
  }

  .security-add-on-count {
	width: 50px;
  }

  #security-pin-wrap {
	position: relative;
  }

  .outdoor-wifi-top {
	margin-top: 1rem;
	background: #58ab2a;
	padding: 1rem;
  }

  .outdoor-wifi-top label {
	font-size: 16px;
	color: white;
  }

  .outdoor-wifi-top label .price { 
	font-weight: normal;
	font-size: 14px;
  }

  @media(min-width: 1200px) {
	.outdoor-wifi-top {
	  margin-top: 0;
	  margin-right: 41%;
	}
  }

  .input-visibility-toggle {
	position: absolute;
	right: 20px;
	top: 7px;
	background: none;
	border: none;
  }

  .input-visibility-toggle.with-tip {
	top: 26px;
  }

  .input-visibility-toggle svg {
	fill: #999;
	width: 20px;
	max-width: 100%;
  }

  .gray100 {
	filter: grayscale(1);
  }

  .billing-error {
	background: #D32F2F;
	color: white;
	border-radius: 1rem;
	padding: 1rem;
	margin: 1rem;
  }

  .billing-error  svg {
	cursor: pointer;
	display: block;
	margin-left: auto;
	width: 12px;
	height: 12px;
	fill: white;
  }

  #popup-shop-link {
	display:none;
  }

  .PrintFriendly {
	min-height: 1000px;
  }

  #free-mywifi-img,
  #free-stream {
	max-width: 90%;
	object-fit: contain;
	margin: 2rem auto;
	height: 200px;
  }

  @media(min-width: 992px) {
	#free-mywifi-img,
	#free-stream {
	  margin: 0 auto;
	}
  }

  .light-border {
	border: 2px solid #efefef;
  }

  #loading {/* this has inline display: none*/
	background-color: white;
	width: 90%;
	max-width: 1100px;
	margin: 75px auto;
	padding: 40px 40px;
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	height: 930px;
  }

  #processing-indicator {
	display: flex;
	flex-direction: column;
	align-items: center;
  }

  #loading .logo,
  #processing-indicator .logo {
	width: 350px;
	max-width: 90%;
	margin-bottom: 2rem;
  }

  #loading h2,
  #processing-indicator h2 {
	color: #1682c5;
	font-family: 'bebas_kairegular', sans-serif;
	font-size: 42px;
	margin: 2rem 0 1rem 0;
  }

  #loading .animation,
  #processing-indicator .animation {
	width: 100px;
  }

  /* processing indicator differences */
  #processing-indicator {
	height: auto;
	margin: 0 auto;
	width: 100%;
  }

  #do-more-banner {
	background: url('/Images/HomeSC/2023/shoptool/shoptool-header.png') no-repeat right top / cover;
	color: #fff;
	padding: 7% 25px 9%;
	display: none;
	margin-top: 225px;
  }

  @media(min-width: 1200px) {
	#do-more-banner {
	  background: url('/Images/HomeSC/2023/shoptool/shoptool-header.png') no-repeat center top / cover;
	  margin-top: 135px;
	}
  }

  #do-more-banner h1 {
	font-family: 'Bebas Neue', sans-serif;
	color: #fff;
	font-size: 100px;
	line-height: .9em;
	text-transform: uppercase;
	margin: 0;
  }

  #do-more-banner p {
	font-family: 'Quasimoda', sans-serif;
	color: #fff;
	font-size: 25px;
	margin: 5px 5px;
	font-weight:300;
	margin: 0;
  }

  /* PROMO BOXES */
  /* individual promo boxes are included via lib item and contain their own styles */
  .promo-popup-row {
	margin: 1rem 0;
	padding: 4rem 2rem;
	background: white;
  }

  .promo-popup-row .col-md-6 {
	overflow: hidden;
  }

  .promo-popup-row .col-md-6:first-of-type {
	border-bottom: 2px solid #efefef;
	margin-bottom: 2rem;
	padding-bottom: 2rem;
  }

  .promo-popup-row .col-md-6.col-md-offset-3 {
	border: none;
  }

  .promo-popup-row .col-md-6 article {
	height: 100%;
	width: 100%;
	cursor: pointer;
  }

  .promo-popup-row .col-md-6 article p {
	margin: 0;
	font-size: 16px;
  }

  .promo-popup-row .col-md-6 article a {
	color: inherit;
  }

  .promo-popup-row .col-md-6 article a:hover {
	text-decoration: none;
  }

  .promo-popup-row .col-md-6 article .large {
	font-size: 18px;
  }

  .promo-popup-row .col-md-6 article .font-weight-normal {
	font-weight: normal;
  }

  .promo-popup-row .col-md-6 article .font-weight-bold {
	font-weight: bold;
  }

  @media(min-width: 992px) {
	.promo-popup-row .col-md-6:first-of-type {
	  border-bottom: none;
	  margin-bottom: 0;
	  padding-bottom: 0;
	  border-right: 2px solid #efefef;
	}

	.promo-popup-row .col-md-6.col-md-offset-3 {
	  border: none;
	}

	.promo-popup-row .col-md-6 article {
	  aspect-ratio: 16 / 6;
	}
  }

  #please-note {
	max-width: 600px;
	margin:0px auto 10px;

  }

  .nowrap-shop-label-phone {
	float:none !important;
	font-weight:300 !important;
	white-space:nowrap;
  }

  @media screen and (max-width: 1200px) {
	#do-more-banner h1 {
	  font-size: 60px;
	}
	#do-more-banner p {
	  font-size: 16px;
	}
  }
  @media screen and (max-width: 992px) {
	#do-more-banner {
	  padding: 13% 15px;
	}
  }
  @media screen and (max-width: 767px) {
	#do-more-banner h1 {
	  font-size: 55px;
	}
	#do-more-banner p {
	  font-size: 15px;
	}


  }

  @media screen and (max-width: 480px) {

	.input-icon-group i {
	  position:absolute;
	  top: 28% !important;
	}
	.add-on-wrap > div {
	  display: flex;
	  align-items: flex-start;
	  gap: 10px;
	}

	.add-on-wrap input[type="radio"] {
	  margin: 4px 0 0;
	  flex-shrink: 0;
	}
	.add-on-box p.price{text-align:left;}

	#address-lookup-holder .get-started {
	  max-width: 100%;
	  text-align: center;
	  margin-top: 30px;
	  margin: 30px auto;
	  display: table;
	}

	.desktop-show i {
	  margin-top: 15px;
	  text-align: center;
	  margin-bottom: 15px;
	}
  }

  .bold-it {
	font-weight:600;
	font-style:italic;
  }
  .min-200 {
	min-height: 200px;
  }

  .min-180 {
	min-height: 180px;
  }

  .row.disclaimer {
	padding: 1rem 0;
  }

  .disclaimer-link {
	font-style: italic;
	color: #5D5D5E;
	cursor: pointer;
	display: block;
	text-decoration: underline;
	width: 100px;
	text-align: center;
	margin: 2rem 0 2rem auto;
  }

  .video-disclaimer {
	text-align: right;
	z-index: 99999;
	position: relative;
	width: 100%;
	display: block;
	right: 35px;
	bottom: 50px;
  }

  #subtotal-disclaimer {
	position:relative;
	float:right;
	margin-right:10px;
  }

  .modal {
	z-index:99999;
  }
  .sm-ask {
	font-size: .6em;
	position: relative;
	top: -0.6em;
  }
  .custom-checkbox {
	display: block;
	position: relative;
	padding-left: 15px;
	margin-bottom: 15px;
	cursor: pointer;
	font-size: 20px;
  }

  .clear-address-btn {
	font-size: 6px;
	padding: 1px 2px;
	position: relative;
	top: -2px;
	color: black;
	line-height: normal;
	font-family: arial;
	border-radius: 8px;
	border: 0;
  }



  /* Creating a custom checkbox
  based on demand */
  .green-check {
	position: absolute;
	top: 0;
	left: 0;
	height: 25px;
	width: 25px;
	border-radius:25px;
	border:2px solid #999;
  }
  .green-check-text {
	width:92%;
	display:inline-block
  }
  /* Specify the background color to be
  shown when hovering over checkbox */
  .custom-checkbox:hover input ~ .green-check {
	background-color: #999;
  }


  /* Specify the background color to be
  shown when checkbox is checked */
  .custom-checkbox input:checked ~ .green-check {
	background-color: #999;
  }

  /* Checkmark to be shown in checkbox */
  /* It is not be shown when not checked */
  .green-check:after {
	content: "";
	position: absolute;
	display: none;
  }

  /* Display checkmark when checked */
  .custom-checkbox input:checked ~ .green-check:after {
	display: block;
  }
  /* Styling the checkmark using webkit */
  /* Rotated the rectangle by 45 degree and 
  showing only two border to make it look
  like a tickmark */
  .custom-checkbox .green-check:after {
	left: 8px;
	bottom: 5px;
	width: 6px;
	height: 12px;
	border: solid white;
	border-width: 0 3px 3px 0;
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
  }


  #scroll-to-shop-tool {
	position: absolute;
	top: 0;
	left: 0;
	height: 10px;
	width: 100vw;
  }

  #speeds .dsign,
  #video-items .dsign {
	display: inline-block;
	font-size: 30px;
	font-style: normal;
  }

  .strikethrough .dsign{font-size: 22px !important;}

  #final-acknowledgement label {
	font-weight: normal;
  }

  #final-acknowledgement .single-check input {
	margin: 0 1rem 0 0;
  }



  #final-acknowledgement a.phone {
	color: #6fb841;
	text-wrap: nowrap;

  }

  #final-buttons-row {
	display: flex;
	flex-direction: column-reverse;
	align-items: center;
	justify-content: space-between;
	gap: 2rem;
  }

  @media(min-width: 768px) {
	#final-buttons-row {
	  flex-direction: row;
	}
  }

  @media(min-width: 1400px) {
	#final-buttons-row .left {
	  flex: 65%;
	}

	#final-buttons-row .right {
	  flex: 35%;
	  display: flex;
	  flex-direction: column;
	  justify-content: flex-end;
	  align-items: flex-end;
	}
  }

  #final-buttons-row button.green {
	margin: 0;
  }

  button.green.lower-navigation {
	width: 225px;
	text-transform: uppercase;
	font-size: 16px;
	font-weight: 400;
	padding: 20px 35px;
	display: flex;
	gap: 10px;
	justify-content: center;
  }

  button.green.lower-navigation svg {
	width: 30px;
	height: 30px;
	fill: #fff;
  }

  button.green.lower-navigation:hover svg,
  button.green.lower-navigation.disabled-style svg {
	fill: #6FB841;
  }

  button.underline-link {
	background: transparent;
	border: none;
	text-decoration: underline;
  }

  button.underline-link svg {
	width: 8px;
	height: 8px;
  }


  #cart-toggle-button img {
	width: 30px;
	margin-right: 1rem;
  }

  #cart-toggle-button .chevron {
	fill: white;
	width: 15px;
	transition: all 1s;
  }

  #cart-toggle-button.open .chevron {
	transform: rotate(180deg);
  }


