/*
    Template  Name: Gym
*/

/*
Table Of Content

1. header top area

2. main menu area

3. slider area

4. video slider area  

5. breadcum area

6. home 2 feature

7. home 3 feature

8. about area

9. service area

10. project img area

11. home 2 project img

12. schedule area

13. team area

14. calculate area

15. bmi area

16. counter area

17. home 2 counter

18. testimonial area

19. home 2 testimonial

20. pricing area

21.  brand area

22. shop area

23. offer area

24. img area

25. contact service

26. contact area

27. faq area

28. blog area

29. subscribe area

30. footer area

*/

/* ======= site font family ==========*/
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,400;0,500;0,700;0,900;1,300&family=Teko:wght@300..700&display=swap');
:root{
    --blackc: #000;
    --whitec: #fff;
    --bgcolor: #000619;
    --brcolor: #b51f24;
    --paracolor: #555555;
    --titlecolor: #000717;
}

/* defult css */
body{
    font-size: 16px;
    font-weight: 400;
    line-height: 1.6;
    font-family: "Roboto", 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: 25px;
    font-weight: 700;
    color: var(--titlecolor);
    line-height: 1.2;
    font-family: "Teko", 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: 0px 40px 0 26px;
    align-items: center;
    background-color: var(--bgcolor);
}
/* header left */
.header_left span, .header_right span, .header_left a{
    font-size: 15px;
    font-weight: 500;
    color: var(--whitec);
}
.header_left span, .header_left a {
    margin: 0 22px 0 0;
}
.header_left span i,
.header_left a i{
    color: var(--whitec);
    margin-right: 6px;
}
/* header top middle css */
.header_top_middle{
    text-align: center;
}
/* header right */
.header_right a {
    color: var(--brcolor);
    background: var(--whitec);
    width: 38px;
    height: 38px;
    line-height: 38px;
    display: inline-block;
    text-align: center;
}
.header_right a:hover{
    background-color: var(--brcolor);
    color: var(--whitec);
}
.header_right span i{
    margin-right: 5px;
}
/*======= header top area end ======*/

