
/* Below media queries are for extralarge monitor and extralarge screen devices.*/
@media screen and (min-width: 992px) {
  button.sub-menu-toggle {display: none;}
  .menu-back,.menu > li > .toggle-submenu {display: none;}
  .navigation-open,.navigation-close {display: none;}
  .main_menu .menu {display: flex;list-style: none;}
  .main_menu .menu li {position: relative;}
  .main_menu .menu li:last-child {margin-right: 0;}
  .main_menu .menu li {position: relative;}
  .sub-menu {background-color: #fff;display: none;position: absolute;top: 90%;left: 0;z-index: 9;border-radius: 0;}
  .menu li:hover .sub-menu {display: flex;flex-direction: column;width: 100%;width: 310px !important; padding: 0;left: 0;}
  .sub-menu li {position: relative;}
  .sub-menu > li {margin: 0px !important;}
  .sub-menu > li {flex: 0 0 50%;}
  .sub-menu li > a {color: var(--fontblack);display: flex;padding: 5px 15px;align-items: center;border: 1px solid rgba(0, 0, 0, 0.2);width: 100%;border-bottom: 0;}
  .sub-menu li > a:hover {background-color: #fd2c2c;color: #fff !important;text-decoration: none;}
  .menu li > a:hover {color: var(--white);text-decoration: none;}
  .sub-menu > li:first-child {display: none;}
  .sub-menu > a {display: none !important;}
  .second-sub_menu {display: none !important;}
  .sub-menu > li:hover .second-sub_menu {display: block !important;left: 100%;top: 0;}
  .sub-menu .has-sub .icon-submenu {right: 26px;}
  .sub-menu .has-sub:hover .icon-submenu::before {color: #fff;}
  .icon-submenu::before {color: var(--white);}
  ul.sub-menu li.has-sub .icon-submenu::before {color: var(--black);}
}

@media screen and (min-width: 3200px){}

@media screen and (max-width: 31600px) and (min-width: 2373px){}

@media screen and (max-width: 2375px) and (min-width: 2110px){}

@media screen and (max-width: 2109px) and (min-width:1978px){}

@media screen and (max-width: 1978px) and (min-width:1758px){}

@media screen and (max-width: 1268px) and (min-width: 1522px){}

@media screen and (max-width: 1350px) and (min-width: 991px){}

@media screen and (max-width: 1236px){
	.main-menu img {width: 223px;}
.about-detils {width: 100%;margin-left: 0;}
.about-detils h2{font-size: 22px;}
.about-box{padding-top: 15px;}
.about-box .lern-btn{margin-top: 20px;}

.lern-btn a {font-size: 22px;padding: 11.5px 50.5px;}
.tabs ul.tabs-nav{float: left;width: 100%;}
.copy p {font-size: 13px;}

}

@media screen and (max-width: 1199px) and (min-width: 992px){
    .logo_header a img {max-width: 220px;}
  
    .call-detils ul span {height: 40px;width: 40px;}
    .menu li a {font-size: 20px;}

    
    section.search-result-data h1.page-title {font-size: 42px;}
    section.search-result-data ul li a {font-size: 23px;}
}

@media screen and (max-width: 991px) {
    #portfoliopage #tabb .tab-content ul li .cus-hover-icn {
    height: 261px;
}
    .page-portfolio #tabb .tab-content ul li span{height:260px;}
    .alert-info p {
    font-size: 24px !important;
    line-height: 31px;
}
    section.search-result-data h2 {
    font-size: 35px;;
}
    #portfoliopage #tabb .tab-content ul li span img {

    height: 100% !important;
}
.page-portfolio #tabb .tab-content ul li {
    width: 50%;
}
    .page-id-119 div#portfoliopage ,.page-id-9 div#portfoliopage {
    margin-top: 70px;
}
  button.sub-menu-toggle {
    display: none;
  }

  .navigation-open {
    padding: 0;
    position: relative;
    vertical-align: middle;
    z-index: 1;
    width: 30px;
    height: 19px;
    background: none;
    border: none;
    width: 50px;
    height: 50px;
    background: var(--lightpurple);
  }

  .navigation-open span {
    display: block;
    width: 24px;
    height: 3px;
    background: #fff;
    margin: 0 auto;
    position: relative;
    pointer-events: none;
    -moz-transition: all 0s ease 0.25s;
    -ms-transition: all 0s ease 0.25s;
    -o-transition: all 0s ease 0.25s;
    -o-transition: all 0s ease 0.25s;
    -webkit-transition: all 0s ease 0.25s;
    transition: all 0s ease 0.25s;
  }

  .navigation-open span:before,
  .navigation-open span:after {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background: #fff;
    position: absolute;
    left: 0;
    top: -7px;
    -moz-transition: top 0.25s ease 0.25s, transform 0.25s ease,
      background 0.25s ease 0.25s;
    -ms-transition: top 0.25s ease 0.25s, transform 0.25s ease,
      background 0.25s ease 0.25s;
    -o-transition: top 0.25s ease 0.25s, transform 0.25s ease,
      background 0.25s ease 0.25s;
    -webkit-transition: top 0.25s ease 0.25s, transform 0.25s ease,
      background 0.25s ease 0.25s;
    transition: top 0.25s ease 0.25s, transform 0.25s ease,
      background 0.25s ease 0.25s;
  }

  .navigation-open span:after {
    top: 7px;
    -moz-transition: top 0.25s ease 0.25s, transform 0.25s ease,
      background 0.25s ease 0.25s;
    -ms-transition: top 0.25s ease 0.25s, transform 0.25s ease,
      background 0.25s ease 0.25s;
    -o-transition: top 0.25s ease 0.25s, transform 0.25s ease,
      background 0.25s ease 0.25s;
    -webkit-transition: top 0.25s ease 0.25s, transform 0.25s ease,
      background 0.25s ease 0.25s;
    transition: top 0.25s ease 0.25s, transform 0.25s ease,
      background 0.25s ease 0.25s;
  }

  .navigation ul {
    padding: 0;
    list-style-type: none;
    margin: 0;
  }

  .navigation ul.menu {
    font-size: 16px;
    font-weight: 500;
    z-index: 6;
    text-align: left;
    width: 100%;
    flex-direction: column;
  }

  .navigation {
    z-index: 999;
    position: fixed;
    top: 0;
    left: 100%;
    width: 520px;
    height: 100%;
    overflow: auto;
    background: #000;
    -webkit-overflow-scrolling: touch;
    display: block !important;
    transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
    padding: 70px 0;
  }

  .menu-back {
    border: none;
    width: 100%;
    height: 40px;
    background: none;
    color: #fff;
    font-size: 24px;
    font-weight: 500;
    padding: 0;
    font-family: inherit;
    text-align: left;
    background-color: transparent;
    width: fit-content;
    padding: 0.5rem 0;
    height: auto;
    display: none;
  }

  .menu-back:before {
    content: "\f106";
    font-family: "FontAwesome";
    color: var(--highlights);
    font-size: 24px;
    display: inline-block;
    vertical-align: middle;
    margin: -5px 8px 0 0;
  }

  .theme-header:after {
    content: "";
    display: block;
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    height: 100%;
    background: rgba(0, 0, 0, 0.7);
    z-index: 9;
    cursor: pointer;
    transform: translateX(100%);
    -moz-transform: translateX(100%);
    -ms-transform: translateX(100%);
    -o-transform: translateX(100%);
    -webkit-transform: translateX(100%);
    transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
  }

  body.menu-action .theme-header:after {
    transform: none;
    -moz-transform: none;
    -ms-transform: none;
    -o-transform: none;
    -webkit-transform: none;
  }

  body.menu-action .navigation {
    margin-left: -520px;
  }

  body.menu-action {
    position: fixed;
    top: 0;
    left: 0;
    height: 100vh !important;
    width: 100%;
    overflow: hidden;
    max-height: 100vh !important;
  }
  .navigation ul.menu li {
    position: relative;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    padding: 0;
    margin-right: 0;
  }

  .navigation ul.menu li:last-child {
    border-bottom: none;
  }

  .navigation ul.menu li:before {
    display: none;
  }

  .navigation ul.menu > li {
    width: 100%;
    margin: 0 !important;
    padding: 0;
  }

  .navigation ul.menu > li:before {
    display: none;
  }

  .navigation ul.menu li a {
    padding: 15px 30px;
    color: #fff;
    font-weight: 400;
    display: block;
    letter-spacing: 1px;
    text-align: left;
    border: none;
    font-size: 22px;
  }

  .toggle-submenu {
    display: block;
    position: absolute;
    right: 0;
    top: 0px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 60px;
    height: 60px;
    background-color: transparent;
  }

  .toggle-submenu:before,
  .toggle-submenu:after {
    content: "\f107";
    font-family: "FontAwesome";
    color: var(--white);
    font-size: 24px;
    position: absolute;
    right: 24px;
    top: 0px;
    margin: 0 0 0 0;
    background-size: cover;
  }

  .toggle-submenu:after {
    opacity: 0;
  }

  .navigation ul.menu li.selected > a {
    color: #151515;
  }

  .navigation ul.menu li.selected > .toggle-submenu:after {
    opacity: 1;
  }

  .navigation ul.menu li ul {
    background: #262525;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
    transition: all 0.5s ease;
    width: 100%;
    overflow: scroll;
    -webkit-overflow-scrolling: touch;
    padding: 0;
    position: unset;
    display: none;
  }
  .second-sub_menu {
    background:#183268 !important;
  }
  .icon-submenu {
    display: none !important;
  }
  .navigation ul.menu li ul.show {
    margin-right: 0;
    display: block;
  }

  span.toggle-submenu.open::before {
    content: "\f106";
  }
  .navigation ul.menu li .device-toggle {
    position: absolute;
    width: 39px;
    height: 39px;
    left: 0;
    top: 0;
    cursor: pointer;
  }

  .navigation ul.menu li .device-toggle:before,
  .navigation ul.menu li .device-toggle:after {
    content: "";
    display: block;
    height: 3px;
    width: 15px;
    position: absolute;
    left: 12px;
    top: 18px;
    background: #333;
  }

  .navigation ul.menu li .device-toggle:after {
    width: 3px;
    height: 15px;
    top: 12px;
    left: 18px;
  }

  .navigation ul.menu li.selected > .device-toggle:before,
  .navigation ul.menu li.selected > .device-toggle:after {
    background: #660460;
  }

  .navigation ul.menu li .device-toggle.in:after {
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
  }

  .navigation ul.menu .sub-menu .inner-sub li > a {
    padding-left: 55px;
  }

  .navigation ul.menu li .inner-sub .device-toggle {
    left: 0;
  }

  .navigation ul.menu.no-sub li a {
    padding-left: 15px;
  }

  .megamenu_img {
    display: none;
  }

  .navigation ul.menu li.has-sub.megamenu .sub-menu {
    display: block !important;
  }

  .navigation ul.menu li.has-sub .mega_menu {
    display: none;
  }

  .navigation-open:before {
    opacity: 1;
    -moz-transition: opacity 0.5s ease;
    -ms-transition: opacity 0.5s ease;
    -o-transition: opacity 0.5s ease;
    -webkit-transition: opacity 0.5s ease;
    transition: opacity 0.5s ease;
  }

  body.menu-action .navigation-open:before {
    opacity: 0;
  }

  .navigation ul.menu li .device-toggle {
    position: absolute;
    width: 26px;
    height: 30px;
    left: 0;
    top: 0;
    cursor: pointer;
  }

  .navigation ul.menu li .device-toggle:before,
  .navigation ul.menu li .device-toggle:after {
    content: "";
    display: block;
    height: 2px;
    width: 12px;
    position: absolute;
    left: 7px;
    top: 14px;
    background: #606060;
  }

  .navigation ul.menu li .device-toggle:after {
    width: 2px;
    height: 12px;
    left: 12px;
    top: 9px;
  }

  .navigation ul.menu .sub-menu .inner-sub li > a {
    padding-left: 44px;
  }

  .navigation-close {
    padding: 0;
    position: absolute;
    right: 15px;
    top: 15px;
    vertical-align: middle;
    z-index: 11;
    width: 20px;
    height: 17px;
    background: none;
    border: none;
  }

  .navigation-close:before,
  .navigation-close:after {
    content: "";
    display: block;
    width: 100%;
    height: 2px;
    background: #fff;
    position: absolute;
    left: 0;
    top: 50%;
    margin-top: -2px;
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
  }

  .navigation-close:after {
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
  }

  body.menu-action header:after {
    transform: none;
    -moz-transform: none;
    -ms-transform: none;
    -o-transform: none;
    -webkit-transform: none;
  }

  .navigation ul.menu li > a span.menu_count {
    color: #0070b2;
    margin-right: 10px;
  }

  .navigation-open span {
    display: block;
    width: 25px;
    height: 3px;
    background: var(--white);
    margin: 0 auto;
    position: relative;
    pointer-events: none;
    -moz-transition: all 0s ease 0.25s;
    -ms-transition: all 0s ease 0.25s;
    -o-transition: all 0s ease 0.25s;
    -o-transition: all 0s ease 0.25s;
    -webkit-transition: all 0s ease 0.25s;
    transition: all 0s ease 0.25s;
  }

  .navigation-open span:before,
  .navigation-open span:after {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background: var(--white);
    position: absolute;
    left: 0;
    top: -7px;
    -moz-transition: top 0.25s ease 0.25s, transform 0.25s ease,
      background 0.25s ease 0.25s;
    -ms-transition: top 0.25s ease 0.25s, transform 0.25s ease,
      background 0.25s ease 0.25s;
    -o-transition: top 0.25s ease 0.25s, transform 0.25s ease,
      background 0.25s ease 0.25s;
    -webkit-transition: top 0.25s ease 0.25s, transform 0.25s ease,
      background 0.25s ease 0.25s;
    transition: top 0.25s ease 0.25s, transform 0.25s ease,
      background 0.25s ease 0.25s;
  }

  .navigation-open span:after {
    top: 7px;
    -moz-transition: top 0.25s ease 0.25s, transform 0.25s ease,
      background 0.25s ease 0.25s;
    -ms-transition: top 0.25s ease 0.25s, transform 0.25s ease,
      background 0.25s ease 0.25s;
    -o-transition: top 0.25s ease 0.25s, transform 0.25s ease,
      background 0.25s ease 0.25s;
    -webkit-transition: top 0.25s ease 0.25s, transform 0.25s ease,
      background 0.25s ease 0.25s;
    transition: top 0.25s ease 0.25s, transform 0.25s ease,
      background 0.25s ease 0.25s;
  }

