/* START Variables */
:root {
	--color-black: #000000;
	--color-blue: #04254C;
	--color-light-blue: #3AA6D5; /* var(--main-bg-color) */
	--color-blue-gradient: linear-gradient(162.46deg, #4B8BD7 0%, #062952 100%);
	--color-magenta: #F70981;
	--color-yettel-green: #b4ff00;
	--color-vodafone-red: #ee3123;
	--color-one-blue: #00a4b0;
	--color-red: #FB634E;
	--color-white: #FFFFFF;
	--color-orange: #FC9B0D;

	--font-size-small: 0.9rem;
	--font-size-base: 1rem;
	--font-size-h1: 2rem;
	--font-size-h2: 1.75rem;
	--font-size-h3: 1.5rem;
	--font-size-h4: 1.25rem;
}
/* END Variables */

/* START Typography */
h1 {
	text-align: center;
	font-size: var(--font-size-h1);
	color: var(--color-white);
}

div {
	font-size: var(--font-size-base);
	color: var(--color-white);
}
/* END Typography */

/* START Buttons */
button:hover::after {
	background-color: rgba(255,255,255,0);
}

.btn-primary {
	border-radius: 30px;
	font-size: var(--font-size-base);
	font-weight: bold;
	/* text-transform: uppercase; */
    color: var(--color-white);
	padding: 0.75rem 3rem;
	background-color: rgba(255,255,255,0);
	border: 2px solid var(--color-white);
	box-shadow: none;
}
.btn-primary:hover {
    background-color: rgba(255,255,255,0.15);
	border: 2px solid var(--color-white);
	box-shadow: none;
}
.btn-check:focus+.btn-primary, .btn-primary:focus {
    background-color: rgba(255,255,255,0.15);
	border: 2px solid var(--color-white);
	box-shadow: none;
}
.btn-check:active+.btn-primary, .btn-check:checked+.btn-primary, .btn-primary.active, .btn-primary:active, .show>.btn-primary.dropdown-toggle {
    background-color: rgba(255,255,255,0.15);
	border: 2px solid var(--color-white);
	box-shadow: none;
}
.btn-check:active+.btn-primary:focus, .btn-check:checked+.btn-primary:focus, .btn-primary.active:focus, .btn-primary:active:focus, .show>.btn-primary.dropdown-toggle:focus {
	box-shadow: none;
}

.btn-warning {
	/* border-radius: 30px; */
	font-size: var(--font-size-base);
	font-weight: bold;
	/* text-transform: uppercase; */
    color: var(--color-white);
	padding: 0.75rem 3rem;
	background-color: var(--color-orange);
	border: 2px solid var(--color-orange);
	box-shadow: none;
}
.btn-warning:hover, .btn-warning:focus-visible {
    background-color: rgba(252, 155, 13,0.9);
	border: 2px solid var(--color-orange);
    color: var(--color-white);
    /* color: var(--color-white); */
	/* border: 2px solid var(--color-white); */
	box-shadow: none;
}


.btn-secondary {
	border-radius: 30px;
	font-size: var(--font-size-base);
	font-weight: bold;
	/* text-transform: uppercase; */
    color: var(--color-black);
	padding: 0.5rem 3rem;
	background-color: rgba(255,255,255,0);
	border: 2px solid var(--color-black);
	box-shadow: none;
}
.btn-secondary:hover {
    color: var(--color-black);
    background-color: rgba(255,255,255,0.15);
	border: 2px solid var(--color-black);
	box-shadow: none;
}
.btn-check:focus+.btn-secondary, .btn-secondary:focus {
    color: var(--color-black);
    background-color: rgba(255,255,255,0.15);
	border: 2px solid var(--color-black);
	box-shadow: none;
}
.btn-check:active+.btn-secondary, .btn-check:checked+.btn-secondary, .btn-secondary.active, .btn-secondary:active, .show>.btn-secondary.dropdown-toggle {
    color: var(--color-black);
    background-color: rgba(255,255,255,0.15);
	border: 2px solid var(--color-black);
	box-shadow: none;
}
.btn-check:active+.btn-secondary:focus, .btn-check:checked+.btn-secondary:focus, .btn-secondary.active:focus, .btn-secondary:active:focus, .show>.btn-secondary.dropdown-toggle:focus {
	box-shadow: none;
}

.btn-contact img {
	width: 30px;
	height: auto;
}
/* END Buttons */


/* START Header */
.navbar-brand {
	color: var(--color-white) !important;
	font-weight: 900;
}

.mobile-header {
	display: block;
	position: absolute;
	left: -35px;
	top: -11px;
	width: 340px;
	z-index: 0;
}

.navbar {
	/* background-color: rgba(255, 255, 255, 0) !important; */
}

.navbar-buttons {
	z-index: 4;
}
/* END Header */

html, body {
	margin: 0; 
	padding: 0; 
	font-family: Quicksand; 
	font-weight: 300; 
	min-height: 100%; 
	color: var(--color-white); 
	font-size: var(--font-size-base);
}

body {
	background: linear-gradient(162.46deg, #4B8BD7 0%, #062952 100%);
}

#counter {
	/* margin-top: 5rem;  */
	background: rgba(4,37,76, 0.1);
    padding: 1rem;
    border-radius: 5px;
}

#counter span {
	font-size: var(--font-size-h2);
	/* font-weight: bold; */
}

