/*
    Template Name: Qcity
*/

/*
Table Of Content

1. Top Menu CSS
2. Menu Area CSS
3. Slider Area CSS
4. Feature Area CSS
5. About Area CSS
6. Service Area CSS
7. Team Area CSS
8. Pricing Area CSS
9. Testimonial Area CSS
10. Portfolio Area CSS
11. Brand Area CSS
12. Faq Area CSS
13. Contact Area CSS
14. Skill Area CSS
15. Blog Area CSS
16. Footer Area CSS
17. Breadcum Area CSS


*/

/* ======= site font family ==========*/
@import url('css2.css');


:root{
    --blackc: #000;
    --whitec: #fff;
    --bgcolor: #002e70;
    --brcolor: #ff7402;
    --paracolor: #333333;
    --titlecolor: #333333;
}
html,body{
    overflow-x: hidden;
}
/* defult css */
body{
    font-size: 16px;
    font-weight: 400;
    font-family: "Roboto", sans-serif;
    color: var(--paracolor);
}
a{
    font-size: 15px;
    font-weight: 500;
    font-family: "Roboto", sans-serif;
    text-decoration: none !important;
    color: var(--blackc);
    transition: .5s;
}
a:hover{
    color: var(--brcolor);
}
h1,h2,h3,h4,h5,h6,h1 a,h2 a,h3 a,h4 a,h5 a,h6 a{
    font-size: 30px;
    font-weight: 700;
    font-family: "Roboto", sans-serif;
    color: var(--titlecolor);
}
h1,
h1 a{
    font-size: 30px;
}
h2,
h2 a{
    font-size: 20px;
}
h3,
h3 a{
    font-size: 18px;
}
h4,
h4 a{
    font-size: 17px;
}
h5,
h5 a{
    font-size: 16px;
}
h6,
h6 a{
    font-size: 15px;
}
h1 a,h2 a,h3 a,h4 a,h5 a,h6 a{ 
    color:inherit;    
}
.witr_all_pd0{
    padding: 0;
}
/* highlight color css */
.highlight{
    color: var(--brcolor);
}
.bg-color{
    color: #f7f7f7;
}
input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus,
input:-webkit-autofill:active,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
textarea:-webkit-autofill:active,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus,
select:-webkit-autofill:active{
  transition: background-color 50000s ease-in-out 0s, color 5000s ease-in-out 0s;	
}
p.form-messege{
    margin-top: 8px;
    color: var(--brcolor);
}
/*======= header top area start =====*/
.header_top_area {
    background-color: var(--brcolor);
    padding: 12px 290px;
}
/* header left */
.header_left span, .header_right span{
    font-size: 15px;
    font-weight: 500;
    color: var(--whitec);
}
.header_left span,
.header_left a{
    margin: 0 8px;
    color: var(--whitec);
}
.header_left span i,
.header_left a i{
    margin-right: 6px;
}
/* header right */
.header_right a{
    margin-left: 12px;
    color: var(--whitec);
}
.header_right a:hover{
    color: var(--textcolor);
}
.header_right span i{
    margin-right: 5px;
}
/*======= header top area end ======*/

/*======== main menu area start ==========*/
.main_menu_area {
    padding: 0 10px 0 10px;
    background-color: var(--whitec);
}
/* mobile menu */
.mobile_menu{
    display: none;
}
.mobile_logo_area{
    display: none;
}
.main_menu_area.sticky {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 999999;
    background: #FFFFFF;
}
.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(--brcolor);
}
.main_menu_area.sticky .main_nav_icon_right> i{
    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(--brcolor);
}
.main_menu_area.sticky .main_nav_btn a{
    color: var(--whitec);
}
.main_menu_area.sticky .main_nav_icons a i{
    color: var(--whitec);
}
/* main nav area css */
.main_nav_area{
    display: flex;
    align-items: center;
    justify-content: flex-start;
}
.main_menu_all_item {
    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 18px 35px;
    font-size: 17px;
    font-weight: 600;
    color: var(--titlecolor);
}
.inner_main_nav_area >ul >li >a>i {
    font-size: 15px;
    font-weight: 700;
    color: var(--titlecolor);
}
.inner_main_nav_area >ul> li> a:hover{
    color: var(--brcolor);
}
/* absolute menu css */

.absolute_menu2 {
    position: absolute;
    left: 0;
    right: 0;
    z-index: 999;
    background: none;
    padding: 0 290px;
}

.absolute_menu {
    position: absolute;
    left: 0;
    right: 0;
    z-index: 999;
    background: none;
    padding: 0 290px;
}
.absolute_menu .main_nav_area{
    justify-content: flex-end;
}
.absolute_menu .inner_main_nav_area >ul >li >a{
    color: var(--whitec);
}
.absolute_menu .inner_main_nav_area >ul >li >a>i{
    color: var(--whitec);
}
.absolute_menu .inner_main_nav_area >ul >li >a:hover{
    color: var(--brcolor);
}
.absolute_menu .site_logo_area{
    text-align: left;
}
.absolute_menu .main_nav_area .main_nav_btn a{
    margin-left: 0;
}
/* drop down menu css */
.inner_main_nav_area ul li .sub_menu{
    position: absolute;
    top: 130%;
    left: 0;
    width: max-content;
    min-width: 205px;
    max-width: 320px;
    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;
    font-weight: 500;
    color: var(--titlecolor);
    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 .sub_menu li a i{
    font-weight: 700;
}
.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;
}
/* site logo area css */
.site_logo_area {
    text-align: center;
}
.main_menu_right_btn{
    display: flex;
    align-items: center;
    justify-content: flex-end;
}
.main_menu_socail_icons a {
    height: 36px;
    width: 36px;
    line-height: 36px;
    margin: 0 5px;
    box-shadow: 0 0 10px 0px #9797974a;
    background: var(--whitec);
    display: inline-block;
    text-align: center;
    border-radius: 50px;
    font-size: 17px;
}
.main_menu_socail_icons a:hover{
    background-color: var(--brcolor);
    color: var(--whitec);
}
/* main nav btn area css */
.main_nav_btn a{
    display: inline-block;
    background: var(--brcolor);
    color: var(--whitec);
    font-size: 18px;
    font-weight: 400;
    margin-left: 20px;
    padding: 12px 25px;
}
.main_nav_btn a:hover{
    background-color: var(--bgcolor);
    color: var(--whitec);
}
/* about menu area css */
.about_menu{
    padding: 0 290px;
}
.about_menu .main_nav_area{
    justify-content: flex-end;
}
.about_menu .site_logo_area{
    text-align: left;
}
/*======== main menu area end ==========*/

