/** Your theme modifications here **/
.topspace {
	min-height: 0px;
	margin-bottom: 30px;
	border: none;
	border-bottom: 1px solid transparent;
}

.navbar .yamm-content h5 {
	text-transform: none;
}

.navbar .yamm-content-atala h5 {
	font-size: 14px;
	/* font-weight: 600; */
	padding-bottom: 2px;
}

.navbar .yamm-content-atala .liv2:hover {
	background-color: #355EC0;
}

.navbar .yamm-content-atala .liv2:hover a {
	color: white !important;
}

#top {
	position: relative;
	z-index: 999;
}

#top #profile-modal .modal-header {
	background: #355EC0;
}

#top #profile-modal .modal-header h4 {
	color: #fff;
}

#top #profile-modal a {
	color: #355EC0;
}

#top #profile-modal p {
	font-weight: 300;
	margin-bottom: 20px;
}

#top .offer .btn {
	text-transform: none;
}

#content .product .text p.price del {
	color: #FF0000;
}

#content .panel.sidebar-menu ul.nav ul li.active>a {
	color: #ffffff;
	background-color: #355EC0;
	/* 4993e4; */
}

.container {
	width: 100%;
}

.ribbon.barcode {
	top: 220px;
}

.ribbon.barcode .theribbon {
	background-color: #5bc0de;
	text-shadow: 0px 1px 2px #bbb;
}

.ribbon.barcode .theribbon:after {
	border-color: #2390b0 #2390b0 transparent transparent;
}

.ribbon.sale {
	top: 25px;
}

.ribbon.sale .theribbon {
	background-color: #5cb85c;
	text-shadow: 0px 1px 2px #bbb;
}

.ribbon.sale .theribbon:after {
	border-color: #4cae4c #4cae4c transparent transparent;
}

.ribbon.pbox {
	top: 70px;
}

.ribbon.pbox .theribbon {
	background-color: #ffb833;
	text-shadow: 0px 1px 2px #bbb;
}

.ribbon.pbox .theribbon:after {
	border-color: #efa823 #efa823 transparent transparent;
}

.ribbon.onbasket {
	top: 160px;
}

.ribbon.onbasket .theribbon {
	width: 100px;
	background-color: #5bc0de;
	text-shadow: 0px 1px 2px #bbb;
}

.ribbon.onbasket .theribbon:after {
	border-color: #3386e1 #3386e1 transparent transparent;
}

.ribbon.onbasket2 {
	top: 230px;
}

.ribbon.onbasket2 .theribbon {
	width: 100px;
	background-color: #5bc0de;
	text-shadow: 0px 1px 2px #bbb;
	left: -15px;
}

.ribbon.onbasket2 .theribbon:after {
	border-color: #3386e1 #3386e1 transparent transparent;
}

.ribbon.oninevasi {
	top: 115px;
}

.ribbon.oninevasi .theribbon {
	background-color: #bfff00;
	text-shadow: 0px 1px 2px #bbb;
}

.ribbon.oninevasi .theribbon:after {
	border-color: #cfdd00 #cfdd00 transparent transparent;
}

.ribbon.ean13 {
	top: 0px;
}

.ribbon.ean13 .theribbon {
	background-color: #eeeeee;
	border-color: #000000;
	border-width: 1;
	text-shadow: 0px 1px 2px #bbb;
	width: 210px;
	padding: 2px 2px 2px 2px;
	margin: 0px 0px 0px -71px;
	left: -15px;
}

.ribbon.ean13 .theribbon:after {
	border-color: #dddddd #dddddd transparent transparent;
}

#content .product .table {
	margin-bottom: 0;
}

#productMain .table {
	margin-bottom: 0;
}

#content .product .text .buttons {
	text-align: right;
	overflow: hidden;
	margin-bottom: 0;
	vertical-align: middle;
}

#content .product .buttons {
	text-align: right;
	overflow: hidden;
	margin-bottom: 0;
	vertical-align: middle;
}

#content .product .text .codart {
	font-size: 16px;
	font-weight: 700;
	height: 20px;
	text-align: left;
	overflow: hidden;
	margin-bottom: 0;
}

#content .product .text .codrid {
	font-size: 16px;
	font-weight: 700;
	height: 20px;
	text-align: right;
	overflow: hidden;
	margin-bottom: 0;
}

