** |---------------------------------------------------------------------------- | CSS INDEX |---------------------------------------------------------------------------- 1.0 General styles 2.0 Common styles 3.0 Main navbar 4.0 Headroom JS styles 5.0 Banner styles 6.0 trending item styles 7.0 download section styles 8.0 Video section styles 9.0 features section styles 10.0 screenshots section styles 11.0 client section styles 12.0 fact section styles 13.0 pricing section styles 14.0 App section styles 15.0 blog section styles 16.0 Contact section styles 17.0 footer section styles 18.0 slider item styles 19.0 team section styles 20.0 testimonial section styles 21.0 breadcrumb section styles 22.0 blog section styles 23.0 widget section styles 24.0 single-blog section styles 25.0 Preloader styles ***/ /* ================================================================== 1.0 General styles ================================================================== */ body { color: #606060; font-family: 'Open Sans', sans-serif; font-size: 14px; line-height: 20px; background: #ffffff; } h1, h2, h3, h4, h5, h6 { font-family: 'Raleway', sans-serif; color: #313131; } p { font-size: 14px; line-height: 26px; } a:hover { color: #535454; } a { color: #535454; } a:focus, a:hover, a:active, :focus { outline: none; text-decoration: none; } img { max-width: 100%; } ::-webkit-input-placeholder { /* Chrome/Opera/Safari */ color: #606060; } ::-moz-placeholder { /* Firefox 19+ */ color: #606060; } :-ms-input-placeholder { /* IE 10+ */ color: #606060; } :-moz-placeholder { /* Firefox 18- */ color: #606060; } .left { float: left; } .right { float: right; } .no-pad { padding: 0; } .no-bg { background: none !important; } .btn-video { position: relative; text-align: center; display: inline-block; color: #d72d60; font-size: 60px; width: 80px; height: 80px; line-height: 78px; border-radius: 50%; background: rgba(255,255,255,.2); z-index: 10; } .btn-video:before { content: ''; display: block; width: 100px; height: 100px; border-radius: 50%; background: rgba(255,255,255,.2); position: absolute; top: -10px; left: -10px; z-index: -1; } .btn-video:after { content: ''; display: block; width: 120px; height: 120px; border-radius: 50%; background: rgba(255,255,255,.2); position: absolute; top: -20px; left: -20px; z-index: -10; } .btn-signup:active, .btn-signup:foucs, .btn-signup:visited { box-shadow: 0px 3px 15px 0px rgba(0, 0, 0, 0.07) !important; color: #606060 !important; } .btn-signup { position: relative; border-radius: 4px; padding: 8px 35px !important; background-color: rgb(255, 255, 255); box-shadow: 0px 3px 15px 0px rgba(0, 0, 0, 0.07); font-family: 'Open Sans', sans-serif; font-weight: 700; background: transparent; color: #606060; } .btn-signup:before { content: ''; display: block; position: absolute; left: 0; right: 0; bottom: 0; top: 0; border-radius: 4px; background: -moz-linear-gradient( 0deg, rgb(255,142,39) 0%, rgb(215,45,96) 100%); background: -webkit-linear-gradient( 0deg, rgb(255,142,39) 0%, rgb(215,45,96) 100%); background: -ms-linear-gradient( 0deg, rgb(255,142,39) 0%, rgb(215,45,96) 100%); z-index: -1; visibility: hidden; opacity: 0; -webkit-transition: all .5s ease-in-out; -moz-transition: all .5s ease-in-out; transition: all .5s ease-in-out; } .btn-signup:active:before, .btn-signup:focus:before, .btn-signup:hover:before { visibility: visible; opacity: 1; } .btn-signup:active, .btn-signup:focus, .btn-signup:hover { color: #606060; color: #ffffff; } .default-padding { padding: 120px 0; } .default-padding-2 { padding: 115px 0 120px 0; } .default-padding-3 { padding: 115px 0 110px 0; } .default-padding-4 { padding: 115px 0 90px 0; } #map { height: 700px; } .swiper-container { position: relative; width: 770px; z-index: 111; } .swiper-slide { background-position: center; background-size: cover; width: 300px; height:600px; } .swiper-pagination-bullet { width: 30px; height: 10px; display: inline-block; border-radius: 25px; background: #000; background: -moz-linear-gradient( -172deg, rgb(255,142,39) 0%, rgb(216,48,94) 100%); background: -webkit-linear-gradient( -172deg, rgb(255,142,39) 0%, rgb(216,48,94) 100%); background: -ms-linear-gradient( -172deg, rgb(255,142,39) 0%, rgb(216,48,94) 100%); opacity: 1; -webkit-transition: all .5s ease-in-out; -moz-transition: all .5s ease-in-out; transition: all .5s ease-in-out; } .swiper-pagination-bullet.swiper-pagination-bullet-active { width: 60px; } .swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction { } /* ================================================================== 2.0 Common styles ================================================================== */ .list-style-none { list-style: none; margin: 0; padding: 0; } .btn { padding: 12px 30px; font-family: 'Open Sans', sans-serif; font-size: 16px; border: 0; cursor: pointer; text-align: center; border-radius: 6px; line-height: 26px; font-weight: 600; letter-spacing: 0.5px; -moz-transition: .3s ease-in-out; -webkit-transition: .3s ease-in-out; transition: .3s ease-in-out; } .btn:active, .btn:hover, .btn:focus { box-shadow: none; outline: none !important; } .btn-deep-red:focus, .btn-deep-red:active, .btn-deep-red { background: -moz-linear-gradient( -172deg, rgb(255,142,39) 0%, rgb(215,46,96) 100%); background: -webkit-linear-gradient( -172deg, rgb(255,142,39) 0%, rgb(215,46,96) 100%); background: -ms-linear-gradient( -172deg, rgb(255,142,39) 0%, rgb(215,46,96) 100%); color: #ffffff; } .btn-deep-red:hover { color: #fff; } .btn-dark-red { background: #d8305e; color: #fff; } .btn-dark-red:hover { color: #fff; background: #ffab00; } .btn-deep-blue { background: #4F2E65; color: #DED6D6; } .btn-white { background: #ffffff; color: #606060; } .section-title { text-align: center; margin-bottom: 67px; } .section-title .title { font-size: 30px; font-weight: 600; margin-top: 0; margin-bottom: 13px; } .section-title p { font-size: 16px; margin-bottom: 0; line-height: 28px; } .social-area { list-style: none; margin: 0; padding: 0; } .social-area li { height: 50px; width: 50px; text-align: center; border-radius: 50%; margin: 0 10px; background: #fff; -webkit-transition: all .3s ease-in-out; -moz-transition: all .3s ease-in-out; transition: all .3s ease-in-out; display: inline-flex; justify-content: center; align-items: center; padding-top: 5px; } .social-area li:active, .social-area li:hover { background: #ffffff; } .social-area li:active a i, .social-area li:hover a i { color: #444444; } .social-area li a i { font-size: 20px; color: #d72e60; -webkit-transition: all .3s ease-in-out; -moz-transition: all .3s ease-in-out; transition: all .3s ease-in-out; } .bg-light-gray { background: #f9f9f9; } .social-area li .facebook-btn:hover i { color: #3b5998; } .social-area li .twitter-btn:hover i { color: #1da1f2; } .social-area li .google-btn:hover i { color: #db4437; } .social-area li .pinterest-btn:hover i { color: #bd081c; } .social-area li .linkedin-btn:hover i { color: #007bb5; } /* |---------------------------------------------------------------------------- | 3.0 Main navbar |---------------------------------------------------------------------------- */ .navbar.navbar-default { margin-bottom: 0; min-height: 80px; border: 0; } .navbar.navbar-default .navbar-brand { float: left; padding: 0 15px; font-size: 18px; line-height: 20px; } .navbar.navbar-default .navbar-brand { position: relative; font-size: 60px; color: #ffffff; font-family: 'Montserrat', sans-serif; font-weight: 500; } .navbar.navbar-default .navbar-brand:before { content: ''; display: block; width: 231px; height: 231px; border-radius: 50%; background: rgba(255, 255, 255, 0.2); position: absolute; top: -150px; left: -26px; } .navbar.navbar-default .navbar-toggle { border-color: #ff500d; border-radius: 0; } .navbar.navbar-default .navbar-toggle .icon-bar { background: #ff500d; } .navbar-fixed-bottom .navbar-collapse, .navbar-fixed-top .navbar-collapse { max-height: 100% !important; } @media all and (min-width: 991px) { .logged-in.admin-bar .navbar-header { margin-top: 33px; } .logged-in.admin-bar .collapse.navbar-collapse { margin-top: 26px; } .navbar.navbar-default ul.nav.navbar-nav li.menu-item-has-children > ul.sub-menu { margin-left: 0 !important; } /************** *** ***************/ .navbar.navbar-default .navbar-brand { padding-top: 15px; } .navbar.navbar-default.navbar-fixed-top .navbar-brand { padding-top: 0; } .navbar.navbar-default ul.nav.navbar-nav { margin-top: 20px; } .navbar.navbar-default ul.nav.navbar-nav > li { margin-bottom: 0; margin-right: 35px; } .navbar.navbar-default ul.nav.navbar-nav > li:last-child { margin-right: 0; } .navbar.navbar-default ul.nav.navbar-nav li a { display: inline-block; font-family: 'Raleway', sans-serif; font-size: 16px; line-height: 20px; font-weight: 600; color: #171717; padding: 10px 0; } .navbar.navbar-default ul.nav.navbar-nav li.menu-item-has-children { position: relative; } .navbar.navbar-default ul.nav.navbar-nav li.menu-item-has-children > ul.sub-menu { position: absolute; min-width: 160px; top: 100%; left: 0; margin-top: 0; background: #f8f8f8; list-style: none; padding-left: 0; z-index: 9999; visibility: hidden; opacity: 0; -webkit-transform: rotateX(90deg); -moz-transform: rotateX(90deg); -ms-transform: rotateX(90deg); transform: rotateX(90deg); -webkit-transform-origin: top; -moz-transform-origin: top; transform-origin: top; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .navbar.navbar-default ul.nav.navbar-nav li.menu-item-has-children > ul.sub-menu li { border-bottom: 1px solid #e0e0e0; margin-bottom: 0; list-style: none; } .navbar.navbar-default ul.nav.navbar-nav li.menu-item-has-children > ul.sub-menu li a { padding: 7px 15px; } .navbar.navbar-default ul.nav.navbar-nav li.menu-item-has-children > ul.sub-menu li ul.sub-menu { margin-left: 30px; } .navbar.navbar-default ul.nav.navbar-nav li.menu-item-has-children > ul.sub-menu li ul.sub-menu li ul.sub-menu li ul.sub-menu { margin-left: -30px; } .navbar.navbar-default ul.nav.navbar-nav li.menu-item-has-children:hover > ul.sub-menu { visibility: visible; opacity: 1; -webkit-transform: rotateX(0); -moz-transform: rotateX(0); -ms-transform: rotateX(0); transform: rotateX(0); } .navbar.navbar-default.navbar-fixed-top { background: transparent; padding-top: 50px; -webkit-transition: all 0.8s ease-in-out; -moz-transition: all 0.8s ease-in-out; transition: all 0.8s ease-in-out; } .navbar.navbar-default.navbar-fixed-top ul.nav.navbar-nav { margin-top: 0; } .navbar.navbar-default.navbar-fixed-top ul.nav.navbar-nav li a { color: #ffffff; } .navbar.navbar-default.navbar-fixed-top ul.nav.navbar-nav > li.current:after { content: ''; position: absolute; bottom: 0; display: block; width: 20px; height: 3px; background: rgba(255, 255, 255, .5); } .navbar.navbar-default.navbar-fixed-top.headroom--not-top ul.nav.navbar-nav li.current:after{ background: #d72f5f; } .navbar.navbar-default.navbar-fixed-top ul.nav.navbar-nav li ul.sub-menu li a { color: #606060; } /* ================================================================== 4.0 Headroom JS styles ================================================================== */ .headroom, .navbar-home.fixed-nav { position: fixed; top: 0; left: 0; right: 0; -webkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out; } .headroom--unpinned { top: -100px; } .headroom--pinned { top: 0; } @-webkit-keyframes slideDown { 0% { -webkit-transform: translateY(-100%); } 100% { -webkit-transform: translateY(0); } } @-moz-keyframes slideDown { 0% { -moz-transform: translateY(-100%); } 100% { -moz-transform: translateY(0); } } @-o-keyframes slideDown { 0% { -o-transform: translateY(-100%); } 100% { -o-transform: translateY(0); } } @keyframes slideDown { 0% { transform: translateY(-100%); } 100% { transform: translateY(0); } } .animated.slideDown { -webkit-animation-name: slideDown; -moz-animation-name: slideDown; -o-animation-name: slideDown; animation-name: slideDown; } @-webkit-keyframes slideUp { 0% { -webkit-transform: translateY(0); } 100% { -webkit-transform: translateY(-100%); } } @-moz-keyframes slideUp { 0% { -moz-transform: translateY(0); } 100% { -moz-transform: translateY(-100%); } } @-o-keyframes slideUp { 0% { -o-transform: translateY(0); } 100% { -o-transform: translateY(-100%); } } @keyframes slideUp { 0% { transform: translateY(0); } 100% { transform: translateY(-100%); } } .animated.slideUp { -webkit-animation-name: slideUp; -moz-animation-name: slideUp; -o-animation-name: slideUp; animation-name: slideUp; } .headroom--not-top { background: #ffffff !important; padding: 0; box-shadow: 0px 0px 4px 2px rgba(0,0,0,0.2); } .navbar.navbar-default.navbar-fixed-top.headroom--not-top { background: #ffffff !important; padding-top: 25px; } .navbar.navbar-default.navbar-fixed-top.headroom--not-top .navbar-brand { color: #ff500d; } .navbar.navbar-default.navbar-fixed-top.headroom--not-top .navbar-brand:before { content: none; } .navbar.navbar-default.navbar-fixed-top.headroom--not-top ul.nav.navbar-nav li a { color: #606060; } .navbar-home.fixed-nav { padding: 0 0; z-index: 99999; display: none; border-radius: 0; background: rgba(0, 0, 0, 0.8) !important; } } @media all and (max-width: 1024px) and (min-width: 992px) { .navbar.navbar-default ul.nav.navbar-nav li { margin-right: 20px; } } @media all and (max-width: 991px) { /** * Change bootstrap navbar collapse breakpoint */ .navbar-header { float: none; } .navbar-left, .navbar-right { float: none !important; } .navbar-toggle { display: block; } .navbar-collapse { border-top: 1px solid transparent; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1); } .navbar-fixed-top { top: 0; border-width: 0 0 1px; position: relative; } .navbar-collapse.collapse { display: none !important; } .navbar-nav { float: none !important; margin-top: 7.5px; } .navbar-nav > li { float: none; } .navbar-nav > li > a { padding-top: 10px; padding-bottom: 10px; } .collapse.in { display: block !important; } .navbar-toggle { margin-top: 23px; margin-bottom: 23px; } .navbar-brand { padding-top: 15px !important; } /** navbar click events **/ ul.nav.navbar-nav li { margin-bottom: 0; } ul.nav.navbar-nav li a { display: block; font-family: 'Raleway', sans-serif; font-size: 15px; font-weight: 500; line-height: 20px; color: #171717; } ul.nav.navbar-nav li.menu-item-has-children { position: relative; } ul.nav.navbar-nav li.menu-item-has-children.navbar-mobile > .sub-menu { display: none; padding-left: 15px; } ul.nav.navbar-nav li.menu-item-has-children.navbar-mobile.sub-open > .sub-trigger:after { content: '\f068'; font-family: FontAwesome; } ul.nav.navbar-nav li.menu-item-has-children.navbar-mobile .sub-trigger { display: inline-block; position: absolute; right: 20px; cursor: pointer; top: 7px; text-align: center; cursor: pointer; width: 25px; height: 25px; line-height: 25px; color: #ffffff; background: #1e1132; } ul.nav.navbar-nav li.menu-item-has-children.navbar-mobile .sub-trigger:after { content: '\f067'; font-family: FontAwesome; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } ul.nav.navbar-nav li ul.sub-menu { list-style: none; margin-left: 25px; padding-left: 0 !important; } ul.nav.navbar-nav li ul.sub-menu li a { display: block; font-family: 'Raleway', sans-serif; font-size: 15px; font-weight: 500; line-height: 20px; color: #171717; padding-top: 10px; padding-bottom: 10px; } } /* ================================================================== 5.0 Banner styles ================================================================== */ .bg-gradient-red { background: -moz-linear-gradient( 9deg, rgb(255,142,39) 0%, rgb(215,45,96) 100%); background: -webkit-linear-gradient( 9deg, rgb(255,142,39) 0%, rgb(215,45,96) 100%); background: -ms-linear-gradient( 9deg, rgb(255,142,39) 0%, rgb(215,45,96) 100%); } .banner { padding: 200px 0 100px; } .banner .heading { font-family: 'Raleway', sans-serif; font-weight: 500; font-size: 60px; color: #fefefe; margin-bottom: 27px; margin-top: 90px; } .banner .sub-heading { font-family: 'Open Sans', sans-serif; font-size: 16px; line-height: 28px; font-weight: 500; color: #fefefe; margin-bottom: 47px; } .banner .banner-thumb { text-align: center; } .banner .btn { font-family: 'Raleway', sans-serif; } /* ================================================================== 6.0 trending item styles ================================================================== */ .trending-news .trending-item { padding: 40px 30px 24px 30px; -webkit-transition: 0.3s ease-in-out; -moz-transition: 0.3s ease-in-out; transition: 0.3s ease-in-out; border: 1px solid #eeeeee; border-radius: 4px; } .trending-news .trending-item:hover { box-shadow: 2.5px 4.33px 10px 0px rgba( 0, 0, 0, 0.06); } .trending-news .trending-item i { font-size: 26px; color: #ff8e27; } .trending-news .trending-item .title { font-size: 18px; font-weight: 600; margin-bottom: 15px; } /* ================================================================== 7.0 download section styles ================================================================== */ .download-section .section-title .title { color: #fefefe; font-size: 48px; padding-bottom: 15px; } .download-section .section-title p { color: #fefefe; font-family: 'Open Sans', sans-serif; font-size: 18px; line-height: 30px; font-weight: 500; } .download-apps-pad { padding-top: 57px; padding-bottom: 100px; } /* ================================================================== 8.0 Video section styles ================================================================== */ .video-bg { background: url('../images/bg/bg-video.png'); background-size: cover; background-position: center center; } .video-section .overlay { padding: 196px 0 231px 0; } .video-section .overlay.bg-gradient-red { opacity: 0.85; } /* ================================================================== 9.0 features section styles ================================================================== */ .features-section .features-item { text-align: right; } .features-section .features-img img { display: flex; margin: 0 auto; } .features-item .media { padding-bottom: 48px; } .features-item .media i { font-size: 24px; color: #fefefe; height: 70px; width: 70px; text-align: center; line-height: 70px; border-radius: 50%; background: -moz-linear-gradient( -172deg, rgb(255,142,39) 0%, rgb(216,48,94) 100%, rgb(255,255,255) 100%, rgb(255,255,255) 100%, rgb(255,255,255) 100%); background: -webkit-linear-gradient( -172deg, rgb(255,142,39) 0%, rgb(216,48,94) 100%, rgb(255,255,255) 100%, rgb(255,255,255) 100%, rgb(255,255,255) 100%); background: -ms-linear-gradient( -172deg, rgb(255,142,39) 0%, rgb(216,48,94) 100%, rgb(255,255,255) 100%, rgb(255,255,255) 100%, rgb(255,255,255) 100%); } .features-item .media-body { padding-right: 30px; } .features-section .features-item .media-body .title { font-weight: 600; padding-bottom: 9px; font-size: 16px; color: #313131; font-family: 'Raleway', sans-serif; } .features-section .features-item-right { text-align: left; } .features-section .features-item-right .media-body { padding-right: 0; padding-left: 20px; } /* ================================================================== 10.0 screenshots section styles ================================================================== */ .screenshots-section { overflow: hidden; } /* ================================================================== 11.0 client section styles ================================================================== */ .client-section .client-details { box-shadow: 0px 0px 8px 1px rgba(0,0,0,0.2); text-align: center; padding: 30px 20px 13px 20px; background: #f9f9f9; } .client-section .client-details .thumb img { width: 150px; height: 150px; border-radius: 50%; background: -moz-linear-gradient( 0deg, rgb(255,140,39) 0%, rgb(215,45,96) 100%); background: -webkit-linear-gradient( 0deg, rgb(255,140,39) 0%, rgb(215,45,96) 100%); background: -ms-linear-gradient( 0deg, rgb(255,140,39) 0%, rgb(215,45,96) 100%); margin-bottom: 9px; display: inline-block; } .client-section .client-details .client-name { font-size: 20px; font-weight: 600; margin-bottom: 0; } .client-section .client-details .client-designation { font-size: 12px; font-weight: 500; margin-top: 7px; } .client-section .client-details .rating { padding-bottom: 18px; } .client-section .client-details .rating i { color: #ffcc00; } /* ================================================================== 1.0 client-syle-2 styles ================================================================== */ .client-section-2 .client-details { position: relative; border: 1px solid #e7e7e7; padding: 32px 30px 25px 65px; margin-right: 20px; margin-left: 50px; background: #fff; border-radius: 4px; } .client-section-2 .client-details .media-left { position: absolute; top: 50%; left: -45px; margin-top: -45px; } .client--2 .client-details .media-body { padding-left: 12px; } .client-section-2 .client-details .media-body .content { margin-bottom: 23px; } .client-section-2 .client-details .media-body .author { display: inline-block; } .client-section-2 .client-details .media-body .media-heading { margin-bottom: 5px; color: #313131; font-family: 'Montserrat', sans-serif; } .client-section-2 .client-details .media-body .designation { font-size: 12px; } .client-section-2 .client-details .rating { float: right; font-size: 18px; color: #3199de; } .client-slider { position: relative; } .client-slider .owl-controls { display: inline-block; position: absolute; left: 50%; margin-top: 30px; margin-left: -25px; } .client-slider .owl-controls .owl-dots { display: inline-flex; } .client-slider .owl-controls .owl-dots .owl-dot span { height: 12px; width: 12px; border-radius: 50%; font-size: 32px; background: #e1e1e1; margin: 0 5px; } .client-slider .owl-controls .owl-dots .owl-dot.active span { background: #e02a61; } /* ================================================================== 12.0 fact section styles ================================================================== */ .fun-fact-pad { padding-top: 64px; padding-bottom: 89px; } .our-team-section .team-img img{ display: flex; margin: 0 auto; } .fact-section.bg-fact { background-image: url('../images/bg/bg-factor.jpg'); background-size: cover; background-position: left 40%; } .fact-section .overlay { opacity: 0.85; } .fact-section .fact-details i { font-size: 35px; margin-bottom: 28px; color: #ffffff; } .fact-section .fact-details .fact-info { font-size: 16px; font-weight: 700; color: #ffffff; letter-spacing: 0.5px; } .fact-section .fact-details .fact-count { font-size: 30px; font-weight: 700; color: #ffffff; margin-top: 13px; } /* ================================================================== 13.0 pricing section styles ================================================================== */ .pricing-section .pricing-wrap { box-shadow: 0px 3px 30px 0px rgba(0, 0, 0, 0.07); text-align: center; padding-bottom: 50px; border-radius: 4px; } .pricing-section .pricing-wrap .pricing-title { color: #ffffff; background: -webkit-linear-gradient(18deg, rgb(255,142,39) 0%, rgb(215,46,96) 100%); background: -o-linear-gradient(18deg, rgb(255,142,39) 0%, rgb(215,46,96) 100%); background: linear-gradient(108deg, rgb(255,142,39) 0%, rgb(215,46,96) 100%); opacity: 0.80; font-size: 30px; font-weight: 600; padding: 30px 0; margin: 0; letter-spacing: 0.5px; border-radius: 4px 4px 0 0; } .pricing-section .pricing-wrap.active .pricing-title { opacity: 1; } .pricing-section .pricing-wrap .btn-signup { font-size: 14px; font-weight: 700; } .pricing-section .pricing-wrap.active .btn-signup { background: -moz-linear-gradient( 0deg, rgb(255,142,39) 0%, rgb(215,45,96) 100%); background: -webkit-linear-gradient( 0deg, rgb(255,142,39) 0%, rgb(215,45,96) 100%); background: -ms-linear-gradient( 0deg, rgb(255,142,39) 0%, rgb(215,45,96) 100%); color: #ffffff; } .pricing-section .pricing-wrap .table-price { margin-top: 36px; margin-bottom: 5px; color: #313131; } .pricing-section .pricing-wrap .table-price span { font-size: 24px; font-weight: 700; font-family: 'Raleway', sans-serif; } .pricing-section .pricing-wrap .table-price .main-balance { font-size: 40px; line-height: 40px; } .pricing-wrap ul li { font-size: 16px; padding-bottom: 4px; font-weight: 500; list-style: none; } .pricing-wrap ul { padding: 18px 0 29px 0; margin-left: 0 !important; } /* ================================================================== 14.0 App section styles ================================================================== */ .bg-app { background-image: url('../images/bg/bg-app.png'); background-size: cover; background-position: center center; } .apps-section { position: relative; color: #ffffff; } .apps-section .section-title .title { font-size: 48px; color: #ffffff; } .apps-section .section-title p { font-size: 16px; } .apps-section .apps-btn a { margin-right: 30px; } .apps-section .apps-btn a i { margin-right: 10px; } .apps-section .entry-content { z-index: 10; } .apps-section .entry-thumb { position: absolute; bottom: -160px; z-index: -10; } /* ================================================================== 15.0 blog section styles ================================================================== */ #blog .vc_column-inner { padding-top: 0; } .blog-section .blog-details img { width: 100%; } .blog-section .blog-details .blog-info { padding: 28px 20px 26px 20px; text-align: center; } .blog-details { box-shadow: 0px 3px 10px 0px rgba(171, 171, 171, 0.2); } .blog-details .blog-info .title { font-weight: 600; font-size: 18px; margin-bottom: 8px; } .blog-details .blog-info .title a { color: #313131; } .blog-details .blog-info span { font-size: 12px; padding-right: 9px; } .blog-details .blog-info p { padding-top: 20px; padding-bottom: 12px; } .blog-details .blog-info a { color: #ff8e27; padding-top: 15px; } /* ================================================================== 16.0 Contact section styles ================================================================== */ .contact-section { position: relative; } .contact-section .main-form { position: absolute; top: 11.5%; right: 10%; } .contact-section { position: relative; text-align: center; } .contact-section .contact-form .title { font-size: 24px; font-weight: 700; text-transform: uppercase; text-align: center; padding-bottom: 15px; margin-top: 5px; } .contact-section .contact-form { position: absolute; right: 10%; top: 85px; } .contact-form { width: 380px; background: #ffffff; box-shadow: 1px 3px 10px 0px rgba(171, 171, 171, 0.4); padding: 42px 50px; } .contact-form .form-control { box-shadow: none; border: 0; font-family: 'Open Sans', sans-serif; font-size: 14px; font-weight: 600; color: #606060; border-radius: 0; background: #f3f3f3; border: 1px solid #ebebeb; resize: none; } .contact-form .form-control:focus { box-shadow: none; } .contact-form .input-form { height: 40px; margin-bottom: 15px; } .contact-form a { margin-top: 30px; padding: 7px 30px; } /* ================================================================== 17.0 footer section styles ================================================================== */ .bg-footer { background-size: cover; background-position: center center; background-image: url('../images/bg/bg-footer.png'); } .footer-section .overlay.bg-gradient-red { padding-top: 95px; opacity: 0.9; } .footer-section .section-title .title { color: #ffffff; text-transform: uppercase; line-height: 40px; } .footer-section .form-group .input-group input::placeholder { font-weight: 600; font-size: 16px; } .form-group .input-group .input-group-addon button { padding: 13px 30px; border: 0; background: #444444; font-size: 16px; color: #ffffff; font-weight: 600; border-radius: 0 30px 30px 0; cursor: pointer; } .form-group .input-group .input-group-addon button:focus { box-shadow: none; outline: 0; } .footer-section .footer-logo .logo { font-size: 60px; color: #fefefe; padding-bottom: 42px; } .footer-section .footer-bottom { padding-top: 85px; color: #fefefe; padding-bottom: 30px; font-size: 16px; font-family: 'Raleway', sans-serif; } .footer-section .subscribe { margin-bottom: 59px; } .footer-section .subscribe .form-control { height: 51px; padding: 0 30px; border-radius: 25px 0 0 25px; font-family: 'Open Sans', sans-serif; font-size: 16px; font-weight: 600; border: 0; } .footer-section .subscribe .form-control:focus { outline: none; box-shadow: none; } .footer-section .subscribe .input-group-addon { padding: 0; border: 0; border-radius: 0 25px 25px 0; } .footer-section .subscribe .input-group-addon { background: transparent !important; } .footer-section .subscribe .btn-subscribe { border: 0; padding: 17.5px 34px; border-radius: 0 25px 25px 0; font-family: 'Open Sans', sans-serif; font-size: 16px; font-weight: 600; color: #ffffff; text-transform: uppercase; -webkit-transition: all .3s ease; -moz-transition: all .3s ease; transition: all .3s ease; } .footer-section-two .footer-bottom { background: -moz-linear-gradient( 9deg, rgb(255,142,39) 0%, rgb(215,45,96) 100%); background: -webkit-linear-gradient( 9deg, rgb(255,142,39) 0%, rgb(215,45,96) 100%); background: -ms-linear-gradient( 9deg, rgb(255,142,39) 0%, rgb(215,45,96) 100%); text-align: center; font-size: 16px; margin: 0; padding-top: 35px; padding-bottom: 30px; } .footer-section-two .widget-recent-post .media .media-left { width: 26%; } .footer-section .section-title { margin-bottom: 32px; } /*add new */ /* ================================================================== 18.0 slider item styles ================================================================== */ .slider-section { overflow: hidden; padding: 45px 0 45px 0; color: #fefefe; } .slider-section .title { font-size: 60px; font-weight: 700; padding: 100px 0 0 0; } .slider-section .subtitle { font-size: 60px; font-weight: 700; } .slider-section h2 { color: #fefefe; } .slider-section p { font-size: 16px; font-weight: 600; margin: 30px 0 57px 0; } /* ================================================================== 19.0 team section styles ================================================================== */ .author-details { border-top: 6px solid #eb5f42; border-radius: 4px; } .author-details .author-info { background: #ffffff; padding: 31px 35px 27px 35px; } .author-details .author-info img { background: -moz-linear-gradient( 0deg, rgb(255,140,39) 0%, rgb(215,45,96) 100%); background: -webkit-linear-gradient( 0deg, rgb(255,140,39) 0%, rgb(215,45,96) 100%); background: -ms-linear-gradient( 0deg, rgb(255,140,39) 0%, rgb(215,45,96) 100%); border-radius: 50%; display: inline-block; } .author-details .author-info h4 { font-size: 18px; margin-bottom: 3px; padding-top: 18px; font-weight: 600; } .author-details .author-info p { padding: 20px 0 11px 0; } .author-details .author-info span { font-size: 12px; } .author-details .author-info a { color: #f58725; } .author-details .author-social-area { background-image: -moz-linear-gradient( 0deg, rgb(255,142,39) 0%, rgb(215,45,96) 100%); background-image: -webkit-linear-gradient( 0deg, rgb(255,142,39) 0%, rgb(215,45,96) 100%); background-image: -ms-linear-gradient( 0deg, rgb(255,142,39) 0%, rgb(215,45,96) 100%); border-radius: 0 0 4px 4px; } .author-details .author-social-area ul { list-style: none; display: inline-flex; margin: 0 auto; padding: 10px 0; margin-left: 0 !important; } .author-details .author-social-area ul li { list-style: none; } .author-details ul li a { color: #ffffff; padding: 0 12.5px; -webkit-transition: all .3s ease; -moz-transition: all .3s ease; transition: all .3s ease; } .author-details ul li a:hover { color: #444444; } /* ================================================================== 20.0 testimonial section styles ================================================================== */ .testimonial-slider .item { text-align: center; margin-top: 30px; } .testimonial-slider .item p { box-shadow: 0px 0px 10px 3px rgba(171, 171, 171, 0.5); padding: 30px 35px 70px 35px; position: relative; margin: 0 13px; border-radius: 4px; } .testimonial-slider .item img { position: absolute; margin-top: -42.5px; left: 50%; height: 85px; width: 85px; border-radius: 50%; margin-left: -42.5px; } .testimonial-slider .item .name { margin-top: 58px; font-size: 18px; font-weight: 600; margin-bottom: 2px; } .testimonial-slider .item .designation { font-size: 13px; } .testimonial-slider .owl-prev { position: absolute; left: -100px; top: 50%; margin-top: -64px !important; height: 55px; width: 55px; border-radius: 50% !important; font-size: 30px !important; line-height: 48px; text-align: center; background-image: -moz-linear-gradient( -172deg, rgb(255,142,39) 0%, rgb(215,46,96) 100%) !important; background-image: -webkit-linear-gradient( -172deg, rgb(255,142,39) 0%, rgb(215,46,96) 100%) !important; background-image: -ms-linear-gradient( -172deg, rgb(255,142,39) 0%, rgb(215,46,96) 100%) !important; } .testimonial-slider .owl-prev i { margin-left: -5px; } .testimonial-slider .owl-next { position: absolute; right: -100px; top: 50%; margin-top: -64px !important; height: 55px; width: 55px; border-radius: 50% !important; background: #f98a45 !important; font-size: 30px !important; line-height: 48px; text-align: center; background-image: -moz-linear-gradient( -172deg, rgb(215,46,96) 0%, rgb(255,142,39) 100%) !important; background-image: -webkit-linear-gradient( -172deg, rgb(215,46,96) 0%, rgb(255,142,39) 100%) !important; background-image: -ms-linear-gradient( -172deg, rgb(215,46,96) 0%, rgb(255,142,39) 100%) !important; } .testimonial-slider .owl-next i { margin-right: -5px; } /* ================================================================== 21.0 breadcrumb section styles ================================================================== */ .page-title { overflow: hidden; text-align: center; padding: 155px 0 97px 0; } .page-title .title { font-size: 60px; font-weight: 700; color: #ffffff; padding-bottom: 5px; word-break: break-all; line-height: 72px; word-break: break-word; } .page-title .breadcrumb { background: none; display: inline-block; margin: 0 auto; padding: 0; margin-left: 0 !important; } .page-title .breadcrumb li { display: inline-block; color: #ffffff; text-transform: uppercase; word-break: break-all; font-family: 'Raleway', sans-serif; font-size: 14px; } .page-title .breadcrumb li a { color: #ffffff; text-transform: uppercase; font-family: 'Raleway', sans-serif; font-size: 14px; font-weight: 500px; } .page-title .breadcrumb li::before { color: #ffffff; } /* ================================================================== 22.0 blog section styles ================================================================== */ .main-blog-section { overflow: hidden; } .main-blog-section .blog-post { box-shadow: 0px 3px 17px 0px rgba(171, 171, 171, 0.2); margin-bottom: 40px; } .main-blog-section .blog-post img { max-width: 100% !important; } .main-blog-section .blog-post .post-details { padding: 16px 30px 27px 30px; } .main-blog-section .blog-post .post-details .post-title { font-size: 18px; font-weight: 600; margin-bottom: 0px; word-break: break-all; line-height: 26px; text-transform: uppercase; } .main-blog-section .blog-post .post-details .post-title a { color: #313131; } .main-blog-section .blog-post .post-details .read-more { color: #ff8e27; } .post-info { list-style: none; margin: 0px !important; padding: 0; display: flex; } .post-info li { list-style: none; } .post-info li i { padding-right: 7px; } .post-info li span { padding: 0 20px; color: #606060; } .post-info .date { color: #ff8e27; } .post-details p { margin: 0; padding: 23px 0 23px 0; word-break: break-all; } .page-navigation { display: flex; margin-top: 45px; } .page-navigation .pagination { margin: 0 auto; } .page-navigation .pagination li a { height: 40px; width: 40px; border: 1px solid #e6e6e6; border-radius: 50%; text-align: center; line-height: 26px; margin: 0 7.5px; float: left; } .page-navigation .pagination li a:hover, .page-navigation .pagination li a:focus { box-shadow: 0px 0px 3px 3px rgba(171, 171, 171, 0.2); background: none; color: #ff8e27; } .page-navigation .pagination .pagination-arrow a, .page-navigation .pagination .pagination-arrow a { border: 0; } .page-navigation .pagination .pagination-arrow a:hover, .page-navigation .pagination .pagination-arrow a:focus { box-shadow: none; } /* ================================================================== 23.0 widget section styles ================================================================== */ .widget-search .input-group input { width: 100%; background: #f1f1f1; border: 0; padding: 0 20px; font-weight: 500; height: 50px; } .widget-search .input-group .input-group-addon { border: 0; border-radius: 0; background: #f1f1f1; position: relative; padding: 0; } .widget-search .input-group .input-group-addon:before { position: absolute; background: #c7c7c7; content: ""; height: 40px; width: 1px; left: 0; top: 50%; margin-top: -20px; } .widget-search .input-group .input-group-addon button { line-height: 0; border: 0; padding: 17px; cursor: pointer; background: transparent; } .widget-search .input-group .input-group-addon button i { color: #606060; } .widget-search .input-group .input-group-addon button:focus { outline: 0; } .widget-title .title { font-size: 22px; margin-bottom: 20px; position: relative; font-weight: 600; } .widget-title .title:after { position: absolute; content: ""; background: #f1f1f1; height: 1px; width: 70px; top: 50%; right: 0; } .widget-catagory .catagory-items { list-style: none; margin: 0; padding: 0; } .widget-catagory .catagory-items li { padding-bottom: 7px; } .widget-recent-post .media { margin-bottom: 25px; } .widget-recent-post .media .media-left { width: 32%; } .widget-recent-post .media .media-body { padding-left: 5px; } .widget-recent-post .media .media-body .title { font-size: 18px; margin-bottom: 20px; font-weight: 600; margin-top: 0; } .widget-recent-post .media .media-body .title a { color: #313131; } .widget-tags .tag-list a { border: 1px #e1e1e1 solid; padding: 3px 13px; border-radius: 3px; display: inline-block; margin: 0 8px 12px 0; font-size: 12px; } /* ================================================================== 24.0 single-blog section styles ================================================================== */ .single-blog { overflow: hidden; word-break: break-word; } .single-blog .post-info { display: inherit; margin-bottom: 18px !important; padding-left: 1px; } .single-blog .post-info li { display: initial; } .single-blog .post-info li a:hover { color: #ff8e27; } .author-area .media .media-body .author-social, .post-share { list-style: none; margin: 0; padding: 0; display: inline-flex; } .author-area .media .media-body .author-social li, .post-share li { padding-right: 20px; } .author-area .media .media-body .author-social li a:hover, .author-area .media .media-body .author-social li a:focus, .post-share li a:hover, .post-share li a:focus { color: #ff8e27; } .blog-quote { position: relative; background: #f1f1f1; font-style: italic; font-size: 16px; padding: 20px 45px; margin: 43px 0; } .blog-quote:before { content: ''; position: absolute; height: 60px; width: 4px; top: 50%; left: 25px; margin-top: -30px; background: #ff9600; } /* |---------------------------- | Comments |---------------------------- */ .comment-respond { display: flow-root; width: 100%; } .comment-check { overflow: hidden; padding: 36px 0 10px 0; } .comment-check .right, .comment-check .left { position: relative; text-transform: capitalize; } .comment-check .right:hover, .comment-check .left:hover { color: #ff9600; } .comment-check .left:hover.left:after, .comment-check .right:hover.right:after { background: #ff9600; } .comment-check .right:after, .comment-check .left:after { content: ''; position: absolute; height: 1px; width: 88px; background: #e1e1e1; left: 0; bottom: -7px; } .author-area { margin-top: 50px; box-shadow: 0px 0px 7px 5px rgba(171, 171, 171, 0.2); } .author-area .media { padding: 30px; } .author-area .media img { border-radius: 50%; } .author-area .media .media-left { width: 15%; } .author-area .media .media-body { margin-left: 30px; } .author-area .media .media-body p { margin: 20px 0 0 0; } .author-area .media .media-body .author-name { font-weight: 600; color: #ff9600; } .author-area .media .media-body .author-designation { font-size: 10px; line-height: 10px; } .comments-area { margin: 40px 0 0 0; } .comment-title { font-size: 24px; font-weight: 600; margin: 0 0 28px 0; } .comments-area .media img { border-radius: 50%; margin-right: 18px; } .comments-area .media { margin-top: 30px; } .comments-area .media .media-left { width: 8%; } .comments-area .media .media-body { padding: 0 0 18px 0; border-bottom: 1px #e1e1e1 solid; } .comments-area .media .media-body .name { margin-bottom: 10px; font-size: 18px; margin-top: 0; } .comments-area .media .media-body .time { font-style: italic; } .comments-area .media .media-body .comments { margin: 30px 0 20px 0; } .comments-area .media .media-body .reply { color: #ff9600; } .comments-area .media .media-body .reply i { margin-right: 7px; } .comments-form .comment-title { margin: 45px 0 30px 0; } .comments-form .input { width: 48%; border: 0; background: #f3f3f3; height: 50px; font-size: 18px; padding-left: 20px; } .comments-form .message { width: 100%; border: 0; background: #f3f3f3; font-size: 18px; margin: 20px 0 0px 0; padding: 20px 0 0 20px; } /* ================================================================== 25.0 Preloader styles ================================================================== */ .preloader-wrap { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: #ffffff; z-index: 999999; } #preloader { height: 40px; width: 40px; position: absolute; top: 50%; left: 50%; margin-top: -20px; margin-left: -20px; } #preloader:before { content: ""; display: block; position: absolute; left: -1px; top: -1px; height: 100%; width: 100%; -webkit-animation: rotation 1s linear infinite; animation: rotation 1s linear infinite; border: 1px solid #ff8d28; border-top: 1px solid transparent; border-radius: 100%; } #preloader > .icon { position: absolute; top: 50%; left: 50%; height: 25px; width: 10.6px; margin-top: -12.5px; margin-left: -5.3px; -webkit-animation: wink 1s ease-in-out infinite alternate; animation: wink 1s ease-in-out infinite alternate; } @media only screen and (min-width: 768px) { #preloader { height: 60px; width: 60px; margin-top: -30px; margin-left: -30px; } #preloader:before { left: -2px; top: -2px; border-top-width: 2px; border-left-width: 2px; border-bottom-width: 2px; border-right-width: 2px; } #preloader > .icon { height: 37.5px; width: 15.9px; margin-top: -18.75px; margin-left: -7.95px; } } @media only screen and (min-width: 1200px) { #preloader { height: 80px; width: 80px; margin-top: -40px; margin-left: -40px; } #preloader > .icon { height: 50px; width: 21.2px; margin-top: -25px; margin-left: -10.6px; } } @-webkit-keyframes rotation { from { -webkit-transform: rotate(0deg); transform: rotate(0deg); } to { -webkit-transform: rotate(359deg); transform: rotate(359deg); } } @keyframes rotation { from { -webkit-transform: rotate(0deg); transform: rotate(0deg); } to { -webkit-transform: rotate(359deg); transform: rotate(359deg); } } @-webkit-keyframes wink { from { opacity: 0; } to { opacity: 1; } } @keyframes wink { from { opacity: 0; } to { opacity: 1; } } /* |----------------------- | Cover Text |----------------------- */ .wp-block-cover-text strong { color: #fff; } .has-pale-pink-background-color.has-pale-pink-background-color { background-color: #000; } .wp-block-pullquote.is-style-solid-color blockquote p, .wp-block-pullquote blockquote p { font-size: 17px; } .has-large-font-size { font-size: 36px; line-height: inherit; text-align: center; } p { line-height: inherit; } figure.wp-block-audio audio { margin: 30px 0; } .wp-block-file { margin: 1.5em 0; } .wp-block-media-text.alignfull.has-media-on-the-right.is-stacked-on-mobile figure.wp-block-media-text__media img { margin: 0; } figure.wp-block-media-text__media img { margin: 0; } .wp-block-media-text.has-media-on-the-right .wp-block-media-text__content p { line-height: inherit; font-size: 25px; } .wp-block-media-text__content .has-large-font-size { text-align: left; }