#counter .counter-description {
	font-size: var(--font-size-base);
	/* font-weight: bold; */
}

.mobiles-container img {
	width: 100%;
	height: auto;
	max-width: 680px;
}

.invalid-feedback {
	color: var(--color-red);
}

/* START Dialog modal */
.ui-widget-overlay
{
  opacity: .75 !important; /* Make sure to change both of these, as IE only sees the second one */
  filter: Alpha(Opacity=75) !important;

  background: rgb(50, 50, 50) !important; /* This will make it darker */
}
.ui-dialog {
	margin: 0 !important;
	padding: 0 !important;
	border: none !important;
}

.ui-dialog .ui-dialog-title {
	white-space: break-spaces !important;
}

.ui-dialog-titlebar-close {
	background-color: var(--color-blue);
	margin: -10px 10px 0px 0px;
    border: none;
}

.ui-dialog-titlebar-close::before {
	content: "\2716";
    height: 100%;
    left: 0;
    margin: auto;
    position: absolute;
    right: 20px;
    top: -1px;
    width: 0;
    z-index: 1;
}

.ui-widget-header {
	/* margin: 0 !important; */
	/* padding: 0 !important; */
	border: none !important;
	background-color: var(--color-blue) !important;
}

.ui-dialog-title {
	font-size: var(--font-size-h4);
}

.ui-dialog-content {
	font-size: var(--font-size-base);
	color: var(--color-black);
	text-align: center;
}

.ui-dialog-content p {
	margin: 0px;
	font-size: var(--font-size-base);
}

.ui-dialog-buttonpane {
	margin-top: 0px;
}

.ui-dialog-buttonset {
	display: flex;
}

.ui-dialog-buttonset .btn-secondary {
    border-radius: 30px;
    padding: 0.5rem 1rem;
}


.popup-box .content h5 {
	font-size: var(--font-size-h4);
}

.popup-box .content p {
	font-size: var(--font-size-base);
}

.content {
	color: var(--color-black) !important;
	font-size: var(--font-size-base) !important;
}
/* END Dialog modal */