#content .product .text .des001 {
	font-size: 16px;
	font-weight: 700;
	height: 20px;
	text-align: center;
	overflow: hidden;
	white-space: nowrap;
	margin-bottom: 0;
}

#content .product .text .des002 {
	font-size: 16px;
	font-weight: 700;
	height: 20px;
	text-align: center;
	overflow: hidden;
	margin-bottom: 0;
}

#content .product .text .price2 {
	font-size: 16px;
	height: 25px;
	text-align: right;
	overflow: hidden;
	margin-bottom: 0;
}

#content .product .text .disp {
	font-size: 16px;
	height: 25px;
	text-align: right;
	overflow: hidden;
	margin-bottom: 0;
}

table.dataTable tbody td .no-wrap {
	white-space: nowrap;
}

table.dataTable tbody td {
	/* padding: 10px; */
	padding: 5px;
	/* font-size: 0.92vw; */
	/* font-size: 90%; */
}

table.dataTable thead th {
	/* padding: 10px; */
	padding: 5px;
}

table.dataTable tbody th>.padding1 {
	padding-left: 1px;
	padding-right: 1px;
}

table.dataTable tbody td>.padding1 {
	padding-left: 1px;
	padding-right: 1px;
}

.font14 {
	font-size: 14px;
}

.font15 {
	font-size: 15px;
}

.font16 {
	font-size: 16px;
}

td.details-control {
	cursor: pointer;
}

tr.shown td.details-control {}

td.totale {
	font-weight: bold;
}

.text-del {
	text-decoration: line-through;
}

#content .panel.sidebar-menu .panel-body label {
	color: #555;
	/* font-size: 13px; */
	font-size: 14px;
}

#hot .promo h2 {
	text-transform: uppercase;
	font-size: 36px;
	color: #5cb85c;
	font-weight: 100;
	text-align: center;
	font-weight: bold;
	text-decoration: none;
}

#hot .promo a {
	text-decoration: none;
}

#hot .pbox h2 {
	text-transform: uppercase;
	font-size: 36px;
	color: #ffb833;
	font-weight: 100;
	text-align: center;
	font-weight: bold;
	text-decoration: none;
}

.pmese {
	padding-top: 14px;
	animation: blinker 1s linear infinite;
	font-weight: bold;
}

#advantages .box h3 a {
	color: white;
	font-weight: bold;
	text-shadow: 2px 2px 4px #000000;
}

#advantages .box p {
	color: #000000;
	font-size: 16px;
}

/* breadcrumbs */
.breadcrumb {
	font-weight: 600;
}

.breadcrumb.small {
	-webkit-box-shadow: 0 0px 0px rgba(0, 0, 0, 0);
	box-shadow: 0 0px 0px rgba(0, 0, 0, 0);
}

.breadcrumb.small {
	padding: 2px 2px;
	margin-bottom: 2px;
	background-color: #ffffff;
	border-radius: 0;
}

.breadcrumb.small ul {
	margin-bottom: 2px;
}

.breadcrumb.small>li+li:before {
	content: ">\00a0";
	color: #cccccc;
}

.breadcrumb.small>.active {
	color: #999999;
}

#content #order-summary table tr.red td,
#content #order-summary table tr.red th {
	color: red;
}

#content #order-summary table tr.green td,
#content #order-summary table tr.green th {
	color: green;
}

#content #order-summary table td.black {
	color: #000000;
}

#content #order-summary table td {
	color: #000000;
}

.dashboard-color {
	float: left;
	width: 20px;
	height: 20px;
	margin: 0px;
	border: 1px solid rgba(0, 0, 0, .2);
}

.td-30px {
	width: 40px;
}

.box .box-header {
	padding: 2px;
}

.box .box-header h3 {
	padding: 2px;
	margin: 2px;
}

.box .promo h2 {
	padding: 2px;
	margin: 2px;
}

.box .pbox h2 {
	padding: 2px;
	margin: 2px;
}

#hot .box {
	padding: 2px;
}

#content .panel.sidebar-menu ul.nav ul li a {
	font-size: 14px;
	color: #355EC0;
}

#content .panel.sidebar-menu ul.nav.category-menu li a {
	font-weight: 600;
}

/*
 * Row with equal height columns
 * --------------------------------------------------
 */
