.tabbed {
  width         : 95%;
  font-family   : sans-serif;
  margin        : 0 auto;
  margin-top    : 2em;
  margin-bottom : 2em;
  text-align    : center;
}

.tabbed > div > input {
  display : none;
}

.tabbed > div > section > h1 {
  float       : left;
  box-sizing  : border-box;
  margin      : 0;
  padding     : 0 0.2em 0;
  overflow    : hidden;
  font-size   : 1.1em;
  font-weight : normal;
  line-height : 2em;
  color       : #494a49;
  text-shadow : none;
}

.tabbed > div > input:first-child + section > h1 {
  padding-left : 0.5em;
}

.tabbed > div > section > h1 > label {
  display                 : block;
  padding                 : 0.5em 1.5em;
  border                  : 1px solid #ddd;
  border-bottom           : none;
  border-top-left-radius  : 4px;
  border-top-right-radius : 4px;
  box-shadow              : 0 0 0.5em rgba(0,0,0,0.0625);
  background              : #fff;
  cursor                  : pointer;
  -moz-user-select        : none;
  -ms-user-select         : none;
  -webkit-user-select     : none;
}

.tabbed > div > section > div {
  width          : 100%;
  position       : relative;
  z-index        : 1;
  float          : right;
  box-sizing     : border-box;
  margin         : 3.3em 0 0 -100%;
  padding-top    : 0.5em;
  padding-bottom : 0.5em;
  border         : 1px solid #ddd;
  border-radius  : 4px;
  box-shadow     : 0 0 0.5em rgba(0,0,0,0.0625);
  background     : #fff;
}

.tabbed > div > section > div h2 {
    font-size     : 1.5em;
    font-weight   : 300;
    margin-top    : 1.3em;
    margin-bottom : 0.5em;
}

.tabbed > div > section > div h3 {
    font-size     : 1.3em;
    font-weight   : 300;
    margin-top    : 1.9em;
    margin-bottom : 1em;
}

.tabbed > div > section > div .home-and-student {
    color      : #aec847;
}

.tabbed > div > section > div .ultimate {
    color      : #3c8cc1;
}

.tabbed > div > section > div .ultimate span {
    color : #71daf7;
}

.tabbed > div > section > div p {
    font-size     : 1em;
    padding-right : 20px;
    padding-left  : 20px;
}

.tabbed > div > section > div p .offer {
    color           : #f58400;
    font-weight     : 600;
}

.tabbed > div > input:checked + section > h1 {
  position    : relative;
  z-index     : 2;
  color       : #19a1d9;
}

.tabbed > div > input:not(:checked) + section > div {
  display : none;
}

/*
 * Media queries
 */
@media only screen and (max-width: 799px) {
    .tabbed > div > section > h1 {
        float : none;
    }

    .tabbed > div > #tabbed1:checked + section > div {
        margin : 6.6em 0 0 -100%;
    }

    .tabbed > div > #tabbed2:checked + section > div {
        margin : 3.3em 0 0 -100%;
    }

    .tabbed > div > #tabbed3:checked +  section > div {
        margin : 0 0 0 -100%;
    }
}

@media only screen and (min-width: 960px) {
    .tabbed {
        width : 960px;
    }

    .tabbed > div > section > div {
        width : auto;
}