@media (max-width: 767px) {

    .main-container .container section p,
    .main-container .container .section p {
        font-size: 20px;
    }
    .main-container #top_photo {
        height: inherit;
        padding: 0;
        position: relative;
    }
    .main-container #top_photo .tit{
        display: inline-block;
        position: relative;
        width: 100%;
        text-align: center;
        margin-bottom: 0;
    }
    .main-container #top_photo img{
        position: relative;
    }
    .main-container #top_photo .tit .add_desc{
        line-height: 1.5;
    }
    .clearfix-xs{
        width: 100%;
        clear: both;
        height: 30px;
    }
    .after_header_photo{
        padding-top: 0;
        font-size: 20px;
        color: #363636;
    }

    .page-title .gt-name h1 {
        font-size: 30px;
    }
    .page-title .gt-month {
        font-size: 18px;
        padding-top: 33px;
    }
    .gt-header-image {
        width: 100%;
        height: inherit;
        padding-right: 15px;
        overflow: hidden;
    }
    .row.gt-sm-header{
        margin-right: 0;
        padding: 15px;
    }
    .gt-sm-header h1 {
        color: #c3002f;
        font: normal 24px/24px HeliosCondC;
        text-transform: uppercase;
        padding-top: 15px;
    }
    .gt-sm-header h1 br{
        display: none;
    }
    .great-times-blocks .gt-block{
        height: inherit;
    }

    .gt-sm-header .gt-read-more {
        position: relative;
        width: 100%;
        background: #b8152d;
        display: block;
        text-align: center;
        text-transform: uppercase;
        font: normal 22px/45px HeliosCondC;
        color: #ffffff;
        margin-top: 18px;
    }

    .row-xs{
        margin: 0 -15px;
        position: relative;
    }
    .gt-up {
        position: absolute;
        background: url("/images/gt_up.png") no-repeat top center;
        height: 37px;
        bottom: 0;
        left: 50%;
        width: 44px;
        margin-left: -22px;
    }
    .main-container .red_line{
        padding: 20px 0 10px 0;
        font-size: 21px;
    }
    #res{
        top: -3%;
    }
    #caption{
        top: 2%;
    }

    #text_p   {
        color: #ffffff;
        font-size: 15px;
    }

    .gif-resize {
        height: 430px;
        width: 100%;
        }

    .gif-art {
        width:100%;
        }

    .gif-inst {

        width:100%;
        }

    .gif-comix {
        height: 245px;
        }


    .quote {
        position: relative;
        left: auto;
        top: 30px;
        margin-left: auto;
        margin-right: auto;
        background-image: url('/uploads/TheGreatTimes/2016/May/Barcrawl/quote_bg_mob.png');
        height: 409px;
        width: 392px;
        padding-right: 10px;
    }

}

@media (min-width: 680px) {

    #text_p  {
        color: #ffffff;
        font-size: 18px;
    }

}

@media (max-width: 680px) {

    #text_p   {
        color: #ffffff;
        font-size: 16px;
    }

    #text_lg {
        font-size: 33px;
    }




}



