@font-face {
  font-family: 'AvenueX';
  src: url('/font/AvenueX-Regular.eot');
  src: url('/font/AvenueX-Regular.woff2') format('woff2'),
       url('/font/AvenueX-Regular.woff') format('woff'),
       url('/font/AvenueX-Regular.ttf') format('truetype'),
       url('/font/AvenueX-Regular.svg#AvenueX-Regular') format('svg'),
       url('/font/AvenueX-Regular.eot?#iefix') format('embedded-opentype');
  font-weight: normal;
  font-style: normal;
  font-display: fallback;
}

@font-face {
  font-family: 'SteelworksVintage';
  src: url('/font/SteelworksVintageDemo.eot');
  src: url('/font/SteelworksVintageDemo.woff2') format('woff2'),
       url('/font/SteelworksVintageDemo.woff') format('woff'),
       url('/font/SteelworksVintageDemo.ttf') format('truetype'),
       url('/font/SteelworksVintageDemo.svg#SteelworksVintageDemo') format('svg'),
       url('/font/SteelworksVintageDemo.eot?#iefix') format('embedded-opentype');
  font-weight: normal;
  font-style: normal;
    font-display: fallback;
}

@font-face {
  font-family: 'OpenSans';
  src: url('/font/OpenSans-Regular.eot');
  src: url('/font/OpenSans-Regular.woff2') format('woff2'),
       url('/font/OpenSans-Regular.woff') format('woff'),
       url('/font/OpenSans-Regular.ttf') format('truetype'),
       url('/font/OpenSans-Regular.svg#OpenSans-Regular') format('svg'),
       url('/font/OpenSans-Regular.eot?#iefix') format('embedded-opentype');
  font-weight: normal;
  font-style: normal;
    font-display: fallback;
}

@font-face {
  font-family: 'OpenSans';
  src: url('/font/OpenSans-Bold.eot');
  src: url('/font/OpenSans-Bold.woff2') format('woff2'),
       url('/font/OpenSans-Bold.woff') format('woff'),
       url('/font/OpenSans-Bold.ttf') format('truetype'),
       url('/font/OpenSans-Bold.svg#OpenSans-Bold') format('svg'),
       url('/font/OpenSans-Bold.eot?#iefix') format('embedded-opentype');
  font-weight: bold;
  font-style: normal;
   font-display: fallback;
}


.animate-fade-in-slow{-webkit-animation:fade-in 1.0s forwards;animation:fade-in 1.0s forwards} 

.animate-fade-in{-webkit-animation:fade-in .25s forwards;animation:fade-in .25s forwards} 
@-webkit-keyframes fade-in{0%{opacity:0}100%{opacity:1}}
@keyframes fade-in{0%{opacity:0}100%{opacity:1}}

.animate-fade-out{-webkit-animation:fade-out .1s forwards;animation:fade-out .1s forwards}
@-webkit-keyframes fade-out{0%{opacity:1}100%{opacity:0.1}}
@keyframes fade-out{0%{opacity:1}100%{opacity:0.1}}



.animate-left-in{position:relative;z-index: 0;-webkit-animation:left-in .1s;animation:left-in .1s}
@-webkit-keyframes left-in{from{top:-50vh;opacity:0} to{top:0;opacity:1}}
@keyframes left-in{from{top:-50vh;opacity:0} to{top:0;opacity:1}}

.animate-right-out{position:relative;z-index: 0;-webkit-animation:right-out .1s;animation:right-out .1s}
@-webkit-keyframes right-out{from{top:0px;opacity:1} to{top:50vh;opacity:0}}
@keyframes right-out{from{top:0px;opacity:1} to{top:50vh;opacity:0}}