/* START Bootstrap Modal */
.modal-content {
	background: linear-gradient(162.46deg, #4B8BD7 0%, #062952 100%);
	border: none;
}
.modal-header {
	border-bottom: none;
}
.modal-footer {
	border-top: none;
}

.modal .btn-secondary {
	color: var(--color-white);
    border: 2px solid var(--color-white);
}
/* END Bootstrap Modal */

/* START Carousel */
.carousel-indicators {
    margin-bottom: 0rem;
}

.carousel-indicators [data-bs-target] {
    width: 27px;
    height: 7px;
    margin-right: 7px;
    margin-left: 7px;
}

.carousel-indicators .active {
	background-color: var(--color-orange) !important;
}

.carousel-indicators button {
    width: 15px;
    height: 3px;
    /* border: 3px solid var(--color-white); */
    border-radius: 25px;
    background: white !important;
}

.carousel-indicators .indicator {
	pointer-events: none;
	opacity: 0.6;
}

.carousel-indicators .carousel-control-prev {
	position: absolute;
    left: 0px;
    right: 0px;
    margin: 0px auto;
    top: 35px;

	text-indent: 0px;
    opacity: 1;
    text-align: center;
    /* position: relative; */
    background: none !important;
	box-shadow: none !important;
}

.carousel-indicators .carousel-control-prev:hover {
	text-decoration: underline;
}

.carousel-item {
	height: fit-content;
	min-height: 415px;
}

.carousel-dark .carousel-caption {
	color: var(--color-white);
}

.provider-box {
    width: 100%;
    height: 72px;
	background-color: var(--color-white);
    border-radius: 5px;
	padding: 0.5rem;
}

.summary-box {
	background-color: var(--color-white);
    color: var(--color-black);
    padding: 0.5rem 1rem;
    border-radius: 5px;
}

.summary-title {
	color: var(--color-black);
	margin-bottom: 1rem;
}
.summary-value {
    color: var(--color-black);
	font-size: var(--font-size-h3);
}

.summary-image {
	display: none;
}

.summary-image-active {
	display: block;
}
/* END Carousel */

/* #container {
	margin: 0 auto;
	width: 75%;
	min-height: 100vh;
	box-shadow: 0 0 1vw rgba(0,0,0, 0.5);
} */

/* #header {
	background-color: rgba(36,36,36, 0.8);
	width: 100%;
	height: 20vh;
	max-height: 20vw;
} */

#certificate {
	position: absolute;
	margin: 2vh 3vh;
	width: 28vh;
	height: 22vh;
	max-height: 22vw;
	background-image: url('../img/certificate.png');
	background-repeat: no-repeat;
	background-size: contain;
	transform: rotate(-10deg);
	z-index: 1000;
}

/* #slider_content {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
} */

/* #counter {
	width: 100%;
	margin: 0 auto;
	text-align: center;
	font-weight: 300;
	font-size: 1.6vw;
} */

/* .counter-item  {
	font-weight: normal;
	display: inline-block;
	padding: 0.2vw;
	height: 2vw;
	width: 1.3vw;
	text-align: center;
	background-color: #3e3e3e;
	color: #d1861c;
	font-size: 1.8vw;
	line-height: 2vw;
	margin-right: 0.3vw;
	box-shadow: inset 0 0 1vw #1e1e1e;
} */

/* #counter span  {
	display: inline-block;
	color: #e7e4e4;
} */

#main {
	/* padding-top: 30px; */
	background-color: var(--color-white);
	width: 100%;
	/* min-height: 78vh; */
}

#main h2 {
	margin: 0;
	padding: 0.8em;
	font-size: 2.2em;
	font-weight: 100;
	color: #212121;
	text-align: center;
}

#main h3 {
	margin: 0;
	padding: 1rem;
	font-size: var(--font-size-h3);
	color: var(--color-white);
	background-color: var(--color-blue);
}

#main h3 span.step {
    padding: 0rem 0.5rem;
}

#main h3 span.step img {
	width: 35px;
}

#main p {
	padding: 0 5vw 1vw 5vw;
	font-size: 1.2vw;
	text-align: justify;
	line-height: 1.5;
}

#form {
	text-align: left;
	/* padding-bottom: 4vw; */
}

#providers {
	margin: 0 auto;
	width: 90%;
}

#providers .provider {
	width: 23.3%;
	margin: 2% 5%;
	height: 7vw;
	float: left;
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
	cursor: pointer;
}

#providers .telekom {
	background-image: url('../img/2023/telekom-gray-logo.png');
}

#providers .telekom-active {
	background-image: url('../img/2023/telekom-logo.png');
}