/* Small devices (landscape phones, 576px and up) */
@media (min-width: 775px) {
	.row-eq-heightV1 {
		display: -webkit-box;
		display: -webkit-flex;
		display: -ms-flexbox;
		display: flex;
	}

	.row-eq-height {
		display: flex;
		display: -webkit-flex;
		flex-wrap: wrap;
	}

	.box-eq-height {
		height: calc(100% - 30px);
	}
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {}

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {}

/* Sticky footer styles
-------------------------------------------------- */
html {
	position: relative;
	min-height: 100%;
}

body {
	font-family: "Noto Sans", Helvetica, Verdana, sans-serif;
	font-size: 16px;
	/* Margin bottom by footer height */
	margin-bottom: 60px;
	/*
  background-color: #00c196;
  background-color: #009f82;
  background-color: #71b2cf;
  background-color: #4181c0;
  background-color: #a2a2a2;
  background-color: #e0ffbf;
  background-color: #c2ff91;
  background-color: #c1ffd5;
  background-color: #c0c27c;
  background-color: #81c097;
  */
	background-color: #37605e;
}

#copyright {
	position: absolute;
	bottom: 0;
	width: 100%;
	/* Set the fixed height of the footer here */
}

/* Start Carousel */
#background-carousel {
	position: fixed;
	width: 100%;
	height: 100%;
	z-index: -1;
}

.background-carousel,
.background-carousel-inner {
	width: 100%;
	height: 100%;
	z-index: 0;
	overflow: hidden;
}

.background-carousel-item {
	width: 100%;
	height: 100%;
	background-position: center center;
	background-size: cover;
	z-index: 0;
}

#content-wrapper {
	/* position:absolute; */
	z-index: 1 !important;
	min-width: 100%;
	min-height: 100%;
}

/* End Carousel */

.text-wrap {
	white-space: normal;
}

/* .table-supercondensed */
.table-supercondensed>thead>tr>th,
.table-supercondensed>tbody>tr>th,
.table-supercondensed>tfoot>tr>th,
.table-supercondensed>thead>tr>td,
.table-supercondensed>tbody>tr>td,
.table-supercondensed>tfoot>tr>td {
	padding: 1px;
}

/* /.table-supercondensed */

/* .table-supercondensed-clean */
.table-supercondensed-clean>thead>tr>th,
.table-supercondensed-clean>tbody>tr>th,
.table-supercondensed-clean>tfoot>tr>th,
.table-supercondensed-clean>thead>tr>td,
.table-supercondensed-clean>tbody>tr>td,
.table-supercondensed-clean>tfoot>tr>td {
	padding: 1px;
	border: none;
}

/* /.table-clean */

/* .table-clean */
.table-clean>thead>tr>th,
.table-clean>tbody>tr>th,
.table-clean>tfoot>tr>th,
.table-clean>thead>tr>td,
.table-clean>tbody>tr>td,
.table-clean>tfoot>tr>td {
	border: none;
}

/* /.table-clean */

.no-wrap {
	white-space: nowrap;
}

.addbasket-rpc {
	margin: 5px;
}

.dummy-rpc {
	margin: 5px;
}

.scrollable-300 {
	overflow-y: scroll;
	height: 300px;
	width: 100%;
}

.scrollable-150 {
	overflow-y: scroll;
	height: 150px;
	width: 100%;
}

.zoom_transition {
	-webkit-transform: scale(2.6);
	-moz-transform: scale(2.6);
	-o-transform: scale(2.6);
	transform: scale(2.6);
}

.superzoom_transition {
	-webkit-transform: scale(5.6);
	-moz-transform: scale(5.6);
	-o-transform: scale(5.6);
	transform: scale(5.6);
	z-index: 999;
}

#productimg {
	-webkit-transition: all .4s ease-in-out;
	-moz-transition: all .4s ease-in-out;
	-o-transition: all .4s ease-in-out;
	-ms-transition: all .4s ease-in-out;
}

#productimg {
	height: 150px;
	z-index: 999;
}

.imgontable {
	height: 40px;
	max-height: 40px;
	max-width: 40px;
}

.imgontablemodal {
	height: 40px;
	max-height: 40px;
	max-width: 40px;
}

a i.fa,
button i.fa {
	margin: 0 1px;
}

div.Section1 {
	width: 870px;
	background-position: center;
}