.w3-animate-fading{position:relative;-webkit-animation:fading 10s infinite;animation:fading 10s infinite}
@-webkit-keyframes fading{0%{opacity:0}50%{opacity:1}100%{opacity:0}}
@keyframes fading{0%{opacity:0}50%{opacity:1}100%{opacity:0}}
.w3-animate-opacity{-webkit-animation:opac 0.8s;animation:opac 0.8s}
@-webkit-keyframes opac{from{opacity:0} to{opacity:1}}
@keyframes opac{from{opacity:0} to{opacity:1}}
.w3-animate-top{position:relative;-webkit-animation:animatetop 0.4s;animation:animatetop 0.4s}
@-webkit-keyframes animatetop{from{top:-300px;opacity:0} to{top:0;opacity:1}}
@keyframes animatetop{from{top:-300px;opacity:0} to{top:0;opacity:1}}
.w3-animate-left{position:relative;-webkit-animation:animateleft 0.4s;animation:animateleft 0.4s}
@-webkit-keyframes animateleft{from{left:-1200px;opacity:0} to{left:0;opacity:1}}
@keyframes animateleft{from{left:-1200px;opacity:0} to{left:0;opacity:1}}
.w3-animate-right{position:relative;-webkit-animation:animateright 0.4s;animation:animateright 0.4s}
@-webkit-keyframes animateright{from{right:-300px;opacity:0} to{right:0;opacity:1}}
@keyframes animateright{from{right:-300px;opacity:0} to{right:0;opacity:1}}
.w3-animate-bottom{position:relative;-webkit-animation:animatebottom 0.4s;animation:animatebottom 0.4s}
@-webkit-keyframes animatebottom{from{bottom:-300px;opacity:0} to{bottom:0px;opacity:1}}
@keyframes animatebottom{from{bottom:-300px;opacity:0} to{bottom:0;opacity:1}}
.w3-animate-zoom {-webkit-animation:animatezoom 0.6s;animation:animatezoom 0.6s}
@-webkit-keyframes animatezoom{from{-webkit-transform:scale(0)} to{-webkit-transform:scale(1)}}
@keyframes animatezoom{from{transform:scale(0)} to{transform:scale(1)}}


.animate-wait-start{-webkit-animation:wait-start .25s forwards;animation:wait-start .25s forwards} 
@-webkit-keyframes wait-start{0%{background:white;}100%{background:  url('/img/wait.gif') no-repeat center top}}
@keyframes wait-start{0%{background:white;}100%{background:  url('/img/wait.gif') no-repeat center top}}




*{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}

html{-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}
body{margin:0}


article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block}
audio,canvas,video{display:inline-block;vertical-align:baseline}
audio:not([controls]){display:none;height:0}[hidden],template{display:none}
a{background-color:transparent}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}
dfn{font-style:italic}mark{background:#ff0;color:#000}
small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}
sup{top:-0.5em}sub{bottom:-0.25em}
img{border:0}
svg:not(:root){overflow:hidden}
figure{margin:0;padding:0;}
hr{-moz-box-sizing:content-box;box-sizing:content-box}
code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}
button,input,select,textarea{font:inherit;margin:0}
button{overflow:visible}button,select{text-transform:none}
button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer}
button[disabled],html input[disabled]{cursor:default}
button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}
input[type=checkbox],input[type=radio]{padding:0}
input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{height:auto}
input[type=search]{box-sizing:content-box;-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box}
input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}
fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:.35em .625em .75em}
legend{border:0;padding:0}
pre,textarea{overflow:auto}



a{color:inherit}

h1,h2,h3,h4,h5,h6{font-weight:400;margin:10px 0}.w3-wide{letter-spacing:4px}
h1 a,h2 a,h3 a,h4 a,h5 a,h6 a{font-weight:inherit}

