/*
 Theme Name: Idoni
 Theme URI: https://themewar.com/wp/idoni/
 Author: ThemeWar
 Author URI: https://themeforest.net/user/themewar/portfolio
 Description: Idoni – Creative Agency WordPress Theme
 Version: 1.0
 License:
 License URI: 
*/

/*==================================
    [Table of contents]
===================================
    01. max-width: 1699px
    02. min-width: 1366px & max-width: 1599px
    03. min-width: 1366px & max-width: 1399px
    04. min-width: 1200px & max-width: 1399px
    05. max-width: 1365px
    06. min-width: 1200px & max-width: 1365px
    07. min-width: 992px & max-width: 1199px
    08. max-width: 1199px
    09. min-width: 768px & max-width: 991px
    10. max-width: 991px
    11. max-width: 767px
    12. max-width: 575px
    13. min-width: 320px & max-width: 410px
    14. min-width: 320px & max-width: 355px
*/

/*----------------========----------------
/  00. max-width: 1500px
/----------------========----------------*/
@media (max-width: 1750px){
    .bannerMain .bannerIdoni {
        font-size: 500px;
        margin: 18px 0 -260px 39px;
    }
    .banner01Social {
        right: -445px;
        display: block;
    }
    .bannerInner01 .bannerLeft p:nth-child(1):after {
        left: -30px;
    }
    .contactLogo {
        right: -85px;
    }
    .contactText {
        padding: 80px 0 0 147px;
    }
    .testWrap03 .testItem02 {
        padding: 42px 35px 48px 35px;
    }
    .testWrap03 .testItem02 p {
        font-size: 19px;
        line-height: 28px;
        margin: 0 0 30px;
    }
    .header03 .mainMenu {
        padding-left: 73px;
    }
    .svContent {
        padding: 70px 93px 0 0;
    }
    .serviceVideoSec .secTitle {
        margin: 0 0 50px;
    }
    .portfolioCat {
        margin-top: 198px;
    }
    .footerArea02 .footerGallery {
        padding-left: 0;
    }
    .pfSlider01.owl-carousel .owl-stage{
        left: 0;
    }
}
@media(max-width: 1599px) and (min-width: 1400px){
    .header03{
        padding-left: 20px;
        padding-right: 20px;
    }
    .mainMenu > ul > li{
        margin: 0 30px 0 0;
    }
}
/*----------------========----------------
/  02. max-width: 1500px
/----------------========----------------*/
@media (max-width: 1500px){
    .bannerInner01 .bannerMain {
        padding: 140px 0 0 0;
    }
    .bannerMain .bannerIdoni {
        font-size: 350px;
        margin: 18px 0 -200px 15px;
        background-position: 33% 1.5%;
    }
    .banner01Social {
        right: -370px;
        display: block;
    }
    .bannerContent01 {
        padding-left: 15px;
    }
    .mainMenu {
        left: 0;
    }
    .bannerInner01 .bannerLeft p:nth-child(1) {
        top: -30px;
    }
    .loaderAnim h2 {
        font-size: 40px;
        letter-spacing: 0.03em;
    }
    .loaderAnim h2 a {
        margin: 0 20px;
    }
    .peralexLayer .peraLay:nth-child(3) {
        right: -90px;
    }
    .contactText {
        padding: 40px 0 0 147px;
    }
    .contactWrap {
        padding: 60px 0 0 100px;
    }
    .topbar02,
    .header02 {
        padding: 0 30px;
    }
    .svContent {
        padding: 40px 93px 0 0;
    }
}

/*----------------========----------------
/  02. min-width: 1366px & max-width: 1599px
/----------------========----------------*/
@media (min-width: 1365px) and (max-width: 1599px){
   
}

/*----------------========----------------
/  03. min-width: 1366px & max-width: 1399px
/----------------========----------------*/
@media (min-width: 1365px) and (max-width: 1399px){
    .contactWrap {
        padding: 30px 0 0 100px;
    }
    .contactPageSec03 .secTitle {
        color: var(--tw-secondary-color);
        margin: 0 0 35px;
    }
    .serCarItem01 h2{
        font-size: 36px;
    }
}

/*----------------========----------------
/  04. min-width: 1200px & max-width: 1399px
/----------------========----------------*/
@media (min-width: 1200px) and (max-width: 1399px){
    .bannerMain .bannerIdoni {
        font-size: 350px;
        margin: 18px 0 -170px 15px;
        background-position: 33% 1.5%;
    }
    .banner01Social {
        right: -335px !important;
        top: 50px;
    }
    .testimonialCon02 .secTitle{
        font-size: 46px;
        line-height: 56px;
    }
    .portfolioSec04 .folioSliderWrapper {
        padding-right: 60px;
    }
    .pfContentSlide {
        padding: 80px 0px 70px 80px;
    }
    .pfContent01 {
        max-width: 553px;
        min-height: 500px;
    }
    .header03{
        padding-left: 20px;
        padding-right: 20px;
    }
    .mainMenu > ul > li{
        margin: 0 30px 0 0;
    }
    .header03:before {
        width: 30.6%;
    }
   
}

/*----------------========----------------
/  05. max-width: 1365px
/----------------========----------------*/
@media (max-width: 1365px){
    .mainMenu > ul > li {
        margin: 0 35px 0 0;
    }
    .navAccess01 .headLang {
        margin-right: 20px;
    }
    .bannerMain .bannerIdoni {
        font-size: 350px;
        margin: 18px 0 -170px 15px;
        background-position: 33% 1.5%;
        letter-spacing: 50px;
    }
    .abContent01 {
        padding: 0 75px 0 25px;
    }
    .bannerContent01 h2 {
        font-size: 100px;
    }
    .bannerContent01 span {
        font-size: 100px;
    }
    .elementor .bannerContent01 img ,
    .bannerContent01 img {
        margin: 0 20px 0 20px;
    }
    .banner01Social {
        right: -350px;
    }
    .peralexLayer .peraLay:nth-child(3) {
        right: 7px;
    }
    .peralexLayer .peraLay:nth-child(6) {
        left: -20px;
    }
    .testWrap02 {
        padding-left: 0;
    }
    .testWrap03 .testItem02 {
        padding: 30px 30px 30px 30px;
    }
    .faqContent01 {
        padding: 57px 0 0 30px;
    }
    .swipeHvImage .swipeimage {
        left: 60%;
        width: 200px;
        height: 200px;
    }
    .contactLogo {
        right: -85px;
    }
    .conAddress h2 {
        font-size: 40px;
        line-height: 1;
        margin: 0 0 30px;
    }
    .clientLoader01 .loaderAnim02 h2 {
        font-size: 90px;
        letter-spacing: -0.02em;
    }
    .clientLoader01 .loaderAnim02 h2 a {
        padding: 0 30px 0 50px;
    }
    .teamItemsWrap {
        grid-column-gap: 60px;
        grid-row-gap: 60px;
    }
    .blogSection02 .g-5, .gx-5 {
        --bs-gutter-x: inherit;
    }
    .blogSin02 .blogCat {
        margin: 25px 0 5px;
    }
    .serviceWrap03 {
        grid-column-gap: 112px;
    }
    .portfolioSec03 .portSecTitle {
        font-size: 295px;
    }
    .getTouchSection {
        padding: 120px 0 220px;
    }
    .touchLoader h2 {
        font-size: 200px;
        letter-spacing: -0.02em;
    }
    .touchLoader img {
        width: 140px;
        height: 140px;
        left: 225px;
    }
    .abContent02 {
        padding: 49px 110px 0 45px;
    }
    .blog04Item h3 {
        font-size: 35px;
        line-height: 40px;
    }
    .contactText {
        padding: 40px 0 0 147px;
    }
    .contactWrap {
        padding: 60px 0 0 93px;
    }
    .contactPageSec03 .secTitle {
        margin: 0 0 35px;
        line-height: 42px;
    }
    .portGridWrap02 {
        grid-gap: 80px;
    }
    .portGridWrap03 {
        grid-column-gap: 30px;
        grid-row-gap: 50px;
    }
    .header03 {
        padding: 0 24px;
    }
    .serCarItem01 .serviceImg {
        margin: 0;
    }
    .slider01 .tp-captionHead,
    .slider01 .to_circle{
        left: 80px;
    }
    .slider01 .tparrows.tp-rightarrow {
        left: -160px !important;
    }
    .serviceVideoSec {
        padding: 80px 0;
    }
    .serviceDetAbout .abContent02 {
        padding: 46px 0 0 25px;
    }
    .serCarItem01 h2 {
        font-size: 36px;
    }
    .servicePageSec .serPageTitle h2 {
        font-size: 280px;
        margin-bottom: -160px;
    }
    .servicePageSec .serPageTitle {
        top: -185px;
    }
    .serWrap02Item .abIconSingle {
        padding: 40px 30px 20px;
        min-width: auto;
        cursor: inherit;
    }
    .serWrap02Item .abIconSingle h2 {
        font-size: 26px;
        margin: 0 0 15px;
    }
    .serWrapItem {
        grid-column-gap: 137px;
    }
    .serSingle02 h3{
        font-size: 28px;
    }
    .serWrap03Item {
        grid-column-gap: 112px;
    }
    .mrSingle h3 {
        font-size: 28px;
    }
    .processItem p {
        line-height: 18px;
    }
    .tmDesctiption {
        padding: 65px 80px 60px 60px;
    }
    .servicePageSec .serPageTitle.tpTitle {
        top: -170px;
    }
    .servicePageSec .serPageTitle.tpTitle h2 {
        font-size: 255px;
    }
    .testPageSec .testItem02 {
        padding: 30px 30px 30px 39px;
    }
    .feedbackImage img {
        max-width: 100%;
        width: 100%;
    }
    .blogGridWrapper.row.gx-5 {
        --bs-gutter-x: 2rem;
    }
    .teamGridWraper.row.gx-5{
        --bs-gutter-x: 3rem;
    }
    .elementor .teamSin01 .tm01Sin img {
        max-width: 100%;
    }
    .pfContent01 h3 {
        font-size: 42px;
        line-height: 52px;
    }
}

/*----------------========----------------
/  06. min-width: 1200px & max-width: 1365px
/----------------========----------------*/
@media (min-width: 1200px) and (max-width: 1365px){
    
}