.title-atala {
	font-family: Calibri, Arial, Verdana, Helvetica, sans-serif;
	font-size: 36px;
	color: #FFFFFF;
	font-weight: bold;
	text-decoration: none;
}

.condizioni a:link,
.condizioni a:visited,
.condizioni a:hover {
	font-weight: bold;
	text-decoration: none;
	color: #000;
}

.text-white {
	color: #ffffff;
}

.text-warning {
	color: #f0ad4e;
}

.text-netto {
	color: #0000ff;
	font-weight: bold;
}

.text-promo {
	color: #4cae4c;
	font-weight: bold;
}

.text-600 {
	/* font-weight: 600; */
}

.modal-title {
	font-weight: 600;
}

.inscadenza {
	font-weight: 300;
	font-size: 16px;
	color: black;
	/* text-shadow: 2px 2px 4px #000000; */
}

.xxtitolo_pbox:hover {
	color: #ffb833;
}

#advantages .box h3 a:hover {
	color: #000000;
	text-shadow: 2px 2px 4px #ffb833;
}

.in-error {
	border: 1px solid red;
	border-color: red;
	border-width: medium;
	color: red;
}

.in-error-lite {
	border-color: red;
	border-width: medium;
	color: red;
}

.blink_me {
	-webkit-animation-name: blinker;
	-webkit-animation-duration: 1s;
	-webkit-animation-timing-function: linear;
	-webkit-animation-iteration-count: infinite;

	-moz-animation-name: blinker;
	-moz-animation-duration: 1s;
	-moz-animation-timing-function: linear;
	-moz-animation-iteration-count: infinite;

	animation-name: blinker;
	animation-duration: 1s;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
}

@-moz-keyframes blinker {
	0% {
		opacity: 1.0;
	}

	50% {
		opacity: 0.0;
	}

	100% {
		opacity: 1.0;
	}
}

@-webkit-keyframes blinker {
	0% {
		opacity: 1.0;
	}

	50% {
		opacity: 0.0;
	}

	100% {
		opacity: 1.0;
	}
}

@keyframes blinker {
	0% {
		opacity: 1.0;
	}

	50% {
		opacity: 0.0;
	}

	100% {
		opacity: 1.0;
	}
}

.largeModal {
	width: 900px;
	margin: auto;
}

.smallModal {
	width: 300px;
	margin: auto;
}

.form-control {
	font-size: 16px;
}

#copyright a {
	color: white;
}

.bg-blue {
	background-color: #355EC0;
	;
}

.bg-red {
	background-color: #ff8888;
	;
}

.dropdown-menu>li>a:focus,
.dropdown-menu>li>a:hover {
	background-color: #4993e4;
}

.dropdown-header {
	color: #fff;
	font-weight: bold;
	text-decoration: underline;
}

/* loading */
#divLoading {
	display: none;
}

#divLoading.show {
	display: block;
	position: fixed;
	z-index: 100;
	background-image: url('../img/ajax-loader.gif');
	background-color: #666;
	opacity: 0.4;
	background-repeat: no-repeat;
	background-position: center;
	left: 0;
	bottom: 0;
	right: 0;
	top: 0;
}

#loadinggif.show {
	left: 50%;
	top: 50%;
	position: absolute;
	z-index: 101;
	width: 32px;
	height: 32px;
	margin-left: -16px;
	margin-top: -16px;
}

div.content {
	width: 1000px;
	height: 1000px;
}

.navbar-default .navbar-nav>.open>a,
.navbar-default .navbar-nav>.open>a:hover,
.navbar-default .navbar-nav>.open>a:focus {
	color: #ffffff;
}

.hidden {
	display: none;
}

.textblack {
	font: #000000;
}

#content #basket .table tbody tr td input.selection {
	width: auto;
}

.chart-containerX {
	position: relative;
	margin: auto;
	height: 80vh;
	width: 80vw;
}

.textrounded {
	-moz-border-radius: 10px;
	/* Firefox */
	-webkit-border-radius: 10px;
	/* Safari, Chrome */
	-khtml-border-radius: 10px;
	/* KHTML */
	border-radius: 10px;
	/* CSS3 */
	behavior: url("border-radius.htc");
}

.textbold {
	font-weight: bold;
}

.carousel-fade .carousel-inner .item {
	opacity: 0;
	transition-property: opacity;
}

