/**
 * media card for vedio/newspaper
 * usage:
 * <div class="media">
 *   <figure class="media__container">
 *     <h3>Header</h3>
 *     <img>|<iframe>
 *     <figcaption> 
 *       <p></p>|<ul></ul>
 *       ...
 *     </figcaption>
 *   </figure>
 * </div>
 */

/** Theme */
.bubble-slide.orange  {
    border-top: 5px solid #f9a94a;
}

.bubble-slide.orange blockquote,
.bubble-slide.orange blockquote:before,
.bubble-slide.orange blockquote:after,
.bubble-slide .actor
{
    color: #f9a94a;
}


/** End Theme */

.bubble-slide{
    padding-top: 50px;


}

.bubble-slide .lSPrev{
    /*margin-left: -50px;*/

}

.bubble-slide .lSNext{
}

.bubble-slide blockquote {
    text-align: center;
    quotes: "\201C""\201D""\2018""\2019";
}


.bubble-slide blockquote:before {
    content: open-quote;
    font-size: 4em;
    line-height: 0.1em;
    padding-right: 30px;
    vertical-align: -0.4em;

}

.bubble-slide blockquote:after {
    content: close-quote;
    font-size: 4em;
    margin: 10px;
    padding-left: 30px;
    vertical-align: -0.6em;

}

.bubble-slide blockquote p {
    display: inline;
}



.bubble-slide .bubble {
    background: #fff;

    margin: 0px auto 20px;
    width: 340px;
    height: 180px;
    padding: 15px 30px;
    text-align: center;
    position: relative;
    box-shadow: rgba(0, 0, 0, 0.3) 2px 2px 2px ;
    border-radius: 10px;

    border-top: solid 2px #dddddd;
    border-left: solid 2px #dddddd;
    text-align: left;
    font-size: 12px;
    padding: 20px;



}

.bubble-wrapper{
    /*width: 340px;*/
}

.bubble-slide .bubble:after {
    content: "";
    position: absolute;
    box-shadow: rgba(0, 0, 0, 0.3) 2px 2px 2px ;
    -moz-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    bottom: -10px;
    left: 30px;
    border-width: 10px;
    border-style: solid;
    border-color: transparent #FFF #FFF transparent;
    background: #ffffff;
}


.bubble-slide .actor{
    font-size: 13px;
    font-weight: bold;
    margin-left: 10px;

}