/*======== main menu area start ==========*/
.main_menu_area {
    padding: 0 0;
}
.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 {
    background-color: var(--brcolor);
    height: 143px;
    padding: 50px 20px 40px;
    width: 100%;
    text-align: center;
}
/* main nav area css */
.main_menu_all_item {
    padding: 0 40px 0 35px;
    position: relative;
    align-items: center;
}
.main_nav_area {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
/* 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 12px;
    font-size: 17px;
    font-weight: 600;
    text-transform: capitalize;
    color: #444;
}
.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: 16px;
    padding: 8px 17px;
    text-transform: capitalize;
}
.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 {
    margin-left: 10px;
}
.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: 10px;
}
.main_nav_btn a {
    display: inline-block;
    font-size: 18px;
    margin-left: 20px;
    font-weight: 500;
    border-radius: 5px;
    padding: 7px 26px;
    background-color: var(--brcolor);
    color: var(--whitec);
}
.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;
    border: none;
}
.absolute_menu .inner_main_nav_area >ul >li >a{
    color: var(--whitec);
    margin: 35px 0px 35px 25px;
}
/* home 3 main menu */
.h3_main_menu{
    padding: 0 10px;
}
.h3_main_menu .main_nav_area{
    justify-content: end;
}
/*======== main menu area 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: var(--whitec);
    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: 800px;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    display: flex !important;
    align-items: center;
    position: relative;
}
.inner_slider_content {
    width: 68%;
    margin: 5px auto 0;
    text-align: left;
}
.inner_slider_content h1 {
    font-size: 48px;
    font-weight: 400;
    letter-spacing: 12px;
    color: var(--whitec);
}
.inner_slider_content h2 {
    font-size: 120px;
    text-transform: uppercase;
    color: var(--whitec);
    margin: 0;
}
.inner_slider_content h3 {
    font-size: 48px;
    font-weight: 400;
    color: var(--whitec);
    margin-top: -10px;
    margin-bottom: 42px;
}
.inner_slider_content p {
    width: 55%;
    font-size: 18px;
    color: var(--whitec);
    margin: 20px auto 50px;
}
/* home 2 inner slider */
.h2_inner_slider .inner_slider_content h1 {
    font-size: 36px;
    font-weight: 500;
}
.h2_inner_slider .inner_slider_content h2{
    font-size: 100px;
}
.h2_inner_slider .g_btn{
    margin-top: 45px;
}
.h2_slider_socail {
    position: absolute;
    top: 33%;
    left: 6%;
}
.h2_slider_socail a{
    display: block;
    font-size: 28px;
    margin-bottom: 10px;
    color: var(--whitec);
}
.h2_main_slide .slick-dots {
    left: 87%;
    top: 50%;
}
.h2_main_slide .slick-dots li {
    display: block;
}
.h2_main_slide .slick-dots li button {
    font-size: 0;
    width: 8px;
    height: 12px;
    line-height: 12px;
    border-radius: 100%;
    background-color: var(--whitec);
    margin: 0 5px;
    transition: 0.5s;
}
.h2_main_slide .slick-dots li.slick-active button {
    background: var(--whitec);
    width: 15px;
    height: 15px;
} 
/* home 3 slider css */
.h3_inner_slider{
    height: 895px;
    z-index: 11;
}
.h3_inner_slider::before{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: var(--blackc);
    opacity: 0.2;
    z-index: -1;
}
.h3_inner_slider .inner_slider_content{
    text-align: center;
}
.h3_inner_slider .inner_slider_content h2 {
    display: inline-block;
    font-size: 80px;
    font-weight: 600;
    border-bottom: 4px solid;
    letter-spacing: 1px;
}
/* golobal btn css */
.g_btn a {
    display: inline-block;
    position: relative;
    font-family: "Teko", Sans-serif;
    font-size: 18px;
    padding: 16px 34px;
    letter-spacing: 1px;
    background-color: var(--brcolor);
    color: var(--whitec);
    text-transform: uppercase;
    margin-right: 15px;
    overflow: hidden;
    z-index: 1;
}
.g_btn a::before {
    content: "";
    position: absolute;
    top: -140px;
    left: -140px;
    width: 0%;
    height: 100%;
    background: var(--bgcolor);
    transform: rotateZ(-90deg);
    transition: 1s;
    z-index: -1;
}
.g_btn a:hover::before{
    top: 0;
    left: 0;
    width: 100%;
    transform: rotateZ(0deg);
}
.g_btn a.active{
    background-color: var(--bgcolor);
    color: var(--whitec);
}
.g_btn a.my-video-links {
    display: inline-block;
    padding: 0 0;
    margin: 0 10px 5px;
    position: relative;
    width: 52px;
    height: 52px;
    line-height: 57px;
    border-radius: 100%;
    text-align: center;
    animation: witr-shadow 1s linear infinite;
    background-color: var(--brcolor);
    color: var(--whitec);
    z-index: 1;
}
@keyframes witr-shadow {
    0% {
        box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.3), 0 0 0 10px rgba(255, 255, 255, 0.3), 0 0 0 20px rgba(255, 255, 255, 0.3);
    }
    100% {
        box-shadow: 0 0 0 10px rgba(255, 255, 255, 0.3), 0 0 0 20px rgba(255, 255, 255, 0.3), 0 0 0 30px rgba(255, 255, 255, 0);
    }
}
.g_btn a i{
    font-weight: 900;
}
/* gogrin btn 2 */
.g_btn2 {
    margin-top: 40px;
}
.g_btn2 a{
    display: inline-block;
    padding: 17px 49px 16px 48px;
    background-color: var(--whitec);
    color: var(--brcolor);
    font-family: "Teko", Sans-serif;
    font-size: 18px;
    font-weight: 500;
    letter-spacing: 1px;
    box-shadow: 5px 5px 0px 0px #B51F24;
}
.g_btn2 a:hover{
    background-color: var(--brcolor);
    color: var(--whitec);
    box-shadow: 5px 5px 0px 0px var(--whitec);
}
/* golobal slick defult arrow css */
.slick-prev , .slick-next{
    position: absolute;
    top: 50%;
    width: 60px;
    height: 60px;
    line-height: 60px;
    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: '\eac9';
    font-family: IcoFont;
    display: inline-block;
    width: 60px;
    height: 60px;
    line-height: 60px;
    font-size: 40px;
    font-weight: 900;
    background-color: var(--brcolor);
    color: var(--whitec);
    transition: 1s;
}
.slick-next::before{
    content: '\eaca';
}
.slick-prev:hover::before ,.slick-next:hover::before{
    background-color: var(--bgcolor);
    color: var(--whitec)
}
/* slider defult arrow css */
.slider_area .slick-prev, .slider_area .slick-next {
    top: 96%;
    opacity: 1;
    visibility: visible;
}
.slider_area .slick-prev::before ,.slider_area .slick-next::before{
    background-color: var(--whitec);
    color: var(--blackc);
    width: 60px;
    height: 60px;
    line-height: 60px;
}
.slider_area .slick-prev{
    left: 92%;
}
.slider_area .slick-next {
    right: 21px;
}
/*======== slider area end  ==========*/

/*======== breadcum area start  ==========*/
.breadcum_area {
    background: #f7f7f7;
    padding: 80px 0 100px;
}
.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.4);
}
.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  =======*/

/*======== home 2 feature start =======*/
.h2_feature_area{
    background-color: #F1F1F1;
}
.h2_single_feature{
    border-right: 1px solid #CDCED1;
    padding: 40px 20px 34px 20px;
}
.h2_single_feature.border_00{
    border-right: none;
}
.h2_single_feature p{
    font-size: 14px;
    margin: 0;
}
.h2_feature_btn {
    margin-top: 10px;
}
.h2_feature_btn a{
    font-family: Teko, sans-serif;
    color: var(--brcolor);
    font-size: 18px;
}
.h2_feature_btn a i{
    color: var(--brcolor);
    font-weight: 900;
}
.h2_single_feature_bg {
    position: relative;
    z-index: 11;
    margin: -115px 0 0;
    border: 15px solid #B51F248C;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 10px 28px 10px;
}
.h2_single_feature_bg h1{
    font-size: 150px;
    font-weight: 600;
    color: var(--whitec);
}
.h2_single_feature_bg h2{
    margin: -40px 0 0;
    color: var(--whitec);
}
.h2_single_feature_bg p{
    font-size: 14px;
    color: var(--whitec);
}
/*======= home 2 feature end ========*/

