/*-------------------------------------------------------------------------------------- new fonts*/
@font-face {
	font-family: BrownBold;
	src: url(Brown-Bold.otf) format('opentype'),
		url(Brown-Bold.ttf) format('truetype');
}
@font-face {
	font-family: BrownLight;
	src: url(Brown-Light.otf) format('opentype'),
		url(Brown-Light.ttf) format('truetype');
}
@font-face {
	font-family: BrownRegular;
	src: url(Brown-Regular.otf) format('opentype'),
		url(Brown-Regular.ttf) format('truetype');
}
/*-------------------------------------------------------------------------------------- keyframe animations*/
@-webkit-keyframes bounce {
	0%, 20%, 50%, 80%, 100% {
		-ms-transform: translateY(0);
		-webkit-transform: translateY(0);
		transform: translateY(0);
	}
	40% {
		-ms-transform: translateY(-30px);
		-webkit-transform: translateY(-30px);
		transform: translateY(-30px);
	}
	60% {
		-ms-transform: translateY(-15px);
		-webkit-transform: translateY(-15px);
		transform: translateY(-15px);
	}
}
@keyframes bounce {
	0%, 20%, 50%, 80%, 100% {
		-ms-transform: translateY(0);
		-webkit-transform: translateY(0);
		transform: translateY(0);
	}
	40% {
		-ms-transform: translateY(-30px);
		-webkit-transform: translateY(-30px);
		transform: translateY(-30px);
	}
	60% {
		-ms-transform: translateY(-15px);
		-webkit-transform: translateY(-15px);
		transform: translateY(-15px);
	}
}
.container-fluid {
	padding: 0;
}
.formshifterText, .deformText, .defaultSliderText{
	text-align: left;
}
/*-------------------------------------------------------------------------------------- slider*/
.ui-slider-horizontal {
	height: .6em;
}
.ui-slider-horizontal .ui-slider-handle {
	-webkit-border-radius: 100%;
	-moz-border-radius: 100%;
	-ms-border-radius: 100%;
	-o-border-radius: 100%;
	border-radius: 100%;
	border: none;
	background: rgb(255, 137, 0);
}
.ui-widget-content {
	background: rgb(106, 93, 88) !important;
	/*border: 1px solid #9f9f9f !important;*/
	border: none !important;
}
/*-------------------------------------------------------------------------------------- toolset div*/
h1 {
	margin: 0;
	font-size: 1vw;
}
#toolset-div {
	background-color: rgb(231, 227, 226);
	padding-left: 5px;
	padding-right: 0px;
	border-left: 1px solid black;
}
#toolset-div * {
	letter-spacing: 4px;
	color: rgb(106, 93, 88);
	text-transform: uppercase;
	font-family: BrownRegular;
}
h1.text-center {
	font-family: BrownBold;
}
/*-------------------------------------------------------------------------------------- pleye_logo*/
#pleye_logo {
	position: fixed;
	top: 10%;
	left: 37.5%;
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	-o-transform: translateX(-50%);
	transform: translateX(-50%);
	width: 13%;
	max-width: 601px;
}
/*-------------------------------------------------------------------------------------- buttons*/
.btn {
	font-size: .8vw;
}

.btn.btn-sm {
	font-size: 0.6vw;
}

.btn.btn-lg {
	font-size: 1vw;
}

.resp-text-mini {
	font-size: .7vw;
}

#rightRow {
	padding: 0 0 0 15px;
}

#response {
	padding: 10px;
	border-radius: 5px;
}

#floater {
	display: none;
	position: fixed;
	background-color: black;
	color: white;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	border-radius: 15px;
	border: 1px solid white;
	padding: 20px;
	cursor: pointer;
	z-index: 10;
}