#providers .telekom:hover {
	background-image: url('../img/2023/telekom-logo.png');
}

#providers .telenor {
	background-image: url('../img/telenor.png');
}

#providers .telenor-active {
	background-image: url('../img/telenor-hover.png');
}

#providers .telenor:hover {
	background-image: url('../img/telenor-hover.png');
}

#providers .yettel {
	background-image: url('../img/2023/yettel-gray-logo-2.png');
}

#providers .yettel-active {
	background-image: url('../img/2023/yettel-logo-2.png');
}

#providers .yettel:hover {
	background-image: url('../img/2023/yettel-logo-2.png');
}

#providers .one {
	background-image: url('../img/2023/one-gray-logo.png');
}

#providers .one-active {
	background-image: url('../img/2023/one-logo.png');
}

#providers .one:hover {
	background-image: url('../img/2023/one-logo.png');
}

#products {
	/* width: 80%;
	margin: 2vw auto; */
	/* min-height: 80px; */
	/* padding: 1rem 2rem; */
}

#blank_product {
	font-size: 1.5vw;
	padding: calc(0.5vw + 1px) 1.5vw;
}

.product {
	display: none;
}

.value {
	/* margin: 0 0.3vw; */
	cursor: pointer;
	color: var(--color-black);
	font-size: var(--font-size-h2);
	padding: 1rem 2rem;
	/* padding: 0.5vw 1.5vw; */
	/* border: 1px solid #ddd; */
	/* background-color: #fff; */
	/* box-shadow: 0 0 4vw rgba(0,0,0, 0.15); */
	float: left;
}

.value:hover {
	color: var(--color-magenta);
}

.value-active {
	color: var(--color-magenta);
}

#telekom .value:hover, #telekom .value-active, #mobile_telekom .value:hover, #mobile_telekom .value-active {
	color: var(--color-magenta) !important;
}

#vodafone .value:hover, #vodafone .value-active, #mobile_vodafone .value:hover, #mobile_vodafone .value-active{
	color: var(--color-vodafone-red) !important;
}

#one .value:hover, #one .value-active, #mobile_one .value:hover, #mobile_one .value-active{
	color: var(--color-one-blue) !important;
}

#yettel .value:hover, #yettel .value-active, #mobile_yettel .value:hover, #mobile_yettel .value-active {
	color: var(--color-yettel-green) !important;
}

#contact, #mobile_contact {
	display: none;
	text-align: center;
	padding: 0rem 2rem 0rem 2rem;
}

#contact input[type=text], #mobile_contact input[type=text] {
	/* border: none; */
	border-top: none;
	border-bottom: 1px solid var(--color-black);
	font-size: var(--font-size-h2);
	width: 100%;
    max-width: 300px;
	/* font-family: Roboto; */
	/* font-size: 1.5vw; */
	/* padding: 0.5vw 1.5vw; */
	/* margin: 0 2vw; */
	/* margin-bottom: 1vw; */
	/* font-weight: 300; */
	/* color: #444; */
	/* width: 29%; */
}

#contact input[type=tel] {
    font-size: var(--font-size-h2);
    width: 100%;
    max-width: 205px;
    border: none;
    border-top: none;
    border-bottom: 1px solid var(--color-white);
    border-image-slice: 15;
    border-image-source: linear-gradient(to right, var(--color-black) 27%, transparent 27%, transparent 30%, var(--color-black) 30%, var(--color-black) 44%, transparent 44%, transparent 47%, var(--color-black) 47%);
}

/* #contact input[type=tel] {
	font-size: var(--font-size-h2);
	width: 100%;
    max-width: 300px;
	border: none;
	border-top: none;
	border-bottom: 1px solid var(--color-white);
	border-image-slice: 15;
    border-image-source: linear-gradient(to right, var(--color-black) 18%, transparent 17%, transparent 21%, var(--color-black) 20%, var(--color-black) 29%, transparent 29%, transparent 32%, var(--color-black) 32%);
} */

