/* Mobile Portrait View */

@media screen and (max-width: 767px) {
    .left, .right, .headerinfo {
        float: none;
    }
    .container {
        width: auto;
        padding: 0 20px;
    }
    .header {
        width: 100%;
        position: relative;
        padding: 15px 0 0 0;
    }
    .header-socialicon {
        float: none;
        text-align: center;
        width: auto;
    }
    .headerinfo {
        line-height: 24px;
        padding: 10px 0;
        text-align: center;
    }
    .logo {
        width: auto;
        float: none;
        text-align: center;
        padding: 0;
    }
    .toggle a {
        padding: 5px 10px;
    }
    .nivo-caption,
    .nivo-controlNav {
        display: none !important;
    }
    .wrap_one img {
        margin: 0 0 20px;
        float: none;
        max-width: 100%;
    }
    .innerbanner {
        height: auto;
    }
    .slider-main {
        min-height: 140px;
    }
    /*coloumn css*/
    .one_half,
    .one_third,
    .two_third,
    .one_fourth,
    .three_fourth,
    .one_fifth,
    .four_fifth,
    .services-col,
    .services-wrap .one_third,
    #wrapperthree .one_half {
        float: none !important;
        width: 100% !important;
        margin: 0 0 30px !important;
    }
    .news-section {
        padding: 30px 0 10px 0;
    }
    #wrappfourth .one_third {
        padding: 0 0 30px 0;
        min-height: inherit;
        border: 0;
        margin-bottom: 0px !important;
    }
    .headerinfo span {
        display: block;
        margin: 0;
    }
    .logo img {
        height: auto;
    }
    .header_right {
        width: 100%;
    }
    .cols-4 .widget-column-1,
    .cols-4 .widget-column-2,
    .cols-4 .widget-column-3,
    .cols-4 .widget-column-4 {
        width: 100%;
        margin: 0 0 30px 0;
        box-sizing: border-box;
    }
    .nivo-directionNav {
        left: 8%;
    }
    .serviceswrap h2.section_title {
        margin-bottom: 20px;
    }
    /*sidebar css*/
    #sidebar {
        width: 100%;
        float: none;
    }
    .sidebar-left {
        float: none !important;
        width: 100%;
    }
    .flotRight {
        float: none !important;
    }
    /*footer css */
    .cols-4 {
        width: 100% !important;
        float: none;
        margin: 0 0 10% 0;
    }
    /* --------- Pages ------- */
    .content-area {
        width: auto;
        margin: 0;
        padding: 20px;
    }
    .site-main {
        width: auto;
        margin: 0;
        padding: 0;
        float: none;
    }
    .contact_left,
    .contact_right {
        float: none;
        width: 100%;
        margin-bottom: 10%;
    }
    .copyright-txt,
    .design-by {
        text-align: center;
        float: none;
    }
    #contactform_main input[type="text"],
    #contactform_main input[type="email"],
    #contactform_main input[type="tel"],
    #contactform_main input[type="url"],
    #contactform_main textarea {
        width: 100%;
        box-sizing: border-box;
    }
    /*custom css*/
    .searchbox {
        width: 100%;
        padding-left: 0;
    }
    .item {
        padding-left: 0;
        width: auto;
    }
    ol.nav-numbers {
        display: none;
    }
    #testimonials ul li .tm_description p {
        text-align: left;
    }
    .phone-no strong {
        width: auto;
        display: inherit;
    }
    .client-say,
    .tm_description {
        float: none;
        width: auto;
        margin: 6% 0 0 0;
        height: auto;
    }
    .say_thumb {
        float: none;
        margin: auto;
    }
    .post-thumb {
        width: 100%;
        margin: 0 0 20px 0;
    }
    .wrap_one .welcome-thumb {
        width: 100%;
        height: auto;
        margin-left: 0;
        float: inherit;
    }
    .wrap_one .welcome-thumb img {
        min-height: inherit;
    }
    .teammember-list {
        width: 100%;
    }
    .team-thumb-icons {
        height: auto;
    }
    .team-thumb-icons img {
        min-height: inherit;
    }
    .headerfixed {
        position: relative;
    }
    .header-top {
        background-color: rgba(25, 24, 24, 1) !important;
    }
    .header_right {
        float: none;
    }
    .logo::before {
        background-color: transparent !important;
    }
    .header {
        padding-bottom: 10px;
    }
    .one_four_page {
        width: 100%;
        height: auto;
    }
    .one_four_page a img {
        min-height: inherit;
    }
    .wrap_one_content a.morebutton {
        position: relative;
    }
    .controls li {
        padding: 0 10px !important;
    }
    #photo-gallery .container,
    #teamsection .container {
        padding: 0;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
    }
    #Grid .mix {
        width: 100% !important;
    }
    .news-box {
        float: none;
        width: auto;
        margin: 0 0 20px;
    }
    .news-box .news-thumb {
        height: auto;
    }
    .servicesbox {
        margin: 0 auto 20px auto;
        display: block;
    }
    .teammember-list {
        height: auto;
    }
    .teammember-list img {
        min-height: inherit;
    }
    .infocol-3 {
        float: none;
        width: auto;
        margin: 0 0 20px;
        padding: 10px 20px;
    }
    .cols-3 .widget-column-1,
    .cols-3 .widget-column-2,
    .cols-3 .widget-column-3 {
        width: 100%;
        float: none;
        margin: 0 0 25px;
    }
    .footer ul li {
        float: none;
        width: auto;
        margin: 0;
    }
    .copyright3cols {
        width: auto;
        float: none;
        margin: 0 0 5px;
    }
    .wrap_one .welcome-thumb::after {
        display: none;
    }
    .wrap_one .welcome-thumb a {
        height: auto;
    }
    #Grid .mix {
        height: auto !important;
    }
    #Grid .mix img {
        min-height: inherit !important;
        vertical-align: top;
    }
    .ftrcontactinfo {
        padding: 15px 0;
    }
    .ngg-gallery-thumbnail-box {
        width: 100%;
    }
    h2.welcometitle {
        font-size: 30px !important;
    }
    #Grid .mix strong {
        top: 32% !important;
    }
}
/* Mobile Portrait View */

