.popupfixed {
max-width:1200px;}
/* Style the button that is used to open and close the collapsible content */
.diadoracollapse {
  color: #444;
  cursor: pointer;
  padding: 16px;
  width: 14%;
  border: none;
  text-align: left;
  outline: #0000003b 1px solid;
  font-size: 15px;
  margin-right:-3px;
}
.diadoracollapsefix {
color: #444;
cursor: pointer;
padding: 16px;
width: 9.57%;
border:none;
text-align:left;
outline: #0000003b 1px solid;
font-size:15px;
margin-right:-3px;
}
.diadoracollapse:hover {background-color:#b2b2b2}
.activesizechart {
background-color:#4d4747 !important;
color:#000000!important
}
/* Add a background color to the button if it is clicked on (add the .active class with JS), and when you move the mouse over it (hover) */
.active-collapseable{
  background-color: #ccc;
}

/* Style the collapsible content. Note: hidden by default */
.diadorahidden {
  padding: 0 18px;
  display: none;
  overflow: hidden;
  background-color: #f1f1f1;
}
.diadora-shown {
  padding: 0 18px;
  display: block;
  overflow: hidden;
  background-color: #f1f1f1;
}
table.sizecharttable{
border-collapse: initial;
border-spacing: 1rem 0;
margin-bottom: 3rem;
}
.sizechartinfo {
    text-align: center;
    font-weight: bold;
    border-bottom: black 1px solid;
}
.sizechartsize {
text-align:center;
 border-bottom:1px black solid;
}
.SizechartHeader {
    font-weight:bold;
    text-align: center;
    border-bottom: black;
    border-width: 3px;
    border-style: solid;
    border-top: none;
    border-left: none;
    border-right: none;
}
/* Container */
.jukseprove {
	width: 100%;
	float: left;
	margin-left: auto;
	margin-right: auto;
	background-color: #FFFFFF;
}
.cardsfix {
padding-top:30px;}
/* Header */
.logo {
	color: #000000;
	font-weight: bold;
	margin-left: auto;
	letter-spacing: 4px;
	margin-right: auto;
	text-align: center;
	padding-top: 15px;
	line-height: 2em;
	font-size: 22px;
}
.hero_header {
	color: #000000;
	text-align: center;
	margin: 0;
	letter-spacing: 4px;
}
/* About Section */
.text_column {
	width: 90%;
	text-align: left;
	font-weight: lighter;
	line-height: 25px;
	float: left;
	padding-left: 20px;
	padding-right: 20px;
	color: #A3A3A3;
}
.gallery {
	clear: both;
	display: flex;
    flex-wrap: wrap;
	width: 100%;
	background-color: #FFFFFF;
	/* [disabled]min-width: 400px;
*/
	padding-bottom: 35px;
	padding-top: 0px;
    padding-left: 160px;
	margin-top: -5px;
	margin-bottom: 0px;
}
.thumbnail2 {
	width: 23%;
	text-align: center;
	float: left;
	margin-top: 35px;
	background-color: #F8F8F8;
	padding-bottom: 20px;
	margin-left: 1%;
	margin-right: 1%;
	border-radius: 3px;
	padding-top: 20px;
	border-bottom: 4px solid #6DC7D0;
}
.gallery .thumbnail2 h4 {
	margin-top: 5px;
	margin-bottom: 5px;
	color: #52BAD5;
	text-align: left;
	padding-left: 20px;
	padding-right: 20px;
}
.gallery .thumbnail2 p {
	margin: 0;
	color: #B3B3B3;
	text-align: left;
	padding-left: 20px;
}
.thumbnailkatalog {
	width: 28%;
	text-align: center;
	float: left;
	margin-top: 35px;
	background-color: #F8F8F8;
	padding-bottom: 20px;
	margin-left: 1%;
	margin-right: 1%;
	border-radius: 3px;
	padding-top: 20px;
	border-bottom: 4px solid #00000029;
}
.gallery .thumbnailkatalog h4 {
	margin-top: 5px;
	margin-bottom: 5px;
	color: #000000;
	text-align: left;
	padding-left: 20px;
	padding-right: 20px;
}
.gallery .thumbnailkatalog p {
	margin: 0;
	color: #000000cc;
	text-align: left;
	padding-left: 20px;
}
/* More info */
.intro {
	background-color: #FFFFFF;
	padding-bottom: 35px;
}
.column {
	width: 50%;
	text-align: center;
	padding-top: 30px;
	float: left;
}
.intro .column h3 {
	color: #FFFFFF;
	text-align: center;
}
.intro .column p {
	color: #FFFFFF;
}
.cards {
	width:auto;
	height: auto;
	max-width: 100%;
	max-height: 135px;
	opacity: 0.8;
}
.intro .column p {
	padding-left: 30px;
	padding-right: 30px;
	text-align: justify;
	line-height: 25px;
	font-weight: lighter;
	margin-left: 20px;
	margin-right: 20px;
	width: 80%;
	margin-top: 4%;
}
.index{height:auto;
	width: 100px;
	margin-top: 40px;
	margin-right: auto;
	margin-bottom: auto;
	margin-left: 700px;
	padding-top: 20px;
	padding-right: 10px;
	padding-bottom: 20px;
	padding-left: 10px;
	text-align: center;
	vertical-align: middle;
	border-radius: 30px;
	text-transform: uppercase;
	font-weight: bold;
	letter-spacing: 2px;
	border: 0.1px solid #FFFFFF;
	color: #FFF;
	transition: all 0.3s linear;
	background-color:#FF6400;
	font-size: 13px;
	cursor: pointer;
	float: left
	
}
.knapp1 {
	height:auto;
	width: 100px;
	margin-top: 40px;
	margin-right: auto;
	margin-bottom: auto;
	margin-left: auto;
	padding-top: 20px;
	padding-right: 10px;
	padding-bottom: 20px;
	padding-left: 10px;
	text-align: center;
	vertical-align: middle;
	border-radius: 30px;
	text-transform: uppercase;
	font-weight: bold;
	letter-spacing: 2px;
	border: 0.1px solid #FFFFFF;
	color: #000000;
	transition: all 0.3s linear;
	background-color:#FF6400;
	font-size: 13px;
	cursor: pointer;
	float: left
	
}
.knapp1:hover {
	background-color: #FF6400;
	color: #000000;
	cursor: pointer;
	
}
.knapp1:active {
	color: #0088FF;
	display: block;
}
.knapp2 {
	height:auto;
	width: 100px;
	margin-top: 40px;
	margin-right: auto;
	margin-bottom: 20px;
	margin-left: auto;
	padding-top: 20px;
	padding-right: 10px;
	padding-bottom: 20px;
	padding-left: 10px;
	text-align: center;
	vertical-align: middle;
	border-radius: 30px;
	text-transform: uppercase;
	font-weight: bold;
	letter-spacing: 2px;
	border: 0.1px solid #FFFFFF;
	color: #000000;
	transition: all 0.3s linear;
	background-color:#FF6400;
	font-size: 13px;
	cursor: pointer;
	float: left
	
}
.knapp2:hover {
	background-color: black;
	color: #000000;
	cursor: pointer;
	
}
.knapp3 {
	align-content: center;
	height:auto;
	width: 100px;
	margin-top: 40px;
	margin-right: auto;
	margin-bottom: auto;
	margin-left: auto;
	padding-top: 20px;
	padding-right: 10px;
	padding-bottom: 20px;
	padding-left: 10px;
	text-align: center;
	vertical-align: middle;
	border-radius: 30px;
	text-transform: uppercase;
	font-weight: bold;
	letter-spacing: 2px;
	border: 0.1px solid #FFFFFF;
	color: #000000;
	transition: all 0.3s linear;
	background-color:#FF6400;
	font-size: 13px;
	cursor: pointer;
	float:left
	
}
.knapp3:hover {
	background-color: #FF6400;
	color: #000000;
	cursor: pointer;
	
}
.copyright {
	text-align: center;
	padding-top: 20px;
	padding-bottom: 20px;
	background-color: #717070;
	color: #FFFFFF;
	text-transform: uppercase;
	font-weight: lighter;
	letter-spacing: 2px;
	border-top-width: 2px;
}
.intro {
	display: inline-block;
	background-color: #6DC7D0;
}
.profile {
	width: 50%;
}
.gallery .thumbnail2 .tag {
	color: #5D5E5D;
	padding-bottom: 4px;
	padding-top: 4px;
	text-align: left;
	padding-left: 20px;
	padding-right: 20px;
}
.tag
{
  font-size:16px;
}
#diadora-table 
{
  display:inline-flex;
  width:1163px;
}
/* Mobile */
@media (max-width: 600px) {
  .diadora-table{
  display:block;
  width:auto;
  height:auto;
  }
.logo {
	width: 100%;
	text-align: center;
	margin-top: 13px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
}
.text_column {
	width: 100%;
	text-align: justify;
	padding: 0;
}
.intro .jukseprove p {
	width: 80%;
	margin-left: 0px;
}
.text_column {
	padding-left: 20px;
}
.jukseprove {
	width: 100%;
	margin-top: 0px;
}
.hero_header {
	padding-left: 10px;
	padding-right: 10px;
	line-height: 22px;
	text-align: center;
 			}
  .w3-black{
    color:#000000!important;
    background-color:#FF6400!important
  }
  .w3-hover-black:hover
  {
    color:#000000!important;
    background-color:#fff!important;
  }
  .diadoracollapse 
  {
  margin-left:0px;
  width:50.5%;
  padding-right:18px;
  padding-left:9px;
  padding-top:10px;
  padding-bottom:10px;
  outline:#0000002b 1px solid;
  font-size:13px;
  }
  .diadoracollapse:hover{background-color:#dddddd;}
  #diadora-table{
  display:block;
  width:auto;
  height:auto;
  margin-left:0px;
  margin-right: -4px;
  }
  .sizechartinfo{
  padding-right:25px;
  }
  .w3-black,{color:#000000!important;background-color:#FF6400!important}
  .w3-hover-black:hover{color:#000000!important; background-color:#fff!important}
  .w3-sidebar-menu {
   display:flex;
   margin: auto;
   flex-direction:row;
   flex-wrap: wrap;
  }
  .flexfixit{
   background-color:white;
  display:flex;
  flex-wrap:wrap}
  .mobilefix {padding:3px;}
.mobilefixcraft {
  padding:0px;
  font-size:11px;
  width:281px;
	}
  .thumbnail2 {
	width: 164%;
  margin-left:-35%;
}
  .thumbnailkatalog {
    width:74%;
   margin-left:16%;}
   .galleryfiks {
  padding-left:80px;
  }
  .popup{
	padding:50px 60px;
	text-align: left;
	max-width: 341px;
	margin: 71px -61px;
	position: relative;
	}
  .diadoracollapsefix {
    color: #444;
    cursor: pointer;
    padding: 8px;
    width: 33%;
    border: none;
    text-align: left;
    outline: #0000003b 1px solid;
    font-size: 13px;
    margin-right: -2px;
  }
  .sizechartsize {
  text-align:left;}

}


/* Small Tablets */
@media (min-width: 454px)and (max-width: 767px) {
.logo {
	width: 100%;
	text-align: center;
	margin-top: 13px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
}
.text_column {
	width: 100%;
	text-align: left;
	padding: 0;
}
.thumbnail2 {
	width: 100%;
	height: 100%;
}
.jukseprove {
	width: 100%;
	margin-top: 0px;
}
.thumbnail2 {
	width: 100%;
	height: 150%;
}
.text_column {
	padding-left: 20px;
	padding-right: 20px;
	width: 90%;
}
.column {
	width: 100%;
	margin-left: 0px;
	margin-right: 0px;
}
.profile {
	width: 100%;
}
.intro .column p {
	width: 90%;
	text-align: center;
	padding-left: 0px;
}
  .w3-bar-block .w3-bar-item{
   padding:7px 14px;
  } 

  
}


/* Small Desktops */
@media (min-width : 765px ) and ( max-width : 1669px ){
.text_column {
	width: 100%;
}
.thumbnail2 {
	width: 48%;
}
.text_column {
	width: 90%;
	margin: 0;
	padding: 20px;
}
.intro .column p {
	width: 80%;
}
}
.w3-sidebar-menu {height:auto;width:auto !important;background-color:#fff;position:initial !important;z-index:1;overflow:hidden; display:inline-flex; flex-direction: row;}
.w3-sidebar{height:auto;width:100px !important;background-color:#fff;position:absolute !important;z-index:1;overflow:hidden; }
.w3-bar .w3-bar-item {padding:8px 16px;float:left;width:auto;border:none;display:block;outline:0;}
.w3-bar-item:hover {text-decoration:underline; background-color:#b2b2b2;}
.w3-bar .w3-dropdown-hover,.w3-bar .w3-dropdown-click{position:static;float:left}
.w3-bar .w3-button{white-space:normal}
.w3-bar-block .w3-bar-item{width:100%;display:block;padding:8px 16px;text-align:left;border:none;white-space:normal;float:none;outline:0}
.w3-bar-block.w3-center .w3-bar-item{text-align:center}.w3-block{display:block;width:100%}
.w3-black,.w3-hover-black:before{color:#000000!important;background-color:#FF6400!important;}
.w3-card,.w3-card-2{box-shadow:0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12)}
.w3-card-4,.w3-hover-shadow:hover{box-shadow:0 4px 10px 0 rgba(0,0,0,0.2),0 4px 20px 0 rgba(0,0,0,0.19)}
.w3-animate-fading{animation:fading 10s infinite}@keyframes fading{0%{opacity:0}50%{opacity:1}100%{opacity:0}}
.w3-animate-opacity{animation:opac 0.8s}@keyframes opac{from{opacity:0} to{opacity:1}}
.w3-animate-top{animation:fading 10s infinite}@keyframes fading{0%{opacity:0}50%{opacity:1}100%{opacity:0}}
.w3-animate-left{position:relative;animation:animateleft 0.4s}@keyframes animateleft{from{left:-300px;opacity:0} to{left:0;opacity:1}}
.w3-animate-right{position:relative;animation:animateright 0.4s}@keyframes animateright{from{right:-300px;opacity:0} to{right:0;opacity:1}}
.w3-animate-bottom{position:relative;animation:animatebottom 0.4s}@keyframes animatebottom{from{bottom:-300px;opacity:0} to{bottom:0;opacity:1}}
.w3-animate-zoom {animation:animatezoom 0.6s}@keyframes animatezoom{from{transform:scale(0)} to{transform:scale(1)}}
.w3-animate-input{transition:width 0.4s ease-in-out}.w3-animate-input:focus{width:100%!important}
.w3-red,.w3-hover-red:hover{color:#fff!important;background-color:#4d4747 !important}
.w3-grey,.w3-hover-grey:hover,.w3-gray,.w3-hover-gray:hover{color:#000!important;background-color:#9e9e9e!important}
.w3-light-grey,.w3-hover-light-grey:hover,.w3-light-gray,.w3-hover-light-gray:hover{color:#000!important;background-color:#f1f1f1!important}