/* #####################################################################################################
	Divide Tabs responsive stylesheet
   ##################################################################################################### */

/*--- standard variables ---*/
/*--- switch themes ---*/
/* #####################################################################################################
   This stylesheet is used for theme specific variables

   1 Munnichs

   ##################################################################################################### */
/*--- product item ratio (thumb + content) ---*/
/* set ProductImageRatio in productOverview! */
/*--- media queries. When using responsive ---*/
/* Range breakpoints */
/*--- media queries. When using responsive: only mobile & desktop ---
@responsive:	false;
@largePhone:	~"only screen and (min-width: 480px)";
@tablet:		~"only screen and (min-width: 999999999px)";
@tabletLand:	~"only screen and (min-width: 768px)";
@desktop:		~"only screen and (min-width: 768px)";

@upToTablet:	~"only screen and (max-width: 767px)";
@upToDesktop:	~"only screen and (max-width: 767px)";*/
/*--- media queries. When not using responsive ---
@responsive:	false;
@largePhone:	~"only screen and (min-width: 1px)";
@tablet:		~"only screen and (min-width: 1px)";
@tabletLand:	~"only screen and (min-width: 1px)";
@desktop:		~"only screen and (min-width: 1px)";

@upToTablet:	~"only screen and (max-width: 1px)";
@upToDesktop:	~"only screen and (max-width: 1px)";*/
/*----- Default functions -----*/
/*----- Default Crossbrowser functions -----*/
/*----- CSS3 functions -----*/
/*----- CSS3 Animation functions -----*/
/*----- Buttons -----*/
/*----- Responsive functions -----*/
.divideTabs {
  font-family: 'Montserrat', sans-serif;
}
.divideTabs > ul {
  margin: 0 !important;
  list-style: none !important;
  z-index: 20;
  overflow: hidden;
}
.divideTabs > ul li {
  float: left;
  position: relative;
  margin: 0 0 0 1%;
  min-width: 100px;
}
.divideTabs > ul li:first-child {
  margin: 0;
}
.divideTabs > ul a {
  height: 40px;
  line-height: 40px;
  display: block;
  background: #f0f0f0;
  border-bottom: 0 none;
  color: black;
  text-shadow: none;
  text-align: center;
  padding: 0 10px;
  -webkit-transition: none;
  -moz-transition: none;
  -o-transition: color 0 ease-in;
  transition: none;
}
.divideTabs > ul a:hover {
  background: rgba(255, 255, 255, 0.95);
  color: #f8f8f8;
  -webkit-transition: none;
  -moz-transition: none;
  -o-transition: color 0 ease-in;
  transition: none;
}
.divideTabs > ul li.active a,
.divideTabs > ul li.active a:hover {
  /*--Makes sure that the active tab does not listen to the hover properties--*/
  background: white;
  color: black;
  /*border-bottom: 1px solid @white;*/

}
.divideTabs > div {
  border-bottom: 1px solid black;
  margin: -1px 0 0 0;
  display: none;
  padding: 3% 0;
  z-index: 19;
}
.divideTabs .tabTitle {
  display: none;
  text-decoration: none;
}
.divideTabs .tabActive {
  display: block;
  border-bottom: none;
}
.divideTabs .tabActive .tabTitle {
  border-bottom: none!important;
}
.bold {
  font-weight: 600;
  margin-right: 4px;
}
/* ==========================================================================
   mobile styles
   ========================================================================== */

/*@media @upToTablet{*/

.divideTabs.tabsResponsive {
  text-align: center;
}
.divideTabs.tabsResponsive > ul {
  display: none !important;
}
.divideTabs.tabsResponsive > div.tabContent {
  display: block !important;
  padding: 0;
  margin: 0 0 1%;
  width: 100%;
  /*border: 1px solid darken(@backgroundColor, 10%);*/

}
.divideTabs.tabsResponsive .tabTitle {
  font-size: 18px;
  font-weight: bolder;
  font-family: 'IBM Plex Serif', serif;
  display: block;
  padding: 6% 3%;
  color: black;
  /*background: darken(@backgroundColor, 6%);*/
  -moz-backface-visibility: visible;
}
@media only screen and (min-width: 768px) {
  .divideTabs.tabsResponsive .tabTitle {
    padding: 2% 3%;
  }
}
.divideTabs.tabsResponsive .tabContentWrapper {
  padding: 30px 15px;
  width: 100%;
}
.divideTabs.tabsResponsive .tabContentWrapper select {
  min-width: 32.4%;
}
/*}*/

/* ==========================================================================
   tablet + desktop styles
   ========================================================================== */

/*@media @tablet{
	.divideTabs.tabsResponsive .tabContentWrapper {
		display: block!important;
	}
}*/