h2 {
  font-size:42px;
}

h1, h2, h3 {
  font-family: 'Cardo', serif;
}

 h4, p {
  font-family: 'Josefin Slab', serif;
}

.myButton {
	background-color:transparent;
        font-family: 'Josefin Slab', serif;
	border-radius:25px;
	border:1px solid #889142;
	display:inline-block;
	cursor:pointer;
	color:#889142;
	font-size:18px;
	font-weight:bold;
	padding:8px 24px 6px 24px;
	text-decoration:none;
}
.myButton:hover {
	background-color:#889142;
        color:white;
        text-decoration:none;
}
.myButton:active {
	position:relative;
	top:1px;
}

.myButton2 {
	background-color:transparent;
        font-family: 'Josefin Slab', serif;
	border-radius:25px;
	border:1px solid #dcdcdc;
	display:inline-block;
	cursor:pointer;
	color:white;
	font-size:18px;
	font-weight:bold;
	padding:10px 24px 6px 24px;
	text-decoration:none;
}
.myButton2:hover {
	background-color:white;
        color:#889142;
        text-decoration:none;
}
.myButton2:active {
	position:relative;
	top:1px;
}

ul#nav li  {
  display:inline;
  padding:10px 50px;
  border-bottom:1px solid black;
  background-color:#F1F1F1;
  border-radius:5px;
  margin-right:5px;
  
}

.menu {
  color:#889142;
  font-size:18px;
font-family: 'Cardo', serif;
}

ul#nav li:hover {
  background-color:#889142;
}

li:hover a {
  color:white;
}



.FeatureDescript {
  width: 100%;
  height: 100%;
}

@media only screen and (max-width: 600px) {
  ul#nav li  {
  display:block;
  max-width:200px;
  margin-bottom:10px;
  margin-left:-50px;
  }
}

#top {
  margin-bottom:50px;
}

.available {
  margin:20px 0;
  text-align:center;
  padding:5px 0 15px 10px;
}

.color {
  border: 2px solid white;
}

input {
    display: none;
}

.btn{
    display:none;
}

label {
    display: block;   
    padding: 8px 22px;
    border-bottom:1px solid black;
    margin: 0 0 1px 0;
    cursor: pointer;
    background: #fff;
    border-radius: 3px;
    color: #889142;
    transition: ease .5s;
    font-size:20px;
    position: relative; /* ADDING THIS IS REQUIRED */
}

label:hover {
    background: #f2f2f2;
}

label::after {
    content: '+';
    font-size: 22px;
    font-weight: bold;
    position: absolute;
    right: 10px;
    top: 2px;
}

input:checked + label::after {
    content: '-';
    right: 14px;
    top: 3px;
}

.content {
    background: white;
    padding: 10px 25px;
    margin: 0 0 1px 0;
    border-radius: 3px;
}

input + label + .content {
    display: none;
}

input:checked + label + .content {
    display: block;
}

@media only screen and (max-width: 768px) {
  .warranty-img {
    display: none;
  }
  .btn{
     display:block;
 
  }
}

.reverse {
  color:#fff;
  padding:1em;
}

.Siding {
  background-image:url('/imageserver/UserMedia/YWPGALLERY/EverlastSiding/2019/everlast-house-Final.png');     
  background-repeat: no-repeat;
  overflow: hidden;
  height:340px;
  width:100%;
  background-size:100% auto;
}
.BG {
  width:100%;
  overflow: hidden;
  float:left;
}

.EVcolor {
  margin:.125em 0;
  height:4em; 
  display: inline-block;
  padding:10px;
}
.EVcolor img {
max-width: 100%;
  max-height: 100%;
  display: block;
}

.main-img-label {
  font-size:32px;
  background-color:rgba(0,0,0,0.2);
  color:white;
}

.zoom {
  transition: transform .2s;
  cursor: pointer;
}

.zoom:hover {
  transform: scale(1.2); 
}

.EVcolor:hover, .EVcolor:active {filter: brightness(105%); border:1px solid black;}

