/* casestudy.css
==================================================================== */


/* basics
-------------------------------------------- */

#page-casestudy #main { padding-top: 0px;  font-family: 'PT Sans', sans-serif; }
#page-casestudy #header { background-color: transparent; border: none; }


#casestudy .spacer img { width: 100%; }

#main_content { padding-top: 0; }



/* #cs-header
-------------------------------------------- */

#cs-header
{
    width: 100%; height: 618px; position: relative;
    background-color: #000;
}

#cs-header .background
{
    width: 100%; height: 100%;
    position: absolute; top: 0; left: 0; z-index: 0;

    background-repeat: no-repeat;
    background-position: 50% 50%;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;

    -webkit-box-shadow: inset 0px 24px 106px 25px rgba(0,0,0,0.31);
    -moz-box-shadow: inset 0px 24px 106px 25px rgba(0,0,0,0.31);
    box-shadow: inset 0px 24px 106px 25px rgba(0,0,0,0.31);
}

#cs-header .shadow
{
    width: 100%; height: 100%;
    position: absolute; top: 0; left: 0; z-index: 1;

    background: rgba(0,0,0,0.59);
    background: -moz-linear-gradient(top, rgba(0,0,0,0.59) 0%, rgba(0,0,0,0.1) 41%, rgba(0,0,0,0.1) 100%);
    background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(0,0,0,0.59)), color-stop(41%, rgba(0,0,0,0.1)), color-stop(100%, rgba(0,0,0,0.1)));
    background: -webkit-linear-gradient(top, rgba(0,0,0,0.59) 0%, rgba(0,0,0,0.1) 41%, rgba(0,0,0,0.1) 100%);
    background: -o-linear-gradient(top, rgba(0,0,0,0.59) 0%, rgba(0,0,0,0.1) 41%, rgba(0,0,0,0.1) 100%);
    background: -ms-linear-gradient(top, rgba(0,0,0,0.59) 0%, rgba(0,0,0,0.1) 41%, rgba(0,0,0,0.1) 100%);
    background: linear-gradient(to bottom, rgba(0,0,0,0.59) 0%, rgba(0,0,0,0.1) 41%, rgba(0,0,0,0.1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#000000', GradientType=0 );
}

#cs-header .scanlines
{
    width: 100%; height: 100%;
    position: absolute; top: 0; left: 0; z-index: 2;
}


/* #cs-header social
-------------------------------------------- */

#cs-header .social
{
    position: absolute; top: 30px; right: 30px; z-index: 10;
}

#cs-header .social .btn { float: left; margin-right: 30px; position: relative; }
#cs-header .social .btn .icon { position: absolute; top: 1px; left: 0; }
#cs-header .social .btn .num { font-size: 15px; color: #fff; font-family: 'Montserrat', sans-serif; padding: 0 0 0 24px; }


/* #cs-header .csotw
-------------------------------------------- */

#cs-header .csotw {
    display: block; margin: auto;
    position: absolute; bottom: -22px; left: 50%; z-index: 10;
    margin-left: -247.5px;
    background-color: #e45c5a;
    min-width: 495px; height: 41px;
    color: #fff;
    font-family: 'Montserrat', sans-serif;
    font-size: 16px;
    text-transform: uppercase;
    text-align: center;
    padding: 10px;
}

#cs-header .csotw .title { border-right: 2px solid #fa8b89; padding-right: 10px; margin-right: 6px; }

#cs-header .csotw_banner { width: 231px; height: 228px; position: absolute; bottom: 0; left: 0; z-index: 10; background: transparent url('../../img/v25/casestudy/csotw_banner.png') no-repeat 0 0; }

#cs-header .hm_banner { width: 231px; height: 228px; position: absolute; bottom: 0; left: 0; z-index: 10; background: transparent url('../../img/v25/casestudy/hm_banner.png') no-repeat 0 0; }

#cs-header .media_type {
    display: block; margin: auto;
    position: absolute; bottom: -20px; left: 50%; z-index: 10;
    margin-left: -123px;
    background-color: #e45c5a;
    min-width: 246px; height: 41px;
    color: #fff;
    font-family: 'Montserrat', sans-serif;
    font-size: 16px;
    text-transform: uppercase;
    text-align: center;
    padding: 11px;
}