/*======== mobile menu area start ==========*/
.mobile_logo_area{
    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  ==========*/
/* inner slider area */
.inner_slider_area {
    height: 800px;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    display: flex !important;
    align-items: center;
}
.inner_slider_content {
    width: 68%;
    margin: 0 auto;
    text-align: left;
}
.inner_slider_content h1{
    font-size: 18px;
    color: var(--brcolor);
    margin: 0;
}
.inner_slider_content h2{
    font-size: 70px;
    color: var(--whitec);
    margin: 0;
}
.inner_slider_content p {
    width: 41%;
    margin: 15px 0 0;
    color: var(--whitec);
}
/* golobal btn css */
.q_btn {
    margin-top: 30px;
}
.q_btn a {
    display: inline-block;
    padding: 10px 25px;
    background-color: var(--brcolor);
    color: var(--whitec);
    font-size: 16px;
    font-weight: 400;
}
.q_btn a:hover{
    background-color: var(--bgcolor);
    color: var(--whitec);
}
/* slider defult arrow css */
.slider_area .slick-prev, .slider_area .slick-next {
    background: none;
    width: 60px;
    height: 60px;
    line-height: 60px;
    border-radius: 0;
    opacity: 1;
    visibility: visible;
}
.slider_area .slick-prev{
    left: 0;
}
.slider_area .slick-next{
    right: 10px;
}
.slider_area .slick-prev::before ,.slider_area .slick-next::before{
    content: '\eac9';
    font-family: IcoFont;
    color: var(--whitec);
    display: inline-block;
    background: 0 0;
    width: 60px;
    height: 60px;
    line-height: 60px;
    border-radius: 0;
    font-size: 50px;
    font-weight: 700;
}
.slider_area .slick-next::before{
    content: '\eaca';
}
.slider_area .slick-prev:hover::before ,.slider_area .slick-next:hover::before{
    background-color: var(--brcolor);
    color: var(--whitec);
}
/* home 2 inner slider area css */
.h2_inner_slider_area{
    height: 900px;
}
.h2_inner_slider_area .inner_slider_content{
    position: relative;
}
.h2_inner_slider_area .inner_slider_content h2{
    text-transform: uppercase;
    font-size: 80px;
}
.h2_inner_slider_area .inner_slider_content .q_btn a{
    border: 1px solid transparent;
    text-transform: uppercase;
    margin-right: 10px;
}
.h2_inner_slider_area .inner_slider_content .q_btn a.active{
    border: 1px solid var(--whitec);
    background: none;
}
.h2_inner_slider_area .inner_slider_content .q_btn a.active:hover{
    background-color: var(--brcolor);
    border: 1px solid transparent;
}
.h2_slider_socail_icons {
    position: absolute;
    top: 60px;
    right: -40px;
}
/* home 2 slider icon css */
.h2_slider_socail_icons ul{
    list-style: none;
}
.h2_slider_socail_icons li a {
    background: var(--brcolor);
    color: var(--whitec);
    font-size: 15px;
    height: 35px;
    width: 35px;
    line-height: 35px;
    text-align: center;
    border-radius: 5px;
    margin: 15px 5px 0;
    display: inline-block;
}
.h2_slider_socail_icons li a:hover{
    background-color: var(--bgcolor);
    color: var(--whitec);
}
/*======== slider area end =======*/

/*======= home 3 inner slider start =====*/
.h3_inner_slider{
    height: 850px;
    position: relative;
}
.h3_inner_slider::before{
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    background-color: #00000045;
}
.h3_inner_slider .inner_slider_content{
    text-align: center;
}
.h3_inner_slider .inner_slider_content h1{
    font-size: 18px;
    text-transform: uppercase;
    color: var(--whitec);
}
.h3_inner_slider .inner_slider_content h2{
    font-size: 72px;
    text-transform: capitalize;
    margin-bottom: 15px;
}
.h3_inner_slider .inner_slider_content p {
    margin: 0 auto;
    width: 68%;
}
/* slick defult dots css */
.slick-dots {
    text-align: center;
    list-style: none;
    position: relative;
    margin-top: -30px;
}
.slick-dots li{
    display: inline-block;
    margin: 0 5px;
}
.slick-dots li button{
    display: inline-block;
    width: 15px;
    height: 15px;
    line-height: 15px;
    border-radius: 100%;
    border: none;
    outline: none;
    font-size: 0;
    background-color: #ffac0038;
}
.slick-dots li.slick-active button{
    background-color: var(--brcolor);
}
/*======= home 3 inner slider end  ======*/

/*======== breadcum area start  ==========*/
.breadcum_area {
    background-size: cover;
    background-position: center center;
}
.inner_breadcum_area {
    padding: 200px 0;
}
.inner_breadcum_area h1{
    font-size: 29px;
    font-weight: 700;
    color: var(--whitec);
    margin: 0;
}
.inner_breadcum_area ul{
    list-style: none;
    margin: 0;
    padding: 0;
}
.inner_breadcum_area ul li{
    display: inline-block;
    font-size: 16px;
    font-weight: 400;
    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  ==========*/

/*======== feature area end =======*/
.feature_area {
    padding: 120px 0 50px;
}
.inner_feature_area {
    padding: 65px 25px 50px 30px;
    display: flex;
    background-repeat: no-repeat;
    background-size: cover;
}
.inner_feature_img {
    margin-right: 16px;
}
.inner_feature_area h2 {
    font-size: 18px;
    color: var(--whitec);
}
.inner_feature_area p{
    color: var(--whitec);
}
/*======== feature area end  ==========*/

/*======= home 2feature area start  =======*/
.h2_feaure_area {
    padding: 70px 0 50px;
}
/* home 3 featute area css */
.h3_feature_area{
    padding: 110px 0 50px;
}
.h2_inner_feature_area i{
    font-size: 50px;
    color: var(--brcolor);
}
.h2_inner_feature_area h3 a {
    display: inline-block;
    margin-top: 20px;
    font-size: 18px;
}
.h2_inner_feature_area h3 a:hover{
    color: var(--brcolor);
}
/* home 2 feature style 2 css */
.h2_feature_style2 {
    background-color: var(--brcolor);
    padding: 20px 10px 35px;
    position: relative;
    margin-top: -110px;
}
.h2_feature_count {
    display: flex;
    align-items: baseline;
    justify-content: center;
}
.h2_feature_count h4, .h2_feature_count span {
    font-size: 60px;
    font-weight: 700;
    color: #333333;
    margin-bottom: -5px;
}
.h2_inner_feature_area h3{
    font-size: 18px;
}
.h2_inner_feature_area >a{
    display: inline-block;
    font-size: 16px;
    color: #333333;
    border-style: solid;
    border-width: 1px 1px 1px 1px;
    border-color: #333333;
    padding: 12px 30px;
}
/*======= home 2feature area end  =======*/

/*===== about area start  ====*/
.about_area {
    padding: 100px 0 0px;
    position: relative;
}
.inner_about_img img{
    width: 100%;
}
/* inner about area css */
.inner_about_area {
    padding: 30px 0px 0;
}
.inner_about_area h1{
    font-size: 18px;
    color: var(--brcolor);
}
.inner_about_area h2{
    font-size: 40px;
}
.inner_about_area >p {
    display: inline-block;

}
/* inner about list area css */
.inner_about_list_area {
    display: flex;
    align-items: center;
    margin: 5px 0 0px;
}
.inner_about_list_icon{
    margin-right: 10px;
}
.inner_about_list_icon i{
    color: var(--brcolor);
    font-size: 20px;
}
.inner_about_list_content h3{
    font-weight: 500;
    margin: 0;
}
.about_right_shap {
    position: absolute;
    top: 110px;
    right: 0;
    z-index: -1;
    animation: about_right_shap 5s linear 1s infinite alternate running;
}
@keyframes about_right_shap{
    0% {
        transform: translateX(0px);
    }
    100% {
        transform: translateX(45px);
    }
}
/*===== about area end  ====*/

/*===== home 2 about area start  ====*/
.h2_about_area .inner_about_area h2{
    font-size: 46px;
}
.h2_about_flex {
    position: relative;
}
/* single progres bar css */
.single_progres_bar{
    margin-bottom: 25px;
}
.single_progres_bar h5{
    font-size: 16px;
    font-weight: 500;
    color: var(--brcolor);
    margin-bottom: 10px;
}
/* progres bar thumb css */
.progres_bar_thumb{
    position: relative;
}
.tip{
    position: absolute;
    top: -30px;
    left: 0;
    font-size: 14px;
    font-weight: 500;
    color: var(--brcolor);
}
.h2_inner_about_right_shap {
    position: absolute;
    top: 10px;
    right: 50px;
}
.h2_about_area .inner_about_area .q_btn{
    margin-top: 45px;
}
.h2_about_area .inner_about_area .q_btn a{
    padding: 15px 30px;
}
/*===== home 2 about area end  ====*/

/*===== home 3 about area start  ====*/
.h3_about_area{
    padding: 40px 0 50px;
}
.h3_about_area .inner_about_img{
    position: relative;
}
.h3_about_area .inner_about_img img{
    transition: 1s;
}
.h3_about_area .inner_about_img img:hover{
    transform: rotateY(180deg);
}
.h3_inner_about_bg {
    padding: 15px 20px 5px;
    background-color: transparent;
    background-image: linear-gradient(90deg, #FFAC00 0%, #FFFFFF 100%);
}
.h3_about_area .inner_about_area p {
    background: none;
    padding: 0px 0 0px;
}
.h3_inner_about_bg .inner_about_list_icon i{
    color: var(--titlecolor);
}
.h3_about_area .inner_about_area .q_btn{
    margin-top: 20px;
}
/*===== home 3 about area end  ====*/

/*===== call to action start  ====*/
.call_to_action {
    padding: 100px 0 60px;
    position: relative;
    margin: 50px 0 0px;
    z-index: 1;
}
.call_to_action_flex{
    align-items: center;
}
.inner_call_to_action h2{
    font-size: 18px;
    color: var(--brcolor);
}
.inner_call_to_action h3{
    font-size: 40px;
    color: var(--whitec);
}
.inner_call_to_action h4 {
    position: absolute;
    top: 50px;
    left: 80px;
    font-size: 150px;
    opacity: 1;
    -webkit-text-stroke: 1px #888888;
    -webkit-text-fill-color: transparent;
    line-height: 1;
    z-index: -1;
}
/*===== call to action end  ====*/

/*===== service area start ====*/
.service_area {
    padding: 80px 0 80px;
}
/* single page service css */
.single_page_service {
    padding: 115px 0 0px;
}

.brand_area h3 {
    font-size: 40px;
    margin: 0;
}

.inner_service_main_title{
    margin-bottom: 75px;
}
.inner_service_main_title h3{
    font-size: 170px;
    text-transform: uppercase;
    opacity: 1;
    -webkit-text-stroke: 1px #888888;
    -webkit-text-fill-color: transparent;
}
/* section title area css */
.section_title_flex{
    align-items: center;
    justify-content: space-between;
}
.section_title_area {
    margin: 0px 0 30px;
}
.section_title_area h2{
    font-size: 18px;
    color: var(--brcolor);
    margin: 0;
}
.section_title_area h3{
    font-size: 40px;
    margin: 0;
}
.section_title_btn a{
    display: inline-block;
    font-size: 16px;
    font-weight: 400;
    border-radius: 0px;
    padding: 10px 25px;
    background: none;
    border: 1px solid var(--brcolor);
    color: var(--brcolor);
}
.section_title_btn a:hover{
    background-color: var(--brcolor);
    color: var(--whitec);
    border: 1px solid transparent;
}
/* single service area css */
.single_service_area {
    background-repeat: no-repeat;
    padding: 80px 0 60px;
    background-size: cover;
    margin-bottom: 20px;
}
.single_service_area h3 a{
    color: var(--whitec);
}
/*===== service area end ====*/

/*===== home 2 service area start ====*/
.h2_service_area {
    padding: 50px 0 0px;
}
/* single page service style 2 css */
.single_page_service_style2 {
    padding: 90px 0 25px;
}
.h2_single_service_area{
    margin: 0 15px 10px;
    background-color: var(--whitec);
    box-shadow: 0px 0px 20px 0px rgb(0 0 0 / 5%);
}
.h2_single_service_img img{
    width: 100%;
}
.h2_single_service_content {
    padding: 20px 20px 30px;
}
.h2_single_service_content h3 a{
    font-size: 18px;
    text-transform: uppercase;
}
.h2_single_service_content h3 a:hover{
    color: var(--brcolor);
}
.h2_single_service_content>a {
    display: inline-block;
    margin-top: 5px;
    font-size: 16px;
    font-weight: 400;
    padding: 10px 28px;
    background-color: var(--brcolor);
    color: var(--whitec);
}
.h2_single_service_content>a:hover{
    background-color: var(--bgcolor);
    color: var(--whitec);
}
.h2_service_area:hover .slick-prev ,.h2_service_area:hover .slick-next{
    opacity: 1;
    visibility: visible;
}
/*===== home 2 service area end ====*/

/* service bg area start */
.service_bg {
    padding: 15px 0 45px;
}
/* service bg area end */

/*===== counter area start ====*/
.counter_area {
    padding: 120px 0 50px;
    position: relative;
}
.inner_counter_thumb{
    display: flex;
    justify-content: center;
}
.inner_counter_thumb h3, .inner_counter_thumb h4{
    font-size: 39px;
    color: var(--brcolor);
}
.inner_counter_thumb h3{
    margin-right: 4px;
}
.inner_counter_area h2{
    font-size: 18px;
    text-transform: uppercase;
}
/* inner counter title css */
.inner_counter_title {
    position: absolute;
    top: 60px;
    left: 115px;
    right: 0;
}
.inner_counter_title h3{
    font-size: 170px;
    text-transform: uppercase;
    opacity: 1;
    -webkit-text-stroke: 1px #888888;
    -webkit-text-fill-color: transparent;
    line-height: 1;
}
/*===== counter area end ====*/

/*===== home 3 project area start ====*/
.h3_project_area {
    padding: 0 0 5px;
}
.h3_inner_project_area {
    position: relative;
    overflow: hidden;
    margin: 0 12px;
}
.h3_inner_project_img img{
    width: 100%;
    height: 100%;
    transition: .5s;
}
.h3_inner_project_area:hover .h3_inner_project_img img{
    transform: scale(1.2);
}
/* home 3 inner project content css */
.h3_inner_project_content {
    text-align: center;
    position: absolute;
    bottom: -100px;
    left: 0;
    right: 0;
    transition: .5s;
}
.h3_inner_project_area:hover .h3_inner_project_content{
    bottom: 15px;
}
.h3_inner_project_content h3{
    margin: 0;
}
.h3_inner_project_content h3 a{
    text-transform: uppercase;
    color: var(--whitec);
}
.h3_inner_project_content h3 a:hover{
    color: var(--brcolor);
}
.h3_inner_project_content p{
    color: var(--brcolor);
}
/* home 3 inner project absulte icons */
.h3_inner_project_absulte_icon {
    position: absolute;
    top: 30px;
    left: 30px;
    transform: rotateY(90deg);
    opacity: 0;
    transition: .5s;
}
.h3_inner_project_area:hover .h3_inner_project_absulte_icon{
    transform: rotateY(0deg);
    opacity: 1;
}
.h3_inner_project_absulte_icon a {
    display: inline-block;
    width: 80px;
    height: 80px;
    line-height: 80px;
    text-align: center;
    border-radius: 5px;
    background-color: var(--whitec);
    color: var(--brcolor);
    font-size: 45px !important;
}
.h3_inner_project_absulte_icon a:hover{
    background-color: var(--brcolor);
    color: var(--whitec);
}
.h3_project_area:hover .slick-prev ,.h3_project_area:hover .slick-next{
    opacity: 1;
    visibility: visible;
}
/*===== home 3 project area end ====*/

/*===== video area start ====*/
.video_area {
    padding: 100px 0 100px;
    position: relative;
    margin-top: -100px;
}
.inner_video_area {
    padding: 150px 0 169px;
}
.inner_video_area a{
    display: inline-block;
    background-color: var(--brcolor);
    font-size: 22px;
    width: 80px;
    height: 80px;
    line-height: 78px;
    border-radius: 100%;
    animation: witr-shadow 1s linear infinite;
}
@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 video right content css */
.inner_video_right_content {
    padding: 100px 25px 0;
}
.inner_video_right_content h2{
    font-size: 40px;
}
.inner_video_right_content p{
    width: 80%;
}
/*======== video area end =========*/

/*======= home 2 video area start ======*/
.h2_video_area {
    background-position: center center;
    background-size: cover;
}
.h2_inner_video_area {
    padding: 170px 0 150px;
}
.h2_inner_video_area a{
    display: inline-block;
    width: 80px;
    height: 80px;
    line-height: 80px;
    text-align: center;
    border-radius: 100%;
    font-size: 22px;
    background-color: var(--brcolor);
    color: var(--titlecolor);
    animation: witr-shadow 1s linear infinite;
}
@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);
    }
}
.h2_inner_video_area h2{
    margin-top: 30px;
    font-size: 40px;
    color: var(--whitec);
}
/* home 2 inner video right content css */
.h2_inner_video_right_content {
    padding: 100px 75px 30px;
}
.h2_inner_video_right_content h2{
    font-size: 40px;
    color: var(--whitec);
}
.h2_inner_video_right_content p{
    /*color: var(--whitec); */
}
.h2_inner_video_right_content .q_btn{
    margin-top: 20px;
}
.h2_inner_video_right_content .q_btn a{
    padding: 12px 28px;
    border: 2px solid transparent;
    margin-right: 15px;
}
.h2_inner_video_right_content .q_btn a.active{
    background: none;
    border: 2px solid var(--brcolor);
}
.h2_inner_video_right_content .q_btn a.active:hover{
    background-color: var(--brcolor);
    border: 2px solid transparent;
}
/*====== home 2 video area end =======*/

