/*
    Template  Name: Art
*/

/*
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&display=swap');

:root{
    --blackc: #000;
    --whitec: #fff;
    --bgcolor: #112633;
    --bgcolor2: #141d24;
    --brcolor: #ef9e03;
    --paracolor: #333;
    --titlecolor: #141d24;
}

/* 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: 22px;
    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: 22px;
}
h3{
    font-size: 18px;
}
h4{
    font-size: 17px;
}
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 165px;
    background-color: var(--brcolor);
}
/* header left */
.header_left span, .header_right span, .header_left a{
    font-size: 15px;
    font-weight: 500;
}
.header_left span, .header_left a {
    margin: 0 22px 0 0;
    color: var(--whitec);
}
.header_left span i, .header_left a i {
    margin-right: 4px;
}
/* header top middle css */
.header_top_middle{
    text-align: center;
}
/* header right */
.header_right a {
    font-size: 15px;
    font-weight: 600;
    color: var(--whitec);
    margin-left: 12px;
}
.header_right a i{
    margin-right: 5px;
}
/*======= header top area end ======*/

/*======== main menu area start ==========*/
.main_menu_area {
    padding: 0px 165px;
    background-color: var(--bgcolor);
}
.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_btn a{
    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,
.main_menu_area.sticky .main_me_cont p,
.main_menu_area.sticky .main_me_cont p a{
    color: var(--whitec);
}
/* main nav area css */
.main_nav_area {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.main_menu_all_item{
    position: relative;
    align-items: center;
}
/* inner main nav area css */
.inner_main_nav_area {
    display: flex;
    align-items: center;
}
.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: 16px;
    text-transform: uppercase;
    color: var(--whitec);
}
.inner_main_nav_area >ul >li >a>i {
    font-size: 15px;
    font-weight: 700;
    margin-left: 5px;
}
.inner_main_nav_area >ul> li> a:hover{
    color: var(--brcolor);
}
.absolute_menu .inner_main_nav_area >ul >li >a{
    color: var(--whitec);
}
.absolute_menu .inner_main_nav_area >ul >li >a:hover{
    color: var(--brcolor);
}
/* drop down menu css */
.inner_main_nav_area ul li .sub_menu{
    position: absolute;
    top: 130%;
    left: 0;
    width: 240px;
    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: 15px;
    font-weight: 500;
    text-transform: uppercase;
    color: var(--blackc);
    padding: 6px 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;
}
/* absolute menu css */
.absolute_menu{
    position: absolute;
    left: 0;
    right: 0;
    z-index: 999;
}
/* main nav icons together */
.main_nav_right_together {
    display: flex;
    align-items: center;
}
/* main nav icons */
.main_nav_icons >i {
    display: inline-block;
    font-size: 20px;
    color: var(--whitec);
    margin-left: 10px;
    cursor: pointer;
}
/* main menu address area css */
.main_menu_add_area {
    display: flex;
    align-items: center;
}
.main_me_call_icon {
    margin-right: 10px;
}
.main_me_call_icon i{
    font-size: 30px;
    color: var(--whitec);
}
.main_me_cont p,
.main_me_cont p a{
    font-size: 16px;
    font-weight: 600;
    margin: 0;
    color: var(--whitec);
}
/* main nav btn css */
.main_nav_btn a {
    display: inline-block;
    font-size: 16px;
    padding: 37px 50px;
    background-color: var(--brcolor);
    color: var(--whitec);
}
.main_nav_btn a: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;
    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: 15px;
    position: relative;
}
.main_nav_icons_middle a {
    position: relative;
    font-size: 22px;
    cursor: pointer;
    padding: 8px;
    display: inline-flex;
    background: #fff;
    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_middle_box_item p{
    padding: 20px 20px;
}
.main_nav_icons_middle:hover .main_nav_middle_box_item{
    top: 180%;
    opacity: 1;
    visibility: visible;
}
/*======== main menu area end ==========*/

/*======== h3  menu area  start ==========*/
.absolute_menu {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    background: none;
}
.absolute_menu 
.main_nav_area{
    justify-content: end;
}
.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)
}
/*======== h3  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: #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: #ffffff;
}
.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  ==========*/
.slider_area {
    padding: 0 120px;
    background-color: var(--bgcolor2);
}
.inner_slider_area {
    height: 640px;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    padding: 0px 0px 10px 0px;
    border-bottom: 5px solid var(--brcolor);
}
.inner_slider_content {
    width: 71%;
    padding: 65px 0 55px;
    margin: 0px auto 0px;
    display: flex;
}
.inner_slide_title h1 {
    font-size: 18px;
    font-weight: 500;
    color: var(--brcolor);
}
.inner_slide_title h2{
    font-size: 48px;
    color: var(--whitec);
    margin: 0;
}
.inner_slid_para p {
    width: 74%;
    padding: 0 0 0 40px;
    font-size: 18px;
    font-weight: 600;
    margin: 20px 0 50px;
    color: var(--whitec);
}
/* home 2 slider area css */
.h2_slider_area{
    padding: 0 0;
    background: transparent;
}
.h2_slider_area .inner_slider_area{
    height: 950px;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    display: flex !important;
    align-items: center;
    border: none;
}
.h2_slider_area .inner_slider_content {
    padding: 0 0;
    display: block;
    text-align: center;
}
.h2_slider_area .inner_slider_content h1{
    font-size: 24px;
    text-transform: uppercase;
    letter-spacing: 2.5px;
    color: var(--whitec);
}
.h2_slider_area .inner_slider_content h2 {
    font-size: 90px;
    line-height: 1;
    margin-bottom: 50px;
    color: var(--whitec);
}
/* home 3 slider area css */
.slider_area .h3_inner_slider_content h1 {
    color: var(--whitec);
    font-size: 60px;
    font-weight: 500;
    letter-spacing: 2.5px;
    text-transform: inherit;
}
.slider_area .h3_inner_slider_content h2{
    color: var(--whitec);
    font-size: 120px;
}
/* btn style 2 */
.gbtn.style2 a{
    border: none;
    padding: 16px 50px;
}
.gbtn.style2 a:hover{
    border: none;
    background-color: var(--bgcolor);
    color: var(--whitec);
}
.gbtn.style2 a.active{
    border: none;
    background-color: var(--bgcolor);
    color: var(--whitec);
}
.gbtn.style2 a.active:hover{
    background-color: var(--brcolor);
    color: var(--whitec);
}
/* btn style 3 */
.h3_inner_slider_content .gbtn a{
    background-color: #02010100;
    font-size: 18px;
    font-weight: 600;
    border-style: solid;
    border-width: 1px 1px 1px 1px;
    border-radius: 5px 5px 5px 5px;
}
.h3_inner_slider_content .gbtn a:hover{
    border: 1px solid transparent;
    background-color: var(--brcolor);
    color: var(--whitec);
}
/* 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';
}
/* 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;
    color: var(--whitec);
}
.slider_area .slick-prev{
    left: 5px;
}
.slider_area .slick-next{
    right: 20px;
}
.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 end  ==========*/

