/*
    Template  Name: Creative
*/

/*
Table Of Content

1. header top area
2. main menu area
3. slider area
4. video slider area  
5. breadcum area
6. feature area
7. about area
8. service area
9. project area
10.counter area
11. call to action area
12. contact area
13. contact service
14. map area
15. testimonial area
16. team area
17. pricing area
18. faq area
19. blog area
20. brand area
21. portfolio area
22. project information area
23. single blog page area 
24.  footer area

*/

/* ======= site font family ==========*/
@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@400;500;600;700;800;900&display=swap');
:root{
    --blackc: #000;
    --whitec: #fff;
    --bgcolor: #1f2930;
    --brcolor: #f04651;
    --paracolor: #555;
    --titlecolor: #253138;
}

/* defult css */
body{
    font-size: 16px;
    font-weight: 400;
    line-height: 1.6;
    font-family: "Barlow Condensed", sans-serif;
    color: var(--paracolor);
}
h1,h2,h3,h4,h5,h6,h1 a,h2 a,h3 a,h4 a,h5 a,h6 a{
    font-size: 24px;
    font-weight: 700;
    color: var(--titlecolor);
    line-height: 1.2;
    font-family: "Barlow Condensed", sans-serif;
    padding: 0;
    margin-bottom: 10px;
    
}
h1{
    font-size: 30px;
}
h2{
    font-size: 24px;
}
h3{
    font-size: 22px;
}
h4{
    font-size: 18px;
}
h5{
    font-size: 16px;
}
h6{
    font-size: 15px;
}
a{
    font-size: 15px;
    font-weight: 500;
    text-decoration: none !important;
    color: var(--blackc);
    transition: .5s;
}
a:hover{
    color: var(--brcolor);
}
/* highlight color css */
.highlight{
    color: var(--brcolor);
}
/*======= header top area start =====*/
.header_top_area {
    padding: 10px 115px ;
    background-color: var(--whitec);
}
/* header left */
.header_left span, .header_right span, .header_left a{
    font-size: 15px;
    font-weight: 500;
    color: var(--paracolor);
}
.header_left span, .header_left a {
    margin: 0 22px 0 0;
}
.header_left span i,
.header_left a i{
    color: var(--brcolor);
    margin-right: 6px;
}
/* header top middle css */
.header_top_middle{
    text-align: center;
}
/* header right */
.header_right a {
    font-size: 15px;
    font-weight: 600;
    margin-left: 12px;
    color: var(--paracolor);
}
.header_right a:hover{
    color: var(--brcolor);
}
.header_right span i{
    margin-right: 5px;
}
/*======= header top area end ======*/

