#page-wrap {
  width: 650px; 
  margin: 0px auto;
}

.tabs {
      position: relative;   
      min-height: 300px; /* This part sucks */
	 
      clear: both;
      margin: 15px 0;
	  
    }
    .tab {
      float: left;
	   min-height: 300px;
	  
    }
    .tab label {     
	  background: white;
      padding: 10px; 
      border: 1px solid #ccc; 
      margin-left: -1px; 
      position: relative;
      left: 1px; 
	  font-family: 'Muli', sans-serif;	
	  font-weight: 400;
	  font-size: 12pt;	 
    }
    .tab [type=radio] {
      display: none;   
    }
	
    .content1 {	  
      position: absolute;
      top: 28px;
      left: 0;
      background: #eee;     
      right: 0;
      bottom: 0;
      padding: 20px 10px 0px 20px;     
	  border: 1px solid #ccc; 	 	 
	  min-height: 300px;
	 
    }
	
	 .content2 {      
      position: absolute;
      top: 28px;
      left: 0;
      background: #eee;    
      right: 0;
      bottom: 0;
      padding: 20px 10px 0px 20px;     
	  border: 1px solid #ccc; 	  
	  min-height: 300px;
    }
	
	 .content3 {
      position: absolute;
      top: 28px;
      left: 0;
      background: #eee;     
      right: 0;
      bottom: 0;
      padding: 20px 10px 0px 20px;     	 
	  border: 1px solid #ccc; 	  
	  min-height: 300px;
    }
	
	.content4 {
      position: absolute;
      top: 28px;
      left: 0;
      background: #eee;     
      right: 0;
      bottom: 0;
      padding: 20px 10px 0px 20px;     	 
	  border: 1px solid #ccc; 	  
	  min-height: 300px;
    }
	
    [type=radio]:checked ~ label {
      background: #eee;       
       z-index: 2;
	   border-width: 1px 1px 0px 1px; 
	   border-type: solid;
	   border-color: #ccc; 	
	  
    }
    [type=radio]:checked ~ label ~ .content1, [type=radio]:checked ~ label ~ .content2, [type=radio]:checked ~ label ~ .content3, [type=radio]:checked ~ label ~ .content4 {
      z-index: 1;
    }