#cs-header .media_type.color-motion { background-color: #4f4699 !important; }
#cs-header .media_type.color-graphic_design { background-color: #3f978c !important; }
#cs-header .media_type.color-interactive { background-color: #377197 !important; }

@media only screen and ( max-width : 680px )
{
    #cs-header .csotw_banner {
        width: 125px; height: 125px; position: absolute; bottom: 0; left: 0; z-index: 10; background: transparent url('../../img/v25/casestudy/csotw_banner.png') no-repeat 0 0;
        background-repeat: no-repeat;
        background-position: 50% 50%;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
    }

    #cs-header .hm_banner {
        width: 125px; height: 125px; position: absolute; bottom: 0; left: 0; z-index: 10; background: transparent url('../../img/v25/casestudy/hm_banner.png') no-repeat 0 0;
        background-repeat: no-repeat;
        background-position: 50% 50%;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
    }

}

/* #nominated-header
-------------------------------------------- */

#page-casestudy #main.main-nominated { padding-top: 63px; }

#nominated-header { width: 100%; min-width: 1280px; height: 63px; overflow: hidden; background-color: #fff; position: fixed; top: 0; left: 0; z-index: 106; }

#nominated-header .textzone { width: 100%; height: 63px; padding: 22px 40px 0 40px; border-bottom: 5px solid #dadada; font-size: 13px; font-family: 'Montserrat', sans-serif; }

#nominated-header .scoregroup { position: absolute; top: 0; right: 221px; height: 63px; width: 535px; z-index: 1; }

#nominated-header .scoregroup .scorebar { width: 100%; height: 5px; position: absolute; bottom: 0px; left: 0px; }
#nominated-header .scoregroup .scorebar .tick { width: 26.7px; height: 5px; background-color: #f1d7d7; float: left; border-left: 1px solid #fff; }
#nominated-header .scoregroup .scorebar .tick.on { background-color: #e35d5d; }
#nominated-header .scoregroup .scorebar .tick:first-child { border: none; }

#nominated-header .scoregroup .scoreboard { width: 100%; margin: auto; position: absolute; top: 0; left: 0; }
#nominated-header .scoregroup .scoreboard .score { float: left; border-left: 1px solid #dadada; text-align: center; width: 98px; height: 58px; padding: 13px 0 0 0; }
#nominated-header .scoregroup .scoreboard .score .number { color: #000; font-size: 18px; font-family: 'Montserrat', sans-serif; font-weight: 700; padding: 0px 0 1px 0px; }
#nominated-header .scoregroup .scoreboard .score .count { display: inline; }
#nominated-header .scoregroup .scoreboard .score .label { color: #000; font-size: 11px; line-height: 9px; font-weight: 700; text-transform: uppercase; font-family: 'Montserrat', sans-serif; }

#nominated-header .scoregroup .scoreboard .score5 { width: 137px; }
#nominated-header .scoregroup .scoreboard .score5 .number { color: #e35d5d; }

#nominated-header .button-holder { position: absolute; top: 0; right: 0; width: 221px; height: 63px; }

#nominated-header .button-holder .btn-vote { width: 100%; height: 100%; font-size: 18px; display: block; font-family: 'Montserrat', sans-serif; background-color: #e55c5a; color: #fff; text-align: center; padding: 21px 0; text-transform: uppercase; }
#nominated-header .button-holder .btn-vote:hover { background-color: #f17371; }

#nominated-header .button-holder .thanks { position: relative; padding: 16px 0px 14px 0; border: 5px solid #dadada; color: #898989; text-transform: uppercase; font-family: 'Montserrat', sans-serif; font-size: 18px; text-align: center; text-decoration: none; }


#nominated-header .button-holder .shortlisted { display: none; position: relative; padding: 16px 0px 14px 0; padding-left: 23px; border: 5px solid #dadada; color: #898989; text-transform: uppercase; font-family: 'Montserrat', sans-serif; font-size: 18px; text-align: center; text-decoration: none; }
#nominated-header .button-holder .shortlisted .icon { position: absolute; top: 17px; left: 18px; }