/*----------------========----------------
/  07. min-width: 992px & max-width: 1199px
/----------------========----------------*/
@media (min-width: 992px) and (max-width: 1199px){
    .sinCounter01 {
        padding: 30px 0 37px 16px;
    }
    .counterWrap .row .col-md-6:nth-child(2) .sinCounter01 {
        padding: 30px 0 0 16px;
    }
    .counterWrap .row .col-md-6:nth-child(2) .sinCounter01 {
        padding: 30px 0 0 10px;
    }
    .counterWrap .row .col-md-6:nth-child(3) .sinCounter01 {
        padding: 30px 0 0 5px;
    }
    .counterWrap .row .col-md-6:nth-child(4) .sinCounter01 {
        padding: 30px 0 0 0px;
    }
    .faqImgWrap .idoniBtn02 {
        right: 273px;
    } 
    .blogSin02 h3 {
        font-size: 20px;
        line-height: 27px;
    }
    .footerArea02 .footerGallery {
        grid-gap: 5px;
        padding-left: 0;
    }
    .footerArea02 .widgetInfo p i, .footerArea02 .widgetInfo p img {
        margin-right: 15px;
    }
    .footerArea02 .copyRight {
        margin: 0;
    }
    .serviceDetAbout .secTitle {
        font-size: 43px;
        line-height: 50px;
    }
    .integratSin span {
        width: 150px;
        height: 150px;
    }
    .testCarousel02 .testItem02 {
        padding: 30px 30px 0 30px !important;
    }
    .portfolioSec01 .secTitle {
        font-size: 40px;
        line-height: 50px;
    }
    .portfolioCat {
        margin-top: 100px;
    }
    .portfolioCat a {
        font-size: 18px;
        min-height: 42px;
        line-height: 40px;
        padding: 0 20px;
        margin: 0 10px 10px 0;
    }
    .tmDetImg img {
        width: auto !important;
        max-width: 112.7% !important;
    }
    .feedbackImage img {
        padding-top: 95px;
    }
}

@media (min-width: 1200px){
    .mainMenu{
        display: block !important;
    }
    .elementor-control-mobile_menu_style.elementor-control-type-section{
        display: none !important;
    }
}
/*----------------========----------------
/  08. max-width: 1199px
/----------------========----------------*/
@media (max-width: 1199px){
    .header01 {
        padding: 0 50px;
    }
    .header01 .mainMenu,
    .header02 .mainMenu,
    .header03 .mainMenu{
        background: var(--tw-white-color);
    }
    .mainMenu > ul > li ul li.menu-item-has-children:before{
        top: 4px
    }
    .mainMenu > ul > li ul > li.menu-item-has-children.childShow:before {
        content: '\f068';
        color: var(--tw-secondary-color);
    }

    /*-- Mobile Menu --*/
    .menu_btn{
        height: 40px;
        width: 40px;
        border-radius: 3px;
        background: var(--tw-primary-color);
        color: #FFF;
        line-height: 40px;
        font-size: 20px;
        display: block;
        text-align: center;
        margin-left: auto;
        z-index: 5;
        display: inline-block;
        -webkit-transition: all 350ms ease;
        transition: all 350ms ease;
        margin-right: 25px;
    }
    .menu_btn:hover{
        background-color: var(--tw-secondary-color);
    }
    .menu_btn i{
        line-height: inherit;
    }
    .menu_btn:hover, .menu_btn:focus, .menu_btn.active{
        color: #FFF;
        background: var(--tw-primary-color);
    }
    .menu_btn.active .fa-bars:before{
        content: "\f00d";
    }
    .mainMenu{
        z-index: 99;
        position: absolute;
        margin: 0;
        padding: 0;
        left: 0;
        top: 100%;
        width: 100%;
        background: #fff;
        box-shadow: -2px 4px 7px 0px rgba(226, 225, 225, .79);
        display: none;
        max-height: calc(100vh - 150px);
        overflow-y: scroll;
        z-index: 99991;
    }
    .mainMenu ul{
        display: block;
    }
    .mainMenu ul li{
        -webkit-transform: none;
                transform: none;
        -webkit-transition: none;
        transition: none;
        padding: 0;
        margin: 0;
        position: inherit;
        display: block;
        width: 100%;
    }
    .mainMenu > ul > li.menu-item-has-children > a:after {
        content: "\2b";
        font-size: 13px;
        float: right;
        top: 8px !important;
        right: 0px;
        left: auto;
        transform: rotate(0) !important;
        -moz-transform: rotate(0) !important;
        -webkit-transform: rotate(0) !important;
    }
    .mainMenu > ul li > ul > li > a:after {
        display: none;
    }
    .mainMenu > ul > li.menu-item-has-children a.active:after {
        content: "\f068";
    }
    .mainMenu > ul > li > a{
        width: 100%;
        color: #111c16;
        padding: 10px 25px 9px;
        border-top: 1px solid rgba(0, 0, 0, .05);
    }
    .mainMenu > ul > li:hover > a,
    .mainMenu > ul > li.current-menu-item > a{
        color: var(--theme-color);
    }
    .mainMenu ul li a:before,
    .mainMenu ul li.current-menu-item > a:before{
        display: none;
    }
    .mainMenu ul li .sub-menu li .sub-menu,
    .mainMenu ul li .sub-menu{
        min-width: 100%;
        border: none;
        padding: 0;
        z-index: 5;
        position: relative;
        width: 100%;
        opacity: 1;
        margin: 0;
        background: transparent;
        box-shadow: none;
        border-radius: 0;
        visibility: visible;
        pointer-events: inherit;
        top: 0;
        left: 0;
        display: none;
        -webkit-transform: none;
                transform: none;
        -webkit-transition: none;
        transition: none;
    }
    .mainMenu ul li .sub-menu li:hover .sub-menu,
    .mainMenu ul li:hover .sub-menu{
        top: 0;
        visibility: visible;
        opacity: 1;
        left: auto;
        pointer-events: inherit;
        -webkit-transition: none;
        transition: none;
        -webkit-transform: none;
        transform: none;
    }
    .mainMenu ul li .sub-menu li {
        display: block;
        padding: 0;
        margin: 0;
        -webkit-transition: none;
        transition: none;
        opacity: 1;
        visibility: visible;
        transition: none;
        -webkit-transform: none;
        transform: none;
    }
    .mainMenu ul li .sub-menu li a{
        padding: 9px 25px 10px;
        padding-left: 40px;
        width: 100%;
        display: block;
        border-top: 1px solid rgba(0, 0, 0, .05);
    }
    .mainMenu ul li .sub-menu li > ul li a{
        padding-left: 55px;
    }
    .mainMenu ul li:nth-last-child(1) .sub-menu li .sub-menu, .mainMenu ul li:nth-last-child(2) .sub-menu li .sub-menu {
      left: 0;
      right: auto;
    }
    .mainMenu > ul > li:after {
        content: inherit;
    }
    .mainMenu > ul > li:hover > a, .mainMenu > ul > li.current-menu-item > a {
        color: var(--tw-secondary-color);
    }
    .mainMenu > ul li > ul li{
        -webkit-transition: none;
        transition: none;
    }
    .mainMenu > ul li > ul li a {
        color: var(--tw-secondary-color);
    }
    .mainMenu > ul li > ul li:after {
        left: 48px;
    }
    .mainMenu > ul li > ul li:hover{
        padding-left: 0;
    }
    .mainMenu > ul li > ul li ul li:after {
        left: 65px;
    }
    .mainMenu > ul > li ul li.menu-item-has-children:before {
        content: '\2b';
        color: var(--tw-secondary-color);
    }
    .mainMenu > ul > li ul li.menu-item-has-children a.active:after {
        content: '';
    }
    .mainMenu > ul > li ul > li.menu-item-has-children a.active::before {
        content: '\f068';
    }
    .header01Inner {
        padding: 20px 0;
    }
    .header03 .mainMenu {
        padding-left: 0;
    }

    /* -- END: Mobile menu -- */

    .banner01Social {
        right: -405px;
    }
    .bannerInner01 .bannerMain {
        width: calc(100% - 100px);
    }
    .bannerInner01 .bannerLeft,
    .bannerInner01 .bannerRight {
        width: 50px;
    }
    .bannerContent01 h2,
    .bannerContent01 .banHead02 span,
    .bannerContent01 span {
        font-size: 65px;
    }
    .bannerContent01 .banHead02 span {
        margin-right: 15px;
    }
    .elementor .bannerContent01 img ,
    .bannerContent01 img {
        max-width: 230px;
    }
    .banner01Social {
        right: -320px;
    }
    .bannerMain .bannerIdoni {
        font-size: 300px;
        margin: 18px 0 -145px 15px;
        background-position: 43% 75.5%;
    }
    .bannerInner01 .bannerLeft p:nth-child(1):after {
        left: -15px;
    }
    .pageBannerTitle.blogSinglePB h2 {
        max-width: 420px;
    }
    .blogListView.blogRSB, .blogGridView.blogRSB {
        padding-right: 0;
    }
    .abContent01 {
        padding: 0 0 0 25px;
    }
    .peralexLayer .peraLay:nth-child(6) {
        left: -80px;
    }
    .peralexLayer .peraLay:nth-child(3) {
        right: -65px;
    }
    .peralexLayer .peraLay:nth-child(7) {
        top: -124px;
        left: 65px;
    }
    .userCarText h2 {
        font-size: 40px;
        line-height: 46px;
        max-width: 685px;
    }
    .testimonialItem02 .secTitle {
        font-size: 45px;
        line-height: 52px;
        margin: 0 0 50px;
    }
    .testimonialCon02 img {
        margin: 0 0 20px;
    }
    .peralexLayer .peraLay:nth-child(4) {
        top: 251px;
        right: 195px;
    }
    .counterSec01 {
        padding: 120px 0 120px;
    }
    .counterTitle img {
        margin: 0 6px 0 100px;
    }
    .sinCounter01 p {
        margin: 0 0 80px;
    }
    .sinCounter01 h2 {
        font-size: 60px;
    }
    .counterTitle h2 {
        font-size: 90px;
    }
    .faqContent01 .secTitle {
        font-size: 46px;
        line-height: 54px;
        margin: 0 0 59px;
    }
    .faqContent01 {
        padding: 0;
    }
    .port02Item.topItem {
        top: 40px;
    }
    .pGrid02 .port02Item {
        margin-bottom: 40px;
    }
    .blogSingle01 .blogCat {
        max-width: 120px;
    }
    .blogSingle01 h3 {
        font-size: 24px;
        line-height: 30px;
        max-width: 447px;
    }
    .contactText {
        padding: 40px 0 0 72px;
    }
    .addressWidget p {
        margin: 0px 0 28px 0;
    }
    .widget.pageWidget {
        padding-left: 0;
        margin: 0 0 65px;
    }
    footer .widget .widgetTitle {
        margin: 0 0 25px;
    }
    .formWidget {
        padding-left: 0;
    }
    .addressWidget .footerLogo a {
        margin: 0 0 23px;
    }
    .copyRight {
        margin-top: 0;
    }
    .topbar02,
    .header02 {
        padding: 0 40px;
    }
    .bannerh2 {
        top: -225px;
        margin-bottom: -170px;
    }
    .bannerh2 h2 {
        font-size: 90px;
        line-height: 90px;
    }
    .aboutSec02 .secTitle {
        line-height: 45px;
        font-size: 40px;
    }
    .abHistory02 {
        padding: 78px 0 0 0;
    }
    .clientSection01 {
        padding: 80px 0 120px;
    }
    .clientLoader01 {
        margin: 0 0 60px;
    }
    .serviceSec02 {
        padding: 0 0 35px;
    }
    .serviceWrap02 .serCircleItem {
        width: 250px;
        height: 250px;
    }
    .teamItemsWrap {
        grid-column-gap: 30px;
    }
    .teamSin01 .teamCon {
        padding: 16px 31px;
        margin: 0 auto 45px auto;
    }
    .awardSingle.swipeHvImage .swipeimage {
        width: 300px;
        height: 400px;
        top: 160px;
        left: 61%;
    }
    .portfWrap{
        margin: 0 auto;
    }
    .videoLayer:after {
        width: 54%;
    }
    .blogPageSection {
        padding: 120px 0 90px;
    }
    .blogGridView.blogLSB,
    .blogListView.blogLSB {
        padding-left: 0;
    }
    .blogListView.blogRSB {
        padding-right: 0;
    }
    .sidebar.blogRightSidebar {
        padding-left: 0;
    }
    .sidebar.blogLeftSidebar {
        padding-right: 0;
    }
    .blog04Item {
        margin: 0 0 60px;
    }
    .blog04Item h3 {
        font-size: 24px;
        line-height: 32px;
        margin: 0 0 12px;
    }
    .bi04Thumb {
        margin: 0 0 25px;
    }
    .blog04Item p {
        margin: 0 0 30px;
    }
    .bi04Footer {
        -webkit-box-align: start;
            -ms-flex-align: start;
                    -ms-grid-row-align: flex-start;
                align-items: flex-start;
    }
    .pageBannerTitle h2 {
        font-size: 50px;
        line-height: 60px !important;
    }
    .singleComment {
        padding: 40px 0 45px 90px;
    }
    .elementor .singleComment img, .singleComment img {
        width: 70px;
        height: 70px;
    }
    .commentList ul {
        margin: 0px 0 0 55px;
    }
    .serSingle03 .serNum {
        margin: 0 0 100px;
    }
    .serSingle03 h3 {
        font-size: 22px;
    }
    .serItems04 {
        padding: 40px 25px 30px;
    }
    .portfolioSec03 .portSecTitle {
        font-size: 237px;
    }
    .portfolioSec03 .portfWrap {
        margin: -80px 83px 0 auto;
    }
    .teamTextAnim h2 {
        margin: 0 40px 0 0;
    }
    .testimonialItem03 {
        padding: 118px 30px 117px;
    }
    .getInfoAddress h3 {
        font-size: 25px;
        line-height: 22px;
    }
    .getInfoAddress {
        margin: 0 0 60px;
    }
    .getShare a {
        font-size: 30px;
        margin: 0 0 22px;
    }
    .footerArea03 .copyRight {
        margin-top: 20px;
    }
    .footerTop {
        margin: 0 0 70px;
    }
    .impressionSec {
        padding: 0 0 95px;
    }
    .impressionSec .secTitle {
        font-size: 38px;
        line-height: 48px;
        margin: 0 0 38px;
    }
    .abContent02 {
        padding: 0 50px 0 32px;
    }
    .abImage02 {
        margin-right: 0;
    }
    .historyCon {
        padding: 0 0px 0 27px;
    }
    .reverse .historyCon {
        padding: 0 27px 0 0;
    }
    .historyYear {
        padding: 0 26px 0 0;
    }
    .historyYear:after {
        margin: auto 27px;
    }
    .reverse .historyYear:after {
        left: -50px;
    }
    .historyConItem {
        margin: 0 0 70px;
    }
    .reverse .historyYear {
        text-align: left;
        padding: 0 0 0 27px;
    }
    .bd04Con {
        padding: 0;
    }
    .bd04Con h3 {
        font-size: 25px;
        line-height: 32px;
        margin: 0 0 15px;
    }
    .blogPageDetails {
        padding: 90px 0 80px;
    }
    .bd04Item {
        margin: 30px 0 20px;
    }
    .getCommentForm input {
        min-width: 100%;
    }
    .blogDetContent h4 ,
    .blogDetContent .bd14{
        margin: 0px 0 20px;
    }
    .postNavigationRow {
        margin: 40px 0 60px;
    }
    .blogDetContent .bi04Thumb {
        margin: 0 0 30px;
    }
    .blogDetContent .bi04Footer {
        padding: 0;
    }
    .contactMap iframe {
        height: 400px;
    }
    .portGridWrap02 {
        grid-gap: 30px;
    }
    .topbar02, .header02,
    .topbar03, .header03 {
        padding: 0 24px;
    }
    .header02 .mainMenu > ul > li {
        padding: 0;
    }
    .header02 .mainMenu {
        left: 0;
    }
    .header02 .menu_btn {
        background: var(--tw-secondary-color);
    }
    .header02 .mainMenu > ul > li > a,
    .header03 .mainMenu > ul > li > a {
        padding: 8px 24px 5px;
    }
    .header02 .mainMenu > ul li > ul li:after,
    .header03 .mainMenu > ul li > ul li:after  {
        left: 28px;
    }
    .header02 .mainMenu ul li .sub-menu li a,
    .header03 .mainMenu ul li .sub-menu li a {
        padding-left: 45px;
    }
    .header02 .mainMenu ul li .sub-menu li ul,
    .header03 .mainMenu ul li .sub-menu li ul {
        padding-left: 20px;
    }
    .header03 .mainMenu {
        right: 0;
    }
    .header03 .mainMenu > ul > li {
        padding: 0;
    }
    .serCarItem01 .serviceImg {
        width: 100% !important;
        height: auto !important;
        padding: 38px;
    }
    .serCarItem01 h2 {
        font-size: 30px;
    }
    .serCarItem01 .serTags {
        margin: 0 0 5px;
    }
    .portGridSection01 .row.gx-4 {
        --bs-gutter-x: 1.5rem;
    }
    .svContent {
        padding: 0;
    }
    .serviceDetAbout .abContent02 {
        padding: 0;
    }
    .serCarItem01 .serviceImg img {
        max-width: 350px;
    }
    .serviceSec02 .secTitle {
        font-size: 40px;
        line-height: 50px;
    }
    .testCarousel02 .testItem02 {
        padding: 30px 30px 24px 30px;
    }
    .testCarousel02 .testItem02 p {
        font-size: 18px;
        line-height: 28px;
        margin: 0 0 25px;
    }
    .testCarousel02 .slick-slide {
        margin-bottom: 30px !important;
    }
    .servicePageSec .serPageTitle h2 {
        font-size: 230px;
        margin-bottom: -160px;
    }
    .servicePageSec .serPageTitle {
        top: -152px;
    }
    .serWrap02Item {
        grid-template-columns: repeat(2,1fr);
    }
    .serWrapItem {
        grid-column-gap: 29px;
        grid-row-gap: 60px;
    }
    .serSingle02 h3 {
        font-size: 27px;
    }
    .feedbackImage img {
        max-width: 774px;
    }
    .fbTestSlider .testItem02 {
        padding: 30px 30px 10px 30px;
    }
    .feedbackSec01 .secTitle {
        font-size: 40px;
        line-height: 50px;
    }
    .contactSection02 {
        margin: 60px 0 50px;
    }
    .portfolio_details .row .col-lg-3:nth-child(3) .mrSingle,
    .portfolio_details .row .col-lg-3:nth-child(4) .mrSingle {
        left: 0;
    }
    .mrSingle h3 {
        font-size: 22px;
    }
    .processItem {
        padding: 49px 20px 49px;
    }
    .teamDetailsSec {
        padding: 90px 0 30px;
    }
    .tmDesctiption {
        padding: 40px 15px 45px 30px;
    }
    .footerArea02 .widget.pageWidget {
        padding-left: 0;
    }
    .servicePageSec .serPageTitle.tpTitle {
        top: -135px;
    }
    .servicePageSec .serPageTitle.tpTitle h2 {
        font-size: 205px;
        margin-bottom: -140px;
    }
    .tmDetIconItem {
        margin: 0 0 15px 0;
    }
    .feedbackSec01 .col-lg-7 {
        width: 50%;
    }
    .feedbackSec01 .col-lg-5 {
        width: 50%;
    }
    .blogGridWrapper.row.gx-5 {
        --bs-gutter-x: 1.2rem;
    }
    .teamGridWraper.row.gx-5{
        --bs-gutter-x: 1.4rem;
    }
    .pfContentSlide {
        padding: 60px 0px 40px 25px;
    }
    .portfolioSec04 .folioSliderWrapper {
        padding-right: 25px;
    }
    .pfContent01 {
        max-width: 431px;
        min-height: 420px;
    }
}

