/*TABLE OF CONTENTS*/
/*=====================
01. dreamhub Header Top Menu Area Css
02. dreamhub Nav Menu Area Css 
03. dreamhub Slider Area Css
04. dreamhub Section Title Css
05. dreamhub Service Area css
06. dreamhub About Area Css
07. dreamhub Counter Area Css
08. dreamhub Case Study Area Css
09. dreamhub Testimonial Area Css
10. dreamhub Process Area Css
11. dreamhub Team Area Css
12. dreamhub Faq Area Css
13. dreamhub Brand Section Css
14. dreamhub Call Do Section Css
15. dreamhub Form Box Css
16. dreamhub Skill Area Css
17. dreamhub Blog Area Css
18. dreamhub footer Area Css
19. dreamhub Subscribe Area Css
20. dreamhub Lines CSS
21. dreamhub Prossess Ber Css
22. dreamhub Scrollup Section
23. dreamhub Bounce Animation Css 
24. dreamhub Animation Dance
25. dreamhub Breadcumb Area Css
26. dreamhub abouts_areas Css
27. dreamhub Feture-Area Css
28. dreamhub Pricing Section Css
29. dreamhub Web Development Section CSS
30. dreamhub Contact  US Css
31. dreamhub Blog Sidber Widget CSS
32. dreamhub Case Study Details Css
33. dreamhub Search Box Css
34. dreamhub Loader Css
=======================*/


/*================================
<--  dreamhub Nav Menu Area Css -->
==================================*/
.dreamhub_nav_manu {
    background: #ebebeb;
    transition: .5s;
    z-index: 2;
    position: relative;
}
.style-two.dreamhub_nav_manu {
    background: transparent;
    margin-bottom: -99px;
}
.sticky-nav {
    left: 0;
    margin: auto;
    top: 0;
    width: 100%;
    position: fixed !important;
    box-shadow: 0 0 60px 0 rgba(0, 0, 0, 0.07);
    -webkit-animation: 300ms running fadeInDown;
    animation: 500ms running fadeInUp;
    -webkit-box-shadow: 0 10px 15px rgba(25, 25, 25, 0.1);
    transition: 0.5s !important;
    background: #062E61!important;
    z-index: 9999 !important;
    animation-name: slideInDown;
    padding: 0 40px 0px;
}
.style-two .dreamhub_menu > ul > li > a {
    color: #fff;
}
/* dreamhub Menu Css*/
nav.dreamhub_menu {
    text-align: right;
}
.dreamhub_menu ul {
    list-style: none;
    display: inline-block;
}
.dreamhub_menu>ul>li {
   display: inline-block;
   position: relative;
   z-index: 1;
}
.dreamhub_menu > ul > li > a {
    font-size: 17px;
    display: inline-block;
    margin: 35px 16px;
    -webkit-transition: .5s;
    color: #233253;
    font-family: 'Arimo';
    font-weight: 400;
}
nav.dreamhub_menu span {
    font-size: 13px;
    padding-left: 6px;
    font-family: FontAwesome;
    opacity: .5;
}
.dreamhub_menu > ul > li > a:hover {
    color: #ff5a3c;
}
/*menu button*/
.header-button {
    display: inline-block;
    padding-left: 80px;
}
.header-button a {
    padding: 13px 35px;
    font-size: 17px;
    color: #fff;
    font-weight: 500;
    background: #ff5a3c;
    border-radius: 20px 0px 20px 0px;
    display: inline-block;
    position: relative;
    z-index: 1;
    transition: .5s;
    border: 1px solid #ff5a3c;
}
.header-button a:before {
    position: absolute;
    content: "";
    z-index: -1;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    border-radius: 20px 0px 20px 0px;
    background: #232323;
    transform: scale(0);
    transition: .5s;
}
.header-button a:hover:before {
    transform: scale(1);
}

/*** Sub Menu Style ==================================*/

.dreamhub_menu ul .sub-menu {
    position: absolute;
    left: 0;
    top: 130%;
    width: 350px;
    text-align: left;
    background: #fff;
    margin: 0;
    z-index: 1;
    -webkit-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.3);
    transition: .5s;
    visibility: hidden;
    border-top: 2px solid #ff5a3c;
    opacity: 0;
}
.dreamhub_menu ul li:hover>.sub-menu {
     -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
     visibility: visible;
     top: 100%;
     opacity: 1;
 }
.dreamhub_menu ul .sub-menu li {
     position: relative;
}
.dreamhub_menu ul .sub-menu li a {
    display: block;
    padding: 12px 20px;
    margin: 0;
    line-height: 1.3;
    letter-spacing: normal;
    font-size: 16px;
    font-weight: 500;
    text-transform: capitalize;
    -webkit-transition: .1s;
    visibility: inherit !important;
    color: #211e3b !important;
}
.dreamhub_menu ul .sub-menu li:hover>a,
.dreamhub_menu ul .sub-menu .sub-menu li:hover>a,
.dreamhub_menu ul .sub-menu .sub-menu .sub-menu li:hover>a,
.dreamhub_menu ul .sub-menu .sub-menu .sub-menu .sub-menu li:hover>a {
     background:#ff5a3c;
     color: #fff !important;
}

/* sub menu 2 */
.dreamhub_menu ul .sub-menu .sub-menu {
     left: 100%;
     top: 130%;
     opacity: 0;
     -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
     visibility: hidden;
}
.dreamhub_menu ul .sub-menu li:hover>.sub-menu {
     opacity: 1;
     -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
     visibility: visible;
     top: 0%;
}

/* sub menu 3 */
.dreamhub_menu ul .sub-menu .sub-menu li {
    position: relative;
}
.dreamhub_menu ul .sub-menu .sub-menu .sub-menu {
     right: 100%;
     left: auto;
     top: 130%;
     opacity: 0;
     -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
     visibility: hidden;
}
.dreamhub_menu ul .sub-menu .sub-menu li:hover>.sub-menu {
     opacity: 1;
     -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
     visibility: visible;
     top: 0%;
}

/* sub menu 4 */
.dreamhub_menu ul .sub-menu .sub-menu .sub-menu li {
    position: relative;
}
.dreamhub_menu ul .sub-menu .sub-menu .sub-menu .sub-menu {
}
.dreamhub_menu ul .sub-menu .sub-menu .sub-menu li:hover>.sub-menu {
     opacity: 1;
     -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
     visibility: visible;
     top: 0%;
}

.dreamhub_menu li a:hover:before{
    width:101%;
}
.dreamhub_nav_manu.sticky-nav .logo_img {
    display: none;
}
.main_sticky {
    display: none;
}
.dreamhub_nav_manu.sticky-nav .main_sticky {
    display: inherit;
}
.sticky-nav .dreamhub_menu li a {
    color: #fff;
}
.mobile-menu.mean-container {
    overflow: hidden;
}




