
/*------------------------------------------------------------------------
# mod_mx_sitetools Extension
# ------------------------------------------------------------------------
# author    mixwebtemplates
# copyright Copyright (C) 2020 mixwebtemplates.com. All Rights Reserved.
# @license - http://www.gnu.org/licenses/gpl-2.0.html GNU/GPL
# Websites: http://www.mixwebtemplates.com
-------------------------------------------------------------------------*/
:root {
 --mxtt-color:#f0401b;
 --mxtt-third-color:#f1f1f1;
 --mxtt-bgr-color: rgba(255,255,255,.4);
 --mxtt-txt-color: #222;

}
#time-tables .tab-content {
  padding: 0px;
  border: 0px solid transparent;
  background: transparent;
  color: var(--mxtt-txt-color);
  -webkit-box-shadow: 0 0px 0px rgba(0, 0, 0, 0.06);
  box-shadow: 0 0px 0px rgba(0, 0, 0, 0.06);
}

#time-tables .pxl-item--inner {
 display:flex;
 padding: 5px 5px 5px 5px;
}
@media(max-width:575px) {
 #time-tables .pxl-item--inner {
  flex-direction:column
 }
 #time-tables .pxl-item--inner div.pxl-item--left {
  width:100%;
  padding:30px 15px
 }
 #time-tables .pxl-item--inner div.pxl-item--holder {
  padding:40px 15px 42px
 }
}
#time-tables .pxl-item--inner .pxl-item--left {
 display:flex;
 flex-direction:column;
 justify-content:center;
 padding:0 30px;
 align-items:center;
 background-color:#fff;
 width:90px
}
#time-tables .pxl-item--inner .pxl-item--left span {
 font-size:14px;
 font-weight:700;
 line-height:15.96px;
 letter-spacing:.21px;
 text-transform:uppercase;
}
#time-tables .pxl-item--inner .pxl-item--left h4 {
 margin-bottom:0;
 font-size:22px;
 line-height:36px;
 position: relative;
 letter-spacing:1.92px
}
.hero-menu-item{
	counter-increment: count;
}
#time-tables .pxl-item--inner .pxl-item--left h4::before {
  content: counters(count, ".", decimal-leading-zero);
  position: absolute;
  top: 0px;
  right: 0;
  bottom: 0;
  left: -13px;
  margin: auto;
  height: 90px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