@media screen and (min-width: 480px) and (max-width: 767px) {
    .container {
        width: 440px;
        padding: 0;
        margin: auto;
    }
    .teammember-list {
        width: 50%;
    }
    #Grid .mix {
        width: 50% !important;
    }
    #Grid .mix,
    .teammember-list {
        height: 240px !important
    }
    #Grid .mix img,
    .teammember-list img {
        min-height: 240px !important;
    }
    .headerinfo span {
        display: inline;
        margin-left: 25px;
    }
    .social-icons a {
        margin-right: 10px;
    }
    .header-socialicon {
        float: left;
    }
    .ngg-gallery-thumbnail-box {
        width: 50%;
    }
}
/* Tablet View */

@media screen and (max-width: 1024px) and (min-width: 768px) {
    .container {
        width: auto;
        padding: 0 20px;
    }
    .logo {
        padding: 10px 0;
    }
    .logo img {
        height: auto !important;
    }
    .sitenav ul li a {
        padding: 20px 0 21px 15px;
    }
    .wrap_one,
    .signin_wrap {
        width: auto;
    }
    .wrap_one ul {
        margin-top: 20px;
    }
    /*slider css*/
    .content-area {
        width: auto;
        margin: 0;
        padding: 20px 20px;
    }
    .team-thumb-icons .member-social-icon {
        opacity: 1;
    }
    .member-social-icon a {
        margin: 0;
    }
    .cols-4 h5 {
        font-size: 16px !important;
    }
    #sidebar {
        width: 30%;
    }
    .site-main {
        width: 65%;
    }
    .slider-main {
        min-height: 340px;
    }
    .nivo-caption {
        width: 70% !important;
        left: 3%;
    }
    /*custom  css*/
    .BlogPost {
        min-height: 250px;
    }
    .client_lists .client {
        width: 14%;
    }
    .tm_thumb {
        width: 15%;
    }
    #testimonials ul li .tm_description {
        width: 85%;
    }
    .recent-post h6 {
        padding-top: 7px;
    }
    ol.nav-numbers {
        bottom: 10%;
    }
    h2.section_title {
        margin-bottom: 30px;
    }
    section {
        padding: 40px 0;
    }
    .wrap_one_content {
        display: table;
    }
    .cols-4 .widget-column-1,
    .cols-4 .widget-column-2,
    .cols-4 .widget-column-3 {
        margin-right: 20px;
    }
    .cols-4 .widget-column-1,
    .cols-4 .widget-column-3,
    .cols-4 .widget-column-4 {
        width: 25.5%;
    }
    .cols-4 .widget-column-2 {
        width: 15%;
    }
    .innerbanner {
        height: 200px;
    }
    #sidebar .search-field {
        width: 58.5%;
    }
    #contactform_main textarea {
        width: 88.5%;
    }
    .post-thumb {
        height: 135px;
    }
    h3.widget-title {
        font-size: 18px;
    }
    .wrap_one .welcome-thumb {
        height: 250px;
    }
    .wrap_one .welcome-thumb img {
        min-height: 250px;
    }
    .sidebar-left {
        width: 30%;
    }
    .sidebar-left #sidebar {
        width: 100%;
    }
    .logo {
        float: none;
        margin: auto;
    }
    .header_right {
        width: 100%;
        float: none;
    }
    .teammember-list {
        width: 50%;
    }
    .team-thumb-icons {
        height: 160px;
    }
    .team-thumb-icons img {
        min-height: 160px;
    }
    .headerfixed {
        position: relative;
    }
    .header-top {
        background-color: rgba(25, 24, 24, 1) !important;
    }
    .logo {
        width: auto;
        text-align: center;
    }
    .logo::before {
        background-color: transparent !important;
    }
    .one_four_page {
        width: 24.8%;
        height: 180px;
    }
    .one_four_page a img {
        min-height: 180px;
    }
    .wrap_one .welcome-thumb {
        margin-right: 40px;
    }
    .wrap_one_content a.morebutton {
        position: relative;
    }
    #Grid .mix {
        height: 200px !important;
    }
    #Grid .mix img {
        min-height: 200px !important;
    }
    .news-box {
        margin-right: 19px;
    }
    .news-box .news-thumb {
        height: 180px;
    }
    .servicesbox {
        width: 165px;
        margin-right: 20px;
    }
    .services_thumb {
        height: 165px;
    }
    .servicesbox h4 {
        font-size: 15px;
    }
    #photo-gallery .container,
    #teamsection .container {
        padding: 0;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
    }
    .teammember-list {
        height: 380px;
    }
    .teammember-list img {
        min-height: 380px;
    }
    .cols-3 .widget-column-1,
    .cols-3 .widget-column-2 {
        margin-right: 35px;
    }
    .footer ul li {
        float: none;
        width: auto;
    }
    .footer .cols-4 ul li {
        margin-right: 0;
    }
    .wrap_one .welcome-thumb::after {
        left: 15px;
        top: 15px;
    }
    .ngg-gallery-thumbnail-box {
        width: 33.333%;
    }
    h2.welcometitle {
        font-size: 30px !important;
    }
    #Grid .mix strong {
        top: 30% !important;
    }
}
@media screen and (max-width: 1169px) and (min-width: 1024px) {
    .container {
        width: auto;
        padding: 0 20px;
    }
    .content-area {
        width: auto;
        padding: 20px;
    }
    .header_right {
        width: 75%;
    }
    .wrap_one .welcome-thumb {
        height: 330px;
    }
    .wrap_one .welcome-thumb img {
        min-height: 330px;
    }
    .nivo-caption {
        width: 37.5% !important;
    }
    .logo {
        float: left;
        margin: 0;
    }
    .teammember-list {
        width: 25%;
        height: 300px;
    }
    .teammember-list img {
        min-height: 300px;
    }
    .team-thumb-icons {
        height: 200px;
    }
    .team-thumb-icons img {
        min-height: 200px;
    }
    .one_four_page {
        width: 24.8%;
        height: 180px;
    }
    .sitenav ul li a {
        padding-left: 25px;
    }
    .nivo-caption {
        width: 60% !important;
        bottom: 20%;
    }
    #photo-gallery .container,
    #teamsection .container {
        width: 100%;
        padding: 0;
    }
    #Grid .mix {
        height: 280px !important;
    }
    #Grid .mix img {
        min-height: 280px !important;
    }
    .news-box {
        width: 31.30%;
    }
    .servicesbox {
        margin-right: 60px;
    }
    .cols-3 .widget-column-1,
    .cols-3 .widget-column-2 {
        margin-right: 49px;
    }
    .site-main {
        width: 65%;
    }
    #sidebar {
        width: 30%;
    }
    .ngg-gallery-thumbnail-box {
        width: 25%;
    }
    #Grid .mix strong {
        top: 35% !important;
    }
}

