
.css3-tab { list-style: none; margin: 0 auto 40px; padding: 38px 0 0 0; position: relative; width: 90%; }
.css3-tab input[type='radio'] { display: none; }
.css3-tab .css3-tab-nav { display: table; table-layout: fixed; width: 100%; }
.css3-tab .css3-tab-nav label { display: table-cell; background-color: #666666; color: #FFFFFF; padding: 15px; text-align: center; transition: all .3s ease 0s; }
.css3-tab .css3-tab-nav label:hover { cursor: pointer; background: white; color: #666666; transition: all .3s ease 0s; }

@media (max-width: 600px) {
  .css3-tab .css3-tab-nav { display: block; margin: 0 0 20px; }
  .css3-tab .css3-tab-nav label { display: block; box-sizing: border-box; width: 100%; padding: 20px; } }
  .css3-tab .css3-tab-content { overflow: hidden; display: none; background: #FFF; clear: left; box-sizing: border-box; }
  .css3-tab input[id='tabOne']:checked ~ .css3-tab-nav label[for='tabOne'] { background: #000; color: #fff; cursor: default; }
  .css3-tab input[id='tabOne']:checked ~ div.tab-one { display: block; border-top: solid 3px #444; }
  .css3-tab input[id='tabTwo']:checked ~ .css3-tab-nav label[for='tabTwo'] { background: #000; color: white; cursor: default; }
  .css3-tab input[id='tabTwo']:checked ~ div.tab-two { display: block; border-top: solid 3px #ccc; }
  .css3-tab input[id='addNew']:checked ~ .css3-tab-nav label[for='addNew'] { background: #ccc; color: white; cursor: default; }
  .css3-tab input[id='addNew']:checked ~ div.add-new { display: block; border-top: solid 3px red; }