/*large Screen*/

@media (min-width: 1920px) {

    .portfolio {
        min-height          : 411px;
        overflow            : hidden !important;
    }

}


@media (min-width: 1367px) and (max-width: 1919px){

    .portfolio {
        min-height          : 325px;
        overflow            : hidden !important;
    }

}

@media (min-width: 992px)and (max-width: 1024px){
    .service .col-md-2 {
        padding-top    : 52px;
        padding-left   : 3px;
        padding-right  : 3px;
    }

    .second-title{
        padding-left  : 50px;
    }
    .carousel-inner .active .image-bar:after {
        right: 33%;
    }
}

/* Small devices (tablets, 768px and up) */
@media (min-width : 768px) and (max-width : 991px) {

    .small-menu .navbar-default {
        padding-top: 18px;
        padding-bottom: 10px;
    }
    
    .navbar-brand{
        margin-left    : 15px;
        -webkit-transition: all ease 300ms;
        -moz-transition: all ease 300ms;
        -o-transition: all ease 300ms;
        transition: all ease 300ms;
    }

    .navbar-fixed-top{

        padding-bottom  : 10px;
        padding-top     : 14px;
    }
    .navbar-toggle{
        margin-top  : -3px;
    }
    a.navbar-brand {
        padding-top     :5px;
    }
    
    
    /*RS-SLIDER*/
    .small-title{
        height     : 28px;
        font-size  : 12px !important;
        padding    : 10px 50px 10px 150px !important;
    }
    .small-title:after {
        position        : absolute;
        content         : " ";
        top             : 0;
        right           : 0;
        width           : 30px;
        height          : 28px;
        margin-right    : -20px;
        border-left     : 0px solid transparent;
        border-right    : 15px solid transparent;
        border-bottom   : 28px solid #404040;
    }

    .small-title:before {
        position            : absolute;
        content             : " ";
        top                 : 0;
        right               : 0;
        margin-right        : -25px;
        width               : 7px;
        height              : 28px;
        background         : #f65a41;
        -webkit-transform   : skew(27deg);
        -moz-transform      : skew(27deg);
        -o-transform        : skew(27deg);   
        -ms-transform       : skew(27deg);   
        -ms-filter          : "progid:DXImageTransform.Microsoft.Matrix(M11=0.7071067811865483, M12=0, M21=-0.7071067811865467, M22=1.4142135623730934, SizingMethod='auto expand')";
    }

    .buy-btn{
        height             : 35px;
        font-size          : 25px !important;
    }
    .buy-btn:before {
        height             : 35px;
        -webkit-transform  : skew(-30deg);
        -moz-transform     : skew(-30deg);
        -o-transform       : skew(-30deg);
        -ms-transform      : skew(-30deg);
    }
    .buy-btn:after {
        position        : absolute;
        content         : " ";
        top             : 0;
        left            : 0;
        width           : 30px;
        height          : 0;
        margin-left     : -20px;
        border-left     : 20px solid transparent;
        border-right    : 20px solid transparent;
        border-bottom   : 35px solid #404040;
    }

    .buy-btn:hover:after{
        position         : absolute;
        content         : " ";
        top             : 0;
        left            : 0;
        width           : 30px;
        height          : 0;
        margin-left     : -20px;
        border-left     : 20px solid transparent;
        border-right    : 20px solid transparent;
        border-bottom   : 35px solid  #e84700;
    }
    .buy-btn:hover:after,
    .buy-btn:focus:after
    {
        position         : absolute;
        content         : " ";
        top             : 0;
        left            : 0;
        width           : 30px;
        height          : 0;
        margin-left     : -20px;
        border-left     : 20px solid transparent;
        border-right    : 20px solid transparent;
        border-bottom   : 35px solid  #e84700;
    }

    .more-area h2{

        font-size   : 20px;
        font-weight : 300px;
    }
    .carousel-inner .active .image-bar:after {
        right: 28%;
    }

    .carousel-inner .active .image-bar:before{
        right: 59%;
    }
    .blog-wrapper .more-area h2{

        font-size   : 22px;
        font-weight : 300px;
        padding-top : 8px;
    }


    .second-title{
        padding         : 10px 20px !important;
        text-transform  : capitalize;
    }

    .section-padding{
        padding     : 60px 0;
    }


    #about .col-sm-6:nth-child(even){
        border-right   : 1px solid #f5f5f5;
    }

    #about .col-sm-6:nth-child(5),
    #about .col-sm-6:nth-child(4){
        border-top     : 1px solid #f5f5f5;
    }

    #about .col-sm-6:nth-child(3),#about .col-sm-6:nth-child(2){
        padding-bottom     : 25px;
    }

    #about .col-sm-6:nth-child(4),#about .col-sm-6:nth-child(5){
        padding-top    : 25px;
    }
    .media-left>a>.fa{
        height              : 40px;
        width               : 40px;
        border-radius       : 50%;
        border              : 2px solid #cfcece;
        padding             : 10px;
        display             : table-cell;
        -webkit-transition  : all 0.2s ease 0s;
        -moz-transition     : all 0.2s ease 0s;
        -ms-transition      : all 0.2s ease 0s;
        -o-transition       : all 0.2s ease 0s;
        transition          : all 0.2s ease 0s;
    }
    .media {
        margin-top  : 10px;
    }

    .media-body h2 {
        font-size   : 13px;
    }
    .service .col-md-5 {
        padding-top : 35px;
    }
    .service .col-md-2 {
        padding-top     : 30px;
        padding-left    : 5px;
        padding-right   : 5px;
    }
    .image-box img {
        height          : 230px;
    }
    #grid figure {
        width           : 108.4%;
    }

    /*BLOG*/
    #blog .col-xs-12{
        margin-bottom  : 40px;
    }
    #blog .col-xs-12:last-child{
        margin-bottom  : 0; 
    }


    /*FULL WIDTH BLOG*/

    .blog-sidebar .blog-content .blog-date{

        margin-right    : 50px;
    }

    .blog-sidebar .blog-content .col-sm-9{

        padding-left    : 0px;

    }


    /*FOOTER*/
    footer .col-xs-12:nth-child(3),
    footer .col-xs-12:nth-child(4){
        margin-top     : 30px;
    }

}