/*======== breadcum area start  ==========*/
.breadcum_area {
    background-size: cover;
    background-position: center center;
    padding: 60px 0;
}
.inner_breadcum_area h1{
    font-size: 29px;
    color: var(--whitec);
    font-weight: 700;
    margin: 0;
}
.inner_breadcum_area ul{
    list-style: none;
    margin: 0;
    padding: 0;
}
.inner_breadcum_area ul li{
    display: inline-block;
    color: var(--whitec);
}
.inner_breadcum_area ul li a{
    display: inline-block;
    font-size: 16px;
    font-weight: 400;
    color: var(--whitec);
}
.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: #00000047;
}
.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{
    color: var(--whitec);
}
/*======== video slider area end  ==========*/

/*====== feature area start  =====*/
.feature_area{
    padding: 100px 0 35px;
    background-color: var(--bgcolor2);
}
.single_feature {
    padding: 25px 20px 5px 30px;
    box-shadow: 0px 1px 30px 0px rgba(0, 0, 0, 0.15);
    background-color: var(--bgcolor);
    display: flex;
    margin-bottom: 20px;
}
.sin_feature_img{
    margin-right: 20px;
}
.sin_feature_content h3 a{
    font-size: 18px;
    color: var(--brcolor);
}
.sin_feature_content p{
    font-size: 14px;
    color: var(--whitec);
}
/*====== feature area end  =====*/