@media screen and (max-width: 980px) and (min-width: 980px) {
    .toggleMenu {
        display: none !important;
    }
    .sitenav {
        display: block !important
    }
}
@media screen and (max-width: 1023px) {
    section {
        padding: 40px 0;
    }
    .sitenav {
        float: none;
        margin: 0;
        top: 0;
        position: relative;
        overflow-x: hidden;
    }
    .sitenav ul {
        color: #000;
        width: 100% !important;
        float: none !important;
        margin: 0;
        padding: 0;
    }
    .sitenav ul li {
        border-top: 1px #cccccc solid !important;
        display: block;
        float: none;
        text-align: left;
        border-right: none;
    }
    .sitenav ul li a {
        padding: 5px 10px !important;
        display: block;
        color: #000;
        text-align: left;
    }
    .sitenav ul li a:hover {
        color: #ffffff;
    }
    .sitenav ul li ul,
    .sitenav ul li ul ul {
        display: block !important;
    }
    .sitenav ul li ul li a:before {
        content: "\00BB \00a0";
    }
    .sitenav ul li ul li {
        border-bottom: 0;
    }
    .sitenav ul li ul li a {
        padding-left: 20px !important;
    }
    .sitenav ul li ul li ul li a {
        padding-left: 30px !important;
    }
    .sitenav ul li ul li ul li ul li a {
        padding-left: 40px !important;
    }
    .sitenav ul li:hover > ul {
        background: none !important;
    }
    .sitenav ul li:hover > ul {
        background: transparent !important;
        width: auto !important;
        display: block;
        position: relative !important;
        left: 0;
        right: 0;
        top: 0;
    }
    .sitenav ul li:hover ul li ul, .sitenav ul li:hover ul li:hover > ul, .sitenav ul li:hover ul li:hover > ul li ul {
        background: transparent !important;
        display: block;
        position: relative !important;
        right: 0;
        left: 0;
        top: 0;
    }
    .sitenav ul li:hover ul li:hover ul, .sitenav ul li:hover ul li:hover ul li:hover ul {
        left: 0 !important;
    }
}