/*======== team area start =========*/
.team_area {
    padding: 110px 0 50px;
}
/* home 3 team area css */
.h3_team_area {
    padding: 110px 0 120px;
}
/* single page team css */
.single_page_team{
    padding: 60px 0 30px;
}
/* single page team style 2 css */
.single_page_team_style2 {
    padding: 85px 0 45px;
}
.inner_team_img{
    position: relative;
}
.inner_team_img img{
    width: 100%;
    height: 100%;
}
.team_overlay{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgb(255 172 0 / 40%);
    opacity: 0;
    transition: .5s;
}
.inner_team_area:hover .team_overlay{
    opacity: 1;
}
.inner_team_content {
    padding: 30px 0 6px;
    position: relative;
}
.inner_team_content::before{
    content: '';
    position: absolute;
    width: 100%;
    height: 2px;
    background: var(--brcolor);
    bottom: 0;
    left: 0;
    z-index: -1;
    transition: .5s;
}
.inner_team_area:hover .inner_team_content::before{
    height: 100%;
}
.inner_team_content h3{
    margin: 0;
}
.inner_team_content >a {
    position: absolute;
    top: -15px;
    left: 50%;
    transform: translateX(-50%);
    display: inline-block;
    width: 35px;
    text-align: center;
    height: 35px;
    line-height: 35px;
    font-size: 20px;
    background-color: var( --brcolor);
    color: var( --whitec);
    border-radius: 100%;
}
.inner_team_area:hover .inner_team_content >a{
    opacity: 0;
}
.inner_team_socail_icons {
    position: absolute;
    top: -15px;
    left: 50%;
    width: 100%;
    transform: translateX(-50%);
    opacity: 0;
    transition: .5s;
}
.inner_team_area:hover .inner_team_socail_icons{
    opacity: 1;
}
.inner_team_socail_icons a{
    display: inline-block;
    width: 35px;
    height: 35px;
    line-height: 35px;
    font-size: 20px;
    text-align: center;
    background-color: var( --bgcolor);
    color: var( --whitec);
    border-radius: 100%;
    margin: 0 3px;
}
/*======== team area end =========*/