.carousel-fade .carousel-inner .active {
	opacity: 1;
}

.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right {
	left: 0;
	opacity: 0;
	z-index: 1;
}

.carousel-fade .carousel-inner .next.left,
.carousel-fade .carousel-inner .prev.right {
	opacity: 1;
}

.carousel-fade .carousel-control {
	z-index: 2;
}

@media all and (transform-3d),
(-webkit-transform-3d) {

	.carousel-fade .carousel-inner>.item.next,
	.carousel-fade .carousel-inner>.item.active.right {
		opacity: 0;
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
	}

	.carousel-fade .carousel-inner>.item.prev,
	.carousel-fade .carousel-inner>.item.active.left {
		opacity: 0;
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
	}

	.carousel-fade .carousel-inner>.item.next.left,
	.carousel-fade .carousel-inner>.item.prev.right,
	.carousel-fade .carousel-inner>.item.active {
		opacity: 1;
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
	}
}

.carousel.vertical {
	position: relative;
}

.carousel.vertical .carousel-inner {
	height: 100%;
	width: auto;
}

.carousel.vertical .carousel-inner>.item {
	width: auto;
	/* set the animation duration to 1 second */
	transition: 1s ease-in-out;
	transform: translate3d(0, 100%, 0);
	top: 0;
}

.carousel.vertical .carousel-inner>.next,
.carousel.vertical .carousel-inner>.prev,
.carousel.vertical .carousel-inner>.right {
	transform: translate3d(0, 100%, 0);
	top: 0;
}

.carousel.vertical .carousel-inner>.left,
.carousel.vertical .carousel-inner>.prev.right,
.carousel.vertical .carousel-inner>.next.left,
.carousel.vertical .carousel-inner>.active {
	transform: translate3d(0, 0, 0);
	top: 0;
}

.carousel.vertical .carousel-inner>.active.right,
.carousel.vertical .carousel-inner>.active.left {
	transform: translate3d(0, -100%, 0);
	top: 0;
}

.carousel.vertical .carousel-indicators {
	display: inline-block;
	width: auto;
	padding: 0;
	margin: 0;
	left: auto;
	right: 10px;
	bottom: 2px;
	z-index: 9;
	font-size: 0;
}

.carousel.vertical .carousel-indicators li {
	border: none;
	cursor: pointer;
	display: inline-block;
	width: 18px;
	height: 18px;
	text-indent: -9999px;
	background: url("https://grgs.ro/1/i/sprite.png") no-repeat -528px -502px;
}

.carousel.vertical .carousel-indicators li.active {
	background-position: -528px -524px;
}

.inline {
	display: inline-block;
}

.circle {
	width: 20px;
	height: 20px;
	background: black;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
}

.pratica-status-0 {
	background: #cccccc;
}

.pratica-status-1 {
	background: #ffe22a;
}

.pratica-status-2 {
	background: #efde9e;
}

.pratica-status-3 {
	background: #4993e4;
}

.pratica-status-4 {
	background: #f442eb;
}

.pratica-status-5 {
	background: #5cb85c;
}

.pratica-status-6 {
	background: #f0ad4e;
}

.pratica-status-7 {
	background: #d9534f;
}

.btn-status-0 {
	background: #cccccc;
}

.btn-status-1 {
	background: #ffe22a;
}

.btn-status-2 {
	background: #efde9e;
}

.btn-status-3 {
	background: #4993e4;
}

.btn-status-4 {
	background: #f442eb;
}

.btn-status-5 {
	background: #5cb85c;
}

.btn-status-6 {
	background: #f0ad4e;
}

.btn-status-7 {
	background: #d9534f;
}

.switch {
	position: relative;
	display: inline-block;
	width: 60px;
	height: 34px;
}

.switch input {
	opacity: 0;
	width: 0;
	height: 0;
}

.slider {
	position: absolute;
	cursor: pointer;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #ccc;
	-webkit-transition: .4s;
	transition: .4s;
}

.slider:before {
	position: absolute;
	content: "";
	height: 26px;
	width: 26px;
	left: 4px;
	bottom: 4px;
	background-color: white;
	-webkit-transition: .4s;
	transition: .4s;
}

input:checked+.slider {
	background-color: #355EC0;
}

input:focus+.slider {
	box-shadow: 0 0 1px #355EC0;
}