/*====== h2 feature area start  =====*/
.h2_feature_area {
    padding: 115px 0 50px;
    background-position: center center;
    background-size: cover;
}
.h2_single_feature{
    position: relative;
    overflow: hidden;
}
.h2_sin_fea_img img{
    width: 100%;
    transition: .5s;
}
.h2_single_feature:hover .h2_sin_fea_img img{
    transform: scale(1.1);
}
/* feature overlay css */
.h2_fea_overlay{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #0000008c;
    transform: scale(0);
    transition: .5s;
}
.h2_single_feature:hover .h2_fea_overlay{
    transform: scale(1.1);
}
/* single feature content css */
.h2_sin_fea_content {
    position: absolute;
    bottom: 25px;
    left: 30px;
}
.h2_sin_fea_content h2 a{
    color: var(--whitec);
}
.h2_sin_fea_content h2 a:hover{
    color: var(--brcolor);
}
.h2_feature_area:hover .slick-prev ,.h2_feature_area:hover .slick-next{
    opacity: 1;
    visibility: visible;
}
/*====== h2 feature area end  =====*/

/*======== call to action start  ==========*/
.call_to_action{
    padding: 50px 0 50px;
    background-color: var(--bgcolor2);
}
.inner_call_to_action{
    position: relative;
    z-index: 1;
}
.inner_call_to_action h2{
    font-size: 72px;
    color: var(--whitec);
}
.inner_call_to_action p {
    width: 90%;
    font-size: 18px;
    margin: 35px auto 0;
    color: var(--whitec);
}
.call_title_shap {
    position: absolute;
    top: -40px;
    left: 0;
    right: 0;
    z-index: -1;
    animation: witr_movelr_box45 5s linear 1s infinite alternate running;
}
@keyframes witr_movelr_box45 {
    0%{
         transform: translateX(0px);
      }
    100%{
        transform: translateX(45px);
      }
}
@keyframes witr_movelr_box46 {
    0%{
         transform: translateY(0px);
}
    100%{
        transform: translateY(45px);
}
}
/*======== call to action end  ==========*/

/*======= h2 call to action start  ======*/
.h2_call_to_area{
    position: relative;
    background: none;
}
.h2_call_to_area .inner_call_to_action h2{
    font-size: 60px;
    color: var(--titlecolor);
}
.h2_call_to_area .inner_call_to_action p {
    color: var(--paracolor);
    margin: 35px auto 40px;
}
.h2_call_shap {
    width: 100%;
    position: absolute;
    top: -92%;
    z-index: -1;
    animation: witr_movelr_box45 5s linear 1s infinite alternate running;
}
.h2_call_shap img {
    width: 76%;
}
/*======= h2 call to action end  ======*/

