.flexslider{
  border: none !important;
  margin: 0 !important;
}

.flex-control-nav{
  bottom:20px !important;
  z-index: 99;
}

.flex-control-paging li a{
  width: 20px !important;
  height: 20px !important;
  background: #ffffff ;
  box-shadow: none !important;
}

.flex-control-paging li a {
  width: 11px;
  height: 11px;
  display: block;
  background: #ffffff;
  cursor: pointer;
  text-indent: -9999px;
  -webkit-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3);
  -moz-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3);
  -o-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3);
  box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3);
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  border-radius: 20px;
}
.flex-control-paging li a:hover {
  background: #ffffff;
}
.flex-control-paging li a.flex-active {
  background: #cccccc ;
  cursor: default;
}

.flex-direction-nav{
  display: none !important;
}

.flex-viewport{
  max-height: 500px;
}

/*.slider-img{
  height: 500px;
  width: 100%;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}*/

.slider-img {
    /*height: 500px;*/
    width: 100%;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    /*Below added to make images responsive in slider*/
    background-size: 100%;
    /*height: 650px;*/
    height: 75%;
}

.slider-caption {
    /*Patti doesn't want the slider caption.  Commenting out the background to hide the caption area*/
    /*background: rgba(0, 0, 0, 0.3);*/
    position: absolute;
    bottom: 0;
    width: 100%;
    padding: 45px;
    color: #fff;
    visibility: hidden;/*This will hide the slider captions, which are required*/
}

.slider-caption a{
    color: #fff;
}

@media only screen and (max-width: 1200px) {
    .slider-img {
        /*height: 450px;*/
        height: 500px;
    }
}

@media only screen and (max-width: 920px) {
    .slider-img {
        /*height: 450px;*/
        height: 450px;
    }
}

@media only screen and (max-width: 770px) {
    .slider-img {
        /*height: 450px;*/
        height: 400px;
    }
}

@media only screen and (max-width: 699px) {
    .slider-img {
        height: 200px;
    }
}


@media only screen and (max-width: 800px) {
    .slider-caption {
        padding: 5px;
        height: 75px;
    }
}

@media only screen and (max-width: 800px) {
    .flex-control-paging li a {
        width: 10px !important;
        height: 10px !important;
    }
}
