#cloud-site h2.headline {
  font-size: 34px;
  font-weight: 400;
  margin-bottom: 5px;
}

#cloud-site  h3.headline {
  font-weight: 500;
  margin: 0;
  font-size: 16px;
}

#features {
  font-size: 16px;
}

#features p {
  margin: 0;
}

#cloud-site #features a,
#cloud-site #features a:visited {
  color: #445A64;
}

#cloud-site #features a:hover {
  color: #2B85E7;
}

.italics {
  font-style: italic;
}

.darker {
  font-weight: 500;
}

.flex {
  display: flex;
}

.flex-c {
  flex-direction: column;
}

.flex-r {
  flex-direction: row;
}

.flex-1 {
  flex: 1;
}

.flex-28 {
  flex: 28;
}

.flex-24 {
  flex: 24;
}

.flex-table {
  display: flex;
  flex-direction: column;
  border: 1px solid #2B85E7;
  background-color: #fff;
  margin-bottom: 20px;
}

/* Rows*/
.flex-row {
  display: flex;
  border-bottom: 1px solid #f2f2f2;
}

.flex-row:last-child {
  border-bottom: none;
}

.flex-header {
  background: #2B85E7;
  color: #fff;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
  border: none;
}

.flex-header.flex-row > div {
  border-right-color: #2B85E7;  
}


.row-heading,
.zippy-title {
  background-color: #ECEFF1;
  font-size: 16px;
  font-weight: 500;
}

/* Columns */
.flex-row > div {
  padding: 8px 24px;
  font-size: 14px;
  line-height: 24px;
  box-sizing: border-box;
  border-right: 1px solid #f2f2f2;
  word-break: break-word;
}

.flex-row > div:last-child {
  border-right: none;
}

.flex-row > .zippy-container {
  padding: 0;
}

.flex-row .zippy-content > div {
  padding: 8px 24px;
  line-height: 24px;
  font-size: 14px;
  border-top: 1px solid #f2f2f2;
}

#cloud-site .table-top .plan-status {
  min-height: 8px;
  position: absolute;
  bottom: 100%;
  left: 0;
  width: 100%;
  border-top-left-radius: 2px 2px;
  border-top-right-radius: 2px 2px;
  color: white;
  padding: 0;
}

.table-top .plan-type {
  font-size: 20px;
  font-weight: 500;
  color: #424242;
}

.table-top .plan-desc {
  min-height: 65px;
}

.table-top .plan-pricing {
  min-height: 130px;
}

.bg-silver,
.table-top .button.bg-silver:hover {
  background-color: #607D8B;
}

.bg-gold,
.table-top .button.bg-gold:hover {
  background-color: #FFC300;
}

.bg-platinum,
.table-top .button.bg-platinum:hover {
  background-color: #000;
}

.table-top .col {
  background: white;
  padding: 5px 24px;
  position: relative;
  margin: 0 4px;
}

.table-top {
  line-height: 1.6em;
  margin-top: 30px;
}

.table-top .col > div {
  padding: 10px 0;
  border-bottom: 1px solid #f2f2f2;
}

.table-top .col > div:last-child {
  border-bottom: 0;
}


#cloud-site .table-top .button {
  margin-top: 20px;
  font-size: 12px;
  padding: 0 2px;
  color: white;
  font-weight: 500;
  line-height: 40px;
}

.table-top .transparent-card {
  background: transparent;
}

.need-help {
  font-size: 20px;
  color: #445A64;
  line-height: 1.6em;
}

.toggle-zippy {
  transition: all 0.278s ease-in-out;
  overflow: hidden;
}

.zippy-title {
  padding: 8px 24px;
  min-height: 40px;
  line-height: 1.4em;
  white-space: nowrap;
  text-overflow: ellipsis;
  position: relative;
  font-size: 16px;
  cursor: pointer;
}

.zippy-title::after {
  content: '';
  display: block;
  position: absolute;
  right: 0;
  top: 0;
  height: 100%;
  width: 40px;
  background: url('/images/support/down_arrow.svg') no-repeat;
  background-size: 70%;
  background-position: 50% 50%;
  transition: all 0.278s linear;
}

.zippy-container.expanded .zippy-title::after {
  transform: rotateX(180deg);
}

@media all and (min-width: 781px) {
  .is-hidden-desktop {
    display: none !important;
  }
}

@media all and (min-width: 900px) {
  .is-hidden-desktop-large {
    display: none !important;
  }
}

@media all and (max-width: 899px) {
  .is-hidden-tablet-large {
    display: none !important;
  }
}