#time-tables .pxl-item--holder {
 display:flex;
 align-items:center;
 justify-content:space-between;
 padding:20px 40px;
 border:1px solid #f1f1f1;
 border-left-color:transparent;
 background:var(--mxtt-bgr-color);
 flex:4;
 flex-wrap:wrap
}
#time-tables .pxl-item--holder div,
#time-tables .pxl-item--holder>a {
 flex:1;
 display:flex;
 flex-direction:column
}
@media(max-width:991px) {
 #time-tables .pxl-item--holder div,
 #time-tables .pxl-item--holder>a {
  width:50%;
  flex:unset
 }
 #time-tables .pxl-item--holder div.pxl-item-title,
 #time-tables .pxl-item--holder>a.pxl-item-title,
 #time-tables .pxl-item--holder div.pxl-item--time,
 #time-tables .pxl-item--holder>a.pxl-item--time {
  margin-bottom:20px
 }
 #time-tables .pxl-item--holder div.btn,
 #time-tables .pxl-item--holder>a.btn {
  max-width:100%!important
 }
}
@media(max-width:991px) and (max-width:575px) {
 #time-tables .pxl-item--holder div,
 #time-tables .pxl-item--holder>a {
  width:100%
 }
 #time-tables .pxl-item--holder div.pxl-item-title,
 #time-tables .pxl-item--holder>a.pxl-item-title,
 #time-tables .pxl-item--holder div.pxl-item--time,
 #time-tables .pxl-item--holder>a.pxl-item--time,
 #time-tables .pxl-item--holder div.pxl-item--instrictor,
 #time-tables .pxl-item--holder>a.pxl-item--instrictor {
  margin-bottom:20px
 }
}
#time-tables .pxl-item--holder div h7,
#time-tables .pxl-item--holder>a h7 {
 margin-bottom:0
}
#time-tables .pxl-item--holder img {
 flex-direction:row;
 display:inline-flex;
 max-width: 80px;
 margin-right: 20px
}
#time-tables .pxl-item--holder div.btn,
#time-tables .pxl-item--holder>a.btn {
 flex-direction:row;
 display:inline-flex;
 max-width:150px;
 padding:14px 34px;
 max-height:52px
}
#time-tables .pxl-item--holder div.btn:after,
#time-tables .pxl-item--holder>a.btn:after,
#time-tables .pxl-item--holder div.btn:before,
#time-tables .pxl-item--holder>a.btn:before {
 background-color:var(--mxtt-color)
}
#time-tables .pxl-item--holder div.btn:hover span,
#time-tables .pxl-item--holder>a.btn:hover span {
 color:#fff
}
#time-tables .btn.btn-default {
 background:rgba(255,255,255,.9);
 backdrop-filter:blur(15px);
 z-index:3;
 cursor:pointer;
 height:100%;
 left:0;
 top:0;
 font-size:14px;
 font-style:normal;
 font-weight:600;
 color:#222;
 border-radius: 0;
 text-transform:uppercase;
 line-height:28px;
 display:inline-flex;
 align-items:center;
 justify-content:center;
 padding:18px 44px;
 letter-spacing:.28px;
 overflow:hidden
}
#time-tables .btn.btn-default span,
#time-tables .btn.btn-default i {
 position:relative;
 z-index:1;
 line-height:28px;
 -webkit-transition:all .3s linear 0ms;
 -khtml-transition:all .3s linear 0ms;
 -moz-transition:all .3s linear 0ms;
 -ms-transition:all .3s linear 0ms;
 -o-transition:all .3s linear 0ms;
 transition:all .3s linear 0ms
}
#time-tables .btn.btn-default:after {
 content:'';
 position:absolute;
 z-index:-1;
 width:calc(50% + 4.22px);
 height:100%;
 background-color:#fff;
 top:0;
 left:-50%;
 -webkit-transition:all .25s ease-in-out;
 -khtml-transition:all .25s ease-in-out;
 -moz-transition:all .25s ease-in-out;
 -ms-transition:all .25s ease-in-out;
 -o-transition:all .25s ease-in-out;
 transition:all .25s ease-in-out
}
#time-tables .btn.btn-default:before {
 content:'';
 position:absolute; 
 z-index:-1;
 width:calc(50% + 4.22px);
 height:100%;
 background-color:#fff;
 top:0;
 right:-50%;
 -webkit-transition:all .25s ease-in-out;
 -khtml-transition:all .25s ease-in-out;
 -moz-transition:all .25s ease-in-out;
 -ms-transition:all .25s ease-in-out;
 -o-transition:all .25s ease-in-out;
 transition:all .25s ease-in-out
}
#time-tables .btn.btn-default:hover span,
#time-tables .btn.btn-default:hover {
 color: #fff
}
#time-tables .btn.btn-default:hover:after {
 left:0
}
#time-tables .btn.btn-default:hover:before {
 right:0
}
#time-tables .btn.btn-primary {
 background-color:var(--mxtt-color);
 color:#fff;
 letter-spacing:.046px
}
#time-tables .pxl-tabs--title {
 display:inline-flex;
 align-items:center;
 margin-bottom:15px;
 flex-wrap:wrap;
 justify-content:center
}
@media(max-width:1200px) {
 #time-tables .pxl-tabs--title {
  margin-bottom:25px
 }
}
#time-tables .pxl-tabs--title .pxl-tab--title {
 line-height:50px;
 padding:0 25px;
 font-size:14px;
 font-weight:700;
 letter-spacing:.21px;
 color:var(--mxtt-txt-color);
 background: var(--mxtt-bgr-color);
 border:1px solid #dfdfdf;
 text-transform:uppercase;
 position:relative;
 z-index:1
}

#time-tables .pxl-tabs--title .pxl-tab--title+.pxl-tab--title {
 margin-left:15px
}
#time-tables .pxl-tabs--title .pxl-tab--title:before {
 content:'';
 position:absolute;
 top:-1px;
 right:-1px;
 bottom:-1px;
 left:-1px;
 color:#fff;
 background-color:var(--mxtt-color);
 z-index:-1;
 -webkit-transition:opacity 250ms linear 0ms;
 -khtml-transition:opacity 250ms linear 0ms;
 -moz-transition:opacity 250ms linear 0ms;
 -ms-transition:opacity 250ms linear 0ms;
 -o-transition:opacity 250ms linear 0ms;
 transition:opacity 250ms linear 0ms;
 opacity:0
}
#time-tables .pxl-tabs--title .pxl-tab--title.active {
 border-color:transparent;
 color: #fff
}
#time-tables .pxl-tabs--title .pxl-tab--title.active:before {
 opacity:1
}
#time-tables .pxl-tabs--inner {
 justify-content:center;
 display:flex;
 flex-wrap:wrap;
 width:100%
}
#time-tables .pxl-tabs--content {
 display:flex;
 width:100%;
 flex-wrap:wrap
}