.tabBox { border-radius: 4px; margin: 10px 0 40px 0; float: left; width: 100%; } .tabBox > input[type="radio"] { position: absolute; left:-100px; top:-100px; } .tabBox > input[type="radio"] + label { display: inline-block; border: 1px solid #DEDBD1; border-radius: 5px 5px 0 0; -moz-border-radius: 5px 5px 0 0; -webkit-border-radius: 5px 5px 0 0; border-bottom: 0; padding: 8px 10px; background-color:#ddd; color: #111; font-size: 13px; } .tabBox > input[type="radio"]:checked + label { background-color:white; font-weight: bold; margin-bottom: -1px; color: #0073aa; border-top: 1px solid #1A9AC9; } .tabBox > div { display: none; border: 1px solid #DEDBD1; background-color: white; padding: 10px 20px 10px 20px; height: auto; overflow: auto; margin-top: -1px; border-radius: 0 5px 5px 5px; -moz-border-radius: 0 5px 5px 5px; -webkit-border-radius: 0 5px 5px 5px; } #aDBc-clean:checked ~ .tab1, #aDBc-optimize:checked ~ .tab2, #aDBc-reset:checked ~ .tab3{ display: block; } /* style for count numbers */ .aDBcCount { text-align:center; color: #666 !important; } /* Style for check box */ input[type=checkbox] { visibility: hidden; } /* SQUARED FOUR */ .squaredFour { position: relative; } .squaredFour label { cursor: pointer; position: absolute; width: 16px; height: 16px; top: 0; border-radius: 4px; border: 1px solid #999; background: #fcfff4; } .squaredFour label:after { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); opacity: 0; content: ''; position: absolute; width: 7px; height: 4px; background: transparent; top: 4px; left: 4px; border: 2px solid #71ADE1; border-top: none; border-right: none; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -o-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); } .squaredFour label:hover::after { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)"; filter: alpha(opacity=30); opacity: 0.3; } .squaredFour input[type=checkbox]:checked + label:after { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: alpha(opacity=100); opacity: 1; } /* Style for sidebar */ .aDBcSidebar { float:right; border: 1px solid #ccc; background: #fff; margin-right: -300px; margin-top:44px; width: 280px; border-radius: 5px 5px 0 0; -moz-border-radius: 5px 5px 0 0; -webkit-border-radius: 5px 5px 0 0; } .aDBcSidebar > div{ padding: 15px; } .aDBcSidebar h2{ font-size:20px; }