#nominated-header .button-holder .btn-vote { display: block; }
#nominated-header .button-holder .thanks { display: none; }
#nominated-header .button-holder .shortlisted { display: none; }

#nominated-header.has_voted .button-holder .shortlisted { display: none; }
#nominated-header.has_voted .button-holder .thanks { display: block; }
#nominated-header.has_voted .button-holder .btn-vote { display: none; }

#nominated-header.is_shortlisted .button-holder .shortlisted { display: block; }
#nominated-header.is_shortlisted .button-holder .thanks { display: none; }
#nominated-header.is_shortlisted .button-holder .btn-vote { display: none; }



@media only screen and ( max-width : 1400px )
{
    #nominated-header .scoregroup { width: 413px; }
    #nominated-header .scoregroup .scoreboard .score { width: 78px;}
    #nominated-header .scoregroup .scoreboard .score5 { width: 101px; }
    #nominated-header .scoregroup .scorebar .tick { width: 20.6px; }
}


@media only screen and ( max-width : 680px )
{
    #nominated-header { min-width: 0; height: auto; position: absolute; background-color: #f0f0f0; }
    #nominated-header .scoregroup { position: relative; top: 0; right: 0; margin: auto; margin-bottom: 1px; }
    #nominated-header .button-holder { position: relative; right: 0; width: 100%; max-width: 319px; height: auto; margin: auto; }

    #nominated-header .textzone { display: none; }

    #nominated-header .scoregroup .scoreboard .score { width: 57px; background-color: #fff; }
    #nominated-header .scoregroup .scoreboard .score5 { width: 91px; border-right: 1px solid #dadada; }

    #nominated-header .button-holder .thanks { padding: 10px; background-color: #fff; }
    #nominated-header .button-holder .shortlisted { padding: 10px; background-color: #fff; }
    #nominated-header .button-holder .btn-vote { padding: 15px; }

    #nominated-header .scoregroup .scorebar .tick { width: 15.9px; }
    #page-casestudy #main.main-nominated { padding-top: 0px; }

    #page-casestudy #main.main-nominated #casestudy { padding-top: 103px; }
    #page-casestudy #main.main-nominated #header { top: 103px; }

    #nominated-header .scoregroup .scoreboard .score { height: 46px; padding-top: 6px; }
    #nominated-header .scoregroup { height: 51px; width: 319px;  }

    #nominated-header .button-holder .shortlisted .icon { display: none; }
}


/* #cs-intro
-------------------------------------------- */

#cs-intro { text-align: center; padding-top: 80px; margin-bottom: 100px; }
#cs-intro .holder { max-width: 1100px; margin: auto; position: relative; }


#cs-intro .title { font-size: 42px; line-height: 48px; color: #1e1e1e; font-family: 'Montserrat', sans-serif; padding: 0; margin: 0; margin-bottom: 10px; }


#cs-intro .agency { font-family: 'PT Sans', sans-serif; margin-bottom: 30px; font-size: 18px; }
#cs-intro .agency .by { color: #363636; display: inline; }
#cs-intro .agency .name { color: #e45c5a; display: inline; }
#cs-intro .agency .name a { color: #e45c5a; }
#cs-intro .agency .name a:hover { text-decoration: underline; }


#cs-intro .members { position: relative; margin-bottom: 40px; }

#cs-intro .members .member {
    display: inline-block; margin-right: 1px; width: 70px; height: 70px; position: relative;
    border: 1px solid transparent;
    vertical-align:top;
}

#cs-intro .members .member .avatar-image
{
    -webkit-border-radius: 100px;
    -moz-border-radius: 100px;
    border-radius: 100px;
    overflow: hidden;
    border: 1px solid #c0c0c0;
}




#cs-intro .members .member span { display: block; }

#cs-intro .members .member .bubble { opacity: 0;  bottom: 100%; left: -8px; margin-bottom: 10px; z-index: 99; }
#cs-intro .members .member .bubble .bubble-inside { padding: 6px 15px; }
#cs-intro .members .member:hover .bubble { visibility: visible; opacity: 1; margin-bottom: 15px; }