/*======== main menu area start ==========*/
.main_menu_area {
    padding: 0px 115px;
    transition: .5s;
}
.main_menu_area.sticky {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 9999;
    background: rgb(0 0 0 / 70%);
}
.main_menu_area .sticky_logo{
    display: none;
}
.main_menu_area.sticky .main_logo{
    display: none;
}
.main_menu_area.sticky .sticky_logo{
    display: block;
}
.main_menu_area.sticky .inner_main_nav_area >ul >li >a{
    color: var(--whitec);
}
.main_menu_area.sticky .inner_main_nav_area >ul >li >a:hover{
    color: var(--brcolor);
}
.main_menu_area.sticky .inner_main_nav_area >ul >li >a i{
    color: var(--whitec);
}
.main_menu_area.sticky .main_nav_icons >i{
    color: var(--whitec);
}
.main_menu_area.sticky .main_nav_right_text h3,
.main_menu_area.sticky .main_nav_right_text h3 a{
    color: var(--whitec);
}
.site_logo_area{
    margin-right: 15px;
}
/* main nav area css */
.main_nav_area {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.main_menu_all_item{
    align-items: center;
}
/* inner main nav area css */
.inner_main_nav_area ul {
    list-style: none;
    margin: 0;
    padding: 0;
}
.inner_main_nav_area >ul >li {
    display: inline-block;
    position: relative;
}
.inner_main_nav_area >ul >li >a {
    display: inline-block;
    margin: 35px 40px;
    font-size: 18px;
    font-weight: 500;
    text-transform: uppercase;
}
.inner_main_nav_area >ul >li >a>i {
    font-size: 14px;
    font-weight: 700;
    margin-left: 5px;
}
.inner_main_nav_area >ul> li> a:hover{
    color: var(--brcolor);
}
/* main nav icons together */
.main_nav_right_together {
    display: flex;
    align-items: center;
}
/* drop down menu css */
.inner_main_nav_area ul li .sub_menu{
    position: absolute;
    top: 130%;
    left: 0;
    width: 200px;
    text-align: left;
    margin: 0;
    padding: 15px 5px 14px;
    z-index: 9999;
    box-shadow: 0 0 30px rgb(0 0 0 / 9%);
    background-color: var(--whitec);
    opacity: 0;
    visibility: hidden;
    transition: .5s;
}
.inner_main_nav_area ul li .sub_menu li{
    position: relative;
}
.inner_main_nav_area ul li .sub_menu li a {
    display: inline-block;
    font-size: 18px;
    padding: 8px 17px;
}
.inner_main_nav_area ul li .sub_menu li a:hover{
    color: var(--brcolor);
    margin-left: 5px;
}
.inner_main_nav_area >ul >li:hover .sub_menu{
    top: 100%;
    opacity: 1;
    visibility: visible;
}
.inner_main_nav_area .sub_menu >li > ul.sub_menu{
    top: 130%;
    left: 100%;
    opacity: 0;
    visibility: hidden;
    transition: .5s;
}
.inner_main_nav_area ul li .sub_menu li:hover  ul.sub_menu{
    top: 0;
    opacity: 1;
    visibility: visible;
}
/* main menu socail css */
.main_menu_socail a{
    display: inline-block;
    font-size: 22px;
    height: 35px;
    line-height: 35px;
    margin: 0 3px;
    width: 35px;
    border-radius: 100%;
    text-align: center;
    background-color: var(--brcolor);
    color: var(--whitec);
}
.main_menu_socail a:hover{
    background-color: var(--bgcolor);
    color: var(--whitec);
}
/* main nav icons together */
.gogrin_right_area {
    display: flex;
    align-items: center;
}
.main_nav_icons_together {
    display: flex;
    align-items: center;
}
/* main nav icons */
.main_nav_icons >i {
    display: inline-block;
    width: 36px;
    height: 36px;
    line-height: 36px;
    text-align: center;
    border-radius: 100%;
    background-color: var(--brcolor);
    color: var(--whitec);
    font-size: 17px;
    cursor: pointer;
    transition: .5s;
}
.main_nav_icons >i:hover{
    background-color: var(--bgcolor);
    color: var(--whitec);
}
/* nav icon popup css */
.nav_icon_popup {
    position: fixed;
    top: -110%;
    left: 0%;
    background: #000000f0;
    display: flex;
    align-items: center;
    width: 100%;
    height: 100%;
    z-index: 999;
    opacity: 0;
    visibility: hidden;
    transition: 1s;
}
.nav_icon_popup.icon_popup {
    opacity: 1;
    visibility: visible;
    top: 0;
}
/* inner nav icon popup */
.inner_nav_icon_popup {
    width: 47%;
    margin: 0 auto;
    position: relative;
}
.inner_nav_icon_popup input{
    font-size: 30px;
    font-weight: 500;
    padding: 17px 40px 15px 15px;
    width: 100%;
    border: none;
    outline: none;
    box-shadow: 0px 0px 30px 0px #dddddd45;
    background: var(--whitec);
    border-radius: 10px;
}
.inner_nav_icon_popup input::placeholder{
    font-size: 30px;
}
/* inner nav popup form icons css */
.inner_nav_popup_form_icons {
    position: absolute;
    top: 35%;
    right: 10px;
    transform: translateY(-50%);
}
.inner_nav_popup_btnicon{
    font-size: 40px;
    border: none;
    outline: none;
    background: none;
}
.inner_nav_icon_popup i{
    display: inline-block;
    margin-top: 10px;
    width: 36px;
    height: 36px;
    line-height: 36px;
    text-align: center;
    border-radius: 100%;
    background-color: var(--whitec);
    color: var(--blackc);
    font-size: 25px;
    cursor: pointer;
    transition: 1s;
}
/* main nav icons middle css */
.main_nav_icons_middle {
    margin-left: 18px;
    position: relative;
}
.main_nav_icons_middle a {
    position: relative;
    font-size: 20px;
    cursor: pointer;
    padding: 8px;
    display: inline-flex;
    background: var(--whitec);
    box-shadow: 0 0 5px #64333338;
    border-radius: 100%;
}
.main_nav_icons_middle a span {
    position: absolute;
    top: 0;
    right: -5px;
    width: 18px;
    height: 20px;
    font-size: 12px;
    line-height: 20px;
    text-align: center;
    background-color: var(--brcolor);
    border-radius: 100%;
    color: var(--whitec);
}
.main_nav_middle_box_item {
    overflow: scroll;
    position: absolute;
    right: 0;
    top: 130%;
    width: 300px;
    height: 300px;
    z-index: 999;
    opacity: 0;
    visibility: hidden;
    background-color: var(--whitec);
    transition: .5s;
}
.main_nav_icons_middle:hover .main_nav_middle_box_item{
    top: 180%;
    opacity: 1;
    visibility: visible;
}
.main_nav_middle_box_item p{
    padding: 20px;
}
/* main nav btn css */
.main_nav_btn {
    margin-left: 20px;
}
.main_nav_btn a {
    display: inline-block;
    border-radius: 5px;
    padding: 16px 50px;
    font-size: 18px;
    font-weight: 500;
    background-color: var(--whitec);
    color: var(--brcolor);
}
.main_nav_btn a:hover{
    background-color: var(--bgcolor);
    color: var(--whitec);
}
/* absolute menu css */
.absolute_menu {
    position: absolute;
    left: 0;
    right: 0;
    z-index: 999;
    background: transparent;
    padding: 0 115px 0;
}
/* home 2 main menu css */
.h2_menu_area{
    background: var(--brcolor);
}
.h2_menu_area .main_nav_area{
    justify-content: end;
}
.h2_menu_area .inner_main_nav_area >ul >li >a{
    color: var(--whitec);
}
/* home 3 main menu css */
.h3_menu_area .main_nav_area{
    justify-content: space-between;
}
/* home 4 main menu css */
.h4_menu_area .main_nav_area{
    justify-content: end;
}
.h4_menu_area .main_menu_all_item{
    position: relative;
}
.h4_menu_area .inner_main_nav_area >ul >li >a{
    margin: 35px 0 35px 80px;
}
/*======== main menu area end ==========*/

/*======== hamburger menu start ========*/
.dvrm {
    opacity: 0;
    -webkit-transition: .7s;
    transition: .7s;
    position: relative;
    left: 600px
}
.dvrm {
    margin-right: 80px;
    top: 0
}
.dvrm.nav-show {
    opacity: 1;
    left: 0;
    transition: .5s
}
.hamburger {
    background: var(--brcolor);
    border: 0 none;
    color: inherit;
    cursor: pointer;
    display: inline-block;
    font: inherit;
    margin: 0;
    overflow: visible;
    padding: 20px 15px;
    position: absolute;
    right: 0;
    text-transform: none;
    top: 50%;
    transform: translateY(calc(-50%));
    transition-duration: .5s;
    transition-property: opacity,filter,-webkit-filter;
    transition-timing-function: linear;
    z-index: 99;
    outline: 0
}
.hamburger.is-active .hamburger-box {
    height: 17px
}
.hamburger-box {
    display: inline-block;
    height: 16px;
    position: relative;
    width: 36px;
    margin: auto
}
.hamburger-inner {
    display: block;
    top: 50%
}
.hamburger-inner,.hamburger-inner::after,.hamburger-inner::before {
    background-color: var(--whitec);
    border-radius: 4px;
    height: 3px;
    position: absolute;
    transition-duration: .15s;
    transition-property: transform,-webkit-transform;
    transition-timing-function: ease;
    width: 35px
}
.hamburger-inner::after,.hamburger-inner::before {
    content: "";
    display: block
}
.hamburger-inner::before {
    top: -10px
}
.hamburger-inner::after {
    bottom: -10px
}
.hamburger--slider .hamburger-inner {
    top: 2px
}
.hamburger--slider .hamburger-inner::before {
    top: 10px;
    transition-property: opacity,-webkit-transform;
    transition-property: transform,opacity;
    transition-property: transform,opacity,-webkit-transform;
    transition-timing-function: ease;
    transition-duration: .2s
}
.hamburger--slider .hamburger-inner::after {
    top: 20px
}
.hamburger--slider.is-active .hamburger-inner {
    -webkit-transform: translate3d(0,10px,0) rotate(45deg);
    transform: translate3d(0,10px,0) rotate(45deg)
}
.hamburger--slider.is-active .hamburger-inner::before {
    -webkit-transform: rotate(-45deg) translate3d(-5.71429px,-6px,0);
    transform: rotate(-45deg) translate3d(-5.71429px,-6px,0);
    opacity: 0
}
.hamburger--slider.is-active .hamburger-inner::after {
    -webkit-transform: translate3d(0,-20px,0) rotate(-90deg);
    transform: translate3d(0,-20px,0) rotate(-90deg)
}
.hamburger--slider-r .hamburger-inner {
    top: 2px
}
.hamburger--slider-r .hamburger-inner::before {
    top: 10px;
    transition-property: opacity,-webkit-transform;
    transition-property: transform,opacity;
    transition-property: transform,opacity,-webkit-transform;
    transition-timing-function: ease;
    transition-duration: .2s
}
.hamburger--slider-r .hamburger-inner::after {
    top: 20px
}
.hamburger--slider-r.is-active .hamburger-inner {
    transform: translate3d(0,10px,0) rotate(-45deg)
}
.hamburger--slider-r.is-active .hamburger-inner::before {
    -webkit-transform: rotate(45deg) translate3d(5.71429px,-6px,0);
    transform: rotate(45deg) translate3d(5.71429px,-6px,0);
    opacity: 0
}
.hamburger--slider-r.is-active .hamburger-inner::after {
    -webkit-transform: translate3d(0,-20px,0) rotate(90deg);
    transform: translate3d(0,-20px,0) rotate(90deg)
}
/*======== hamburger menu end ========*/

/*======== mobile menu area start ==========*/
.mobile_logo_area{
    padding: 20px 0;
    display: none !important;
}
.mean-container a.meanmenu-reveal {
    display: none !important;
}
.mean-container .mean-nav > ul {
    padding: 0;
    margin: 0;
    width: 100%;
    list-style-type: none;
    display: block !important;
}
.mean-container .mean-bar {
    background: #fff;
    padding: 0;
}
.mean-container .mean-nav ul li {
    border-top: 0px solid #ddd;
}
.mean-container .mean-nav ul li li a,
.mean-container .mean-nav ul li a {
    color: #444;
}
.mean-container .mean-nav ul li li a {
    border-top: 1px solid #ddd;
}
.mean-container .mean-nav ul li a:hover {
    color: #ff4a17;
}
.mobile_p {
    position: fixed;
    right: 0;
    width: 300px;
    padding: 80px 20px 0px;
    overflow-y: scroll;
    top: 0;
    height: 100%;
    z-index: 9999;
    display: block;
    transition: 0.5s all;
    box-shadow: 0 0 30px rgb(0 0 0 / 7%);
    transform: translateX(100%);
    background: var(--whitec);
}
.tx-s-open {
    transform: translateX(0);
}
.mobile_p .tuetion_theme_widget > div.widget_block {
    padding: 0;
}
.mobile_p .tuetion_theme_widget > div {
    padding: 20px 0px 20px;
    box-shadow: none;
}
.mean-container .mean-nav ul li a {
    border: 0;	
    width: 100%;
    border-top: 1px solid #ddd;	
    font-size: 14px;
    padding: 12px 5px;
    font-weight: 500;
    display: block;
}
.mean-container .mean-nav ul li a.mean-expand {
    width: auto;
}
.mobile_opicon {
    text-align: right;
    padding: 4px 0;
}
.mean-container .mean-nav > ul > li:first-child > a {
    border-top: 0;
}
.mobilemenu_con {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.mobile_menu_o  i {
    font-size: 26px;
}
.mobile_menu_content .mobile_menu_logo {
    margin-bottom: 20px;
}
.mobile_cicon {
    position: absolute;
    right: 30px;
    top: 50px;
}
.mobile_overlay {
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    opacity: 0;
    z-index: 999;
    width: 100vw;
    height: 100vh;
    visibility: hidden;
    position: fixed;
    background: rgba(0, 0, 0, 0.8);
    transition: all 0.3s ease-out 0s;
}
.mobile_overlay.mactive {
    opacity: 1;
    visibility: visible;
}
/*======== mobile menu area end ==========*/

/*======== slider area start  ==========*/
.inner_slider_area {
    height: 950px;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    display: flex !important;
    align-items: center;
    position: relative;
}
.inner_slider_content {
    width: 81%;
    margin: 45px auto 0;
}
.inner_slider_content h1 {
    font-size: 16px;
    font-weight: 500;
}
.inner_slider_content h2 {
    width: 70%;
    font-size: 80px;
    line-height: 1;
    margin-bottom: 5px;
}
.inner_slider_content p {
    font-size: 18px;
    width: 37%;
    margin: 20px 0 35px;
}
/* slider shap css */
.slider_animate_img {
    position: absolute;
    top: 240px;
    right: 50px;
    animation: witr_movelr_box45 5s linear 1s infinite alternate running;
}
@keyframes witr_movelr_box45 {
    0%{
        -webkit-transform: translateX(0px);
                transform: translateX(0px);
      }
    100%{
        -webkit-transform: translateX(45px);
                transform: translateX(45px);
      }
}
.slider_animate_shap2 {
    position: absolute;
    top: 0;
    right: 19%;
    animation: witr_movelr_box45 5s linear 1s infinite alternate running;
}
/* home 2 slider css */
.h2_inner_slider{
    height: 644px;
}
.h2_inner_slider .inner_slider_content h2{
    font-weight: 900;
    font-size: 90px;
}
.h2_inner_slider .inner_slider_content h2.color{
    color: var(--brcolor);
}
.h2_inner_slider .slider_animate_img {
    top: 90px;
    right: 100px;
}
/* home 3 slider css */
.h3_inner_slider{
    height: auto;
}
.h3_inner_slider .inner_slider_content {
    text-align: center;
    padding: 130px 0px 700px 0px;
    margin: 0 auto;
}
.h3_inner_slider .inner_slider_content h1 {
    font-size: 18px;
    margin-bottom: 15px;
}
.h3_inner_slider .inner_slider_content h2{
    width: 100%;
}
/* home 4 slider css */
.h4_inner_slider{
    height: 1004px;
}
.h4_inner_slider .inner_slider_content {
    text-align: center;
    margin: -55px auto 0;
}
.h4_inner_slider .inner_slider_content h1{
    font-weight: 600;
    margin: 0;
}
.h4_inner_slider .inner_slider_content h2{
    width: 100%;
    font-size: 110px;
    font-weight: 500;
}
.h4_inner_slider .inner_slider_content p{
    width: 53%;
    margin: 20px auto 35px;
}
/* home 4 slider socail css */
.h4_slider_socail {
    position: absolute;
    bottom: 245px;
    right: 95px;
}
.h4_slider_socail a{
    display: inline-block;
    margin: 0 10px;
    height: 35px;
    width: 35px;
    line-height: 35px;
    text-align: center;
    font-size: 20px;
    background-color: var(--bgcolor);
    color: var(--whitec);
}
.h4_slider_socail a:hover{
    background-color: var(--brcolor);
    color: var(--whitec);
}
/* golobal btn css */
.g_btn a {
    display: inline-block;
    padding: 24px 70px 24px 70px;
    font-size: 18px;
    background-color: var(--brcolor);
    color: var(--whitec);
    margin-right: 15px;
}
.g_btn a:hover{
    background-color: var(--bgcolor);
    color: var(--whitec);
}
.g_btn a.active{
    background-color: var(--bgcolor);
    color: var(--whitec);
}
.g_btn a.active:hover{
    background-color: var(--brcolor);
    color: var(--whitec);
} 
/* btn 2 */
.g_btn2 a{
    color: var(--brcolor);
    font-size: 24px;
    border-style: solid;
    border-width: 0px 0px 2px 0px;
}
/* golobal slick defult arrow css */
.slick-prev , .slick-next{
    position: absolute;
    top: 50%;
    width: 55px;
    height: 55px;
    line-height: 55px;
    z-index: 9999;
    outline: none;
    border: none;
    font-size: 0;
    background: none;
    transform: translateY(-50%);
    transition: 1s;
    z-index: 1;
    opacity: 0;
    visibility: hidden;
}
.slick-prev{
    left: -60px;
}
.slick-next{
    right: -40px;
}
.slick-prev::before ,.slick-next::before{
    content: '\ea93';
    font-family: IcoFont;
    display: inline-block;
    width: 55px;
    height: 55px;
    line-height: 55px;
    font-size: 40px;
    background-color: var(--brcolor);
    color: var(--whitec);
    transition: 1s;
}
.slick-next::before{
    content: '\ea94';
}
.slick-prev:hover::before ,.slick-next:hover::before{
    background-color: var(--bgcolor);
    color: var(--whitec)
}
/* slider defult arrow css */
.slider_area:hover .slick-prev, .slider_area:hover .slick-next {
    background: none;
    width: 55px;
    height: 55px;
    line-height: 55px;
    border-radius: 0;
    opacity: 1;
    visibility: visible;
}
.slider_area .slick-prev{
    left: 0;
}
.slider_area .slick-next{
    right: 10px;
}
.slider_area .slick-prev::before ,.slider_area .slick-next::before{
    content: '\eac9';
    font-family: IcoFont;
    color: var(--whitec);
    display: inline-block;
    background: 0 0;
    width: 60px;
    height: 60px;
    line-height: 60px;
    border-radius: 0;
    font-size: 50px;
    font-weight: 700;
}
.slider_area .slick-next::before{
    content: '\eaca';
}
.slider_area .slick-prev:hover::before ,.slider_area .slick-next:hover::before{
    color: var(--whitec);
}
/*======== slider area end  ==========*/

/*======== breadcum area start  ==========*/
.breadcum_area {
    background-size: cover;
    background-position: center center;
    padding: 60px 0 60px;
}
.inner_breadcum_area h1{
    font-size: 30px;
}
.inner_breadcum_area ul{
    list-style: none;
    margin: 0;
    padding: 0;
}
.inner_breadcum_area ul li{
    display: inline-block;
}
.inner_breadcum_area ul li a{
    display: inline-block;
    font-size: 16px;
    font-weight: 400;
}
.inner_breadcum_area ul li i, .inner_breadcum_area ul li a i {
    font-size: 22px;
}
/*======== breadcum area end  ==========*/

/*======== video slider area start  ==========*/
.video_slider_area{
    position: relative;
    height: 100%;
    overflow: hidden;
}
.video_slider_area::before {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: -1;
    background-color: #00000057;
}
.witr_youtube_video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: -99;
    transform: scale(1.2);
}
.witr_youtube_video iframe {
    width: 100%;
    height: 100%;
    border: none;
}
.video_slider_area .inner_slider_content h1,
.video_slider_area .inner_slider_content h2,
.video_slider_area .inner_slider_content h3,
.video_slider_area .inner_slider_content p{
    color: var(--whitec);
}
/*======== video slider area end  ==========*/

/*======= feature area start =======*/
.feature_area {
    padding: 150px 0 50px;
}
/* home 4 feature css */
.h4_feature_area{
    padding: 80px 0 50px;
}
.single_feature{
    position: relative;
    margin-bottom: 20px;
}
.single_feature h2 a{
    position: relative;
}
.single_feature h2 a::before {
    content: "";
    position: absolute;
    top: 20px;
    right: -60px;
    width: 54px;
    height: 1px;
    background: var(--brcolor);
}
.feature_number {
    position: absolute;
    top: -140px;
    right: 30px;
    z-index: -1;
}
.feature_number span{
    color: #EEEEEE;
    font-size: 230px;
    font-weight: 700;
}
/*======= feature area end =======*/

/*======= home 3 feature start =======*/
.h3_feature_area {
    padding: 120px 0 30px;
}
.h3_fea_border{
    border-bottom: 1px dashed var(--brcolor);
}
.h3_single_feature{
    position: relative;
}
.h3_single_feature img{
    width: 100%;
}
.h3_feature_cont {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.h3_feature_cont h2 a{
    color: var(--whitec);
}
/*======= home 3 feature end =======*/

/*======= about area start  ========*/
.about_area {
    padding: 70px 0 50px;
    position: relative;
}
/* single page about */
.single_page_about{
    padding: 110px 0 40px;
}
.inner_about_img{
    margin-bottom: 20px;
    animation: witr_movelr_box45 5s linear 1s infinite alternate running;
}
/* sectio title all */
.section_border {
    padding-bottom: 10px;
    margin-bottom: 75px;
    border-bottom: 4px solid var(--bgcolor);
}
.section_title_area{
    position: relative;
    margin-bottom: 70px;
}
.about_area .section_title_area{
    margin-bottom: 0;
}
.section_title_area h2{
    font-size: 16px;
    font-weight: 500;
}
.section_title_area h3 {
    font-size: 48px;
    background: linear-gradient(to right, #f00, #f00, #f00);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: shimmer 4.5s infinite;
    background-repeat: no-repeat;
    background-color: var(--titlecolor);
    -webkit-background-size: 200px 100%;
    -moz-background-size: 200px 100%;
    -ms-background-size: 200px 100%;
    -o-background-size: 200px 100%;
}
/* section style 2 */
.section_title_area.style2 img{
    margin-bottom: 10px;
}
.section_title_area.style2 p {
    width: 55%;
    margin: auto;
}
@keyframes shimmer {
    0% {
        background-position: top left
    }

    to {
        background-position: top right
    }
}
.section_title_area.margin0{
    margin: 0;
}
.section_btn a{
    font-size: 16px;
    font-weight: 400;
    color: var(--brcolor);
}
.section_btn a:hover{
    color: var(--bgcolor);
}
/* about name title css */
.about_name_title {
    display: flex;
    align-items: center;
}
.about_name_img{
    margin-right: 15px;
}
.about_name_cont h4{
    font-size: 16px;
    font-weight: 600;
}
.about_name_cont h4 span{
    font-size: 14px;
    font-weight: 400;
    color: var(--brcolor);
}
.about_shap_top , .about_shap_bottom{
    position: absolute;
    z-index: -1;
    animation: witr_movelr_box45 5s linear 1s infinite alternate running;
}
/* about shap css */
.about_shap_top {
    top: -50px;
    left: 80px;
}
.about_shap_bottom {
    bottom: -70px;
    right: 140px;
}
/*======== about area end  ==========*/

/*======== home 2 about start  ==========*/
.h2_about_area{
    padding: 50px 0 0px;
}
.h2_about_main {
    padding: 15px 0 0;
}
.h2_about_thumb h1{
    font-size: 72px;
    color: var(--brcolor);
    margin: 0;
}
/* home  3 about css */
.h3_about_area {
    padding: 65px 0 50px;
}
.h3_about_serivce {
    margin: 20px  0 0;
}
.h3_about_serivce p{
    width: 80%;
}
.h3_about_area .about_shap_bottom {
    bottom: 100px;
}
/*======= home 2 about end  ========*/

/*======== domaincheck area start  ==========*/
.domaincheck_area {
    padding: 0px 50px 70px;
}
.domain_check_all {
    padding: 60px 40px;
    background-color: var(--brcolor);
}
.inner_domain_ch_form input{
    width: 100%;
    border: none;
    height: 55px;
    padding: 0 20px;
}
.inner_domain_ch_link select {
    width: 100%;
    height: 55px;
    padding: 0 20px;
    border: none;
}
.inner_domain_ch_link select:focus{
    outline: none;
}
.inner_domain_ch_btn button {
    width: 100%;
    font-size: 18px;
    font-weight: 600;
    border: none;
    outline: none;
    background: var(--bgcolor);
    padding: 14px 30px 13px;
    color: var(--whitec);
}
/*======= domaincheck area end  ========*/

/*======= circle progress start ======*/
.circle_progress_bar{
    padding: 60px 0 50px;
}
.witr_cp_class {
    position: relative;
}
span.witr_cir_text {
    color: var(--brcolor);
    font-size: 72px;
    font-weight: 500;
}
span.witr_cir_text {
    position: absolute;
    content: "";
    left: 50%;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
    font-weight: 700;
}
.witr_circle_title {
    margin-top: 30px;
}
.cir_witr .allcostyle {
    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0);
    margin: 0 0 35px 0;
    padding: 0;
    border: none;
}
.cir_witr .allcostyle h2 {
    margin: 16px 0 8px 0;
}
.prog_page_cir {
    margin: 0;
}
.prog_page_cir .cir_inner {
    padding: 0;
}
.prog_page_cir .witr_circle_area{
    margin-right: 25px;
    margin-left: 25px;
}
/*======= circle progress end =====*/

/*========  service area start ========*/
.service_area{
    position: relative;
    padding: 40px 0 40px;
}
/* single page service */
.single_page_service{
    padding: 85px 0 20px;
}
.single_service {
    margin-bottom: 35px;
}
.single_service h2 {
    margin-bottom: 20px;
}
.single_service p{
    width: 90%;
}
/* service shap */
.service_shap {
    position: absolute;
    top: 40px;
    left: 10px;
    z-index: -1;
    animation: witr_movelr_box45 5s linear 1s infinite alternate running;
}
/*========  service area end =======*/

/*======== home 2 servicestart  ==========*/
.h2_service_area {
    padding: 55px 0 50px;
}
/* site page service */
.h2_site_service{
    padding: 80px 0 40px;
}
/* single service area css */
.h2_single_service {
    position: relative;
    width: 100%;
    height: 380px;
    margin-bottom: 20px;
}
.h2_single_service_front, .h2_single_service_back{
    backface-visibility: hidden;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 1px solid var(--bgcolor);
    transform: perspective(1000px) rotateY(0deg);
    transition: 1s;
    background-color: var(--whitec);
}
/* single service front css */
.h2_single_service_ss_front_3d {
    width: 100%;
    padding: 0 40px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.h2_single_service_ss_front_3d h2 a{
    display: inline-block;
    margin: 30px 0 5px;
}
.h2_ser_btn a{
    font-size: 18px;
    color: var(--brcolor);
}
/* single service back css */
.h2_single_service_back{
    background-size: cover;
    background-repeat: no-repeat;
    transform: perspective(1000px) rotateX(-180deg);
    position: relative;
    width: 100%;
    height: 100%;
    z-index: 1;
}
.h2_single_service_back::before{
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: var(--brcolor);
    z-index: -1;
}
/* single service back 3d css */
.h2_single_service_ss_back_3d {
    width: 100%;
    padding: 0 40px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.h2_single_service_ss_back_3d p{
    color: var(--whitec);
}
.h2_single_service_ss_back_3d h2 a{
    display: inline-block;
    margin-top: 30px;
    color: var(--whitec);
}
.h2_single_service:hover .h2_single_service_front{
    transform: perspective(1000px) rotateX(180deg);
}
.h2_single_service:hover .h2_single_service_back{
    transform: perspective(1000px) rotateX(0deg);
}
/*======== home 2 service end  ==========*/

/*======= home 3 service start  ========*/
.h3_service_area{
    position: relative;
    padding: 50px 0 50px;
}
.h3_single_service{
    margin-bottom: 20px;
}
.h3_single_service i {
    display: inline-block;
    font-size: 30px;
    width: 70px;
    height: 70px;
    line-height: 70px;
    text-align: center;
    border-radius: 50%;
    background-color: var(--brcolor);
    color: var(--whitec);
    margin-bottom: 25px;
    transition: .5s;
}
.h3_single_service:hover i{
    transform: rotateY(180deg);
}
/* section down btn css */
.section_down_btn {
    margin-top: 55px;
}
.section_down_btn a{
    display: inline-block;
    width: 100%;
    padding: 15px 30px;
    background-color: var(--brcolor);
    color: var(--whitec);
    font-size: 18px;
}
.section_down_btn a:hover{
    background-color: var(--bgcolor);
    color: var(--whitec);
}
/* service shap css */
.h3_service_left_shap, .h3_service_right_shap {
    position: absolute;
    top: 100px;
    z-index: -1;
    animation: witr_movelr_box45 5s linear 1s infinite alternate running;
}
.h3_service_left_shap{
    left: 100px;
}
.h3_service_right_shap {
    right: 300px;
}
/*======= home 3 service end  ========*/

/*===== project area start  ====*/
.project_area {
    padding: 50px 0px 50px;
}
/* home 4 project css */
.h4_project_area{
    padding: 80px 0px 50px;
}
.single_project_img {
    margin-bottom: 20px;
    box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.1);
    position: relative;
    overflow: hidden;
}
.inner_pro_img img{
    width: 100%;
    transition: .5s;
}
.single_project_img:hover .inner_pro_img img{
    transform: scale(1.2);
}
/* project popup css */
.project_popup {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    opacity: 0;
    visibility: hidden;
    transition: .5s;
}
.single_project_img:hover .project_popup{
    opacity: 1;
    visibility: visible;
}
.project_popup a{
    border-radius: 5px;
    display: inline-block;
    font-size: 25px;
    width: 50px;
    height: 50px;
    line-height: 50px;
    text-align: center;
    background-color: var(--brcolor);
    color: var(--whitec);
}
/* project img overlay css */
.project_img_overlay{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: var(--blackc);
    opacity: .5;
    transform: scale(0);
    transition: .5s;
}
.single_project_img:hover .project_img_overlay{
    transform: scale(1.2);
}
/* inner project content css */
.inner_pro_content {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    position: absolute;
    padding: 30px 50px 22px;
    right: 0;
    left: 0;
    margin: 0 auto;
    bottom: -260px;
    background-color: var(--bgcolor);
    transition: .5s;
    z-index: 999;
}
.single_project_img:hover .inner_pro_content{
    bottom: 0;
}
.inner_pro_text h2 a,
.inner_pro_icon a{
    color: var(--whitec);
    margin: 0;
}
/*===== project area end  ====*/

/*======== team area start ==========*/
.team_area {
    padding: 120px 0 35px;
    position: relative;
}
.inner_team_area{
    position: relative;
    margin-bottom: 20px;
    box-shadow: 0 0 10px #dddddd82;
}
.team_img_area{
    position: relative;
    overflow: hidden;
}
.team_img_area img{
    width: 100%;
    transition: .5s;
}
.inner_team_area:hover .team_img_area img{
    transform: scale(1.2);
}
/* team socail css */
.team_socail {
    position: absolute;
    bottom: -300px;
    right: 20px;
    display: grid;
    transition: .5s;
}
.inner_team_area:hover .team_socail{
    bottom: 70px;
}
.team_socail a{
    display: inline-block;
    margin: 5px 0;
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    border-radius: 5px;
    font-size: 14px;
    background-color: var(--brcolor);
    color: var(--whitec);
}
.team_socail a:hover{
    background-color: var(--bgcolor);
    color: var(--whitec);
}
/* team overlay css */
.team_overlay{
    position: absolute;
    top: 0;
    left: 100%;
    width: 100%;
    height: 100%;
    transition: .5s;
    background-color: #0000009c;
}
.inner_team_area:hover .team_overlay{
    left: 0;
}
/* inner team content css */
.inner_team_content {
    text-align: center;
    background-color: var(--whitec);
    padding: 22px 30px;
}
.inner_team_content p
,.inner_team_content h2{
    margin: 0;
}
.inner_team_content p{
    color: var(--brcolor);
}
/* inner team absoute icon css */
.inner_team_absol_icon {
    position: absolute;
    bottom: 120px;
    right: 20px;
    transition: .5s;
}
.inner_team_absol_icon a {
    display: inline-block;
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    border-radius: 5px;
    font-size: 14px;
    background-color: var(--brcolor);
    color: var(--whitec);
}
/*======== team area end ==========*/

/*===== testimonial area start ====*/
.testimonial_area{
    padding: 50px 0 50px;
}
/* single page testi */
.single_page_testi{
    padding: 115px 0 40px;
}
.inner_testimonial{
    position: relative;
}
.inner_testi_para p {
    width: 85%;
    font-size: 24px;
    font-weight: 600;
    color: var(--titlecolor);
}
.inner_testi_title h3{
    font-size: 16px;
    font-weight: 600;
}
.inner_testi_title{
    font-size: 14px;
    color: var(--brcolor);
}
.testi_icon {
    position: absolute;
    top: -20px;
    right: 0;
    z-index: -1;
}
.testi_icon i{
    font-size: 150px;
    color: var(--brcolor);
}
/* slick dots css */
.slick-dots{
    list-style: none;
    margin: 0;
    padding: 0;
}
.slick-dots li{
    display: inline;
}
.slick-dots li button{
    width: 30px;
    height: 3px;
    background-color: var(--bgcolor);
    font-size: 0;
    border: none;
    outline: none;
    margin: 0 10px 0 0;
}
.slick-dots li.slick-active button{
    background-color: var(--brcolor);
}
/*===== testimonial area end ====*/

/*===== home 2 testimonial start ====*/
.h2_testimonial_area {
    padding: 80px 0 70px;
}
/* testimonial site page */
.h2_site_testi{
    padding: 70px 0 0px;
}
.h2_testi_width {
    max-width: 1560px;
}
.h2_tesi_all{
    margin-bottom: 20px;
}
.h2_testi_icon {
    padding: 17px 0 15px;
}
.h2_testi_icon i{
    font-size: 22px;
    color: var(--brcolor);
}
.h2_testi_title {
    border-top: 1px solid var(--brcolor);
    padding-top: 15px;
}
.h2_testi_title h2{
    font-size: 20px;
    margin: 0;
}
.h2_testi_title p{
    color: var(--brcolor);
    text-transform: uppercase;
    font-weight: 500;
}
/*===== home 2 testimonial end ====*/

/*===== home 3 testimonial start ====*/
.h3_testimonial{
    padding: 65px 0 50px;
}
/* site page testimonial */
.h3_sitepage_testi{
    padding: 20px 0 70px;
}
.h3_testimonial .h2_tesi_all{
    padding: 32px 30px 15px;
    box-shadow: 0 0 10px 0 rgb(240 241 243);
}
/* testimonial icon */
.h3_testi_icon {
    padding: 0 0 10px;
}
.h3_testi_icon i{
    font-size: 60px;
    color: var(--brcolor);
}
.h3_testimonial .h2_testi_para p{
    font-size: 24px;
    font-weight: 600;
    color: var(--titlecolor);
}
/* testimonial title css */
.h3_testimonial .h2_testi_title{
    border: none;
    padding: 0 0 0;
}
.h3_testimonial .h2_testi_title img{
    margin: auto;
}
.h3_testimonial .h2_testi_title h2{
    font-size: 24px;
    margin: 10px 0 0px;
}
.h3_testimonial .h2_testi_title  p{
    text-transform: inherit;
    font-size: 18px;
    font-weight: 600;
}
.h3_testimonial:hover .slick-prev ,.h3_testimonial:hover .slick-next{
    opacity: 1;
    visibility: visible;
}
/*===== home 3 testimonial end ====*/

/*======== price area start  ==========*/
.price_area {
    padding: 55px 0 50px;
    position: relative;
}
/* single page price */
.single_page_price{
    padding: 120px 0 35px;
}
.inner_price_area {
    position: relative;
    padding: 40px 0 0;
    box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.2);
    border-style: solid;
    border-width: 3px 0px 0px 0px;
    border-color: var(--paracolor);
    margin-bottom: 20px;
    transition: .5s;
}
.inner_price_area:hover{
    transform: translateY(-10px);
}
/* inner price area thumb */
.inner_price_area_thumb {
    padding: 0px 32px 0px;
}
.inner_price_area_thumb h2{
    font-size: 36px;
    color: var(--brcolor);
}
.inner_price_area_thumb p{
    font-weight: 700;
    color: var(--titlecolor);
}
/* inner price list menu css */
.inner_price_list_menu {
    padding: 5px 32px 5px;
}
.inner_price_list_menu ul {
    list-style: none;
    padding: 0;
    margin: 0;
}
.inner_price_list_menu ul li {
    padding-bottom: 14px;
}
.inner_price_list_menu ul li i{
    font-weight: 700;
    margin-right: 6px;
    color: var(--bgcolor);
}
/* price text css */
.price_text {
    padding: 0 32px 0;
}
.price_text h3{
    font-size: 36px;
    color: var(--brcolor);
}
.price_text h3 span.small{
    font-size: 24px;
}
/* inner price btn */
.inner_price_btn{
    margin-top: 35px;
}
.inner_price_btn a {
    display: inline-block;
    font-size: 18px;
    text-transform: uppercase;
    padding: 10px 32px 12px;
    background-color: var(--bgcolor);
    color: var(--whitec);
    width: 100%;
}
.inner_price_btn a:hover{
    background-color: var(--brcolor);
    color: var(--whitec);
}
/* pricing style 2 */
.inner_price_area.pricing2{
    border-color: var(--brcolor);
}
.inner_price_area.pricing2 .inner_price_btn a{
    background-color: var(--brcolor);
    color: var(--whitec);
}
.inner_price_area.pricing2 .inner_price_btn a:hover{
    background-color: var(--bgcolor);
    color: var(--whitec);
}
.pricing_left_shap , .pricing_right_shap{
    position: absolute;
    z-index: -1;
    animation: witr_movelr_box45 5s linear 1s infinite alternate running;
}
.pricing_left_shap{
    bottom: 30%;
    left: 100px;
}
.pricing_right_shap{
    top: 0;
    right: 100px;
}
/*======== price area end  ==========*/

/*===== skill area start ====*/
.skill_area{
    position: relative;
    padding: 85px 0 50px;
}
.inner_skill_img{
    margin-bottom: 20px;
    animation: witr_movelr_box45 5s linear 1s infinite alternate running;
}
/* progress bar css */
.witr_single_progress {
    overflow: hidden;
    margin-bottom: 20px;
}
.progress {
    display: flex;
    height: 2px;
    background-color: var(--bgcolor);
}
.progress-bar {
    overflow: initial;
    background-color: var(--brcolor);
}
.witr_title2 span {
    font-size: 17px;
    font-weight: 700;
    color: var(--titlecolor);
}
.witr_progress-style2 .progress-bar {
    position: relative;
    text-align: left;
    line-height: 4px;
    border-radius: 0;
    box-shadow: none;
}
.witr_progress-style2 {
    overflow: visible;
    position: relative;
    margin-top: 2px;
    box-shadow: none;
    background: var(--bgcolor);
    margin-bottom: 2px;
}
.witr_progress-style2 + .witr_progress-style2 {
	margin-top: 60px;
}
.witr_progress-style2 .progress-bar {
    position: relative;
    text-align: left;
    line-height: 25px;
    box-shadow: none;
    height: 2px;
}
.witr_title6 .witr_label {
	left: 2px;
	top: 8px;
	color: #272727;
	font-size: 16px;
	font-weight: 600;
}
.witr_progress-style2 .witr_percent {
    position: absolute;
    font-size: 16px;
    right: 0;
    font-weight: 700;
    top: -28px;
    color: var(--titlecolor);
}
/* skill shap */
.skill_shap {
    position: absolute;
    top: 90px;
    right: 20px;
    z-index: -1;
    animation: witr_movelr_box45 5s linear 1s infinite alternate running;
}
/*===== skill area end ====*/

/*===== video area start ====*/
.video_area{
    padding: 45px 0 50px;
}
.video_area .section_title_area {
    padding-bottom: 10px;
    border-bottom: 4px solid var(--blackc);
}
.video_area .section_title_area h3{
    font-size: 43px;
}
.inner_video a{
    display: inline-block;
    position: relative;
    font-size: 50px;
    width: 150px;
    height: 150px;
    line-height: 150px;
    border-radius: 50%;
    text-align: center;
    background-color: var(--brcolor);
    color: var(--whitec);
    z-index: 1;
}
.inner_video a::before {
    position: absolute;
    content: '';
    width: 100%;
    height: 100%;
    border-radius: 50%;
    left: 0;
    z-index: -1;
    right: 0;
    animation: witr_squares 1.5s ease-in-out infinite;
    background-color: var(--brcolor);
    color: var(--whitec);
}
@keyframes witr_squares{
	0%{-webkit-transform:scale(1);transform:scale(1);opacity:0;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"}
	20%{-webkit-transform:scale(1.24);transform:scale(1.24);opacity:1;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"}
	100%{-webkit-transform:scale(2.1);transform:scale(2.1);opacity:0;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"}
}
/*===== video area end ====*/

/*===== counter area start  ====*/
.counter_area {
    padding: 60px 0px 0px;
}
.inner_counter_area{
    position: relative;
    margin-bottom: 20px;
    z-index: 1;
}
/* inner counter area css */
.inner_counter_area {
    position: relative;
    text-align: center;
    margin-bottom: 20px;
}
.inner_counter_thumb{
    display: flex;
    align-items: center;
    justify-content: center;
}
.inner_counter_thumb h2,
.inner_counter_thumb h4{
    color: #EEEEEE;
    font-size: 200px;
}
.inner_counter_area h3 {
    font-size: 24px;
    position: absolute;
    top: 65%;
    left: 50%;
    right: 50%;
    width: 100%;
    transform: translate(-50%, -50%);
}
/*===== counter area end  ====*/

/*===== home 2 counter start ====*/
.h2_counter_area {
    margin: 50px 0 40px;
    padding: 60px 0px 50px 0px;
}
.h2_counter_area .inner_counter_thumb h2, .h2_counter_area .inner_counter_thumb h4{
    color: #15151566;
}
.h2_counter_area .inner_counter_area h3{
    color: var(--whitec);
}
/*===== home 2 counter end ====*/

/*===== home 3 counter start ====*/
.h3_counter_area{
    position: relative;
    padding: 5px 0px 0px;
}
.h3_counter_left_shap, .h3_counter_right_shap {
    position: absolute;
    bottom: 70px;
    z-index: -1;
    animation: witr_movelr_box45 5s linear 1s infinite alternate running;
}
.h3_counter_left_shap{
    left: 50px;
}
.h3_counter_right_shap{
    right: 50px;
}
/*===== home 3 counter end ====*/

/*======== contact area start  ==========*/
.contact_area {
    padding: 45px 0px 40px;
}
.inner_contact_all {
    padding: 20px 0 0;
}
.inner_contact_all .section_title_area p{
    width: 90%;
    margin: 0 0 0;
}
.inner_contact_call {
    padding: 16px 0 0;
    display: flex;
    align-items: baseline;
}
.inner_contact_call_icon i{
    display: inline-block;
    width: 50px;
    height: 50px;
    line-height: 50px;
    text-align: center;
    font-size: 25px;
    border-radius: 100%;
    background-color: var(--brcolor);
    color: var(--whitec);
    margin-right: 20px;
}
/* inner contact form */
.inner_contact_form {
    margin-top: 20px;
}
/* inner contact form */
.inner_contact_form input {
    outline: none;
    border: none;
    border: 2px solid var(--blackc);
    width: 100%;
    height: 55px;
    padding: 0 20px;
    margin-right: 15px;
}
.inner_contact_form input::placeholder{
    color: var(--titlecolor);
}
.inner_contact_form textarea {
    width: 100%;
    height: 150px;
    outline: none;
    padding: 20px 20px;
    border: none;
    border: 2px solid var(--blackc);
}
textarea::placeholder {
    color: var(--paracolor);
}
.inner_contact_form button {
    display: inline-block;
    width: 100%;
    padding: 14px 30px;
    font-size: 16px;
    font-weight: 600;
    border: none;
    outline: none;
    background-color: var(--brcolor);
    color: var(--whitec);
    transition: .5s;
}
.inner_contact_form button:hover{
    background-color: var(--bgcolor);
}
/*======== contact area end  ==========*/

/*===== faq area start  ====*/
.faq_area{
    padding: 40px 0 50px;
}
/* single page faq */
.single_page_faq{
    padding: 115px 0 40px;
}
.inner_faq_img {
    margin-bottom: 20px;
}
.inner_faq_area {
    padding: 40px 0 0;
}
.accordion-item {
    margin-bottom: 20px;
}
.accordion-button:focus{
    box-shadow: none;
}
.accordion-button:not(.collapsed) {
    background-color: var(--brcolor);
    color: var(--whitec);
}
.accordion-item .accordion-button {
    border-radius: 0;
    font-size: 18px;
    font-weight: 600;
    border: none;
    box-shadow: 0 0 5px #dddddd7d;
}
/*===== faq area end  ====*/

/*======= contact service start ====*/
.contact_service_area {
    padding: 130px 0 45px;
}
.inner_contact_service {
    padding: 50px 30px 65px 30px;
    margin-bottom: 20px;
    box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.05);
}
.inner_contact_service i {
    font-size: 30px;
    height: 80px;
    width: 80px;
    text-align: center;
    border-radius: 5px;
    line-height: 80px;
    display: inline-block;
    background-color: var(--brcolor);
    color: var(--whitec);
    transition: .5s;
}
.inner_contact_service:hover i{
    background-color: var(--bgcolor);
    color: var(--whitec);
    border-radius: 50%;
}
.inner_contact_service h3 a {
    display: inline-block;
    font-size: 22px;
    margin: 12px 0 10px;
}
.inner_contact_service p{
    margin: 0;
}
.inner_contact_area p.form-messege{
    color: var(--brcolor);
}
/*======= contact service end ======*/

/*======== map area start  ==========*/
.map_area {
    margin: 75px 0  55px;
}
.inner_map_area {
    width: 100%;
    height: 500px;
}
.inner_map_area iframe {
    width: 100%;
    height: 100%;
    border: none;
    outline: none;
}
/*======== map area end  ==========*/

/*======== blog area start  ==========*/
.blog_area {
    padding: 45px 0 50px;
}
/* single page blog */
.single_page_blog{
    padding: 130px 0 35px;
}
/* inner blog area css */
.inner_blog_area {
    overflow: hidden;
    margin-bottom: 20px;
    box-shadow: 0 5px 10px 0 rgba(31, 33, 44, 0.057);
    transition: .5s;
}
.inner_blog_area:hover {
    background: transparent;
}
.blog_main_all {
    padding: 20px 25px 20px;
}
.inner_blog_thumb{
    position: relative;
    overflow: hidden;
}
.inner_blog_img img{
    width: 100%;
    transition: .5s;
}
.inner_blog_area:hover .inner_blog_img img{
    transform: scale(1.2);
}
/* blog overlay css */
.blog_overlay{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgb(0 0 0 / 50%);
    transform: scale(0);
    transition: .5s;
}
.inner_blog_area:hover .blog_overlay{
    transform: scale(1.2);
}
.inner_blog_text span {
    margin-right: 5px;
    color: var(--brcolor);
}
.inner_blog_text span i{
    margin-right: 6px;
    color: var(--brcolor);
}
/*inner blog content css */
.inner_blog_content {
    padding: 15px 0px 5px;
}
.inner_blog_content h2 a{
    text-transform: uppercase;
}
.inner_blog_content h2 a:hover{
    color: var(--brcolor);
}
.inner_blog_content p {
    padding-top: 10px;
}
.blog_btn a{
    font-size: 18px;
    color: var(--brcolor);
}
.blog_btn a:hover{
    color: var(--bgcolor);
}
.blog_area:hover .slick-prev ,.blog_area:hover .slick-next{
    opacity: 1;
    visibility: visible;
}
/* site page css */
.portfolio_area {
    padding: 115px 0 50px;
}
.project_information_area {
    padding: 130px 0 40px;
}
.yblog_left {
    padding: 120px 0 15px;
}
.yblog_left_inner{
    margin-bottom: 30px;
}
.yblog_left_sub h2 a {
    text-transform: inherit;
    font-size: inherit;
}
/*======== blog area end  ==========*/

/*======== brand area start  ==========*/
.brand_area {
    padding: 65px 0 50px;
    position: relative;
}
.h2_brand_area {
    padding: 95px 0 80px;
}
.h3_brand_area{
    padding: 60px 0 70px;
}
.inner_brand_area img{
    margin: 0 auto;
}
.brand_area:hover .slick-prev ,.brand_area:hover .slick-next{
    opacity: 1;
    visibility: visible;
}
/*======== brand area end  ==========*/

/*======== subscribe area start ==========*/
.subscribe_area {
    padding: 60px 0 50px;
    position: relative;
}
/* about subscribe css */
.about_subscribe{
    padding: 30px 0 50px;
}
.h2_subscribe_area .section_title_area{
    margin-bottom: 45px;
}
.inner_subscribe_form {
    position: relative;
    overflow: hidden;
}
.inner_subscribe_form input{
    width: 100%;
    font-size: 16px;
    line-height: 28px;
    border-radius: 0px;
    border: none;
    outline: none;
    padding: 15px 30px;
    height: 63px;
    background: var(--bgcolor);
    color: var(--whitec);
}
.inner_subscribe_form input::placeholder{
    color: var(--whitec);
}
.inner_subscribe_form button {
    position: absolute;
    top: 0;
    right: 0;
    display: inline-block;
    padding: 17px 70px 18px;
    font-size: 18px;
    border: none;
    outline: none;
    background-color: var(--brcolor);
    color: var(--whitec);
    border-left: 11px solid;
    transition: .5s;
}
.inner_subscribe_form button:hover{
    background-color: var(--bgcolor);
    color: var(--whitec);
}
.subscribe_socail a {
    display: inline-block;
    margin: 0 0 0 10px;
    background-color: var(--bgcolor);
    color: var(--whitec);
    font-size: 20px;
    width: 35px;
    height: 35px;
    line-height: 35px;
    text-align: center;
}
.subscribe_socail a:hover{
    background-color: var(--brcolor);
    color: var(--whitec);
}
/* subscribe shap css */
.subscribe_left_shap, .subscribe_right_shap {
    position: absolute;
    z-index: -1;
    animation: witr_movelr_box45 5s linear 1s infinite alternate running;
}
.subscribe_left_shap{
    top: 40px;
    left: 50px;
}
.subscribe_right_shap {
    top: 40px;
    left: 86%;
}
/*======== subscribe area end ========*/

/*======== home 3 subscribe start ======*/
.h3_subscribe_area{
    padding: 45px 0 50px;
}
.h3_subscribe_area .section_title_area {
    margin: 45px 0 30px;
}
.h3_subscribe_leftshap , .h3_subscribe_rightshap{
    position: absolute;
    z-index: -1;
    animation: witr_movelr_box45 5s linear 1s infinite alternate running;
}
.h3_subscribe_leftshap{
    top: -70px;
    left: 100px;
}
.h3_subscribe_rightshap {
    top: 250px;
    right: 100px;
}
/*======== home 3 subscribe end ======*/

/*======== footer area start  ==========*/
.footer_area {
    padding: 65px 0 75px;
}
.footer_address {
    padding: 75px 0 50px;
}
.inner_fooer_address {
    position: relative;
    padding: 30px 10px;
    margin-bottom: 20px;
}
.footer_up_area p {
    width: 50%;
    margin: auto;
}
/* footer address css */
.inner_fooer_address{
    position: relative;
    margin-bottom: 20px;
}
.inner_fooer_address.border_foot{
    border-right: 1px solid var(--brcolor);
}
.inner_fooer_address h3{
    font-size: 16px;
    font-weight: 700;
    color: var(--brcolor);
    margin: 0;
}
.inner_fooer_address p {
    width: 65%;
    margin: 5px auto 0;
}
.inner_footer_icon {
    position: absolute;
    top: 20px;
    left: 0;
    right: 0;
    z-index: -1;
}
.inner_footer_icon i {
    font-size: 110px;
    color: #dddada;
}
/* footer nav css */
.footer_nav ul{
    list-style: none;
    margin: 0;
    padding: 0;
}
.footer_nav ul li{
    display: inline-block;
    margin: 0 10px;
}
.footer_nav ul li a{
    font-size: 16px;
}
.footer_nav ul li a span{
    margin-left: 10px;
}
/*======== footer area end  ==========*/


/*======== copyright area start  ==========*/
.copy_right_area {
    padding: 25px 0 25px;
    background-color: var(--brcolor);
}
.inner_copy_right_area p{
    color: var(--whitec);
    margin: 0;
}
.copy_right_menu ul {
    list-style: none;
    margin: 0;
    padding: 0;
}
.copy_right_menu ul li {
    display: inline-block;
    margin-left: 15px;
}
.copy_right_menu ul li a{
    font-size: 16px;
    font-weight: 400;
    color: var(--whitec);
}
/*======== copyright area end  ==========*/

/*======== scroll top btn css  ==========*/
#scrollUp {
    bottom: 40px;
    font-size: 30px;
    height: 40px;
    line-height: 40px;
    right: 40px;
    text-align: center;
    border-radius: 5px;
    width: 40px;
    background: var(--brcolor);
    color: var(--whitec);
    box-shadow: 0 0 10px #0000002e;
}

/* blog and portfolio all color css */
.portfolio_nav ul li.current_menu_item,
.portfolio_nav ul li:hover,
.port_content_center a:hover,
.inner_portfolio_lower_nav ul li a.current,
.inner_portfolio_lower_nav ul li a:hover,
.ycalender_inner h5,
.ycalender_inner td.active,
.inner_project_in_icon a:hover,
.inner_sin_com_btn button,
.pay_sub_btn button,
.inner_my_accout_form_btn a ,
.inner_cart_btn a,
.shop_quenty button,
.shop_btn_area a  {
    background-color: var(--brcolor);
    color: var(--whitec);
}
.pay_sub_btn button:hover,
.inner_my_accout_form_btn a:hover,
.inner_cart_btn a:hover,
.tab_list_socail_icon a:hover,
.shop_btn_area a:hover,
.inner_shop_icons a:hover {
    background-color: var(--bgcolor);
    color: var(--whitec);
}
.port_content_center h2 a:hover{
    background: none;
    color: var(--brcolor);
}
.port_content_center p{
    color: var(--whitec);
}
.yblog_left_text_sub span i{
    color: var(--brcolor);
}