﻿/* START Fast & Agile YouTube Embed by Schoberg.net */
.youtube { /* continer (responsive) */
    position: relative;
    cursor: pointer;
    background: #ccc no-repeat center center / cover;
    padding-bottom: 56.25%; /* 16:9 */
    height: 0px;
    clear: both;
}

    .youtube::before { /* play bubble */
        content: '';
        background: rgba(255, 255, 255, .6);
        height: 80px;
        width: 80px;
        display: block;
        margin: -40px 0 0 -40px;
        border-radius: 100px;
        position: absolute;
        top: 50%;
        left: 50%;
        box-shadow: 0 0 20px 3px rgba(51, 51, 51, .8);
        transition: all .1s ease;
        z-index: 1;
    }

    .youtube:hover::before { /* play bubble hover */
        background: rgba(238, 238, 238, .8);
        box-shadow: 0 0 10px 3px rgba(51, 51, 51, .8);
        width: 100px;
        height: 100px;
        margin: -50px 0 0 -50px;
    }

    .youtube::after { /* Play Triangle */
        content: '';
        width: 0;
        height: 0;
        line-height: 0px;
        display: block;
        border-style: solid;
        border-width: 20px 0 20px 40px;
        margin: -20px 0 0 -15px;
        border-color: transparent transparent transparent #333;
        position: absolute;
        top: 50%;
        left: 50%;
        height: 0;
        width: 0;
        z-index: 2;
    }

    .youtube iframe { /* youtube embed (responsive) */
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
        z-index: 3;
    }
/* END Fast & Agile YouTube Embed by Schoberg.net */

/*ignore this*/
/*body {
    text-align: center;
    font-family: arial;
    color: #333;
}*/
