
.dashboardContainer {
  color: #fff;
  font-weight: bold;
  margin: 1em .5em 1em 0;
}

.dashboardHeader {
  background-color: #fff;
  color: #1b1167;
  font-size: 1em;
  font-weight: bold;
  padding: 0.2em;
  position: relative;
  text-align: center;
  border-width: 0.2em 0.2em 0 0.2em;
  border-style: solid;
  -webkit-border-radius: 5px 5px 0px 0px;
  -moz-border-radius: 5px 5px 0px 0px;
  border-radius: 5px 5px 0px 0px;
}

#dashboard {
  margin-bottom: 1em;
}

.dashboardLogout,
.dashboardWelcome {
  margin: 0 0 .5em 0;
  text-align: center;
  width: 100%;
}

.dashboardWelcome {
  line-height: 2em;
}

.dashboardWelcome h2 {
  color: #1b1167;
  font-size: 1em;
  line-height: 2em; /* overwrite bootstrap */
  font-weight: bold;
}

.dashboardLogout .button {
  box-shadow: none;
  width: 45%;
  background-color: #1b1167;
}

.dashboardBox {  
  text-align: left;
  width: 100%;
  background: #1686c5;
  padding: 0.6em;
  -webkit-border-radius: 0px 0px 5px 5px;
  -moz-border-radius: 0px 0px 5px 5px;
  border-radius: 0px 0px 5px 5px;
}

#pfpDashboard .dashboardBox {
  background: -moz-linear-gradient(top, #1686c5 50%, #1a2c77 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(50%,#1686c5), color-stop(100%,#1a2c77));
  background: -webkit-linear-gradient(top, #1686c5 50%,#1a2c77 100%);
  background: -o-linear-gradient(top, #1686c5 50%,#1a2c77 100%);
  background: -ms-linear-gradient(top, #1686c5 50%,#1a2c77 100%);
  background: linear-gradient(to bottom, #1686c5 50%,#1a2c77 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1686c5', endColorstr='#1a2c77',GradientType=0 );
  border: 0.2em solid #1b1167;
}

#subscriptionsDashboard .dashboardBox {
  background: -moz-linear-gradient(top, #75912d 50%, #415524 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(50%,#75912d), color-stop(100%,#415524));
  background: -webkit-linear-gradient(top, #75912d 50%,#415524 100%);
  background: -o-linear-gradient(top, #75912d 50%,#415524 100%);
  background: -ms-linear-gradient(top, #75912d 50%,#415524 100%);
  background: linear-gradient(to bottom, #75912d 50%,#415524 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#75912d', endColorstr='#415524',GradientType=0 );
  border: 0.2em solid #2d4310;
}

#pfpDashboard .dashboardHeader {
  border-color: #1b1167;
}

#subscriptionsDashboard .dashboardHeader {  
  border-color: #3d5023;
}

#subscriptionsDashboard {
  margin-right: 3em;
}

.dashboardBox a {
  color: #fff;
}

.cartLink {
  background: transparent url( '/d/i/cartempty.png' ) top right no-repeat;
  height: 15px;
  width: 50px;
  margin-top: 2px;
  margin-left: 2px;
  display: inline-block;
  font-weight: bold;
  font-size: 14px;
  background-size: contain;
}

.dashboardBox .rows {
  margin-bottom: 2em;
}

.dashboardBox .label {
  width: 100px;
}


/* ALL RESPONSIVE */
@media only screen and (max-width: 959px) {

  .dashboardContainer {
    width: 40%;
  }

  #dashboard {
    width: 100%;
    margin: 0;
    position: absolute;
    top: 0;
    right: 0;
  }

  .dashboardContent {
    background-color: #fff;
    position: relative;
    z-index: 1001;
    border: 2px solid #afcd49;
    padding: 10px;
  }

  #dashboard #accountButton {
    display: inline-block;
    text-align: left;
    font-weight: bold;
    position: relative;
    right: 15em;
    z-index: 901;
    border: 0.1em solid #ddd;
    background-color: #acd136;
    padding: 0.5em;
    width: 11em;
    cursor: pointer;
    -webkit-border-bottom-right-radius: 4px;
    -webkit-border-bottom-left-radius: 4px;
    -moz-border-radius-bottomright: 4px;
    -moz-border-radius-bottomleft: 4px;
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px;
  }

}

/* TABLET - width < 960px, width >= 640px fixed */
@media only screen and (min-width: 640px) and (max-width: 959px) {
  .dashboardBox .rows span {
    width: 5em;
  }

  #Header #socialMedia {
    margin: 0;
    clear: right;
  }

  #topBanner {
    padding-top: 40px;
  }
}

/* ALL PHONE SIZES - width < 640px (&) Samsung Galaxy S devices */
@media only screen and (max-width: 639px),
       only screen and (-webkit-min-device-pixel-ratio: 3) and (max-device-width: 640px) {

  .dashboardContainer {
    margin-top: 0;
    margin-bottom: 0;
  }

  #subscriptionsDashboard {
    margin-right: 1em;
  }
  
  .dashboardBox .rows span {
    width: 4em;
  }
  
  .dashboardBox .rows span.label {
    width: 3em;
  }


  #Header img.logo {
    width: 150px;
  }

  #topBanner {
    padding-top: 40px;
  }

  #HeaderContainer {
    height: auto;
  }

}

/* SMALL PHONE - width < 480px */
@media only screen and  (max-width: 479px),
       only screen and (-webkit-min-device-pixel-ratio: 3) and (max-device-width: 640px) and (orientation: portrait ) {


  #Header #logoContainer { 
    width: auto;
  }

  #HeaderContainer #Header img.logo {
    margin-left: 0;
    width: 100px;
  }

  .dashboardContainer {
    width: 45%;
    margin: 0;
  }

  .dashboardBox .rows {
    padding-bottom: 10px;
  }
  
  .dashboardLogout .button {
    width: 100%;
  }

  #topBanner img.logo {
    width: 100%;
  }

  #Header #socialMedia {
    float: right;
    margin: 1em;
  }

  #dashboard #accountButton {
    right: 12.5em;
  }

  .dashboardWelcome h2 {
    font-size: 100%;
  }
}