/* Landscape Mobile */
@media only screen and (min-width : 480px) and (max-width : 767px) {

    .small-menu .navbar-default {
        padding-top: 18px;
        padding-bottom: 10px;
    }
    .small-title{
        height     : 18px;
        font-size  : 10px !important;
        padding    : 6px 30px 0 80px !important; 
    }

    .second-title{
        padding         : 4px 10px !important;
        text-transform  : capitalize;
    }
    .small-title:after {
        position     : absolute;
        content      : " ";
        top          : 0;
        right        : 0;
        width        : 30px;
        height       : 18px;
        margin-right : -20px;
        border-left  : 0px solid transparent;
        border-right : 15px solid transparent;
        border-bottom: 18px solid #404040;
    }

    .small-title:before {
        position            : absolute;
        content             : " ";
        top                 : 0;
        right               : 0;
        margin-right        : -25px;
        width               : 7px;
        height              : 18px;
        background         : #f65a41;
        -webkit-transform   : skew(40deg);
        -moz-transform      : skew(40deg);
        -o-transform        : skew(40deg);   
        -ms-transform       : skew(40deg);   
        -ms-filter          : "progid:DXImageTransform.Microsoft.Matrix(M11=0.7071067811865483, M12=0, M21=-0.7071067811865467, M22=1.4142135623730934, SizingMethod='auto expand')";
    }

    .buy-btn{
        height         : 18px;
        font-size      : 11px !important;
        padding-right  : 80px !important;
        padding-left   : 40px !important;
    }
    .buy-btn:before {
        height             : 18px;
        width              : 5px;
        margin-left        : -14px;
        -webkit-transform  : skew(-32deg);
        -moz-transform     : skew(-32deg);
        -o-transform       : skew(-32deg);
        -ms-transform      : skew(-32deg);
    }

    .buy-btn:after {
        position        : absolute;
        content         : " ";
        top             : 0;
        left            : 0;
        width           : 10px;
        height          : 0;
        margin-left     : -10px;
        border-left     : 10px solid transparent;
        border-right    : 0px solid transparent;
        border-bottom   : 18px solid #404040;
    }
    .buy-btn:hover:after{
        position         : absolute;
        content         : " ";
        top             : 0;
        left            : 0;
        width           : 10px;
        height          : 0;
        margin-left     : -10px;
        border-left     : 10px solid transparent;
        border-right    : 0px solid transparent;
        border-bottom   : 18px solid  #e84700;
    }
    .buy-btn:hover:after,
    .buy-btn:focus:after{
        position         : absolute;
        content         : " ";
        top             : 0;
        left            : 0;
        width           : 10px;
        height          : 0;
        margin-left     : -10px;
        border-left     : 10px solid transparent;
        border-right    : 0px solid transparent;
        border-bottom   : 18px solid  #e84700;
    }


    .more-area h2{

        font-size   : 20px;
        font-weight : 300px;
    }

    .blog-wrapper .more-area h2{

        font-size   : 22px;
        font-weight : 300px;
        padding-top : 8px;
    }
    .carousel-inner .active .image-bar:before{
        right: 63%;
    }

    .carousel-inner .active .image-bar:after {
        right:15%;
    }
    .navbar-brand{
        margin-left    : 15px;
        -webkit-transition: all ease 300ms;
        -moz-transition: all ease 300ms;
        -o-transition: all ease 300ms;
        transition: all ease 300ms;
    }

    .navbar-fixed-top{

        padding-bottom  : 10px;
        padding-top     : 14px;
    }
    .navbar-toggle{
        margin-top  : -3px;
    }
    a.navbar-brand {
        padding-top     :5px;
    }
    .section-padding{
        padding         : 60px 0;
    }
    .service .col-md-5,
    .service .col-md-2 {
        margin-left    : 15%;
    }

    #about .col-xs-12{
        margin-bottom  : 20px;
    }

    #about .col-xs-12{
        margin  : 30px 0;
    }

    .who-we-are-content{
        padding-top: 30px;
    }


    /*BLOG*/
    #blog .col-xs-12 {
        margin-bottom   : 40px;
    }

    /*FULL WIDTH BLOG*/

    .blog-content{
        position    : relative;
    }

    .blog-date{
        position    : absolute; 
        top         : -137px;

    }

    .sidebar-blog-content .blog-date{
        position    : absolute; 
        top         : -140px;

    }


    .blog-date p{
        background  : rgba(245,72,40, 0.9);
        font-size   : 16px;
        line-height : 16px;
        padding     : 8px 25px 12px;
    }

    .blog-date p span{
        font-size   : 30px;
        font-weight : bold;
        line-height : 35px;
    }

    .blog-content .video-area,.blog-sidebar .blog-content .video-area{
        height : 300px;
        width  : 100%;
    }

    .blog-content h1 a{
        font-size   : 22px;
    }

    .blog-content h1{
        line-height : 22px;

    }

    .blog-content .contents{
        font-size   : 14px;
        line-height : 24px;      
    }

    .blog-content [class^="flaticon-"]:before, 
    .blog-content [class*=" flaticon-"]:before, 
    .blog-content [class^="flaticon-"]:after, 
    .blog-content [class*=" flaticon-"]:after
    {
        font-size    : 14px;
        margin-right : 6px;
    }


    /*FOOTER*/

    .footer-wrapper ul.footermenu,
    .footer-wrapper ul.footercontact,
    .footer-wrapper ul.footerblog {
        margin  : 15px 0 0;
    }

    .footer-wrapper.section-padding {
        margin-left : 4%;
    }

    footer .col-xs-12:nth-child(2),
    footer .col-xs-12:nth-child(3),
    footer .col-xs-12:nth-child(4){
        margin-top     : 30px;
    }
    .left-column .media {
        text-align  : left;
    }
    .left-column .media-left {
        float           : left;
        padding-right   : 20px;
    }
    .right-column .media-left{
        padding-left   : 20px;
        padding-right  : 20px;
    }
    .footer-wrapper.section-padding {
        padding      : 40px 0;
    }


    .blog-sidebar .blog-content h1{

        line-height     : 20px;
    }



}


