a{
    color:#ccc;
  }
  .container1{
    width:auto;
    height:300px;
    margin:0 auto;;
    position:relative;
    padding-bottom:30px;
    overflow:hidden;
  }


  h6{
    color:#928566; 
    margin:0;
  }
  input[type="radio"] {
  position: absolute;
  width: 1px; /* Setting this to 0 make it invisible for VoiceOver */
  height: 1px; /* Setting this to 0 make it invisible for VoiceOver */
  padding: 0;
  margin: -1px;
  border: 0;
  clip: rect(0 0 0 0);
  overflow: hidden;
  }
  label{
    display:block;
    width:32%;
    border: 4px solid white;
    position:absolute;
    bottom:5px;
    cursor: pointer;
    transition: border-color 0.3s linear;
  }
  
  label.second{
    left:34%;
  }
  label.third{
    left:68%;
  }
  
  blockquote{
    margin:0;
    padding:30px;
    width:auto !important;
    height: auto;
    font-size: 18px;
    background-color: #DB532B;
    color:white;
    box-shadow: 0 5px 2px rgba(0,0,0,0.1);
    position:relative;
    transition: background-color 0.6s linear;
  }
  
  blockquote:after { 
    content: " "; 
    height: 0; 
    width: 0; 
    position: absolute; 
    top: 100%; 
    border: solid transparent; 
    border-top-color: #DA532B;
    border-left-color:#DA532B;
    border-width: 10px; 
    left: 10%; 
  } 
  #second:checked ~ .two blockquote {
    background-color:purple;
  }
  .two blockquote:after{
    border: solid transparent; 
    border-top-color: purple;
    border-left-color:purple;
    border-width: 10px;
  }
  #third:checked ~ .three blockquote{
    background-color:#54885F;
  }
  .three blockquote:after{
    border: solid transparent; 
    border-top-color: #54885F;
    border-left-color: #54885F;
    border-width: 10px;
  }
  .quotes{
    position:absolute;
    color:rgba(255,255,255,0.5);
    font-size:5em;
  }
  .leftq{
    top:-25px;
    left:5px;
  }
  .rightq{
    bottom:-10px;
    right:5px;
  }
  .img1{
    float:left;
    margin-right: 20px;

  }
  .slide{
    position:absolute;
    left:-100%;
    opacity:0;
    transition: all 0.6s ease-in;
  }
  
  #first:checked ~ label.first {
    border-width:6px;
    border-color:#DB532B;
  }
  #second:checked ~ label.second {
    border-width:6px; border-color:purple;
  }
  #third:checked ~ label.third {
    border:6px solid #54885F;
  }
  
  #first:checked ~ div.one {
    left:0;
    opacity:1;
  }
  #second:checked ~ div.two {
    left:0;
    opacity:1;
  }
  #third:checked ~ div.three {
    left:0;
    opacity:1;
  }
  @media screen and (max-width: 850px) {
    .container1{
      
      height:400px !important;
     
     
    }
  }
  @media screen and (max-width: 400px) {
    .container1{
      
      height:500px !important;
     
     
    }
  }
  @media screen and (max-width: 300px) {
    .container1{
      
      height:600px !important;
     
     
    }
  }