.autumnHarvest {background-color:#A18164;}
.deepGranite {background-color:#8A8F8F;}
.englishWedgewood {background-color:#79888E;}
.evergreen {background-color:#325B3D;}
.green {background-color:#3B564B;}
.mistyShadow {background-color:#59534C;}
.montanaSuede {background-color:#7C7463;}
.colonialYellow {background-color:#FFF5C9;}
.tuscanOlive {background-color:#BBC2AA;}
.brunswick {background-color:#3D4B50;}
.civicBrownstone {background-color:#5D5346;}
.modernIron {background-color:#444744;}
.vintageDublin {background-color:#6E796F;}
.alpineForest {background-color:#5C6461;}
.brandyWood {background-color:#726158;}
.deepCavern {background-color:#4B504C;}
.mahogany {background-color:#734E41;}
.naturalSlate {background-color:#4F5F67;}
.newportBay {background-color:#466279;}
.quietWillow {background-color:#828F83;}
.redBrick {background-color:#78484A;}
.rockHarbor {background-color:#475960;}
.ruggedCanyon {background-color:#958B75;}
.russetRed {background-color:#8A544A;}
.whisperingTimber {background-color:#7A7265;}
.woodlandRetreat {background-color:#514E47;}
.brownstone {background-color:#5D5346;}
.cinnabar {background-color:#805045;}
.dublin {background-color:#6E786F;}
.iron {background-color:#444644;}
.charcoalGray {background-color:#74756B;}
.americanWalnut {background-color:#94765B;}
.capecodGray {background-color:#AFAFAB;}
.glacierBlue {background-color:#818881;}
.lakeshoreFern {background-color:#717F65;}
.naturalCedar {background-color:#ABA48C;}
.portsmouthBlue {background-color:#5F767A;}
.quietWillow {background-color:#828F83;}
.timberStone {background-color:#76685B;}
.vineyardGrove {background-color:#838065;}
.woodlandGreen {background-color:#8C8E7C;}
.alpineForest {background-color:#5C6461;}
.brandyWood {background-color:#726158;}
.capeGray {background-color:#A09B9A;}
.cedar {background-color:#8D877C;}
.woodlandRetreat {background-color:#514E47;}
.walnut {background-color:#9E7960;}
.timber {background-color:#7B7162;}
.terracotta {background-color:#986953;}
.redCedar {background-color:#927564;}
.beige {background-color:#F7F1CC;}
.canyon {background-color:#958B75;}
.frenchSilk {background-color: #DCC28F;}
.granite {background-color: #8B8E8C;}
.khaki {background-color: #AAA891;}
.nantucketGray {background-color: #9AA098;}
.pewter {background-color: #C2C8C4;}
.sand {background-color: #D9D2BB;}
.shadow {background-color: #59534C;}
.sunriseYellow {background-color: #FFF5C9;}
.terraBronze {background-color: #6E6E5B;}
.royalBrown {background-color: #513A2D;}
.musketBrown {background-color: #5F5044;}
.jeffersonTan {background-color: #B1A694;}
.darkBronze {background-color: #2F2B23;}
.black {background-color: #191815;}
.londonBrown {background-color: #6A5A4C;}
.copperPenny {background-color: #C37E2E;}
.woodlandGreen {background-color: #8C8E7C;}
.timberStone {background-color: #76685B;}
.naturalCedar {background-color: #ABA48C;}
.glacierBlue {background-color: #818881;}
.almond {background-color:#E7E2CB;}
.cameo {background-color:#FFF6DE;}
.classicCream {background-color:#F7F1CC;}
.cornSilk {background-color:#DCC28F;}
.desertSand {background-color:#D9D2BB;}
.everest {background-color:#A1B4B7;}
.harborGray {background-color:#9AA098;}
.linen {background-color:#F8F4E5;}
.pebblestone {background-color:#AAA891;}
.sage {background-color:#C3CBB8;}
.sandtone {background-color:#E0D0B4;}
.scottish {background-color:#A0AA9A;}
.silverGray {background-color:#CCD0C7;}
.victorianGray {background-color:#C2C8C4;}
.white {background-color:#FFFEF9;}
.wicker {background-color:#C9BCA7;}
@media only screen and (max-width: 992px) {
  .Siding {
    height:425px;
  }
}

@media only screen and (max-width: 850px) {
  .Siding {
    height:400px;
  }
}

@media only screen and (max-width: 768px) {
  .Siding {
    height:350px;
  }
}

@media only screen and (max-width: 600px) {
  .Siding {
    height:300px;
  }
}

@media only screen and (max-width: 550px) {
  .Siding {
    height:250px;
  }
}

@media only screen and (max-width: 450px) {
  .Siding {
    height:200px;
  }
}

@media only screen and (max-width: 400px) {
  .Siding {
    height:150px;
  }
}