hr{height:0;border:0;border-top:0px solid #eee;margin:0px 0;clear:both;}
img{margin-bottom:-5px}
table{border-collapse:collapse;border-spacing:0;width:100%;display:table}
table,th,td{border:none}.w3-table-all{border:1px solid #ccc}

.w3-light-grey,.w3-hover-light-grey:hover{color:#000!important;background-color:#f1f1f1!important}
.w3-black,.w3-hover-black:hover{color:#fff!important;background-color:#000!important}
.w3-white,.w3-hover-white:hover{color:#000!important;background-color:#fff!important}

.w3-text-red,.w3-hover-text-red:hover{color:#f44336!important} 
.w3-text-light-blue,.w3-hover-text-light-blue:hover{color:#87CEEB!important}
.w3-text-grey,.w3-hover-text-grey:hover{color:#757575!important}
.w3-text-indigo,.w3-hover-text-indigo:hover{color:#3f51b5!important}

.w3-content{max-width:980px;margin:auto}
.w3-main{transition:margin-left .4s}
.w3-container:after{content:"";display:table;clear:both}

.w3-center{text-align:center!important}

.w3-jumbo{font-size:64px!important}
.w3-xxlarge{font-size:36px!important}
.w3-large{font-size:18px!important}

.w3-padding-32{padding-top:32px!important;padding-bottom:32px!important}
.w3-row-padding:after{content:"";display:table;clear:both}
.w3-row-padding,.w3-row-padding>.w3-half,.w3-row-padding>.w3-third,.w3-row-padding>.w3-twothird,.w3-row-padding>.w3-threequarter,.w3-row-padding>.w3-quarter,.w3-row-padding>.w3-col{padding:0 8px}
.w3-third{float:left;width:100%}
.w3-third{width:99.99999%}
@media only screen and (min-width:601px) { .w3-third{width:33.33333%} }
@media only screen and (min-width:993px) { .w3-third{width:33.33333%} }
.w3-row-padding>.w3-third{padding:0 8px}

.w3-section{margin-top:16px!important;margin-bottom:16px!important}
.w3-padding-top{padding-top:8px!important}.w3-padding-bottom{padding-bottom:8px!important}


.w3-hover-none:hover{box-shadow:none!important;background-color:transparent!important}
.w3-show-inline-block{display:inline-block!important}


@media (max-width:600px){.w3-modal-content{margin:0 10px;width:auto!important}.w3-modal{padding-top:30px}}
@media (max-width:768px){.w3-modal-content{width:500px}.w3-modal{padding-top:50px}}
@media (min-width:993px){.w3-modal-content{width:900px}}
@media screen and (max-width:600px){.w3-topnav a{display:block}.w3-navbar li:not(.w3-opennav){float:none;width:100%!important}.w3-navbar li.w3-right{float:none!important}}	
@media screen and (max-width:600px){.w3-topnav .w3-dropdown-hover .w3-dropdown-content,.w3-navbar .w3-dropdown-click .w3-dropdown-content,.w3-navbar .w3-dropdown-hover .w3-dropdown-content{position:relative}}	
@media screen and (max-width:600px){.w3-topnav,.w3-navbar{text-align:center}}
@media (max-width:600px){.w3-hide-small{display:none!important}}
@media (max-width:992px) and (min-width:601px){.w3-hide-medium{display:none!important}}
@media (min-width:993px){.w3-hide-large{display:none!important}}
@media screen and (max-width:992px){.w3-sidenav.w3-collapse{display:none}.w3-main{margin-left:0!important;margin-right:0!important}}
@media screen and (min-width:993px){.w3-sidenav.w3-collapse{display:block!important}}


html, body
{
	color:#eee;	
	width:100%;
	height:100%;
	font-size: 21px;
	line-height:1.5;
	margin: 0;
	padding: 0;
   overflow-x:hidden;
}

@media 
(max-width: 1200px)
{
   html,body
     {
      font-size: 1.75vw;
   }
}

a
{
	text-decoration: inherit;
}


div, article
{
	margin: 0;
	padding: 0;
}

article
{
	overflow: hidden;
}


html,body,h1,h2,h3,h4,h5{font-family:OpenSans;}
.w3-sidenav a,.w3-sidenav h4 {font-weight:bold}

.vintage{font-family: "SteelworksVintage";}

.avenue{font-family:'AvenueX';}

#UpperMenu
{
	overflow:hidden;
}

#UpperMenu .Flag
{
	float:right;
	margin-left:.2rem;
	margin-right:.2rem;
}
#UpperMenu .Flag img
{
	width:1rem;
	height:1rem;
}

#UpperMenu .Flag:hover img
{
	margin-top:-.1rem;
	width:1.2rem;
	height:1.2rem;
	box-shadow: 1px 1px 4px rgba(160,160,160,1);
}

#Home 
{
   font-size: 3rem;
   padding:0;
	margin:0;
}

#Styles
{
   font-size: 2rem;
   padding:0;
	margin:0;
}

#Container
{
	font-size:.7rem;
	max-width:1200px;
	width:100%;

	
	margin:auto;
	box-shadow: 0px 2px 10px #444;
	text-shadow: 1px 1px 2px rgba(60,60,60,.25);
	overflow:hidden;		
}

#Container
{
      font-size:.7rem;
}

#Page
{

	min-height:calc(100vh - 512px);
	margin: 0;
	padding: 0;
	background-color: white;
}

a.Active
{
	text-shadow: 1px 1px 2px rgba(160,60,60,.4);
}

a:hover
{
	text-shadow: 1px 1px 2px rgba(160,60,60,.8);
}

#Menu
{
   font-size:.7rem;
}

#Menu a.Active
{
	color:rgba(230,230,230,1);
	text-shadow: 1px 1px 10px rgba(160,60,60,.8);
}

#Menu a:hover
{
	color:#aaa;
}

.MenuItem:hover
{
	color:#333;
}

.PageMargin
{
	padding:20px;
}

#ProductsOverview
{
	position:relative;
	margin:0;
	padding:0;
	width:100%;
	height:auto;
	
	background: -webkit-linear-gradient(#eee,#fff); /* Safari 5.1-6.0 */
    background:      -o-linear-gradient(#eee,#fff); /* Opera 11.1-12.0 */
    background:    -moz-linear-gradient(#eee,#fff); /* Firefox 3.6-15 */
	background:		    linear-gradient(#eee,#fff);
	
	
	overflow: hidden;
	

}

#ProductsOverview .Product
{
	
	position:relative;
	padding:5px;
	padding-bottom:12px;
	width:16.666666666%;
	float:left;
	text-align:center;
	
	display:block;
}
#ProductsOverview .Product:hover
{
	background-color:rgba(160,60,60,.2);
	box-shadow: 1px 1px 10px rgba(160,60,60,.2);
}

.GradientBar
{
   margin:0;
	background: -webkit-linear-gradient(#888,black); /* Safari 5.1-6.0 */
    background:      -o-linear-gradient(#888,black); /* Opera 11.1-12.0 */
    background:    -moz-linear-gradient(#888,black); /* Firefox 3.6-15 */
	background:		    linear-gradient(#888,black);
	
	
	
	height:1.1rem;
}


#ProductsOverview .ProductTitle
{
	background: -webkit-linear-gradient(#888,black); /* Safari 5.1-6.0 */
   background:      -o-linear-gradient(#888,black); /* Opera 11.1-12.0 */
   background:    -moz-linear-gradient(#888,black); /* Firefox 3.6-15 */
	background:		    linear-gradient(#888,black);
	
	padding-top:2px;
	font-size: .6rem;
	color:white;
	width:100%;
	display:block;
	border-radius:3px;
	height:1.1rem;
	overflow:hidden;
	
	box-shadow: 1px 1px 5px #bbb;
	
}

#ProductsOverview .Product img
{
	position:relative;
	top:4px;
	margin:0;
	padding:0;
	width:100%;height:auto;
	border-radius:3px;
	display:block;
	box-shadow: 1px 1px 5px #bbb;

	
}

#ProductsOverview .ProductDescriptionFrame
{
	box-shadow: 1px 1px 5px #bbb;
	background-color: white;
	
	font-size: .55rem;
	position:relative;
	top:8px;
	color:#666;
	
	width:100%;
	display:block;
	border-radius:3px;
	
	height: 5.6rem;
	overflow:hidden;
}

#ProductsOverview .ProductDescriptionFrame b
{
	color:#333;
	font-size: 1.1em;
}

#ProductsOverview .ProductDescriptionFrame .Gradient
{
	position:absolute;
	top:0px;
	width:100%;
	top:3.1rem;
	height:2.5rem;

	background: -webkit-linear-gradient(rgba(255,255,255,0), rgba(255,255,255,1)); /* Safari 5.1-6.0 */
    background:      -o-linear-gradient(rgba(255,255,255,0), rgba(255,255,255,1)); /* Opera 11.1-12.0 */
    background:    -moz-linear-gradient(rgba(255,255,255,0), rgba(255,255,255,1)); /* Firefox 3.6-15 */
	background:		    linear-gradient(rgba(255,255,255,0), rgba(255,255,255,1));

}


#ProductsOverview .Product a
{
	margin:0;
	padding:0;
}

 
.my-gallery
 {
  
	padding:20px;
	margin:0;

	text-align: center;
	display:block;

}


.my-gallery figure
{
	border-radius:3px;
	box-shadow: 1px 1px 6px #444;

	padding:0;
	margin: 3px;
	height: 128px;
	display:inline-block;
	overflow:hidden;
}

 .my-gallery figure img 
 {
	padding:0;
	padding:0; 
		width: auto;
    height: 128px;
	
}

.my-gallery figcaption
{
  display: none;
}


@media 
 (min-width: 501px) and (max-width: 1000px)
 {
	 #ProductsOverview  .Product
	 {

	 }
	 
 }

@media 
 (max-width: 800px),
 (-webkit-min-device-pixel-ratio: 1.1),  
 (min--moz-device-pixel-ratio: 1.1), 
 (-o-min-device-pixel-ratio: 1.1/1), 
 (min-device-pixel-ratio: 1.1), 
 (min-resolution: 100dpi), 
 (min-resolution: 1.1dppx) 
{
   
	#UpperMenu .Flag
	{
		margin-left:.4rem;
		margin-right:.4rem;
	}
	#UpperMenu .Flag img
	{
		width:2rem;
		height:2rem;
	}

	#UpperMenu .Flag:hover img
	{
		margin-top:-.2rem;
		width:2.4rem;
		height:2.4rem;
		box-shadow: 1px 1px 4px rgba(160,160,160,1);
	}
	
   #Container
    {
      font-size:1.4rem;     
   }
   
   #Home 
   {
      font-size: 6rem;
      padding:0;
      margin:0;
   }

   #Styles
   {
      font-size: 4rem;

   }
   
   .GradientBar
      {
      height:2.2rem;
   }
   #Menu
    {
      font-size:1.4rem;
   }

   
	 #ProductsOverview .Product
	 {
		width:33.333333333%;	 
	 }	
	 
	 .my-gallery img {
		width: auto;
	   height: 3.5rem;
	}
	
	#ProductsOverview .ProductTitle
	{
      height:2.2rem;
		font-size: 1.2rem;
	}
	
	#ProductsOverview .Product img
	{
		top:2px;
	}
	
	 #ProductsOverview .ProductDescriptionFrame
	{

		font-size:1.1rem;
		height:11.2rem;
	}
   
   #ProductsOverview .ProductDescriptionFrame .Gradient
    {
		top: 6.2rem;
      height:5rem;
   }

}

header,  footer
{
	clear:both;
	background-color:white;
    
}


#Menu
{

}

#Menu a
{
	color:white;
	margin:10px;
}

.underline
{
	text-decoration: underline;
}

#Flags 
{
	float: right;
}



.TextImage { 
 
  position: relative; 
     width: 100%; 
   max-height:300px;
   font-family: "SteelworksVintage";
   overflow:hidden;
   vertical-align: middle;
	text-align:center;   	
	color:rgba(0,0,0,.8);
}


body,div,footer
{
	margin-bottom:0;
	padding-bottom:0;
}

#FooterMenu
{
	clear:both;
	background: -webkit-linear-gradient(#888,black); /* Safari 5.1-6.0 */
    background:      -o-linear-gradient(#888,black); /* Opera 11.1-12.0 */
    background:    -moz-linear-gradient(#888,black); /* Firefox 3.6-15 */
	background:		    linear-gradient(#888,black);
	height:25px;
	text-align: center;
	font-size:.4vw;
	margin:0;
	padding:0;
}


.TextImage h2
{
	font-family: "SteelworksVintage";
}

.TextImage img
{
	 width: 100%; 
	 height: auto;
	 vertical-align: middle;

}

.TextImage .ImageText
{
	 position: absolute; 
   top:0px; 
   left: 0; 
   width: 100%; 
}

.TextImage  h1 { 
  
   margin: 0;
	padding: 0;
	font-size:1rem;
}