/*=============================================
<--  Dreamhub Hero section Css -->
===============================================*/
.hero-section {
    background: url(assets/images/slider/hero-bg.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    padding: 50px 0 50px;
}
/*hero content*/
.hero-content h5 {
    font-size: 16px;
    font-family: 'Arimo';
    color: #ff5a3c;
    font-weight: 500;
}
.hero-content h1 {
    font-size: 60px;
    line-height: 60px;
    font-weight: 600;
}
.hero-content h1 span {
    color: #ff5a3c;
}
/*description*/
.hero-description p {
    padding: 34px 0 20px;
    width: 83%;
}

/*hero button*/
.hero-button {
    display: inline-block;
}
.hero-button.upp {
    padding-left: 10px;
}
.hero-button a {
    padding: 13px 34px;
    font-weight: 500;
    color: #fff;
    background: #ff5a3c;
    display: inline-block;
    border-radius: 5px;
    position: relative;
    z-index: 1;
}
.hero-button.upp a {
    background: inherit;
    border: 1px solid #ff5a3c;
    color: #ff5a3c;
    transition: .5s;
}
.hero-button a:before {
    position: absolute;
    content: "";
    z-index: -1;
    right: 0;
    bottom: 0;
    left: inherit;
    top: inherit;
    width: 26px;
    height: 26px;
    background: #FFAEA3;
    border-radius: 25px 0 0 0;
    transition: .5s;
}
.hero-button.upp a:hover {
    color: #fff;
}
.hero-button a:hover:before {
    width: 100%;
    height: 100%;
    border-radius: 5px;
}

/*=============================================
<--  Dreamhub section title Css -->
===============================================*/
.dreamhub-section-title h4 {
    font-size: 16px;
    font-weight: 600;
    color: #ff5a3c;
    background: #F8E7EA;
    display: inline-block;
    padding: 10.5px 33px;
    border-radius: 5px;
    margin-bottom: 10px;
}
.dreamhub-section-title h1 {
    font-size: 42px;
    font-weight: 600;
}
.dreamhub-section-title h1 span {
    color: #ff5a3c;
    font-style: oblique;
}
.dreamhub-section-title p {
    padding: 16px 0 7px;
}
.text-center.dreamhub-section-title p {
    padding: 15px 0 72px;
    width: 49%;
    margin: auto;
}

/*=============================================
<--  Dreamhub Brand section Css -->
===============================================*/
.row.brand-bg {
    filter: drop-shadow(0px 10px 20px rgba(255,90,60,0.09));
    background-color: #ffffff;
    padding: 90px 38px;
    margin-top: -105px;
}
.row.brand-bg2 {
    filter: drop-shadow(0px 10px 20px rgba(255,90,60,0.09));
    background-color: #ffffff;
    padding: 90px 38px;
    margin-bottom: -105px;
    border-radius: 5px;
}
.brand-thumb img {
    opacity: 0.4;
    transition: .5s;
}

.brand-single-box:hover .brand-thumb img {
    opacity: 1;
}

.active.center .brand-thumb img {
    opacity: 1;
}

/*owl carousel*/
.owl-nav {
    opacity: 0;
    transition: .5s;
}
.owl-next {
    position: absolute;
    left: -125px;
    top: 0;
    transition: .5s;
}
.owl-prev {
    position: absolute;
    right: -125px;
    top: 0;
    transition: .5s;
}
.owl-prev i, .owl-next i {
    font-size: 20px;
    display: inline-block;
    color: #fff;
    background: #FF5A3C;
    width: 50px;
    height: 50px;
    text-align: center;
    line-height: 50px;
    border-radius: 30px;
}

.row.brand-bg:hover .owl-nav {
    opacity: 1;
}
.row.brand-bg:hover .owl-next {
    left: -65px;
}
.row.brand-bg:hover .owl-prev {
    right: -65px;
}

.row.brand-bg2:hover .owl-nav {
    opacity: 1;
}
.row.brand-bg2:hover .owl-next {
    left: -65px;
}
.row.brand-bg2:hover .owl-prev {
    right: -65px;
}



/*=============================================
<--  Dreamhub Service section Css -->
===============================================*/
.service-section {
    background: #f7f7fe;
    padding: 100px 0 110px;
    margin-top: -105px;
}
/*service box*/
.dreamit-service-box {
    padding: 30px 32px 36px;
    background: #FFFFFF;
    border: 1px solid #ebebfd;
    border-radius: 5px;
    position: relative;
    z-index: 1;
    overflow: hidden;
    margin-bottom: 30px;
}
.dreamit-service-box:before {
    position: absolute;
    content: "";
    left: 0;
    right: 0;
    margin: auto;
    bottom: -66px;
    height: 125px;
    width: 122px;
    background: #f2f3f5;
    transform: rotate(45deg);
    transition: .5s;
}
.service-box-inner {
    display: inline-flex;
    align-items: center;
}
/*service title*/
.service-title h2 {
    font-size: 22px;
    font-weight: 600;
    color: #233253;
}
/*description*/
.service-desctiption p {
    font-size: 16px;
    padding: 19px 0 1px;
    display: inline-block;
}
/*service button*/
.service-button a {
    font-weight: 500;
    color: #333c4e;
    transition: .5s;
}
.service-button a i {
    font-size: 20px;
    position: relative;
    top: 3px;
    left: 5px;
}
.dreamit-service-box:hover .service-button a{
    color: #ff5a3b;
}
.dreamit-service-box:hover:before {
    background: #ff5a3b;
}

/*Service style two 
===============================================*/

.style-two.service-section {
    background: #fff;
    padding: 50px 0 50px;
    margin-top: 0 !important;
}
.dreamit-service-box2 {
    padding: 45px 35px 36px;
    background: #f2f4fc;
    border-radius: 5px;
    margin-bottom: 30px;
    text-align: center;
}
.style-two .service-title h2 {
    color: #233253;
    padding: 20px 0 0;
}
.dreamit-service-box2:hover .service-button a{
    color: #ff5a3b;
}
.dreamit-service-box2:hover .service-title h2 {
    color: #ff5a3b;
}
/*=============================================
<--  Dreamhub About section Css -->
===============================================*/

.about-section {
    padding: 50px 0 150px;
}

.left.dreamit-about-thumb {
    margin: 0 0 0 -60px;
}
/*about item*/
.about-item-list ul li {
    display: block;
    list-style: none;
    color: #233253;
    padding: 0 0 10px 52px;
    font-weight: 600;
    font-size: 18px;
    position: relative;
    z-index: 1;
}

.about-item-list ul li:before {
    position: absolute;
    content: "";
    top: 40%;
    left: 32px;
    border: 10px solid;
    border-right-color: #232353;
    border-top-color: transparent;
    border-left-width: 0;
    border-left-color: transparent;
    border-bottom-width: 0;
    transform: translate(-50%, -50%) rotate(-45deg);
}
.about-item-list ul li:after {
    position: absolute;
    content: "";
    left: 0;
    top: 14px;
    width: 32px;
    height: 2px;
    background: #232353;
}
/*seo about info*/
.seo-about-info {
    display: inline-flex;
    background-color: #f7f7fe;
    border: 1px solid #ff5a3c;
    padding: 35px 32px 33px;
    position: relative;
    z-index: 1;
    overflow: hidden;
    margin-top: 22px;
}
.seo-about-info:before {
    position: absolute;
    content: "";
    right: -240px;
    bottom: 0;
    width: 100%;
    height: 100%;
    background: url(assets/images/resource/seo-shape.png);
    background-repeat: no-repeat;
    background-position: center;
}
/*seo thumb*/
.seo-thumb {
    padding-right: 30px;
}
/*seo content*/
.seo-content p {
    font-size: 18px;
}

.seo-content h5 {
    font-size: 22px;
    font-weight: 400;
    display: block;
    color: #777777;
    position: relative;
    z-index: 1;
    padding: 4px 0 12px;
}
.seo-content h5:before {
    position: absolute;
    content: "";
    top: 4px;
    right: -58px;
    height: 100%;
    width: 100%;
    background: url(assets/images/resource/signature.png);
    background-repeat: no-repeat;
}

/*About style two
===============================================*/

.counter-title h2 {
    font-size: 35px;
    color: #00295a;
    display: inline-block;
    font-family: 'Arimo';
}
.counter-text span {
    font-size: 18px;
    color: #00295a;
    padding: 8px 0 0;
    display: inline-block;
}
/*dreamhub button*/
.dreamhub-button {
    margin-top: 40px;
}
.dreamhub-button a {
    padding: 13px 39px;
    font-size: 17px;
    font-weight: 500;
    background: #FF5A3C;
    color: #fff;
    display: inline-block;
    border-radius: 5px;
    position: relative;
    z-index: 1;
}
.dreamhub-button a:before {
    position: absolute;
    content: "";
    z-index: -1;
    right: 0;
    bottom: 0;
    left: inherit;
    top: inherit;
    width: 0;
    height: 0;
    background: #FFAEA3;
    border-radius: 5px;
    transition: .5s;
    opacity: 0;
}
.dreamhub-button a:hover:before {
    width: 100%;
    height: 100%;
    opacity: 1;
}
/*=============================================
<--  Dreamhub Skill section Css -->
===============================================*/
.skill-section {
    background: #f7f7fe;
    padding: 140px 0 60px;
}


span.process-bar {
    font-size: 20px;
    font-weight: 600;
    color: #223253;
    font-family: 'Playfair Display';
}
.process-ber-plugin {
    padding: 20px 0 0;
}
.barfiller {
    width: 100%;
    height: 4px;
    position: relative;
    margin-bottom: 28px;
    margin-top: 6px;
    border-radius: 5px;
    filter: drop-shadow(0px 10px 10px rgba(60,115,206,0.2));
    background-color: #b1c1e3;
}
.barfiller .fill {
  display: block;
  position: relative;
  width: 0px;
  height: 100%;
  background: #333;
  z-index: 1;
}
.barfiller .tipWrap { display: none; }
.barfiller .tip {
    font-size: 15px;
    color: #fff;
    top: -48px;
    padding: 1px 6px;
    left: 0px;
    border-radius: 5px;
    position: absolute;
    z-index: 2;
    background: #f15c41;
}
.barfiller .tip:after {
    border: solid;
    border-color: rgba(241,92,65, .9999) transparent;
    border-width: 14px 4px 0 4px;
    content: "";
    display: block;
    position: absolute;
    left: 14px;
    top: 93%;
    z-index: 9;
    transform: rotate(25deg);
}
.stat-bar:nth-of-type(1) .stat-bar-rating {
  animation-delay: 0.25s;
  -webkit-animation-delay: 0.25s;
}
span.fill {
    background: #f15c41 !important;
    border-radius: 5px;
}
/*sskill thumb right*/
.skill-thumb {
    padding: 0 0 0 80px;
}

/*video style 0*/
.video-icon {
    display: inline-block;
    position: relative;
    bottom: 512px;
    right: -46%;
}
.video-icon a {
    width: 60px;
    height: 60px;
    line-height: 60px;
    border-radius: 100%;
    color: #fff;
    background: #233253;
    display: inline-block;
    text-align: center;
    -webkit-animation: hasan 1s linear infinite;
    animation: hasan 1.5s linear infinite;
    -webkit-transition: .5s;
    -webkit-transition: .5s;
    font-size: 30px;
}
@-webkit-keyframes hasan {
    0% {
        -webkit-box-shadow: 0 0 0 0 rgba(233,234,237, 0.4),  0 0 0 5px rgba(233,234,237, 0.4);
        box-shadow: 0 0 0 0 rgba(233,234,237, 0.4),  0 0 0 5px rgba(233,234,237, 0.4)
    }
    100% {
        -webkit-box-shadow: 0 0 0 50px rgba(233,234,237, 0);
        box-shadow: 0 0 0 5px rgba(233,234,237, 0.3), 0 0 0 40px rgba(233,234,237, 0)
    }
}
@keyframes hasan {
    0% {
        -webkit-box-shadow: 0 0 0 0 rgba(233,234,237, 1), 0 0 0 5px rgba(233,234,237, 1);
        box-shadow: 0 0 0 0 rgba(233,234,237, 1), 0 0 0 5px rgba(233,234,237, 123)
    }
    100% {
        -webkit-box-shadow:0 0 0 0 rgba(233,234,237, 1), 0 0 0 40px rgba(233,234,237, 0);
        box-shadow: 0 0 0 0 rgba(233,234,237, 1), 0 0 0 40px rgba(233,234,237, 0)
    }
}





/*=============================================
<--  Dreamhub Team section Css -->
===============================================*/
.team-section {
    padding: 130px 0 110px;
}
/*single box*/
.single_team_box {
    margin-bottom: 30px;
}
.single_team_thumb {
    position: relative;
    z-index: 1;
    overflow: hidden;
}
.single_team_thumb img {
    width: 100%;
    transition: .5s;
}
.single_team_thumb img:hover {
    transform: scale(1.1);
}
/*team nav*/
.team-nav {
    position: absolute;
    top: 30px;
    left: 30px;
    height: 30px;
    width: 30px;
    line-height: 30px;
    border-radius: 30px;
    background: #f15c41;
    text-align: center;
    color: #fff;
    font-weight: 500;
    font-size: 21px;
    cursor: pointer;
}

.single_team_icon {
    position: absolute;
    left: 30px;
    top: 60px;
    opacity: 0;
    transition: .5s;
}

.single_team_icon a {
    display: block;
    height: 30px;
    width: 30px;
    line-height: 32px;
    border-radius: 30px;
    background: #fff;
    text-align: center;
    color: #f15c41;
    font-size: 14px;
    margin-bottom: 10px;
    transition: .5s;
    transition-delay: .5s;
    overflow: hidden;
    transform: translateX(100px);
}
.single_team_icon a:nth-child(1) {
    transition-delay: .2s;
}
.single_team_icon a:nth-child(2) {
    transition-delay: .3s;
}
.single_team_icon a:nth-child(3) {
    transition-delay: 0.4s;
}
.single_team_icon a:nth-child(4) {
    transition-delay: 0.5s;
}
.single_team_icon.active {
    opacity: 1;
    top: 70px;
}
.single_team_icon.active a {
    transform: translateX(0px);
    overflow: hidden;
    visibility: visible;
}

/*team content*/
.single_team_content {
    padding: 20px 0 25px;
    background: #f7f7fe;
    text-align: center;
    border-bottom: 1px solid #f7f7fe;
    border-radius: 0 0 5px 5px;
    transition: .5s;
}
/*team title*/
.team-title h4 {
    font-size: 22px;
    color: #062e5f;
    font-weight: 600;
}
.team-title span {
    font-size: 16px;
    color: #777777;
    padding: 10px 0 0;
    display: inline-block;
}
.single_team_icon a:hover {
    background: #f15c41;
    color: #fff;
}
.single_team_box:hover .single_team_content {
    border-bottom: 1px solid #f15c41;
}
/* Team style two
===============================================*/
.style-two.team-section {
    padding: 0px 0 100px;
}
.style-two.team-section.upp {
    padding: 130px 0 100px;
}
.single_team_icon2 {
    position: absolute;
    left: 0;
    bottom: -56px;
    opacity: 0;
    transition: .5s;
    background: #00295a;
    padding: 38px 0 30px;
    width: 100%;
    border-radius: 5px 5px 0px 0;
    transition: .5s;
}
.single_team_icon2 a {
    display: inline-block;
    height: 30px;
    width: 30px;
    line-height: 32px;
    border-radius: 30px;
    background: #fff;
    text-align: center;
    color: #f15c41;
    font-size: 14px;
    margin-right: 5px;
    transition: .5s;
    transition-delay: .5s;
    overflow: hidden;
    transform: translateX(0px);
}
.single_team_icon2 a:nth-child(1) {
    transition-delay: .2s;
}
.single_team_icon2 a:nth-child(2) {
    transition-delay: .3s;
}
.single_team_icon2 a:nth-child(3) {
    transition-delay: 0.4s;
}
.single_team_icon2 a:nth-child(4) {
    transition-delay: 0.5s;
}
.single_team_icon2 a:hover {
    background: #f15c41;
    color: #fff;
}
.single_team_box:hover .single_team_icon2 a {
    transform: translateX(73px);
    overflow: hidden;
    visibility: visible;
}
.single_team_box:hover .single_team_icon2 {
    opacity: 1;
    bottom: 0px;
}
/*team content*/
.style-two .single_team_content {
    padding: 20px 0 25px;
    background: #fff;
    text-align: center;
    border-bottom: 1px solid #fff;
    filter: drop-shadow(0 0 23px rgba(0,0,0,0.1));
    border-radius: 0 0 5px 5px;
    transition: .5s;
}


/*=============================================
<--  Dreamhub Counter section Css -->
===============================================*/
.row.counter-bg {
    background: #f9f9f9;
    padding: 70px 50px 70px;
    text-align: center;
    margin-bottom: -180px;
    position: relative;
    z-index: 1;
    border-radius: 5px;
}
.row.counter-bg2 {
    padding: 42px 0 0;
}

/*=============================================
<--  Dreamhub Testimonial section Css -->
===============================================*/
.testimonial-section {
    background: #f7f7fe;
    padding: 130px 0 140px;
}
.style-two.testimonial-section {
    background: #f7f7fe;
    padding: 50px 0 50px;
    margin-bottom: 0px;
}

.testimonial-single-box {
    padding: 35px 32px 30px;
    position: relative;
    z-index: 1;
    border-radius: 5px;
    filter: drop-shadow(0 0 23px rgba(72,72,72,0.1));
    background-color: #ffffff;
    margin-right: 30px;
}
.testimonial-single-box:before {
    position: absolute;
    content: "";
    right: 0;
    top: 0;
    width: 175px;
    height: 99px;
    background: #fff;
    border-radius: 0px 0 229px 170px;
}
.testimonial-single-box:after {
    position: absolute;
    content: "";
    right: 0;
    top: 0;
    width: 175px;
    height: 0px;
    background: #f15c41;
    border-radius: 0px 0 229px 170px;
    opacity: 0;
    transition: .5s;
}
/*testi thumb*/
.testi-thumb {
    float: left;
    margin-right: 20px;
}
/*testi icon*/
.testimonial-icon i {
    font-size: 70px;
    position: absolute;
    z-index: 22;
    right: 55px;
    top: 12px;
    transform: rotateY(-180deg);
    color: #233253;
    transition: .5s;
}
/*testi title*/
.testi-title h4 {
    font-size: 20px;
    font-weight: 700;
    margin-top: 0;
}
.testi-title span {
    font-size: 16px;
    color: #57647c;
    display: inline-block;
    padding: 4px 0 0;
}
/*testi desc*/
.testimonial-desc p {
    font-size: 16px;
    padding: 30px 0 0px;
}
/*testi star list*/
.testi-star-list ul li {
    font-size: 15px;
    letter-spacing: 5px;
    list-style: none;
    display: inline-block;
    color: #f15c41;
}

/*all hover*/
.testimonial-single-box:hover:after {
    height: 99px;
    opacity: 1;
}
.testimonial-single-box:hover .testimonial-icon i {
    color: #fff;
}

/*=============================================
<--  Dreamhub Footer section Css -->
===============================================*/

.footer-section {
    background: url(assets/images/resource/footer-bg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    padding: 150px 0 0px;
}
.style-two.footer-section {
    padding: 300px 0 0px;
}
.style-two.footer-section.upp {
    padding: 225px 0 0px;
}

/*widget title*/
h4.widget-title {
    font-size: 20px;
    color: #fff;
    font-weight: 700;
    position: relative;
    z-index: 1;
    margin-top: 0;
    padding: 0 0 56px;
}
h4.widget-title:before {
    position: absolute;
    content: "";
    left: 0;
    top: 42px;
    background: #f05c41;
    width: 50px;
    height: 2px;
    transition: .5s;
}
.company-info-desc p {
    color: #fff;
    padding: 64px 0 15px;
    font-size: 16px;
    width: 94%;
}
/*social icon*/
.follow-company-icon a {
    font-size: 15px;
    width: 30px;
    height: 30px;
    line-height: 31px;
    text-align: center;
    background: #fff;
    border-radius: 50px;
    display: inline-block;
    color: #232353;
    margin-right: 8px;
    position: relative;
    z-index: 1;
}
.follow-company-icon a:before {
    position: absolute;
    content: "";
    z-index: -1;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: #f05c41;
    border-radius: 50px;
    transform: scale(0);
    transition: .5s;
}

/*footer menu*/
.menu-quick-link-content {
    padding: 10px 0 0;
}

ul.footer-menu li {
    display: block;
    list-style: none;
    padding: 14px 0 0;
}

ul.footer-menu li a {
    color: #fff;
    transition: .5s;
    font-size: 16px;
}

ul.footer-menu li a i {
    padding-right: 8px;
}

/*company contact info*/
.company-contact-info {
    overflow: hidden;
    padding: 15px 0 0;
}

.company-contact-info p {
    padding: 14px 0 0px;
    color: #fff;
    font-size: 16px;
    display: -webkit-box;
}

.company-contact-info p i {
    font-size: 14px;
    width: 28px;
    height: 28px;
    line-height: 30px;
    text-align: center;
    background: #f7f7fe;
    display: inline-block;
    border-radius: 30px;
    color: #232353;
    margin-right: 14px;
    transition: .5s;
    float: left;
}
/*footer all hover*/
ul.footer-menu li a:hover {
    color: #f05c41;
}
.follow-company-icon a:hover:before {
    transform: scale(1);
}
.follow-company-icon a:hover {
    color: #fff;
}
/**footer bottom area**/
.row.footer-bottom {
    padding: 23px 0 26px;
    border-top: 1px solid #E5E5E5;
    margin-top: 58px;
}
.footer-bottom-content {
    text-align: center;
    padding: 10px 0 0;
}
.footer-bottom-content-copy p {
    color: #FFf;
    margin: 0 0 5px;
    font-size: 16px;
}
.footer-bottom-content-copy span {
    color: #f05c41;
}

/*=============================================
<--  Dreamhub Breatcam section Css -->
===============================================*/
.breatcam-section {
    background: #233253;
    height: 450px;
}

/*breatcam title*/
.breatcam-title h1 {
    font-size: 50px;
    color: #fff;
    text-transform: uppercase;
}
/*breatcam menu*/
.breatcam-menu ul li {
    display: inline-block;
    list-style: none;
    padding: 17px 0px 0 0px;
    color: #fff;
}
.breatcam-menu ul li a {
    color: #fff;
    transition: .5s;
    position: relative;
    padding: 0 50px 0 0;
    font-size: 18px;
}
.breatcam-menu ul li a:before {
    position: absolute;
    content: "";
    right: 14px;
    bottom: 9px;
    height: 1px;
    width: 20px;
    background: #fff;
}


.breatcam-menu ul li a:hover {
    color: #DD1D26;
}

/*=============================================
<--  Dreamhub Faq section Css -->
===============================================*/
.faq-section {
    background: #f7f7fe;
    padding: 140px 0 195px;
    margin-bottom: -105px;
}
/*accordion*/
.tab_container {
    overflow: hidden;
    padding: 20px 0 0;
}

.accordion li {
    list-style: none;
    padding: 2px 0px 15px;
    position: relative;
    z-index: 1;
}
.accordion li:before {
    position: absolute;
    content: "";
    z-index: -1;
    right: 20px;
    top: 16px;
    width: 28px;
    height: 28px;
    line-height: 28px;
    border-radius: 50%;
    background-color: #ff5a3c;
}

.accordion li a {
    position: relative;
    width: 100%;
    display: block;
    cursor: pointer;
    font-weight: 600;
    font-size: 18px;
    color: #232353!important;
    background-color: transparent;
    border: 1px solid #f15c41;
    padding: 14px 20px 14px 30px;
    border-radius: 5px;
    z-index: 1;
}
.accordion li p {
    display: none;
    font-size: 16px;
    padding: 25px 15px 25px 30px;
    margin: 0;
    background: rgba(248, 231, 234, .6);
    backdrop-filter: blur(1.9px);
    overflow: hidden;
    border-radius: 5px;
}
.accordion a:before {
    width: 2px;
    height: 10px;
    background: #fff;
    position: absolute;
    right: 32px;
    content: " ";
    top: 22px;
    transform: rotate(0deg);
    transition: all 0.2s ease-in-out;
}
.accordion a:after {
    width: 10px;
    height: 2px;
    background: #fff;
    position: absolute;
    right: 28px;
    content: " ";
    top: 26px;
    transition: all 0.2s ease-in-out;
}
.accordion a.active:after {
  transform: rotate(0deg);
  -webkit-transition: all 0.2s ease-in-out;
  background: #fff;
}
.accordion a.active:before{
  display: none;
}
 .accordion a.active {
    color: #fff!important;
    border: 1px solid #ff5a3c!important;
    background: #ff5a3c!important;
}

/*=============================================
<--  Dreamhub Pricing section Css -->
===============================================*/
.pricing-section {
    padding: 130px 0 100px;
}

.pricing-section .dreamhub-section-title p {
    width: 70%;
}

.pricing-single-items {
    padding: 0px 0 50px;
    text-align: center;
    margin-bottom: 30px;
    border-radius: 5px;
    background: #f2f4fc;
}
/*pricing head*/
.pricing-head {
    padding: 40px 0 42px;
    transition: .5s;
    border-radius: 5px 5px 0 0;
}
.pricing-title h3 {
    font-size: 22px;
    font-weight: 700;
    color: #062e5f;
    padding: 0 0 35px;
    transition: .5s;
}
.pricing-item-text span {
    display: inline-block;
    font-size: 50px;
    font-weight: 700;
    text-align: center;
    color: #062e5f;
    font-family: 'Playfair Display';
    transition: .5s;
}
/*pricing boody*/
.pricing-body {
    padding: 30px 100px 0;
    text-align: left;
}
.pricing-item-list ul li {
    display: block;
    font-size: 16px;
    padding: 9px 0;
}
.pricing-item-list ul li i {
    color: #ff5a3c;
    padding-right: 6px;
    font-size: 18px;
}
/*button*/
.btn-common.pc-btn a {
    color: #fff;
    background: #ff5a3c;
    font-size: 17px;
    font-weight: 500;
    padding: 11px 38px;
    border: 2px solid transparent;
    border-radius: 5px;
    margin-top: 32px;
    display: inline-block;
    position: relative;
    z-index: 1;
}
.btn-common.pc-btn a:before {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    left: 0;
    bottom: 0;
    background: #fff;
    z-index: -1;
    transition: 0.5s;
    transform: scale(0.0, 1);
    opacity: 0;
}
.pricing-single-items:hover .btn-common.pc-btn a{
  color: #ff5a3c;
}
.pricing-single-items:hover .btn-common.pc-btn a:before {
    transform: scale(1);
    opacity: 1;
}
.pricing-single-items:hover .pricing-head {
    background: #ff5a3c;
}
.pricing-single-items:hover .pricing-item-text span, .pricing-single-items:hover .pricing-title h3 {
    color: #fff;
}

/*active box*/
.active .pricing-head {
    background: #FF5A3C;
}
.active .pricing-item-text span, .active .pricing-title h3 {
    color: #fff;
}
.active .btn-common.pc-btn a:before {
    opacity: 1;
}
.active .btn-common.pc-btn a {
    color: #ff5a3c;
    background: #fff;
    border: 2px solid #ff5a3c;
}


/*=============================================
<--  Dreamhub Service details section Css -->
===============================================*/

.service-detials {
    padding: 140px 0 110px;
}


.service-dtls-title h1 {
    font-size: 36px;
    font-weight: 600;
    color: #233253;
    padding: 20px 0 20px;
    display: inline-block;
}

.serivce-details-desc p span {
    color: #FF3C00;
}
/*service detials box*/
.service-details-box2 {
    background: #f7f7fe;
    padding: 20px 25px 13px;
    border-radius: 4px;
    margin-bottom: 30px;
    margin-right: 5px;
}
/*service title*/
.service-details-title h4 {
    font-size: 22px;
    font-weight: 600;
    padding: 0 0 12px;
}
.service-page-title2 h1 {
    font-size: 30px;
    font-weight: 700;
    color: #233253;
    padding: 10px 0 16px;
    display: inline-block;
}
/*service icon*/
.service-details-icon {
    float: left;
    margin-right: 25px;
    margin-top: 10px;
}
/*widget icon*/
.widget-service-details-icon p {
    margin-bottom: 10px;
}
.widget-service-details-icon i {
    font-size: 24px;
    color: #ff5a3c;
    display: inline-block;
    margin-right: 2px;
    position: relative;
    top: 4px;
}

/*service work process*/
.service-work-process-box {
    padding: 40px 25px 20px;
    background: #f7f7fe;
    border-radius: 4px;
    text-align: center;
    margin-bottom: 30px;
}

.service-work-process-number {
    display: inline-block;
    padding: 10px;
    position: relative;
}
.service-work-process-number:before {
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    border: 10px solid #FF3C00;
    border-radius: 50%;
    opacity: .3;
}

.service-work-process-number span {
    font-size: 24px;
    font-weight: 500;
    color: #fff;
    width: 70px;
    height: 70px;
    line-height: 70px;
    text-align: center;
    background: #ff5a3c;
    display: inline-block;
    border-radius: 50%;
    position: relative;
    z-index: 1;
}

.service-work-process-title h4 {
    font-size: 24px;
    line-height: 32px;
    font-weight: 600;
    padding: 20px 0 10px;
}

.service-work-process-desc p {
    font-size: 16px;
    line-height: 26px;
}

/*service details right*/

.widget_search {
    padding: 30px 30px 30px;
    border-radius: 4px;
    margin-bottom: 30px;
    background: #f7f7fe;
}
.widget_search form {
    position: relative;
}
.widget_search input {
    border-radius: 4px;
    padding-left: 20px;
    height: 60px;
    width: 100%;
    position: relative;
    color: #ff5a3c;
    border: 0;
}
button.icons {
    border: 0;
    font-size: 18px;
    color: #fff;
    padding: 1px 15px;
    position: absolute;
    right: 0;
    top: 0;
    height: 60px;
    width: 60px;
    background: #ff5a3c;
    border-radius: 0 4px 4px 0;
}
/*categories box*/
.widget-categories-box {
    background: #f7f7fe;
    padding: 42px 40px 25px;
    border-radius: 5px;
}

/*categoeis title*/
.categories-title h4 {
    font-size: 26px;
    font-weight: 600;
    line-height: 24px;
    border-bottom: 2px solid #E9E9EA;
    padding: 0px 0 15px;
    margin: 0 0 30px;
    position: relative;
}
/*wedget menu*/
.widget-categories-menu ul li {
    display: block;
    list-style: none;
    margin-bottom: 15px;
    background: #fff;
    padding: 16px 20px 16px;
    border-radius: 4px;
    transition: .5s;
}
.widget-categories-menu ul li a {
    display: block;
    color: #232353;
    transition: .5s;
}

.widget-categories-menu ul li:hover {
    background: #ff5a3c;
}
.widget-categories-menu ul li:hover a {
    color: #fff;
}
/*wedget thumb*/
.widget-categories-thumb {
    background: #233253;
    padding: 80px 0 80px;
    margin-top: 30px;
    background-size: cover;
    border-radius: 5px;
}
/*widget title*/
.widget-title2 h3 {
    font-size: 42px;
    font-weight: 600;
    color: #ffff;
    padding: 26px 0 40px;
}
/*widget button*/
.widget-button a {
    padding: 15px 38px;
    font-size: 17px;
    font-weight: 500;
    background: #ff5a3c;
    color: #fff;
    border-radius: 4px;
    display: inline-block;
    position: relative;
    z-index: 1;
    border-radius: 20px 0px 20px 0px;
    border: 1px solid #ff5a3c;
}
.widget-button a i {
    padding-right: 5px;
}
.widget-button a:before {
    position: absolute;
    content: "";
    z-index: -1;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    border-radius: 20px 0px 20px 0px;
    background: #232323;
    transform: scale(0);
    transition: .5s;
}
.widget-button a:hover:before {
    transform: scale(1);
}

/*=============================================
<--  Dreamhub Blog details section Css -->
===============================================*/

.blogs-section {
    padding: 140px 0 140px;
}
.blog-single-box2.upp {
    padding: 0 30px 0 0;
}

/*blog single box*/
.blog-single-box2 {
    padding: 30px 30px 0 0;
}
/*blog thumb*/
.blog-thumb2 a img {
    width: 100%;
}
/*blog title*/
.blog-title2 h3 a {
    font-size: 35px;
    color: #232353;
    font-weight: 600;
    display: inline-block;
    padding: 0 0 18px;
}
.blog-title2 h3 a:hover {
    color: #ff5a3c;
}
/*blog text*/
.blog-text2 {
    padding: 0 0 20px;
}
span.blog-rt {
    padding-left: 18px;
}
.blog-text2 p i {
    color: #ff5a3c;
    padding-right: 10px;
}
/*blog description*/
.blog-description p {
    padding: 35px 0 0;
}

/*blog right*/
.widget-items {
    margin-bottom: 40px;
    padding: 21px 28px 22px;
    border-radius: 0;
    background: #f7f7fe;
}
/*categories title*/
.categories-title2 h4 {
    font-size: 22px;
    font-weight: 600;
    background: #ff5a3c;
    margin: -21px -29px 30px -29px;
    padding: 15px 29px;
    color: #fff;
    border-radius: 5px 5px 0 0;
}
/*wedget recent post*/
.widget-recent-post {
    border-bottom: 1px solid #E8E8E8;
    padding: 0 0 12px;
    margin-bottom: 20px;
}
.widget-recent-post.upper {
    border-bottom: 0;
    margin-bottom: 0;
}
/*rpost thumb*/
.rpost-thumb {
    margin-right: 20px;
}
.rpost-thumb a img {
    border-radius: 4px;
}
/*rpost content*/
.rpost-content h4 {
    margin-top: 0;
}
.rpost-content h4 a {
    font-size: 18px;
    font-weight: 600;
    line-height: 22px;
    color: #232353;
    display: inline-block;
    transition: .5s;
    font-family: 'Arimo';
}
.rpost-title span {
    display: inline-block;
    color: #232353;
    font-size: 15px;
    padding: 2px 0 0;
}
.rpost-content h4 a:hover {
    color: #ff5a3c;
}
/*tag item*/
.tag-item ul li {
    display: block;
    list-style: none;
    padding: 15px 0;
    margin-top: 0;
    border-top: 1px solid #e6e6e6;
}
li.item1 {
    padding: 15px 0 0 !important;
}
.tag-item ul li a {
    color: #232353;
    transition: .5s;
    font-size: 18px;
}
.tag-item ul li a span {
    float: right;
}
.tag-item ul li a:hover {
    color: #ff5a3c;
}
/*tag 2*/
.tag-item2 a {
    background: #fff;
    padding: 7px 22px;
    display: inline-block;
    margin: 0px 6px 15px 0;
    border: 1px solid #e6e6e6;
    font-weight: 500;
    color: #1b3434;
    transition: .5s;
    border-radius: 4px;
    position: relative;
    z-index: 1;
}
.tag-item2 a:before {
    position: absolute;
    content: "";
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: #ff5a3c;
    border-radius: 4px;
    z-index: -1;
    transform: scale(0);
    transition: .5s;
}

.tag-item2 a:hover:before {
    transform: scale(1);
}
.tag-item2 a:hover {
    color: #fff;
}

/* Calender*/
.calender {
    height: 335px;
}
.curr-month {
    width: 100%;
    height: 40px;
    background: #F8E7EA;
    color: #000;
    font-size: 18px;
    text-align: center;
    line-height: 40px;
}
.all-days {
  width: 100%;
  height: 40px;
  background-color: #fff;
  float: left;
}
.all-days ul,
.all-date ul {
  list-style: none;
  display: block;
  height: 30px;
  width: 100%;
  margin: 0 auto;
  float: left;
  font-size: 15px;
  font-weight: 300;
}
.all-days ul li, .tag-item .all-date ul li {
    float: left;
    width: 51px;
    text-align: center;
    line-height: 12px;
    border: 1px solid #e6e6e6;
    color: #333;
}
.all-days ul li {
    font-size: 16px;
}
.all-date {
  width: 100%;
  height: 305px;
  float: left;
}
.all-date li {
  height: 40px;
  width: 50px;
  line-height: 40px;
  border: 1px solid #ccc;
  background-color: #fff;
}
.all-date li.monthdate:hover {
    background-color: #ff5a3c;
    color: #fff;
}

/*blog quote*/
.blog-quotes {
    font-size: 20px;
    border-left: 4px solid #B59A6D;
    background: 0 0;
    font-style: normal;
    color: #232;
    font-weight: 400;
    position: relative;
    line-height: 1.5;
    background-color: #edf0f2;
    padding: 24px 39px 24px 37px;
    margin: 25px 0 25px;
}
.blog-quotes p {
    margin: 0 0 7px;
    color: #B59A6D;
}
.meta-blog-title2 h5 {
    padding: 5px 0 15px;
}
.blog-list2 ol {
    padding: 15px 16px 0;
}

/*solial tag*/
.row.bld-bg {
    border-top: 1px solid rgba(27,43,43,0.10196078431372549);
    padding-top: 26px;
    margin-top: 30px;
    padding-bottom: 22px;
}
.tag-list ul li {
    display: inline-block;
    list-style: none;
}
.tag-list ul li a {
    padding: 3px 20px;
    background: #f7f7fe;
    display: inline-block;
    border-radius: 30px;
    margin-right: 8px;
    color: #1b2b2b;
    transition: .5s;
}
.tag-list ul li a:hover {
    background: #ff5a3c;
    color: #fff;
}
.social-icon-list ul li {
    display: inline-block;
    list-style: none;
}
.social-icon-list ul li span {
    font-size: 18px;
    font-weight: 500;
    color: #1b3434;
    padding-right: 6px;
}
.social-icon-list ul li a {
    height: 34px;
    width: 34px;
    line-height: 34px;
    background: #fff;
    text-align: center;
    border: 1px solid rgba(13,14,20,0.1);
    display: inline-block;
    border-radius: 30px;
    font-size: 14px;
    color: #5F6A6A;
    margin-right: 7px;
    position: relative;
    z-index: 1;
}
.social-icon-list ul li a:before {
    position: absolute;
    content: "";
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: #ff5a3c;
    border-radius: 30px;
    z-index: -1;
    transform: scale(0);
    transition: .5s;
}
.social-icon-list ul li a:hover:before {
    transform: scale(1);
}
.social-icon-list ul li a:hover {
    color: #fff;
}
/*post comment*/
.blog-details-comments-box {
    padding: 65px 22px 50px 0;
}
.widget-comments-title h2 {
    font-size: 30px;
    padding: 0 0 40px;
}
.post-comment2 {
    border-bottom: 1px solid rgba(27,43,43,0.10196078431372549);
    margin: 0 0 30px;
    padding: 0 0 11px;
}
.post-comment-thumb {
    float: left;
    margin-right: 20px;
}
.blog-content2 {
    overflow: hidden;
}
.post-title span {
    padding-left: 31px;
    font-size: 16px;
    color: #232353;
    font-weight: 500;
    position: relative;
}
.post-title span:before {
    position: absolute;
    content: "";
    left: 6px;
    top: 9px;
    height: 1px;
    width: 15px;
    background: #0D0E14;
}
span.rights-reply {
    float: right;
    font-weight: 500;
    color: #0D0E14;
    position: relative;
    top: -109px;
    cursor: pointer;
    left: 0;
}
.posts-reply p {
    font-size: 16px;
    margin-bottom: 10px;
}
.post-title h4 {
    font-size: 20px;
    font-weight: 600;
    line-height: 26px;
    margin-top: 0;
    padding: 0px 0 9px;
}
.comment-icon-list ul li {
    list-style: none;
    display: inline-block;
    color: #ff5a3c;
    letter-spacing: .4em;
    font-size: 15px;
}


/*pagination*/
.pagination-menu ul {
    display: inline-block;
}
.pagination-menu ul li {
    display: inline-block;
    list-style: none;
    padding-right: 10px;
}
.pagination-menu ul li a {
    width: 40px;
    height: 40px;
    line-height: 36px;
    text-align: center;
    border-radius: 20px;
    display: inline-block;
    border: 1px solid #ff5a3c;
    color: #666;
    font-size: 20px;
    position: relative;
    z-index: 1;
    transition: .5s;
}
.pagination-menu ul li a:before {
    position: absolute;
    content: "";
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: #ff5a3c;
    border-radius: 40px;
    transform: scale(0);
    transition: .5s;
    z-index: -1;
}

.pagination-menu ul li a:hover:before {
    transform: scale(1);
}
.pagination-menu ul li a:hover {
    color: #fff;
}

/*contact form
==================================================-->*/

.contact-section {
    padding: 0 0 130px;
}
/*form box*/
.form-box input , select {
    height: 54px;
    background-color: #fff;
    border: 1px solid #ff5a3c;
    transition: .5s;
    padding: 0px 25px;
    display: block;
    width: 100%;
    color: #0D0E14;
    margin-bottom: 30px;
    border-radius: 4px;
}
.form-box textarea {
    height: 170px;
    background-color: #fff;
    border: 1px solid #ff5a3c;
    transition: .5s;
    padding: 15px 25px;
    display: block;
    width: 100%;
    border-radius: 4px;
}

.contact-form button {
    width: 100%;
    height: 54px;
    background: #ff5a3c;
    border: 1px solid #ff5a3c;
    font-weight: 500;
    color: #fff;
    display: inline-block;
    margin-top: 40px;
    border-radius: 5px;
    position: relative;
    z-index: 1;
    transition: .5s;
}
.contact-form button:before {
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    background: #fff;
    transform: scale(0.0, 1);
    transition: .5s;
    z-index: -1;
}
.contact-form button:hover:before {
    transform: scale(1);
}
.contact-form:hover button {
    color: #232353;
}

/*contact info section*/
.contact-info-section {
    padding: 100px 0 120px;
}
.contact-info-section .contacts-icon {
    float: left;
    margin-right: 20px;
}
.contact-info-section .contacts-icon i {
    width: 60px;
    height: 60px;
    line-height: 60px;
    background: #ff5a3c;
    text-align: center;
    color: #fff;
    font-size: 20px;
    border-radius: 50%;
    display: inline-block;
}
.contact-info-section .contacts-title h5 {
    font-weight: 500;
    font-size: 18px;
    color: #232353;
}

.contact-info-section .contacts-title h6 {
    font-size: 20px;
    font-weight: 600;
    padding: 4px 0 0;
}

/*case study three
======================================================*/
.portfolio-section {
    padding: 130px 0 110px;
}
/* Portfolio Nav */
.portfolio_nav {
    margin: 40px 5px 45px;
}
.portfolio_menu ul {
    text-align: center;
    list-style: none;
}
.portfolio_nav ul li {
    background: #fff;
    border: 1px dashed #ff5a3c;
    font-size: 16px;
    transition: all 0.5s ease 0s;
    cursor: pointer;
    padding: 6px 30px;
    margin-right: 10px;
    font-weight: 500;
    position: relative;
    display: inline-block;
    border-radius: 30px;
}
.portfolio_menu ul li a{
    display: block;
    color:#fff;
    text-transform:uppercase;
    position:relative;
    transition:.5s;
}
.portfolio_menu ul li a:before {
    position: absolute;
    content: "";
    left: 0;
    top: 24px;
    height: 2px;
    width: 0%;
    background: #fff;
    transition:.5s;
}

.portfolio_nav ul li:hover, .portfolio_nav ul li.current_menu_item {
    color: #fff;
    background: #ff5a3c;
}
/*nav menu end*/

.case-study-single-box {
    position: relative;
    z-index: 1;
    margin-bottom: 30px;
    overflow: hidden;
}
 .case-study-thumb {
    position: relative;
    z-index: 1;
}
.case-study-thumb img {
    width: 100%;
    border-radius: 5px;
}
.case-study-thumb:before {
    position: absolute;
    content: "";
    left: 0;
    bottom: 0;
    width: 100%;
    height: 0%;
    background: #232353;
    opacity: .6;
    transition: .5s;
    border-radius: 5px;
}

.case-study-icon a i {
    font-size: 16px;
    display: inline-block;
    width: 50px;
    height: 50px;
    line-height: 50px;
    top: 0px;
    right: 0;
    left: 0;
    margin: auto;
    background: #ff5a3c;
    color: #fff;
    text-align: center;
    border-radius: 50%;
    position: absolute;
    z-index: 1;
    transition: .5s;
    opacity: 0;
}

/*case stusy content*/
.case-study-content {
    position: absolute;
    bottom: 0px;
    left: 35px;
    right: 0;
    z-index: 1;
    transition: .5s;
    opacity: 0;
}

/*study text*/
.study-text p {
    font-size: 18px;
    color: #fff;
    position: relative;
    z-index: 1;
}
.study-text p:before {
    position: absolute;
    content: "";
    left: 0;
    bottom: -14px;
    background: #fff;
    width: 89%;
    height: 1px;
}
.study-text p:after {
    position: absolute;
    content: "";
    left: 0;
    bottom: -14px;
    background: #ff5a3c;
    width: 18%;
    height: 1px;
    transition: .7s;
}

.study-title h4 a {
    font-size: 24px;
    color: #fff;
    display: inline-block;
    padding: 15px 0 0;
    transition: .5s;
}
.study-title h4 a:hover {
    color: #ff5a3c;
}
.case-study-single-box:hover .study-text p:after {
    width: 89%;
}
.case-study-single-box:hover .case-study-thumb:before {
    height: 100%;
    top: 0;
}
.case-study-single-box:hover .case-study-icon a i {
    opacity: 1;
    top: 30px;
}
.case-study-single-box:hover .case-study-content {
    bottom: 30px;
    opacity: 1;
}
/*active*/
.active.center .case-study-thumb:before {
    height: 100%;
    top: 0;
}
.active.center .case-study-icon a i {
    opacity: 1;
    top: 30px;
}
.active.center .case-study-content {
    bottom: 30px;
    opacity: 1;
}

/*======================================
<-- Consen Case Study Details Css -->
========================================*/
.case-study-details {
    padding: 130px 0 110px;
}
.case-study-intro {
    box-shadow: 0 0 15px rgb(0,0,0,0.2);
    padding: 60px;
    margin-bottom: 50px;
}
.csd-thumb img{
  width:100%;
}
.csd-info {
    padding: 0 50px;
}
.csd-info ul li {
  list-style: none;
  margin-bottom: 10px;
  font-size: 20px;
  font-weight: 300;
  text-transform: capitalize;
}
.csd-info ul  {
  padding: 13px 0;

}
.csd-social-icon li{
  display: inline-block;
  margin: 0px 8px 0 0;
}
.csd-social-icon li i {
  color: #fff;
  height: 35px;
  width: 35px;
  line-height: 35px;
  text-align: center;
  background: #ff5a3c;
  border-radius: 5px;
  transition: .5s;
}
.csd-social-icon li i:hover{
    background: #11102F;
    color: #fff;
}
.csd-title  h3 {
    font-size: 28px;
    font-weight: 600;
}
.csd-info ul li {
    list-style: none;
    margin-bottom: 15px;
    font-size: 19px;
    font-weight: 300;
    text-transform: capitalize;
}
.csd-info strong {
    font-size: 19px;
    font-weight: 600;
    margin-right: 5px;
    color: #232323;
}
.share-text {
    float: left;
    margin-right: 20px;
}
.share-text h4 {
    font-size: 20px;
    color: #666;
    font-weight: 600;
    margin-top: 6px;
}
.csd-social-icon ul {
    padding: 0;
}


/*=====================================
<-- Dream hub Error Area Css -->
=======================================*/
.error-area {
    padding: 100px 0 100px;
}
.error-thumb {
    text-align: center;
}
.error-content {
    text-align: center;
}
.error-content h2 {
    font-size: 36px;
    text-transform: uppercase;
    letter-spacing: 2px;
    font-weight: 600;
}
.error-content h2 span {
    color: #fe4e5b;
}
.error-content p {
    font-size: 18px;
    padding-top: 15px;
    padding-bottom: 20px;
}
.error-search {
    text-align: center;
}
.error-button {
    text-align: center;
    margin-top: 40px;
}
.error-search input {
    width: 50%;
    height: 58px;
    border: 1px solid rgba(35,35,35,0.12);
    border-radius: 30px;
    padding-left: 30px;
    outline: 0;
}
.error-search input:focus {
    outline: 0;
    box-shadow: 0 0 6px rgb(204, 48, 0, 0.6);
}
.error-search button {
    outline: 0;
    border: 0;
    background: transparent;
    position: relative;
    margin-left: -55px;
    color: #686868;
}
.error-search ::placeholder{
    color:#686868;
}
.error-button a {
    padding: 14px 40px 14px 40px;
    font-weight: 500;
    color: #fff;
    background: #ff5a3c;
    display: inline-block;
    border-radius: 30px;
    border: 1px solid #ff5a3c;
    position: relative;
    z-index: 1;
    overflow: hidden;
}
.error-button a i {
    margin-right: 5px;
}
.error-button a:before {
    position: absolute;
    content: "";
    z-index: -1;
    top: 0;
    right: 0;
    height: 100%;
    width: 0;
    background: #10102E;
    border-radius: 30px;
    transition: .5s;
}
.error-button a:hover{
    border-color: #10102E;
}
.error-button a:hover:before {
    width: 100%;
    left: 0;
}
.map-section {
    position: relative;
    margin-bottom: -7px;
}

/*
<!-- ============================================================== -->
<!-- print_shop Scrollup Section -->
<!-- ============================================================== -->*/
.scroll-area{
  position: relative;
  z-index: 999;
 }
.scroll-area .go-top {
    position: fixed;
    cursor: pointer;
    top: 0;
    right: 30px;
    color: #ffffff;
    background-image: -moz-linear-gradient(0deg, #d1651a 0%, #c1282a 100%);
    background-image: -webkit-linear-gradient(0deg, #d1651a 0%, #c1282a 100%);
    z-index: 9999;
    width: 45px;
    text-align: center;
    height: 45px;
    line-height: 42px;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all 0.9s ease-out 0s;
    -moz-transition: all 0.9s ease-out 0s;
    border-radius: 10px; 
}
.scroll-area .go-top i {
      position: absolute;
      top: 50%;
      left: -4px;
      right: 0;
      margin: 0 auto;
      font-size: 15px;
      -o-transform: translateY(-50%);
      transform: translateY(-50%);
      -webkit-transition: all 0.5s ease-out 0s;
      -moz-transition: all 0.5s ease-out 0s;
  }
.scroll-area .go-top i:last-child {
    opacity: 0;
    visibility: hidden;
    top: 60%; 
}
.scroll-area .go-top::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    background-image: linear-gradient(to right, #232353 0%, #232353 100%);
    background-image: -ms-linear-gradient(0deg, #232353 0%, #232353 100%);
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all 0.5s ease-out 0s;
    -moz-transition: all 0.5s ease-out 0s;
    border-radius: 100%;
}


.header-top {
  background: #ff5a3c;
  padding: 9px 0;
}
*, ::after, ::before {
  box-sizing: border-box;
}

.header-icon-list {
  text-align: left;
}

.header-icon-list ul li {
  display: inline-block;
  list-style: none;
  margin-right: 10px; padding: 0 10px;
  color: #fff; font-weight: bold;
}

.mar30 {margin-top: 20px;}

.header-icon-list1 {
  text-align: right;
}

.header-icon-list1 ul li {
  display: inline-block;
  list-style: none;
  margin-right: 10px; padding: 0 10px;
  color: #fff; font-weight: bold;
}




.mytb .tdmy1 {
    color: #fff;
    background-color: #ff5a3c;
    font-size: 24px;
    font-weight: bold; text-align: center;
}


.mytb .tdmy2 {
    color: #92280f;
    font-size: 18px;
    font-weight: bold;
}


.mytb .tdmy {
    text-transform: capitalize; text-align: center;
    
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+56,ffffff+65,f6f6f6+100 */
background: #ffffff; /* Old browsers */
background: -moz-linear-gradient(top,  #ffffff 56%, #ffffff 65%, #f6f6f6 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #ffffff 56%,#ffffff 65%,#f6f6f6 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #ffffff 56%,#ffffff 65%,#f6f6f6 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f6f6f6',GradientType=0 ); /* IE6-9 */

}

.fhd {
    display: none;
    visibility: hidden;
    
    
}






.scroll-area .go-top:focus, .scroll-area .go-top:hover {
      color: #fff; 
  }
.scroll-area .go-top:focus::before, .scroll-area .go-top:hover::before {
        opacity: 1;
        visibility: visible; 
}
.scroll-area .go-top:focus i:first-child, .scroll-area .go-top:hover i:first-child {
        opacity: 0;
        top: 0;
        visibility: hidden;
 }
.scroll-area .go-top:focus i:last-child, .scroll-area .go-top:hover i:last-child {
        opacity: 1;
        visibility: visible;
        top: 50%; 
}
.scroll-area .go-top.active {
    top: 95%;
    -webkit-transform: translateY(-98%);
    -moz-transform: translateY(-98%);
    opacity: 1;
    visibility: visible;
    border-radius: 0;
    right: 30px;
    border-radius:100%;
}
.top-wrap {
  position: relative; 
}
.top-wrap .go-top-button {
    display: inline-block;
    width: 50px;
    height: 50px;
    line-height: 40px;
    text-align: center;
    color: #fff;
    top: 3px;
    z-index: 1;
    background: #ff5a3c;
}
 .top-wrap .go-top-button i {
      font-size: 20px;
      font-weight: 700;
      padding-left: 4px;
      color: #fff;
 }
.top-wrap .go-top-button::after {
    z-index: -1;
    content: "";
    position: absolute;
    left: 3px;
    top: 3px;
    width: 45px;
    height: 45px;
    -webkit-animation: ripple 1.6s ease-out infinite;
    -moz-animation: ripple 1.6s ease-out infinite;
    opacity: 0;
    background-image: -moz-linear-gradient(0deg, #ff5a3c 0%, #ff5a3c 100%);
    background-image: -webkit-linear-gradient(0deg, #ff5a3c 0%, #ff5a3c 100%);
    border-radius: 100%;
}
.top-wrap .go-top-button:hover {
      background-color: #222;
      color: #fff; 
  }
@keyframes ripple {
  0%, 35% {
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    -o-transform: scale(0);
    transform: scale(0);
    opacity: 1; }
  50% {
    -webkit-transform: scale(1.5);
    -moz-transform: scale(1.5);
    -ms-transform: scale(1.5);
    -o-transform: scale(1.5);
    transform: scale(1.5);
    opacity: 0.8; }
  100% {
    opacity: 0;
    -webkit-transform: scale(2);
    -moz-transform: scale(2);
    -ms-transform: scale(2);
    -o-transform: scale(2);
    transform: scale(2); } }