/* main tabs */


.tabs-wrapper {
  margin: 0px !important;
  padding: 0px !important;
  width: 100%;

}

.tabs-wrapper input[type=radio] {
  display: none; 
  margin: 0px !important;
  padding: 0px !important;
 }
 
.tabs-wrapper label {
  transition: background 0.4s ease-in-out, height 0.2s linear;
  display: inline-block;
  cursor: pointer;
  color: rgba(60,60,60,0.6);
  margin-right: -3px !important;
  padding: 0px !important;
  width: 32.65%;
  height: 2.6em;
  background: rgba(60,60,60,0.1);
  text-align: center;
  line-height: 2.6em; 
  transform: scale(1);
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-o-transform: scale(1);
	transition: all 0.3s ease-in-out;
  /*font-size: 10px !important;*/
  font-weight: bold; 
  color: #000;
}
 
.tabs-wrapper label:last-of-type {
  border-bottom: none; 
  margin: 0px !important;
  padding: 0px !important;
}
 
.tabs-wrapper label:hover {
  /*background: #82C22E;*/
  background: rgba(60,60,60,0.6);
  color: #EFEFEF;
  /*@include transform (translate(0,-0.2em));*/ 
}

.tabspecs {
	position: relative !important;
	display: table;
	left: 0px;
	margin: 0px;
	padding-left: 0px;
	padding-right: 0px;
	margin-bottom: 2px;
	width: 98.5%;
}

.specs_row_grey {
	position: relative;
	left: 0px !important;
	display: table;
	float: none;
	width: 97%;
	padding: 0px;
	margin: 0px;
	background: rgba(100,100,100,0.1);
	padding-bottom: 10px;
	padding-top: 10px;
	padding-left: 3%;
}

.specs_row_white {
	position: relative;
	left: 0px;
	display: table;
	float: none;
	width: 97%;
	padding: 0px;
	margin: 0px;
	background: rgba(255,255,255,1);
	padding-bottom: 10px;
	padding-top: 10px;
	padding-left: 3%;
}


#tab1:checked + label, 
#tab2:checked + label, 
#tab3:checked + label {
  /*background: #82C22E;*/
  background: rgb(252,193,56);
  /*color: rgba(60,60,60,0.6);*/
  /*font-weight: bold; */
  color: #000;
  /*font-size: 10px !important;*/
 }

.tab-body {
  position: absolute;
  top: -9999px;
  opacity: 0;
  padding: 0px; 
	margin: 0px;
}

.tab-body-wrapper {
  background: rgba(255,255,255,0.5);
  /*border-top: #82C22E 5px solid;
  border-bottom-right-radius: 3px;
  border-bottom-left-radius: 3px;
  border-top-right-radius: 3px;*/
  -webkit-animation-delay: 0.2s;
  -webkit-animation-duration: 1.5s;
  -webkit-animation-name: show;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-delay: 0.2s;
  -moz-animation-duration: 1.5s;
  -moz-animation-name: show;
  -moz-animation-fill-mode: forwards;
  -o-animation-delay: 0.2s;
  -o-animation-duration: 1.5s;
  -o-animation-name: show;
  -o-animation-fill-mode: forwards;
  animation-delay: 0.2s;
  animation-duration: 1.5s;
  animation-name: show;
  animation-fill-mode: forwards; 
}

.tab-body-wrapper pre,
.product-bigdescription pre {
	font-family: 'Tahoma', sans-serif;
	color: rgba(130,130,130,1);
	font-style: normal;
	font-size: 1em;
	white-space: pre-wrap;       
  white-space: -moz-pre-wrap; 
  white-space: -pre-wrap;      
  white-space: -o-pre-wrap;    
  word-wrap: break-word;  
  margin: 0px;
  padding: 0px; 
  width: 98.5%; 
  padding-bottom: 10px;
}

.tab-body-wrapper pre {
	padding-top: 10px;
}