#floater .arrow {
	width: 40px;
	height: 40px;
	background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNi4wLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IiB3aWR0aD0iNTEycHgiIGhlaWdodD0iNTEycHgiIHZpZXdCb3g9IjAgMCA1MTIgNTEyIiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCA1MTIgNTEyIiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxwYXRoIGZpbGw9IiNGRkZGRkYiIGQ9Ik0yOTMuNzUxLDQ1NS44NjhjLTIwLjE4MSwyMC4xNzktNTMuMTY1LDE5LjkxMy03My42NzMtMC41OTVsMCwwYy0yMC41MDgtMjAuNTA4LTIwLjc3My01My40OTMtMC41OTQtNzMuNjcyICBsMTg5Ljk5OS0xOTBjMjAuMTc4LTIwLjE3OCw1My4xNjQtMTkuOTEzLDczLjY3MiwwLjU5NWwwLDBjMjAuNTA4LDIwLjUwOSwyMC43NzIsNTMuNDkyLDAuNTk1LDczLjY3MUwyOTMuNzUxLDQ1NS44Njh6Ii8+DQo8cGF0aCBmaWxsPSIjRkZGRkZGIiBkPSJNMjIwLjI0OSw0NTUuODY4YzIwLjE4LDIwLjE3OSw1My4xNjQsMTkuOTEzLDczLjY3Mi0wLjU5NWwwLDBjMjAuNTA5LTIwLjUwOCwyMC43NzQtNTMuNDkzLDAuNTk2LTczLjY3MiAgbC0xOTAtMTkwYy0yMC4xNzgtMjAuMTc4LTUzLjE2NC0xOS45MTMtNzMuNjcxLDAuNTk1bDAsMGMtMjAuNTA4LDIwLjUwOS0yMC43NzIsNTMuNDkyLTAuNTk1LDczLjY3MUwyMjAuMjQ5LDQ1NS44Njh6Ii8+DQo8L3N2Zz4=);
	background-size: contain;
	margin: 0 auto;
}

.bounce {
	-webkit-animation: bounce 3s infinite;
	animation: bounce 3s infinite;
}
#BtnOrderModal {
	position: absolute;
	bottom: 30px;
	left: 50%;
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	-o-transform: translateX(-50%);
	transform: translateX(-50%);
	border-radius: 0;
	background-color: rgb(255, 137, 0);
	border: none !important;
	color: white;
	font-size: 13pt;
	padding: 10px 50px;
	font-family: BrownBold;
}
#BtnOrderModal:focus {
	outline: 5px auto rgb(255, 137, 0);
}

/*-------------------------------------------------------------------------------------- main login*/
#eyewear-login-container {
	background-color: rgba(0, 0, 0, 0.7);
	position: fixed;
	top: 0;
	bottom: 0;
	right: 0;
	left: 0;
	z-index: 10;
}
#eyewear-login-box {
	display: block;
	padding: 30px;
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	-moz-transform:    translate(-50%, -50%);
	-ms-transform:     translate(-50%, -50%);
	-o-transform:      translate(-50%, -50%);
	transform:         translate(-50%, -50%);
	color: rgb(255, 137, 0);
	border: 3px solid rgb(255, 137, 0);
	background-color: rgb(241, 235, 235);
	font-family: BrownBold;
	min-width: 400px;
}
#eyewear-login-box input {
	border: none;
	border-bottom: 4px dashed rgb(255, 137, 0);
	background-color: rgb(241, 235, 235);
	position: relative;
	top: -14px;
}
#eyewear-login-box span {
	float: left;
}
#eyewear-login-box .btn {
	border-radius: 0;
	background-color: rgb(255, 137, 0);
	border: none !important;
	color: white;
	font-size: 25px;
	padding: 10px 50px;
	margin-top: 40px;
}
#eyewear-login-box .btn:focus {
	outline: 5px auto rgb(255, 137, 0);
}
#eyewear-login-form input, #eyewear-login-form span {
	font-size: 30px;
}
#eyewear-login-form .row {
	padding: 0 0 0 10px;
}