#mobile_contact input[type=tel], .summary-phone {
	font-size: var(--font-size-h2);
	/* width: 100%; */
    /* max-width: 300px; */
    max-width: 205px;
	border: none;
	border-top: none;
	border-bottom: 1px solid var(--color-white);
	border-image-slice: 15;
    border-image-source: linear-gradient(to right, var(--color-white) 27%, transparent 27%, transparent 30%, var(--color-white) 30%, var(--color-white) 44%, transparent 44%, transparent 47%, var(--color-white) 47%);
}

#contact input[type=tel]:hover, #contact input[type=tel]:focus, #contact input[type=tel]:focus-visible {
	font-size: var(--font-size-h2);
	/* width: 100%;
    max-width: 300px; */
    max-width: 205px;
	border: none;
	border-top: none;
	border-bottom: 1px solid var(--color-magenta);
	border-image-slice: 15;
    border-image-source: linear-gradient(to right, var(--color-magenta) 27%, transparent 27%, transparent 30%, var(--color-magenta) 30%, var(--color-magenta) 44%, transparent 44%, transparent 47%, var(--color-magenta) 47%);
	outline: none;
}

#mobile_contact input[type=tel]:hover, #mobile_contact input[type=tel]:focus, #mobile_contact input[type=tel]:focus-visible, .summary-phone:hover, .summary-phone:focus, .summary-phone:focus-visible {
	font-size: var(--font-size-h2);
	/* width: 100%; */
    /* max-width: 300px; */
    max-width: 205px;
	border: none;
	border-top: none;
	border-bottom: 1px solid var(--color-magenta);
	border-image-slice: 15;
    border-image-source: linear-gradient(to right, var(--color-magenta) 27%, transparent 27%, transparent 30%, var(--color-magenta) 30%, var(--color-magenta) 44%, transparent 44%, transparent 47%, var(--color-magenta) 47%);
	outline: none;
}

.summary-phone:hover, .summary-phone:focus, .summary-phone:focus-visible {
	border-bottom: 1px solid var(--color-white);
    border-image-source: linear-gradient(to right, var(--color-white) 27%, transparent 27%, transparent 30%, var(--color-white) 30%, var(--color-white) 44%, transparent 44%, transparent 47%, var(--color-white) 47%);
}
.summary-phone {
	background-color: rgba(0, 0, 0, 0) !important;
	color: var(--color-white);
	border-bottom: 1px solid var(--color-white) !important;
}

input[type=tel].yettel:hover, input[type=tel].yettel:focus, input[type=tel].yettel:focus-visible {
	border-bottom: 1px solid var(--color-yettel-green) !important;
    border-image-source: linear-gradient(to right, var(--color-yettel-green) 27%, transparent 27%, transparent 30%, var(--color-yettel-green) 30%, var(--color-yettel-green) 44%, transparent 44%, transparent 47%, var(--color-yettel-green) 47%) !important;
}
input[type=tel].telekom:hover, input[type=tel].telekom:focus, input[type=tel].telekom:focus-visible {
	border-bottom: 1px solid var(--color-magenta) !important;
    border-image-source: linear-gradient(to right, var(--color-magenta) 27%, transparent 27%, transparent 30%, var(--color-magenta) 30%, var(--color-magenta) 44%, transparent 44%, transparent 47%, var(--color-magenta) 47%) !important;
}
input[type=tel].vodafone:hover, input[type=tel].vodafone:focus, input[type=tel].vodafone:focus-visible {
	border-bottom: 1px solid var(--color-vodafone-red) !important;
    border-image-source: linear-gradient(to right, var(--color-vodafone-red) 27%, transparent 27%, transparent 30%, var(--color-vodafone-red) 30%, var(--color-vodafone-red) 44%, transparent 44%, transparent 47%, var(--color-vodafone-red) 47%) !important;
}
input[type=tel].one:hover, input[type=tel].one:focus, input[type=tel].one:focus-visible {
	border-bottom: 1px solid var(--color-one-blue) !important;
    border-image-source: linear-gradient(to right, var(--color-one-blue) 18%, transparent 17%, transparent 21%, var(--color-one-blue) 20%, var(--color-one-blue) 29%, transparent 29%, transparent 32%, var(--color-one-blue) 32%) !important;
}

