/*  Cameo Skin CSS ========================================= */

    .mis-slider {
        /*  Slider element does not need to be a specific height
            Here we use it to create a stylish bar behind slides */
        margin-top: 138px;
        height: 80px;
        background-color: #eeefe9;
    }
        .mis-slider li a {
            text-decoration: none;
            color: #666;
            display: block;
        }  
        .mis-slider li figcaption {
            display: none;
            font-size: 1.125em;
        }
     #wrapper  li.mis-current figure figcaption {
         display: block;
     }
        .mis-slider li img {
            /*  Make max-width of image a little less than width of slide
                to avoid some browser shinking bugs */
            max-width: 180px;
            /*  for really small screens make width 100% */
            width: 100%;
            /*  Make image round */
            border-radius: 135px;
            border: none;
            opacity: .7;
        }
        .mis-slide .mis-current figure img+img {
            background-color: red;
        }
        #wrapper  li.mis-current figure img {
            opacity: 1;
        }
        .mis-slide {
            /*  Set width in pixels to restrict width of slides 
                for multi-item slider, default width is 100%
                for single-item slider. Use padding to add space 
                between slides */
	        width:260px;
            height: 200px;
            /*  Undo the margin added by slider element */
            margin-top: -138px
        }
    .mis-nav-buttons a {
        color: rgba(59, 190, 122, .5);
    }
   .mis-slider li figcaption p {
        font-size: 18px;
        color: #333;
        margin: 20px 0 15px;
    }
    @media (max-width:767px) {
          .mis-slider li figcaption p {
            margin: 20px 0 10px;
        }
    }
     .mis-slider li figcaption div {
        font-size: 14px;
        line-height: 24px;
    }