input:checked+.slider:before {
	-webkit-transform: translateX(26px);
	-ms-transform: translateX(26px);
	transform: translateX(26px);
}

/* Rounded sliders */
.slider.round {
	border-radius: 34px;
}

.slider.round:before {
	border-radius: 50%;
}

.autocomplete-suggestions {
	border: 1px solid #999;
	background: #FFF;
	overflow: auto;
}

.autocomplete-suggestion {
	padding: 2px 5px;
	white-space: nowrap;
	overflow: hidden;
}

.autocomplete-selected {
	background: #F0F0F0;
}

.autocomplete-suggestions strong {
	font-weight: normal;
	color: #3399FF;
}

.autocomplete-group {
	padding: 2px 5px;
}

.autocomplete-group strong {
	display: block;
	border-bottom: 1px solid #000;
}

input {
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}

textarea {
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}

.autosize {
	width: -moz-available;
}

#uploadPreview-preview input {
	line-height: 400px;
	font-size: 31px;
}

tr.d0 td {
	background-color: #cceeff;
	color: black;
}

tr.d1 td {
	background-color: #FFFFFF;
	color: black;
}

.pre-scrollable {
	white-space: pre-line;
	word-break: normal;
	max-height: 250px;
	font-family: "Noto Sans", Helvetica, Verdana, sans-serif;
	font-size: 9px;
}

div.dt-buttons {
	float: right;
}

button.dt-button,
div.dt-button,
a.dt-button {
	font-weight: normal;
	/* font-family: "Roboto", Helvetica, Arial, sans-serif; */
	/* font-family: Trebuchet MS, Lucida Grande, Lucida Sans Unicode, Lucida Sans, Tahoma, sans-serif; */
	padding: 6px 12px;
	font-size: 14px;
	line-height: 1;
	border-radius: 3px;
}


#modal-divLoading {
	position: absolute;
	top: 0;
	z-index: 100;
	width: 100%;
	height: 100%;
	display: none;
	background: rgba(0, 0, 0, 0.6);
}

.cv-spinner {
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
}

.spinner {
	width: 40px;
	height: 40px;
	border: 4px #ddd solid;
	border-top: 4px #2e93e6 solid;
	border-radius: 50%;
	animation: sp-anime 0.8s infinite linear;
}

@keyframes sp-anime {
	0% {
		transform: rotate(0deg);
	}

	100% {
		transform: rotate(359deg);
	}
}

.owl-carousel .owl-item img {
	width: auto;
}

/* Make it a marquee */
.marquee {
	margin: 0 auto;
	white-space: nowrap;
	overflow: hidden;
}

.marquee span {
	display: inline-block;
	padding-left: 100%;
	animation: marquee 20s linear infinite;
}

/* Make it move */
@keyframes marquee {
	0% {
		transform: translate(0, 0);
	}

	100% {
		transform: translate(-100%, 0);
	}
}

/* ####################################################### */
/* NEW EFFECTS 2025-08-08 */
/* ####################################################### */

/* NEON */
.neon-text {
	/* font-size: 4rem; */
	color: #fff;
	text-shadow: 0 0 5px #ff005e, 0 0 10px #ff005e, 0 0 20px #ff005e, 0 0 40px #ff005e, 0 0 80px #ff005e;
	animation: glow 1.5s infinite alternate;
}

@keyframes glow {
	0% {
		text-shadow: 0 0 5px #ff005e, 0 0 10px #ff005e, 0 0 20px #ff005e, 0 0 40px #ff005e, 0 0 80px #ff005e;
	}

	100% {
		text-shadow: 0 0 10px #00d4ff, 0 0 20px #00d4ff, 0 0 40px #00d4ff, 0 0 80px #00d4ff, 0 0 160px #00d4ff;
	}
}

/* ANIMATION: VARIABLE */
@font-face {
	font-family: 'Inconsolata';
	src: url('https://ggayane.github.io/css-experiments/Inconsolata-VF.ttf');
	font-weight: 275 900;
	font-stretch: 50% 200%;
}

.variable-container {
	/* margin: 0; */
	/* padding: 0; */
	/* width: 100vw; */
	/* height: 100vh; */
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	/* background-color: black; */
	/* color: white; */
	font-size: 8em;
	font-family: 'Inconsolata';

	white-space: nowrap;
	/* width: 80vw; */
	/* margin: auto; */

	display: flex;
	font-variation-settings: "wght" 275, "wdth" 50;
	text-align: center;
	animation: swapthings 3s infinite both cubic-bezier(0.17, 0.04, 0.04, 0.99);
}

