.circle-offer {
	max-width: 100px;
	margin: 0 auto 10px;
  }
  .offer-section {
	padding: 0;
	text-align: center;
  }

  .wireless-section {
	background: url('/Images/focusbroadband/WirelessBanners/2025/Explore_Devices_blue_gradient_banner.png') no-repeat center center;
	background-size: cover;
	color: white;
	text-align: center;
	padding: 40px 0px 60px;
  }
  .wireless-section h2 {
	font-weight: 400;
	margin-bottom: 30px;
	color:#fff;  }
  .circle-wrapper {
	position: relative;
	width: 120px;
	height: 110px;
	margin: 0 auto 10px;
  }
  .wireless-section p {
	width: 85%;
	margin: 0 auto;
  }
  .circle-wrapper img {
	width: 100%;
	height: 100%;
  }
  .circle-text {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	color: white;
	font-size: 17px;
	text-align: center;
	pointer-events: none;
	line-height: 1.2;
  }

  .offer-description {
	font-size: 16px;
	text-align: center;
  }
  @media screen and (max-width: 1024px) {
	.wireless-section p {
	  width: 100%;
	}

  }



  .arrowTag { display:block;  position: absolute; top: 110px; left: 48px; border-radius: 0px; height: 58px; color: white; padding: 23px 32px 2px 10px; font-size: .8em; text-align: center;  transform: rotate(0deg); background-image: url(/Images/atmc/site/images/arrows-sm5.png); background-repeat: no-repeat; background-position: center; border: 0px solid gray; text-shadow: 2px 2px 4px #650101;}


  .arrowTagBlue { display:block;  position: absolute; top: 132px; left: 178px; border-radius: 0px; height: 64px; width: 100px; color: white; padding: 28px 32px 2px 10px; font-size: .8em; text-align: right;  transform: rotate(0deg); background-image: url(/Images/focusbroadband/WirelessPhones/arrows-sm5BlueLonger.png); background-repeat: no-repeat; background-position: center; border: 0px solid gray; text-shadow: 2px 2px 4px #011265;}
  }

  .promoSticker {display: block; position: absolute; right: 80px; top: 8px;}


  .desktop {display: block;}
  .mobile {display: none;}

  @media screen and (max-width: 650px) {
	.desktop {display: none;}
	.mobile {display: block;}
	.promoSticker {display: block;}
  }



  .tip-wrap .tip-content {
	display: none;
	z-index: 1000;
	position: absolute;
	font-size: .85em;
	font-weight: 600;
	top: -25px;

	padding: 2px;

  }
  .tip-wrap:hover .tip-content {
	display: block;
	position: absolute;
	top: -25px;
	left: 205px;
	padding: 2px;
  }









  #banner-business:before {
	content: "";
	background-color: rgb(0, 0, 0 / .25%);
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
  }


  }


  .colorBox { height: 40px; margin: 4px; display: flex; align-items: center; justify-content: center; padding: 5px;}

  h5.colorOptions {margin: 4px auto; font-size: .9em; font-weight: 500; text-align: center; display: block;}

  .colorOptionCircles {
	height: 35px;
	margin: 2px;
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
  }

  .circle {background-color: black; width: 15px; height: 15px; border-radius: 30px; border: 1px solid gray; display: inline-block; margin: 5px;   transition: 0.3s;}
  .circle:hover {box-shadow: 0px 0 8px 8px white; width: 20px; height: 20px;}

  .circleWhite {background-color: white;  width: 15px; height: 15px; border-radius: 30px; border: 1px solid gray; display: inline-block; margin: 5px;  transition: 0.3s;}
  .circleWhite:hover {box-shadow: 0px 0 8px 8px white; width: 20px; height: 20px;}


  .circleBlue {background-color: #afdcf2;  width: 15px; height: 15px; border-radius: 30px; border: 1px solid gray; display: inline-block; margin: 5px;  transition: 0.3s;}
  .circleBlue:hover {box-shadow: 0px 0 8px 8px white; width: 20px; height: 20px;}

  .circleGreen {background-color: #b7e389;  width: 15px; height: 15px; border-radius: 30px; border: 1px solid gray; display: inline-block; margin: 5px;  transition: 0.3s;}
  .circleGreen:hover {box-shadow: 0px 0 8px 8px white; width: 20px; height: 20px;}


  .circleTeal {background-color: #9fc6c6;  width: 15px; height: 15px; border-radius: 30px; border: 1px solid gray; display: inline-block; margin: 5px;  transition: 0.3s;}
  .circleTeal:hover {box-shadow: 0px 0 8px 8px white; width: 20px; height: 20px;}

  .circleUltramarine {background-color: #7e8fdb;  width: 15px; height: 15px; border-radius: 30px; border: 1px solid gray; display: inline-block; margin: 5px;  transition: 0.3s;}
  .circleUltramarine:hover {box-shadow: 0px 0 8px 8px white; width: 20px; height: 20px;}

  @import url(https://fonts.googleapis.com/css?family=Lato:700);


  /* common 

  body {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 100vh;
  background: #f0f0f0;
  }
  .box {
  position: relative;
  max-width: 600px;
  width: 90%;
  height: 400px;
  background: #fff;
  box-shadow: 0 0 15px rgba(0, 0, 0, 0.1);
  }
  */

  .item {padding: 2px;}
  .lnRgt {border-right: 1px solid black; }


  .ribbon-wrapper {
	width: 150px;
	height: 130px;
	overflow: hidden;
	position: absolute;
	top: 16px;
	right: 104px;
	/* left: -20px; */
  }

  .ribbon2 {
	font: 100 10px sans-serif;
	color: #333;
	text-align: center;
	-webkit-transform: rotate(35deg);
	-moz-transform: rotate(35deg);
	-ms-transform: rotate(35deg);
	-o-transform: rotate(35deg);
	position: relative;
	padding: 3px 0;
	top: 24px;
	left: -30px;
	right: 0px;
	width: 250px;
	background: rgb(255,255,255);
	background: -moz-linear-gradient(0deg, rgba(26,67,129,4) 0%, rgba(26,67,129,4) 0%, rgba(118,154,209,1) 90%, rgba(118,154,209,1) 98%);
	background: -webkit-linear-gradient(0deg, rgba(26,67,129,4) 0%, rgba(26,67,129,4) 0%, rgba(118,154,209,1) 90%, rgba(118,154,209,1) 98%);
	background: linear-gradient(0deg, rgba(26,67,129,4) 0%, rgba(26,67,129,4) 0%, rgba(118,154,209,1) 90%, rgba(118,154,209,1) 98%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#1a4381",endColorstr="#22b695",GradientType=1);
	box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
	color:#ffffff;
	font: 700 11px/1 "Lato", sans-serif;
	/*text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);*/
	text-transform: uppercase;
	text-align: center;
	border: 1px solid blue;;
  }



  .ribbon {
	width: 150px;
	height: 150px;
	overflow: hidden;
	position: absolute;
	z-index: 1000;

  }
  .ribbon::before,
  .ribbon::after {
	position: absolute;
	z-index: -2;
	content: "";
	display: block;
	border: 5px solid #c32722;
  }
  .ribbon span {
	position: absolute;
	display: block;
	width: 225px;
	padding: 8px 0;
	background: rgb(195,39,34);
	background: -moz-linear-gradient(0deg, rgba(195,39,34,1) 0%, rgba(255,255,255,1) 16%, rgba(247,251,245,1) 84%, rgba(0,112,15,1) 98%);
	background: -webkit-linear-gradient(0deg, rgba(195,39,34,1) 0%, rgba(255,255,255,1) 16%, rgba(247,251,245,1) 84%, rgba(0,112,15,1) 98%);
	background: linear-gradient(0deg, rgba(195,39,34,1) 0%, rgba(255,255,255,1) 16%, rgba(247,251,245,1) 84%, rgba(0,112,15,1) 98%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#c32722",endColorstr="#00700f",GradientType=1);
	box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
	color: #c32722;
	font: 700 11px/1 "Lato", sans-serif;
	/*text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);*/
	text-transform: uppercase;
	text-align: center;
	border: 1px solid red;
  }

  /* top left*/
  .ribbon-top-left {
	top: -10px;
	left: -10px;
  }
  .ribbon-top-left::before,
  .ribbon-top-left::after {
	border-top-color: transparent;
	border-left-color: transparent;
  }
  .ribbon-top-left::before {
	top: 0;
	right: 0;
  }
  .ribbon-top-left::after {
	bottom: 0;
	left: 0;
  }
  .ribbon-top-left span {
	right: -25px;
	top: 30px;
	transform: rotate(-45deg);
  }

  /* top right*/
  .ribbon-top-right {
	top: -10px;
	right: -10px;
  }
  .ribbon-top-right::before,
  .ribbon-top-right::after {
	border-top-color: transparent;
	border-right-color: transparent;
  }
  .ribbon-top-right::before {
	top: 0;
	left: 0;
  }
  .ribbon-top-right::after {
	bottom: 0;
	right: 0;
  }
  .ribbon-top-right span {
	left: -25px;
	top: 30px;
	transform: rotate(45deg);
  }

  /* bottom left*/
  .ribbon-bottom-left {
	bottom: -10px;
	left: -10px;
  }
  .ribbon-bottom-left::before,
  .ribbon-bottom-left::after {
	border-bottom-color: transparent;
	border-left-color: transparent;
  }
  .ribbon-bottom-left::before {
	bottom: 0;
	right: 0;
  }
  .ribbon-bottom-left::after {
	top: 0;
	left: 0;
  }
  .ribbon-bottom-left span {
	right: -25px;
	bottom: 30px;
	transform: rotate(225deg);
  }

  /* bottom right*/
  .ribbon-bottom-right {
	bottom: -10px;
	right: -10px;
  }
  .ribbon-bottom-right::before,
  .ribbon-bottom-right::after {
	border-bottom-color: transparent;
	border-right-color: transparent;
  }
  .ribbon-bottom-right::before {
	bottom: 0;
	left: 0;
  }
  .ribbon-bottom-right::after {
	top: 0;
	right: 0;
  }
  .ribbon-bottom-right span {
	left: -25px;
	bottom: 30px;
	transform: rotate(-225deg);
  }

  #chatNotification {
	display: none;
  }


  #promoRibbon {position: relative;}

  @media screen and (min-width: 1650px) {
	#promoRibbon {display: block; border-radius: 4px; width: 330px; height: 330px;  color: white; z-index: 500000; position: fixed; top: 380px; left: 4.5%}
  }

  @media screen and (min-width: 650px) {
	#chatNotification {
	  display: block; border-radius: 4px; width: 250px; height: 130px;  color: white; z-index: 8000; position: fixed; bottom: 70px; right: 60px;
	}






	img.top {
	  width: 80%;
	  height: auto;
	  margin: 0 auto;
	}

	.carousel-control-next,
	.carousel-control-prev /*, .carousel-indicators */ {
	  filter: invert(100%);
	}

	.rotationContainer {display: block; position: relative; height: 33.5em;  background-position: center;   background-repeat: no-repeat;   background-size: cover;}


	.carsl-left {display: block; width: 50%; position: absolute; left:0px; top: 0px;
	  background-position: center;   background-repeat: no-repeat;   background-size: cover;
	  text-align: center; 
	  padding: 30px; font-size: 2em; height: 100%;}

	.carsl-right {display: block; width: 50%; position: absolute; left: 50%; height: 100%; text-align: center; padding: 5% 7%; }

	.slide1 { background-image: url('/Images/atmc/site/images/wireless-devices/NewFolder_1_/image001.jpg');}

	.slide2 { background-image: url('/Images/atmc/site/images/wireless-devices/NewFolder_1_/image002.jpg');}

	.slide3 { background-image: url('/Images/atmc/site/images/wireless-devices/NewFolder_1_/image002.jpg');}

	.slide4 { background-image: url('/Images/atmc_focusbroadband/atmc/site/images/wireless-devices/NewFolder/BYOD__200_off_Banner.png');}

	.carousel-control-prev {
	  left: -80px;
	}

	.carousel-control-next {
	  right: -80px;
	}




	@media screen and (max-width: 1450px) {
	  .rotationContainer {display: block; position: relative; height:25em;}
	  .carsl-left {display: block; width: 50%; position: absolute; left:0px; top: 0px;
		background-position: center;   background-repeat: no-repeat;   background-size: cover;
		text-align: center; 
		padding: 30px; font-size: 2em; height: 100%;}

	  .carsl-right {display: block; width: 50%; position: absolute; right: 0; height: 100%; text-align: center; padding: 5% 3%; }
	}


	@media screen and (max-width:1000px) {
	  .rotationContainer {display: block; position: relative; height: 14em;}
	  .carsl-left {display: none; width: 50%; position: absolute; left:0px; top: 0px;
		background-position: center;   background-repeat: no-repeat;   background-size: cover;
		text-align: center; 
		padding: 30px; font-size: 2em; height: 500px;}

	  .carsl-right {display: block; width: 100%; position: absolute; left: 0; height: 200px; text-align: center; padding: 5% 3%; }
	}


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

	}