/*======= dn slider area start =====*/
.dnslider_area {
    padding: 70px 0 50px;
}
.dnslide_width{
    max-width: 1560px;
}
.Screenshots .slick-slide img,.dnSlide-main img,.dnSlide-main.dn-response {
    width: 100%
}
.Screenshots-fearm {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    z-index: 99
}
.Screenshots-area,.Screenshots-slide .slick-center,.dnSlide-main,.mobile-slide-7 .mobile-thumb {
    position: relative
}
.Screenshots-fearm img {
    width: 154%!important;
    max-width: 154%!important;
    position: relative;
    left: -123px;
    top: -26px
}
.Screenshots .dnSlide-main .dnSlide-btn {
    height: 50px!important;
    width: 50px!important;
    line-height: 50px!important;
    opacity: 1;
    position: absolute;
    z-index: 10;
    cursor: pointer
}
.Screenshots .dnSlide-main .dnSlide-left-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 20px;
    opacity: 1;
    background: var(--brcolor);
    color: var(--whitec);
}
.Screenshots .dnSlide-main .dnSlide-right-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 20px;
    opacity: 1;
    background: var(--brcolor);
    color: var(--whitec);
}
.Screenshots .dnSlide-main .dnSlide-left-btn:before {
    position: absolute;
    content: '\eac9';
    left: 43%;
    top: 46%;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    font-size: 35px;
    font-family: icofont!important
}
.Screenshots .dnSlide-main .dnSlide-right-btn:before {
    position: absolute;
    content: '\eaca';
    left: 52%;
    top: 47%;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    font-size: 35px;
    font-family: icofont!important
}
.Screenshots-slide .slick-center .slide-item img,.Screenshots:hover .dnSlide-main .dnSlide-left-btn,.Screenshots:hover .dnSlide-main .dnSlide-right-btn,.mobile-slide .slick-center .mobile-thumb img,.mobile-slide-6 .slick-center .mobile-thumb img,.mobile-slide-7 .mobile-thumb:hover .mobile-slide-overlay {
    opacity: 1
}
.Screenshots-slide .slide-item img,.mobile-slide .mobile-thumb img,.mobile-slide-6 .mobile-thumb img {
    opacity: .1;
    width: 100%
}
.Screenshots-area .Screenshots-frame-img {
    position: absolute;
    left: 10px;
    top: -29px;
    width: 100%
}
.dnSlide-main,.dnSlide-main .dnSlide-list {
    width: 800px;
    list-style: none;
    height: 234px
}
.Screenshots-frame-img img {
    width: 43%;
    position: absolute;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%)
}
.Screenshots-slide .slick-arrow.slick-prev {
    left: 200px
}
.Screenshots-slide .slick-arrow.slick-next {
    right: 200px
}
.dnSlide-main.dnSlide-hide,.play-overlay span {
    display: none
}
.dnSlide-main {
    visibility: hidden;
    padding: 0;
    margin: 0 auto;
    -webkit-tap-highlight-color: transparent
}
.dnSlide-main.done {
    visibility: visible
}
.dnSlide-main.dn-response .dnSlide-list {
    width: 100%;
    height: 100%;
    margin: 0;
    padding-left: 0
}
.dnSlide-main a,.dnSlide-main img {
    display: block;
    border: 0
}
.dnSlide-main .dnSlide-btn {
    color: #000;
    height: 234px;
    width: 100px;
    opacity: .5;
    position: absolute;
    top: 0;
    left: 0;
    transition: opacity .3s;
    z-index: 10;
    cursor: pointer;
    background-repeat: no-repeat;
    background-position: center center
}
.dnSlide-main .dnSlide-btn:hover {
    opacity: .8;
    transition: opacity .3s
}
.dnSlide-main .dnSlide-item {
    position: absolute;
    top: 0;
    left: 0
}
.dnSlide-main .dnSlide-left-btn {
    left: 0
}
.dnSlide-main .dnSlide-right-btn {
    right: 0;
    left: auto
}
/*======= dn slider area end =====*/

/*======== gallary area start ==========*/
.gallary_area{
    padding: 60px 0 50px;
    background-color: var(--bgcolor2);
}
.gall_width {
    max-width: 1480px;
}
/* section title area css */
.margin_bottom {
    margin-bottom: 35px;
}
.section_title_area {
    position: relative;
    margin-bottom: 40px;
    display: flex;
    justify-content: space-between;
    align-items: baseline;
}
.section_title_area.section_border {
    padding-bottom: 10px;
    border-bottom: 2px solid var(--brcolor);
}
.section_title_con h3{
    font-size: 48px;
    color: var(--whitec);
}
.section_title_btn a{
    font-size: 18px;
    font-weight: 600;
    color: var(--brcolor);
}
.section_title_para p{
    color: var(--whitec);
}
.section_title_area.style2{
    display: block;
}
.section_title_area.style2 h2{
    font-size: 18px;
    font-weight: 500;
    color: var(--brcolor);
}
.section_title_area.style2 h3{
    font-size: 48px;
    color: var(--whitec);
}
.section_title_area.style2 p{
    color: var(--whitec);
}
.h2_se_margin{
    margin-bottom: 30px;
}
.section_title_area.color h3{
    color: var(--titlecolor);
}
.section_title_para.color p {
    font-size: 18px;
    font-weight: 500;
    color: var(--paracolor);
}
.section_title_para.font_sm p{
    font-size: 16px;
    font-weight: 400;
    color: var(--paracolor);
}
/* inner gallary area css */
.inner_gallary_area{
    margin-bottom: 30px;
}
.inner_gallary_img{
    position: relative;
    overflow: hidden;
}
.inner_gallary_img img{
    width: 100%;
}
.gallary_overlay{
    position: absolute;
    top: 0;
    right: 0;
    width: 0%;
    height: 100%;
    background-color: #ef9e0396;
    transition: 1s;
}
.inner_gallary_area:hover .gallary_overlay{
    width: 100%;
}
/* inner gallary content css */
.inner_gallary_content {
    padding: 15px 0px 0px 10px;
}
.inner_gallary_content h2{
    color: var(--whitec);
    font-size: 36px;
}
.inner_gallary_content p{
    font-size: 18px;
    font-weight: 500;
    color: var(--brcolor);
}
/* home 2 gallary css */
.h2_gallay_area {
    background: none;
    padding: 30px 0 0px;
    background-position: center center;
    background-size: cover;
}
/* about gallary css */
.about_gallary{
    padding: 60px 0 70px;
}
.h2_gallay_area .inner_gallary_content h2{
    color: var(--titlecolor);
    font-weight: 600;
}
.gallary_area:hover .slick-prev ,.gallary_area:hover .slick-next{
    opacity: 1;
    visibility: visible;
}
/*======== gallary area end ==========*/