/*======== home 2 team area start =========*/
.h2_team_area{
    padding: 110px 0 60px;
}
.h2_inner_team_img img{
    width: 100%;
}
.h2_inner_team_content {
    position: relative;
    padding: 18px 20px 15px;
    box-shadow: 0px 0px 30px 0 rgba(42,67,113,.1);
}
.h2_inner_team_content h3{
    font-size: 18px;
    margin: 0;
}
.h2_inner_team_content p{
    margin: 0;
}
.h2_inner_team_content a {
    position: absolute;
    top: 0;
    right: 0;
    display: inline-block;
    border-radius: 0;
    height: 80px;
    line-height: 80px;
    width: 60px;
    text-align: center;
    font-size: 25px;
    background-color: var(--brcolor);
    color: var(--whitec);
}
.h2_inner_team_content a:hover{
    transform: translateY(-10px);
}
/*======= home 2 team area end ======*/

/*======= circle progres area start ======*/
.circle_progres_area {
    background-color: #F1F1F1;
    padding: 80px 0 70px;
    margin-top: 60px;
}
/* about cirlce progres css */
.about_circle_progres {
    background: none;
    margin-top: 0;
    padding: 40px 0 0px;
}
/* home 2 circle progres css */
.h2_circle_progres {
    padding: 200px 0 85px;
    position: relative;
    z-index: -1;
    margin-top: -120px;
}
.inner_circle_progres_area img{
    margin-top: 10px;
}
.inner_circle_progres_area h3{
    margin-top: 10px;
}
/*======= circle progres area end ======*/

/*======== img area start  ==========*/
.img_area {
    padding: 0px 0 50px;
}
.h2_img_area{
    padding: 50px 0 0px;
}
.inner_img_area {
    position: relative;
    overflow: hidden;
}
.inner_img_overlay img {
    width: 100%;
    height: 100%;
    transition: .5s;
}
.inner_img_area:hover .inner_img_overlay img{
    transform: scale(1.2);
}
.img_overlay_main{
    position: absolute;
    top: 0;
    left: 0;
    background-color: #000000a5;
    width: 100%;
    height: 100%;
    opacity: 0;
    transform: scale(0);
    visibility: hidden;
    transition: .5s;
}
.inner_img_area:hover .img_overlay_main{
    opacity: 1;
    visibility: visible;
    transform: scale(1.2);
}
/* golobal slick defult arrow css */
.slick-prev , .slick-next{
    position: absolute;
    top: 50%;
    width: 55px;
    height: 55px;
    line-height: 55px;
    border-radius: 100%;
    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: 20px;
}
.slick-next{
    right: 40px;
}
.slick-prev::before ,.slick-next::before{
    content: '\eac9';
    font-family: IcoFont;
    display: inline-block;
    width: 55px;
    height: 55px;
    line-height: 55px;
    border-radius: 100%;
    font-size: 40px;
    background-color: #17161a;
    color: var(--whitec);
    transition: 1s;
}
.slick-next::before{
    content: '\eaca';
}
.slick-prev:hover::before ,.slick-next:hover::before{
    background-color: var(--brcolor);
    color: var(--whitec);
}
.img_area:hover .slick-prev ,.img_area:hover .slick-next{
    opacity: 1;
    visibility: visible;
}
/*======== img area end  ==========*/

/*======= section bg area start  ======*/
.section_bg_area {
    padding: 50px 0 0;
}
/*======= section bg area end =======*/

/*======== testimonial area start  ==========*/
.testimonial_area {
    padding: 70px 0 35px;
}
/* single page testimonial area css */
.single_page_testimonial{
    padding: 110px 0 35px;
}
.inner_testimonial_area {
    background-color: var(--whitec);
    display: flex;
    box-shadow: 0 5px 10px 0 rgb(55 55 56 / 3%);
    padding: 50px 15px 35px;
    border-style: solid;
    border-width: 0px 0px 0px 7px;
    border-color: #FFAC00;
    margin: 0px 20px 10px;
}
.inner_testimonial_img {
    position: relative;
    top: 10px;
    left: -40px;
}
.inner_testi_content h2{
    font-size: 18px;
}
.testimonial_area:hover .slick-prev ,.testimonial_area:hover .slick-next{
    opacity: 1;
    visibility: visible;
}
/*======= testimonial area end  =======*/