#cs-intro .members .membertotal {
    background-color: #1e1e1e; text-align: center;
    -webkit-border-radius: 100px;
    -moz-border-radius: 100px;
    border-radius: 100px;
}
#cs-intro .members .membertotal span { display: block; }
#cs-intro .members .membertotal .number { color: #fff; font-size: 12px; font-family: 'Montserrat', sans-serif; font-weight: 700; padding: 13px 0 3px 0px; }
#cs-intro .members .membertotal .label { color: #989898; font-size: 8px; line-height: 9px; text-transform: uppercase; font-family: 'Montserrat', sans-serif; }


#cs-intro .members .member.logo
{
    border-right: 1px solid #d1d1d1;
    padding-right: 10px;
    margin-right: 7px;
    width: auto;
}

#cs-intro .members .member.logo .avatar-image
{
    border: 1px solid #ebebeb;
    -webkit-border-radius: 100px;
    -moz-border-radius: 100px;
    border-radius: 100px;
    width: 70px; height: 70px;
}

#cs-intro .members .pipe
{
    background-color: #d1d1d1;
    margin-right: 10px;
    margin-left: 10px;
    width: 1px;
    height: 74px;
    display: inline-block;
}


#cs-intro .scoreboard { width: 483px; margin: auto; display: block; margin-bottom: 60px; }
#cs-intro .scoreboard span { display: block; }
#cs-intro .scoreboard .score { display: inline-block; text-align: center; width: 108px; position: relative; }

#cs-intro .scoreboard .score .dot {
    width: 13px; height: 13px; border: 2px solid #e45c5a; display: inline-block;
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    border-radius: 50px;
    margin-bottom: 6px;
}
#cs-intro .scoreboard .score .label {
    display: block; color: #7f7f7f; font-size: 12.6px; line-height: 12px; text-transform: uppercase; font-family: 'Montserrat', sans-serif;
    margin-bottom: 3px;
}
#cs-intro .scoreboard .score .number {
    font-size: 22px; color: #000; font-family: 'Montserrat', sans-serif; padding: 0px 0 1px 0px;

}

#cs-intro .scoreboard .divider { width: 1px; height: 47px; background-color: #c2c2c2; display: inline-block; }

#cs-intro .scoreboard .score1 .dot { border: 2px solid #44789c; }
#cs-intro .scoreboard .score2 .dot { border: 2px solid #22c5aa; }
#cs-intro .scoreboard .score3 .dot { border: 2px solid #84cdde; }
#cs-intro .scoreboard .score4 .dot { border: 2px solid #e45c5a; background-color: #e45c5a; }

#cs-intro .scoreboard .panel-bubble { opacity: 0; bottom: 100%; left: 29px; margin-bottom: 10px; z-index: 99; }
#cs-intro .scoreboard .panel-bubble.active { visibility: visible; opacity: 1; margin-bottom: 15px; }

#cs-intro .scoreboard .score3 .panel-bubble { left: auto; right: 30px; }
#cs-intro .scoreboard .score3 .panel-bubble:before { right: 17px; left: auto; }

#cs-intro .scoreboard .score4 .panel-bubble { left: auto; right: 29px; }
#cs-intro .scoreboard .score4 .panel-bubble:before { right: 17px; left: auto; }


#cs-intro .line { width: 125px; height: 3px; background-color: #e55c5a; margin: auto; clear: both; }




/* #cs-description
-------------------------------------------- */

#cs-description { max-width: 1080px; margin: auto; margin-bottom: 80px; font-size: 24px; color: #313131; }


/* #cs-concept
-------------------------------------------- */

#cs-concept .text-content { max-width: 1070px; margin: auto; padding-top: 80px; margin-bottom: 80px; border-top: 1px solid #dbdbdb; }
#cs-concept .text-content .title { font-size: 36px; font-family: 'Montserrat', sans-serif; color: #0d0d0d; margin: 0; margin-bottom: 20px; }
#cs-concept .text-content .text { font-size: 24px; line-height: 32px; color: #313131; font-family: 'PT Sans', sans-serif; }
#cs-concept .text-content .text p { margin: 0; margin-bottom: 20px; }


#cs-concept .owl-controls .owl-dots { display: none; }