#tab1:checked ~ .tab-body-wrapper #tab-body-1, 
#tab2:checked ~ .tab-body-wrapper #tab-body-2, 
#tab3:checked ~ .tab-body-wrapper #tab-body-3 {
  position: relative;
  top: 0px;
  left: 0px;
  /* Choose one */
  -webkit-animation-delay: 0.2s;
  -webkit-animation-duration: 0.8s;
  -webkit-animation-name: content-opacity;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-delay: 0.2s;
  -moz-animation-duration: 0.8s;
  -moz-animation-name: content-opacity;
  -moz-animation-fill-mode: forwards;
  -o-animation-delay: 0.2s;
  -o-animation-duration: 0.8s;
  -o-animation-name: content-opacity;
  -o-animation-fill-mode: forwards;
  animation-delay: 0.2s;
  animation-duration: 0.8s;
  animation-name: content-opacity;
  animation-fill-mode: forwards;
  /* @include animation(0.2s,0.8s,content-rotate-x); */
  /* @include animation(0.2s,0.8s,content-rotate-y); */
  /* @include animation(0.2s,0.8s,content-rotate-both); */
  /* @include animation(0.2s,0.8s,content-pop-in); */
  /* @include animation(0.2s,0.8s,content-pop-out); */
  /* @include animation(0.1s,1s,content-slide-bot); */
  /*@include animation(0.1s,1s,content-slide-top);*/ }


/* ANIMATIONS */

@-webkit-keyframes content-opacity {
  from {
    opacity: 0; }

  to {
    opacity: 1; } 
}

@-moz-keyframes content-opacity {
  from {
    opacity: 0; }

  to {
    opacity: 1; } 
}

@-o-keyframes content-opacity {
  from {
    opacity: 0; }

  to {
    opacity: 1; } 
}

@keyframes content-opacity {
  from {
    opacity: 0; }

  to {
    opacity: 1; } 
}

@-webkit-keyframes content-rotate-y {
  from {
    -webkit-transform: rotateY(90deg);
    -moz-transform: rotateY(90deg);
    -ms-transform: rotateY(90deg);
    -o-transform: rotateY(90deg);
    transform: rotateY(90deg); }

  to {
    opacity: 1;
    -webkit-transform: rotateY(0deg);
    -moz-transform: rotateY(0deg);
    -ms-transform: rotateY(0deg);
    -o-transform: rotateY(0deg);
    transform: rotateY(0deg); } 
}

@-moz-keyframes content-rotate-y {
  from {
    -webkit-transform: rotateY(90deg);
    -moz-transform: rotateY(90deg);
    -ms-transform: rotateY(90deg);
    -o-transform: rotateY(90deg);
    transform: rotateY(90deg); }

  to {
    opacity: 1;
    -webkit-transform: rotateY(0deg);
    -moz-transform: rotateY(0deg);
    -ms-transform: rotateY(0deg);
    -o-transform: rotateY(0deg);
    transform: rotateY(0deg); } 
}

@-o-keyframes content-rotate-y {
  from {
    -webkit-transform: rotateY(90deg);
    -moz-transform: rotateY(90deg);
    -ms-transform: rotateY(90deg);
    -o-transform: rotateY(90deg);
    transform: rotateY(90deg); }

  to {
    opacity: 1;
    -webkit-transform: rotateY(0deg);
    -moz-transform: rotateY(0deg);
    -ms-transform: rotateY(0deg);
    -o-transform: rotateY(0deg);
    transform: rotateY(0deg); } 
}

@keyframes content-rotate-y {
  from {
    -webkit-transform: rotateY(90deg);
    -moz-transform: rotateY(90deg);
    -ms-transform: rotateY(90deg);
    -o-transform: rotateY(90deg);
    transform: rotateY(90deg); }

  to {
    opacity: 1;
    -webkit-transform: rotateY(0deg);
    -moz-transform: rotateY(0deg);
    -ms-transform: rotateY(0deg);
    -o-transform: rotateY(0deg);
    transform: rotateY(0deg); } 
}