/*======= home 2 testimonial area start  =======*/
.h2_testimonial_area .inner_testimonial_area{
    display: block;
    border-style: solid;
    border-width: 0px 0px 0px 3px;
    border-color: #FFAC00;
}
.h2_testimonial_area .inner_testimonial_img{
    display: flex;
    align-items: center;
    top: 0;
    left: 0;
}
.h2_testimonial_area .inner_testimonial_img img{
    margin-right: 20px;
}
.h2_testimonial_title h2{
    font-size: 18px;
    margin: 0;
}
.h2_testimonial_title span{
    font-size: 16px;
    color: var(--brcolor);
}
/*======= home 2 testimonial area end  =======*/

/*======= home 3 testimonial area start  =======*/
.h3_testimonial_area {
    padding: 110px 0 30px;
}
/* single page testimonial style 3 css */
.single_page_testi_style_3{
    padding: 80px 0 20px;
}
.h3_testimonial_area .inner_testimonial_area{
    display: block;
    padding: 40px 15px 40px;
    border-style: solid;
    border-width: 0px 0px 3px 3px;
    border-color: #FFAC00;
}
.h3_testimonial_area .inner_testimonial_area img {
    margin: 15px auto 15px;
}
.h3_testimonial_area .inner_testimonial_area h2{
    font-size: 18px;
    margin: 0;
}
.h3_testimonial_area .inner_testimonial_area span{
    font-size: 16px;
    color: var(--brcolor);
}
/*======= home 3 testimonial area end  =======*/

/*======== brand area start  ==========*/
.brand_area{
    padding: 70px 0 50px;
}
/* home 2 brand area css */
.h2_brand_area {
    padding: 70px 0 120px;
}
/* blog brand area css */
.blog_brand_area{
    padding: 70px 0 45px;
}
/* contact brand area css */
.contact_brand_area{
    padding: 65px 0 0px;
}
.inner_brand_area img{
    margin: 0 auto;
}
.brand_area:hover .slick-prev ,.brand_area:hover .slick-next{
    opacity: 1;
    visibility: visible;
}
.brand_area h3 {
    font-size: 40px;
    margin-bottom: 80px;
}
/*======== brand area end  ==========*/

/*======== h1 contact area start  ==========*/
.h1_contact_area{
    padding: 60px 0 50px;
}
.h1_inner_contact_form {
    padding: 60px 35px 45px;
    border-style: solid;
    border-width: 4px 4px 4px 4px;
    border-color: #FFAC00;
    border-radius: 10px;
}
.h1_inner_contact_form h2 {
    margin-bottom: 40px;
    font-size: 48px;
}
.h1_inner_contact_area input{
    width: 100%;
    height: 45px;
    border-radius: 5px;
    outline: none;
    margin-bottom: 23px;
    padding: 0 20px;
    border: 1px solid #dddddd;
}
.h1_inner_contact_area textarea{
    width: 100%;
    height: 160px;
    border-radius: 5px;
    outline: none;
    padding: 10px 20px;
    border: 1px solid #dddddd;
}
.h1_inner_contact_area button{
    margin-top: 15px;
    display: inline-block;
    font-weight: 600;
    padding: 15px 30px;
    border: none;
    outline: none;
    background-color: var(--brcolor);
    color: var(--whitec);
    border-radius: 5px;
    transition: 1s;
}
.h1_inner_contact_area button:hover{
    background-color: var(--bgcolor);
    color: var(--whitec);
}
.h1_inner_content_img {
    padding: 15px 30px 0;
}
/*======== h1 contact area end  ========*/

/*======== h2 contact area start  ========*/
.h2_contact_area {
    padding: 165px 0 50px;
}
.h2_contact_bg{
    background-image: url(../image/h2-contactbg.jpg);
    height: 400px;
}
.h2_contact_area .h1_inner_contact_form {
    padding: 60px 35px 25px;
    background-color: var(--whitec);
    border-radius: 0;
    border-color: var(--bgcolor);
    position: relative;
    margin-top: -90px;
    margin-left: 10px;
}
.h2_contact_area .h1_inner_contact_form h2{
    text-transform: uppercase;
}
.h2_contact_area .h1_inner_contact_form .h1_inner_contact_area button{
    width: 100%;
}
.h2_inner_contact_right_area {
    padding: 105px 115px 40px;
}
.h2_inner_contact_right_area h2{
    font-size: 40px;
    color: var(--whitec);
}
.h2_inner_contact_right_area p{
    color: var(--whitec);
}
/*======== h2 contact area end  ========*/

/*======== blog area start  ==========*/
.blog_area {
    padding: 65px 0 50px;
}
/* inner blog area css */
.inner_blog_area {
    overflow: hidden;
    box-shadow: 0px 1px 7px 0px rgba(0, 0, 0, 0.11);
}
/* inner blog thumb css */
.inner_blog_thumb{
    position: relative;
    overflow: hidden;
}
.inner_blog_img img{
    width: 100%;
    transform: scale(1.1);
    transition: .5s;
}
.inner_blog_area:hover .inner_blog_img img{
    transform: scale(1);
}
/* 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 absolute css */
.inner_blog_absolute {
    position: absolute;
    top: 20px;
    left: 20px;
}
.inner_blog_absolute span{
    display: inline-block;
    color: var(--whitec);
    background: var(--brcolor);
    padding: 4px 10px;
    font-size: 14px;
    text-align: center;
    border-radius: 5px;
    margin-right: 5px;
}
/*inner blog content css */
.inner_blog_content {
    position: absolute;
    background-color: rgb(255 172 0 / 85%);
    padding: 12px 20px 0px;
    width: 100%;
    bottom: 0;
}
.inner_blog_content h2 a {
    display: inline-block;
    margin-bottom: 8px;
    font-size: 16px;
    font-weight: 700;
    color: var(--whitec);
}
.inner_blog_content h2 a:hover{
    color: var(--whitec);
}
/*======== blog area end  ==========*/

/*======== video area start ==========*/
.video_area {
    position: relative;
    margin: 50px 0 50px;
    padding: 120px 0 150px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    z-index: 1;
}
.video_area::before{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: var(--bgcolor);
    opacity: .8;
    z-index: -1;
}
.inner_video_area a{
    display: inline-block;
    font-size: 47px;
    width: 140px;
    height: 140px;
    line-height: 140px;
    text-align: center;
    border-radius: 100%;
    background-color: #FFFFFF36;
    color: var(--whitec);
    animation: witr_squares 1s linear infinite;
}
.inner_video_area h1 {
    margin-top: 45px;
    font-size: 48px;
    color: var(--whitec);
}
.inner_video_area p{
    width: 60%;
    margin: auto;
    color: var(--whitec);
}
/*======== video area end ==========*/


/*=======  home 2 blog area start  =====*/
.h2_blog_area {
    padding: 150px 0 50px;
}
/* single page blog css */
.single_page_blog{
    padding: 80px 0 40px;
}
/* home 3 blog area css */
.h3_blog_area{
    padding: 50px 0 100px;
}
/* inner blog area css */
.h2_inner_blog_area {
    overflow: hidden;

    margin-bottom: 10px;
    box-shadow: 0px 2px 6px 0px #f5f2f2;;
    background-color: var(--whitec);
}
/* inner blog thumb css */
.h2_inner_blog_thumb{
    position: relative;
    overflow: hidden;
}
.h2_inner_blog_img img{
    width: 100%;
    transition: .5s;
}
.h2_inner_blog_area:hover .h2_inner_blog_img img{
    transform: scale(1.2);
}
/* blog overlay css */
.h2_blog_overlay{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgb(0 0 0 / 50%);
    transform: scale(0);
    transition: .5s;
}
.h2_inner_blog_area:hover .h2_blog_overlay{
    transform: scale(1.2);
}
/* inner blog text css */
.h2_inner_blog_text {
    padding: 13px 20px 10px;
}
.h2_inner_blog_text span a{
    font-size: 14px;
    color: var(--titlecolor);
    font-weight: 400;
}
.h2_inner_blog_text span {
    margin-right: 10px;
    font-size: 14px;
    color: var(--titlecolor);
    font-weight: 400;
}
.h2_inner_blog_text span i{
    margin-right: 6px;
    color: var(--brcolor);
    font-size: 14px;
}
/*inner blog content css */
.h2_inner_blog_content {
    padding: 0 20px 5px;
}
.h2_inner_blog_content h2 a {
    display: inline-block;
    margin-bottom: 5px;
    font-size: 18px;
    font-weight: 700;
    color: var(--titlecolor);
    text-transform: inherit;
    margin: 0;
}
.h2_inner_blog_content h2 a:hover{
    color: var(--brcolor);
}
.h2_inner_blog_content> a{
    font-size: 16px;
    font-weight: 400;
    color: var(--titlecolor);
    border: 1px solid #dddddd;
    display: inline-block;
    border-radius: 0px;
    padding: 10px 25px;
}
.h2_inner_blog_content> a:hover{
    background-color: var(--brcolor);
    color: var(--whitec);
    border: 1px solid transparent;
}
.h2_inner_blog_content> a>i{
    font-weight: 700;
    margin-left: 3px;
}
/*======= blog area end  =====*/