/*======= home 3 feature start ========*/
.h3_feature_area{
    padding: 120px 0 50px;
}
.h3_single_feature {
    display: flex;
    margin-bottom: 20px;
    padding: 35px 32px 15px;
    background-color: var(--bgcolor);
    transition: .5s;
}
.h3_single_feature:hover{
    background-color: var(--brcolor);
}
.h3_sin_feature_icon{
    margin-right: 15px;
}
.h3_sin_feature_icon i{
    font-size: 60px;
    color: var(--whitec);
}
.h3_sin_feature_content h3{
    font-size: 16px;
    font-weight: 600;
    color: var(--whitec);
    text-transform: uppercase;
}
.h3_sin_feature_content p{
    font-size: 14px;
    color: var(--whitec);
}
/*======= home 3 feature end ======*/

/*======= about area start ========*/
.about_area{
    padding: 130px 0 50px;
    position: relative;
}
/* site page about */
.single_about_page{
    padding: 120px 0 10px;
}
.section_title_area {
    position: relative;
    margin-bottom: 45px;
}
.section_title_area.margin_0{
    margin-bottom: 0;
}
.section_title_area h2{
    font-size: 22px;
    font-weight: 600;
    color: var(--brcolor);
}
.section_title_area h3{
    font-size: 60px;
}
.section_title_area.style2 p {
    width: 50%;
    margin: 13px auto 0;
}
.section_title_area.white_fff h3,
.section_title_area.white_fff p{
    color: var(--whitec);
}
.witr_back_title {
    position: absolute;
    top: -35px;
    right: 0;
    left: 0;
    z-index: -1;
}
.witr_back_title h4{
    font-size: 200px;
    -webkit-text-stroke: 1px #888888;
    -webkit-text-fill-color: transparent;
    line-height: 1;
    background: linear-gradient(0deg, transparent, #fff, #d7d7d7);
    -webkit-text-stroke-color: #00000000;
    -webkit-background-clip: text;
}
/* inner about img css */
.inner_about_img{
    margin-bottom: 20px;
    position: relative;
}
.inner_about_video {
    position: absolute;
    top: 18%;
    left: 13%;
}
.inner_about_video a{
    display: inline-block;
    position: relative;
    text-align: center;
    animation: witr-shadow 1s linear infinite;
    color: var(--whitec);
    font-size: 26px;
    background-color: var(--brcolor);
    width: 125px;
    height: 106px;
    line-height: 106px;
    clip-path: polygon(0 0, 100% 0, 77% 100%, 0% 100%);
    z-index: 1;
}
/* inner about counter */
.inner_about_counter {
    position: absolute;
    bottom: 20px;
    right: 60px;
    display: flex;
    align-items: center;
}
.inner_about_counter h2 {
    color: var(--whitec);
    font-size: 72px;
    -webkit-text-stroke-width: 2px;
    stroke-width: 2px;
    -webkit-text-stroke-color: var(--brcolor);
    stroke: var(--brcolor);
    margin-right: 10px;
}
.inner_about_counter h3{
    font-size: 24px;
    font-weight: 600;
    color: var(--brcolor);
}
/* about list css */
.about_list {
    padding: 15px 0 6px;
    display: flex;
}
.about_list ul{
    padding: 0;
    list-style: none;
    margin: 0 80px 0 0;
}
.about_list ul li {
    padding: 0 0 12px;
}
.about_list ul li i{
    font-size: 20px;
    color: var(--brcolor);
    margin-right: 6px;
}
/* about service css */
.h2_about_all_services {
    padding: 15px 0 0 40px;
}
.h2_about_service {
    position: relative;
    margin-bottom: 30px;
}
.h2_about_service h2 {
    margin-bottom: 5px;
}
.h2_about_service h2 a{
    font-size: 22px;
}
.h2_about_service p{
    width: 90%;
}
.h2_about_line {
    position: absolute;
    left: -50px;
    top: 0;
}
/* home 2 about shap */
.h2_about_shap_left, .h2_about_shap_right{
    position: absolute;
    z-index: -1;
    animation: witr_movelr_box45 5s linear 1s infinite alternate running;
}
.h2_about_shap_left {
    top: 70px;
    left: 30px;
}
.h2_about_shap_right {
    bottom: -28%;
    right: -40px;
}

@keyframes witr_movelr_box45 {
    0%{
         transform: translateX(0px);
      }
    100%{
        transform: translateX(45px);
      }
}
@keyframes witr_movelr_box46 {
    0%{
         transform: translateY(0px);
}
    100%{
        transform: translateY(45px);
}
}
/*======= about area end ========*/

/*======= service area start =======*/
.service_area{
    padding: 40px 0 50px;
    position: relative;
}
/* site page service */
.site_page_service{
    padding: 120px 0 120px;
}
.single_service_img{
    position: relative;
    overflow: hidden;
}
.single_service_img img{
    width: 100%;
    transition: 4s;
}
.single_service_area:hover .single_service_img img{
    transform: scale(1.3);
}
/* single service content */
.single_service_content{
    position: relative;
    background: var(--whitec);
    left: 30px;
    width: calc(100% - 60px);
    box-shadow: 0 0 10px 0 rgb(0, 0, 0, 0.1);
    padding: 30px 30px 30px 50px;
}
/* single service btn */
.sin_ser_btn a{
    font-family: Teko, sans-serif;
    font-size: 18px;
}
.sing_icon_absolute {
    position: absolute;
    background: var(--brcolor);
    padding: 12px;
    top: 0;
    left: -30px;
}
.sing_icon_absolute::before {
    content: '';
    width: 30px;
    height: 20px;
    display: block;
    background: rgb(153 51 51);
    position: absolute;
    left: 0;
    top: 59px;
    clip-path: polygon(0 0, 100% 100%, 100% 0);
}
.service_area:hover .slick-prev ,.service_area:hover .slick-next{
    opacity: 1;
    visibility: visible;
}
/*======= service area end =======*/

/*======= home 2 service start =======*/
.h2_service_area {
    background-position: bottom center;
    background-repeat: no-repeat;
    padding: 45px 0px 145px 0px;
}
.h2_service_area:hover .slick-prev ,.h2_service_area:hover .slick-next{
    opacity: 0;
    visibility: hidden;
}
.h2_service_area .slick-dots {
    position: inherit;
    bottom: -45px;
}
/*======= home 2 service end =======*/

/*===== project img area start  ====*/
.project_img_area {
    padding: 70px 0 50px;
}
.single_project_img{
    position: relative;
}
.inner_pro_img{
    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 img overlay css */
.project_img_overlay{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: var(--blackc);
    opacity: .3;
    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: center;
    justify-content: space-between;
    left: 10px;
    position: absolute;
    padding: 20px 30px;
    right: 10px;
    margin: 0 auto;
    bottom: -108px;
    background: transparent;
    transition: .5s;
    z-index: 999;
}
.single_project_img:hover .inner_pro_content{
    bottom: 0;
}
.inner_pro_text h2,
.inner_pro_text p{
    margin: 0;
    color: var(--whitec);
}
.inner_pro_text h2 a{
    font-size: 30px;
    color: var(--whitec);
}
.inner_pro_icon a{
    display: inline-block;
    width: 45px;
    height: 45px;
    line-height: 45px;
    font-size: 18px;
    text-align: center;
    background-color: var(--brcolor);
    color: var(--whitec);
    box-shadow: 0 0 65px 0 #00000014;
}
.inner_pro_icon a:hover{
    background-color: var(--bgcolor);
    color: var(--whitec);
}
/*===== project img area end  ====*/

/*===== home 2 project img start  ====*/
.h2_project_bg_color {
    background-color: var(--bgcolor);
    margin: 0 0 140px;
}
.h2_project_img {
    position: relative;
    top: 115px;
    padding: 0px 0 0px 305px;
}
/* project arrow css */
.h2_project_img .slick-prev, .h2_project_img .slick-next {
    top: -100px;
    opacity: 1;
    visibility: visible;
}
.h2_project_img .slick-prev::before ,.h2_project_img .slick-next::before{
    background-color: var(--whitec);
    color: var(--blackc);
    width: 60px;
    height: 60px;
    line-height: 60px;
}
.h2_project_img .slick-prev{
    left: 65%;
}
.h2_project_img .slick-next {
    right: 27%;
}
/*===== home 2 project img end  ====*/

/*======= schedule area start =======*/
.schedule_area {
    position: relative;
    padding: 75px 0 50px;
}
.site_page_schedule{
    padding: 115px 0 115px;
}
.single_weak.weak_logo{
    background: #000717;
}
.shedul_weak{
    display: flex;
}
.single_weak_up {
    text-align: center;
    margin: 5px 3px 5px;
    padding: 50px 0px 10px 0px;
    background-color: var(--bgcolor);
    width: 100%;
}
.single_weak_up h2{
    color: var(--whitec);
    margin: 0;
}
.single_weak {
    text-align: center;
    margin: 5px 3px 5px;
    padding: 40px 0px 40px;
    width: 100%;
}
.single_weak h2, .single_weak p{
    margin: 0;
}
.single_weak h2{
    font-size: 22px;
}
.weak_time_fixed {
    padding: 55px 0px 20px;
    border: 1px solid var(--whitec);
    background: var(--brcolor);
}
.weak_time_fixed h2{
    color: var(--whitec);
}
.weak_time_content{
    border: 1px solid var(--brcolor);
    transition: .5s;
}
.weak_time_content:hover{
    border: 1px solid var(--bgcolor);
}
/* home 2 sedule shap */
.h2_sedule_left_shap, .h2_sedule_right_shap {
    position: absolute;
    z-index: -1;
    animation: witr_movelr_box45 5s linear 1s infinite alternate running;
}
.h2_sedule_left_shap{
    top: -50px;
    left: 0;
}
.h2_sedule_right_shap {
    top: 130px;
    right: 20px;
}
/*======= schedule area end =======*/

/*======= team area start =======*/
.team_area {
    padding: 70px 0 0px;
    position: relative;
    z-index: 99;
}
.site_page_team{
    padding: 120px 0 100px;
}
.main_team{
    overflow: hidden;
    position: relative;
    margin-bottom: 20px;
    box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.08);
}
.team_img img{
    width: 100%;
}
.team_title {
    left: 0;
    width: 100%;
    margin: auto;
    bottom: -60px;
    right: 0;
    height: auto;
    z-index: 99999;
    position: absolute;
    transition: .5s;
    text-align: center;
    padding: 18px 10px 35px;
}
.main_team:hover .team_title{
    bottom: 0px;
}
.team_title h2 {
    color: var(--titlecolor);
    margin: 0 0 0;
    transition: .5s;
}
.main_team:hover .team_title h2{
    color: var(--whitec);
}
.team_title span{
    color: var(--paracolor);
    margin: 10px 0;
    transition: .5s;
}
.main_team:hover .team_title span{
    color: var(--whitec);
}
.team_thumb:before {
    content: '';
    display: block;
    position: absolute;
    top: 72%;
    left: -4px;
    width: 112%;
    background: var(--whitec);
    right: 0;
    height: 100%;
    border-radius: 0 15px 0 0;
    transform: rotate(-14deg);
    transition: .5s;
    box-shadow: -20px -4px 0 10px rgb(181 31 36 / 50%);
}
.main_team:hover .team_thumb:before{
    top: 50%;
    background-color: var(--bgcolor);
}
/* team social icon */
.tteamsocial{
    margin-top: 10px;
}
.tteamsocial a{
    color: var(--whitec);
    font-size: 22px;
    width: 25px;
    border-style: none;
    margin: 0px 5px 0px 5px;
}
.main_team:hover .tteamsocial a{
    color: var(--whitec);
}
/*=====  team area end  ====*/

/*=====  calculate area start ====*/
.calculate_area {
    position: relative;
    z-index: 1;
    margin-top: -160px;
    padding: 250px 0px 260px 0px;
    background-position: top center;
    background-repeat: no-repeat;
}
.inner_calculate_area {
    padding: 45px 0 0;
    margin-bottom: 20px;
}
/* progress bar css */
.skill_left_inner {
    padding: 5px 0 0;
}
.witr_single_progress {
    overflow: hidden;
    margin-bottom: 20px;
}
.progress {
    display: flex;
    padding: 1px 2px;
    height: 12px;
    background: transparent;
    border: 1px solid var(--brcolor);
}
.progress-bar {
    overflow: initial;
    background: var(--brcolor);
}
.witr_title2 span {
    font-size: 15px;
    font-weight: 600;
    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: transparent;
    margin-bottom: 2px;
    border-radius: 0;
}
.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: 8px;
}
.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);
}
/* calcule form main css */
.calcute_form_main {
    padding: 40px 40px 30px;
    background-color: var(--bgcolor);
}
.inner_calcute_form{
    margin-bottom: 20px;
}
.inner_calcute_form h4{
    color: var(--whitec);
    font-size: 16px;
    font-weight: 400;
    font-family: Roboto, sans-serif;
}
.inner_calcute_form select {
    width: 100%;
    height: 50px;
    padding: 0 20px;
    border: none;
    background: #333;
    color: var(--whitec);
}
.inner_calcute_form select:focus{
    outline: none;
}
.inner_calcute_form input{
    width: 100%;
    height: 50px;
    padding: 0 20px;
    border: none;
    background: #333;
    color: var(--whitec);
}
.inner_calcute_form input::placeholder{
    color: var(--whitec);
}
.inner_calcute_btn button{
    width: 100%;
    font-family: 'Teko', sans-serif;
    font-size: 18px;
    font-weight: 500;
    letter-spacing: 1px;
    margin-top: 5px;
    height: 50px;
    background-color: var(--brcolor);
    color: var(--whitec);
    border: none;
    outline: none;
}
.calcute_form_main p.form-messege{
    color: var(--whitec);
    font-size: 20px;
}
/*=====  calculate area end ====*/