.navigation-open {
    padding: 1px;
    position: relative;
    vertical-align: middle;
    z-index: 1;
    width: 44px;
    height: 40px;
    border-radius: 2px;
    background: #fd2c2c;
    border: 2px solid #fd2c2c;
    color: #fff;
}
}

@media screen and (max-width: 991px) {
    
    .main_menu {position: absolute;right: 0;}
    
.call-detils ul li:nth-child(2) {display: none;}
.call-detils {margin-right: 60px;}

.inner-about-contenet p {font-size: 22px;line-height: 25px;}
section.inner-about-detils {margin: 70px 0px;}

section.contact {padding: 70px 0;}

section.search-result-data h1.page-title {margin-bottom: 15px;font-size: 32px;}
section.search-result-data ul li a {font-size: 21px;}
section#inner-page ul li, p {font-size: 21px;}

.about-img img{height: 400px}
.about-box{padding-bottom: 25px;padding-top: 25px;}
section.tab,.tabs-stage,.lern-btn,.building,.service,.service-box{margin-top: 50px;}

.building-top p{font-size: 25px;}
.title h3,.service-tittle h3,.tab-from label,.inner-about-contenet h3,.error404 h1,.search h1{font-size: 35px;}
.service-box h3{font-size: 30px;margin-top: 20px;}
.ready-content{padding: 120px 0px;}
.ready-txt h3{font-size:35px;}
.make-btn a{font-size: 22px;}
.footer-menu ul a {font-size: 20px;padding-right: 10px !important;}

.copy{margin-top: 30px;padding-top: 30px;}
/*.tab-img img{max-height: 400px;}*/
.service-tittle p{width: 100%;font-size: 18px}
.footer-call ul a {font-size: 20px;word-spacing: -3px;}
.footer-call ul span a {font-size: 20px !important;}
.footer-call ul span {height: 40px;width: 40px;}
.paginations {margin: 50px 0px;}
.about-detils p{font-size:18px;}
}