/*======= pricing area start  ======*/
.pricing_area {
    padding: 110px 0 50px;
}
.pricing_area .h2_section_title{
    margin-bottom: 60px;
}
.pricing_area .h2_section_title h1{
    font-size: 18px;
    color: var(--brcolor);
    margin: 0;
}
/* inner pricing area css */
.inner_pricing_area{
    box-shadow: 0px 7px 10px 0px rgba(0, 0, 0, 0.1);
    padding: 0px 0px 20px;
    border-radius: 5px;
}
/* inner pricing text css */
.inner_pricing_text {
    background-color: var(--brcolor);
    padding: 30px 30px 20px 25px;
    border-radius: 5px 5px 0 0;
}
.inner_pricing_title h2{
    font-size: 22px;
    font-weight: 500;
    color: var(--whitec);
}
.inner_pricing_title2{
    margin-top: 35px;
}
.inner_pricing_title2 h2{
    font-size: 48px;
    color: var(--whitec);
}
.inner_pricing_title2 h2 span{
    font-size: 18px;
    font-weight: 500;
}
/* inner pricing list area css */
.inner_pricing_list_area {
    padding: 30px 15px 0px;
}
.inner_pricing_list_area ul{
    list-style: none;
}
.inner_pricing_list_area ul li {
    font-size: 16px;
    font-weight: 400;
    padding: 6px 0;
}
/* inner pricing btn css */
.inner_pricing_btn {
    padding: 5px 30px 20px;
}
.inner_pricing_btn a{
    position: relative;
    display: inline-block;
    padding: 18px 150px 18px 30px;
    background-color: var(--brcolor);
    color: var(--whitec);
    font-size: 16px;
}
.inner_pricing_btn a:hover{
    background-color: var(--bgcolor);
    color: var(--whitec);
}
.inner_pricing_btn a i {
    position: absolute;
    top: 8px;
    right: 10px;
    display: inline-block;
    width: 45px;
    height: 45px;
    line-height: 45px;
    text-align: center;
    border-radius: 100%;
    background-color: var(--whitec);
    color: var(--titlecolor);
    font-weight: bold;
}
/*======= pricing area end  ======*/

/*======== contact area start  ==========*/
.contact_area {
    padding: 120px 0 50px;
}
.inner_contact_area.text-left {
    padding: 65px 55px 50px;
    background-color: var(--bgcolor);
}
.inner_contact_content h2{
    color: var(--brcolor);
    font-size: 19px;
    text-transform: uppercase;
}
.inner_contact_content h3{
    font-size: 48px;
    font-weight: 700;
    color: var(--whitec);
}
/* inner contact form */
.inner_contact_form {
    margin-top: 20px;
}
/* inner contact form */
.inner_contact_form input {
    background-color: #E8F0FE;
    outline: none;
    border: 1px solid #dddddd;
    width: 100%;
    height: 40px;
    padding: 0 20px;
    margin-bottom: 5px;
}
.inner_contact_form input::placeholder{
    color: var(--bgcolor);
    font-size: 14px;
}
.inner_contact_form textarea {
    background-color: #E8F0FE;
    width: 100%;
    height: 80px;
    outline: none;
    padding: 20px 20px;
    border: 1px solid #dddddd;
}
textarea::placeholder {
    color: var(--bgcolor);
    font-size: 14px;
}
.inner_contact_form button {
    display: inline-block;
    padding: 18px 50px;
    font-size: 16px;
    font-weight: 500;
    text-transform: uppercase;
    border: none;
    outline: none;
    background-color: var(--brcolor);
    color: var(--whitec);
    border-radius: 5px;
    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%;
    border: none;
    outline: none;
}
/*======== contact area end  ==========*/