#cs-concept .owl-controls .owl-nav div { width: 88px; height: 92px; background-color: rgba(0,0,0,0.6); margin-top: -46px;  background-repeat: no-repeat;  background-position: 50% 50%; }
#cs-concept .owl-controls .owl-nav div:hover { background-color: #000; }
#cs-concept .owl-controls .owl-nav .owl-prev { position: absolute; top: 50%; left: 0; background-image: url('../../img/v25/casestudy/prev_arrow.png'); }
#cs-concept .owl-controls .owl-nav .owl-next { position: absolute; top: 50%; right: 0; background-image: url('../../img/v25/casestudy/next_arrow.png'); }

#cs-concept .owl-carousel .owl-stage { background-color: #e1e1e1; }

#cs-concept .media { position: relative; }

#cs-concept .media-thumbs { text-align: center; padding-top: 42px; margin-bottom: 60px; }
#cs-concept .media-thumbs .thumb { cursor: pointer; display: inline-block; padding: 3px; margin: 0 6px; border: 1px solid #fff; }
#cs-concept .media-thumbs .thumb.active { border: 1px solid #e55c5a; }
#cs-concept .media-thumbs .thumb .image-bg {
    width: 88px; height: 88px; float: left;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;

}

#cs-concept .media-single { position: relative; max-width: 1260px; margin: auto; }
#cs-concept .media-single .media { margin-bottom: 80px; position: relative; }
#cs-concept .media-single .media.media-image .image { width: 100%; }
#cs-concept .media-single .media.media-image img { float: left; width: 100%; height: auto; }



#cs-concept .media-video {
    width: 100%; height: 100%;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

#cs-concept .media-video .embed { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 5; }
#cs-concept .media-video .embed iframe { width: 100%; height: 100%; min-height: 500px; }



/* #cs-production
-------------------------------------------- */

#cs-production { margin-bottom: 40px; }

#cs-production .text-content { max-width: 1070px; margin: auto; margin-bottom: 80px; padding-top: 80px; border-top: 1px solid #dbdbdb; }
#cs-production .text-content .title { font-size: 36px; font-family: 'Montserrat', sans-serif; color: #0d0d0d; margin: 0; margin-bottom: 20px; }
#cs-production .text-content .text {
    font-size: 24px; line-height: 32px; color: #313131; font-family: 'PT Sans', sans-serif;
}

#cs-production .text-content .text p { margin: 0; margin-bottom: 20px; }

#cs-production .media-list { position: relative; max-width: 1260px; margin: auto; }
#cs-production .media-list .media { margin-bottom: 50px; position: relative; }
#cs-production .media-list .media.media-image .image { width: 100%; }
#cs-production .media-list .media.media-image img { float: left; width: 100%; height: auto; }

#cs-production .media-video .embed { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 5; }
#cs-production .media-video .embed iframe { width: 100%; height: 100%; min-height: 500px; }



.media .caption { position: absolute; bottom: 0px; right: 0px; width: 100%; height: 100%; }
.media .caption .icon { cursor: pointer; z-index: 101; width: 45px; height: 45px; position: absolute; bottom: 20px; right: 20px; background: transparent url('../../img/v25/casestudy/info_icon.png') no-repeat 0 0; }
.media .caption .text {
    position: absolute; top: 0px; left: 0; background-color: rgba(0,0,0,0.75); color: #fff;
    font-size: 18px;
    width: 100%; height: 100%;
    opacity: 0; z-index: 0; visibility: hidden;
    -webkit-transition: all 250ms ease;
    -moz-transition: all 250ms ease;
    -o-transition: all 250ms ease;
    transition: all 250ms ease;

    text-align: center;
    line-height: 32px;

    display: table;
}
.media .caption .text-holder
{
    height: 100%;
    margin: auto;

    display: table-cell;
    vertical-align: middle;
    padding: 0 300px;
}

.media.show-info .caption .text { opacity: 1; z-index: 100; visibility: visible; }


/* #cs-final
-------------------------------------------- */

#cs-final { }