@media screen and (max-width: 767px){
    .page-portfolio #tabb .tab-content ul li{margin-bottom:15px;}
    .page-id-119 div#portfoliopage,.page-id-9 div#portfoliopage  {
    margin-top:50px;
}
    .copy p{text-align: center;}
    .ready-content {
    padding: 70px 0px;
}
    .make-btn a {
    font-size: 17px;
}
    .navigation ul.menu li a {padding: 15px 20px;font-size: 20px;}
    .call-detils ul span {height: 40px;width: 40px;}
    .logo_header a img {max-width: 220px;}
    
	.inner-about-contenet p {margin-top: 7px;font-size: 18px;line-height: 24px;letter-spacing: 0px;}
	section.search-result a{font-size: 18px;padding: 15px;}
	section.search-result-data p{font-size: 25px;}
	section.search-result,section#inner-page,section.search-result-data  {margin: 25px 0px;}
	#inner-page h2,section.search-result h1.page-title{font-size: 30px;}
	.detils-about-bnner {
    display: flex;
    flex-direction: column-reverse;
}
section.tab .row {
    row-gap: 20px;
}
.tab-from input[type="submit"] {font-size: 20px;padding: 10.5px 47.5px;}
.tab-from textarea { height: 100px; }
.tab-from input, .tab-from textarea{margin-bottom: 20px;}
.paving-img{width: 100%;padding-right: 0px;margin-top: 30px;}
section.inner-about-detils {margin: 50px 0px;}
.inner-about-contenet {margin-top: 20px;float: left;width: 100%;}
.inner-about-contenet span {font-size: 20px;line-height: 26px;}
section.tab,.service{margin-top: 50px;margin-bottom: 50px;}
.service-box p{width: 100%;}
.service-box h3 br{display: none;}
.about-detils h3,.service-tittle h3,.inner-about-contenet h3,.error404 h1,.search h1{font-size: 25px;}
.about-detils h2 {font-size: 18px;}
.title h3 {font-size:30px;}
.lern-btn a {font-size: 18px;padding: 9.5px 44.5px;}

