@import 'base';

ul.pretty-list {

margin-left:0;

li {
  list-style-type: none;
}

}

.subHeroDivider {

height: 5px;
background: #303942;

}

.subHeroContainer {

width: 100%;
max-width: $defaultContentWidth;
margin: auto;
display: table;
padding-left: 10px;
padding-right: 10px;

}

.subHero {

height: 160px;
width: 20%;
display: table-cell;
text-align: center;
vertical-align: middle;
line-height: 17px;

a:hover {
  color: #e87825;
  text-decoration: none;

  .subHeroTitle, .subHeroSubText {
    color: #ff9900;
  }
}

}

.subHeroDisplayBar {

color: #e5e5e5;
background: #495159;

}

.subHeroText {

height: 50%;
vertical-align: top;

}

.subHeroTitle {

font-size: $font-size-base;
font-weight: bold;
margin-bottom: 6px;
color: #f6f6f6;

}

.subHeroSubText {

margin-right: 10px;
margin-left: 10px;

p {
  font-size: 12px;
  color: #ddd;
}

}

.subHeroImg {

width: 120px;
height: 70px;
margin: auto;

}

.carousel-item {

width: 224px;
height: 320px;
text-align: center;
margin-bottom: 5px;

}

.carousel-item img {

height: 144px;

}

.carousel-item h4 {

margin-top: 16px;
font-size: $font-size-base;
font-weight: bold;
line-height: 20px;
padding-left: 8px;
padding-right: 8px;

}

.carousel-item p {

font-size: $font-size-small;
font-weight: 300;
line-height: 21px;
padding-left: 8px;
padding-right: 8px;

}

.flexible-left-column {

max-width: 1100px;
width: auto;
display:table-cell;
vertical-align: top;
padding-top: 40px;
padding-bottom: 40px;

}

.flexible-left-column:empty {

padding-top: 0px;
padding-bottom: 0px;

}

.static-right-column {

width: 300px;
padding-left: 30px;
display: table-cell;
vertical-align: top;
border-left: solid 1px #e6e6e6;
padding-top: 40px;
padding-bottom: 40px;

}

.static-right-column:empty {

padding-top: 0px;
padding-bottom: 0px;

}

.homepage-link-list li {

padding-right: 50px;
line-height: 20px;
margin-bottom: 14px;
font-size: $font-size-small;

}

.table-container-row {

color: $preLoginTextColor;
width: 100%;
display: table-row;

}

.table-container {

display:table;
table-layout:fixed;
width:100%;

}

.thin-content {

font-family: Amazon Ember, Roboto, Helvetica Neue, Arial, sans-serif;
max-width: $defaultContentWidth;
margin: 0px auto 0px auto;

@include desktop {
  padding: 0 50px;
}

}

.thin-content h3 {

font-size: 28px;
font-weight: 300;
margin-bottom: 20px;

}

a.no-link-style {

color: inherit;
text-decoration:none;

}

.img-min {

height: 1px;
width: 1px;

}

@media screen and (min-width: $convertToMobileBreakpoint + 1) {

.dx-desktop-hide {
    display: none;
}

}

@media screen and (max-width: $convertToMobileBreakpoint) {

.homepage-link-list li{
  margin-bottom: 14px;
}

.dx-mobile-hide {
  display: none;
}

.dp-menu-override-hidden {
  position: fixed;
  overflow: hidden;
}

.subHeroContainer {
  padding-left: 0px;
  padding-right: 0px;
}

.subHeroContainer table {
  display: table;
  height: auto;
  width: 100%;
  padding: 0;
}

.subHero {
  height: 75px;
  vertical-align: bottom;
  padding-top: 6px;
}

.subHeroDivider {
  height: 2px;
}

.subHeroImg {
  width: 60px;
  height: 35px;
  margin: auto;
  margin-bottom: 3px;
  background-size:cover;
}

.subHeroTitle {
  font-size: 12px;
  font-weight: normal;
  line-height: 13px;
}

.subHeroText {
  height: 31px;
}

.subHeroSubText {
  @extend .dx-mobile-hide;
}

.flexible-left-column {
  display:block;
  padding-top: 0px;
  padding-bottom: 10px;
  padding-left: 0px;
}

.flexible-left-column:empty {
  padding-bottom: 0px;
}

.static-right-column {
  display: block;
  padding-top: 0px;
  padding-bottom: 60px;
  padding-right: 20px;
  width: 100%;
  border-left: none;
}

.static-right-column:empty {
  padding-bottom: 0px;
}

.carousel-item {
  margin-bottom: 5px;
  margin-left: 5px;
  box-shadow: 0px 3px 8px #aaa;
  width: 240px;
  height: 290px;
}

.carousel-item h4 {
  margin-top: 10px;
  margin-bottom: 0px;
}

.carousel-item img {
  height: 154px;
}

.contentSection {
  margin-top: $navHeightMobile;
  height: 425px;
}

.thin-content {
  width:100%;
  padding-left: 20px;
  margin-top: 0px;
}

.thin-content h3 {
  font-size: 24px;
  margin-top: 30px;
}

}