/*======== faq area start  ==========*/
.faq_area {
    padding: 110px 0 30px;
}
.inner_faq_left_content h2{
    font-size: 48px;
    text-transform: uppercase;
}
/* inner faq accrodion item css */
.inner_faq_ac_item {
    margin-bottom: 20px;
    border: 1px solid #dddd;
    border-radius: 5px;
}
.inner_faq_ac_item a {
    width: 100%;
    font-size: 17px;
    padding: 15px 30px 15px 20px;
    font-weight: 600;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.inner_faq_ac_item a:hover{
    background-color: var(--brcolor);
    color: var(--whitec);
}
.inner_faq_ac_item a i{
    font-size: 20px;
    font-weight: 700;
}
.inner_faq_ac_item a.active{
    background-color: var(--brcolor);
    color: var(--whitec);
    position: relative;
}
.inner_faq_ac_item a.active::before {
    content: '\eacb';
    font-family: Icofont!important;
    position: absolute;
    top: 15px;
    bottom: 0;
    right: 30px;
    font-size: 18px;
}
.inner_faq_ac_item a.active i{
    display: none;
}
/* inner faq text */
.inner_faq_text {
    width: 100%;
    border-radius: 0 0 5px 5px;
    border: 1px solid var(--textcolor);
}
.inner_faq_text p {
    padding: 10px 20px 5px;
    margin: 0;
}
/*======== faq area end  ==========*/

/*====== single page accordion start=====*/
.single_page_accordion {
    padding: 20px 0 30px;
}
.single_ac_items{
    margin-bottom: 20px;
    box-shadow: 1px 1px 7px -5px rgba(0, 0, 0, 0.75);
}
.single_ac_items a{
    display: inline-block;
    width: 100%;
    padding: 15px 20px;
    font-size: 17px;
    font-weight: 600;
    color: var(--paracolor);
}
.single_ac_items a i{
    margin-right: 8px;
}
.single_ac_items a.active{
    position: relative;
    color: var(--brcolor);
}
.single_ac_items a.active::before {
    content: "\ef9a";
    position: absolute;
    font-family: Icofont!important;
    top: 18px;
    left: 20px;
    bottom: 0;
}
.single_ac_items a.active i{
    opacity: 0;
    visibility: hidden;
}
.single_accor_contents {
    margin: 10px 20px 10px;
}
.single_accor_contents p {
    padding-bottom: 15px;
}
/*======== single page accordion end ==========*/

/*======== portfolio area start  ==========*/
.portfolio_area {
    padding: 50px 0 35px;
}
/* portfolio 2 css */
.portfolio_2{
    margin-bottom: 30px;
}
.portfolio_title h2{
    font-size: 18px;
    color: var(--brcolor);
}
.portfolio_title h3{
    font-size: 48px;
}
.portfolio_title p {
    width: 64%;
    margin: 0 auto;
}
/* portfolio 2 sub content css */
.portfolio_2_subc {
    padding: 0px 0 5px 15px;
}
.portfolio_2_subc h2 a{
    font-size: 24px;
    transition: .5s;
    color: var(--brcolor);
}
.portfolio_2_subc h2 a:hover{
    color: var(--bgcolor);
}
.portfolio_nav_all {
    padding: 24px 0 22px;
}
/* portfolio nav css */
.portfolio_nav ul{
    list-style: none;
    margin: 0;
    padding: 0;
}
.portfolio_nav ul li{
    display: inline-block;
    border: 1px solid #f3eaea;
    padding: 10px 20px;
    font-size: 16px;
    font-weight: 500;
    margin: 0 5px 10px;
    border-radius: 5px;
    cursor: pointer;
    transition: .5s;
}
.portfolio_nav ul li.current_menu_item{
    background-color: var(--brcolor);
    color: var(--whitec);
}
.portfolio_nav ul li:hover{
    background-color: var(--brcolor);
    color: var(--whitec);
}
/* portfolio items css */
.portfolio_img_area{
    position: relative;
    overflow: hidden;
    margin-bottom: 20px;
}
.portfolio_img_area img{
    width: 100%;
    transition: .5s;
}
.inner_portfolio_items:hover .portfolio_img_area img{
    transform: scale(1.2);
}
.portfolio_img_area >a {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: inline-block;
    width: 55px;
    height: 55px;
    line-height: 55px;
    border-radius: 5px;
    text-align: center;
    color: var(
    --whitec);
    opacity: 0;
    z-index: 99;
}
.portfolio_img_area >a:hover{
    background-color: var(--brcolor);
    color: var(--whitec);
}
.inner_portfolio_items:hover .portfolio_img_area >a{
    opacity: 1;
}
.portfolio_img_area >a>i{
    font-size: 22px;
}
.portfolio_overlay{
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: #ffaa0072;
    opacity: 0;
    visibility: hidden;
    transition: .5s;
}
.inner_portfolio_items:hover .portfolio_overlay{
    opacity: 1;
    visibility: visible;
}
.overlay{
    position: absolute;
    top: 0;
    left: 0;
    background-color: #ea375261;
    text-align: center;
}
.overlay >a{
    display: inline-block;
    width: 55px;
    height: 55px;
    line-height: 55px;
    border-radius: 5px;
    text-align: center;
    color: var(--whitec);
    margin-right: 6px;
    transition: .5s;
    margin-top: 15%;
}
.overlay a:hover{
    background-color: var(--bgcolor);
    color: var(--whitec);
}
.overlay >a >i{
    font-size: 22px;
}
.overlay h2 a{
    width: 100%;
    margin-top: 10px;
    display: inline-block;
    font-size: 24px;
    color: var(--whitec);
    transition: .5s;
}
.overlay h2 a:hover{
    background: none;
    color: var(--blackc);
}
.overlay p{
    font-size: 16px;
    font-weight: 400;
    color: var(--whitec);
}
.inner_portfolio_items:hover .overlay{
    opacity: 1;
    visibility: visible;
}
/* portfolio content css */
.portfolio_overlay_cont {
    position: absolute;
    bottom: -100px;
    left: 0;
    width: 100%;
    padding: 10px 0 10px;
    background-color: var(--brcolor);
    transition: all 0.3s ease-in-out 0.3s;
    opacity: 0;
    visibility: hidden;
    transition: .5s;
}
.portfolio_overlay_cont h2{
    margin: 0;
}
.portfolio_overlay_cont h2 a {
    margin-top: 10px;
    display: inline-block;
    font-size: 18px;
    color: var(--whitec);
    transition: .5s;
}
.portfolio_overlay_cont h2 a:hover{
    color: var(--bgcolor);
}
.portfolio_overlay_cont p{
    color: var(--whitec);
}
.inner_portfolio_items:hover .portfolio_overlay_cont{
    opacity: 1;
    visibility: visible;
    bottom: 0;
}
/* portfolio lower nav area css */
.portfolio_lo_nav_area{
    padding: 40px 0 0;
}
.inner_portfolio_lower_nav ul{
    list-style: none;
    margin: 0;
    padding: 0;
}
.inner_portfolio_lower_nav ul li{
    display: inline-block;
}
.inner_portfolio_lower_nav ul li a{
    display: inline-block;
    border-radius: 5px;
    font-size: 19px;
    line-height: 1;
    margin: 0 5px;
    padding: 15px 24px;
    box-shadow: 0 10px 40px 0 rgba(50,65,141,.12);
}
.inner_portfolio_lower_nav ul li a.current{
    background-color: var(--brcolor);
    color: var(--whitec);
}
.inner_portfolio_lower_nav ul li a:hover{
    background-color: var(--brcolor);
    color: var(--whitec);
}
.inner_portfolio_lower_nav ul li a i{
    font-size: 22px;
    font-weight: bold;
}
/*======== portfolio area end  ==========*/

/*======== blog left area start  ==========*/
.yblog_left {
    padding: 100px 0 0px;
}
.inner_yblog_form {
    width: 100%;
    padding: 20px 0 20px;
    box-shadow: 0 0 20px 0 rgb(0 0 0 / 5%);
}
.inner_yblog_form_apper{
    position: relative;
}
.inner_yblog_form input {
    width: 85%;
    outline: none;
    height: 55px;
    border: 1px solid #efefef;
    margin-left: 20px;
    padding-left: 20px;
}
.inner_yblog_form button {
    position: absolute;
    top: 0;
    right: 0;
    display: inline-block;
    outline: none;
    border: none;
    padding: 16px 20px 15px;
    margin-left: -5px;
    background-color: #ddddddf2;
}
.inner_yblog_form button i{
    font-size: 18px;
}
/* inner  left title css */
.inner_yblog_left_title {
    margin: 0 0 30px;
    width: 100%;
    padding: 20px 20px 15px;
    box-shadow: 0 0 20px 0 rgb(0 0 0 / 5%);
}
.inner_yblog_left_title h2 {
    font-size: 18px;
    padding-bottom: 10px;
    margin-bottom: 20px;
    position: relative;
}
.inner_yblog_left_title h2::before {
    content: '';
    position: absolute;
    bottom: 0;
    right: 0;
    left: 0;
    border-radius: 50%;
    border: 1px solid var(--brcolor);
    width: 20%;
}
.inner_yblog_left_title a {
    display: inline-block;
    margin-top: 15px;
    font-size: 15px;
    font-weight: 400;
}
.inner_yblog_left_title a.bottom{
    border-bottom: none;
}
.inner_yblog_left_title a:hover{
    color: var(--hoverbg);
}
/* innr blog left style 2 css*/
.inner_yblgo_left_style2 a {
    display: inline-block;
    width: 100%;
    border-bottom: 1px solid #dddddd;
    padding: 13px 0 12px;
    margin-top: 0;
}
.inner_yblgo_left_style2 a:hover{
    color: var(--brcolor);
}
/* blog left inner css */
.yblog_left_inner{
    margin-bottom: 30px;
    box-shadow: 0 0 30px 0 rgb(0 0 0 / 5%);
}
.yblog_left_sub {
    position: relative;
    padding: 25px 0 30px 15px;
    background: none;
}
.yblog_left_sub h2 a{
    width: 90%;
    color: var(--titlecolor);
}
.yblog_left_sub h2 a:hover{
    color: var(--brcolor);
}
.yblog_left_text_sub {
    padding: 0px 0 10px;
}
.yblog_left_text_sub span{
    color: var(--bgcolor);
}
.yblog_left_text_sub span i{
    color: var(--brcolor);
}
.yblog_left_sub p{
    font-size: 16px;
    font-weight: 400;
}
.yblog_left_sub >a {
    display: inline-block;
    margin: 7px 0 0;
    padding: 7px 25px;
    border: 1px solid #dddddd;
    font-size: 16px;
    font-weight: 400;
    border-radius: 5px;
    color: var(--paracolor);
    text-transform: capitalize;
}
.yblog_left_sub >a:hover{
    background-color: var(--brcolor);
    color: var(--whitec);
}
.ycalender_inner h5 {
    background-color: var(--brcolor);
    color: var(--whitec);
    padding: 14px 0 12px;
    font-size: 14px;
    font-weight: 500;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 2px;
    width: 100%;
    margin: 0;
}
.ycalender_inner {
    padding: 20px 20px;
    width: 100%;
}
.ycalender_inner th {
    text-align: center;
    border: 1px solid #dddddd;
    padding: 10px 16px;
    font-size: 15px;
    font-weight: 700;
}
.ycalender_inner td {
    text-align: center;
    border: 1px solid #dddddd;
    padding: 10px 12px;
    font-size: 14px;
    font-weight: 400;
}
/*======== blog left area end  ==========*/

/*======== project information area start  ==========*/
.project_information_area {
    padding: 100px 0 85px;
}
.inner_project_information_img {
    margin-bottom: 20px;
}
.inner_project_information_img img{
    width: 100%;
}
/* inner project right content css */
.inner_project_right_content h2{
    font-size: 24px;
}
.inner_project_right_content p span{
    font-size: 16px;
    color: var(--bgcolor);
    font-weight: 700;
}
/* inner project infomation icons css */
.inner_project_in_icon a{
    width: 48px;
    height: 48px;
    border: 1px solid #dddddd;
    display: inline-block;
    line-height: 46px;
    text-align: center;
    border-radius: 30px;
    background-color: var(--whitec);
    color: var(--bgcolor);
    font-size: 20px;
    margin-right: 4px;
}
.inner_project_in_icon a:hover{
    background-color: var(--brcolor);
    color: var(--whitec);
}
/* inner project text area css */
.inner_project_text_area {
    margin-top: 25px;
}
.inner_project_text_area h2{
    font-size: 24px;
}
.inner_project_information_descrip {
    margin-bottom: 8px;
}
.inner_project_information_descrip h4{
    font-size: 16px;
}
.inner_project_information_descrip p{
    margin: 0;
}
/* inner project information description css */
.inner_project_infor_list{
    margin-bottom: 15px;
    padding: 0;
    list-style: none;
}
.inner_project_infor_list li{
    margin-bottom: 5px;
}
/*======== project information area end  ==========*/

/*======== single blog page area start  ==========*/
.inner_single_box_area{
    background-color: #f8f9fa;
    padding: 20px 20px 20px;
}
.inner_single_box_area p {
    margin-bottom: 5px;
}
.inner_single_page_content_area p{
    margin-top: 20px;
}
/* inner single page middle text css */
.inner_single_page_middle_text {
    margin: 35px 0 45px;
}
.inner_single_page_middle_text h2{
    font-size: 24px;
}
/* single blog group css */
.single_blog_group {
    margin-top: 125px;
}
.inner_single_blog_group_box {
    background-color: #f8f9fa;
    padding: 10px 20px 30px;
    margin-top: 30px;
}
.inner_single_blog_group_box p{
    font-size: 1.5em;
    font-style: italic;
    margin-bottom: 0;
}
.inner_single_blog_group_box span{
    font-size: 1.125em;
    font-weight: 400;
    color: var(--paracolor);
}
.single_blog_post_area {
    margin: 80px 0 30px;
    padding: 25px 0 25px;
    border-top: 1px solid #dddddd;
    border-bottom: 1px solid #dddddd;
}
.single_blog_post_area p{
    margin: 0;
}
.single_blog_post_area a{
    color: var(--paracolor);
    font-size: 16px;
    font-weight: 400;
}
.single_blog_post_area a:hover{
    color: var(--hoverbg);
}
/* single comment title css */
.single_comment_title{
    margin: 35px 0 55px;
}
.single_comment_title h3{
    font-size: 20px;
}
.single_post_comment_area input {
    width: 47%;
    outline: none;
    height: 42px;
    padding: 0 20px;
    border: 1px solid #ced4da;
    border-radius: 5px;
    margin-right: 20px;
    margin-bottom: 20px;
}
/* inner single post checkbox css */
.inner_single_post_checkbox {
    display: flex;
    align-items: center;
    margin: 10px 0;
}
.inner_single_post_checkbox input {
    height: 15px;
    width: 12px;
    margin-right: 6px;
}
.single_post_comment_area textarea{
    width: 97%;
    padding: 10px 20px;
    height: 150px;
    margin-top: 15px;
    margin-bottom: 15px;
    outline: none;
    border: 1px solid #ced4da;
    border-radius: 5px;
}
.single_post_comment_area button{
    display: inline-block;
    text-align: center;
    padding: 16px 30px;
    margin-top: 5px;
    border-radius: 5px;
    background-color: var(--brcolor);
    color: var(--whitec);
    border: none;
    outline: none;
    transition: .6s;
}
.single_post_comment_area button:hover{
    background-color: var(--bgcolor);
}
/*======== single blog page area end  ==========*/

/*======== footer area start  ==========*/
.footer_area {
    margin: 90px 0 0;
    padding: 45px 0px 10px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    position: relative;
    z-index: 999;
}
/* about footer area css */
.about_footer_area{
    margin: 75px 0 0;
}
.h2_footer_area{
    margin: 0 0;
}
.footer_upper {
    padding: 40px 0 45px;
    border-bottom: 1px solid #fff;
}
.inner_footer_upper_content p{
    font-size: 18px;
    color: var(--whitec);
}
/* footer middle area css */
.footer_middle {
    padding: 45px 0 20px;
}
/* footer logo area css */
.footer_left_area p {
    padding: 10px 0 5px;
    font-size: 14px;
    color: var(--whitec);
}
/* footer socail icon css */
.footer_socail_icons {
    padding: 10px 0 0;
}
.footer_socail_icons a{
    display: inline-block;
    border-radius: 4px;
    margin-right: 5px;
    margin-bottom: 5px;
    height: 40px;
    width: 40px;
    line-height: 40px;
    text-align: center;
    background: var(--blackc);
    color: var(--whitec);
    margin-right: 6px;
    font-size: 20px;
}
.footer_socail_icons a:hover{
    background-color: var(--brcolor);
}
/* footer widget  css*/
.footer_widget h4 {
    padding: 0 0 10px;
    font-size: 18px;
    color: var(--whitec);
    position: relative;
    margin-bottom: 15px;
}
.footer_widget h4::before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    width: 26%;
    border-bottom: 2px solid var(--brcolor);
    border-radius: 50%;
}
/* footer nav css */
.footer_ul{
	
}
.footer_ul li{
	width: 50%;
    float: left;
}
.footer_nav {
    margin-top: 10px;
}
.footer_nav ul{
    list-style: none;
    padding-left: 0;
}
.footer_nav ul li {
    padding: 0 0 15px;
}
.footer_nav ul li a{
    color: var(--whitec);
    font-size: 16px;
    font-weight: 400;
}
.footer_nav ul li a:hover{
    color: var(--brcolor);
}
/* footer address area css */
.footer_addres_area {
    margin-top: 10px;
}
.footer_addres_area p {
    color: var(--whitec);
    margin-bottom: 10px;
}
.footer_addres_area p i{
    margin-right: 6px;
}
/* footer widget sub img */
.footer_wid_sub_img {
    margin-top: 15px;
}
.inner_footer_widget_img{
    margin-bottom: 20px;
}
.inner_footer_widget_img img{
    
    height: auto;
}
.copyright_border {
    position: relative;
    margin: 20px 0 0px;
}
.copyright_border::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    width: 95%;
    height: 1px;
    background: var(--whitec);
    margin: auto;
}
.copyright_text p{
    color: var(--whitec);
    margin-top: 15px;
    margin-bottom: 0;
}
/*======== footer area end  ==========*/

/*======== scroll top btn css  ==========*/
.scroll_top_btn{
    position: fixed;
    bottom: 40px;
    right: 30px;
    background-color: var(--brcolor);
    color: var(--whitec);
    display: inline-block;
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    border-radius: 5px;
    font-size: 40px;
    font-weight: 700;
    z-index: 9999999999;
    display: none;
}