#contact input[type=text]:hover, #contact input[type=text]:focus, #contact input[type=text]:focus-visible, #mobile_contact input[type=text]:hover, #mobile_contact input[type=text]:focus, #mobile_contact input[type=text]:focus-visible {
	border: none;
	border-bottom: 1px solid var(--color-magenta);
	outline: none;
}

#contact p, #mobile_contact p {
	text-align: left;
	font-size: var(--font-size-base);
}

#order, #mobile_order {
	display: none;
	text-align: center;
	/* width: 85%; */
	/* margin: 0 auto; */
}

button {
	position: relative;
	cursor: pointer;
	/* padding: 0.5vw 5vw; */
	/* margin: 0 2vw; */
	border: 1px solid #fff;
	background-color: #d1861c;
	/* font-size: 2vw; */
	/* font-family: Quicksand; */
	font-weight: 300;
	letter-spacing: 1px;
	color: #fff;
	box-shadow: 0 0 4vw rgba(0,0,0, 0.15);
}

button::after {
  -webkit-transition: all 0.3s ease-out 0s;
  -moz-transition: all 0.3s ease-out 0s;
  -ms-transition: all 0.3s ease-out 0s;
  -o-transition: all 0.3s ease-out 0s;
  transition: all 0.3s ease-out 0s;
}

button::after {
  background: rgba(0, 0, 0, 0.09) none repeat scroll 0 0;
  content: "";
  height: 100%;
  left: 0;
  margin: auto;
  position: absolute;
  right: 0;
  top: 0;
  width: 0;
  z-index: 1;
}

#contact p.emailinfo {
	text-align: left;
	padding-left: 2.2vw;
	margin-top: 0vw;
}

button:hover::after { width: 100% }

#order p {
	text-align: center;
	font-size: 1.2vw;
}

#order .link, #order a {
	color: #353535;
	font-weight: 400;
}

::-webkit-input-placeholder { /* Edge */
	font-weight: 300;
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
	font-weight: 300;
}

::placeholder {
	font-weight: 300;
}

#showLbl {
	font-size: 1.2vw;
}

#showChk {
	margin-top: 1vw;
	margin-left: 2.2vw;
	margin-right: 1vw;
}


a {
	color: var(--color-orange);
	text-decoration: none;
}
a:hover {
	color: var(--color-orange);
	text-decoration: underline;
}

.navbar-brand:hover {
	text-decoration: none;
}
#footer a {
	color: #ABE7FB;
	text-decoration: none;
}
#footer a:hover {
	color: #ABE7FB;
	text-decoration: underline;
}

#form2 {
	color: var(--color-black);
}
/* #footer {
	position: relative;
	background-color: rgba(36,36,36, 0.8);
	width: 100%;
	min-height: 22vh;
	max-height: 16vw;
	box-sizing: border-box;
	padding: 2vw 3vw;
	color: #eee;
}


#footer .column {
	width: 30%;
	float: left;
	font-size: 1.2vw;
	line-height: 1.8;
}

#footer .center img {
	width: 90%;
	margin: 0 auto;
}

#footer .copyright {
	font-size: 1vw;
	bottom: 1vw;
}

#footer .copyright p {
	margin: 0;
	text-align: center;
}

#footer .left {
	text-align: left;
}

#footer .center {
	text-align: center;
}

#footer .right {
	text-align: right;
} */

.fs2 {
	font-size: 1.8vw;
}

.clear {
	clear: both;
}

.showcss{ display: block; }
.hidecss{ display: none !important; }