/*=====  bmi area start ====*/
.bmi_area{
    margin: 50px 0 0px;
}
.inner_bmi_main {
    padding: 10% 5% 30% 33%;
    background-size: cover;
    background-position: center center;
}
.inner_bmi_main p.form-messege{
    color: var(--whitec);
    font-size: 20px;
}
/* inner bmi video css */
.inner_bmi_video {
    padding: 155px 0 40px;
    position: relative;
}
.inner_bmi_popup {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.inner_bmi_popup a{
    display: inline-block;
    color: var(--brcolor);
    font-size: 26px;
    background-color: var(--whitec);
    width: 72px;
    height: 72px;
    line-height: 72px;
    text-align: center;
    border-radius: 100%;
    animation: witr-shadow 1s linear infinite;
}
/*=====  bmi area end ====*/


/*===== counter area start ====*/
.counter_area {
    position: relative;
    margin-top: -140px;
    z-index: 99;
}
.inner_counter_area {
    position: relative;
    margin-bottom: 20px;
    padding: 80px 0px 80px;
    background-color: var(--whitec);
    box-shadow: 0px 0px 8px 2px rgba(0, 0, 0, 0.08);
    border-bottom: 5px solid var(--brcolor);
    z-index: 11;
}
/* inner counter sub content css */
.inner_counter_sub_cont {
    display: flex;
    justify-content: center;
    align-items: baseline;
}
.inner_counter_sub_cont h3, .inner_counter_sub_cont h4{
    font-size: 72px;
    font-weight: 700;
    color: var(--brcolor);
    font-family: Teko, sans-serif;
}
.inner_counter_sub_cont h3{
    margin-right: 4px;
}
.inner_counter_area h2 {
    margin-top: -12px;
    font-size: 16px;
    text-transform: uppercase;
    font-family: Roboto, sans-serif;
}
.counter_img{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: -1;
}
/*===== counter area end ====*/

/*===== home 2 counter start ====*/
.h2_counter_area {
    margin: -204px 0 0 305px;
    padding: 45px 0 20px;
    background-color: var(--brcolor);
}
.h3_counter_area {
    margin: 75px 0 0;
}
.h2_counter_area .inner_counter_area{
    padding: 0 0;
    background: transparent;
    box-shadow: none;
}
.h2_counter_area .inner_counter_sub_cont h3,
.h2_counter_area .inner_counter_sub_cont h4{
    color: var(--whitec);
}
/*===== home 2 counter end ====*/

/*===== testimonial area start ====*/
.testimonial_area {
    padding: 265px 0 120px;
    background-size: cover;
    background-repeat: no-repeat;
    position: relative;
    z-index: 11;
    margin-top: -159px;
}
.site_page_testimonial{
    margin: 0 0 0;
    padding: 120px 0 120px;
}
.testimonial_area .witr_back_title h4{
    -webkit-text-stroke-color: #00000000;
    opacity: 0.1;
}
.inner_testimonial {
    margin: 67px 0 0;
    box-shadow: 0px 0px 10px 0px rgb(0 0 0 / 20%);
    background-color: var(--whitec);
    padding: 90px 100px 75px;
    position: relative;
}
.inner_testi_img {
    position: absolute;
    top: -60px;
    right: 0;
    left: 0;
}
.inner_testi_img img{
    margin: auto;
}
.inner_testi_para{
    position: relative;
    z-index: 1;
}
.inner_testi_para p{
    font-size: 18px;
    font-weight: 700;
}
.inner_testi_para i {
    font-size: 90px;
    position: absolute;
    top: -15%;
    left: 50%;
    transform: translateX(-50%);
    color: var(--brcolor);
    opacity: .15;
    z-index: -1;
}
.inner_testi_title {
    padding: 10px 0 0;
}
.inner_testi_title h3{
    margin: 0;
}
/* testimonial shap */
.testi_left_shap, .testi_right_shap {
    position: absolute;
    top: 0;
    animation: witr_movetb_box45 5s linear 1s infinite alternate running;
}
.testi_left_shap{
    left: 0;
}
.testi_right_shap{
    right: 0;
}
@keyframes witr_movetb_box45 {
    0%{
            transform: translateY(0px);
    }
    100%{
            transform: translateY(45px);
    }
}
/* slick dot css */
.slick-dots {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 40px;
    display: inline-block;
    z-index: 11;
    text-align: center;
}
.slick-dots li {
    display: inline-block;
}
.slick-dots li button {
    font-size: 0;
    width: 6px;
    height: 10px;
    line-height: 10px;
    background-color: var(--brcolor);
    border: 0 solid var(--brcolor);
    margin: 0 5px;
    transition: 0.5s;
}
.slick-dots li.slick-active button {
    background: var(--bgcolor);
} 
/*===== testimonial area end ====*/

/*======= home 2 testimonial start  =====*/
.h2_testimonial {
    padding: 60px 0 50px;
}
.site_page_testi22{
    padding: 115px 0 95px;
}
.h2_inner_testimonial {
    position: relative;
    margin: 75px 0px 20px;
    box-shadow: 0px 1px 3px 0px rgb(0 0 0 / 25%);
    padding: 45px 30px 25px;
    transition: .5s;
}
.h2_inner_testimonial:hover{
    transform: translateY(-10px);
}
.h2_testi_ab_img {
    position: absolute;
    top: -50px;
    right: 40px;
}
/* home 2 testimonial paragraph css */
.h2_testi_para {
    padding: 10px 0 0px;
}
.h2_testi_icon>i{
    font-size: 50px;
    color: var(--brcolor);
}
/* home 2 testimonial text css */
.h2_testimonial_text {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.h2_testi_title h2{
    margin: 0;
}
/* home 2 testimonial socail icons css */
.h2_testi_socail_icon i{
    color: #10f710;
    font-size: 18px;
}
.h2_testimonial:hover .slick-prev , .h2_testimonial:hover .slick-next{
    opacity: 1;
    visibility: visible;
}
/*======= home 2 testimonial end  =======*/

/*======= pricing area start  ======*/
.pricing_area {
    padding: 125px 0 50px;
}
/* about pricing */
.about_pricing{
    padding: 95px 0 50px;
}
.site_page_pricing{
    padding: 115px 0 100px;
}
.inner_pricing_area {
    background-color: #F1F1F1;
    border-style: solid;
    border-width: 0px 0px 0px 2px;
    border-color: var(--brcolor);
    margin-bottom: 20px;
}
.pricing_img img{
    width: 100%;
}
/* pricing title area css */
.pricing_title {
    padding: 35px 50px 5px;
}
.pricing_title h2{
    font-size: 16px;
    font-weight: 500;
    font-family: Roboto, sans-serif;
}
.pricing_title h3{
    font-size: 48px;
}
/* inner pricing nav area css */
.inner_pricing_nav{
    padding: 0 50px 0;
}
.inner_pricing_nav ul{
    list-style: none;
    padding: 0;
}
.inner_pricing_nav ul li{
    padding: 10px 0;
}
.inner_pricing_nav ul li i{
    margin-right: 6px;
    font-size: 18px;
    font-weight: 700;
    color: var(--brcolor);
}
/* pricing area btn css */
.pricing_btn a {
    display: inline-block;
    text-align: center;
    width: 100%;
    margin-top: 20px;
    font-size: 18px;
    font-family: Teko, sans-serif;
    padding: 16px 30px;
    background-color: var(--brcolor);
    color: var(--whitec);
    letter-spacing: 1px;
}
.pricing_btn a:hover{
    background-color: var(--bgcolor);
    color: var(--whitec);
}
.pricing_btn a i{
    font-size: 20px;
    font-weight: 900;
}
/* inner pricing style css */
.inner_pricing_area.style_2{
    background-color: var(--bgcolor);
}
.inner_pricing_area.style_2 .pricing_title h2,
.inner_pricing_area.style_2 .pricing_title h3,
.inner_pricing_area.style_2 .inner_pricing_nav ul li,
.inner_pricing_area.style_2 .inner_pricing_nav ul li i{
    color: var(--whitec);
}
/*======= pricing area end  ======*/

/*======== brand area start  ==========*/
.brand_area {
    padding: 50px 0 50px;
    position: relative;
}
.h3_brand_area{
    padding: 45px 0 110px;
}
/* service brand */
.service_brand{
    padding: 120px 0 40px;
}
.inner_brand_area img{
    margin: 0 auto;
}
.brand_area:hover .slick-prev ,.brand_area:hover .slick-next{
    opacity: 1;
    visibility: visible;
}
/*======== brand area end  ==========*/

/*======= shop area start =======*/
.shop_area {
    padding: 45px 0 50px;
}
.shop_area2{
    padding: 120px 0 25px;
}
.inner_shop_area {
    padding: 0 0 20px;
    margin-bottom: 20px;
    box-shadow: 0 0 10px 0 rgb(222 222 222 / 72%);
}
.inner_shop_content {
    padding: 30px 0 0px;
}
.g_btn2.btn_style2 a{
    background-color: var(--brcolor);
    color: var(--whitec);
    box-shadow: 5px 5px 0px 0px var(--bgcolor);
}
.g_btn2.btn_style2 a:hover{
    background-color: var(--bgcolor);
    color: var(--whitec);
    box-shadow: 5px 5px 0px 0px var(--brcolor);
}
.single_shop_page{
    padding: 120px 0 50px;
}
.sin_page_22{
    padding: 120px 0 100px;
}
.inner_sin_shop_img{
    margin-bottom: 20px;
}
/* cart area css */
.cart_area{
    padding: 120px 0 120px;
}
/* product checkout css */
.product_checkout {
    padding: 110px 0 105px;
}
/* my account area css */
.my_accout_area {
    padding: 110px 0 100px;
}
/* portfolio area css */
.portfolio_area {
    padding: 115px 0 120px;
}
/*======== shop area end ======*/

/*======== offer area start ======*/
.offer_area {
    padding: 70px 0 30px;
}
.inner_offer_area{
    background-position: bottom right;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 40px 30px 40px 40px;
    margin-bottom: 20px;
}
.inner_offer_area h2{
    font-size: 48px;
    font-weight: 600;
    margin: 0px 0px 70px 0px;
    color: var(--whitec);
}
.inner_offer_btn a{
    font-size: 18px;
    color: var(--whitec);
    font-family: Teko, sans-serif;
}
/*======== offer area end ======*/

/*======== img area start ==========*/
.inner_img_area{
    position: relative;
}
.img_width {
    max-width: 1830px;
}
.inner_img_area img{
    width: 100%;
}
.inner_img_area a {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: inline-block;
    font-size: 20px;
    border-radius: 30px;
    width: 50px;
    height: 50px;
    line-height: 50px;
    text-align: center;
    color: var(--whitec);
    background: var(--brcolor);
    opacity: 0;
    visibility: hidden;
    transition: .5s;
}
.inner_img_area:hover a{
    opacity: 1;
    visibility: visible;
}
.inner_img_area a:hover{
    background-color: var(--bgcolor);
    color: var(--whitec);
}
/*======== img area end ==========*/

/*======= contact service start ====*/
.contact_service_area {
    padding: 120px 0 50px;
}
.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 ======*/

/*======== contact area start  ==========*/
.contact_area {
    padding: 50px 0 120px;
}
.inner_contact_area {
    padding: 60px 30px 50px 30px;
    box-shadow: 0 0 30px rgb(0 0 0 / 6%);
}
.inner_contact_area .section_title_area{
    margin-bottom: 40px;
}
/* inner contact form */
.inner_contact_form input {
    border: 1px solid #ddddddcc;
    outline: none;
    width: 100%;
    height: 45px;
    border-radius: 5px;
    padding: 0 20px;
    margin-bottom: 23px;
}
.inner_contact_form textarea {
    width: 100%;
    border: 1px solid #ddddddcc;
    outline: none;
    padding: 20px 20px;
}
textarea::placeholder {
    color: var(--paracolor);
}
.inner_contact_form button {
    margin-top: 18px;
    padding: 15px 30px;
    font-size: 18px;
    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);
    color: var(--whitec);
}
.inner_contact_map{
    width: 100%;
    height: 100%;
}
.inner_contact_map iframe {
    width: 100%;
    height: 100%;
}
/*======== contact area end  ==========*/

/*===== faq area start  ====*/
.faq_area{
    padding: 120px 0 100px;
}
.inner_faq_img {
    margin-bottom: 20px;
}
.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  ====*/

/*======== blog area start  ==========*/
.blog_area {
    padding: 70px 0 50px;
    position: relative;
}
/* blog 2 css */
.h2_blog_area{
    padding: 120px 0 50px;
}
/* inner blog area css */
.inner_blog_area {
    overflow: hidden;
    margin-bottom: 20px;
}
.blog_main_all {
    position: relative;
    z-index: 11;
    padding: 25px 25px 30px;
    border-style: solid;
    border-width: 0px 0px 2px 0px;
    border-color: var(--brcolor);
    background-color: var(--whitec);
    margin: -31px 50px 0px 0px;
    box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.1);
}
.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) rotate(3deg);
}
/* 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.1);
}
.inner_blog_text {
    padding: 5px 0 10px;
}
.inner_blog_text span {
    margin-right: 5px;
    color: var(--brcolor);
}
.inner_blog_text span i{
    margin-right: 6px;
    color: var(--brcolor);
}
.blog_btn{
    margin-top: 20px;
}
.blog_btn a{
    font-size: 18px;
    font-family: Teko, sans-serif;
}
.blog_btn a i{
    font-weight: 900;
    margin-left: 6px;
}
.blog_area:hover .slick-prev ,.blog_area:hover .slick-next{
    opacity: 1;
    visibility: visible;
}
/* home 2 blog shap */
.h2_blog_left_shap , .h2_blog_right_shap{
    position: absolute;
    z-index: -1;
    animation: witr_movelr_box45 5s linear 1s infinite alternate running;
}
.h2_blog_left_shap{
    top: 100px;
    left: 0;
}
.h2_blog_right_shap {
    bottom: -20%;
    right: 0;
}
.inner_project_right_content .inner_yblog_left_title{
    margin: 0 0 30px;
}
.yblog_left {
    padding: 120px 0 90px;
}
.yblog_left_inner{
    margin-bottom: 30px;
}
.inner_yblgo_left_style2 a{
    font-family: Teko, sans-serif;
    font-size: 17px;
}
/*======== blog area end  ==========*/


