/* styles.css*/

/*main css*/


* {
   box-sizing: border-box;
   -webkit-box-sizing: border-box;
}

a {
   text-decoration: none;
}

img {
   width: 100%;
   display: block;
}

.main-carousel {
   max-width: 980px;
}

.carousel-cell {
  width: 40%; /* half-width */
  height: 350px;
  margin-right: 10px;
}



.story {
   width: 100%;
   height: 100%;
   object-fit: cover;
}



.story img {
   width: 100%;
   height: 65%;
   object-fit: cover;
   opacity: 1;
}

.title {
/*   position: absolute;
   top: 0px;
   left: 0px;*/
   width: 100%;
   text-align: left;
   font-family: "proxima-nova", sans-serif;
   font-weight: 700;
   font-style: normal;
   color: black;
   padding: 10px;
   font-size: 25px;
   text-decoration: none;
}









/*media query for responsive design */

@media only screen and (max-width: 640px) {

   .carousel-cell {
     width: 60%; /* half-width */
     height: 300px;
     margin-right: 10px;
   }



}



@media only screen and (max-width: 430px) {

   .carousel-cell {
     width: 60%; /* half-width */
     height: 250px;
     margin-right: 10px;
   }

/*   .story img {
      height: 50%;
   }*/

   .title {
      font-size: 20px;
   }



}



@media only screen and (max-width: 350px) {

   .story img {
      height: 50%;
   }



}