@import url('https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css');





body {

  font: 14px/1 'Roboto', sans-serif;

  color: #555;

  background: #eee;

}




main {

  min-width: 320px;


  max-width: 1100px;


  padding: 20px;


  margin: 0 auto;


  background: #fff;

  border-bottom: 2px solid #064b8a;

}



section {

  display: none;

  padding: 20px 0 0;

  border-top: 2px solid #1f91f9;


}



input {

  display: none;

  border-bottom: 2px solid #064b8a;

}



label {

  display: inline-block;

  margin: 0 0 -1px;

  padding: 15px 25px;

  font-weight: 600;

  text-align: center;

  color: #bbb;

  border: 1px transparent;

}


label:hover {

  color: #888;

  cursor: pointer;
  
  border-bottom: 2px transparent;

}



input:checked + label {

  color: #555;

  border: 1px solid #ddd;

  border-top: 2px solid #1f91f9;

  border-left: 2px solid #1f91f9;

  border-right: 2px solid #1f91f9;

  border-bottom: 1px solid #eee;

}



#tab1:checked ~ #content1,

#tab2:checked ~ #content2,

#tab3:checked ~ #content3,

#tab4:checked ~ #content4,
 
#tab5:checked ~ #content5,

#tab6:checked ~ #content6,

#tab7:checked ~ #content7,

#tab8:checked ~ #content8,

#tab9:checked ~ #content9{

  display: block;

}