#cs-final .text-content { max-width: 1070px; margin: auto; border-top: 1px solid #dbdbdb; padding-top: 70px; margin-bottom: 50px; }
#cs-final .text-content .title { font-size: 36px; font-family: 'Montserrat', sans-serif; color: #0d0d0d; margin: 0; margin-bottom: 20px; }
#cs-final .text-content .text {
    font-size: 24px; line-height: 32px; color: #313131; font-family: 'PT Sans', sans-serif;
}

#cs-final .text-content .text p { margin: 0; margin-bottom: 20px; }

#cs-final .media-list { position: relative; max-width: 1260px; margin: auto; }
#cs-final .media-list .media { margin-bottom: 50px; position: relative; }
#cs-final .media-list .media.media-image img { float: left; width: 100%; }
#cs-final .media-list .media .caption { text-align: center; font-size: 24px; color: #313131; font-family: 'PT Sans', sans-serif; padding-top: 20px; }

#cs-final .media-video .embed { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 5; }
#cs-final .media-video .embed iframe { width: 100%; height: 100%; min-height: 500px; }



/* #cs-video
-------------------------------------------- */

#cs-video .text-content { max-width: 1070px; margin: auto; padding-top: 70px; margin-bottom: 50px; }
#cs-video .text-content .title { font-size: 36px; font-family: 'Montserrat', sans-serif; color: #0d0d0d; margin: 0; margin-bottom: 20px; }
#cs-video .text-content .text {
    font-size: 24px; line-height: 32px; color: #313131; font-family: 'PT Sans', sans-serif;
}

#cs-video .text-content .text p { margin: 0; margin-bottom: 20px; }

#cs-video .media-list { position: relative; width: 100%; margin: auto; }
#cs-video .media-list .media { margin-bottom: 50px; position: relative; }
#cs-video .media-list .media.media-image img { float: left; width: 100%; }
#cs-video .media-list .media .caption { text-align: center; font-size: 24px; color: #313131; font-family: 'PT Sans', sans-serif; padding-top: 20px; }

#cs-video .media-video .embed { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 5; }
#cs-video .media-video .embed iframe { width: 100%; height: 100%; min-height: 500px; }




/* #cs-bottom_credits
-------------------------------------------- */

#cs-bottom_credits { padding-top: 30px; padding-bottom: 120px; font-family: 'PT Sans', sans-serif; }

#cs-bottom_credits .holder { max-width: 1100px; margin: auto; padding-top: 40px; }

#cs-bottom_credits .left-side { float: left; width: 478px; }
#cs-bottom_credits .right-side { float: right; width: 478px; }

#cs-bottom_credits .title { font-size: 28px; font-family: 'Montserrat', sans-serif; margin-bottom: 20px; }

#cs-bottom_credits .members {  }

#cs-bottom_credits .members .member { margin-bottom: 2px; }
#cs-bottom_credits .members .member .info .name { font-size: 20px; display: inline-block; color: #313131; }
#cs-bottom_credits .members .member .info .role { color: #313131; font-size: 15px; display: inline-block; }

#cs-bottom_credits .members a.member .info .name { color: #e55c5a; }
#cs-bottom_credits .members a.member:hover .info .name { text-decoration: underline; }

#cs-bottom_credits .tag-content { border-bottom: 1px solid #e5e5e5; padding-bottom: 30px; margin-bottom: 30px; font-size: 18px; }
#cs-bottom_credits .tag-content .tag { color: #e55c5a; }
#cs-bottom_credits .tag-content .tag:hover { text-decoration: underline; }


#cs-bottom_credits .client { margin-bottom: 30px; }
#cs-bottom_credits .text { font-size: 20px; display: inline-block; }


/* #cs-bottom_social
-------------------------------------------- */

#cs-bottom_social { background-color: #f3f3f3; width: 100%; height: 100px; position: relative; font-family: 'PT Sans', sans-serif; }
#cs-bottom_social .holder { max-width: 1100px; margin: auto; padding-top: 30px; }

#cs-bottom_social .btn-style { float: left; font-size: 14px; color: #828282; position: relative; }

#cs-bottom_social .btn-view_comments .icon { display: inline-block; width: 38px; height: 38px; background: transparent url('../../img/v25/casestudy/icon_comments.png') no-repeat 0 0; position: absolute; top: 0; left: 0; }
#cs-bottom_social .btn-view_comments .text { display: inline-block; padding: 11px 0 10px 48px; }