/*===== subscribe area start ======*/
.subscribe_area {
    margin: 55px 0 0;
    padding: 70px 0px 55px 0px;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}
.subscribe_area .section_title_area h3,
.subscribe_area .section_title_area p{
    color: var(--whitec);
}
.subscribe_area .section_title_area h3{
    line-height: 1;
}
/* subscribe form area css */
.inner_subscribe_form_area{
    position: relative;
    overflow: hidden;
}
.inner_subscribe_form_area h2 {
    margin-bottom: 20px;
    font-size: 48px;
}
.inner_subscribe_form_area input {
    width: 100%;
    font-size: 16px;
    line-height: 28px;
    border: none;
    padding: 15px 30px;
    height: 60px;
    background: var(--whitec);
    margin-right: 10px;
}
.inner_subscribe_form_area button {
    position: absolute;
    top: 0;
    right: 0;
    border: none;
    outline: none;
    padding: 18px 55px 17px;
    background-color: var(--brcolor);
    color: var(--whitec);
    transition: .5s;
}
.inner_subscribe_form_area p.form-messege{
    color: var(--whitec);
}
/*======== subscribe area end  ==========*/


/*======== footer area start  ==========*/
.footer_copy_bg{
    animation: animate 35s linear running infinite;
}
@keyframes animate {
	0% {
		background-position: 0 0;
	}
	100% {
	background-position: -1900px 0;
	}
}
.footer_area {
    padding: 95px 0 70px;
}
.h3_footer_area {
    padding: 230px 0 70px;
    margin-top: -120px;
}
/* footer wdget css */
.footer_widget>p {
    margin-top: 30px;
    color: var(--whitec);
}
/* footer socail icon css */
.footer_socail_icons {
    margin-top: 30px;
}
.footer_socail_icons a {
    display: inline-block;
    color: var(--whitec);
    background-color: var(--bgcolor);
    border: 1px solid var(--whitec);
    font-size: 18px;
    height: 35px;
    width: 35px;
    line-height: 35px;
    text-align: center;
    margin-right: 5px;
}
.footer_socail_icons a:hover{
    background-color: var(--brcolor);
    color: var(--whitec);
}
/* footer widget */
.footer_widget h2 {
    padding: 0 0 15px;
    margin-bottom: 40px;
    color: var(--whitec);
    position: relative;
}
.footer_widget h2::before {
    content: '';
    position: absolute;
    bottom: 5px;
    width: 26%;
    border: 1px solid var(--brcolor);
    border-radius: 50%;
}
/* footer time css */
.footer_time ul{
    list-style: none;
    padding-left: 0;
}
.footer_time ul li {
    padding: 5px 5px 5px 24px;
    position: relative;
    color: var(--whitec);
}
.footer_time ul li::before {
    content: '';
    width: 8px;
    height: 8px;
    background: var(--brcolor);
    position: absolute;
    top: 16px;
    left: 0;
}
.footer_time ul li p{
    margin: 0 0;
}
/* footer address area css */
.footer_address ul{
    list-style: none;
    padding-left: 0;
}
.footer_address ul li {
    padding: 0px 0px 10px 0px;
    color: var(--whitec);
}
.footer_address ul li i{
    color: var(--whitec);
    margin-right: 5px;
}
/* footer nav css */
.footer_nav ul{
    list-style: none;
    padding-left: 0;
}
.footer_nav ul li {
    padding: 0 0 10px;
}
.footer_nav ul li a{
    font-size: 17px;
    font-weight: 400;
    color: var(--whitec);
}
.footer_nav ul li a:hover{
    color: var(--brcolor);
}
/* footer widget sub img */
.footer_wid_sub_img {
    margin-top: 20px;
}
.inner_footer_widget_img{
    margin-bottom: 20px;
}
.inner_footer_widget_img img{
    width: 100%;
    height: auto;
}
/*======== footer area end  ==========*/

/*======== copyright area start  ==========*/
.copyright_area {
    padding: 20px 0 20px;
    position: relative;
    z-index: 1;
}
.copyright_area::before{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: var(--brcolor);
    opacity: .5;
    z-index: -1;
}
.copyright_text p{
    color: var(--whitec);
    margin: 0;
}
/*======== 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);
}