/********** Font **********/
@font-face {
    font-family: 'FavoritStd-Book';
    src: url('../font/FavoritStd-Book.woff') format('woff');
}

@font-face {
    font-family: 'FavoritLiningStd-Book';
    src: url('../font/FavoritLiningStd-Book.woff') format('woff');
}

@font-face {
    font-family: 'FavoritMonoStd-Book';
    src: url('../font/FavoritMonoStd-Book.woff') format('woff');
    src: url('../font/FavoritMonoStd-Book.woff2') format('woff2');
}

@font-face {
    font-family: 'Chungking_Mono-Regular';
	src: url("../font/ChungkingEssenceMono-Regular.eot"); /* IE9 Compat Modes */
	src: url("../font/ChungkingEssenceMono-Regular.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
	url("../font/ChungkingEssenceMono-Regular.otf") format("opentype"), /* Open Type Font */
	url("../font/ChungkingEssenceMono-Regular.svg") format("svg"), /* Legacy iOS */
	url("../font/ChungkingEssenceMono-Regular.ttf") format("truetype"), /* Safari, Android, iOS */
	url("../font/ChungkingEssenceMono-Regular.woff") format("woff"), /* Modern Browsers */
	url("../font/ChungkingEssenceMono-Regular.woff2") format("woff2"); /* Modern Browsers */
	font-weight: normal;
	font-style: normal;
}

.FavoritMonoStd-Book{
	font-family: 'FavoritMonoStd-Book';
}

.font-underline{
	font-family: 'FavoritLiningStd-Book';
}

.font-regular{
	font-family: 'FavoritStd-Book';
	font-size: 1.88vw;
}

/********** General **********/
body{
	font-family: 'FavoritStd-Book';
	font-size: 1.88vw;
	color: white;
}

a{
    color: white;
    mix-blend-mode: difference;
    text-decoration: none;
}

a:visited {
    color: white;
    text-decoration: none;
}

a:hover {
    color: white;
    text-decoration: none;
    font-family: 'FavoritLiningStd-Book';
}

a:active {
    color: white;
    text-decoration: none;
}

img{
	width: 100%;
}

.code_barre{
	position: fixed;
	mix-blend-mode: difference;
	height: 100%;
}

#code_barre_left{
	top: 0px;
	left: 0px;
	z-index: 1;
    width: unset;
}

#code_barre_right{
	top: 0px;
	right: 0px;
	z-index: 1;
    width: unset;
}

/********** General - Mobile **********/
@media screen and (max-width: 480px){
	body{
		font-size: 4.78vw;
	}

	.font-regular{
        font-size: 4.78vw;
    }
}

/********** NAV BAR **********/
.container-fluid{
	padding: 0% 1.2%;
}

.navbar-right{
	margin-right: -0.4% !important;
    margin-top: 6px;
}

.navbar-left{
	margin-top: 6px;
    margin-left: 6px;
}

.icon-bar{
	background-color: #fff;
	mix-blend-mode: difference;
}

#shop{
	margin-right: 5.3% !important;
}

#entrance{
	margin-right: 5.2% !important;
}

.menu-arrow{
	display: none;
}

.mobile-only{
	display: none;
}

.touch-device-only{
	display: none;
}

/********** Target Touch device **********/
@media (pointer: coarse){
	.touch-device-only{
		display: block;
	}
}

/**********Target Small Mobile **********/
@media screen and (max-width: 480px){
	.desktop-only{
		display: none;
	}

	.touch-device-only{
		display: none;
	}

	.mobile-only{
		display: block;
	}

	.container-fluid{
		padding: 0% 5.8%;
	}

	.navbar-left {
	    margin-top: 6px;
    	margin-left: 13px;
    	margin-bottom: 8px;
	}

	.navbar-toggle{
	    margin-top: 0px;
	    margin: 0px;
	    padding: 0px;
	    width: 14%;
	}

	.menu-cross{
		width: 33%;
    	margin: 16% 0%;
    	margin-left: 30%;
    	mix-blend-mode: difference;
	}

	.navbar-collapse{
	    mix-blend-mode: difference;
    	margin-left: -4px !important;
    	margin-top: -3px !important;
    	width: 103%;
    	padding-right: 5px !important;
    	padding-left: 0px !important;
	}

	.navbar-right{
		margin-top: 0px;	
		margin-bottom: 0px;
		height: 75px;
		background-color: white;
		margin-top: 1px;
	}

	.navbar-toggle > p:first-child{
		margin-top: 8px;
	}

	.navbar-right-text{
		height: 100%;
	    width: 100%;
	    display: inline-block;
	    margin-top: 0%;
	    padding-top: 7%;
	}

	.menu-arrow{
		display: inline;
		float: right;
    	mix-blend-mode: difference;
	}

	#shop{
		margin-right: 0px !important;
	}

	#entrance{
		margin-right: 0px !important;
	}

	#contact{
		margin-right: 0px !important;
	}
}

/********* FOOTER ***********/
.marquee {
    mix-blend-mode: difference;
	position: fixed;
	bottom: -1px;
	width: 100%;
	overflow: hidden;
	white-space: nowrap;
}

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

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

/********* FOOTER - Mobile ***********/
@media screen and (max-width: 480px){
	marquee{
		bottom: 5px;
	}
}

/********* Loader ***********/
.loader-wrapper{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 10000;
	background-color: white;
	opacity: 1;
	width: 100%;
	height: 100%;
}

.loader {
  border: 16px solid #f3f3f3; /* Light grey */
  border-top: 16px solid #3498db; /* Blue */
  border-radius: 50%;
  width: 120px;
  height: 120px;
  animation: spin 2s linear infinite;
  margin: auto;
  margin-top: 25%;
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}