#cs-bottom_social .btn-love_this { display: inline-block; position: relative; width: 100px; height: 100px; background: transparent url('../../img/v25/casestudy/icon_lovethis.png') no-repeat 0 0; position: absolute; top: -50px; left: 50%; margin-left: -50px; }
#cs-bottom_social .btn-love_this .thanks {
    position: absolute; top: -20px; left: 0; width: 100%; text-align: center; text-transform: uppercase; font-size: 16px; color: #e55c5a; opacity: 0;
    -webkit-transition: all 250ms ease;
    -moz-transition: all 250ms ease;
    -o-transition: all 250ms ease;
    transition: all 250ms ease;
}
#cs-bottom_social .btn-love_this .thanks.showit { top: -27px; opacity: 1; }

#cs-bottom_social .share { float: right; }

#cs-bottom_social .share .label { float: left; font-size: 14px; color: #828282; padding-top: 9px; margin-right: 11px; }

#cs-bottom_social .twitter-btn { display: inline-block; width: 38px; height: 38px; background: transparent url('../../img/v25/casestudy/icon_twitter.png') no-repeat 0 0; margin-right: 11px; }
#cs-bottom_social .facebook-btn { display: inline-block; width: 38px; height: 38px; background: transparent url('../../img/v25/casestudy/icon_facebook.png') no-repeat 0 0; }


#cs-bottom_social .btn-view_comments .text-hide { display: none; }
#cs-bottom_social .btn-view_comments .text-show { display: block; }
#cs-bottom_social .btn-view_comments.open .text-hide { display: block; }
#cs-bottom_social .btn-view_comments.open .text-show { display: none; }


/* #cs-recommended
-------------------------------------------- */

#cs-recommended { background-color: #ebebeb; padding: 70px 0; }
#cs-recommended .holder { max-width: 1130px; margin: auto; }

#cs-recommended .mtitle { font-size: 18px; font-family: 'Montserrat', sans-serif; margin-bottom: 20px; text-transform: uppercase; padding-left: 13px; }







/* #cs-comments
-------------------------------------------- */


#cs-comments { display: none; padding: 70px 40px; background-color: #f3f3f3; border-top: 3px solid #ebebeb; }
#cs-comments .holder { max-width: 1100px; margin: auto; }
#disqus_thread a { color: #e55c5a; }



/* #cs-comments
-------------------------------------------- */

#bottom-social { position: fixed; bottom: 5px; left: 20px; padding: 10px; z-index: 10; }
#bottom-social .btn {
    width: 37px; height: 37px;
    background-position: 50% 50%;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    display: block;
    margin-bottom: 10px;
    opacity: 1;
 }

#bottom-social .btn.like-btn { background: transparent url('../../img/v25/casestudy/new_love_btn.png') no-repeat 50% 50%; position: relative; }
#bottom-social .btn.twitter-btn { background: transparent url('../../img/v25/casestudy/new_twitter_btn.png') no-repeat 50% 50%; }
#bottom-social .btn.facebook-btn { background: transparent url('../../img/v25/casestudy/new_facebook_btn.png') no-repeat 50% 50%; }

#bottom-social .btn-love_this .thanks {
    position: absolute; top: 7px; left: 35px; width: 60px; text-align: center; text-transform: uppercase; font-size: 11px; color: #fff; opacity: 0; background-color: #e55c5a; padding: 4px 6px;
    -webkit-transition: all 250ms ease;
    -moz-transition: all 250ms ease;
    -o-transition: all 250ms ease;
    transition: all 250ms ease;
}
#bottom-social .btn-love_this .thanks.showit { left: 44px; opacity: 1; }


/* Mobile
-------------------------------------------- */