/*======== book area start ==========*/
.h3_all_bg{
    background-position: center center;
    background-size: cover;
}
.book_area {
    padding: 25px 0 50px;
    background-color: var(--bgcolor2);
}
/* home 2 book area css */
.h2_book_area {
    padding: 55px 0 50px;
    background: transparent;
}
/* home 3 book css */
.h3_book_area{
    padding: 10px 0 50px;
    background: transparent;
}
/* home 3 style bg css */
.h3_bg_book_area {
    margin: 110px 0 45px;
    padding: 50px 0 50px;
    background-color: var(--brcolor);
}
/* service book css */
.service_book{
    margin: 70px 0 45px;
}
.book_bg {
    padding: 20px 10px 20px;
    background-color: var(--bgcolor);
    border-left: 8px solid var(--brcolor);
}
.inner_book_area h3{
    font-size: 36px;
    color: var(--whitec);
}
.gbtn a{
    display: inline-block;
    font-size: 16px;
    font-weight: 600;
    border: 5px solid #FBBC45;
    background-color: var(--brcolor);
    color: var(--whitec);
    padding: 12px 60px 12px 60px;
    margin-right: 15px;
}
.gbtn a:hover{
    border: 5px solid #FBBC45;
    background-color: var(--bgcolor);
    color: var(--whitec);
}
.gbtn a.active{
    border: 5px solid #AFAFAE;
    background-color: var(--whitec);
    color: var(--brcolor);
}
.gbtn a.active:hover{
    background-color: var(--bgcolor);
    color: var(--whitec);
}
/*======== book area end ==========*/

/*======== testimonial area start =======*/
.testimonial_area{
    background-position: center center;
    background-size: cover;
}
.inner_testimonial {
    margin: 60px 20px 70px;
    position: relative;
}
.inner_testimonial p {
    margin: 0 0 30px;
    font-size: 48px;
    line-height: 55px;
    color: var(--whitec);
}
.inner_testimonial h2{
    font-size: 18px;
    color: var(--brcolor);
}
.inner_testimonial h2 span{
    font-size: 16px;
    color: var(--whitec);
}
/* testimonial icon css */
.testi_icon {
    position: absolute;
    top: -40px;
    right: 0;
}
.testimonial_area:hover .slick-prev ,.testimonial_area:hover .slick-next{
    opacity: 1;
    visibility: visible;
}
/* home 2 testimonial css */
.h2_testimonial .inner_testimonial p{
    color: var(--paracolor);
    font-weight: 600;
}
.sin_page_testi{
    padding: 50px 0 0px;
}
.h2_testimonial .inner_testimonial h2 span{
    color: var(--paracolor);
}
/*======== testimonial area end =======*/