/*----------------========----------------
/  09. min-width: 768px & max-width: 991px
/----------------========----------------*/
@media (min-width: 768px) and (max-width: 991px){
    .testWrap03 .testItem02 {
        padding: 42px 50px 48px 50px;
    }
    .teamLoader01, .teamLoader02 {
        padding: 10px 0 10px 0;
    }
    .teamLoader01 {
        bottom: 45px;
    }
   .aboutSection02 .secTitle {
        font-size: 44px;
        line-height: 46px;
    }
    .serCarItem01 .idoniBtn02 {
        padding: 0 20px;
        min-height: 44px;
        line-height: 40px;
    }
    .serCarItem01 h2 {
        font-size: 24px;
    }
    .serCarItem01 .serItemCon {
        bottom: -25px;
    }
    .fbTestSlider .slick-slide{
        margin: 0 12px;
    }
    .fbTestSlider .fbTestWrap{
        margin: 0 -12px;
    }
}

/*----------------========----------------
/  10. max-width: 1024px
/----------------========----------------*/
@media (max-width: 1024px){
    #ball {
        display: none;
    }
}
/*----------------========----------------
/  10. max-width: 991px
/----------------========----------------*/
@media (max-width: 991px){
    .logo{
        flex: 0 0 25%;
    }
    .bannerContent01 p {
        max-width: 100%;
        top: 0;
        padding: 12px 40px 5px 0;
    }
    .sinCounter01 p > br{
        display: none;
    }
    .historyYear h2{
        text-align: left;
    }
    .banner01Social {
        right: -295px;
    }
    .bannerInner01 .bannerMain {
        padding: 90px 0 0 0;
    }
    .bannerMain .bannerIdoni {
        font-size: 200px;
        margin: 18px 0 -100px 0;
        background-position: 37% 85.5%;
        text-align: center;
    }
    .bannerInner01 .bannerLeft p:nth-child(1) {
        top: -45px;
    }
    .pageBannerTitle.blogSinglePB h2 {
        max-width: 330px;
    }
    .aboutSec01 {
        padding: 80px 0 0;
    }
    .abImg01 {
        padding-right: 0 !important;
    }
    .abImg01 img {
        max-width: 100%;
    }
    .abContent01 {
        padding: 40px 0 0 0;
    }
    .abContent01 img {
        display: none;
    }
    .aboutSec01 .secTitle {
        margin-bottom: 50px;
    }
    .abDes01 {
        padding: 0 30px 20px 0;
    }
    .loaderSec01 {
        padding: 70px 0 60px;
    }
    .loaderItem01, .loaderItem02 {
        padding: 20px 0 20px 0;
        margin: 0 0 0;
    }
    .loaderAnim h2 {
        font-size: 30px;
        letter-spacing: 0.02em;
    }
    .peralexLayer .peraLay:nth-child(6) {
        left: -53px;
        top: -45px;
    }
    .peralexLayer .peraLay:nth-child(7) {
        left: -27px;
    }
    .testimonialCon02 {
        margin: 0 0 50px;
    }
    .testimonialItem02 .secTitle {
        font-size: 43px;
        margin: 0 0 30px;
    }
    .testimonialItem02 .secTitle br {
        display: none;
    }
    .feedbackSec01 {
        padding-bottom: 80px;
    }
    .elementor .feedbackImage img ,
    .feedbackImage img {
        max-width: 620px;
        margin: 0 auto 40px;
    }
    .counterSec01 {
        padding: 90px 0 90px;
    }
    .counterTitle h2 {
        font-size: 83px;
        margin: 0;
    }
    .counterTitle {
        margin: 0 0 70px;
    }
    .counterWrap .row .col-md-6:nth-child(2):after {
        content: none;
    }
    .counterWrap .row .col-md-6:nth-child(3):after {
        right: -6px;
    }
    .counterTitle p {
        line-height: 24px;
        top: 13px;
        position: relative;
    } 
    .faqContent01 {
        padding: 120px 0 0;
    }
    .faqImg02 img {
        -webkit-filter: drop-shadow(0px 30px 60px rgba(0, 0, 0, 0.13));
                filter: drop-shadow(0px 30px 60px rgba(0, 0, 0, 0.13));
    }
    .faqContent01 .secTitle {
        margin: 0 0 50px;
    }
    .faqSection01 {
        padding: 90px 0 100px;
    }
    .sinCounter01 p {
        margin: 0 0 30px;
    }
    .pGrid02 .port02Item {
        margin-bottom: 35px;
    }
    .port02Item.topItem {
        top: 0;
    }
    .blogSingle01 {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-align: start;
            -ms-flex-align: start;
                    -ms-grid-row-align: flex-start;
                align-items: flex-start;
        padding: 20px 0;
    }
    .blogSingle01 .blogMeta {
        display: -webkit-inline-box;
        display: -ms-inline-flexbox;
        display: inline-flex;
        -webkit-box-pack: start;
            -ms-flex-pack: start;
                justify-content: flex-start;
        margin: 0;
    }
    .blogSingle01 .idoniBtn02 {
        margin: 0 0 12px;
    }
    .blogSingle01 h3 {
        margin: 0 0 15px;
    }
    .swipeHvImage .swipeimage {
        right: 10%;
        left: auto;
    }
    .contactLogo {
        top: auto;
        bottom: -50px;
        left: auto;
        right: 20px;
    }
    .contactText {
        padding: 45px 0 70px 0;
    }
    .contactLogo {
        width: 140px;
        height: 140px;
    }
    .contactLogo img {
        max-width: 110px;
        width: 100%;
        height: auto;
    }
    .bannerh2 h2 {
        font-size: 88px;
    }
    .bannerConTitle {
        margin: 80px 0 60px;
    }
    .bannerConTitle p:after {
        left: calc(100% + 25px);
        top: 30px;
        width: 180px;
    }
    .aboutSec02 .secTitle {
        line-height: 38px;
        font-size: 30px;
    }
    .abHistory02 {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        padding: 60px 0 0 0;
    }
    .abHistoryImg {
        text-align: left;
    }
    .abHistoryTest h3 {
        margin: 0 0 10px;
    }
    .abHistoryTest p {
        margin: 0 0 30px;
    }
    .abDownArrow a {
        bottom: 30px;
    }
    .clientLogo {
        margin-bottom: 40px;
        text-align: center;
    }
    .clientLogo.client03 {
        left: 0;
    }
    .clientLogo.client06 {
        left: 0;
    }
    .clientLoader01 .loaderAnim02 h2 {
        font-size: 50px;
        letter-spacing: -0.01em;
    }
    .clientLoader01 .loaderAnim02 h2 a {
        padding: 0 10px 0 20px;
    }
    .bannerArea02 {
        padding: 100px 0 150px;
    }
    .clientLoader01 {
        margin: 0 0 25px;
    }
    .clientSection01 {
        padding: 25px 0 80px;
    }
    .serviceWrap02 .serCircleItem {
        display: none;
    }
    .serviceWrap02:after,
    .serviceWrap02:before {
        display: none;
    }
    .serviceWrap02 .row .col-md-6:nth-child(2n) {
        padding: 0 0 27px 30px;
    }
    .teamSecTitle h2 {
        font-size: 160px;
    }
    .teamItemsWrap {
        grid-template-columns: repeat(2,1fr);
        grid-row-gap: 75px;
    }
    .teamItemsWrap .teamSin01:nth-child(01), .teamItemsWrap .teamSin01:nth-child(04) {
        top: 0;
    }
    .teamItemsWrap .teamSin01:nth-child(02), .teamItemsWrap .teamSin01:nth-child(05) {
        top: 0;
    }
    .teamItemBtn {
        margin: 90px 0 0;
    }
    .serviceSec02 {
        padding: 0;
    }
    .awardSingle {
        padding: 40px 0 40px;
    }
    .awardSingle h3 {
        font-size: 30px;
    }
    .awardSingle.swipeHvImage .swipeimage {
        width: 200px;
        height: 280px;
        left: 61%;
        top: 105px;
    }
    .awardSingle .swipeimage a {
        -webkit-transform: scale(.7);
                transform: scale(.7);
        right: 6px;
        top: 6px;
    }
    .videoLayer:after {
        width: 40%;
        left: -30px;
    }
    .videoLayer h2 {
        font-size: 34px;
    }
    .videoSection {
        height: auto !important;
        padding: 150px 0px 50px !important;
    }
    .videoLayer {
        margin-top: 100px;
    }
    .blogSection02 {
        padding: 0 0 50px;
    }
    .blogSin02 {
        margin: 0 0 59px;
    }
    .blogSin02 h3 {
        font-size: 23px;
    }
    .footerArea02 {
        padding: 85px 0 0;
    }
    .footerArea02 .pw03 .pageWidget,
    .footerArea02 .footerGallery,
    .footerArea02 .widget.pageWidget {
        padding-left: 0;
    }
    .footerArea02 .widget .widgetTitle {
        margin: 0 0 30px;
    }
    .footerArea02 .copyRight {
        margin: 65px 0 0;
    }
    .blogPageSection {
        padding: 90px 0 40px;
    }
    .blog04Item {
        margin: 0 0 60px;
    }
    .blogItemWrap.gapRight .blog04Item.biMesery{
        margin-bottom: 20px !important;
    }
    .portPageBanner {
        padding: 120px 0 0;
    }
    .portPageBanner .pageBannerTitle {
        margin: 0 0 120px;
    }
    .pageBannerTitle h2 {
        font-size: 40px;
        line-height: 50px !important;
        padding-right: 35px;
    }
    .contactImg img {
        width: 100%;
    }
    .serviceWrap03 {
        grid-template-columns: repeat(2,1fr);
    }
    .serviceWrap03 .serSingle03:nth-child(2) {
        margin-top: 0;
    }
    .serviceWrap03 .serSingle03:nth-child(3) {
        margin-top: 50px;
    }
    .serviceSec03 .secTitle {
        font-size: 40px;
    }
    .serviceSec03 {
        padding: 90px 0 152px;
    }
    .portfolioSec03 .portSecTitle {
        font-size: 212px;
    }
    .folioItem03Wrap{
        max-width: 748px;
        width: 100%;
        margin: 0 auto;
    }
    .folioTitle_wrap {
        transform: rotateZ(-90deg) translate(392px, -344px);
        left: 5px;
    }
    .portfItem03 h2 {
        font-size: 32px;
    }
    .portfolioSec03 .portfWrap {
        margin: -65px 83px 0 auto;
    }
    .elementor .portfItem03 img{
        max-width: 663px;
    }
    .portfItem03 {
        margin: 0 0 70px;
    }
    .teamTextAnim h2 {
        font-size: 22px;
    }
    .testWrap03 .testItem02 {
        padding: 42px 30px 48px 30px;
    }
    .testWrap03 .testItem02 p {
        font-size: 18px;
        line-height: 27px;
    }
    .touchLoader h2 {
        font-size: 150px;
        letter-spacing: -0.01em;
    }
    .touchLoader img {
        width: 120px;
        height: 120px;
        left: 185px;
    }
    .getTouchSection {
        padding: 90px 0 220px;
    }
    .getInfoAddress h3 {
        font-size: 18px;
        line-height: 15px;
    }
    .getShare a {
        font-size: 24px;
        margin: 0px 0 16px;
    }
    .mapWidget iframe {
        max-width: 100%;
    }
    .footerTop {
        margin: 0 0 45px;
    }
    .footerArea03 .copyRight {
        margin-top: 50px;
    }
    .impCarItem .impPlayBtn {
        -webkit-transform: scale(.7);
                transform: scale(.7);
    }
    .aboutSection02 {
        padding: 90px 0 327px;
    }
    .abContent02 {
        padding: 0;
    }
    .aboutSection02 .secTitle {
        font-size: 40px;
        margin: 0 0 36px;
    }
    .historyConItem {
        margin: 0 0 35px;
    }
    .history01Item:after {
        right: auto;
        margin: 0;
        left: 30px;
    }
    .hisPaperPlan, .hisPlus {
        right: auto;
        margin: 0;
    }
    .historyYear {
        position: relative;
        text-align: left;
        padding: 0 0 0 65px;
    }
    .historyCon {
        padding: 0 0px 0 72px;
    }
    .historyYear:after {
        margin: auto -45px;
    }
    .reverse .historyCon {
        text-align: left;
        padding: 0 0 0 72px;
    }
    .reverse .historyYear {
        padding: 0 0 0 72px;
    }
    .historyConItem.reverse .row .col-lg-6:last-child  {
        -webkit-box-ordinal-group: 0;
            -ms-flex-order: -1;
                order: -1;
    }
    .historyConItem.reverse .row .col-lg-6:first-child  {
        -webkit-box-ordinal-group: 2;
            -ms-flex-order: 1;
                order: 1;
    }
    .reverse .historyYear:after {
        left: 65px;
    }
    .history01Item {
        padding: 60px 0 40px;
    }
    .historyCon h3 {
        margin: 0 0 15px;
    }
    .aboutBlogSection {
        padding: 90px 0 50px;
    }
    .blogPageDetails {
        padding: 80px 0 30px;
    }
    .blogPageSection .row .col-lg-8,
    .blogPageDetails .row .col-lg-8{
        -webkit-box-ordinal-group: 0;
            -ms-flex-order: -1;
                order: -1;
        margin-bottom: 50px;
    } 
    .blog_nsb{
        padding-bottom: 60px;
    }
    .recentPost h3 {
        max-width: 215px;
        width: 100%;
    }
    .footerArea01 {
        padding: 80px 0 0;
    }
    .commentFormBox {
        margin: 0 0 50px;
    }
    .contactWrap {
        padding: 60px 0 50px 0;
    }
    .getTouchContact {
        padding: 100px 0 80px;
    }
    .portGridSection02 {
        padding: 90px 0 90px;
    }
    .portGridWrap02 {
        grid-template-columns: repeat(2,1fr);
    }
    .portGridWrap02 .topItem {
        top: 0;
    }
    .portGridSection02 .idoniBtn02 {
        margin-top: 60px;
    }
    .portGridSection03 {
        padding: 90px 0 90px;
    }
    .portGridWrap03 {
        grid-template-columns: repeat(2,1fr);
    }
    .port03Single .portCat {
        padding: 20px 0 15px;
    }
    .topbar02, .header02,
    .topbar03, .header03 {
        padding: 0 10px;
    }
    .portGridSection01 {
        padding: 40px 0 30px;
    }
    .aboutUs03 {
        padding: 90px 0 90px;
    }
    .portfolioSec03 {
        padding: 0 0 80px;
    }
    .teamSection02 {
        padding: 90px 0 70px;;
    }
    .testimonialItem03 {
        padding: 70px 24px 80px;
    }
    .blogSection03 {
        padding: 90px 0 79px;
    }
    .svContent {
        padding: 0 0 60px;
    }
    .sv01video {
        padding: 0;
    }
    .serviceDetAbout .abContent02 {
        padding: 130px 0 0;
    }
    .abConTab {
        margin: 0 0 40px;
    }
    .serviceDetAbout {
        padding: 90px 0 90px;
    }
    .serviceDetAbout .secTitle {
        max-width: 535px;
        width: 100%;
    }
    .serIntegration {
        padding: 90px 0 90px;
    }
    .integratSin.wordpress {
        margin-bottom: 100px;
    }
    .serviceCarWrap01{
        padding-left: 12px;
    }
    .serCarItem01 .serviceImg img {
        max-width: 300px;
    }
    .serviceSec02 .secTitle {
        font-size: 30px;
        line-height: 36px;
    }
    .abIconBoxWrap {
        padding-left: 12px;
    }
    .testimonialItem02 {
        padding: 90px 0 0;
        margin-bottom: 50px;
    }
    .portfolioCat {
        margin-top: 50px;
    }
    .serWrap02Item {
        padding-bottom: 45px;
    }
    .testServiceSec01 {
        padding: 80px 0 90px;
    }
    .testServoceSec02 {
        padding: 90px 0 90px;
    }
    .servicePageSec .serPageTitle {
        top: -110px;
    }
    .servicePageSec .serPageTitle h2 {
        font-size: 167px;
        margin-bottom: -100px;
    }
    .ctaWrap01 {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-align: center;
            -ms-flex-align: center;
                    -ms-grid-row-align: center;
                align-items: center;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
    }
    .ctaWrap01 h2 {
        margin-right: 0;
        margin-bottom: 10px;
    }
    .ctaWrap01 h2 div{
        text-align: center !important;
    }
    .ctaWrap01 p {
        max-width: 100%;
        text-align: center;
        margin-bottom: 20px ;
    }
    .ctaWrap01 .idoniBtn02 {
        margin: 0 0 0 0;
    }
    .feedbackSec01 .col-lg-7 {
        width: 100%;
    }
    .feedbackSec01 .col-lg-5 {
        width: 100%;
    }
    .feedbackSec01 .secTitle {
        margin: 0 0 35px;
    }
    .serWrapItem {
        grid-template-columns: repeat(2,1fr);
    }
    .contactSection02 {
        margin: 0;
    }
    .serWrap03Item {
        grid-template-columns: repeat(2,1fr);
    }
    .counterSec02 {
        padding: 80px 0 100px;
    }
    .processItem {
        margin-bottom: 15px;
    }
    .portfolio_details {
        padding: 90px 0 70px;
    }
    .mrSingle {
        margin: 0 0 25px;
    }
    .portDescription {
        margin: 0 0 30px;
    }
    .portDescription p {
        margin: 0 0 15px;
    }
    .includeWork {
        margin: 0 0 30px;
    }
    .includeWork h3 {
        margin: 0 0 20px;
    }
    .workingProcess {
        margin: 0 0 25px;
    }
    .clientMessage {
        margin: 0 0 30px;
    }
    .otherSpecial {
        padding: 0 0 10px;
        margin: 0 0 20px;
    }
    .otherSpecial h3 {
        margin: 0 0 25px;
    }
    .teamPageSec02 {
        padding: 0;
    }
    .teamDetailsSec .col-lg-5 {
        width: 100%;
    }
    .teamDetailsSec .col-lg-5.noPaddingRight{
        padding-right: 12px;
    }
    .teamDetailsSec .col-lg-7.noPaddingLeft {
        padding-left: 12px;
    }
    .teamDetailsSec .col-lg-7 {
        width: 100%;
    }
    footer .widget .widgetTitle {
        margin: 0 0 15px;
    }
    .widget.formWidget .widgetTitle {
        margin: 0 0 35px;
    }
    .formWidget {
        margin-top: 45px;
    }
    .footerArea02 .widget.pageWidget {
        margin: 0 0 45px;
    }
    .peralexLayer .peraLay img {
        max-width: 80%;
    }
    .peralexLayer .peraLay:nth-child(3) {
        right: -54px;
        top: -57px;
    }
    .tmDetImg img {
        border-radius: 10px 10px 0 0;
    }
    .tmDesctiption {
        padding: 60px 30px 60px 30px;
        border-radius: 0 0 10px 10px;
    }
    .servicePageSec .serPageTitle.tpTitle {
        top: -102px;
    }
    .servicePageSec .serPageTitle.tpTitle h2 {
        font-size: 150px;
        margin-bottom: -100px;
    }
    .testPageSec {
        padding: 90px 0 50px;
    }
    .sponsorSin img {
        max-width: 80%;
    }
    .pd01SliderWrap {
        padding: 30px 0 50px;
    }
    .portfolioSec01:after {
        display: none;
    }
    .portfolioSec01:before {
        display: none;
    }
    .pfSliderWrap01 {
        padding: 50px 20px 50px 20px;
    }
    .pfContent01 {
        padding: 20px 0px 0 20px;
    }
    .portfolio_details.faqSec {
        padding: 90px 0 0;
    }
    .header01 {
        padding: 0 10px;
    }
    .header03 .mainMenu,
    .header02 .mainMenu,
    .mainMenu {
        left: -10px;
        width: calc(100% + 20px);
    }
    .header03 .mainMenu{
        right: unset;
    }
    .teamSin01.temSi1, 
    .teamSin01.temSi4,
    .teamSin01.temSi8,
    .teamSin01.temSi11 {
        top: 0;
    }
    .teamSin01.temSi2 , 
    .teamSin01.temSi5,
    .teamSin01.temSi9,
    .teamSin01.temSi12  {
        top: 0;
    }
    .testimonialPertialRow .testimonialSliderWrap{
        padding-left: 0;
    }
    .pagePagination.folioPage02 {
        margin: 40px 0 0;
    }
    .portfolioSec04:before,
    .portfolioSec04:after{
        width: 100%;
        height: 50%;
    }
    .portfolioSec04:before{
        bottom: 0;
        top: auto;
    }
    .portfolioSec04 .folioSliderWrapper {
        padding:50px 0 25px;
    }
    .pfContentSlide {
        padding: 71px 75px 50px 50px;
    }
    .portfolioSec04 .col-lg-6 {
        max-height: 600px !important;
    }
    .pfContent01 {
        max-width: 571px;
        min-height: 430px;
    }
}

