/*==================================================================================
=            GENERAL
==================================================================================*/
/*
	BASELINE FONT SIZE
	6px		37.50%
	7px		43.75%
	8px		50.00%
	9px		56.25%
	10px	62.50%
*/
html {
	font-size: 50%;
}
@media (min-width: 576px) {
	html { font-size: 50%; }
}
@media (min-width: 768px) {
	html { font-size: 50%; }
}
@media (min-width: 992px) {
	html { font-size: 56.25%; }
}
@media (min-width: 1200px) {
	html { font-size: 62.5%; }
}

body {
	font-family: 'Roboto', sans-serif;
	font-weight: 400;
	margin-top: 100px;
}
main {
	margin-bottom: 50px;
}
.page-landing main {
	margin-bottom: 0;
}
@media (max-width: 767px) {
	body {
		margin-top: 70px;
		margin-bottom: 0;
    }
}
body.page-landing {
	margin-top: 0;
	margin-bottom: 0;
}

a { color: #db1f26; }
a:hover, a:focus { color: #000; text-decoration: underline; }
.link-underlined { text-decoration: underline; }

a:hover {
	outline: none;
}
a:focus, input:hover, input:focus, textarea:hover, textarea:focus {
	outline: none;
	box-shadow: none !important;
}
button { cursor: pointer; }
strong { font-weight: 700; }

.ff-marker { font-family: 'Permanent Marker', cursive !important; }
.ff-robmono { font-family: 'Roboto Mono', monospace !important; }


.fs-11 { font-size: 1.1rem !important; line-height: 150% !important; }
.fs-12 { font-size: 1.2rem !important; line-height: 150% !important; }
.fs-13 { font-size: 1.3rem !important; line-height: 150% !important; }
.fs-14 { font-size: 1.4rem !important; line-height: 150% !important; }
.fs-15 { font-size: 1.5rem !important; line-height: 150% !important; }
.fs-16 { font-size: 1.6rem !important; line-height: 150% !important; }
.fs-18 { font-size: 1.8rem !important; line-height: 150% !important; }
.fs-20 { font-size: 2.0rem !important; line-height: 150% !important; }
.fs-21 { font-size: 2.1rem !important; line-height: 150% !important; }
.fs-22 { font-size: 2.2rem !important; line-height: 150% !important; }
.fs-24 { font-size: 2.4rem !important; line-height: 150% !important; }
.fs-28 { font-size: 2.8rem !important; line-height: 150% !important; }
.fs-30 { font-size: 3.0rem !important; line-height: 150% !important; }
.fs-32 { font-size: 3.2rem !important; line-height: 150% !important; }
.fs-35 { font-size: 3.5rem !important; line-height: 150% !important; }
.fs-40 { font-size: 4.0rem !important; line-height: 150% !important; }
.fs-48 { font-size: 4.8rem !important; line-height: 130% !important; }
.fs-50 { font-size: 5.0rem !important; line-height: 130% !important; }
.fs-60 { font-size: 6.0rem !important; line-height: 130% !important; }
.fs-72 { font-size: 7.2rem !important; line-height: 8.2rem !important; }

.lh-11 { line-height: 1.1rem !important; }
.lh-13 { line-height: 1.3rem !important; }
.lh-14 { line-height: 1.4rem !important; }
.lh-16 { line-height: 1.6rem !important; }
.lh-18 { line-height: 1.8rem !important; }
.lh-20 { line-height: 2.0rem !important; }
.lh-21 { line-height: 2.1rem !important; }
.lh-24 { line-height: 2.4rem !important; }
.lh-28 { line-height: 2.8rem !important; }
.lh-30 { line-height: 3.0rem !important; }
.lh-32 { line-height: 3.2rem !important; }
.lh-40 { line-height: 4.0rem !important; }
.lh-48 { line-height: 4.8rem !important; }
.lh-34 { line-height: 3.4rem !important; }

.border-radius-4 { border-radius: 4px; }
.border-gray { border: solid 1px #e8e8e8;cursor: hand; cursor: pointer; }

.color-red { color: #db1f26; }
.color-red-imp, .color-red-imp:hover { color: #db1f26 !important; }
.color-red-links a { color: #db1f26 !important; }
.color-hover-red:hover, .color-hover-red:hover * { color: #db1f26 !important; }

.color-green { color: #008E26; }
.color-white { color: #fff; }
.color-yellow { color: #E0DD37; }
.color-hover-white:hover { color: #fff; }
.color-black { color: #000; }
.color-black-imp, .color-black-imp:hover { color: #000 !important; }
.color-white-imp, .color-white-imp:hover { color: #fff !important; }
.color-white-links a { color: #fff !important; }
.color-gray-666 { color: #666; }
.color-gray-333 { color: #333 !important; }
.color-gray-96 { color: #969696; }
.color-gray-b0 { color: #b0b0b0; }

.back-color-red { background-color: #db1f26; }
.back-color-hover-red:hover { background-color: #db1f26; }
.back-color-white { background-color: #fff; }
.back-color-white-90 { background-color: rgba(255,255,255,0.9); }
.back-color-gray-e8 { background-color: #e8e8e8; }
.back-color-hover-gray-e8:hover { background-color: #e8e8e8; }
.back-color-gray-666 { background-color: #666; }
.back-color-gray-c9 { background-color: #c9c9c9; }
.back-color-gray-ef { background-color: #efefef; }

.fw-thin { font-weight: 100 !important; }
.fw-light { font-weight: 300 !important; }
.fw-medium { font-weight: 500 !important; }
.fw-bold { font-weight: 700 !important; }
.fw-black { font-weight: 900 !important; }

.va-sub { vertical-align: sub; }
.va-middle { vertical-align: middle; }
.va-txt-bot { vertical-align: text-bottom; }

.no-uppercase { text-transform: inherit !important; }

.pointer { cursor: pointer; }

.shadow-bottom {
	-webkit-box-shadow: 0px 2px 10px 0px rgba(0,0,0,0.16);
	   -moz-box-shadow: 0px 2px 10px 0px rgba(0,0,0,0.16);
	        box-shadow: 0px 2px 10px 0px rgba(0,0,0,0.16);
}
.shadow-bottom-only::after {
	content: "";
    position: absolute;
    width: 100%;
    height: 10px;
    left: 0;
    bottom: 0px;
    z-index: -1;
	-webkit-box-shadow: -5px 2px 10px 0px rgba(0,0,0,0.16);
	   -moz-box-shadow: -5px 2px 10px 0px rgba(0,0,0,0.16);
	        box-shadow: -5px 2px 10px 0px rgba(0,0,0,0.16);
}
@media (max-width: 1199px) {
	.shadow-bottom-only::after {
		-webkit-box-shadow: 0px 2px 10px 0px rgba(0,0,0,0.16);
		   -moz-box-shadow: 0px 2px 10px 0px rgba(0,0,0,0.16);
		        box-shadow: 0px 2px 10px 0px rgba(0,0,0,0.16);
	}	
}
.shadow-top {
	-webkit-box-shadow: 0px -2px 10px 0px rgba(0,0,0,0.16);
	   -moz-box-shadow: 0px -2px 10px 0px rgba(0,0,0,0.16);
	        box-shadow: 0px -2px 10px 0px rgba(0,0,0,0.16);
}
.shadow-center {
	-webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.16);
	   -moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.16);
	        box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.16);
}
.hover-shadow-inside:hover {
	-webkit-box-shadow: inset 0px 0px 0px 2px #db1f26 !important;
	   -moz-box-shadow: inset 0px 0px 0px 2px #db1f26 !important;
	        box-shadow: inset 0px 0px 0px 2px #db1f26 !important;
}
.hover-border-red:hover {
	border: solid 1px #db1f26;
}

.border-top-green {
	border-top: solid 2px #008E26;
}
.border-top-red {
	border-top: solid 2px #db1f26;
}
.border-color-ccc {
	border: solid 1px #ccc;
}

.icon-round {
	display: inline-block;
	width: 3rem;
	height: 3rem;
	border-radius: 50%;
	text-align: center;
	line-height: 3rem !important;
}
.icon-round.back-color-white:hover,
a:hover .icon-round.back-color-white {
	background: #db1f26;
}
.icon-round.color-red:hover,
a:hover .icon-round.color-red {
	color: #fff;
}
.icon-round.back-color-red:hover,
.link-like:hover .icon-round.back-color-red,
a:hover .icon-round.back-color-red:hover {
	background: #000;
}
.icon-round.color-white:hover,
.link-like:hover .icon-round.color-white,
a:hover .icon-round.color-white:hover {
	color: #db1f26;
}

h1, h2, h3 {
}

/*
font-family: 'Roboto', sans-serif;
100 this
300 light
400 regular
500 medium
700 bold
900 black
*/

.opacity-50 { opacity: 0.5; }

a:hover {
}
a.underline {
	text-decoration: underline !important;
}
a.no-underline {
	text-decoration: none !important;
}

a.underlined, a.underlined:hover {
	position: relative;
	text-decoration: none;
}
a.underlined::before {
	content: "";
	position: absolute;
	width: 100%;
	height: 1px;
	bottom: 0;
	left: 0;
	background-color: #db1f26;
	visibility: hidden;
	-webkit-transform: scaleX(0);
	   -moz-transform: scaleX(0);
		-ms-transform: scaleX(0);
			transform: scaleX(0);
	-webkit-transition: all 0.3s ease-in-out 0s;
	   -moz-transition: all 0.3s ease-in-out 0s;
		-ms-transition: all 0.3s ease-in-out 0s;
		 -o-transition: all 0.3s ease-in-out 0s;
			transition: all 0.3s ease-in-out 0s;
}
a.underlined:hover::before {
	visibility: visible;
	-webkit-transform: scaleX(1);
	   -moz-transform: scaleX(1);
		-ms-transform: scaleX(1);
			transform: scaleX(1);
}


a, a img, input, button, textarea, .animated {
	-webkit-transition: all 0.2s ease-in-out;
	   -moz-transition: all 0.2s ease-in-out;
		-ms-transition: all 0.2s ease-in-out;
		 -o-transition: all 0.2s ease-in-out;
			transition: all 0.2s ease-in-out;
}
/*
a:hover, a:focus, a:active, 
a img:hover, a img:focus, a img:active, 
input:hover, input:focus, input:active, 
textarea:hover, textarea:focus, textarea:active, 
.animated:hover, .animated:focus, .animated:active {
	-webkit-transition: all 0.3s ease-in;
	   -moz-transition: all 0.3s ease-in;
		-ms-transition: all 0.3s ease-in;
		 -o-transition: all 0.3s ease-in;
			transition: all 0.3s ease-in;
}
*/
.animatedFast, .animated-all, .animated-all * {
	-webkit-transition: all 0.1s linear !important;
	   -moz-transition: all 0.1s linear !important;
		-ms-transition: all 0.1s linear !important;
		 -o-transition: all 0.1s linear !important;
			transition: all 0.1s linear !important;
}
.animatedFast2, .animatedFast2:focus, .animatedFast2:active {
	-webkit-transition: all 0.3s ease-out !important;
	   -moz-transition: all 0.3s ease-out !important;
		-ms-transition: all 0.3s ease-out !important;
		 -o-transition: all 0.3s ease-out !important;
			transition: all 0.3s ease-out !important;
}


.btn-gradient {
	display: inline-block;
	background: rgba(134,10,6,1);
	background: -moz-linear-gradient(-45deg, rgba(134,10,6,1) 0%, rgba(129,8,4,1) 13%, rgba(184,20,5,1) 23%, rgba(151,12,7,1) 36%, rgba(218,26,20,1) 66%, rgba(141,11,6,1) 81%, rgba(115,8,6,1) 88%, rgba(115,8,6,1) 100%);
	background: -webkit-gradient(left top, right bottom, color-stop(0%, rgba(134,10,6,1)), color-stop(13%, rgba(129,8,4,1)), color-stop(23%, rgba(184,20,5,1)), color-stop(36%, rgba(151,12,7,1)), color-stop(66%, rgba(218,26,20,1)), color-stop(81%, rgba(141,11,6,1)), color-stop(88%, rgba(115,8,6,1)), color-stop(100%, rgba(115,8,6,1)));
	background: -webkit-linear-gradient(-45deg, rgba(134,10,6,1) 0%, rgba(129,8,4,1) 13%, rgba(184,20,5,1) 23%, rgba(151,12,7,1) 36%, rgba(218,26,20,1) 66%, rgba(141,11,6,1) 81%, rgba(115,8,6,1) 88%, rgba(115,8,6,1) 100%);
	background: -o-linear-gradient(-45deg, rgba(134,10,6,1) 0%, rgba(129,8,4,1) 13%, rgba(184,20,5,1) 23%, rgba(151,12,7,1) 36%, rgba(218,26,20,1) 66%, rgba(141,11,6,1) 81%, rgba(115,8,6,1) 88%, rgba(115,8,6,1) 100%);
	background: -ms-linear-gradient(-45deg, rgba(134,10,6,1) 0%, rgba(129,8,4,1) 13%, rgba(184,20,5,1) 23%, rgba(151,12,7,1) 36%, rgba(218,26,20,1) 66%, rgba(141,11,6,1) 81%, rgba(115,8,6,1) 88%, rgba(115,8,6,1) 100%);
	background: linear-gradient(135deg, rgba(134,10,6,1) 0%, rgba(129,8,4,1) 13%, rgba(184,20,5,1) 23%, rgba(151,12,7,1) 36%, rgba(218,26,20,1) 66%, rgba(141,11,6,1) 81%, rgba(115,8,6,1) 88%, rgba(115,8,6,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#860a06', endColorstr='#730806', GradientType=1 );
	background-size: 200% 100%;
	background-position: 0% 50%;
	-webkit-box-shadow: 0 0 0.6rem 0 rgba(0,0,0,0.25);
	   -moz-box-shadow: 0 0 0.6rem 0 rgba(0,0,0,0.25);
	        box-shadow: 0 0 0.6rem 0 rgba(0,0,0,0.25);
	       text-shadow: 0 0 0.4rem 0 rgba(0, 0, 0, 1);
	color: #fff;
	font-weight: 700;
	font-size: 2rem;
	padding: 1.2rem 2rem 1rem;
	line-height: 1rem;
	border-radius: 4px;
}
.btn-gradient:hover {
	-webkit-animation: gradient 2.5s ease infinite;
	   -moz-animation: gradient 2.5s ease infinite;
	        animation: gradient 2.5s ease infinite;
}
.premium-buttons button.btn-primary {
	background: rgba(134,10,6,1);
	background: -moz-linear-gradient(-45deg, rgba(134,10,6,1) 0%, rgba(129,8,4,1) 13%, rgba(184,20,5,1) 23%, rgba(151,12,7,1) 36%, rgba(218,26,20,1) 66%, rgba(141,11,6,1) 81%, rgba(115,8,6,1) 88%, rgba(115,8,6,1) 100%);
	background: -webkit-gradient(left top, right bottom, color-stop(0%, rgba(134,10,6,1)), color-stop(13%, rgba(129,8,4,1)), color-stop(23%, rgba(184,20,5,1)), color-stop(36%, rgba(151,12,7,1)), color-stop(66%, rgba(218,26,20,1)), color-stop(81%, rgba(141,11,6,1)), color-stop(88%, rgba(115,8,6,1)), color-stop(100%, rgba(115,8,6,1)));
	background: -webkit-linear-gradient(-45deg, rgba(134,10,6,1) 0%, rgba(129,8,4,1) 13%, rgba(184,20,5,1) 23%, rgba(151,12,7,1) 36%, rgba(218,26,20,1) 66%, rgba(141,11,6,1) 81%, rgba(115,8,6,1) 88%, rgba(115,8,6,1) 100%);
	background: -o-linear-gradient(-45deg, rgba(134,10,6,1) 0%, rgba(129,8,4,1) 13%, rgba(184,20,5,1) 23%, rgba(151,12,7,1) 36%, rgba(218,26,20,1) 66%, rgba(141,11,6,1) 81%, rgba(115,8,6,1) 88%, rgba(115,8,6,1) 100%);
	background: -ms-linear-gradient(-45deg, rgba(134,10,6,1) 0%, rgba(129,8,4,1) 13%, rgba(184,20,5,1) 23%, rgba(151,12,7,1) 36%, rgba(218,26,20,1) 66%, rgba(141,11,6,1) 81%, rgba(115,8,6,1) 88%, rgba(115,8,6,1) 100%);
	background: linear-gradient(135deg, rgba(134,10,6,1) 0%, rgba(129,8,4,1) 13%, rgba(184,20,5,1) 23%, rgba(151,12,7,1) 36%, rgba(218,26,20,1) 66%, rgba(141,11,6,1) 81%, rgba(115,8,6,1) 88%, rgba(115,8,6,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#860a06', endColorstr='#730806', GradientType=1 );
	background-size: 200% 100%;
	background-position: 0% 50%;
	border-color: #db1f26;
}
.premium-buttons button.btn-primary:hover {
	-webkit-animation: gradient 2.5s ease infinite;
	   -moz-animation: gradient 2.5s ease infinite;
	        animation: gradient 2.5s ease infinite;
	border-color: #db1f26;
}
.premium-buttons button.btn-success {
	background: rgb(0,38,6);
	background: -moz-linear-gradient(-45deg, rgba(0,38,6,1) 0%, rgba(3,124,20,1) 34%, rgba(0,63,6,1) 73%, rgba(2,90,8,1) 80%, rgba(1,51,5,1) 85%);
	background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,rgba(0,38,6,1)), color-stop(34%,rgba(3,124,20,1)), color-stop(73%,rgba(0,63,6,1)), color-stop(80%,rgba(2,90,8,1)), color-stop(85%,rgba(1,51,5,1)));
	background: -webkit-linear-gradient(-45deg, rgba(0,38,6,1) 0%,rgba(3,124,20,1) 34%,rgba(0,63,6,1) 73%,rgba(2,90,8,1) 80%,rgba(1,51,5,1) 85%);
	background: -o-linear-gradient(-45deg, rgba(0,38,6,1) 0%,rgba(3,124,20,1) 34%,rgba(0,63,6,1) 73%,rgba(2,90,8,1) 80%,rgba(1,51,5,1) 85%);
	background: -ms-linear-gradient(-45deg, rgba(0,38,6,1) 0%,rgba(3,124,20,1) 34%,rgba(0,63,6,1) 73%,rgba(2,90,8,1) 80%,rgba(1,51,5,1) 85%);
	background: linear-gradient(135deg, rgba(0,38,6,1) 0%,rgba(3,124,20,1) 34%,rgba(0,63,6,1) 73%,rgba(2,90,8,1) 80%,rgba(1,51,5,1) 85%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#002606', endColorstr='#013305',GradientType=1 );
	background-size: 200% 100%;
	background-position: 0% 50%;
	border-color: #037C14;
}
.premium-buttons button.btn-success:hover {
	-webkit-animation: gradient 2.5s ease infinite;
	   -moz-animation: gradient 2.5s ease infinite;
	        animation: gradient 2.5s ease infinite;
	border-color: #037C14;
}
.back-gradient-animated {
	background: rgba(134,10,6,1);
	background: -moz-linear-gradient(-45deg, rgba(134,10,6,1) 0%, rgba(129,8,4,1) 13%, rgba(184,20,5,1) 23%, rgba(151,12,7,1) 36%, rgba(218,26,20,1) 66%, rgba(141,11,6,1) 81%, rgba(115,8,6,1) 88%, rgba(115,8,6,1) 100%);
	background: -webkit-gradient(left top, right bottom, color-stop(0%, rgba(134,10,6,1)), color-stop(13%, rgba(129,8,4,1)), color-stop(23%, rgba(184,20,5,1)), color-stop(36%, rgba(151,12,7,1)), color-stop(66%, rgba(218,26,20,1)), color-stop(81%, rgba(141,11,6,1)), color-stop(88%, rgba(115,8,6,1)), color-stop(100%, rgba(115,8,6,1)));
	background: -webkit-linear-gradient(-45deg, rgba(134,10,6,1) 0%, rgba(129,8,4,1) 13%, rgba(184,20,5,1) 23%, rgba(151,12,7,1) 36%, rgba(218,26,20,1) 66%, rgba(141,11,6,1) 81%, rgba(115,8,6,1) 88%, rgba(115,8,6,1) 100%);
	background: -o-linear-gradient(-45deg, rgba(134,10,6,1) 0%, rgba(129,8,4,1) 13%, rgba(184,20,5,1) 23%, rgba(151,12,7,1) 36%, rgba(218,26,20,1) 66%, rgba(141,11,6,1) 81%, rgba(115,8,6,1) 88%, rgba(115,8,6,1) 100%);
	background: -ms-linear-gradient(-45deg, rgba(134,10,6,1) 0%, rgba(129,8,4,1) 13%, rgba(184,20,5,1) 23%, rgba(151,12,7,1) 36%, rgba(218,26,20,1) 66%, rgba(141,11,6,1) 81%, rgba(115,8,6,1) 88%, rgba(115,8,6,1) 100%);
	background: linear-gradient(135deg, rgba(134,10,6,1) 0%, rgba(129,8,4,1) 13%, rgba(184,20,5,1) 23%, rgba(151,12,7,1) 36%, rgba(218,26,20,1) 66%, rgba(141,11,6,1) 81%, rgba(115,8,6,1) 88%, rgba(115,8,6,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#860a06', endColorstr='#730806', GradientType=1 );
	background-size: 200% 100%;
	background-position: 0% 50%;
	-webkit-animation: gradient 5s ease infinite;
	   -moz-animation: gradient 5s ease infinite;
	        animation: gradient 5s ease infinite;	
}
@-webkit-keyframes gradient {
	0% {	background-position: 0% 50%;	}
	50% {	background-position: 100% 50%;	}
	100% {	background-position: 0% 50%;	}
}
@-moz-keyframes gradient {
	0% {	background-position: 0% 50%;	}
	50% {	background-position: 100% 50%;	}
	100% {	background-position: 0% 50%;	}
}
@keyframes gradient {
	0% {	background-position: 0% 50%;	}
	50% {	background-position: 100% 50%;	}
	100% {	background-position: 0% 50%;	}
}

.btn-empty, .input-empty {
	background: none;
	border: none;
	padding: 0;
	margin: 0;
	outline: none !important;
	box-shadow: none !important;
}

.box-dotted {
	position: relative;
	border: dashed 1px #db1f26;
	border-radius: 4px;
}
.border-green {
	border-color: #008E26;
}
.box-dotted-no-top {
	border-top: none;
	border-radius: 0 0 4px 4px;
}
.border-top-dotted {
	border-top: dashed 1px #db1f26;
}
.border-bottom-dotted {
	border-bottom: dashed 1px #db1f26;
}

.fa-dropdown {
	width: 30px;
	text-align: center;
	display: inline-block;
}

/*
	background: url(/img/back-produse.jpg) #fff no-repeat center;
	    filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/img/back-produse.jpg', sizingMethod='scale');
	-ms-filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/img/back-produse.jpg', sizingMethod='scale');
	-webkit-background-size: cover;
	   -moz-background-size: cover;
		 -o-background-size: cover;
			background-size: cover;

	height: calc(100vh - 300px);
*/

/*---------  BOOTSTRAP FIX  --------------------------------------------------------------*/
.dropdown-menu-right { right: 0; left: auto; }
.form-check-input {
    margin-top: 0.4rem; 
    margin-left: 0;
}
.form-check-label {
    padding-left: 2rem;
}


/*---------  JQUERY UI  --------------------------------------------------------------*/
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default,
.ui-button, html .ui-button.ui-state-disabled:hover, html .ui-button.ui-state-disabled:active,
html .ui-button:hover,
html .ui-button:active {
    border: none;
    background: transparent;
}
.ui-widget .ui-widget-content .ui-dialog-buttonpane .ui-widget-content .ui-helper-clearfix {
    border: solid 1px #ccc;
    background: #e9e9e9;
    padding: 0;
    border-radius: 4px 4px 0 0;
}
.ui-widget-header {
    border: none;
    background: #db1f26;
    color: #fff;
    border-radius: 4px 4px 0 0;
}
.ui-dialog .ui-dialog-titlebar-close .ui-dialog-title  {
    background: #fff;
    border: solid 1px #ccc;
}
.ui-dialog .ui-dialog-content {
    padding: 1em 1.5em;
}
.ui-widget {
    font-family: inherit;
}

.ui-dialog-buttonpane{
	
}

.ui-front {
    z-index: 1500;
}
.ui-dialog .ui-dialog-titlebar-close,
.ui-dialog .ui-dialog-titlebar-close:hover {
    background: #fff;
}
.ui-dialog .ui-dialog-buttonpane button {
    border: solid 1px #ccc;
}



/*---------  BOOTSTRAP  --------------------------------------------------------------*/
.w-33 { width: 33% !important;	}
.w-1px { width: 1px !important;	}
.w-2px { width: 2px !important;	}
.h-20px { height: 20px !important; }


.p-4 { padding: 2rem !important; }

.pt-4,
.py-4 { padding-top: 2rem !important; }

.pr-4,
.px-4 { padding-right: 2rem !important; }

.pb-4,
.py-4 { padding-bottom: 2rem !important; }

.pl-4,
.px-4 { padding-left: 2rem !important; }


.p-8 { padding: 4.5rem !important; }

.pt-8,
.py-8 { padding-top: 4.5rem !important; }

.pr-8,
.px-8 { padding-right: 4.5rem !important; }

.pb-8,
.py-8 { padding-bottom: 4.5rem !important; }

.pl-8,
.px-8 { padding-left: 4.5rem !important; }


.p-10 { padding: 6rem !important; }

.pt-10,
.py-10 { padding-top: 6rem !important; }

.pr-10,
.px-10 { padding-right: 6rem !important; }

.pb-10,
.py-10 { padding-bottom: 6rem !important; }

.pl-10,
.px-10 { padding-left: 6rem !important; }


.m-10 { margin: 6rem !important; }

.mt-10,
.my-10 { margin-top: 6rem !important; }

.mr-10,
.mx-10 { margin-right: 6rem !important; }

.mb-10,
.my-10 { margin-bottom: 6rem !important; }

.ml-10,
.mx-10 { margin-left: 6rem !important; }


.b--2 { bottom: -2rem; }
.b--1px { bottom: -1px; }
.t--2px { top: -2px; }
.mt--1 { margin-top: -1rem; }
.mt--2 { margin-top: -2rem; }
.mt--2px { margin-top: -2px; }
.mt--4px { margin-top: -4px; }
.mw-20 { min-width: 20rem; }
.mw-22 { min-width: 22rem; }
.mw-74px { min-width: 74px; }
.mw-90px { width: 90px; min-width: 90px; }
.mw-200px { min-width: 200px; }
.mw-220px { min-width: 220px; }
.mw-260px { min-width: 260px; }
.mw-800px { width: 100%; max-width: 800px; }
.maxw-370px { max-width: 370px; }
.maxw-800px { max-width: 800px; }
.h-20 { height: 20rem; }
.l-0 { left: 0; }
.r-0 { right: 0; }
.b-0 { bottom: 0; }
.t-0 { top: 0; }
.l-2 { left: 2rem; }
.r-2 { right: 2rem; }
.b-2 { bottom: 2rem; }
.t-2 { top: 2rem; }

.text-normal { text-transform: none !important; }
.font-normal { font-style: normal; }

button.back-color-white {
	// border: none !important;
}
button.back-color-white:hover,
button.back-color-white.active {
	color: #db1f26;
	background-color: #e3e3e3;
}

.form-control {
	font-size: 16px;
	padding: .5rem .75rem;
}
.custom-file-input {
	// height: calc(2.625rem + 2px);
}
.custom-file-input:focus~.custom-file-control {
	box-shadow: none;
}
.custom-file {
	width: 100%;
	max-width: 400px;
	height: 3.8rem;
}
.custom-file-control {
	height: 3.8rem;
	padding-top: 0;
	padding-bottom: 0;
	border-color: transparent;
	border: none;
	border-bottom: solid 1px #db1f26;
	padding: 0;
	font-size: 1.8rem;
	line-height: 3.8rem;
	font-weight: 300;
	border-radius: 0;
	text-align: left;
}
.custom-file-control::after {
	content: "Upload the font file image" !important;
	border: none;
	padding: 0;
	font-size: 1.8rem;
	line-height: 3.8rem;
	font-weight: 300;
	left: 0;
    bottom: 0;
    position: absolute;
}
.custom-file-control:focus::after {
    border-color: #000;
}
.custom-file-control:lang(en)::before {
	content: "BROWSE";
}
.custom-file-control::before {
    position: absolute;
	right: 0;
	bottom: 0;
	display: block;
	height: 100%;
	background-color: #666;
	padding: 0 2rem;
	-webkit-box-shadow: 0px 2px 10px 0px rgba(0,0,0,0.16);
	   -moz-box-shadow: 0px 2px 10px 0px rgba(0,0,0,0.16);
	        box-shadow: 0px 2px 10px 0px rgba(0,0,0,0.16);
	font-weight: 700 !important;
	color: #fff;
	font-size: 1.6rem !important;
    line-height: 3.8rem !important;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
    user-select: none;
    border: 1px solid transparent;
	border-radius: 2rem;
    transition: background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
    cursor: pointer;
	-webkit-appearance: inherit;
	overflow: visible;
	margin: 0;
}
.custom-file-control.selected:lang(en)::after {
	content: "" !important;
}

input.form-control {
	border: none;
	border-bottom: solid 1px #db1f26;
	color: #666;
	font-size: 1.3rem;
	padding: .5rem 0;
	border-radius: 0;
	background: transparent;
}
textarea.form-control {
	border-color: #c9c9c9;
	border-bottom-color: #db1f26;
	color: #666;
	font-size: 1.3rem;
	padding: .5rem 1rem;
	border-radius: 0;
	background: transparent;
}
.form-control:focus {
	background: transparent;
    border-bottom-color: #000;
}
textarea.form-control:focus {
	border-color: #c9c9c9;
    border-bottom-color: #000;
}
.form-inline label {
    overflow: hidden;
}

.btn {
	padding: 0.5rem 1.5rem;
	// padding: 0.5rem 1.5rem 0.3rem;
	// line-height: 130%;
}
.btn-small {
	padding: 0.25rem 0.5rem;
}


.btn-round { border-radius: 2rem; }
.form-control::-webkit-input-placeholder {
	color: #666;
}
.form-control:-ms-input-placeholder {
	color: #666;
}
.form-control::-ms-input-placeholder {
	color: #666;
}
.form-control::placeholder {
	color: #666;
}

.tooltip {
	font-size: 1.2rem;
	line-height: 130%;
}

.btn-yellow { background: #E0DD37; }
.btn-yellow:hover { background: #000; }

.btn-gray { background-color: #666; }
.btn-gray:hover { background-color: #000; }


.btn-primary {
	background: #DB1F26;
	border-color: #DB1F26;
}
.btn-primary:hover {
    background-color: #000;
    border-color: #000;
}
.btn-primary.focus,.btn-primary:focus {
    box-shadow: 0 0 0 .2rem rgba(219,31,38,.5);
}
.btn-primary:not([disabled]):not(.disabled).active,
.btn-primary:not([disabled]):not(.disabled):active,
.show>.btn-primary.dropdown-toggle {
    background-color: #000;
    border-color: #000;
    box-shadow: 0 0 0 .2rem rgba(219,31,38,.5);
}

.btn-primary-white {
	background: #fff;
	border-color: #fff;
	color: #DB1F26;
}
.btn-primary-white:hover {
    background-color: #000;
    border-color: #000;
    color: #fff;
}
.btn-primary-white.focus,.btn-primary:focus {
    box-shadow: 0 0 0 .2rem rgba(219,31,38,.5);
}
.btn-primary-white:not([disabled]):not(.disabled).active,
.btn-primary-white:not([disabled]):not(.disabled):active,
.show>.btn-primary-white.dropdown-toggle {
    background-color: #000;
    border-color: #000;
    box-shadow: 0 0 0 .2rem rgba(219,31,38,.5);
}

.btn-outline-primary {
    color: #db1f26;
    border-color: #db1f26;
}
.btn-outline-primary:hover,
.btn-outline-primary:active {
	color: #fff;
    background-color: #db1f26;
    border-color: #db1f26
}
.btn-outline-primary:not([disabled]):not(.disabled).active,
.btn-outline-primary:not([disabled]):not(.disabled):active,
.show>.btn-outline-primary.dropdown-toggle {
	color: #fff;
    background-color: #db1f26;
    border-color: #db1f26;
    box-shadow: 0 0 0 .2rem rgba(219,31,38,.5);
}


.btn-outline-secondary {
    color: #000;
    border-color: #c9c9c9;
}
.btn-outline-secondary:hover,
.btn-outline-secondary:active {
    background-color: #000;
    border-color: #000
}
.btn-outline-secondary:not([disabled]):not(.disabled).active,
.btn-outline-secondary:not([disabled]):not(.disabled):active,
.show>.btn-outline-secondary.dropdown-toggle {
    background-color: #333;
    border-color: #333;
}

.btn-secondary.active {
	background-color: #008E26 !important;
	border-color: #008E26 !important;
}
.btn-secondary-active-red.active {
	background-color: #db1f26 !important;
	border-color: #db1f26 !important;
}
.btn-secondary-active-gray.active {
	background-color: #333 !important;
	border-color: #333 !important;
}


.btn-success {
	background: #008e26;
	border-color: #008e26;
}
.btn-success:hover {
    background-color: #000;
    border-color: #000;
}
.btn-success.focus,.btn-success:focus {
    box-shadow: 0 0 0 .2rem rgba(0,142,38,.5);
}
.btn-success:not([disabled]):not(.disabled).active,
.btn-success:not([disabled]):not(.disabled):active,
.show>.btn-success.dropdown-toggle {
    background-color: #000;
    border-color: #000;
    box-shadow: 0 0 0 .2rem rgba(0,142,38,.5);
}


/*---------  PAGINATION  --------------------------------------------------------------*/
.pagination {
	margin-bottom: 0;
}
.page-link {
    padding: 0.5rem 1rem;
    margin-left: 5px;
    line-height: 1.25;
    color: #db1f26;
    background-color: #fff;
    border: 1px solid #fff;
    border-radius: 4px;
    -webkit-box-shadow: 0px 2px 10px 0px rgba(0,0,0,0.16);
       -moz-box-shadow: 0px 2px 10px 0px rgba(0,0,0,0.16);
            box-shadow: 0px 2px 10px 0px rgba(0,0,0,0.16);
}
.page-link:focus, .page-link:hover {
	color: #fff;
	background-color: #333;
	border-color: #333;
}
.page-item.disabled .page-link {
    color: #c9c9c9;
    background-color: #efefef;
    border-color: #efefef;
    -webkit-box-shadow: none;
       -moz-box-shadow: none;
            box-shadow: none;
}
.page-item.active .page-link {
    background-color: #333;
    border-color: #333;
    -webkit-box-shadow: none;
       -moz-box-shadow: none;
            box-shadow: none;
}



/*---------  NAVBAR  --------------------------------------------------------------*/
.navbar {
	height: 100px;
	background-color: #fff;
}
.navbar.navbar-smaller {
	height: 60px;
}
@media (max-width: 767px) {
	.navbar {
		height: 80px;
    }
}
.navbar-brand {
	position: relative;
	display: block;
	width: 120px;
	height: 40px;
	background: url(//d1ly52g9wjvbd2.cloudfront.net/img/logo-what-font-is.svg) no-repeat center;
	background-size: 100% 100%;
	text-indent: -2000px;
	overflow: hidden;
}
.navbar-nav {

}
.nav-item .nav-link {
	display: inline-block;
	text-transform: uppercase;
	color: #333;
	padding-left: 1.5rem;
	padding-right: 1.5rem;
}
.navbar-light .nav-item .nav-link:hover, 
.navbar-light .nav-item .nav-link:focus,
.navbar-light .nav-item.active .nav-link {
	color: #db1f26;
}
@media (min-width: 1400px) {
    .navbar-expand-md .navbar-nav .nav-link {
    	padding-left: 1.5rem;
    	padding-right: 1.5rem;
    }
}
.navbar-toggler-icon {
    width: 4rem;
    height: 4rem;
}
.navbar-light .collapse.show, .navbar-light .collapsing {
    position: absolute;
    z-index: 1;
    right: 0;
    width: 100%;
    top: 70px;
    text-align: right;
    background: #fff;
    -webkit-box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.16);
       -moz-box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.16);
            box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.16);

}
.navbar-light .collapsing .nav-item .nav-link,
.navbar-light .collapse.show .nav-item .nav-link {
	font-size: 2.25rem;
}
.navbar-light .collapsing .nav-item,
.navbar-light .collapse.show .nav-item {
    padding: 1rem 1.5rem;
}

.navbar-light .collapsing .navbar-nav,
.navbar-light .collapse.show .navbar-nav {
	padding-bottom: 3rem;
}

@media (min-width: 768px) {
	.collapse-filters {
		display: block;
	}
}


.mobile-search {
	position: fixed;
	z-index: 1000;
	left: 0;
	top: 0;
	right: 0;
}
.mobile-search-normal {
	top: 80px;
}
.mobile-search-smaller {
	top: 60px;
}


/*---------  SIDEBAR  --------------------------------------------------------------*/
.grid-work-sidebar-more {
	display: none;
}

@media (min-width: 1200px) {
	.sidebar {
		overflow: hidden;
		height: calc(100vh - 180px);
	}
	.grid-work-sidebar-more {
		position: absolute;
		display: block;
		left: 0;
		bottom: 0;
		width: 100%;
		background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 70%);
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,0)), color-stop(70%,rgba(255,255,255,1)));
		background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 70%);
		background: -o-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 70%);
		background: -ms-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 70%);
		background: linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 70%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=0 );
	}
}


/*---------  FOOTER  --------------------------------------------------------------*/
.footer {
	position: fixed;
	z-index: 10;
	bottom: 0;
	width: 100%;
	/*min-height: 50px;*/
	background-color: #fff;
}
@media (max-width: 767px) {
	.footer {
		position: static;
		height: auto;
		padding-top: 2rem;
		padding-bottom: 2rem;
	}
}

#cookies_alert {
	position: fixed;
	z-index: 100000;
	bottom: 0;
	left: 0;
	width: 100%;
}
#subcribe_newsletter {
	position: fixed;
	z-index: 9;
	bottom: -100%;
	left: 0;
	right: 0;
	margin: 0 auto;
}
#subcribe_newsletter_close {
	position: absolute;
	right: 10px;
	top: 10px;
	width: 24px;
	height: 24px;
	text-align: center;
	font-size: 16px;
	line-height: 24px;
	color: #fff;
	background-color: #db1f26;
	border-radius: 4px;
	cursor: pointer;
}
#subcribe_newsletter_close:hover {
	background-color: #000;
	color: #db1f26;
}

#loading_overlay {
	opacity: 0;
	display: none;
	position: fixed;
	z-index: 100000;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	background: rgba(255,255,255,0.9);
}
#loading_overlay .letter {
	font-size: 6rem;
	line-height: 6rem;
	color: #000;
	width: 8rem;
	text-align: center;
}
#loading_overlay_message {
	position: relative;
    height: 100px;
    overflow: hidden;
    width: 100%;
    text-align: center;
}
#loading_overlay_message > div {
	position: absolute;
	top: 0;
	width: 100%;
	height: 30px;
}

.spinner {
	padding: 0 2rem;
}
.sk-cube-grid {
	width: 40px;
	height: 40px;
	margin: 12px auto;
}
.sk-cube-grid .sk-cube {
	width: 33%;
	height: 33%;
	background-color: #db1f26;
	float: left;
	-webkit-animation: sk-cubeGridScaleDelay 1.3s infinite ease-in-out;
			animation: sk-cubeGridScaleDelay 1.3s infinite ease-in-out; 
}
.sk-cube-grid .sk-cube1 {
	-webkit-animation-delay: 0.2s;
			animation-delay: 0.2s;
}
.sk-cube-grid .sk-cube2 {
	-webkit-animation-delay: 0.3s;
			animation-delay: 0.3s;
}
.sk-cube-grid .sk-cube3 {
	-webkit-animation-delay: 0.4s;
			animation-delay: 0.4s;
}
.sk-cube-grid .sk-cube4 {
	-webkit-animation-delay: 0.1s;
			animation-delay: 0.1s;
}
.sk-cube-grid .sk-cube5 {
	-webkit-animation-delay: 0.2s;
			animation-delay: 0.2s;
}
.sk-cube-grid .sk-cube6 {
	-webkit-animation-delay: 0.3s;
			animation-delay: 0.3s;
}
.sk-cube-grid .sk-cube7 {
	-webkit-animation-delay: 0s;
			animation-delay: 0s;
}
.sk-cube-grid .sk-cube8 {
	-webkit-animation-delay: 0.1s;
			animation-delay: 0.1s;
}
.sk-cube-grid .sk-cube9 {
	-webkit-animation-delay: 0.2s;
			animation-delay: 0.2s;
}

@-webkit-keyframes sk-cubeGridScaleDelay {
	0%, 70%, 100% {
		-webkit-transform: scale3D(1, 1, 1);
				transform: scale3D(1, 1, 1);
	} 35% {
		-webkit-transform: scale3D(0, 0, 1);
				transform: scale3D(0, 0, 1); 
	}
}
@keyframes sk-cubeGridScaleDelay {
	0%, 70%, 100% {
		-webkit-transform: scale3D(1, 1, 1);
				transform: scale3D(1, 1, 1);
	} 35% {
		-webkit-transform: scale3D(0, 0, 1);
				transform: scale3D(0, 0, 1);
	} 
}


/*==================================================================================
=            LOGIN & REGISTER OVERLAY
==================================================================================*/
#login_register_overlay {
	opacity: 0;
	display: none;
	position: fixed;
	z-index: 100000;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	background: rgba(0,0,0,0.75);
	overflow-y: scroll; /* has to be scroll, not auto */
	-webkit-overflow-scrolling: touch;
}
#login_register_overlay_close {
	position: absolute;
	right: -24px;
	top: 0;
	width: 24px;
	height: 24px;
	text-align: center;
	font-size: 16px;
	line-height: 24px;
	color: #fff;
	background-color: #db1f26;
	border-radius: 4px;
	cursor: pointer;
}
#login_register_overlay_close:hover {
	background-color: #000;
	color: #db1f26;
}
.no-scrollbars {
	overflow: hidden;
}
.btn-facebook {
	background-color: #3b5996;
	border-color: #3b5996;
}
.btn-google {
	background-color: #4e85eb;
	border-color: #4e85eb;
}
#login_error,
#register_error {
	display: none;
}
.form-control-error {
	color: #db1f26;
}
.form-control-error::-webkit-input-placeholder {
	color: #db1f26 !important;
}
.form-control-error:-ms-input-placeholder {
	color: #db1f26 !important;
}
.form-control-error::-ms-input-placeholder {
	color: #db1f26 !important;
}
.form-control-error::placeholder {
	color: #db1f26 !important;
}


.mw-930px { min-width: 930px; }

.w-sm-50 {
    width: 50%!important;
}

@media (max-width: 991px) {
	.mw-930px { min-width: auto; }
	#login_register_overlay_close {
		right: 11px;
		top: -34px;
	}
}
@media (max-width: 767px) {
	#login_register_overlay {
		padding-top: 1.5rem!important;
		padding-bottom: 1.5rem!important;
	}
	#login_register_overlay_close {
		right: 21px;
		top: 10px;
	}
}
@media (max-width: 575px) {
	.w-sm-50 {
	    width: 100%!important;
	}
}



/*==================================================================================
=            TOOLTIPS
==================================================================================*/
.tippy-popper {
	max-width: calc(100% - 10px) !important;
}

.tippy-tooltip .tippy-content {
	font-size: 1.3rem;
	line-height: 1.8rem;
	padding: 0.5rem 1rem;
}

.tippy-tooltip.wfi-theme {
	padding: 0;
	margin: 0;
}
.tippy-tooltip.wfi-theme .tippy-backdrop {
	background: none;
	border: none;
	padding: 0;
	margin: 0;
}
.tippy-tooltip.wfi-theme .tippy-content {
	font-size: 1.3rem;
	line-height: 1.8rem;
	background-color: #e0dd37;
	border: none;
	color: #333;
	text-align: left;
	border-radius: 4px;
	margin: 0;
}
.help-content {
	display: none;
}
.help_close {
	position: static;
	z-index: 2;
	right: 10px;
	top: 10px;
	width: 24px;
	height: 24px;
	text-align: center;
	font-size: 16px;
	line-height: 24px;
	color: #fff;
	background-color: #db1f26;
	border-radius: 4px;
	cursor: pointer;
}
.help_close:hover {
	background-color: #000;
	color: #db1f26;
}

.shortcuts {
	width: 220px;
	min-width: 220px;
	padding-left: 20px;
	margin-left: 20px;
	border-left: dashed 1px #fff;
}
@media (max-width: 575px) {
	.shortcuts {
		width: 100%;
		min-width: 100%;
		padding-left: 0;
		margin-left: 0;
		border-left: none;
	}
}

.shortcut {
	line-height: 19px;
}
.shortcut > div {
	float: left;
	width: 50px;
	height: 28px;
	text-align: center;
	background: url("//d1ly52g9wjvbd2.cloudfront.net/img/icon-wfi-white.svg") transparent no-repeat center;
	background-size: 100%;
	color: #333;
}
.shortcut > span {
	color: #fff;
	float: left;
	margin: 0 5px;
}




/*==================================================================================
=            LANDING
==================================================================================*/
.page-landing {
	background: #000;
	height: 100vh;
}
.landing-poster-image {
	height: calc(90vh - 0px);
	-webkit-background-size: contain;
	   -moz-background-size: contain;
	     -o-background-size: contain;
	        background-size: contain;
	background-position: center right;
	background-repeat: no-repeat;
}
.landing-poster-back-container {
	overflow: hidden;
}
.landing-poster-back {
	position: absolute;
	left: 0;
	right: 0;
	z-index: 1;
	opacity: 0.3;
	/*background-image: url('/img/poster-thor-ragnarok.jpg');*/
	-webkit-background-size: cover;
	   -moz-background-size: cover;
		 -o-background-size: cover;
			background-size: cover;
	background-position: center;
	display: block;
	transform: scale(1.05); 
	height: 100vh;
	-webkit-filter: blur(5px);
	   -moz-filter: blur(5px);
	     -o-filter: blur(5px);
	    -ms-filter: blur(5px);
	        filter: blur(5px);
}
.landing-poster-content {
	position: absolute;
	top: 5vh;
	left: 5vh;
	right: 5vh;
	bottom: 5vh;
	z-index: 2;
	height: 90vh;
}
.landing-text {
	padding: 5vh;
}
.landing-poster-back-container,
.landing-text-container {
	height: 100vh;
}

@media (min-width: 600px) and (max-width: 768px) {

}
@media (max-width: 575px) {
	.landing-poster-back-container,
	.landing-text-container {
		height: 50vh;
	}
	.landing-poster-image {
		height: calc(40vh - 0px);
		background-position: center;
	}
	.landing-poster-content {
		height: 40vh;
	}
}

.ba-slider {
	position: relative;
	/*overflow: hidden;*/
	height: 90vh;
	display: inline-block;
}

.resize {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 50%;
	overflow: hidden;
}
.ba-slider img {
	display: block;
	height: 100%;
	width: auto;
}
.resize img {
	height: 100%;
	width: auto;
}
.handle {
	/* Thin line seperator */
	position: absolute;
	left: 50%;
	top: 0;
	bottom: 0;
	width: 1px;
	margin-left: -2px;
	background: none;
	cursor: ew-resize;
	border: dashed 1px #fff;
}
.handle:after {
	/* Big orange knob	*/
	position: absolute;
	top: 50%;
	width: 64px;
	height: 64px;
	margin: -32px 0 0 -32px;
	content: '\2194';
	color: white;
	font-weight: bold;
	font-size: 36px;
	text-align: center;
	line-height: 61px;
	background: #db1f26;
	/* @orange */
	/*border: 1px solid #e6a600;*/
	/* darken(@orange, 5%) */
	border-radius: 50%;
	transition: all 0.3s ease;
	/*box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3), inset 0 2px 0 rgba(255, 255, 255, 0.5), inset 0 60px 50px -30px #ffd466;*/
	/* lighten(@orange, 20%)*/
}
.draggable:after {
	width: 48px;
	height: 48px;
	margin: -24px 0 0 -24px;
	line-height: 48px;
	font-size: 30px;
}
@media (max-width: 1199px) {
	.ba-slider {
		height: auto;
	}
	.ba-slider img {
		height: auto;
		width: 100%;
	}
	.resize img {
		height: auto;
		width: 100%;
	}
	.handle:after {
		width: 48px;
		height: 48px;
		margin: -24px 0 0 -24px;
		font-size: 28px;
		line-height: 48px;
	}

}
@media (max-width: 767px) {
	.ba-slider {
		height: 80vh;
	}
	.ba-slider img {
		height: 100%;
		width: auto;
	}
	.resize img {
		height: 100%;
		width: auto;
	}
	.handle:after {
		width: 36px;
		height: 36px;
		margin: -18px 0 0 -18px;
		font-size: 24px;
		line-height: 34px;
	}
}

@media (max-width: 575px) {
	.ba-slider {
		height: 40vh;
	}
	.ba-slider img {
		height: 100%;
		width: auto;
	}
	.resize img {
		height: 100%;
		width: auto;
	}
	.handle:after {
		width: 36px;
		height: 36px;
		margin: -18px 0 0 -18px;
		font-size: 24px;
		line-height: 34px;
	}
}

/*==================================================================================
=            NAVIGATION
==================================================================================*/




/*==================================================================================
=            HOME
==================================================================================*/
.box-home {
	overflow: hidden;
	min-height: 220px;
}
.box-home-label {
	position: absolute;
	z-index: 3;
	top: 0;
	right: 20px;
	border-radius: 0 0 4px 4px;
	background-color: #fff;

}
.box-home-content {
	background-color: rgba(224,100,105,0.9);
	position: relative;
	z-index: 3;
}
.box-home-overlay-red {
	background-color: #db1f26;
	opacity: 0.1;
	position: absolute;
	z-index: 2;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
}



/*---------  STEP2  --------------------------------------------------------------*/

.nav-tabs-content.nav-tabs {
	position: relative;
	z-index: 2;
	bottom: -1px;
	border-bottom: dashed 1px #DB1F26;
}
.nav-tabs-content.nav-tabs .nav-item.show .nav-link,
.nav-tabs-content.nav-tabs .nav-link.active {
    color: #DB1F26;
    border: dashed 1px #DB1F26;
    border-color: #DB1F26 #DB1F26 #fff;
}
.nav-tabs-content .nav-item .nav-link {
	padding-left: 2rem;
	padding-right: 2rem;
	text-transform: none;
    color: #666;
    background: #fff;
    border: dashed 1px #DB1F26;
    // border-color: #DB1F26 #DB1F26 #fff;
    // border-bottom-color: transparent;
}

.slider-image-contrast-icon-left,
.slider-image-contrast-icon-right {
	width: 2.6rem;
	height: 1.8rem;
	font-size: 1.2rem;
	line-height: 1.8rem;
	padding: 0 0.8rem;
}
.slider-image-contrast-icon-left {
	background: #666;
	color: #c9c9c9;
}
.slider-image-contrast-icon-right {
	background: #000;
	color: #fff;
}

.slider-image-size-icon-left {
	width: 1.2rem;
	height: 0.8rem;
	background: #c9c9c9;
}
.slider-image-size-icon-right {
	width: 2.4rem;
	height: 1.5rem;
	background: #c9c9c9;
}

/*---------  STEP3  --------------------------------------------------------------*/
.font-preview {
	width: 100%;
	max-width: 540px;	
}
/*@supports(position:sticky){*/
	#font-filters-sticky {
		z-index: 1000;
		position: -webkit-sticky;
		position: sticky;
		top: 60px;
		margin-left: -1.5rem;
		margin-right: -1.5rem;
		padding-left: 0rem;
		padding-right: 0rem;
	}

	@media (max-width: 1199px) {
		#font-filters-sticky {
			margin-left: -2rem;
			margin-right: -2rem;
			padding-left: 0;
			padding-right: 0;
		}
	}
/*}*/


/*==================================================================================
=            FOOTER
==================================================================================*/
.footer {
	
}


/*==================================================================================
=            WORK
==================================================================================*/

/*---------  WORK > SIDEBAR  --------------------------------------------------------------*/

.card-columns-work .card {
	border: none;
	border-radius: 0;
}
.work-item-vote {
	position: absolute;
	left: 2rem;
	top: 2rem;
	padding: 1rem 0;
	width: 70px;
	border-radius: 4px;
	text-align: center;
	color: #008E26;
	background: rgba(255,255,255,0.85);
	cursor: pointer;
}

.card-columns-work {
	-webkit-column-count: 1;
	column-count: 1;
}
.grid-item {
	-webkit-transition: none;
	   -moz-transition: none;
		-ms-transition: none;
		 -o-transition: none;
			transition: none;
}
.grid-work-sidebar .grid-item {
	width: 100%;
	margin-bottom: 0.5rem;
}
@media (min-width: 576px) {
	.card-columns-work {
		-webkit-column-count: 2;
		column-count: 2;
	}
	.grid-work-sidebar .grid-item {
		width: calc(50% - 1rem);
		margin: 0.5rem;
	}
}
@media (min-width: 768px) {
	.card-columns-work {
		-webkit-column-count: 3;
		column-count: 3;
	}
	.grid-work-sidebar .grid-item {
		width: calc(33.3% - 1rem);
		margin: 0.5rem;
	}
}
@media (min-width: 992px) {
	.card-columns-work {
		-webkit-column-count: 4;
		column-count: 4;
	}
	.grid-work-sidebar .grid-item {
		width: calc(25% - 1rem);
		margin: 0.5rem;
	}
}
@media (min-width: 1200px) {
	.card-columns-work {
		-webkit-column-count: 1;
		column-count: 1;
	}
	.grid-work-sidebar .grid-item {
		width: 100%;
	}
}
@media (min-width: 1600px) {
	.card-columns-work {
		-webkit-column-count: 2;
		column-count: 2;
	}
	.grid-work-sidebar .grid-item {
		width: calc(50% - 1rem);
		margin: 0.5rem;
	}
}

.grid-work .grid-item, .grid-work-sidebar .grid-item {
	overflow: hidden;
}
.grid-work .grid-item:hover .work-item-vote,
.work-item-vote:hover,
.grid-work-sidebar .grid-item:hover .work-item-vote {
	color: #fff;
	background: #008E26;
}
.grid-work .grid-item img,
.grid-work-sidebar .grid-item img,
.work-img {
	position: relative;
	border-radius: 4px;
	border: solid 1px #e8e8e8;
}
.grid-work .grid-item:hover img,
.grid-work-sidebar .grid-item:hover img {
	border-color: #008E26;
}

.work-item-info {
	opacity: 0;
    position: absolute;
    top: 1px;
    right: 1px;
    bottom: 100%;
    width: calc(100% - 110px);
    background: rgba(255,255,255,0.95);
    border-radius: 0 4px 4px 0;
    padding: 2rem 2rem;
}
.work-item-info-meta {
	font-size: 1.4rem;
	line-height: 150% !important;
	font-style: italic;
	color: #666;
}
.work-item-info-meta-value {
	font-size: 1.6rem;
	line-height: 150% !important;
	font-weight: 700;
	color: #000;
}

.grid-work-sidebar .work-item-info-meta {
	font-size: 1.2rem;
	line-height: 130% !important;
}
.grid-work-sidebar .work-item-info-meta-value {
	font-size: 1.4rem;
	line-height: 130% !important;
}




/*==================================================================================
=            FORUM
==================================================================================*/
.grid-forum .grid-item {
	width: 100%;
}

@media (min-width: 576px) {
	.grid-forum .grid-item {
		width: calc(50% - 1rem);
		margin: 0.5rem;
	}
}
@media (min-width: 768px) {
	.grid-forum .grid-item {
		width: calc(33.3% - 1rem);
		margin: 0.5rem;
	}
}
@media (min-width: 992px) {
	.grid-forum .grid-item {
		width: calc(25% - 1rem);
		margin: 0.5rem;
	}
}


/*==================================================================================
=            MY ACCOUNT
==================================================================================*/
.grid-work .grid-item {
	width: 100%;
}

@media (min-width: 576px) {
	.grid-work .grid-item {
		width: calc(50% - 1rem);
		margin: 0.5rem;
	}
}
@media (min-width: 768px) {
	.grid-work .grid-item {
		width: calc(33.3% - 1rem);
		margin: 0.5rem;
	}
}
@media (min-width: 992px) {
	.grid-work .grid-item {
		width: calc(25% - 1rem);
		margin: 0.5rem;
	}
}
@media (min-width: 1200px) {
	.grid-work .grid-item {
		width: calc(25% - 1rem);
		margin: 0.5rem;
	}
}
@media (min-width: 1600px) {
	.grid-work .grid-item {
		width: calc(20% - 1rem);
		margin: 0.5rem;
	}
}



/*==================================================================================
=            PAGES
==================================================================================*/
.icon-example {
	position: absolute;
	right: 2rem;
	top: 2rem;
}



/*==================================================================================
=            MEMBER UPGRADE TO PREMIUM
==================================================================================*/
.premiumOption {
	position: relative;
	height: 120px;
	padding: 0 0 0 3rem;
	overflow: hidden;
	text-decoration: none !important;
}
.premiumOption > .label {
	position: absolute;
	left: 0;
	top: 100%;
	width: 120px;
	height: 30px;
	line-height: 30px;
	padding: 0;
	-webkit-transform: rotate(-90deg);
	   -moz-transform: rotate(-90deg);
		-ms-transform: rotate(-90deg);
		 -o-transform: rotate(-90deg);
			transform: rotate(-90deg);
	-webkit-transform-origin: left top;
	   -moz-transform-origin: left top;
		-ms-transform-origin: left top;
		 -o-transform-origin: left top;
			transform-origin: left top;
}
.premiumOption .priceCnt .far {
	margin-right: 3px;
}
.premiumOption .priceCnt .fa-square {
	display: inline-block;
}
.premiumOption .priceCnt .fa-check-square {
	display: none;
}
.premiumOption .coffees .label {
	/*float: left;
	width: 9rem;
	padding-top: 15px;*/
}
.coffee {
	float: left;
	width: 26px;
	height: 46px;
	background: url('//d2bogo5rmjrq1c.cloudfront.net/i/coffee-cup-animation.gif') transparent no-repeat center;
	background-size: 100%;
	margin-left: 3px;
}
.coffee-some {
    float: left;
    margin: 4px 0 0 2px;
    width: calc(100% - 9.5rem);
    height: 47px;
    background: url('//d2bogo5rmjrq1c.cloudfront.net/i/coffee-cup-animation.gif') transparent repeat-x left center;
    background-size: 26px 46px;
}
.coffee-more {
    float: left;
    margin: 4px 0 0 2px;
    width: calc(100% - 9.5rem);
    height: 47px;
    background: url('//d2bogo5rmjrq1c.cloudfront.net/i/coffee-cup-animation.gif') transparent repeat left top;
    background-size: 13px 23px;
}

.premiumOption.premiumOptionSelected .priceCnt .far,
.premiumOption.premiumOptionSelected .priceCnt .price,
.premiumOption.premiumOptionSelected .priceCnt .period,
.premiumOption:hover .priceCnt .fa,
.premiumOption:hover .priceCnt .price,
.premiumOption:hover .priceCnt .period {
	color: #db1f26 !important;
}
.premiumOption.premiumOptionSelected .priceCnt .fa-check-square {
	display: inline-block;
}
.premiumOption.premiumOptionSelected .priceCnt .fa-square {
	display: none;
}




/*
Extra small devices (portrait phones, less than 576px)
No media query since this is the default in Bootstrap
*/

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {
}

/* 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) {
}






/* Extra small devices (portrait phones, less than 576px) */
@media (max-width: 575px) {
}

/* Small devices (landscape phones, less than 768px) */
@media (max-width: 767px) {
}

/* Medium devices (tablets, less than 992px) */
@media (max-width: 991px) {
}

/* Large devices (desktops, less than 1200px) */
@media (max-width: 1199px) {
}





/* Extra small devices (portrait phones, less than 576px) */
@media (max-width: 575px) {
}

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) and (max-width: 767px) {
}

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

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

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




@media (max-width: 767px) {
	input.form-control,
	textarea.form-control,
	.custom-file-control::after,
	.selectize-dropdown,
	.selectize-input,
	.selectize-input input {
		font-size: 16px !important;
	}
}