/*===== home 3 testimonial area start ====*/
.h3_testimonial_area{
    padding: 50px 0 100px;
}
.h3_testi_content{
    position: relative;
    box-shadow: 0 0 20px 0 rgb(0 0 0 / 6%);
    background: var(--whitec);
    border-radius: 5px;
    padding: 50px 20px 50px;
}
.h3_testi_content p{
    margin: 0;
}
.h3_testi_content i {
    font-size: 100px;
    color: #dddddd4f;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.h3_testi_box{
    position: absolute;
    content: '';
    left: 50%;
    bottom: -36px;
    border-radius: 15px;
    width: 50px;
    height: 50px;
    background: #fff;
    transform: rotate(45deg) translateX(-50%);
    z-index: -1;
    box-shadow: 0 2px 29px 0 rgb(0 0 0 / 8%);
}
/* testi title css */
.h3_testi_title{
    margin-top: 30px;
}
.h3_testi_title img{
    border-radius: 50%;
    width: 59px;
    margin: 0 auto 10px;
}
.h3_testi_title h2{
    margin: 0;
}
.h3_testimonial_area:hover .slick-prev ,.h3_testimonial_area:hover .slick-next{
    opacity: 1;
    visibility: visible;
}
/*===== home 3 testimonial area end ====*/

/*======== video area start ==========*/
.video_area{
    padding: 50px 0 50px;
    background-color: var(--bgcolor2);
}
.inner_video_area{
    position: relative;
}
.inner_video_area img{
    width: 100%;
}
.inner_popup_video a {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: inline-block;
    width: 75px;
    height: 75px;
    line-height: 75px;
    font-size: 23px;
    border-radius: 100%;
    text-align: center;
    animation: witr-shadow 1s linear infinite;
    background-color: var(
    --brcolor);
    color: var(
    --whitec);
}
@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);
   }
}
.inner_progress {
    padding: 100px 275px 110px 120px;
}
.skill_left_inner {
    padding: 0px 0 35px;
}
/* progress bar css */
.witr_single_progress {
    overflow: hidden;
    margin-bottom: 20px;
}
.progress {
    display: flex;
    height: 5px;
    background-color: var(--brcolor);
}
.progress-bar {
    overflow: initial;
    background-color: var(--brcolor);
}
.witr_title2 span {
    color: var(--whitec);
}
.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: #349880;
    border-radius: 0;
    margin-bottom: 2px;
}
.witr_progress-style2 + .witr_progress-style2 {
	margin-top: 60px;
}
.witr_progress-style2 .progress-bar {
    position: relative;
    text-align: left;
    border-radius:0;
    line-height: 25px;
    box-shadow: none;
    height: 5px;
}
.witr_title6 .witr_label {
	left: 2px;
	top: 8px;
	color: var(--whitec);
	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(--whitec);
}
/*======== video area end ==========*/

/*======== event area start ==========*/
.event_area{
    padding: 60px 0 60px;
    background-color: var(--bgcolor2);
}
.event_all_item{
    margin-bottom: 30px;
}
.inner_event_img{
    position: relative;
    overflow: hidden;
}
.inner_event_img img{
    width: 100%;
    transition: .5s;
}
.event_all_item:hover .inner_event_img img{
    transform: scale(1.1);
}
.event_overlay{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #00000092;
    transform: scale(0);
    transition: .5s;
}
.event_all_item:hover .event_overlay{
    transform: scale(1.1);
}
.inner_event_content h2 a{
    font-size: 36px;
    color: var(--whitec);
}
.inner_event_content p{
    font-size: 18px;
    color: var(--brcolor);
}
/* home 2 event area css */
.h2_event_area {
    background: none;
    padding: 30px 0 60px;
}
/* single page event */
.single_page_event{
    padding: 100px 0 60px;
}
.h2_event_area .event_all_item {
    border-bottom: 1px solid;
    padding-bottom: 15px;
}
.h2_event_area .inner_event_content h2 a{
    color: var(--titlecolor);
}
.h2_event_area .inner_event_content h2 a:hover{
    color: var(--brcolor);
}
/*======== event area end ==========*/