/*----------------========----------------
/  11. max-width: 767px
/----------------========---------------*/
@media (max-width: 767px){
    .header01 {
        padding: 0 10px;
    }
    .mainMenu > ul > li > a {
        padding: 10px 10px 9px;
    }
    .mainMenu > ul li > ul li:after {
        left: 10px;
    }
    .mainMenu ul li .sub-menu li a {
        padding-left: 25px;
    }
    .mainMenu > ul li > ul li ul li:after {
        left: 28px;
    }
    .bannerInner01 .bannerMain {
        width: calc(100%);
    }
    .bannerInner01 .bannerLeft, .bannerInner01 .bannerRight {
        display: none;
    }
    .navAccess01 .headLang {
        display: none;
    }
    .bannerContent01 .banHead02 spanspan {
        top: 0px;
    }
    .bannerContent01 {
        padding-left: 0;
    }
    .bannerMain .bannerIdoni {
        margin: 18px 0 -100px 0;
    }
    .bannerContent01 h2, .bannerContent01 .banHead02 span {
        font-size: 57px;
    }
    .secTitle {
        font-size: 35px;
        line-height: 46px;
    }
    .aboutSec01 .secTitle {
        margin-bottom: 35px;
    }
    .abDes01 {
        padding: 0 0 10px 0;
    }
    .abDes01 h4 {
        margin: 0 0 10px;
    }
    .testimonialTiem01 {
        padding: 80px 0 80px;
    }
    .peralexLayer .peraLay {
        display: none;
    }
    .userCarText h2 {
        font-size: 30px;
        line-height: 35px;
        font-weight: 500;
    }
    .counterTitle h2 {
        font-size: 55px;
        line-height: 42px;
    }
    .counterTitle img {
        margin: 0 6px 0 5px;
    }
    .counterWrap .row .col-md-6:after {
        display: none;
    }
    .sinCounter01 {
        text-align: center;
        padding: 50px 0 0 0 !important;
    }
    .sinCounter01 h2 {
        text-align: center;
    }
    .blogSection01 {
        padding: 80px 0 50px;
    }
    .blogSection01 .secTitle {
        line-height: 40px;
    }
    .blogSingle01 h3 {
        z-index: 99991;
    }
    .swipeHvImage .swipeimage {
        right: 0;
    }
    .footerArea01 {
        padding: 80px 0 0;
    }
    .copyRight {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        padding: 15px 0;
    }
    .copyRight ul {
        margin: 0 0 10px;
    }
    .copyRight ul li {
        margin-right: 20px;
    }
    .bannerConTitle p:after {
        display: none;
    }
    .bannerh2 {
        top: -200px;
    }
    .bannerh2 h2 {
        font-size: 65px;
        line-height: 65px;
    }
    .bannerArea02 {
        padding: 100px 0 135px;
    }
    .bannerBatch img {
        max-width: 110px;
    }
    .abWraper02 .row .col-md-9{
        -webkit-box-ordinal-group: 0;
            -ms-flex-order: -1;
                order: -1;
    }
    .bannerConTitle {
        flex-wrap: wrap;
        row-gap: 40px;
    }
    .clientLogo.client07 {
        left: 0;
    }
    .clientLogo.client04, .clientLogo.client08 {
        text-align: center;
    }
    .clientLogo.client02 {
        left: 0;
    }
    .serSingle02 {
        margin: auto;
        display: block;
    }
    .serviceWrap02 .row .col-md-6:nth-child(2n) {
        padding: 0;
    }
    .teamSecTitle h2 {
        font-size: 100px;
    }
    .teamItemsWrap {
        grid-row-gap: 60px;
    }
    .teamSin01 .teamCon {
        padding: 10px 15px;
        width: calc(100% - 30px);
    }
    .teamSin01 .teamSocial {
        padding-left: 35px;
    }  
    .teamSin01 .teamCon {
        margin: 0 auto 38px auto;
    }
    .teamSection01 {
        padding: 20px 0 0;
    }
    .awardSection01 {
        padding: 80px 0 0;
    }
    .awardSingle.swipeHvImage .swipeimage {
        width: 180px;
        height: 240px;
        left: 61%;
        top: 80px;
    }
    .awardSingle h3 {
        font-size: 24px;
    }
    .videoLayer:after {
        display: none;
    }
    .blogSin02 {
        margin: 0 0 40px;
    }
    .blogSection02 .secTitle {
        margin: 0 0 50px;
    }
    .videoSection {
        margin: 67px 0 90px !important;
    }
    .footerArea02 .pw03 .pageWidget {
        margin:10px 0 30px;
    }
    .blog04Item h3 {
        font-size: 22px;
        line-height: 28px;
    }
    .bi04Meta span:first-child {
        margin-left: 0;
    }
    .bi04Meta .postShareMeta span{
        margin-left: 8px;
    }
    .bi04Author {
        padding: 8px 0 0px 42px;
    }
    .blog04Item p {
        margin: 0 0 20px;
    }
    .blogCarousel button.owl-prev, .blogCarousel button.owl-next {
        width: 40px;
        height: 40px;
        font-size: 14px;
    }
    .blog04Item .popup_video {
        width: 60px;
        height: 60px;
    }
    .blogItemWrap.gapRight .blog04Item.biMesery {
        margin-bottom: 40px !important;
    }
    .bi04Meta span {
        margin-left: 8px;
    }
    
    .portPageBanner {
        padding: 80px 0 0;
    }
    .portPageBanner .pageBannerTitle {
        margin: 0 0 80px;
    }
    .pageBannerTitle h2 {
        font-size: 30px;
        line-height: 38px !important;
    }
    .pageBannerTitle:after {
        bottom:15px;
    }
    .serviceWrap03 {
        grid-column-gap: 54px;
    }
    .serviceSec03 .idoniBtn03 {
        display: none;
    }
    .serviceSec03 .secTitle {
        margin: 0 0 30px;
    }
    .portfolioSec03 .portSecTitle {
        font-size: 157px;
    }
    .portfolioSec03 .portfWrap {
        margin: -50px 83px 0 auto;
    }
    .portfolioSec03 {
        position: relative;
        padding: 0 0 90px;
    }
    .portfItem03 {
        margin: 0 0 40px;
    }
    .portfContent {
        bottom: 30px;
        left: 30px;
    }
    .portfItem03 h2 {
        font-size: 26px;
    }
    .folioItem03Wrap {
        padding: 0;
    }
    .folioItem03Wrap {
        max-width: 663px;
    }
    .folioTitle_wrap {
        transform: unset;
        position: absolute;
        flex-wrap: wrap;
        left: 30px;
        bottom: 0;
        margin-bottom: 22px;
    }
    .portfContent {
        left: 30px;
        bottom: 65px;
    }
    .getShare {
        display: none
    }
    .getInfoAddress h3 {
        font-size: 18px;
        line-height: 24px;
        margin: 0 0 10px;
    }
    .touchLoader h2 {
        font-size: 110px;
    }
    .touchLoader img {
        width: 80px;
        height: 80px;
        left: 132px;
        top: -62px;
    }
    .widget.pageWidget {
        margin: 0 0 45px;
    }
    .footerArea03 .copyRight {
        margin-top: 30px;
    }
    .copyRightSocial {
        margin-top: 15px;
    }
    .impressWrap {
        top: -130px;
        margin-bottom: -50px;
    }
    .impressionSec .secTitle {
        font-size: 32px;
        line-height: 37px;
        margin: 0 0 38px;
    }
    .impressCaptionWrap img {
        margin: 0 0 40px;
    }
    .aboutSection02 {
        padding: 90px 0 280px;
    }
    .abImage02 img {
        max-width: 100%;
    }
    .abContent02 {
        padding: 0;
        padding-top: 50px;
    }
    .aboutSection02 .secTitle {
        margin: 0 95px 36px 0;
    }
    .abConTab {
        margin: 0 0 35px;
    }
    .historyYear h2 {
        font-size: 120px;
    }
    .blogPageDetails {
        padding: 60px 0 20px;
    }
    .bd04Item .row .col-md-7,
    .bd04Item .row .col-md-5 {
        width: 100%;
    }
    .bd04Con {
        padding: 25px 0 0;
    }
    .blogDetContent .bi04Footer {
        padding: 0 0 15px;
    }
    .blogDetContent p {
        margin: 0 0 10px;
    }
    .singleComment {
        padding: 40px 0 56px 0;
    }
    .elementor .singleComment img {
        position: relative;
        top: -15px;
    }
    .commentList ul {
        margin: 0 0 0 80px;
    }
    .blogDetContent .bi04Meta {
        margin: 5px 0 0;
    }
    .contactPageBanner {
        padding: 120px 0 0;
    }
    .contactPageBanner .pageBannerTitle {
        margin: 0 0 300px;
    }
    .contactMap iframe {
        height: 300px;
    }
    .contactMap iframe {
        top: -230px;
    }
    .contactPageBanner {
        padding: 90px 0 0;
    }
    .getTouchContact {
        padding: 100px 0 50px;
    }
    .port03Single h3 {
        font-size: 22px;
    }
    .topbarRight .topLan {
        display: none;
    }
    .topbarRight .topSocial:after {
        display: none;
    }
    .header03 .header01Inner .idoniBtn03 {
        display: none;
    }
    .header03 .navAccess02 button {
        margin-left: 0;
    }
    .header01Inner {
        padding: 15px 0;
    }
    .serCarItem01 .serviceImg {
        padding: 50px;
    }
    .slider01 .tp-captionHead,
    .slider01 .to_circle{
        left: 0;
    }
    .portfWrap .portfItem03.pf03 {
        margin-bottom: 50px;
    }
    .serviceDetAbout .abContent02 {
        padding: 150px 0 0;
    }
    .serviceDetAbout .secTitle {
        margin: 0 0 35px;
    }
    .videoPlayBtn {
        -webkit-transform: scale(.7) !important;
                transform: scale(.7) !important;
    }
    .serCarItem01 .serviceImg img {
        max-width: 400px;
    }
    .testimonialItem02 {
        padding: 80px 0 10px;
    }
    .faqSection01 {
        padding: 90px 0 70px;
    }
    .testCarNav {
        margin-bottom: 20px;
    }
    .pfSlider01.owl-carousel .owl-stage {
        left: 0;
    }
    
    .pfSlider01.owl-carousel .owl-stage {
        left: 0 !important;
    }
    .serWrap02Item {
        grid-template-columns: repeat(1,1fr);
    }
    .servicePageSec .serPageTitle {
        top: -85px;
    }
    .servicePageSec .serPageTitle h2 {
        font-size: 125px;
        margin-bottom: -67px;
    }
    .servicePageSec {
        padding: 0 0 0;
    }
    .testSerWrap .userCarText h2 {
        line-height: 45px;
        font-size: 30px;
    }
    .serWrap03Item {
        grid-column-gap: 54px;
    }
    .widget.addressWidget {
        margin: 0 0 40px;
    }
    .formWidget {
        margin-top: 0;
    }
    .footerArea02 .footerGallery {
        grid-gap: 5px;
    }
    .footerArea02 .copyRight {
        margin: 0;
    }
    .bannerContent01 p {
        max-width: 100%;
        top: 0;
        padding: 12px 57px 0 0;
    }
    .banner01Social {
        display: none;
    }
    .servicePageSec .serPageTitle.tpTitle {
        top: -75px;
    }
    .servicePageSec .serPageTitle.tpTitle h2 {
        font-size: 110px;
        margin-bottom: -50px;
    }
    .port02Con {
        padding: 10px 10px 16px 20px;
    }
    .pd01SliderWrap {
        padding: 10px 0 40px;
    }
    .pfSliderWrap01 {
        padding: 20px 20px 50px 20px;
    }
    .portfolioSec01 .secTitle {
        line-height: 44px;
    }
    .contactSection02 .secTitle {
        line-height: 40px;
    }
    .errorSearchForm {
        margin: 54px 0px 39px 0;
    }
    .faqBannner {
        padding: 100px 0 100px;
    }
    .portfolio_details.faqSec {
        padding: 50px 0 0;
    }
    .faqBottomtext {
        padding: 50px 0 90px;
    }
    .faqBottomtext h2 {
        margin: 0 0 50px;
    }
}

