/*==================================
         RESPONSIVE WEBSITE
====================================*/
@media only screen and (min-width : 1920px) {/* to 1366px */
    section.siteBanner .banerBg .overlay {
        height: 900px;
    }
}
@media only screen and (max-width : 1400px) {/* to 1366px */
    section.siteBanner .banerBg .overlay {
        height: 750px;
    }
}
@media only screen and (max-width : 1365px) { /* to 1024 */
    section.workSteps .stpRow .stepsBox {
        width: 328px;
        margin: 30px auto;
    }
    div.stpRow .stepsBox .stepsBg {
        width: 100%;
        height: 270px;
    }
    section.workSteps .stpRow .stepsBox .circledashed {
        width: 230px;
        height: 230px;
        padding: 15px;
        margin-right: 60px;
    }
    section.workSteps .stpRow .stepsBox:last-of-type .stepsBg {
        width: 100%;
        height: 280px;
    }
    section.workSteps .stpRow .stepsBox:last-of-type .circledashed {
        width: 230px;
        height: 230px;
        padding: 15px;
    }
    div.stpRow .stepsBox .stepsBg .snNumber {
        line-height: 60px;
        top: 0px;
    }
    section.workSteps .stpRow {
        display: block;
        padding-top: 0;
    }
    footer#siteFooter {
        padding: 80px 0 0px;
    }
    footer#siteFooter .col-3 {
        max-width: 50%;
        flex: 0 0 50%;
        margin-bottom: 60px;
    }
    div.abtApp_Row .appDisplay .imagebg {
        margin-left: 0;
        right: 0;
    }
    header#siteHeader .navigation ul.ruby-menu > li {
        margin: 0 4px;
    }
    section.workSteps .stpRow .stepsBox:last-of-type {
        width: 280px;
    }
    section.aboutApp .abtApp_Row .abtInfo {
        width: 100%;
        margin-top: 30px;
    }
    section.aboutApp .abtApp_Row .appDisplay {
        width: 30%;
        margin: 0 auto;
    }
    div.abtVision .cloumnRow .left .image.bottom{
        margin-top: 0;
    }
    div.appFeatures .rowLeft .left .imageBox {
        width: 80px;
        height: 80px;
        justify-content: center;
        align-items: center;
        top: 0;
    }
    div.appFeatures .rowLeft .left .imageBox span {
        font-size: 40px;
    }
    div.appFeatures .rowRight .left .imageBox span {
        font-size: 40px;
    }
    div.appFeatures .rowRight .left .image {
        margin-left: 0;
    }
    div.appFeatures .rowRight .left .imageBox {
        width: 80px;
        height: 80px;
        right: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        top: 0;
    }
    div.appFeatures .mapRow .mapAmerg {
        margin-top: 0;
    }
}
@media only screen and (max-width : 1023px) { /* to 980 */
}
@media only screen and (max-width : 979px) { /* to 800 */
    div.navigation .search_And_demo form {
        margin-right: 10px;
        border-radius: 3px;
    }
    .siteButton {
        padding: 8px 15px;
        border-radius: 3px;
        font-size: 14px;
    }
    header#siteHeader .navigation ul.ruby-menu > li {
        margin: 0;
    }
    header#siteHeader .navigation ul.ruby-menu > li > a {
        padding: 8px 5px;
    }
    div.navigation .search_And_demo form input[type="search"] {
        text-indent: 10px;
        width: 156px;
        font-size: 14px;
    }
    section.siteBanner .banerBg .overlay {
        height: 600px;
    }
    section.homeAbout .aboutRow .textBox {
        width: 100%;
        position: relative;
        top: 0;
        margin-top: 15px;
    }
    section.homeAbout .aboutRow .aboutImage {
        width: 100%;
        height: 400px;
    }
    section.industryService .indusSlides .indusBox {
        width: 49%;
        margin-bottom: 15px;
    }
    section.ourServices .srvRow .servcBox {
        width: 50%;
    }
    section.ourServices .srvRow {
        display: flex;
        flex-wrap: wrap;
    }
    div.abtApp_Row .appDisplay .overlay {
        display: none;
    }
    section.aboutApp .abtApp_Row {
        display: flex;
        flex-flow: column-reverse;
    }
    div.banerBg .overlay .boxText h2 {
        font-size: 40px;
    }
    section.homeAbout {
        padding: 60px 0;
    }
    section.industryService .indusSlides {
        flex-wrap: wrap;
    }
    div.siteHeading h2 {
        font-size: 22px;
    }
    div.siteHeading h3 {
        font-size: 24px;
    }
    section.ourServices {
        margin: 60px 0;
        padding: 60px 0;
    }
    section.homeAbout.pageAbout {
        padding: 20px 0 80px !important;
    }
    section.aboutQuote .bgImage .quoteBox {
        width: 100%;
    }
    div.abtVision .cloumnRow {
        display: flex;
        flex-wrap: wrap;
    }
    div.abtVision .cloumnRow .left {
        width: 100%;
    }
    div.abtVision .cloumnRow .right {
        width: 100%;
    }
    div.cloumnRow .right .infoText.top {
        padding-top: 0;
    }
    div.abtVision .cloumnRow.bottomRow {
        flex-flow: column-reverse;
    }
    div.cloumnRow .right .infoText.top {
        padding: 0px 30px;
    }
    div.appFeatures .rowLeft .left .image {
        margin-left: 0;
    }
    div.appFeatures .rowLeft .left .imageBox {
        padding: 0;
        z-index: 123;
        right: 0;
    }
    div.appFeatures .rowRight .left .imageBox {
        padding: 0;
        z-index: 123;
    }
    div.appFeatures .right .text h2 {
        font-size: 24px;
        margin-bottom: 10px;
    }
    div.appFeatures .right .text p {
        font-size: 16px;
        margin-bottom: 15px;
    }
    div.appFeatures .emrRow .text {
        margin-top: 60px;
    }
    div.appFeatures .emrRow .text h2 {
        margin-bottom: 10px;
        font-size: 24px;
    }
    div.appFeatures .mapRow .text h2 {
        margin-bottom: 10px;
        font-size: 24px;
    }
    div.adventure .featureLists h2 {
        font-size: 24px;
    }
    section.homeAbout.contactSec {
        padding: 0;
    }
    
}
@media only screen and (max-width : 799px) { /* to 768 */
    header#siteHeader .navigation .resMenu {
        width: calc(100% - 30px);
        display: block;
        position: absolute;
        top: 102px;
        border-top: 1px solid #fff;
        background: #e42022;
        padding: 10px 10px 25px;
        display: none;
    }
    div.toggleMenu {
        display: block;
    }
    header#siteHeader .navigation {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }
    div.ruby-wrapper > ul {
        display: block;
    }
    header#siteHeader .navigation ul.ruby-menu > li {
        float: none;
    }
    header#siteHeader .navigation ul.ruby-menu > li > a {
        color: #fff;
    }
    header#siteHeader .navigation ul.ruby-menu > li > a:hover {
        color: #000;
    }
    div.navigation .search_And_demo form {
        width: 100%;
    }
    div.navigation .search_And_demo form .formGroup {
        display: flex;
    }
    div.navigation .search_And_demo form input[type="search"] {
        width: 100%;
    }
    header#siteHeader .navigation .mybtn {
        display: flex;
        align-items: center;
    }
    div.toggleMenu {
        display: block;
        margin-right: 18px;
        font-size: 42px;
        margin-top: 3px;
        cursor: pointer;
        color: #ed1c24;
    }
    div.navigation .search_And_demo form input[type="search"]::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
        color: #fff;
        opacity: 1; /* Firefox */
      }

    div.navigation .search_And_demo form input[type="search"]:-ms-input-placeholder { /* Internet Explorer 10-11 */
        color: #fff;
    }

    div.navigation .search_And_demo form input[type="search"]::-ms-input-placeholder { /* Microsoft Edge */
        color: #fff;
    }
    
    
}
@media only screen and (max-width : 767px) { /* to 600 */
    div.banerBg .overlay .text {
        max-width: 100%;
        margin-top: 60px;
    }
    div.banerBg .overlay .boxText {
        padding: 25px 15px;
        margin: 15px;
        border: 15px solid #e8e8e8;
    }
    div.banerBg .overlay .boxText h2 {
        font-size: 28px;
    }
    section.industryService .indusSlides .indusBox {
        width: 100%;
        margin-bottom: 15px;
        
    }
    footer#siteFooter .col-3 {
        max-width: 100%;
        flex: 0 0 100%;
        margin-bottom: 60px;
    }
    div.cloumnRow .right .infoText.bottom {
        padding: 0px 20px;
    }
    div.appFeatures .mapRow .row {
        flex-flow: column-reverse;
    }
    div.adventure {
        background: linear-gradient(to top,#484d53 50%,#e42022 50%);
        margin-top: 60px;
    }
}
@media only screen and (max-width : 599px) { /* to 480 */
    section.ourServices .srvRow .servcBox {
        width: 100%;
    }
    section.aboutApp .abtApp_Row .appDisplay {
        width: 300px;
    }
    section.aboutQuote .bgImage .quoteBox .content p {
        font-size: 20px;
        line-height: 1.5em;
    }
    section.aboutQuote .bgImage .quoteBox {
        width: 100%;
        display: flex;
        align-items: center;
        text-align: center;
    }
    div.cloumnRow .right .infoText h2 {
        font-size: 24px;
    }
    div.appFeatures .siteHeading {
        padding-bottom: 40px;
    }
    div.appFeatures .rowLeft {
        flex-wrap: wrap;
    }
    div.appFeatures .rowLeft .left {
        width: 250px;
        margin: 0 auto;
        padding-bottom: 25px;
        display: flex;
        justify-content: center;
    }
    div.appFeatures .rowLeft .right {
        width: 100%;
    }
    div.appFeatures .rowRight {
        flex-flow: column-reverse;
    }
    div.appFeatures .rowRight .right {
        width: 100%;
    }
    div.appFeatures .rowRight .left {
        width: 100%;
    }
    div.appFeatures .rowRight .left {
        width: 250px;
        padding-bottom: 25px;
    }
    div.appFeatures .right .text {
        text-align: center;
    }
    div.appFeatures .rowLeft .left .imageBox {
        padding: 0;
        z-index: 123;
        right: 0;
        position: absolute;
        left: -18px;
    }
    div.appFeatures .rowRight .left {
        width: 250px;
        padding-bottom: 25px;
        display: flex;
        justify-content: center;
    }
    div.appFeatures .rowRight .left .imageBox {
        width: 80px;
        height: 80px;
        right: -32px;
        display: flex;
        align-items: center;
        justify-content: center;
        top: -10px;
    }
    div.appFeatures .right .text {
        text-align: center;
        margin-bottom: 25px;
    }
    div.appFeatures .emrRow .text {
        margin-top: 0;
        margin-bottom: 35px;
    }
    div.appFeatures .right .text h2 {
        font-size: 20px;
        margin-bottom: 0;
    }
    div.appFeatures .emrRow .text h2 {
        margin-bottom: 0;
        font-size: 20px;
    }
    div.appFeatures .mapRow .text h2 {
        margin-bottom: 0;
        font-size: 20px;
    }
    div.adventure .featureLists h2 {
        font-size: 20px;
    }
    div.adventure .lists ul li h3 {
        font-size: 18px;
        margin: 12px 0 2px;
    }
    div.siteHeading h3 {
        font-size: 20px;
    }
    section.homeAbout.contactSec .aboutRow .aboutImage {
        height: 350px;
    }
}
@media only screen and (max-width : 479px) { /* to 375 */ 
    div.banerBg .overlay .boxText {
        padding: 20px 10px;
        margin: 15px;
        border: 10px solid #e8e8e8;
    }
    div.banerBg .overlay .boxText h2 {
        font-size: 18px;
    }
    div.banerBg .overlay .boxText p {
        margin: 10px 0;
        font-size: 14px;
        line-height: 1.3em;
    }
    div.siteHeading h2 {
        font-size: 18px;
    }
    section.homeAbout .aboutRow .textBox .content p {
        margin-bottom: 10px;
        font-size: 14px;
        line-height: 1.3em;
        text-align: justify;
    }
    div.srvRow .servcBox .text h3 {
        font-size: 16px;
        margin: 2px 0;
    }
    div.stepsBox .circledashed .text span {
        font-size: 15px;
        line-height: 1.3em;
        margin-bottom: 10px;
    }
    section.workSteps {
        margin-bottom: 40px;
    }
    section.ourServices {
        margin: 40px 0;
        padding: 40px 0;
    }
    section.aboutApp {
        padding: 40px 0;
    }
    div.abtApp_Row .abtInfo .appList ul li h3 {
        font-size: 15px;
    }
    footer#siteFooter .ftrWidget h3 {
        font-size: 22px;
        padding-bottom: 10px;
    }
    section.homeAbout .aboutRow .aboutImage {
        height: 300px;
    }
    section.aboutQuote .bgImage .quoteBox {
        height: 400px;
    }
    div.abtVision {
        padding: 40px 0 0px;
    }
    div.cloumnRow .right .infoText h2 {
        font-size: 24px;
        font-family: 'poppinsbold';
    }
    div.cloumnRow .right .infoText.bottom {
        padding: 0;
    }
    div.cloumnRow .right .infoText.top {
        padding: 0;
    }
    section.homeAbout.pageAbout {
        padding: 0px 0 60px !important;
    }
    section.aboutQuote .bgImage .quoteBox {
        padding: 60px 40px;
    }
    div.newsLatter {
        padding: 40px 0;
    }
    footer#siteFooter {
        padding: 60px 0 0;
    }
    footer#siteFooter .col-3 {
        margin-bottom: 40px;
    }
    div.appFeatures .right .text p {
        font-size: 14px;
    }
    div.pageContent .emrRow .text p {
        font-size: 14px;
    }
    div.pageContent .mapRow .text p {
        font-size: 14px;
    }
    div.adventure .featureLists p {
        font-size: 14px;
    }
    div.adventure .featureLists {
        padding: 40px 0px;
    }
    div.searchWrap .serch_result .serch_content h2 {
        font-size: 20px;
    }
    div.searchWrap .serch_result .serch_content p {
        font-size: 14px;
    }
    div.searchWrap .serch_result {
        padding: 15px 0;
    }
}
@media only screen and (max-width : 374px) { /* to 360 */
    header#siteHeader .navigation .logo {
        width: 100px;
    }
    section.workSteps .stpRow .stepsBox {
        width: 290px;
        margin: 25px auto;
    }
    div.stpRow .stepsBox .stepsBg {
        width: 100%;
        height: 238px;
    }
    section.workSteps .stpRow .stepsBox .circledashed {
        width: 210px;
        height: 210px;
        padding: 15px;
        margin-right: 50px;
    }
    div.stpRow .stepsBox .stepsBg .snNumber {
        margin-right: 25px;
    }
    section.workSteps .stpRow .stepsBox:last-of-type {
        width: 260px;
    }
    section.workSteps .stpRow .stepsBox:last-of-type .stepsBg {
        width: 100%;
        height: 258px;
    }
}
@media only screen and (max-width : 359px) { /* to 320 */
    footer#siteFooter .ftrWidget h3 {
        font-size: 20px;
    }
}