/*======== title area start ==========*/
.title_area {
    padding: 70px 0 70px;
    background-position: top center;
    background-size: cover;
}
/* home 2 title css */
.h2_title_area {
    padding: 60px 0 0px;
    background-position: center center;
    background-size: cover;
}
/* home 3 title css */
.h3_title_area{
    padding: 20px 0 70px;
}
/* title img css */
.title_img {
    margin-top: 20px;
    position: relative;
}
.title_img img{
    width: 100%;
}
.title_absolate_text {
    position: absolute;
    left: 65px;
    bottom: 80px;
    z-index: 9;
    padding: 20px 30px;
    width: 210px;
    background-color: var(--brcolor);
}
.title_absolate_text h2{
    font-size: 36px;
    font-weight: 600;
    color: var(--whitec);
}
.title_absolate_text p{
    font-size: 18px;
    color: var(--whitec);
    margin: 0;
}
/*======== title area end ==========*/

/*===== faq area start  ====*/
.faq_area{
    padding: 120px 0 110px;
}
.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: 17px;
    font-weight: 600;
    border: none;
    box-shadow: 0 0 5px #dddddd7d;
}
/*===== faq area end  ====*/

/* site page section area css */
.shop_area{
    padding: 60px 0 50px;
}
.inner_shop_area {
    background-color: var(--whitec);
    border-radius: 5px;
    margin-bottom: 20px;
    padding: 20px 0 20px;
    box-shadow: 0px 1px 10px 0px rgba(0, 0, 0, 0.1);
}
.shop_area .slick-prev, .shop_area .slick-next {
    opacity: 1;
    visibility: visible;
    top: -120px;
}
.my_accout_area {
    padding: 110px 0 100px;
}
.cart_area {
    padding: 120px 0 100px;
}
.single_shop_page{
    padding: 120px 0 100px;
}

/*======== contact area start  ==========*/
.contact_area {
    padding: 120px 0 100px;
}
.inner_contact_area {
    padding: 60px 30px 80px;
    box-shadow: 0 0 30px rgb(0 0 0 / 6%);
}
.inner_contact_area .section_title_area{
    margin-bottom: 20px;
}
/* inner contact form */
.inner_contact_form input {
    border: 1px solid #ddddddcc;
    outline: none;
    width: 100%;
    height: 60px;
    padding: 0 20px;
    border-radius: 5px;
    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 {
    width: 100%;
    margin-top: 18px;
    padding: 15px 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);
    color: var(--whitec);
}
.inner_contact_map{
    width: 100%;
    height: 100%;
}
.inner_contact_map iframe {
    width: 100%;
    height: 100%;
}
/*======== contact area end  ==========*/