@-webkit-keyframes content-rotate-x {
  from {
    -webkit-transform: rotateX(90deg);
    -moz-transform: rotateX(90deg);
    -ms-transform: rotateX(90deg);
    -o-transform: rotateX(90deg);
    transform: rotateX(90deg); }

  to {
    opacity: 1;
    -webkit-transform: rotateX(0deg);
    -moz-transform: rotateX(0deg);
    -ms-transform: rotateX(0deg);
    -o-transform: rotateX(0deg);
    transform: rotateX(0deg); } 
}

@-moz-keyframes content-rotate-x {
  from {
    -webkit-transform: rotateX(90deg);
    -moz-transform: rotateX(90deg);
    -ms-transform: rotateX(90deg);
    -o-transform: rotateX(90deg);
    transform: rotateX(90deg); }

  to {
    opacity: 1;
    -webkit-transform: rotateX(0deg);
    -moz-transform: rotateX(0deg);
    -ms-transform: rotateX(0deg);
    -o-transform: rotateX(0deg);
    transform: rotateX(0deg); } 
}

@-o-keyframes content-rotate-x {
  from {
    -webkit-transform: rotateX(90deg);
    -moz-transform: rotateX(90deg);
    -ms-transform: rotateX(90deg);
    -o-transform: rotateX(90deg);
    transform: rotateX(90deg); }

  to {
    opacity: 1;
    -webkit-transform: rotateX(0deg);
    -moz-transform: rotateX(0deg);
    -ms-transform: rotateX(0deg);
    -o-transform: rotateX(0deg);
    transform: rotateX(0deg); } 
}

@keyframes content-rotate-x {
  from {
    -webkit-transform: rotateX(90deg);
    -moz-transform: rotateX(90deg);
    -ms-transform: rotateX(90deg);
    -o-transform: rotateX(90deg);
    transform: rotateX(90deg); }

  to {
    opacity: 1;
    -webkit-transform: rotateX(0deg);
    -moz-transform: rotateX(0deg);
    -ms-transform: rotateX(0deg);
    -o-transform: rotateX(0deg);
    transform: rotateX(0deg); } 
}

@-webkit-keyframes content-rotate-both {
  from {
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    transform: rotate(90deg);
    -webkit-transform-origin: 0% 50% 50%;
    -moz-transform-origin: 0% 50% 50%;
    -ms-transform-origin: 0% 50% 50%;
    -o-transform-origin: 0% 50% 50%;
    transform-origin: 0% 50% 50%; }

  to {
    opacity: 1;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transform-origin: 0% 50% 50%;
    -moz-transform-origin: 0% 50% 50%;
    -ms-transform-origin: 0% 50% 50%;
    -o-transform-origin: 0% 50% 50%;
    transform-origin: 0% 50% 50%; } 
}

@-moz-keyframes content-rotate-both {
  from {
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    transform: rotate(90deg);
    -webkit-transform-origin: 0% 50% 50%;
    -moz-transform-origin: 0% 50% 50%;
    -ms-transform-origin: 0% 50% 50%;
    -o-transform-origin: 0% 50% 50%;
    transform-origin: 0% 50% 50%; }

  to {
    opacity: 1;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transform-origin: 0% 50% 50%;
    -moz-transform-origin: 0% 50% 50%;
    -ms-transform-origin: 0% 50% 50%;
    -o-transform-origin: 0% 50% 50%;
    transform-origin: 0% 50% 50%; } 
}

@-o-keyframes content-rotate-both {
  from {
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    transform: rotate(90deg);
    -webkit-transform-origin: 0% 50% 50%;
    -moz-transform-origin: 0% 50% 50%;
    -ms-transform-origin: 0% 50% 50%;
    -o-transform-origin: 0% 50% 50%;
    transform-origin: 0% 50% 50%; }

  to {
    opacity: 1;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transform-origin: 0% 50% 50%;
    -moz-transform-origin: 0% 50% 50%;
    -ms-transform-origin: 0% 50% 50%;
    -o-transform-origin: 0% 50% 50%;
    transform-origin: 0% 50% 50%; } 
}