/*Mobile */
@media only screen and (min-width : 320px) and (max-width : 479px) {

    .navbar-brand > img {
        width   : 65%;
    }

    .navbar-toggle {
        padding     : 7px 4px;
        margin-top  : -16px;
    }

    .navbar-fixed-top{

        padding-bottom  : 10px;
        padding-top     : 14px;
    }
    .navbar-toggle{
        margin-top  : -3px;
    }
    a.navbar-brand {
        margin-left     : 15px;
        padding-top     :5px;
    }
    .small-menu .navbar-default {
        -webkit-transition: all ease-in 0.45s;
        -moz-transition: all ease-in 0.45s;
        -o-transition: all ease-in 0.45s;
        -ms-transition: all ease-in 0.45s;
        transition: all ease-in 0.45s;
        padding-top     : 25px;
        padding-bottom  : 15px;
    }
    .small-title{
        height     : 13px;
        font-size  : 10px !important;
        padding    : 5px 20px 3px 40px !important; 
    }
    .small-title:after {
        position        : absolute;
        content         : " ";
        top             : 0;
        right           : 0;
        width           : 20px;
        height          : 13px;
        margin-right    :  -20px;
        border-left     : 0px solid transparent;
        border-right    : 11px solid transparent;
        border-bottom   : 13px solid #404040;
    }

    .small-title:before {
        position            : absolute;
        content             : " ";
        top                 : 0;
        right               : 0;
        margin-right        : -25px;
        width               : 7px;
        height              : 13px;
        background         : #f65a41;
        -webkit-transform   : skew(40deg);
        -moz-transform      : skew(40deg);
        -o-transform        : skew(40deg);   
        -ms-transform       : skew(40deg);   
        -ms-filter          : "progid:DXImageTransform.Microsoft.Matrix(M11=0.7071067811865483, M12=0, M21=-0.7071067811865467, M22=1.4142135623730934, SizingMethod='auto expand')";
    }

    .buy-btn{
        height         : 18px;
        font-size      : 10px !important;
        padding-right  : 80px !important;
        padding-left   : 40px !important;
    }
    .buy-btn:before {
        height             : 18px;
        width              : 5px;
        margin-left        : -14px;
        -webkit-transform  : skew(-32deg);
        -moz-transform     : skew(-32deg);
        -o-transform       : skew(-32deg);
        -ms-transform      : skew(-32deg);
    }
    .buy-btn:after {
        position        : absolute;
        content         : " ";
        top             : 0;
        left            : 0;
        width           : 10px;
        height          : 0;
        margin-left     : -10px;
        border-left     : 10px solid transparent;
        border-right    : 0px solid transparent;
        border-bottom   : 18px solid #404040;
    }

    .buy-btn:hover:after{
        position         : absolute;
        content         : " ";
        top             : 0;
        left            : 0;
        width           : 10px;
        height          : 0;
        margin-left     : -10px;
        border-left     : 10px solid transparent;
        border-right    : 0px solid transparent;
        border-bottom   : 18px solid  #575757;
    }
    .buy-btn:hover:after,
    .buy-btn:focus:after{
        position         : absolute;
        content         : " ";
        top             : 0;
        left            : 0;
        width           : 10px;
        height          : 0;
        margin-left     : -10px;
        border-left     : 10px solid transparent;
        border-right    : 0px solid transparent;
        border-bottom   : 18px solid  #e84700;
    }


    .more-area h2{

        font-size   : 20px;
        font-weight : 300px;
    }

    .blog-wrapper .more-area h2{

        font-size   : 22px;
        font-weight : 300px;
        padding-top : 8px;
    }

    .btn.btn-success.pull-right{

        float       :left !important;
        margin-top  : 20px;

    }
    .carousel-inner .active .image-bar:before {
        left    : 2%;
    }
    .carousel-inner .active .image-bar:after {
        right   : 2%;
    }
    #blog .col-xs-12{

        margin-bottom   : 30px;
    }

    #blog .more-area .col-xs-12{

        margin-bottom   : 10px;
    }


    .second-title{

        text-transform  : capitalize;
    }
    .second-title{
        padding         : 5px !important;
        text-transform  : capitalize;
    }
    .left-column .media {
        text-align      : left;
    }
    .left-column .media-left {
        float           : left;
        padding-right   : 10px;
        margin-left     : 10px;
    }
    .right-column .media-left{
        padding-left    : 2px;
        padding-right   : 2px;
    }
    .left-column .media-left{
        padding-left    : 10px;
    }
    .media-body h2{
        font-size       : 13px;
    }
    .right-column .media-left.media-middle {
        float           : left;
        padding-right   : 10px;
        margin-left     : 10px;
    }
    .service .col-md-2 {
        padding-top     : 65px;
        margin-left     : 25%;
    }
    .service .col-md-5 {
        padding-left    : 5px;
        padding-right   : 5px;
    }
    .down-arrow .scroll-bottom{
        height     : 50px;
        width      : 50px;
    }



    /*FOOTER*/

    .footer-wrapper ul.footermenu,
    .footer-wrapper ul.footercontact,
    .footer-wrapper ul.footerblog {
        margin  : 15px 0 0;
    }


    #about .col-xs-12{
        margin  : 30px 0;
    }

    .who-we-are-content{

        padding-top     : 30px;
    }

    .portfolio-menu .container{
        margin     : 0;
    }


    #filter li a {
        border-radius   : 0px;
        cursor          : pointer;
        display         : block;
        margin          : 0;
        font-size       : 10px;
        padding         : 2px 6px;
        text-transform  : uppercase;
        color           : #8d8d8d;
        background-color: #f5f5f5;
    }



    footer .col-xs-12:nth-child(2),
    footer .col-xs-12:nth-child(3),
    footer .col-xs-12:nth-child(4){
        margin-top     : 30px;
    }

    /*LANDINF BLOG*/


    /*FULL WIDTH BLOG*/

    .blog-content{

        position    : relative;

    }

    .blog-date{

        position    : absolute; 
        top         : -137px;

    }

    .sidebar-blog-content .blog-date{

        position    : absolute; 
        top         : -139px;

    }


    .blog-date p{

        background  : rgba(245,72,40, 0.9);
        font-size   : 16px;
        line-height : 16px;
        padding     : 8px 25px 12px;
    }

    .blog-date p span{


        font-size       : 30px;
        font-weight     : bold;
        line-height     : 35px;
    }

    .blog-content .video-area,.blog-sidebar .blog-content .video-area{

        height  : 200px;
        width   : 100%;
    }

    .blog-content h1 a{

        font-size   : 20px;

    }

    .blog-content h1{
        line-height     : 22px;

    }

    .blog-content .contents{

        font-size   : 14px;
        line-height : 24px;      
    }

    .blog-content .icon-holder{

        font-size   : 12px;
    }

    .blog-content [class^="flaticon-"]:before, 
    .blog-content [class*=" flaticon-"]:before, 
    .blog-content [class^="flaticon-"]:after, 
    .blog-content [class*=" flaticon-"]:after
    {
        font-size       : 12px;
        margin-right    : 0;
    }


    /*pagination*/

    .pagination-lg > li:first-child > a > small,
    .pagination-lg > li:last-child > a > small
    {

        display     : none;
    }

    .blog-content .pagination-lg > li > a, 
    .pagination-lg > li > span
    {

        padding     : 5px 11px;
    }

    .blog-content .sidebar-blog-content .pagination-lg > li:last-child > a, 
    .blog-content .sidebar-blog-content .pagination-lg > li:last-child > span{

        margin  : 0 0 0 0px;

    }
    .blog-content .sidebar-blog-content .icon-holder a{

        margin-right    : 7px;
    }

    .blog-sidebar .blog-content h1{

        line-height     : 20px;
    }


    .backtop{

        bottom: 70px;
    }

}