/*======== blog area start  ==========*/
.blog_area {
    padding: 65px 0 50px;
    background-color: var(--bgcolor2);
}
/* inner blog area css */
.inner_blog_area {
    overflow: hidden;
    margin-bottom: 20px;
    background-color: var(--bgcolor);
    box-shadow: 0 5px 10px 0 rgba(50, 65, 141, .07);
}
.blog_main_all {
    padding: 15px 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 css */
.inner_blog_text span {
    color: var(--brcolor);
}
/*inner blog content css */
.inner_blog_content {
    padding: 15px 0px 0px;
}
.inner_blog_content h2 a {
    display: inline-block;
    color: var(--whitec);
}
.inner_blog_content h2 a:hover{
    color: var(--brcolor);
}
.inner_blog_btn a{
    font-size: 16px;
    color: var(--brcolor);
}
.inner_blog_btn a:hover{
    color: var(--whitec);
}
/* site blog css */
.yblog_left {
    padding: 120px 0 90px;
}
.yblog_left_inner{
    background-color: var(--whitec);
    margin-bottom: 30px;
}
.yblog_left_text_sub{
    position: inherit;
}
.yblog_left_text_sub span{
    background: none;
    padding: 0 0;
    color: inherit;
    margin-right: 10px;
}
.yblog_left_sub h2{
    margin-bottom: 10px;
}
.yblog_left_sub h2 a{
    color: var(--titlecolor);
}
/*======== blog area end  ==========*/

/*======== h2 blog area start  ==========*/
.h2_blog_area{
    background: none;
    position: relative;
}
.h2_blog_area .inner_blog_area{
    background-color: var(--whitec);
}
.h2_blog_area .inner_blog_content h2 a{
    font-size: 24px;
    font-weight: 600;
    color: var(--titlecolor);
}
.h2_blog_area .blog_main_all {
    padding: 80px 10px 30px;
}
/* home 2 blog shap css */
.h2_blog_shap {
    position: absolute;
    top: -26%;
    left: 50px;
    width: 100%;
    z-index: -1;
    animation: witr_movelr_box45 5s linear 1s infinite alternate running;
}
.h2_blog_shap img {
    width: 82%;
}
/*======== h2 blog area end  ==========*/

/*======== brand area start  ==========*/
.brand_area {
    padding: 30px 0 100px;
}
.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: 35px 0 90px;
    background-color: var(--bgcolor2);
}
.inner_subscribe_form {
    position: relative;
    overflow: hidden;
}
.inner_subscribe_form input{
    width: 100%;
    background-color: var(--bgcolor);
    color: var(--whitec);
    font-size: 16px;
    line-height: 28px;
    border-radius: 0;
    border-left: 5px solid var(--brcolor);
    outline: 0;
    padding: 15px 30px;
    height: 50px;
}
.inner_subscribe_form input::placeholder{
    color: var(--whitec);
}
.inner_subscribe_form button {
    position: absolute;
    top: 0;
    right: 0;
    display: inline-block;
    padding: 13px 100px 10px;
    font-size: 16px;
    font-weight: 600;
    border: none;
    outline: none;
    background-color: var(--brcolor);
    color: var(--whitec);
    transition: .5s;
}
.inner_subscribe_form button:hover{
    background-color: var(--bgcolor);
    color: var(--whitec);
}
/*======== subscribe area end ==========*/

/*======== map area start  ==========*/
.map_area {
    margin: 0 0 0px;
}
.inner_map_area {
    width: 100%;
    height: 400px;
}
.inner_map_area iframe {
    width: 100%;
    height: 100%;
    border: none;
    outline: none;
}
/*======== map area end  ==========*/

/*======== footer area start  ==========*/
.footer_area {
    padding: 55px 0 40px;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
/* footer wdget css */
.footer_logo {
    margin-bottom: 15px;
}
.footer_widget p {
    color: var(--whitec);
}
/* footer socail icon css */
.footer_socail_icons{
    margin-top: 20px;
}
.footer_socail_icons a {
    display: inline-block;
    border-radius: 4px;
    background-color: var(--brcolor);
    color: var(--whitec);
    height: 40px;
    width: 40px;
    line-height: 40px;
    font-size: 20px;
    text-align: center;
    margin-right: 5px;
}
.footer_socail_icons a:hover{
    background-color: var(--bgcolor);
    color: var(--whitec);
}
/* footer widget */
.footer_widget{
    margin-bottom: 20px;
}
.footer_widget h2 {
    padding: 0 0 10px;
    color: var(--whitec);
}
/* footer nav css */
.footer_nav ul{
    list-style: none;
    padding-left: 0;
}
.footer_nav ul li {
    padding: 0 0 12px;
}
.footer_nav ul li a{
    font-size: 16px;
    font-weight: 400;
    color: var(--whitec);
}
.footer_nav ul li a:hover{
    color: var(--brcolor);
}
.footer_nav ul li a i{
    font-weight: 900;
    color: var(--whitec);
}
/* footer address css */
.footer_address ul{
    list-style: none;
    padding: 0;
}
.footer_address ul li {
    padding: 0 0 10px;
    color: var(--whitec);
}
.footer_address ul li i{
    margin-right: 8px;
}
/* footer blog css */
.footer_blog_area {
    margin-top: 12px;
}
.footer_main_add{
    display: flex;
    margin-bottom: 20px;
}
.footer_blog_area img {
    width: 70px;
    height: 70px;
    margin-right: 10px;
}
.footer_add_cont a {
    display: inline-block;
    font-size: 15px;
    color: var(--whitec);
    line-height: 19px;
}
.footer_add_cont a:hover{
    color: var(--whitec);
}
.footer_add_cont span{
    display: block;
    font-size: 14px;
    font-weight: 400;
    color: var(--whitec);
}
/* 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  ==========*/
.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);
}