@media (min-width: 768px) {

    .after_header_photo{
        font-size: 20px;
    }
    .main-container .container section p,
    .main-container .container .section p {
        font-size: 20px;
    }
    .main-container #top_photo {
        height: 180px;
    }
    .main-container #top_photo .tit{
        left: 15px;
    }
    .main-container section,
    .main-container .section{
        font-size: 20px;
        line-height: 1.2;
    }
    .great-times-blocks .gt-down {

    }
    .great-times-blocks .gt-up {

    }
    .gt-sm-header {
        margin-left: 0;
        margin-bottom: 30px;
        margin-top: -30px;
        width: 100%;
        background: #e1e1e1;
        color: #555555;
        font: normal 16px/16px HeliosCondC;
    }
    .gt-sm-header h1 {
        color: #c3002f;
        font: normal 24px/24px HeliosCondC;
        text-transform: uppercase;
        padding-top: 10px;
    }
    .gt-sm-header p {
        padding: 30px 0 5px;
        margin: 0;
    }
    .gt-sm-header .gt-read-more {
        position: absolute;
        bottom: 56px;
        width: 42%;
        left: 30px;
        background: #b8152d;
        display: block;
        text-align: center;
        text-transform: uppercase;
        font: normal 22px/50px HeliosCondC;
        color: #ffffff;
    }
    .gt-sm-header .gt-read-more:hover {
        opacity: 0.7;
        text-decoration: none;
    }
    .gt-sm-header .gt-sm-up {
        background: url("../images/gt_up.png") no-repeat top center;
        height: 37px;
        width: 43px;
        position: absolute;
        left: 340px;
        top: -37px;
    }
    .page-title .gt-name h1 {
        font-size: 40px;
    }
    .page-title .gt-month {
        padding-top: 35px;
        margin-left: -25px;
    }
    .page-title .gt-share {
        margin-top: 20px;
    }
    .gt-header-image {
        height: 276px;
        width: 735px;
        padding-right: 0;
        overflow: hidden;
    }
    .great-times-blocks .gt-block{
        height: 217px;
    }

    #text_p, #text_lg  {
        color: #ffffff;
        font-size: 12px;
    }

    .gif-resize {
        height: 252px;
        width: 95%;
        }

    .gif-art {
        height: 300px;
        width:100%;
        }

    .gif-inst {
        height: 219px;
        }

    .gif-comix {
        height: 191px;
        }

    .gif-gif {
        height: 255px;
        }


}
@media (min-width: 992px) {
    .main-container .container section p,
    .main-container .container .section p {
        font-size: 22px;
    }
    .main-container #top_photo {
        height: 240px;
    }
    .main-container #top_photo .tit{
        left: 15px;
    }
    .main-container section,
    .main-container .section {
        font-size: 22px;
        line-height: 1.2;
    }
    .page-title .gt-name h1 {
        font-size: 36px;
    }
    .page-title .gt-month {
        padding-top: 35px;
        margin-left: -25px;
    }
    .page-title .gt-share {
        margin-top: 20px;
    }

    .gt-header-image{
        width: 585px;
        height: 256px;
    }
    .gt-header-image img{
        height: 100%;
        width: auto;
    }
    .gt-header{
        width: 370px;
        height: 256px;
    }
    .gt-header h1{
        line-height: 1;
        font-size: 20px;
    }
    .gt-header p{
        height: 115px;
    }
    .three-row-text p{
        height:115px;
        }
    .great-times-blocks .gt-block{
        height: 217px;
        padding: 10px;
    }
    .great-times-blocks h1{
        margin-top: 0;
        font-size: 20px;
    }

    .great-times-blocks img{
        height: 160px;
    }
    .main-container .red_line{
        font-size: 24px;
    }
    #res{
        top: -4%;
    }
    .caption{
        top:0;
    }
    #text_p, #text_lg  {
        color: #ffffff;
        font-size: 16px;
    }

    .gif-resize {
        height: 263px;
        width: 98%;
        }

    .gif-art {
        height: 300px;
        width:100%;
        }

    .gif-inst {
        height: 291px;
        }

    .gif-comix {
        height: 254px;
        }

    .gif-gif {
        height: 159px;
        }
    .great-times .red_button {
        position: absolute;
        bottom: 10px;
        width: calc(100% - 40px);
    }
}
@media (min-width: 1200px) {
    .main-container section.after_header_photo,
    .main-container .after_header_photo {
        font-size: 22px;
    }
    .main-container #top_photo {
        height: 300px;
    }
    .main-container #top_photo .tit{
        left: 15px;
    }
    .main-container section,
    .main-container .section {
        font-size: 22px;
        line-height: 1.2;
    }
    .page-title .gt-name h1 {
        font-size: 42px;
    }
    .page-title .gt-month {
        margin-left: -45px;
    }

    .gt-header-image{
        height: 300px;
        width: 796px;
        padding-right: 0;
        overflow: hidden;
    }
    .gt-header{
        width: 359px;
        height: 300px;
        padding-left: 19px;
    }
    .gt-header h1{
        line-height: 1.1;
        font-size: 26px;
    }
    .gt-header p{
        height: 134px;
    }

    .gt-header .text-tomorrowland,
    .gt-header .rooftop {
        height: 105px;
    }

    .gt-header .text-tomorrowland, .gt-header .rooftop {
        height: 105px;
    }

    .three-row-text p{
        height:90px;
    }

    .great-times-blocks{
        padding: 15px;
    }
    .great-times-blocks h1{
        margin-top: 7px;
    }

    .great-times-blocks img{
        height: 200px;
    }
    .great-times-blocks .gt-block{
        height: 217px;
        padding: 15px;
    }
     #res{
        position: absolute;
        top: 5%;
        left: 0;
        width: 100%;
    }
    #text_p, #text_lg {
        color: #ffffff;
        font-size: 20px;
    }

.gif-resize {
    height: 319px;
    width: 98%;
    }

.gif-art {
    height: 300px;
    width: 100%;
    }

.gif-inst {
    height: 354px;
    }

    .gif-comix {
        height: 310px;
        }

.gif-gif {
    height: 196px;
    }

    .great-times .red_button {
        position: absolute;
        bottom: 10px;
        width: calc(100% - 45px);
    }
}