@media only screen and (max-width: 1150px) {
	/* #header {
		height: 22vh;
	} */
	
	#main h2 {
		padding: 0.2em 0.6em;
	}
	
	/* #counter { */
		/* font-size: 2.2vw; */
		/* text-align: right; */
		/* padding-right: 3%; */
	/* } */

	#main p {
		font-size: 2vw;
	}
	
	/* #contact input[type="text"], #contact input[type="tel"] {
		width: 50%;
		margin: 1vw 2vw;
	} */

	#showLbl {
		font-size: 2vw;
	}
	
	.value {
		text-align: center;
		/* float: none; */
		/* width: 20%; */
		/* margin: 1.2vw 1vw; */
	}
	
	#contact p.emailinfo {
		text-align: left;
		padding-left: 2.2vw;
	}

	/* #footer .column {
		font-size: 1.8vw;
	}
	
	#footer {
		min-height: 20vh;
		
	} */
	
	.fs2 {
		font-size: 2.5vw;
	}
}

/*** MOBILE VIEW ***/
@media only screen and (max-width: 767px) {
	/* body {
		font-size: 12px;
	}

	#certificate {
		margin: 1.5vw 3vw;
	} */

	#counter {
		/* margin-top: 5rem;  */
		background: none;
		/* padding: 1rem; */
		border-radius: 0;
	}
	
	.carousel-inner {
		min-height: 320px;
	}
	
	.product {
		grid-template-columns: 50% 50%;
	}

	.value {
		padding: 0.5rem 0.75rem;
		background-color: var(--color-white);
		border-radius: 5px;
		float: none !important;
		/* grid-template-columns: 50% 50% !important; */
		margin: 0.25rem;
	}
	
	.value-active {
		/* color: var(--color-magenta); */
		background-color: var(--color-white);
		border-radius: 5px;
	}

	.btn-group {
		width: 100%;
	}
	.btn-action {
		width: 33%;
		height: 50px;
		margin: 0px;
		border: 1px solid #073A69;
	}

	.action-1 {
		background-color: #2F80ED;
	}
	.action-2 {
		background-color: #2D9CDB;
	}
	.action-3 {
		background-color: #56CCF2;
	}

	.phone-input {
		background-color: rgba(0, 0, 0, 0) !important;
		color: var(--color-white);
		border-bottom: 1px solid var(--color-white) !important;
	}
	.phone-input::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
		color: rgba(255,255,255,0.15);
	  }
	
	/* #counter {
		font-size: 2.8vw;
	} */
	
	/* #counter .counter-item {
		height: 3.2vw;
		width: 2vw;
		font-size: 2.8vw;
		line-height: 3.2vw;
		margin-right: 0.4vw;
	} */
	
	/* #counter span {
		padding-left: 0.8vw;
	} */

	#container {
		width: 100%;
		min-height: 100vh;
		box-shadow: none;
	}
	
	#main p {
		font-size: 2.8vw;
	}

	/* #main h3 {
		font-weight: 300;
		color: #717171;
	} */

	#providers {
		width: 100%;
	}
	
	#providers .provider {
		width: 100%;
		margin: 0px;
		height: 100%;
	}
	
	#contact p.emailinfo {
		padding-left: 3.8vw;
	}

	#showLbl {
		font-size: 3.2vw;
	}
	
	#showChk {
		margin-top: 3vw;
		margin-left: 3.8vw;
		margin-right: 1.5vw;
	}
	
	/* .value {
		text-align: center;
		width: 25%;
		font-size: 3.2vw;
		margin: 1.5vw 1vw;
		padding: 1vw 1.5vw;
	} */
	
	/* #contact input[type="text"], #contact input[type="tel"] {
		margin: 1.5vw 3.6vw;
		font-size: 3.2vw;
		padding: 1vw 1.5vw;
	} */
	
	/* #order button {
		font-size: 3.4vw;
		padding: 1vw 6vw;
	} */
	
	/* #footer .column {
		font-size: 2.5vw;
	}
	
	#footer .center img {
		width: 90%;
		margin: 0 auto;
	}
	
	#footer .copyright {
		font-size: 2vw;
	} */

	.fs2 {
		font-size: 3vw;
	}
}


@media only screen and (max-width: 390px) {
	.carousel-inner {
		min-height: 510px;
	}

	.product {
		grid-template-columns: 100%;
	}
}


.mobile_phone_input, .desktop_phone_input {
	background-image: none !important
}