.resp-tabs-list{margin:0px; padding:0px; border-bottom:2px solid #000000;}
.resp-tabs-list:after{content:""; clear:both; display:table;}
.resp-tabs-list li{border:0px; text-transform:uppercase; border-bottom:2px solid transparent; font-size:16px; font-weight:300; color:#000000; display:inline-block; padding:.5rem 1rem; margin:0; list-style:none; cursor:pointer; float:left;
-webkit-transform:perspective(1px) translateZ(0); transform:perspective(1px) translateZ(0); box-shadow:0 0 1px rgba(0, 0, 0, 0);
position:relative; -webkit-transition-property:color; transition-property:color; -webkit-transition-duration:0.3s; transition-duration:0.3s;}
.resp-tabs-list li:before{content:""; position:absolute; z-index:-1; top:0; bottom:0; left:0; right:0; background:#e7e6e6; -webkit-transform:scaleX(0);
transform:scaleX(0); -webkit-transform-origin:50%; transform-origin:50%; -webkit-transition-property:transform; transition-property:transform; -webkit-transition-duration:0.3s;
transition-duration:0.3s; -webkit-transition-timing-function:ease-out; transition-timing-function:ease-out; border-color:#ffffff #ffffff #000000;}
.resp-tabs-list li:hover:before,
.resp-tabs-list li:focus:before{-webkit-transform:scaleX(1); transform:scaleX(1);}
.resp-tabs-list li:hover{border-bottom:2px solid #dee2e6;}

.resp-tabs-list li.resp-tab-active{border-bottom:2px solid #000000;}
.resp-tabs-container{padding:0px; background-color:#fff; clear:left;}
.resp-tab-content{display:none; padding-top:20px;}
.resp-content-active,
.resp-accordion-active{display:block;}

h2.resp-accordion{display:none; text-transform:uppercase; border:1px solid #d6d6d6; margin:0px 0px 5px 0px; padding:.5rem 1rem; font-size:16px; font-weight:300;}

/*----------- Vertical Tabs -----------*/
.resp-vtabs ul.resp-tabs-list{float:left; width:30%;}
.resp-vtabs .resp-tabs-list li{display:block; padding:15px 15px !important; margin:0; cursor:pointer; float:none;}
.resp-vtabs .resp-tabs-container{padding:0px; background-color:#fff; border:1px solid #d6d6d6; float:left; width:68%; min-height:250px; border-radius:4px; clear:none;}
.resp-vtabs .resp-tab-content{border:none;}
.resp-vtabs li.resp-tab-active{border:1px solid #d6d6d6; border-right:none; background-color:#fff; position:relative; z-index:1; margin-right:-1px !important; padding:14px 15px 15px 14px !important;}
.resp-arrow{width:0; height:0; float:right; margin-top:5px; border-left:5px solid transparent; border-right:5px solid transparent; border-top:6px solid #d6d6d6;}
h2.resp-tab-active span.resp-arrow{border:none; border-left:5px solid transparent; border-right:5px solid transparent; border-bottom:6px solid #ffffff;}
/*-----------Accordion styles-----------*/

h2.resp-tab-active{background:#000000; color:#ffffff;}
.resp-easy-accordion h2.resp-accordion{display:block;}
.resp-easy-accordion .resp-tab-content{border:1px solid #d6d6d6;}
.resp-easy-accordion .resp-tab-content:last-child{border-bottom:1px solid #d6d6d6 !important;}
.resp-jfit{width:100%; margin:0px;}
.resp-tab-content-active{display:block;}

/*Here your can change the breakpoint to set the accordion, when screen resolution changed*/
@media only screen and (max-width:767px) {
  ul.resp-tabs-list{display:none;}
  h2.resp-accordion{display:block;}
  .resp-vtabs .resp-tab-content{border:1px solid #d6d6d6;}
  .resp-vtabs .resp-tabs-container{border:none; float:none; width:100%; min-height:initial; clear:none;}
  .resp-accordion-closed{display:none !important;}
  .resp-vtabs .resp-tab-content:last-child{border-bottom:1px solid #d6d6d6 !important;}
  .resp-tab-content{padding-top:10px;}
}