@keyframes content-rotate-both {
  from {
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    transform: rotate(90deg);
    -webkit-transform-origin: 0% 50% 50%;
    -moz-transform-origin: 0% 50% 50%;
    -ms-transform-origin: 0% 50% 50%;
    -o-transform-origin: 0% 50% 50%;
    transform-origin: 0% 50% 50%; }

  to {
    opacity: 1;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transform-origin: 0% 50% 50%;
    -moz-transform-origin: 0% 50% 50%;
    -ms-transform-origin: 0% 50% 50%;
    -o-transform-origin: 0% 50% 50%;
    transform-origin: 0% 50% 50%; } 
}

@-webkit-keyframes content-pop-out {
  0% {
    opacity: 1;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1); }

  50% {
    opacity: 1;
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1); }

  100% {
    opacity: 1;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1); } 
}

@-moz-keyframes content-pop-out {
  0% {
    opacity: 1;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1); }

  50% {
    opacity: 1;
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1); }

  100% {
    opacity: 1;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1); } 
}

@-o-keyframes content-pop-out {
  0% {
    opacity: 1;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1); }

  50% {
    opacity: 1;
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1); }

  100% {
    opacity: 1;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1); } 
}

@keyframes content-pop-out {
  0% {
    opacity: 1;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1); }

  50% {
    opacity: 1;
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1); }

  100% {
    opacity: 1;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1); } 
}

@-webkit-keyframes content-pop-in {
  from {
    opacity: 1;
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1); }

  to {
    opacity: 1;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1); } 
}

@-moz-keyframes content-pop-in {
  from {
    opacity: 1;
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1); }

  to {
    opacity: 1;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1); } 
}

@-o-keyframes content-pop-in {
  from {
    opacity: 1;
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1); }

  to {
    opacity: 1;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1); } 
}

@keyframes content-pop-in {
  from {
    opacity: 1;
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1); }

  to {
    opacity: 1;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1); } 
}

@-webkit-keyframes content-slide-bot {
  from {
    top: 20px;
    opacity: 0; }

  to {
    top: 0px;
    opacity: 1; } }

@-moz-keyframes content-slide-bot {
  from {
    top: 20px;
    opacity: 0; }

  to {
    top: 0px;
    opacity: 1; } 
}

@-o-keyframes content-slide-bot {
  from {
    top: 20px;
    opacity: 0; }

  to {
    top: 0px;
    opacity: 1; } 
}

@keyframes content-slide-bot {
  from {
    top: 20px;
    opacity: 0; }

  to {
    top: 0px;
    opacity: 1; } 
}

@-webkit-keyframes content-slide-top {
  from {
    top: -20px;
    opacity: 0; }

  to {
    top: 0px;
    opacity: 1; } 
}

@-moz-keyframes content-slide-top {
  from {
    top: -20px;
    opacity: 0; }

  to {
    top: 0px;
    opacity: 1; } 
}

@-o-keyframes content-slide-top {
  from {
    top: -20px;
    opacity: 0; }

  to {
    top: 0px;
    opacity: 1; } 
}

@keyframes content-slide-top {
  from {
    top: -20px;
    opacity: 0; }

  to {
    top: 0px;
    opacity: 1; } 
}

/* used for wrapper animation after the load of the page */
@-webkit-keyframes show {
  from {
    opacity: 0; }

  to {
    opacity: 1; } 
}

@-moz-keyframes show {
  from {
    opacity: 0; }

  to {
    opacity: 1; } 
}

@-o-keyframes show {
  from {
    opacity: 0; }

  to {
    opacity: 1; } 
}

@keyframes show {
  from {
    opacity: 0; }

  to {
    opacity: 1; } 
}

@media screen and (max-width: 500px) {
  .tabs-wrapper label {
    width: 99.9%;
    display: block;
    /*border-bottom: 2px solid #111111;
    border-radius: 0px;*/
  } 
  
  .tabspecs {
		width: 100%;
	}
	
	.tabs-wrapper {
    margin: 0px !important;
  	padding: 0px !important;
  } 
  
  .specs_row_grey,
	.specs_row_white {
		width: 98.9%;
	}
}