.gtranslate_wrapper {
	position: relative;
	width: 100%;
}

/* begin: footer, all sizes */
.footer-extra .gtranslate_wrapper {
	max-width: 300px;
	margin: 0 auto 20px;
	--translate-foreground: #008C98;
	--translate-background: #fff;
}

.footer-extra .gtranslate_wrapper select.gt_selector {
	font-size: var(--header-icon-size);
	font-family: century-gothic, sans-serif;
}
/* end: footer, all sizes */

/* begin: header, mobile sizes */
.mobile-dd-bottom .gtranslate_wrapper {
	max-width: 33%;
	margin: 0 auto;
	--translate-foreground: #fff;
	--translate-background: #008C98;
}

.mobile-dd-bottom .gtranslate_wrapper select.gt_selector {
	max-width: 195px;
	font-weight: 700;
	font-size: min(1rem, 3.5vw);
	font-family: futura-pt, sans-serif;
	line-height: 1.2rem;
	letter-spacing: 0;
	border: 0 none !important;
}

@media (max-width: 420px) {
	.panel-header .inner .mobile-nav .mobile-dd-bottom > div.gtranslate_wrapper {
		padding-left: 0;
		padding-right: 0;
	}
}
/* end: header, mobile sizes */

/* begin: header, desktop sizes */
.header-right .gtranslate_wrapper {
	--translate-foreground: #fff;
	--translate-background: #008C98;
}

.header-right .gtranslate_wrapper select.gt_selector {
	font-weight: 700;
	font-size: var(--header-icon-size);
	font-family: futura-pt, sans-serif;
	letter-spacing: 0;
	padding: .3rem 0;
}
/* end: header, desktop sizes */

/* begin: header, Indian Wells, desktop sizes */
.panel-header.indian-wells .header-right .gtranslate_wrapper {
	--translate-foreground: var(--indian-wells-light-purple);
	--translate-background: #fff;
}
/* end: header, Indian Wells, desktop sizes */

/* begin: header, Partner Portal, desktop sizes */
.panel-header.corporate .header-right .gtranslate_wrapper {
	--translate-foreground: var(--partner-portal-purple);
	--translate-background: #fff;
}
/* end: header, Partner Portal, desktop sizes */

/* begin: shared styles */
.gtranslate_wrapper select.gt_selector {
	width: 86px;
	height: auto;
	margin: 0;
	color: var(--translate-background);
	background-color: transparent;
	appearance: none;
	border: none;
	background-image:
		linear-gradient(45deg, transparent 50%, var(--translate-background) 50%),
		linear-gradient(135deg, var(--translate-background) 50%, transparent 50%);
	background-position:
		calc(100% - 20px) 13px,
		calc(100% - 15px) 13px;
	background-size:
		5px 5px,
		5px 5px;
	background-repeat: no-repeat;
}

.gtranslate_wrapper select.gt_selector:focus {
	background-image:
		linear-gradient(45deg, var(--translate-background) 50%, transparent 50%),
		linear-gradient(135deg, transparent 50%, var(--translate-background) 50%);
	background-position:
		calc(100% - 15px) 13px,
		calc(100% - 20px) 13px;
	background-size:
		5px 5px,
		5px 5px;
	background-repeat: no-repeat;
}

.gtranslate_wrapper select.gt_selector:hover {
	border-color: var(--translate-background);
}

.gtranslate_wrapper select.gt_selector option {
	color: var(--translate-background);
	background-color: var(--translate-foreground);
}
/* end: shared styles */