.building-top p {font-size: 20px;}
.tab-from label{font-size: 20px;}
.tabs-nav a{font-size: 17px;}

.footer-social ul {justify-content: center;margin-top: 20px;}
.footer-call,.footer-menu{margin-top: 30px;}
.service-box h3{font-size: 20px;}
.service-box p{font-size: 18px;}
.service-box .lern-btn a {font-size: 18px;    padding: 8px 24px;}
.ready-txt h3 {font-size: 27px;}
.make-btn {margin-top: 25px;}
.paginations ul a {height: 40px;width: 40px;font-size: 20px;}
.paginations,.tab-from {margin: 30px 0px;}
} 

@media screen and (max-width: 570px) {
    .navigation {width: 330px;}
    body.menu-action .navigation {margin-left: -330px;}
    .navigation ul.menu li a {font-size: 18px;}
    .navigation-open {width: 40px;height: 35px;}
    .call-detils ul li:first-child {margin-right: 0;}
    .call-detils ul span {height: 38px;width: 38px;}
    .call-detils ul span a {font-size: 18px;}
    .logo_header a img {max-width: 200px;}
    section#inner-page ul li, p {font-size: 18px;line-height:25px;}
    section.search-result-data ul li a {font-size: 18px;line-height: 25px;padding: 15px;}
    section.search-result-data ul li {padding: 15px;}
    
    section.search-result-data .search-result-count {font-size: 20px;line-height: 25px;}
    section.search-result-data h1.page-title {font-size: 25px;}
    section.contact {padding: 50px 0;}
  .page-portfolio #tabb .tab-content ul li span {
    height: 400px;
}
#portfoliopage #tabb .tab-content ul li .cus-hover-icn {
    height: 401px;
}
        ul.lflex {
    width: 100%;
    float: left;
    margin: 0px;
    padding: 0px;
}
.page-portfolio #tabb .tab-content ul li {
 
    width: 100%;
     height: unset; 
}

}


@media screen and (max-width: 465px){

.tabs-nav a {font-size: 11px;}
.footer-logo img{width: 100%;}
.footer-menu ul {display: block;}
.footer-menu ul a {padding-right: 0 !important;text-align: center;}
}


@media screen and (max-width: 575px) {
.tab-from img{width: 100%;}
.main-menu img {width: 155px;}

}

@media screen and (max-width: 360px) and (min-width: 0px) {
    .main_menu {bottom: 0;}
    .tabs-nav a{letter-spacing:0px}
    .deskmenu_wrap {flex-direction: column;}
    .call-detils {margin-right: 0;position: relative;right: 125px;}
    .logo_header {margin-bottom: 25px;}
    .tabs-nav a {font-size: 11px;}
    body.menu-action .navigation {margin-left: -300px;}
    .navigation {width: 300px;}
    
}
@media screen and (min-width: 991px) {.about-img img {
   
    height:1120px;
}}

@media screen and (max-width:414px){
    .page-portfolio #tabb .tab-content ul li span {
    height: 300px;
}
#portfoliopage #tabb .tab-content ul li .cus-hover-icn {
    height: 302px;
}
}