.variable-text {
	animation: swapthings2 3s infinite both cubic-bezier(0.17, 0.04, 0.04, 0.99);
}

@keyframes swapthings {
	0% {
		font-variation-settings: "wght" 275, "wdth" 50;
	}

	50% {
		font-variation-settings: "wght" 900, "wdth" 200;
	}

	100% {
		font-variation-settings: "wght" 275, "wdth" 50;
	}
}

@keyframes swapthings2 {
	0% {
		font-variation-settings: "wght" 900, "wdth" 200;
	}

	50% {
		font-variation-settings: "wght" 275, "wdth" 50;
	}

	100% {
		font-variation-settings: "wght" 900, "wdth" 200;
	}
}

/* BUTTONS */
.btn {
	border-radius: 100px;
}

/* BOX */
.box {
	border-radius: 8px;
	box-shadow: 3px 4px 5px 0px rgba(0, 0, 0, 0.38);
}

/* DROPDOWN */
.dropdown-menu {
	border-radius: 8px;
	box-shadow: 3px 4px 5px 0px rgba(0, 0, 0, 0.38);
}

/* RIBBON */
.ribbon .theribbon {
	width: 90px;
}
.theribbon {
	border-radius: 0px 8px 8px 0px;
}

.product {
	border-radius: 8px;
	box-shadow: 3px 4px 5px 0px rgba(0, 0, 0, 0.38);
}

/* HOVER XXX*/
.Yixuan-container {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	font-family: "Poppins", sans-serif;

	display: flex;
	justify-content: right;
	align-items: center;
	/* min-height: 100vh; */
	text-align: center;
}

ul.Yixuan-list {
	display: flex;
	position: relative;
	gap: 25px;
}

ul.Yixuan-list li.Yixuan-element {
	position: relative;
	list-style: none;
	width: 30px;
	height: 30px;
	background: white;
	box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
	border-radius: 30px;
	cursor: pointer;
	display: flex !important;
	justify-content: center;
	align-items: center;
	transition: 0.5s;
}

ul.Yixuan-list li.Yixuan-element::before {
	content: "" !important;
	position: absolute;
	inset: 0;
	border-radius: 30px;
	background: linear-gradient(45deg, var(--i), var(--j));
	opacity: 0;
	transition: 0.5s;
}

ul.Yixuan-list li.Yixuan-element::after {
	content: "";
	position: absolute;
	top: 10px;
	width: 100%;
	height: 100%;
	border-radius: 30px;
	background: linear-gradient(45deg, var(--i), var(--j));
	transition: 0.5s;
	filter: blur(15px);
	z-index: -1;
	opacity: 0;
}

ul.Yixuan-list li.Yixuan-element:hover {
	width: 180px;
	box-shadow: 0 10px 25px rgba(0, 0, 0, 0);
}

ul.Yixuan-list li.Yixuan-element:hover::before {
	opacity: 1;
}

ul.Yixuan-list li.Yixuan-element:hover::after {
	opacity: 0.5;
}

ul.Yixuan-list li.Yixuan-element ion-icon {
	color: #777;
	font-size: 1.75em;
	transition: 0.5s;
	transition-delay: 0.25s;
}

ul.Yixuan-list li.Yixuan-element:hover ion-icon {
	transform: scale(0);
	color: #fff;
	transition-delay: 0s;
}

ul.Yixuan-list li.Yixuan-element span {
	position: absolute;
}

ul.Yixuan-list li.Yixuan-element .title {
	color: #fff;
	font-size: 1.1em;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	transform: scale(0);
	transition: 0.5s;
	transition-delay: 0s;
}

ul.Yixuan-list li.Yixuan-element:hover .title {
	transform: scale(1);
	transition-delay: 0.25s;
}

@media (max-width: 767px) {
	#content .product .flip-container img.img-responsive {
		min-width: auto;
	}
}

#content .product .flip-container,
#content .product .front,
#content .product .back {
	width: 100%;
}

#top ul.menu>li+li:before {
	content: none;
	/* padding: 0 5px;
	color: #f7f7f7; */
}