@media only screen and ( max-width : 680px )
{
    #cs-header { height: 328px; }

    #cs-header .csotw { font-size: 12px; height: auto; }
    #cs-header .csotw .title { display: block; border: none; display: block; }

    #cs-intro { padding-top: 80px; margin-bottom: 40px; }

    #cs-intro .title { font-size: 30px; margin-bottom: 0; line-height: 36px; }
    #cs-intro .agency { font-size: 14px; padding: 0 20px; }


    #cs-intro .members .member { width: 50px; height: 50px; }
    #cs-intro .members .membertotal .label { display: none; }
    #cs-intro .members .membertotal .number { padding-top: 16px; }

    #cs-intro .scoreboard { width: 100%; text-align: center; margin-bottom: 40px; }
    #cs-intro .scoreboard .score { width: 65px; }
    #cs-intro .scoreboard .score .label { font-size: 11px; }
    #cs-intro .scoreboard .score .number { font-size: 16px; }

    #cs-description { font-size: 16px; line-height: 24px;  margin-bottom: 40px; padding: 0 20px; }

    #cs-concept {  }
    #cs-concept .text-content { padding-top: 40px; margin: 0px 20px; margin-bottom: 50px; }
    #cs-concept .text-content .title { font-size: 28px; margin-bottom: 10px; }
    #cs-concept .text-content .text {  font-size: 16px; line-height: 24px; }

    #cs-concept .owl-nav { display: none; }
    #cs-concept .media-thumbs .thumb { margin: 0 5px 5px 5px; }
    #cs-concept .media-thumbs .thumb img { width: 50px; height: 50px; }
    #cs-concept .media-thumbs { padding: 30px 15px 0 15px; text-align: center; }

    #cs-production .text-content { padding-top: 40px; margin: 0px 20px; margin-bottom: 20px; }
    #cs-production .text-content .title { font-size: 28px; margin-bottom: 10px; }
    #cs-production .text-content .text {  font-size: 16px; line-height: 24px; }

    #cs-production .media-list .media { margin-bottom: 20px; }

    .media .caption .icon {
        width: 35px; height: 35px;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
    }
    .media .caption .text-holder { font-size: 14px; line-height: 18px; padding: 0 20px; }


    #cs-final .text-content { padding-top: 40px; margin: 0px 20px; margin-bottom: 30px; }
    #cs-final .text-content .title { font-size: 28px; margin-bottom: 10px; }
    #cs-final .text-content .text {  font-size: 16px; line-height: 24px; }

    #cs-final .media-list .media { margin-bottom: 20px; }


    #cs-bottom_credits { padding: 0; padding-bottom: 40px; }
    #cs-bottom_credits .left-side { float: none; width: 100%; padding: 0 20px; margin-bottom: 30px; }
    #cs-bottom_credits .right-side { float: none; width: 100%; padding: 0 20px; }

    #cs-bottom_credits .tag-content
    {
        border: none;
        border-top: 1px solid #e5e5e5;
        padding-bottom: 30px; padding-top: 30px;
        margin-bottom: 0px;
        font-size: 18px; line-height: 28px;
   }

   #cs-bottom_credits .title { font-size: 28px; margin-bottom: 10px; }
   #cs-bottom_credits .members { line-height: 28px; }
   #cs-bottom_credits .members .member .info .name { font-size: 16px; }
   #cs-bottom_credits .members .member .info .role { font-size: 14px; }

   #cs-bottom_social { height: 100px; background-color: #fff; }
   #cs-bottom_social .holder { padding-top: 12px; }
   #cs-bottom_social .btn-view_comments { display: none; }
   #cs-bottom_social .share { padding-right: 20px; }
   #cs-bottom_social .btn-love_this {
        left: 20px; margin: 0; width: 70px; height: 70px;
        top: -5px;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
   }

   #cs-recommended { padding: 40px 0; }
   #cs-recommended .entries-holder { width: 320px; margin: auto; }
   #cs-recommended .mtitle { text-align: center; }

   #cs-concept .media-video .embed iframe { width: 100%; height: 100%; min-height: 50px; }
   #cs-production .media-video .embed iframe { width: 100%; height: 100%; min-height: 50px; }
   #cs-final .media-video .embed iframe { width: 100%; height: 100%; min-height: 50px; }
   #cs-video .media-video .embed iframe { width: 100%; height: 100%; min-height: 50px; }




    #cs-header .media_type { bottom: -61px; }

    #bottom-social { display: none; }

    #cs-intro .members .member.logo .avatar-image { width: 50px; height: 50px; }


    #cs-intro .members .pipe { display: none; }

}