/*----------------========----------------
/  12. max-width: 575px
/----------------========----------------*/
@media (max-width: 575px){
    .navAccess01 .idoniBtn01{
        display: none;
    }
    .bi04Meta, .postDateMeta, .postShareMeta, .postLikeMeta {
        column-gap: 15px;
    }
    .pfContent01{
        padding: 0px;
    }
    .pfContent01.slick-slide:not(.slick-current.slick-active){
        opacity: 0;
        visibility: hidden;
    }
    .pfContent01 h3 {
        font-size: 32px;
        line-height: 42px;
    }
    .pfContent01 {
        max-width: 360px;
        min-height: 350px;
    }
    .portfolioCat a {
        font-size: 16px;
    }
    .pfContentSlide {
        padding: 50px 30px;
    }
    .menu_btn {
        margin-right: 0;
    }
    .elementor .featured_image img, .featured_image img {
        object-fit: cover;
        min-height: 280px;
    }
    .bannerInner01 .bannerMain {
        padding: 30px 0 0 0;
    }
    .pageBanner01{
        padding: 80px 0 125px;
    }
    .bannerMain .bannerIdoni {
        font-size: 120px;
        margin: 18px 0 -58px 0;
        background-position: 35% 97.5%;
        letter-spacing: 30px;
    }
    .bannerContent01 h2,
    .bannerContent01 .banHead02 span {
        font-size: 40px;
    }
    .elementor .bannerContent01 img ,
    .bannerContent01 img {
        max-width: 100%;
        margin: 25px 236px 8px 0px;
    }
    .bannerContent01 p {
        padding: 12px 0 0;
    }
    .bannerContent01 .banHead02 span {
        margin-right: 5px;
    }
    .loaderAnim h2 {
        font-size: 24px;
        letter-spacing: 0.01em;
    }
    .loaderAnim h2 a {
        margin: 0 5px;
    }
    .counterTitle h2:first-child{
        width: 100%;
        margin: 0 0 10px;
    }
    .counterTitle {
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
    }
    .counterTitle p {
        display: none;
    }
    .counterTitle h2 span {
        margin-left: 10px;
    } 
    .faq01Image .idoniBtn02 {
        left: 0;
        right: auto;
        top: 95px;
    }
    .faqContent01 .secTitle {
        margin: 0 0 40px;
    }  
    .faqContent01 {
        padding: 0;
    }
    .swipeHvImage .swipeimage {
        right: 0;
    }
    .addressWidget{
        margin: 0 0 25px;

    }
    .addressWidget p {
        margin: 0px 0 15px 0;
    }
    .pageBannerTitle.blogSinglePB h2 {
        max-width: 100%;
    }
    .pageBannerTitle.blogSinglePB h2 > *{
        text-align: center !important;
    }
    .formWidget .widgetTitle{
        margin: 0 0 25px;
    }
    .pw03 .pageWidget {
        margin: 0 0 20px;
    }
    .formWidget {
        margin: 0 0 30px;
    }
    footer .formWidget .widgetTitle {
        margin: 0 0 15px;
    }
    .bannerh2 {
        top: -185px;
    }
    .bannerh2 h2 {
        font-size: 49px;
        line-height: 50px;
    }
    .bannerConTitle p {
        color: var(--tw-primary-color);
    }
    .bannerConTitle {
        margin: 80px 0 5px;
    }
    .bannerArea02 {
        padding: 100px 0 80px;
    }
    .bannerBatch img {
        max-width: 90px;
    }
    .abHistory02 {
        padding: 40px 0 0 0;
    }
    .abHistoryTest {
        padding-right: 0;
    }
    .aboutSec02 {
        padding: 0 0 30px;
    }
    .abWraper02 {
        padding-top: 40px;
    }
    .teamItemsWrap {
        grid-template-columns: repeat(1,1fr);
    }
    .teamSin01 .tm01Sin img {
        max-width: 100%;
    }
    .teamSecTitle h2 {
        font-size: 90px;
    }
    .awardSingle {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-align: start;
            -ms-flex-align: start;
                    -ms-grid-row-align: flex-start;
                align-items: flex-start;
        padding: 20px 0 20px;
    }
    .awardSingle.swipeHvImage .swipeimage {
        display: none;
    }
    .awardSingle span {
        margin: 7px 0 0;
    }
    .videoLayer {
        margin-top: 60px;
    }
    .videoSection {
        padding: 100px 0px 30px !important;
    }
    .videoSection .videoPlayBtn.active {
        -webkit-transform: scale(.7);
                transform: scale(.7);
    }
    .footerArea02 {
        padding: 50px 0 0;
    }
    .pageWidget ul li {
        line-height: 35px;
    }
    .footerArea02 .widgetInfo .footerSocial {
        margin: 30px 0 35px;
    }
    .footerArea02 .widget.pageWidget {
        margin: 0 0 20px;
    }
    .footerArea02 .copyRight {
        margin: 40px 0 0;
    }
    .footerArea02 .widgetInfo p {
        margin: 0 0 20px;
    }
    .footerArea02 .pw03 .pageWidget {
        margin: 0 0 20px;
    }
    .blog04Item h3 {
        font-size: 20px;
        line-height: 26px;
        margin: 0 0 8px;
    }
    .blog04Item p {
        line-height: 24px;
    }
    .pagePagination a, .pagePagination span {
        font-size: 14px;
        min-width: 35px;
        height: 35px;
        line-height: 35px;
        margin: 0 4px;
    }
    .bi04Author {
        padding: 5px 0 0px 42px;
    }
    .pageBannerTitle h2 {
        font-size: 26px;
        line-height: 32px !important;
    }
    .footerArea01 {
        padding: 50px 0 0;
    }
    .swipeHvImage .swipeimage {
        display: none;
    }
    .serviceWrap03 {
        grid-template-columns: repeat(1,1fr);
    }
    .serviceWrap03 .serSingle03:nth-child(3),
    .serviceWrap03 .serSingle03:nth-child(2) {
        margin-top: 40px;
    }
    .serviceSec03 {
        padding: 70px 0 150px;
    }
    .portfolioSec03 .portfWrap {
        margin: 27px 83px 0 auto;
    }
    .portfolioSec03 .portSecTitle {
        font-size: 100px;
    }
    .portfWrap .portfItem03.pf03 {
        margin-bottom: 60px;
    }
    .teamLoader02 {
        bottom: -1px;
    }
    .getTouchSection {
        padding: 60px 0 120px;
    }
    .getInfo2 {
        padding-left: 0;
    }
    .getInfoAddress {
        margin: 0 0 30px;
    }
    .getInfoAddress p {
        margin: 0 0 20px;
    }
    .getInfoAddress h3 {
        margin: 0 0 5px;
    }
    .getInfoAddress:last-child {
        margin-bottom: 30px;
    }
    .touchLoader {
        top: 65px;
    }
    .footerTop {
        margin: 0 0 30px;
    }
    .widget.pageWidget {
        margin: 0 0 60px;
    }
    .impConBtn .idoniBtn02 {
        margin: 0 5px;
    }
    .aboutSection02 .secTitle {
        margin: 0 0 24px;
        font-size: 32px;
        max-width: 365px;
        width: 100%;
        line-height: 38px;
    }
    .aboutSection02 .subTitle {
        margin: 0 0 10px;
    }
    .abConTab {
        margin: 0 0 45px;
    }
    .aboutSection02 {
        padding: 90px 0 280px;
    }
    .history01Item:after {
        display: none;
    }
    .hisPaperPlan, .hisPlus {
        display: none;
    }
    .historyYear:after {
        display: none;
    }
    .historyYear {
        padding: 0;
    }
    .historyCon {
        padding: 0;
    }
    .reverse .historyYear {
        padding: 0;
    }
    .reverse .historyCon {
        padding: 0;
    }
    .idoniHistory01 {
        padding: 0;
    }
    .history01Item {
        margin: 0;
    }
    .blog_nsb{
        padding-bottom: 60px;
    }
    .pw03 .widget.pageWidget {
        margin: 0 0 30px;
    }
    .portPageBanner {
        padding: 50px 0 0 !important;
    }
    .portPageBanner .pageBannerTitle{
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        text-align: center;
        margin: 0 0 50px;
    }
    .pageBannerTitle:after {
        display: none
    }
    .pageBannerTitle h2 {
        padding-right: 0;
        margin-bottom: 10px;
    }
    .pageBannerTitle h2 br{
        display: none;
    }
    .blogPageDetails {
        padding: 40px 0 0px;
    }
    .commentList ul {
        margin: 0;
    }
    .singleComment {
        padding: 40px 0 40px 0;
    }
    .blogDetContent .bi04Meta {
        margin: 10px 0 0;
    }
    .pageBannerTitle {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
    }
    .portGridWrap02 {
        grid-template-columns: repeat(1,1fr);
    }
    .portGridSection02 {
        padding: 70px 0;
    }
    .portGridSection02 .idoniBtn02 {
        margin-top: 30px;
    }
    .portGridWrap03 {
        grid-template-columns: repeat(1,1fr);
    }
    .header02 .header01Inner .idoniBtn03 {
        display: none;
    }
    .header02 .mainMenu ul li .sub-menu li a {
        padding-left: 30px;
    }
    .header02 .mainMenu > ul li > ul li:after {
        left: 15px;
    }
    .navAccess02 button {
        margin-left: 20px;
    }
    .topbar02 .topbarLeft a:last-child {
        display: none;
    }
    .header03:before {
        width: 46%;
    }
    .header03 .navAccess02 button {
        margin-left: 20px;
    }
    .slider01 .tparrows {
        width: 50px;
        height: 50px;
    }
    .slider01 .tparrows.tp-rightarrow {
        left: -130px !important;
    }
    .slider01 .tparrows.tp-leftarrow {
        top: 106% !important;
    }
    .slider01 {
        background: transparent;
    }
    .slider01:after {
        display: none;
    }
    .aboutUs03 {
        padding: 50px 0 50px;
    }
    .portfolioSec03 {
        padding: 0 0 50px;
    }
    .teamSection02 {
        padding: 50px 0 50px;
    }
    .testimonialItem03 {
        padding: 50px 24px 50px;
    }
    .blogSection03 {
        padding: 50px 0 50px;
    }
    .serviceDetAbout {
        padding: 60px 0 60px;
    }
    .integratSin.wordpress {
        margin-bottom: 0;
    }
    .integratSin.java span,
    .integratSin.html5 span {
        margin-top: 0;
    }
    .integratSin {
        margin-bottom: 50px !important;
    }
    .integratSin span {
        margin: 0 0 20px;
    }
    .serIntegration {
        padding: 50px 0 20px;
    }
    .serviceSec01 {
        padding: 18px 0 20px;
    }
    .secTitle {
        font-size: 35px;
        line-height: 40px;
    }
    .clientSection01 .row .col-lg-3{
        width: 50%;
    }
    .clientLogo img {
        max-width: 85%;
    }
    .serviceSec02 .secTitle {
        font-size: 24px;
        line-height: 32px;
        margin: auto auto 50px;
    }
    .testSlider03.owl-carousel .owl-stage-outer {
        padding: 0;
    }
    .abIconSingle {
        min-width: 100%;
    }
    .abIconSingle .abIcons span:first-child {
        font-size: 80px;
    }
    .abIconSingle h2 {
        font-size: 30px;
        margin: 0 0 12px;
    }
    .servicePageSec .serPageTitle {
        top: -53px;
        text-align: center;
    }
    .servicePageSec .serPageTitle h2 {
        font-size: 80px;
        margin-bottom: -40px;
        text-align: center;
    }
    .serWrapItem {
        grid-template-columns: repeat(1,1fr);
    }
    .serWrap03Item {
        grid-template-columns: repeat(1,1fr);
    }
    .impressWrap {
        top: -60px;
        margin-bottom: 0;
        margin-left: 2px !important;
    }
    .testimonialItem02 .secTitle {
        font-size: 38px;
        line-height: 45px;
    }
    .portfolio_details {
        padding: 50px 0 40px;
    }
    .mrSingle h3 {
        font-size: 20px;
    }
    .teamDetailsSec {
        padding: 50px 0 0px;
    }
    .footerArea01 .pw03{
        margin-top: 40px;
    }
    .widget.widgetInfo {
        margin-bottom: 50px;
    }
    .footerArea03 .pw03 {
        margin-top: 35px;
    }
    .tmDesctiption {
        padding: 40px 30px 60px 30px;
    }
    .servicePageSec .serPageTitle.tpTitle {
        top: -53px;
    }
    .servicePageSec .serPageTitle.tpTitle h2 {
        font-size: 80px;
        margin-bottom: -15px;
    }
    .testPageSec .testItem02 p {
        font-size: 18px;
        line-height: 28px;
    }
    .testPageSec {
        padding: 70px 0 50px;
    }
    .port02Con {
        padding: 10px 31px 16px 31px;
    }
    .portfolio_details.faqSec{
        padding: 70px 0;
    }
    .portfolioCat {
        margin-top: 30px;
    }
    .errorContent h2 {
        font-size: 150px;
    }
    .testItem02 .pdQuality{
        top: 5px;
    }
    .tm01Thumb img, .elementor .tm01Thumb img{
        max-width: 100%;
    }
}
/*----------------========----------------
/  13. max-width: 480px
/----------------========----------------*/
@media (max-width: 480px){
    .header03:before {
        width: 55%;
    }
    .serDetImg img {
        max-width: 100%;
    }
    .serviceDetAbout .abContent02 {
        padding: 50px 0 0;
    }
    .testWrap03 .testItem02 .pdQuality {
        display: none;
    }
    .testCarousel02  .testItem02 .pdQuality {
        float: left;
        top: 0;
        margin-top: 15px;
    }
    .moreReview {
        position: relative;
        left: 0;
        top: 12px;
        text-align: center;
    }
    .errorSearchForm {
        margin: 54px 0 39px 0;
    }
    .faqQuestion .accordion-item .accordion-button {
        font-size: 16px;
    }
    .faqQuestion .accordion-button:after {
        font-size: 12px;
    }
    .errorSearchForm input {
        height: 70px;
    }
    .errorSearchForm button {
        width: 70px;
        height: 70px;
        line-height: 70px;
        right: 70px;
        font-size: 18px;
    }
    .errorSearchForm a {
        background: var(--tw-primary-color);
        border: none;
        width: 70px;
        height: 70px;
        line-height: 70px;
        font-size: 18px;
    }
    .errorSearchForm input {
        padding: 0 138px 0 15px;
    }
    .postShareMeta {
        flex: 0 0 100%;
        text-align: right;
        justify-content: flex-end;
    }
    .pfContentSlide {
        padding: 50px 0px;
    }
    .portfolioSec04 .col-lg-6 {
        max-height: 450px !important;
    }
}
/*----------------========----------------
/  14. min-width: 320px & max-width: 410px
/----------------========----------------*/
@media (min-width: 320px) and (max-width: 410px){
    .bannerContent01 h2,
    .bannerContent01 span {
        font-size: 34px;
    }
    .bannerMain .bannerIdoni {
        font-size: 85px;
        margin: 18px 0 -41px 0;
        letter-spacing: 26px;
    }
    .secTitle {
        font-size: 28px;
        line-height: 38px;
    }
    .userCarText h2 {
        font-size: 24px;
        line-height: 26px;
    }
    .counterTitle h2 {
        font-size: 44px;
        line-height: 39px;
    }
    .counterTitle h2:first-child {
        margin: 0 0 0px;
    }
    .awardSingle p {
        white-space: nowrap;
        margin-right: 10px;
    }
    .counterTitle img {
        max-width: 70px;
    }
    .faqContent01 .secTitle br {
        display: none;
    }
    .faqContent01 .secTitle {
        font-size: 34px;
        line-height: 40px;
        margin: 0 0 35px;
    }
    .blogSection01 .secTitle {
        line-height: 32px;
        margin: 0 0 45px;
    }
    .conAddress h2 {
        font-size: 30px;
    }
    .conSocial01 a {
        min-height: 26px;
        line-height: 24px;
        padding: 0 5px;
        margin: 0 5px 5px 0;
    }
    .bannerh2 {
        top: -166px;
    }
    .bannerh2 h2 {
        font-size: 37px;
        line-height: 34px;
    }
    .abHistoryImg img {
        max-width: 145px;
        width: 100%;
    }
    .abHistoryTest p {
        margin: 0 0 15px;
    }
    .teamSecTitle h2 {
        font-size: 65px;
    }
    .videoLayer {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
    }
    .videoLayer h2 {
        margin-bottom: 15px;
    }
    .bi04Meta span:last-child {
        margin: 5px 0 0;
        display: inline-block;
    }
    .bi04Thumb .biCat {
        font-size: 14px;
        font-weight: 600;
        padding: 2px 12px 3px 12px;
        right: 20px;
        top: -16px;
    }
    .serviceSec03 .secTitle {
        font-size: 35px;
    }
    .portfolioSec03 .portSecTitle {
        font-size: 90px;
    }
    .portfContent {
        left: 22px;
        bottom: 58px;
    }
    .folioTitle_wrap{
        left: 22px;
    }
    .portfItem03 h2 {
        font-size: 24px;
    }
    .portfItem03 .portCat a {
        padding: 0 8px;
        margin-right: 0px;
        margin-bottom: 5px;
    }
    .portfolioSec03 {
        padding: 0 0 60px;
    }
    .touchLoader h2 {
        font-size: 80px;
        letter-spacing: 0;
    }
    .touchLoader img {
        width: 80px;
        height: 80px;
        left: 92px;
        top: -62px;
    }
    .footerTop{
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
    }
    .footerTop .flogo {
        display: none;
    }
    .footerTop ul li {
        margin: 0 17px;
    }
    .pageBanner01 .pageBannerTitle {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        text-align: center;
        margin: 0 0 50px;
    }
    .impressionSec .secTitle {
        font-size: 24px;
        line-height: 30px;
        margin: 0 0 38px;
    }
    .impConBtn {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
    }
    .impConBtn .idoniBtn02:first-child {
        margin: 0 0 10px;
    }
    .abIconSingle {
        width: 100%;
    }
    .historyYear h2 {
        font-size: 80px;
    }
    .historyCon h3 {
        margin: 0 0 10px;
    }
    .historyConItem {
        margin: 0 0 25px;
    }
    .historyCon p{
        font-size: 16px;
        line-height: 26px;
    }
    .idoniHistory01 {
        padding: 0 0 10px;
    }
    .blog_nsb{
        padding-bottom: 60px;
    }
    .commentReview {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-align: start;
            -ms-flex-align: start;
                    -ms-grid-row-align: flex-start;
                align-items: flex-start;
    }
    .review {
        margin: 10px 0 0;
    }
    .portGridSection03 {
        padding: 50px 0 50px;
    }
    .navAccess02 .dotBtn {
        display: none;
    }
    .topbar02 .topbarRight .topSocial {
        display: none;
    }
    .topbar02 .topbarItem {
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        padding: 7px 0;
        text-align: center;
    }
    .topbar02 .topbarLeft a {
        margin-right: 0;
    }
    .header03:before {
        width: 100%;
    }
    .header03 .hBtn {
        display: none;
    }
    .header03 .menu_btn{
        border: 1px solid var(--tw-white-color);
        background: transparent;
        border-radius: 4px;
    }
    .slider01 .tp-parallax-wrap{
        top: 0 !important;
    }
    .serCarItem01 .serviceImg {
        padding: 10px;
    }
    .serCarItem01 .serItemCon {
        bottom: 0;
    }
    .serCarItem01 h2 {
        font-size: 21px;
    }
    .serCarItem01 .idoniBtn02 {
        padding: 0 20px;
        min-height: 45px;
        line-height: 40px;
    }
    .portfolio_nav li {
        margin: 0 8px;
    }
    .slider01 .tp-captionHead{
        top: 80px;
        line-height: 150px !important;
    }
    .slider01 .text_style{
        top: 115px;
        line-height: 150px !important;
    }
    .slider01 .to_circle{
        top: 230px;
    }
    .slider01 .tparrows {
        display: none;
    }
    .portfolioCat a {
        font-size: 16px;
        min-height: 35px;
        line-height: 33px;
        padding: 0 12px;
        margin: 0 10px 10px 0;
    }
    .fbTestWrap .testItem02 .pdQuality{
        display: none;
    }
    .fbTestSlider .testItem02 {
        padding: 30px;
    }
    .fbTestSlider .testItem02 p {
        font-size: 16px;
        line-height: 24px;
        margin: 0 0 20px;
    }
    .feedbackSec01 .secTitle {
        font-size: 30px;
        line-height: 40px;
    }
    .ctaWrap01 {
        padding: 20px;
    }
    .ctaWrap01 h2 {
        font-size: 30px;
    }
    .servicePageSec .serPageTitle h2{
        font-size: 72px;
    }
    .impressionSec {
        padding: 0 0 50px;
    }
    .aboutSection02 {
        padding: 70px 0 280px;
    }
    .testimonialItem02 .secTitle {
        font-size: 30px;
        line-height: 35px;
    } 
    .faqImgWrap .idoniBtn02 {
        top: -29px;
    } 
    .servicePageSec .serPageTitle.tpTitle h2 {
        font-size: 65px;
    }
    .servicePageSec .serPageTitle.tpTitle {
        top: -45px;
    }
    .testPageSec .testItem02 {
        padding: 20px 20px 65px;
    }
    .testPageSec .testItem02 p {
        margin: 0 0 20px;
    }
    .testPageSec .testItem02 .pdQuality {
        float: left;
        top: 15px;
    }
    .tmDesctiption {
        padding: 40px 15px 60px 15px;
    }
    .blogSin02 h3 {
        font-size: 20px;
        line-height: 26px;
    }
    .contactSection02 .secTitle {
        line-height: 35px;
        margin: 0 0 35px;
    }
    .bi04Meta span {
        margin-left: 0;
        margin-bottom: 10px;
    }
}

/*----------------========----------------
/  14. min-width: 320px & max-width: 355px
/----------------========----------------*/
@media (min-width: 320px) and (max-width: 400px){
    .portfItem03 h2 {
        font-size: 21px;
    }
}