/************* Baamboo Studio - Free Content Tabs Widget - Horizontal Style 1 ******************/ .tab_style_one { border:4px solid #e4e4e4; /* Change border color for tabs */ border-bottom:0 none; border-collapse: collapse; display:table; width:100%; margin:20px 0; background:#fff;/* Change background color for tabs content */ -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .tab_style_one input{ position: absolute; z-index: 1000; left: 0px; top: 0px; opacity: 0; width:0; height:0; border:0 none; padding:0; margin:0; display:none; outline:none; cursor: pointer; } .tab_style_one label{ border-right: 4px solid #e4e4e4; /* Change border right color for tabs title */ height:58px; display:table-cell; text-align:center; position:relative; line-height: 58px; outline: none; font-weight:bold; color:#333; font-size:18px; text-transform:uppercase; text-decoration:none; cursor:pointer; transition: all 0.3s; -moz-transition: all 0.3s; -webkit-transition: all 0.3s; -o-transition: all 0.3s; } .tab_style_one input:hover + label{ font-weight: bold; color:#3d6617; /* Change font color for tab titles */ text-decoration:none } .tab_style_one input:checked + label{ background:#3d6617; /* Change tab titles background color when mouse over */ font-weight: bold; color:#fff; } .tab_style_one .panel-container{ position:relative; display:table-caption; caption-side:bottom } .tab_style_one .panel-container > div{ position: relative; top: 0; left: 0; right: 0; padding: 25px 35px; z-index: 1; background:#fff; border:4px solid #e4e4e4; display:none; opacity: 0; } .tab_style_one input#tab_one_1:checked ~ .panel-container div#tab_one_1, .tab_style_one input#tab_two_1:checked ~ .panel-container div#tab_two_1, .tab_style_one input#tab_three_1:checked ~ .panel-container div#tab_three_1, .tab_style_one input#tab_four_1:checked ~ .panel-container div#tab_four_1, .tab_style_one input#tab_five_1:checked ~ .panel-container div#tab_five_1, .tab_style_one input#tab_six_1:checked ~ .panel-container div#tab_six_1{ z-index: 100; opacity: 1; display:block; } .tab_style_one .panel-container p, .tab_style_one .panel-container .paragraph{ font-weight:400; color:#333; font-size:15px; line-height:170%; padding:0.5em 0; } .tab_style_one .panel-container h2{ font-weight:bold; color:#333; font-size:24px; line-height:170%; padding:0.5em 0; } @media only screen and ( max-width: 960px ) { .boo_tab{ display:block !important; } .boo_tab label{ display:block !important; border-right:0 none !important; } .boo_tab .panel-container{ display:block; } /* Tab One */ .tab_style_one label{ border-bottom:4px solid #e4e4e4 } .tab_style_one .panel-container > div{ border:0 none; border-bottom:4px solid #e4e4e4 } }