/* Architectuur Land HTML5 Template */
/************ TABLE OF CONTENTS ***************
1. Import Files
2. Reset
3. Global
4. Section style
5. Divider style
6. Main Header style
7. About style One
8. Work Time Secction
9. Gallery style
10. Service Section
11. FAQ Section
12. Pricing Section
13. Team style
14. BLog Section
15. Contact Section
16. Sidebar
17. Main Footer
18. Menu style Two
19. Testimonials style Two
20. Sponsors Slider Style
21. Menu style Three
22. Features style One
23. Testimonials style Two
24. Gallery Section
25. Featured Menu Style
26. Gallery Single Item
27. Map Section Style
28. 404 Section Style
1.Import Files
**********************************************/
@import url('https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700');
@import url('owl.carousel.css');
@import url('owl.theme.css');
@import url('owl.transitions.css');
@import url('font-awesome.css');
@import url('magnific-popup.css');
@import url('animate.css');
@import url('jquery.fancybox.css');
@import url('hover.css');
@import url('stroke-gap-icons.css');
@import url('et-line.css');
@import url('flaticon.css');
@import url('icofont.css');
/***
====================================================================
2.Reset
====================================================================
***/
* {
margin:0px;
padding:0px;
border:none;
outline:none;
}
/***
====================================================================
3.Global Settings
====================================================================
***/
nav.navbar.bootsnav.navbar-fixed{z-index:9999;}
body {
color: #d8d3d3;
font-family: "Poppins",sans-serif;
font-weight: 400;
// letter-spacing: 0.025em;
// line-height: 1.7;
line-height: 1.6;
font-size: 14px;
background-size:cover;
background-repeat:no-repeat;
background-position:center top;
-webkit-font-smoothing: antialiased;
overflow-x: hidden;
}
h1 {
font-size: 2.571em;
}
h2 {
color: #000;
font-size: 2.571rem;
font-weight: 600;
letter-spacing: 0;
line-height: 1.166;
}
h3 {
font-size: 1.714em
}
h4 {
font-size: 1.286em;
letter-spacing: 0.3px;
}
h5 {
font-size: 1.143em;
letter-spacing: 0.5px;
}
h6 {
font-size: 12px;
color: #969696;
font-weight: 300 !important;
line-height: 0;
}
h1,h2,h3,h4,h5,h6 {
position:relative;
margin:0px;
font-weight: 600;
background:none;
line-height:1.6em;
}
a{
text-decoration:none;
cursor:pointer;
color:#a59f9f;
}
a:hover,a:focus{
text-decoration:none;
outline:none;
color: #cee002;
transition:all 500ms ease;
-moz-transition:all 500ms ease;
-webkit-transition:all 500ms ease;
-ms-transition:all 500ms ease;
-o-transition:all 500ms ease;
}
input,button,select,textarea{
font-family: "Poppins",sans-serif;
}
ul,li{
list-style:none;
padding:0px;
margin:0px;
}
.border-1px {
border: 1px solid #eee;
}
.img-fullwidth {
width: 100%;
}
.color-333 {
color: #333;
}
.bg-color-f8 {
background-color: #f8f8f8;
}
.bg-color-f1 {
background-color: #f1f1f1;
}
.bg-color-f {
background-color: #fff;
}
.text-theme-color {
color: #cee002;
}
.text-white {
color: #FFF !important;
}
.preloader {
position:fixed;
left:0px;
top:0px;
width:100%;
height:100%;
z-index:999999;
background-color:#ffffff;
background-position:center center;
background-repeat:no-repeat;
background-image:url(../images/icons/preloader.html);
}
.default-theme-color {
background:#cee002;
}
.img-responsive {
display: inline-block;
}
.icon-box i {
display: inline-block;
font-size: 40px;
transition: all 0.3s ease 0s;
}
.bg-light-gray {
background: #d3d3d3;
}
.font-b {
font-weight: bold;
}
.border-bottom a {
border-bottom: 1px solid #5a5856;
display: block;
margin-bottom: 10px;
padding-bottom: 10px;
}
.white-link a {
color: #FFF;
}
.white-link li:hover a{
color: #cee002;
}
.border-1 {
width: 100%;
height: 1px;
background-color: #eee;
margin-top: 20px;
margin-bottom: 5px;
}
.border-2 {
border: 2px solid #eee;
}
.gray-color {
color: #c0c0c0;
}
.font-n {
font-weight: normal !important;
}
.cs-about-video .cs-play-icone {
height: 64px;
left: 0;
margin: auto;
padding-top: 14px;
position: absolute;
right: 0;
text-align: center;
top: 42%;
width: 64px;
}
.cs-play-icone .icon {
font-size: 60px;
}
/***
====================================================================
4.Background Video
====================================================================
***/
.video-section .pattern-overlay {
background-color: rgba(15, 38, 58, 0.6);
min-height: 700px;
padding: 110px 0 32px;
}
.video-section h1 {
font-size: 60px;
font-weight: bold;
line-height: 1.2em;
margin: 40px auto 0;
text-shadow: 1px 1px 1px #000;
text-transform: uppercase;
}
.video-section h3 {
font-size: 25px;
font-weight: lighter;
margin: 0 auto 15px;
}
.video-section h1, .video-section h3 {
color: #fff;
text-align: center;
}
.video-section .buttonBar {
display: none;
}
.player {
font-size: 1px;
}
/***
====================================================================
4.Section title style
====================================================================
***/
.container,
.container-fluid{
padding-top: 70px;
padding-bottom: 70px;
}
.onepage .container,
.onepage .container-fluid{
padding-top: 120px;
padding-bottom: 120px;
}
/*===============
Dark css
==================*/
body.bg-light {
background: #222 none repeat scroll 0 0;
}
.section-title {
padding-bottom: 50px;
}
.section-title span {
color: #cee002;
}
.section-title h6 {
text-transform: uppercase;
letter-spacing: 6.9px;
}
.section-title h2 {
text-transform: uppercase;
letter-spacing: 0.5px;
font-weight: bold;
}
.section-title-icon {
display: block;
}
.section-title-icon::after, .section-title-icon::before {
border-bottom: 1px solid #cee002;
content: "";
display: inline-block;
height: 1px;
margin-top: 0;
vertical-align: middle;
width: 100px;
}
.section-title-icon i {
color: #cee002;
display: inline-block;
margin: 0 10px 0 15px;
font-size: 28px;
vertical-align: middle;
}
/***
====================================================================
5.Divider style
====================================================================
***/
.overlayer,
.overlayer-black,.overlayer-light,.default-overlay,.overlay-green,.overlay-green-deep {
position: relative;
background-size: cover;
background-attachment: fixed;
background-repeat: repeat-y;
background-position: top center;
}
.overlayer-black::before {
background-color: rgba(0, 0, 0, 0.85);
content: " ";
height: 100%;
left: 0;
position: absolute;
top: 0;
width: 100%;
z-index: 0;
}
.overlayer::before,.default-overlay::before,.overlay-green::before,.overlayer-light {
content: " ";
height: 100%;
left: 0;
position: absolute;
top: 0;
width: 100%;
z-index: 0;
}
.default-overlay::before {
background-color: rgba(206, 224, 2, 0.85)!important;
}
.overlay-green::before {
background-color: rgba(246,138,21, 0.5);
}
.overlay-green-deep::before {
background-color: rgba(246,138,21, 0.8);
}
.overlayer-light::before {
background-color: rgba(102, 102, 102, 0.8);
}
/***
====================================================================
6.Scroll To Top style
====================================================================
***/
.scroll-to-top{
position:fixed;
bottom:15px;
right:15px;
width:40px;
height:40px;
color:#cee002;
font-size:18px;
font-weight:700;
text-transform:uppercase;
border:1px solid #cee002;
line-height:34px;
text-align:center;
z-index:100;
cursor:pointer;
border-radius:0;
display:none;
-webkit-transition:all 300ms ease;
-ms-transition:all 300ms ease;
-o-transition:all 300ms ease;
-moz-transition:all 300ms ease;
transition:all 300ms ease;
}
.scroll-to-top:hover{
color:#ffffff;
background:#cee002;
border: 0;
}
/*--------------------------------------------------------------
#0.4 hero slider
--------------------------------------------------------------*/
.hero {
position: relative;
height: 80vh;
/** slider arrow **/
/** slider dots **/
}
.hero .slide {
height: 80vh;
background-repeat: no-repeat;
position: relative;
}
.hero .slide > img {
display: none;
}
.hero .slide:before {
content: "";
background-color: rgba(0, 0, 0, 0.7);
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
}
.hero .slide .title {
width: 100%;
text-align: center;
color: #fff;
text-transform: uppercase;
position: absolute;
left: 0;
top: 50%;
z-index: 111;
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-o-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
}
.hero .slide .title span {
display: block;
font-size: 2vmin;
letter-spacing: 5px;
opacity: 0;
color: #cee002;
}
.hero .slide .title h1 {
font-size: 5.75vmin;
font-weight: 600;
line-height: 1.2em;
color: #fff;
margin: 0.1em 0 0.2em;
opacity: 0;
}
@media screen and (min-width: 992px) {
.hero .slide .title h1 {
letter-spacing: 4px;
}
}
@media (max-width: 767px) {
.hero .slide .title h1 {
font-size: 13.75vmin;
margin: 0.3em 0 0.5em;
}
}
.hero .slide .title .theme-btn {
width: 150px;
position: relative;
z-index: 100;
opacity: 0;
}
@media (max-width: 767px) {
.hero .slide .title .theme-btn {
width: 120px;
padding-bottom: 13px;
}
}
#kenburning {
position: relative;
min-height: 700px;
}
#kenburning:before {
content: '';
position: absolute;
background: rgba(0, 0, 0, 0.8);
top: 0;
height: 100%;
width: 100%;
z-index: 11;
}
.slider-text {
position: absolute;
z-index: 111;
text-transform: uppercase;
top: 30%;
left: 0;
right: 0;
}
.boxed-layout .slider-text {
top: 7%;
}
.slider-text h2 {
color: #FFf;
font-size: 4rem;
}
// .hero .hero-slider .owl-stage .active span {
// -webkit-animation: slideInDown 1s 0.5s forwards;
// animation: slideInDown 1s 0.5s forwards;
// }
// .hero .hero-slider .owl-stage .active h1 {
// -webkit-animation: slideInDown 1s 1.1s forwards;
// animation: slideInDown 1s 1.1s forwards;
// }
// .hero .hero-slider .owl-stage .active .theme-btn {
// -webkit-animation: slideInDown 1s 1.5s forwards;
// animation: slideInDown 1s 1.5s forwards;
// }
.hero .hero-slider .owl-stage .active span,
.hero .hero-slider .owl-stage .active h1,
.hero .hero-slider .owl-stage .active .theme-btn {
opacity: 1;
}
.hero .hero-slider .owl-nav {
width: 100%;
position: absolute;
top: 60%;
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-o-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
}
.hero .hero-slider .owl-nav .owl-prev,
.hero .hero-slider .owl-nav .owl-next {
background-color: #cee002;
width: 69px;
height: 79px;
line-height: 79px;
text-align: center;
font-size: 18px;
padding: 0;
position: absolute;
left: 0;
border: 1px solid #cee002;
-webkit-border-radius: 0;
-moz-border-radius: 0;
-o-border-radius: 0;
-ms-border-radius: 0;
border-radius: 0;
-webkit-transition: all 0.1s;
-moz-transition: all 0.1s;
-o-transition: all 0.1s;
-ms-transition: all 0.1s;
transition: all 0.1s;
}
.hero .hero-slider .owl-nav .owl-prev:hover,
.hero .hero-slider .owl-nav .owl-next:hover {
background-color: transparent;
border-color: #fff;
}
@media (max-width: 991px) {
.hero .hero-slider .owl-nav .owl-prev,
.hero .hero-slider .owl-nav .owl-next {
width: 49px;
height: 59px;
line-height: 59px;
}
}
@media (max-width: 767px) {
.hero .hero-slider .owl-nav .owl-prev,
.hero .hero-slider .owl-nav .owl-next {
display: none !important;
}
}
.hero .hero-slider .owl-nav .owl-next {
left: auto;
right: 0;
}
.hero .hero-slider .owl-controls {
margin: 0;
padding: 0;
}
.hero .hero-slider .owl-dots {
position: relative;
bottom: 50px;
}
.hero .hero-slider .owl-dots .owl-dot {
margin-right: 5px;
}
.hero .hero-slider .owl-dots .owl-dot span {
background-color: #fff;
width: 18px;
height: 18px;
margin: 0;
border: 2px solid #fff;
-webkit-border-radius: 0;
-moz-border-radius: 0;
-o-border-radius: 0;
-ms-border-radius: 0;
border-radius: 0;
}
@media (max-width: 767px) {
.hero .hero-slider .owl-dots .owl-dot span {
width: 13px;
height: 13px;
border: 1px solid #fff;
}
}
.hero .hero-slider .owl-dots .active span {
background-color: #cee002;
}
.btn-send,
.btn-success.disabled {
background: #cee002;
border-color: #cee002;
}
.btn-send:hover {
background-color: #38ACC9;
border-color: #cee002;
}
.btn-border {
border: 2px solid #cee002;
padding: 9px 25px;
margin-top: 20px;
}
.btn-border:hover {
opacity: 0.7;
}
.btn-border-black {
border-color: #000;
}
.border-r-n {
border-radius: 0;
}
/*
-----------------------------------------------------------------------
Home Slider Styles
-----------------------------------------------------------------------
*/
.home-section {
background-image: url(../images/bg/1.html);
}
.home-section .home-content {
height: 100%;
min-height: 600px;
padding-top: 12%;
text-align: center;
width: 50%;
}
.home-section .home-content .title {
color: #fff;
font-weight: 700;
line-height: 65px;
text-transform: uppercase;
}
.home-section .home-content span {
color: #fff;
}
.main-slider {
position:relative;
background:none;
}
.main-slider h1 {
font-size: 5.75vmin;
font-weight: 600;
line-height: 1.2em;
color: #fff;
letter-spacing: 4px;
text-transform: uppercase;
}
.main-slider h2 {
line-height:1.4em;
font-size:48px;
}
.main-slider h3 {
line-height:2em;
font-size:32px;
}
.main-slider .slide-text {
font-size:20px;
font-style:italic;
}
.main-slider .slide-text p {
color: #fff;
font-size:24px;
font-weight: 600;
}
.main-slider span {
color: #fff;
font-size: 2vmin;
padding: 6px 25px;
letter-spacing: 5px;
color: #cee002;
}
.main-slider .slide-psm {
font-size: 4.75vmin;
padding: 6px 22px;
}
.main-slider .btn-theme,
.main-slider .btn-theme.btn-black:hover {
border: 1px solid;
color: #fff;
}
.main-slider .btn-theme:hover,
.main-slider .btn-theme.btn-black {
background-color: #111;
border: 1px solid #111;
color: #fff;
}
.main-slider .tp-banner .slotholder:after {
background: rgba(0, 0, 0, 0.49);
content: "";
height: 100%;
left: 0;
pointer-events: none;
position: absolute;
top: 0;
width: 100%;
}
.tp-bullets.preview4 .bullet {
border-color:#202020 !important;
}
.main-slider .tp-bullets.preview4 .bullet {
background: rgba(255, 255, 255, 1) !important;
border: 5px solid !important;
box-shadow: none;
height: 6px !important;
width: 6px !important;
}
.main-slider .tp-bullets.preview4 .bullet:hover,
.main-slider .tp-bullets.preview4 .bullet.selected {
background: rgba(255, 255, 255, 1) !important;
border: 5px solid rgba(0, 0, 0, 1) !important;
}
/***
====================================================================
7.Main Header style
====================================================================
***/
.navbar-brand {
height: auto;
}
nav.navbar.bootsnav .navbar-toggle {
background-color: transparent;
font-size: 25px;
top: 17px;
left: 10px;
}
nav.navbar.bootsnav {
z-index: 111;
background-color: #000;
-webkit-transition:all 500ms ease;
-ms-transition:all 500ms ease;
-o-transition:all 500ms ease;
-moz-transition:all 500ms ease;
transition:all 500ms ease;
border: none;
}
nav.navbar.navbar-inverse.bootsnav.navbar-transparent.dark .attr-nav,
nav.navbar.bootsnav.navbar-transparent.dark .attr-nav {
border: none;
margin-left: 0;
}
nav.navbar.bootsnav ul.nav > li > a {
font-weight: normal;
text-transform: uppercase;
color: #FFF;
// padding: 32px 15px;
}
@media (max-width: 992px) {
nav.navbar.bootsnav .dropdown .megamenu-content .col-menu ul > li > a ,
nav.navbar.bootsnav ul.nav li.dropdown ul.dropdown-menu > li > a,
nav.navbar.bootsnav .dropdown .megamenu-content .col-menu .title{
border-bottom: 1px solid #222;
}
nav.navbar.bootsnav ul.dropdown-menu.megamenu-content .col-menu {
border-left: 1px solid #222;
border-right: 1px solid #222;
}
nav.navbar.bootsnav li.dropdown ul.dropdown-menu > li > a {
border-bottom: 1px solid #222;
}
nav.navbar.bootsnav .navbar-nav > li > a {
border-bottom: 1px solid #222;
border-top: 1px solid #222;
}
}
nav.navbar.bootsnav ul.dropdown-menu.megamenu-content .col-menu {
border-left: 1px solid #222;
border-right: 1px solid #222;
}
nav.navbar.bootsnav li.dropdown ul.dropdown-menu > li > a {
border-bottom: 1px solid #222;
}
nav.navbar.bootsnav ul.nav.navbar-right .dropdown-menu .dropdown-menu {
left: 200px;
}
nav.navbar.bootsnav ul.navbar-right li.dropdown ul.dropdown-menu li.dropdown > a.dropdown-toggle::before {
content: "";
float: right;
font-family: "FontAwesome";
margin-top: 0;
}
nav.navbar.bootsnav ul.navbar-right li.dropdown ul.dropdown-menu li a {
text-align: left;
}
@media (max-width: 992px) {
nav.navbar.bootsnav ul.nav.navbar-right .dropdown-menu .dropdown-menu {
left: auto;
}
}
nav.bootsnav .megamenu-content .title {
margin-bottom: 15px;
}
nav.navbar.bootsnav li.dropdown ul.dropdown-menu > li a:hover,
nav.navbar.bootsnav li.dropdown ul.dropdown-menu > li a:hover,
nav.navbar.bootsnav ul.dropdown-menu.megamenu-content .content ul.menu-col li:hover a {
color: #cee002;
}
nav.navbar.bootsnav li.dropdown ul.dropdown-menu .title {
color: #cee002;
}
nav.navbar.bootsnav li.dropdown ul.dropdown-menu > li > a {
padding: 15px;
}
nav.navbar.bootsnav ul.dropdown-menu.megamenu-content .content ul.menu-col li a {
padding: 10px 0;
}
nav.navbar.bootsnav li.dropdown ul.dropdown-menu {
border-color: currentcolor;
}
nav.navbar.bootsnav li.dropdown ul.dropdown-menu > li > a,nav.navbar.bootsnav ul.dropdown-menu.megamenu-content .content ul.menu-col li a {
color: #ccc;
}
.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:focus,
.navbar-default .navbar-nav > .active > a:hover {
color: #cee002;
}
nav.navbar.navbar-inverse.bootsnav.navbar-transparent.bg-dark,
nav.navbar.bootsnav.navbar-transparent.bg-dark {
background: rgba(0, 0, 0, 1);
}
.boxed-layout nav.navbar.bootsnav.navbar-fixed {
width: auto;
}
.boxed-layout .attr-nav {
margin-right: 0;
}
header .topbar,nav.navbar.bootsnav li.dropdown ul.dropdown-menu {
background: rgba(0, 0, 0, 0.9) none repeat scroll 0 0;
}
.social-links {
overflow: hidden;
float: right;
}
.social-links li {
float: left;
width: 43px;
height: 50px;
margin-right: 1px;
}
.social-links li a {
width: 43px;
height: 50px;
line-height: 50px;
display: block;
color: #666666;
text-align: center;
}
.social-links li a:hover {
background-color: #cee002;
color: #fff !important;
}
/***
====================================================================
8.Slider Style
====================================================================
***/
.slider-title {
font-size: 72px;
color: #FFF;
line-height: 80px;
}
.main-title {
font-size: 180px;
color: #FFF;
opacity: 0.15;
text-transform: uppercase;
line-height: 48px;
}
.slider-btn {
color: #fff !important;
font-size: 13px;
border-radius: 5px;
background-color: #333;
padding: 10px 20px;
text-transform: uppercase;
}
.slider-btn:hover {
color: #333 !important;
background-color: #cee002;
-webkit-transition:all 500ms ease;
-ms-transition:all 500ms ease;
-o-transition:all 500ms ease;
-moz-transition:all 500ms ease;
transition:all 500ms ease;
}
/***
====================================================================
9.About style One
====================================================================
***/
.welcome-title {
text-align: center;
}
.welcome-title h1 {
text-transform: uppercase;
font-size: 48px;
font-weight: 600;
}
.welcome-title h1 span {
color: #cee002;
}
.theme-btn {
background-color: #333;
border-radius: 0px;
color: #fff;
padding: 9px 22px;
}
.link-btn .theme-btn{
color: white;
}
.theme-btn:hover {
background-color: #cee002;
color: #fff;
transition:all 500ms ease;
-moz-transition:all 500ms ease;
-webkit-transition:all 500ms ease;
-ms-transition:all 500ms ease;
-o-transition:all 500ms ease;
}
.about-item h5 {
letter-spacing: 1px;
margin: 15px 0 5px 0;
text-transform: uppercase;
}
.about-item h5 a:hover {
color: #cee002;
}
.about-item .image{
position:relative;
overflow:hidden;
}
.about-item .image img{
position:relative;
display:block;
width:100%;
-webkit-transition:all 300ms ease;
-ms-transition:all 300ms ease;
-moz-transition:all 300ms ease;
-o-transition:all 300ms ease;
transition:all 300ms ease;
}
.about-item .image .lightbox-image{
position:absolute;
left:0px;
top:0px;
width:100%;
height:100%;
text-align:center;
opacity:0;
color:#ffffff;
background:rgba(246,138,21,0.8);
-webkit-transition:all 300ms ease;
-ms-transition:all 300ms ease;
-moz-transition:all 300ms ease;
-o-transition:all 300ms ease;
transition:all 300ms ease;
}
.about-item .image .lightbox-image span{
position:absolute;
left:0px;
top:50%;
margin-top:-10px;
display:block;
width:100%;
height:20px;
line-height:20px;
font-size: 30px;
}
.about-item .image:hover .lightbox-image{
opacity:1;
}
.about-list li {
padding-top:12px;
font-style: italic;
}
.about-list li:first-child {
padding: 0;
}
.about-list li i {
color: #cee002;
margin-right: 15px;
}
.about-2 li {
float: left;
width: 48%;
margin-right: 10px;
padding-bottom: 20px;
}
.about-title-2 h6 {
font-size: 10px;
text-transform: uppercase;
letter-spacing: 11px;
font-family:'Roboto Slab',sans-serif;
}
.about-title-2 h1 {
letter-spacing: 1px;
text-transform: uppercase;
}
.about-title-2 h1.intro-title {
font-size: 46px;
line-height: 1.4em;
}
/*
About Info
*/
.arch-dygram,.about-info {
position: relative;
}
.about-info {
border: 2px dotted rgba(246, 138, 21, 0.5);
min-width: 60%;
min-height: 400px;
}
.about-info h1 {
bottom: 0;
color: rgba(243, 243, 243, 0.9);
font-size: 8em;
font-weight: bold;
line-height: 1.2;
position: absolute;
right: -1px;
text-transform: uppercase;
z-index: -1;
text-outline: 2px 2px #cee002;
}
.about-info i {
font-size: 60px;
line-height: 1.2;
}
.inner {
border: 2px solid #cee002;
padding: 34px;
border-radius: 4px;
}
.action .inner i {
float: left;
margin-right: 15px;
margin-top: 30px;
}
.action .inner i:before {
font-size: 40px;
}
.submit-btn {
float: right;
margin: 20px 0 0 20px !important;
}
.action .content {
display: inline;
}
.action .content h4 {
text-transform: uppercase;
}
.about-icon .inner-box i{
font-size: 1.5em;
}
.about-icon .inner-box .content{
letter-spacing: 2px;
}
/***
====================================================================
3.Working Time
====================================================================
***/
ul.hours_wigdet li {
border-bottom: 2px dotted #cee002;
color: #0d0d0d;
font-size: 14px;
padding: 13px 0;
}
ul.hours_wigdet li > span {
float: right;
}
/* Call-to-action*/
.call-to-action {
background-attachment: fixed;
background-color: #cee002;
background-position: center center;
background-repeat: no-repeat;
padding: 38px 0;
position: relative;
}
.bg3 {
background-repeat: no-repeat;
background-position: right bottom;
padding-bottom: 20px;
}
.contact-img {
background-repeat: no-repeat;
background-position: left;
background-size: cover;
}
.bg4 {
background-image: url("images/bg/img-tree.html");
background-repeat: no-repeat;
background-position: left center;
background-size: cover;
}
.bg4 h2 {
text-transform: uppercase;
font-size: 120px;
color: #F9f9f9;
position: absolute;
top: -120px;
left: 50px;
font-family:'Roboto Slab',sans-serif;
}
.about-3 {
background-color: rgba(255,255,255, 0.85);
padding: 40px;
-webkit-box-shadow: 1px 2px 7px -3px rgba(0,0,0,0.75);
-moz-box-shadow: 1px 2px 7px -3px rgba(0,0,0,0.75);
box-shadow: 0px 2px 7px -3px rgba(0,0,0,0.75);
}
.about-3 h3 {
font-weight: 600;
line-height: 40px;
text-transform: uppercase;
}
.about-3 p {
margin-top: 12px;
}
.parallux-section h2 {
text-align: center;
color: #fff;
font-size: 42px;
line-height: 58px;
margin-bottom: 30px;
}
/*feature-border*/
.service-block {
margin: 30px 0;
position: relative;
}
.service-block .inner-box {
padding-left: 90px;
position: relative;
}
.service-block .inner-box .icon-box {
background: rgba(0, 0, 0, 0) url("../images/icons/service-icon-1.html") no-repeat scroll 0 0;
display: inline-block;
height: 60px;
left: 0;
line-height: 58px;
position: absolute;
text-align: center;
top: 0;
width: 70px;
}
.service-block .inner-box .icon-box::after {
background: rgba(0, 0, 0, 0) url("../images/icons/service-icon-1-bg.html") no-repeat scroll 0 0;
content: "";
height: 60px;
left: 0;
opacity: 0;
position: absolute;
top: 0;
transition: all 0.7s ease 0s;
width: 70px;
z-index: -9;
}
.service-block .inner-box:hover .icon-box::after {
color: #ffffff;
opacity: 1;
transition: all 0.7s ease 0s;
}
.service-block .inner-box:hover .icon-box span {
color: #ffffff !important;
position: relative;
z-index: 99;
}
.service-block .inner-box .icon-box span {
color: #30577c;
font-size: 30px;
}
.service-block .inner-box h3 {
color: #222222;
font-size: 20px;
font-weight: 600;
position: relative;
top: -10px;
}
/*
Services Style
*/
.service-style .inner-box {
// background: #f2f2f2 none repeat scroll 0 0;
clear: both;
border: 1px solid rgba(0, 0, 0, 0.1);
display: block;
margin-bottom: 30px;
overflow: hidden;
padding: 58px 25px 68px;
border-radius: 5px;
transition: all 0.7s ease 0s;
}
.service-style .inner-box i {
font-size: 1.7em;
}
.service-style .inner-box:hover {
background: #000;
color: #fff;
}
.service-numb {
position: relative;
}
.service-numb h2 {
color: rgba(0, 0, 0, 0.06);
font-size: 6em;
line-height: 1.4;
}
.service-style .inner-box:hover .service-numb h2 {
color: rgba(244, 244, 244, 0.09);
}
.medium-icon {
font-size: 40px;
margin-bottom: 15px;
}
.display-block {
display: block;
}
/* ====================================================================
16. Service Details style css Start
====================================================================
*/
.cs-service-details-area {
width: 100%;
padding: 80px 0px 50px;
}
.cs-service-details-col {
margin-bottom: 30px;
}
.cs-service-details-area ul li {
background: rgba(0, 0, 0,0.9);
margin-bottom: 5px;
padding: 15px 0px 15px 0px;
-webkit-transition: all 0.4s ease-in-out;
-moz-transition: all 0.4s ease-in-out;
-o-transition: all 0.4s ease-in-out;
-ms-transition: all 0.4s ease-in-out;
transition: all 0.4s ease-in-out;
}
.cs-service-details-area ul li:hover {
background: #FFC41B;
-webkit-transition: all 0.4s ease-in-out;
-moz-transition: all 0.4s ease-in-out;
-o-transition: all 0.4s ease-in-out;
-ms-transition: all 0.4s ease-in-out;
transition: all 0.4s ease-in-out;
}
.cs-service-details-area ul li i {
margin-right: 10px;
margin-left: 10px;
color: #cccccc;
-webkit-transition: all 0.4s ease-in-out;
-moz-transition: all 0.4s ease-in-out;
-o-transition: all 0.4s ease-in-out;
-ms-transition: all 0.4s ease-in-out;
transition: all 0.4s ease-in-out;
}
.cs-service-details-area ul li:hover i {
color: #ffffff;
-webkit-transition: all 0.4s ease-in-out;
-moz-transition: all 0.4s ease-in-out;
-o-transition: all 0.4s ease-in-out;
-ms-transition: all 0.4s ease-in-out;
transition: all 0.4s ease-in-out;
}
.cs-service-details-area ul li a {
color: #fff;
-webkit-transition: all 0.4s ease-in-out;
-moz-transition: all 0.4s ease-in-out;
-o-transition: all 0.4s ease-in-out;
-ms-transition: all 0.4s ease-in-out;
transition: all 0.4s ease-in-out;
padding: 10px;
}
.cs-service-details-area ul li:hover a {
color: #ffffff;
-webkit-transition: all 0.4s ease-in-out;
-moz-transition: all 0.4s ease-in-out;
-o-transition: all 0.4s ease-in-out;
-ms-transition: all 0.4s ease-in-out;
transition: all 0.4s ease-in-out;
}
.cs-service-details-area .cs-mb-20 {
margin-bottom: 30px;
}
.inner-box:hover .small-line-2:after {
width: 55px;
transition: all 0.7s ease 0s;
}
.who-we-are{
width:100%;
display: table;
}
.who-we-are .left-side{
width:50%;
display: table-cell;
vertical-align:middle;
text-align:right;
overflow:hidden;
position:relative;
}
.who-we-are .left-side.image1{
background:url(../images/bg/bg3.jpg);
background-size:cover;
background-position:center;
}
.who-we-are .left-side.image2{
background:url(../images/bg/bg5.jpg);
background-size:cover;
background-position:center;
}
.who-we-are .left-side.image3{
background:url(../images/bg/bg7.jpg);
background-size:cover;
background-position:center;
}
.who-we-are .left-side.image3.style-2 {
position: relative;
}
.who-we-are .left-side.image3.style-2:before {
content: " ";
height: 100%;
left: 0;
position: absolute;
top: 0;
width: 100%;
z-index: 0;
background-color: rgba(15, 38, 58, 0.86);
}
.who-we-are.left-side .signature{
display:inline-block;
text-align:left;
padding-right:60px;
padding-bottom:20px;
}
.who-we-are .right-side{
width:50%;
display: table-cell;
vertical-align:middle;
background:#f5f5f5;
padding:100px 0;
}
.who-we-are .right-side.style-two{
width:50%;
display: table-cell;
vertical-align:middle;
background:#f5f5f5;
padding:40px 0;
}
.who-we-are .right-side .content-inner{
width:100%;
max-width:600px;
padding-left:80px;
}
.content-inner .section-title {
padding-bottom: 20px;
}
.content-inner .section-title .sub-title {
letter-spacing: 3px;
}
.content-inner .section-title h3 {
letter-spacing: 1px;
}
.signature-title {
display: block;
margin-top: 20px;
font-weight: 600;
}
/*
Experience item
*/
.experience {
background: rgba(0, 0, 0, 0.9);
padding: 25px;
margin-bottom: 30px;
border: 1px solid #3c3c3c;
border-radius: 5px;
}
.experience i {
color: #cee002;
padding-bottom: 15px;
display: block;
}
.experience .content h4 {
margin-bottom: 10px;
}
/***
====================================================================
10.Work Secction
====================================================================
***/
.work {
position: relative;
}
.work-time .border {
border: 1px solid #696867;
padding: 20px;
padding-left: 40px;
}
.work-time {
background-color: #3f3a36;
padding: 30px;
}
.work-time h3 {
color: #FFF;
text-transform: uppercase;
}
.work-time h3 span {
color: #cee002;
}
.work-time li {
color: #FFF;
padding: 10px;
}
.work-time li:hover {
background-color: #cee002;
transition: all 500ms ease;
-webkit-transition: all 500ms ease;
-ms-transition: all 500ms ease;
-o-transition: all 500ms ease;
-moz-transition: all 500ms ease;
}
.work-time li span {
float: right;
padding-right: 30%;
}
.work-img {
background-repeat: no-repeat;
background-position: center;
background-size: cover;
position: absolute;
top: -60px;
}
/***
====================================================================
11.Service Section
====================================================================
***/
.service-item {
margin-bottom: 30px;
}
.service-item h5 {
margin: 25px 0 5px 0;
text-transform: uppercase;
}
.service-item:hover h5 a {
color: #cee002;
-webkit-transition:all 300ms ease;
-ms-transition:all 300ms ease;
-moz-transition:all 300ms ease;
-o-transition:all 300ms ease;
transition:all 300ms ease;
}
.service-item i {
color: #cee002;
}
.service-1 {
position: relative;
}
.border-nn {
position: absolute;
top: 12%;
border: 1px solid #cee002;
width: 70%;
left: 25%;
height: 100%;
}
.services-details .content p {
margin-top: 20px;
}
.service-1 h4 {
color: #cee002;
text-transform: uppercase;
font-size: 18px;
margin-bottom: 20px;
}
.service-1 h6 {
color: #bcbcbc;
font-size: 12px;
margin-bottom: 10px;
text-transform: uppercase;
margin-top: 40px;
}
.service-item i {
font-size: 60px;
margin-top: 40px;
display: block;
transition:all 500ms ease;
-moz-transition:all 500ms ease;
-webkit-transition:all 500ms ease;
-ms-transition:all 500ms ease;
-o-transition:all 500ms ease;
}
.service-item:hover i {
color: #cee002;
}
.service-item.effect-border i {
border: 2px solid #f0f0f0;
border-radius: 50%;
display: inline-block;
font-size: 44px;
height: 100px;
line-height: 90px;
text-align: center;
transition: all 0.3s ease 0s;
vertical-align: middle;
width: 100px;
}
.service-item.effect-border i:before {
font-size: 44px;
}
.service-item.effect-border:hover i {
border: 2px solid #cee002;
}
/*********
Service Three
**********/
.cs-service-two-col {
box-shadow: 0 22px 43px rgba(0, 0, 0, 0.15);
margin-bottom: 30px;
margin-top: -160px;
text-align: center;
transition: all 0.4s ease-in-out 0s;
position: relative;
z-index: 1111;
overflow: hidden;
}
.cs-service-two-content {
padding: 30px 40px;
}
.cs-service-two-col img {
border-top: 10px solid #ffffff;
}
.cs-service-two-content .title {
text-transform: uppercase;
line-height: 1.4;
padding-bottom: 15px;
}
.cs-service-two-col:hover {
background: #fff none repeat scroll 0 0;
}
.cs-service-two-col:hover p{color:#222;}
.cs-service-two-col:hover {
box-shadow: none;
transition: all 0.4s ease-in-out 0s;
}
.cs-service-two-col .thumb {
overflow: hidden;
transition: all 0.4s ease-in-out 0s;
}
.cs-service-two-col img {
display: block;
transition: all 8s linear 0s;
width: 100%;
}
.cs-service-two-col:hover img {
transform: scale(1.4);
}
..cs-service-two-col:hover h3.title{color:#cee002!important;}
.cs-service h4 {
font-size: 1rem;
font-weight: normal;
letter-spacing: 7px;
position: absolute;
right: -145px;
text-transform: lowercase;
top: 110px;
transform: rotate(-90deg);
}
/*********
Project Items
**********/
.project-items .thumb img {
position: relative;
cursor: pointer;
}
.project-items .project-info {
background: #f9f9f9 none repeat scroll 0 0;
bottom: 16px;
padding: 20px;
position: absolute;
transition: all 0.3s linear 0s;
}
.project-info h3{color:#222;}
.project-items:hover .project-info {
background: #cee002 none repeat scroll 0 0;
color: #FFF;
}
.project-items .thumb .space,.project-items .thumb .space.right {
background: #cee002 none repeat scroll 0 0;
height: 1px;
position: absolute;
right: -71px;
top: 49px;
width: 200px;
}
.project-items .thumb .space.right {
right: 0;
left: -71px;
}
.project-info-box {
border: 1px solid #e2e2e2;
margin-bottom: 45px;
position: relative;
}
.project-info-box li span {
color: #777777;
display: block;
font-size: 15px;
font-weight: 400;
margin-top: 2px;
text-transform: capitalize;
}
/*********
**********/
.service-box.style-1 {
color: #fff;
padding: 40px 25px;
position: relative;
text-align: center;
transform: translateZ(0px);
z-index: 1;
margin-bottom: 30px;
}
.service-box.style-1::before, .service-box.style-1::after {
bottom: 0;
content: "";
left: 0;
margin: 10px;
position: absolute;
right: 0;
top: 0;
transition: all 0.3s ease 0s;
z-index: 3;
}
.service-box.style-1::before {
border-left: 1px solid #fff;
border-right: 1px solid #fff;
transform: scaleY(0);
transform-origin: 100% 0 0;
}
.service-box.style-1::after {
border-bottom: 1px solid #fff;
border-top: 1px solid #fff;
transform: scaleX(0);
transform-origin: 0 100% 0;
}
.service-box.style-1 .service-box-overlay {
background-color: #cee002;
bottom: 0;
left: 0;
position: absolute;
right: 0;
top: 0;
z-index: 2;
transition: all 0.3s ease 0s;
}
.service-box.style-1:hover .service-box-overlay {
background-color: #cee002;
opacity: 0.9;
}
.service-box.style-1 > i {
color: #FFF;
display: block;
font-size: 64px;
line-height: 64px;
margin-bottom: 15px;
position: relative;
z-index: 4;
}
.service-box.style-1 > i:before {
font-size: 64px;
}
.service-box.style-1 .service-box-content {
position: relative;
z-index: 4;
}
.service-box.style-1 .service-box-content a {
color: #FFF;
}
.service-box.style-1 .service-box-content h5 {
text-transform: uppercase;
}
.service-box.style-1:hover::before {
transform: scaleY(1);
}
.service-box.style-1:hover::after {
transform: scaleX(1);
}
.services.inner-box.style-2 .content {
margin-bottom: 40px;
padding-top: 20px;
transition: all 0.3s ease-in-out 0s;
}
.services.inner-box.style-2 h4 {
font-size: 14px;
font-weight: 600;
text-transform: uppercase;
padding: 10px 0;
transition: all 0.3s ease-in-out 0s;
}
.services.inner-box.style-2 h4::before {
background-color: #cee002;
content: "";
display: block;
height: 2px;
// margin: 0 auto;
position: relative;
top: -11px;
transition: all 0.3s ease-in-out 0s;
width: 0;
}
.services.inner-box.style-2 span{
transition: all 0.3s ease-in-out 0s;
}
.services.inner-box.style-2:hover span {
color: #cee002;
}
.services.inner-box.style-2:hover h4::before {
width: 60px;
}
.process {
display: block;
text-align: center;
}
.process-items {
display: inline-block;
position: relative;
width: 180px;
height: 175px;
}
.process-items .process_thumb, .process-items .process_number {
border-radius: 999em;
color: #fff;
display: inline-block;
height: 175px;
position: relative;
transition: all 0.3s ease-in-out 0s;
width: 175px;
box-shadow: 0 0 100px rgba(0, 0, 0, 0.1);
}
.process-items .process_thumb {
background: #333 none repeat scroll 0 0;
}
.process-items .process_number {
background-color: #cee002;
border: 2px solid #272727;
color: #fff;
display: block;
font-size: 18px;
height: 42px;
line-height: 36px;
margin-right: 8px;
margin-top: 8px;
position: absolute;
right: 0;
top: 0;
width: 42px;
text-align: center;
}
.process-items .process_thumb, .process-items .process_number {
border-radius: 999em;
}
.process-items .process_thumb > img,.process_thumb > .icon {
font-size: 56px;
left: 50%;
position: absolute;
top: 50%;
transform: translate(-50%, -50%);
}
.process-items:hover .process_thumb{
background-color: #cee002;
color: #fff;
}
.process-items:hover .process_number {
background-color: #333;
border: 2px solid rgba(0, 0, 0, 0.5);
color: #fff;
}
// Project info
.project-info-box {
border: 1px solid #e2e2e2;
margin-bottom: 45px;
position: relative;
}
.project-info-box li {
border-bottom: 1px solid #e2e2e2;
color: #333333;
display: block;
font-family: "Assistant",sans-serif;
font-size: 16px;
font-weight: 700;
padding: 24px 10px 24px 30px;
position: relative;
text-transform: uppercase;
}
/*
Medical Service
*/
.med-icon {
margin-bottom: 40px;
}
.med-icon span:before {
font-size: 30px;
}
.med-icon .icon{
position:relative;
}
.med-icon .inner-box{
position: relative;
max-width: 500px;
margin: 0 auto;
padding-left: 60px;
}
.med-icon .icon{
position:absolute;
left: 0;
top: 8px;
color: #cee002;
width:80px;
transition:all 500ms ease;
-moz-transition:all 500ms ease;
-webkit-transition:all 500ms ease;
-ms-transition:all 500ms ease;
-o-transition:all 500ms ease;
}
.med-icon .inner-box:hover .icon {
top: 20px;
}
.border-width {
border-bottom: 1px solid #cee002;
width: 260px;
position: absolute;
left: -28%;
top: 27%;
}
.vertical-tab .nav-tabs > li {
float: none;
margin-bottom: 0;
}
.vertical-tab .nav-tabs>li>a {
margin-bottom: 5px;
background-color: #f4f6f8;
color: #838383;
border-radius: 0;
font-weight: 600;
font-style: italic;
}
.vertical-tab .nav-tabs>li>a span {
font-size: 15px;
margin-right: 10px;
}
.vertical-tab .nav-tabs>li.active>a,
.vertical-tab .nav-tabs>li.active>a:focus,
.vertical-tab .nav-tabs>li.active>a:hover,
.vertical-tab .nav-tabs>li>a:hover,
.vertical-tab .nav-tabs>li>a .active,
.vertical-tab .nav-tabs>li>a:focus
{
background-color: #cee002;
color: #FFF;
}
.vertical-tab .nav-tabs {
border-bottom:0;
}
/***
====================================================================
12.FAQ Section
====================================================================
***/
.faq-default-content.faq-content {
margin-top: -10px;
}
.faq-content .panel-group .panel {
border-radius: 0;
margin-top: 10px;
}
.faq-content .panel-group .panel {
background: #fff none repeat scroll 0 0;
border-radius: 0;
box-shadow: none;
margin-top: 10px;
}
.faq-content .panel-group .panel.panel-default {
border: medium none;
}
.faq-content .panel-group .panel.panel-default .panel-heading {
background: #fff none repeat scroll 0 0;
border: 1px solid #e6e8ed;
height: 47px;
padding: 15px 0;
}
.faq-content .panel-group .panel.panel-default .panel-heading .panel-title a {
color: #333;
display: block;
font-size: 14px;
padding-left: 65px;
line-height: 1.6;
position: relative;
}
.faq-content .panel-group .panel.panel-default .panel-heading .panel-title a::after {
color: #fff;
content: "";
font-family: "fontawesome";
font-size: 20px;
height: 47px;
left: -1px;
padding: 9px 15px;
position: absolute;
top: -16px;
width: 47px;
background: #cee002;
}
.faq-content .panel-group .panel.panel-default .panel-heading .panel-title a.collapsed:after {
border: 1px solid #e6e8ed;
border-right: 0;
color: #cee002;
content: "";
font-family: fontawesome;
font-size: 20px;
height: 47px;
left: -1px;
padding: 9px 15px;
position: absolute;
top: -16px;
width: 47px;
background: #FFF;
}
.faq-content .panel-group .panel.panel-default .panel-collapse .panel-body {
border-top-color: #fff;
padding-bottom: 14px;
padding-top: 17px;
}
.faq-content .panel-group .panel.panel-default .panel-collapse .panel-body .panel_body_up p {
color: #8b8b8b;
font-size: 15px;
font-weight: 400;
line-height: 28px;
font-family: 'Lato', sans-serif;
font-style: italic;
}
/***
Pricing table
***/
.pricing {
position: relative;
margin-bottom: 15px;
border: 1px solid #f1f1f1;
transition: 0.5s ease-in-out;
}
.pricing-active {
border: 1px solid #36d7ac;
margin-top: -10px;
box-shadow: 7px 7px rgba(54, 215, 172, 0.2);
}
.pricing:hover {
border: 1px solid #000;
}
.pricing:hover h4 {
color: #000;
}
.pricing-head {
text-align: center;
}
.pricing-head h3,
.pricing-head h4 {
margin: 0;
line-height: normal;
transition: 0.5s ease-in-out;
}
.pricing-head h3 span,
.pricing-head h4 span {
display: block;
margin-top: 5px;
font-size: 14px;
font-style: italic;
}
.pricing-head h3 {
font-weight: 300;
color: #fafafa;
padding: 25px 0;
font-size: 27px;
background: #000;
border-bottom: solid 1px #eee;
}
.pricing-head h4 {
color: #cee002;
padding: 5px 0;
font-size: 54px;
// background: #e0e0e0;
border-bottom: solid 1px #f5f9e7;
}
.pricing-head-active h4 {
color: #36d7ac;
}
.pricing-head h4 i {
top: -8px;
font-size: 28px;
font-style: normal;
position: relative;
}
.pricing-head h4 span {
top: -20px;
font-size: 14px;
font-style: normal;
position: relative;
}
/*Pricing Content*/
.pricing-content li {
color: #666666;
text-align: center;
padding: 7px 15px;
border-bottom: solid 1px #f6f6f6;
}
/*Pricing Footer*/
.pricing-footer {
color: #777;
font-size: 11px;
line-height: 17px;
text-align: center;
padding: 0 20px 19px;
transition: color 0.5s ease-in-out;
}
/*Priceing Active*/
.price-active,
.pricing:hover {
z-index: 9;
}
.price-active h4 {
color: #36d7ac;
}
.no-space-pricing .pricing:hover {
transition: box-shadow 0.2s ease-in-out;
}
.no-space-pricing .price-active .pricing-head h4,
.no-space-pricing .pricing:hover .pricing-head h4 {
color: #36d7ac;
padding: 15px 0;
font-size: 80px;
transition: color 0.5s ease-in-out;
}
.yellow-crusta.btn {
color: #FFFFFF;
background-color: #cee002;
}
.yellow-crusta.btn:hover,
.yellow-crusta.btn:focus,
.yellow-crusta.btn:active,
.yellow-crusta.btn.active {
color: #FFFFFF;
background-color: #cfa500;
}
/***
====================================================================
14.Progress Levels Section
====================================================================
***/
.progress-levels {
margin-top: 20px;
margin-bottom: 20px;
}
.progress-levels .progress-box{
position:relative;
margin-bottom:25px;
overflow:hidden;
}
.progress-levels .progress-box:last-child{
margin-bottom:0px;
}
.progress-levels .progress-box:last-child{
margin-bottom:0px;
}
.progress-levels .progress-box .box-title{
position:relative;
font-size:18px;
line-height:24px;
color:#181818;
text-transform:capitalize;
margin-bottom:16px;
font-family: 'Raleway', sans-serif;
}
.progress-levels .progress-box .bar{
position:relative;
height:10px;
background:#eeeeee;
}
.progress-levels .progress-box .bar .bar-innner{
position:relative;
left:0px;
top:0px;
width:100%;
height:4px;
}
.progress-levels .progress-box .bar .bar-fill{
position:absolute;
left:-100%;
top:0px;
width:0px;
height:10px;
background:#cee002;
-moz-transition:all 2000ms ease 300ms;
-webkit-transition:all 2000ms ease 300ms;
-ms-transition:all 2000ms ease 300ms;
-o-transition:all 2000ms ease 300ms;
transition:all 2000ms ease 300ms;
}
.progress-levels .progress-box.animated .bar .bar-fill{
left:0px;
}
.progress-levels .progress-box .percent{
position:absolute;
right:0px;
top:-40px;
letter-spacing:0px;
font-size:18px;
color:#181818 !important;
font-family: 'Roboto Slab', serif;
line-height:24px;
opacity:0;
-moz-transition:all 2000ms ease 700ms;
-webkit-transition:all 2000ms ease 700ms;
-ms-transition:all 2000ms ease 700ms;
-o-transition:all 2000ms ease 700ms;
transition:all 2000ms ease 700ms;
}
.progress-levels .progress-box.animated .percent{
opacity:1;
}
.appointment {
margin-top: 15px;
}
.appointment h2 {
text-transform: uppercase;
}
.appointment h2 span {
color: #cee002;
}
.appointment p {
margin-bottom: 30px;
}
.appointment-head {
background: rgba(15, 38, 58, 1);
padding: 20px;
text-align: center;
color: #FFF;
}
.appointment-form {
border: 2px solid #eeeeee;
border-top-width: 0;
background: #fafafa;
}
hr {
border-top: 1px solid #F1F1F1;
border-bottom: 1px solid #F1F1F1;
height: 6px;
margin-top: 90px;
}
.call-to-action-boxed .call-to-action-corner:nth-child(2) {
padding: 50px 0;
}
.call-to-action-corner-1,
.call-to-action-corner-2 {
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
position: relative;
padding: 50px 0;
}
.call-to-action-corner-1::before {
background: rgba(38,38,38,.9) none repeat scroll 0 0;
bottom: 0;
content: "";
left: 0;
position: absolute;
right: 0;
top: 0;
}
.call-to-action-corner-2::before {
background: rgba(38,38,38,.9) none repeat scroll 0 0;
bottom: 0;
content: "";
left: 0;
position: absolute;
right: 0;
top: 0;
}
.call-to-action-center::before {
background: rgba(38,38,38,.98) none repeat scroll 0 0;
bottom: 0;
content: "";
left: 0;
position: absolute;
right: 0;
top: 0;
}
.single-call-to-action {
align-items: center;
display: flex;
justify-content: center;
min-height: 250px;
position: relative;
text-align: center;
}
.single-call-to-action .icon-box, .single-call-to-action .content-box {
display: inline-block;
vertical-align: top;
}
.single-call-to-action .icon-box {
bottom: 15px;
position: relative;
width: 50px;
}
.single-call-to-action .icon-box i.flaticon-clock {
bottom: 20px;
position: relative;
}
.single-call-to-action .icon-box i.flaticon-medical {
bottom: 25px;
position: relative;
}
.single-call-to-action .icon-box i.flaticon-coins {
bottom: 15px;
position: relative;
}
.single-call-to-action .icon-box i::before {
color: #fff;
font-size: 50px;
}
.single-call-to-action .content-box {
padding-left: 40px;
text-align: left;
width: 65%;
}
.single-call-to-action .content-box h3 {
color: #fff;
font-size: 24px;
margin: 0 0 15px;
text-transform: uppercase;
}
.single-call-to-action .content-box p {
color: #fff;
line-height: 24px;
}
.single-call-to-action .content-box ul {
margin: 0;
padding: 0;
}
.single-call-to-action .content-box ul li {
-moz-box-pack: justify;
color: #fff;
display: flex;
font-weight: bold;
justify-content: space-between;
list-style: outside none none;
}
.single-call-to-action .content-box .thm-btn.inverse {
background-color: transparent;
border-color: #fff;
color: #fff;
padding: 7px 22px;
}
.single-call-to-action .content-box .thm-btn.inverse:hover {
background: #fff none repeat scroll 0 0;
color: #186aab;
}
.call-to-action.boxed .single-call-to-action .content-box {
width: 70%;
}
.home-banner-text {
position: absolute;
top: 0;
right: 0;
margin: 0 auto;
color: #FFF;
}
/***
====================================================================
15.Team Section
====================================================================
***/
.team-item h4 a {
color: #fff;
}
.team-item {
position: relative;
overflow: hidden;
margin-bottom: 30px !important;
}
.team-item p {
text-transform: uppercase;
line-height: 16px;
font-size: 12px;
}
.team-item .img-title {
bottom: 0;
opacity: 0.9;
bottom: -23%;
position: absolute;
display: block;
width: 100%;
padding: 10px 20px;
color: #FFF;
transition: all 500ms ease;
-webkit-transition: all 500ms ease;
-ms-transition: all 500ms ease;
-o-transition: all 500ms ease;
-moz-transition: all 500ms ease;
}
.team-item:hover .img-title {
background-color: #cee002;
bottom: 0;
opacity: 0.9;
position: absolute;
display: block;
width: 100%;
padding: 10px 20px;
color: #FFF;
transition: all 500ms ease;
-webkit-transition: all 500ms ease;
-ms-transition: all 500ms ease;
-o-transition: all 500ms ease;
-moz-transition: all 500ms ease;
}
.team-icon {
position: absolute;
margin: auto;
top: 3%;
right: -12%;
opacity: 1;
transition: all 500ms ease;
-webkit-transition: all 500ms ease;
-ms-transition: all 500ms ease;
-o-transition: all 500ms ease;
-moz-transition: all 500ms ease;
}
.team-item:hover .team-icon {
position: absolute;
opacity: 1;
right: 3%;
margin: auto;
transition: all 500ms ease;
-webkit-transition: all 500ms ease;
-ms-transition: all 500ms ease;
-o-transition: all 500ms ease;
-moz-transition: all 500ms ease;
}
.team-icon ul li {
margin-bottom: 5px;
}
.team-icon ul li a {
background-color: #333;
font-size: 22px;
padding: 8px;
color: #fff;
display: block;
}
.team-icon ul li a:hover {
background-color: #cee002;
color: #fff;
}
.zeep img {
position: absolute;
right: 1%;
width: 22%;
top: 25%;
}
.team-content h2 {
line-height: 1;
text-transform: uppercase;
}
.team-content h5 {
color: #fff;
font-weight: 300;
margin-bottom: 20px;
}
.team-content {
border-left: 1px solid #eee;
padding-left: 30px;
}
.team-contact {
padding-top: 15px;
}
.team-contact ul li a {
font-size: 24px;
}
.zeep img {
position: absolute;
right: 1%;
width: 22%;
top: 25%;
}
.team-content h2 {
line-height: 1;
text-transform: uppercase;
}
.team-content h5 {
color: #cee002;
font-weight: 300;
margin-bottom: 20px;
}
.team-content {
border-left: 1px solid #eee;
padding-left: 30px;
}
.team-contact {
padding-top: 15px;
}
.team-contact ul li a {
font-size: 24px;
}
.attorneys-social {
border-bottom: 1px solid #eee;
border-top: 1px solid #eee;
margin: 20px 0 10px;
padding: 13px 0;
}
.attorneys-social li {
background: #1e1e1e;
margin: 0 5px;
transition: all 500ms ease;
-webkit-transition: all 500ms ease;
-ms-transition: all 500ms ease;
-o-transition: all 500ms ease;
-moz-transition: all 500ms ease;
}
.attorneys-social li a {
color: #fff;
display: block;
padding: 5px;
}
.attorneys-social li:hover {
background: #cee002;
}
.signature img {
width: 15%;
}
.styled-list li {
position: relative;
margin-bottom: 15px;
padding-left: 40px;
}
.styled-list li:before {
color: #b89b5e;
content: "";
display: block;
font-family: "icofont";
font-size: 18px;
left: 5px;
line-height: 30px;
position: absolute;
top: 0;
}
.parctise_details_page_content .title h3 {
font-size: 28px;
font-weight: 700;
margin-top: 53px;
text-transform: capitalize;
}
.our_brochure a {
background: #282828 none repeat scroll 0 0;
color: #fff;
display: block;
line-height: 60px;
margin-top: 20px;
text-align: center;
text-transform: uppercase;
}
.law-list li {
position: relative;
padding: 10px 17px;
}
.law-list li a {
padding: 10px 0;
}
.law-list li::before {
color: #bb9338;
content: "";
font-family: "FontAwesome";
left: 0;
position: absolute;
}
.choose-item {
margin-bottom: 45px;
}
.choose-item .icon-holder {
border: 5px solid #e6e6e6;
border-radius: 50%;
display: table;
float: left;
height: 80px;
margin-right: 30px;
text-align: center;
transition: all 0.3s ease-in-out 0s;
width: 80px;
}
.choose-item .icon-holder i {
color: #a3c203;
display: table-cell;
font-size: 35px;
vertical-align: middle;
}
.choose-item .icon-box-title h4 {
font-weight: 600;
text-transform: uppercase;
}
.choose-item:hover .icon-holder {
border: 5px solid #cee002;
}
/***
====================================================================
16.Fact Counter
====================================================================
***/
.fact-counter{
position:relative;
}
.fact-counter.overlayer {
background-repeat:no-repeat;
background-attachment:fixed;
background-size:cover;
}
.coun-icon {
font-size: 35px;
padding-right: 15px;
padding-top: 15px;
}
.fact-counter .counter-column{
position:relative;
}
.fact-counter .counter-column:last-child:after{
display:none;
}
.fact-counter .counter-column .count-outer{
font-size:36px;
margin-bottom:5px;
font-weight:600;
font-family: 'Open Sans', sans-serif;
}
.fact-counter .counter-column .count-outer span{
display:inline-block;
line-height: 50px;
font-size: 36px;
}
.fact-counter .counter-column .count-outer .icon{
position:relative;
top:-3px;
display:inline-block;
font-size:40px;
color:#ffd71b;
line-height:60px;
padding-right:20px;
}
.theme-green .fact-counter .counter-column .count-outer .icon{
color:#cee002;
}
.fact-counter .counter-column .text h4{
font-family: 'PT Sans', sans-serif;
letter-spacing:1.5px;
font-weight: normal;
}
.fact-counter.style-two .counter-column .count-outer,
.fact-counter.style-two .counter-column .count-outer .icon,
.fact-counter.style-two .counter-column .text{
color:#ffffff;
}
.fact-counter.style-two.extended .sec-title h2{
color:#ffffff;
}
.count-text {
font-weight: bold;
}
/* Funfact Counter */
.cs-counter-col {
position: relative;
background: #fbfbfb none repeat scroll 0 0;
margin-bottom: 10px;
padding: 23%;
width: 100%;
}
.cs-counter-col .cs-number-count i:before {
font-size: 30px;
color: #cee002;
}
.style-one .cs-counter-col h5 {
font-size: 14px;
font-weight: normal;
}
.cs-counter-col .cs-number-count i {
}
/***
====================================================================
17.BLog Section Style
====================================================================
***/
.post-info a {
color: #bcbcbc;
}
.post-info a:hover {
color: #cee002;
}
.post h4 {
padding: 5px 0;
transition: all 500ms ease;
-webkit-transition: all 500ms ease;
-ms-transition: all 500ms ease;
-o-transition: all 500ms ease;
-moz-transition: all 500ms ease;
}
.post:hover h4 {
color: #cee002;
text-transform: capitalize;
transition: all 500ms ease;
-webkit-transition: all 500ms ease;
-ms-transition: all 500ms ease;
-o-transition: all 500ms ease;
-moz-transition: all 500ms ease;
}
.post-content {
padding: 2.7rem;
border: 1px solid rgba(206, 224, 2, 0.2);
transition: all 500ms ease;
-webkit-transition: all 500ms ease;
-ms-transition: all 500ms ease;
-o-transition: all 500ms ease;
-moz-transition: all 500ms ease;
}
.post:hover .post-content {
border: 1px solid rgba(206, 224, 2, 1);
}
.post-content.no-border,.post:hover .post-content.no-border {
border: none;
}
.post-content .title {
text-transform: uppercase;
}
.post-content a {
font-size: 14px;
color: #999;
}
.post-info {
background-color: #222;
padding: 10px;
text-align: center;
}
.post {
overflow: hidden;
}
.post .post-overlay {
position: relative;
}
.post .post-overlay::before {
background-color: rgba(206, 224, 2, 0.85);
content: " ";
height: 100%;
left: -60%;
position: absolute;
top: 0;
width: 100%;
z-index: 0;
opacity: 0;
transition: all 500ms ease;
-webkit-transition: all 500ms ease;
-ms-transition: all 500ms ease;
-o-transition: all 500ms ease;
-moz-transition: all 500ms ease;
}
.post:hover .post-overlay::before {
left: 0;
opacity: 1;
transition: all 500ms ease;
-webkit-transition: all 500ms ease;
-ms-transition: all 500ms ease;
-o-transition: all 500ms ease;
-moz-transition: all 500ms ease;
}
.post-overlay i {
position: absolute;
left: 0;
right: 0;
top: 0;
margin: auto;
text-align: center;
opacity: 0;
font-size: 30px;
transition: all 500ms ease;
-webkit-transition: all 500ms ease;
-ms-transition: all 500ms ease;
-o-transition: all 500ms ease;
-moz-transition: all 500ms ease;
color: #FFF;
display: block;
}
.post:hover .post-overlay i {
top: 45%;
opacity: 1;
transition: all 500ms ease;
-webkit-transition: all 500ms ease;
-ms-transition: all 500ms ease;
-o-transition: all 500ms ease;
-moz-transition: all 500ms ease;
}
.post:hover .post-overlay i:hover {
color: #fff;
}
/***
====================================================================
17.Contact Section
====================================================================
***/
.contact-form h2{
font-size:30px;
color:#333333;
text-transform:uppercase;
letter-spacing:2px;
margin-bottom:25px;
font-weight:700;
}
.form-control {
height: 50px;
border: 1px solid #ececec;
box-shadow: none;
border-radius: 0;
}
.contact-form h2 {
font-size: 36px;
margin-bottom: 30px;
}
.contact-1 {
position: relative;
}
.contact-1 h2,
.contact-2 h2 {
text-transform: uppercase;
letter-spacing: 1px;
font-size: 36px;
margin-bottom: 20px;
}
.contact-1 h2 span,
.contact-2 h2 span {
color: #cee002;
}
.contact-item {
padding: 20px;
display: inline-block;
width: 100%;
margin-bottom: 30px;
-webkit-box-shadow: 0 0 26px 0 rgb(236, 236, 236);
-moz-box-shadow: 0 0 26px 0 rgb(236, 236, 236);
box-shadow: 0 0 26px 0 rgb(236, 236, 236);
}
.contact-item h5 {
font-size: 16px;
font-family: 'Open Sans', sans-serif;
text-transform: uppercase;
margin-bottom: 10px;
}
.contact-item .content {
float: left;
}
.contact-item span {
font-size: 72px;
color: #f0f0f0;
margin-top: 25px;
float: right;
}
/***
====================================================================
18.Sidebar
====================================================================
***/
.sidebar-title::after {
border: 1px solid #afafaf;
bottom: 0;
content: "";
height: 1px;
left: 0;
position: absolute;
width: 100px;
}
.sidebar-title {
padding-bottom: 10px;
position: relative;
}
.sidebar .sidebar-title{
position:relative;
margin-bottom:20px;
}
.sidebar .sidebar-title h2{
color:#333333;
font-weight:600;
text-transform:capitalize;
font-size:18px;
font-family: 'PT Sans', sans-serif;
}
.sidebar .sidebar-widget{
position:relative;
padding: 20px 0;
}
.sidebar .sidebar-widget.law-widget {
padding: 0;
}
.sidebar .search-box .form-group{
position:relative;
margin:0px;
}
.blog .post-title {
margin-top: 20px;
}
.sidebar-widget.popular-posts .post-info {
background-color: transparent;
padding: 10px 5px;
text-align: left;
}
.sidebar .search-box .form-group input[type="text"],
.sidebar .search-box .form-group input[type="search"]{
position:relative;
line-height:24px;
padding:10px 50px 10px 20px;
border:1px solid #e9e9e9;
background:#ffffff;
color:#3a3a3a;
display:block;
width:100%;
height:46px;
transition:all 500ms ease;
-moz-transition:all 500ms ease;
-webkit-transition:all 500ms ease;
-ms-transition:all 500ms ease;
-o-transition:all 500ms ease;
}
.sidebar .search-box .form-group input:focus{
border-color:#cee002;
}
.sidebar .search-box .form-group button{
position:absolute;
right:0px;
top:0px;
height:46px;
width:50px;
line-height:46px;
text-align:center;
display:block;
font-size:15px;
color:#fff;
background:#cee002;
}
.sidebar .search-box .form-group input:focus + button,
.sidebar .search-box .form-group button:hover{
background-color:#cee002;
color:#ffffff;
}
.sidebar .sidebar-title h3{
font-size:18px;
color:#2c2c2c;
font-weight:700;
text-transform:uppercase;
}
.sidebar .popular-posts .post{
position:relative;
font-size:14px;
color:#cccccc;
padding:3px 0 5px 90px;
min-height:70px;
}
.sidebar .popular-posts .post:last-child{
border-bottom:none;
}
.sidebar .popular-posts .post .post-thumb{
position:absolute;
left:0px;
top:12px;
width:70px;
background:#333333;
}
.sidebar .popular-posts .post:hover .post-thumb img{
opacity:0.50;
}
.sidebar .popular-posts .post .post-thumb img{
display:block;
width:100%;
}
.sidebar .popular-posts .post h4{
font-size:14px;
margin:0px;
line-height:1.4em;
color:#666666;
}
.sidebar .popular-posts .post a,
.sidebar .popular-posts .post a:hover{
color:#cee002;
}
.sidebar .popular-posts .post h4 a{
color:#666666;
font-weight: normal;
text-transform: none;
font-size:13px;
}
.sidebar .popular-posts .post-info{
font-size:12px;
color:#bcbcbc;
}
.sidebar .popular-tags a{
position:relative;
display:inline-block;
line-height:24px;
padding:5px 18px;
margin:0px 4px 12px 0px;
color:#fff;
background-color: #000;
text-align:center;
font-size:14px;
transition:all 300ms ease;
-webkit-transition:all 300ms ease;
-ms-transition:all 300ms ease;
-o-transition:all 300ms ease;
-moz-transition:all 300ms ease;
}
.sidebar .popular-tags a:hover{
background-color:#cee002;
color:#fff;
}
.sidebar .archives-list{
position:relative;
}
.sidebar .archives-list li{
position:relative;
line-height:24px;
padding:10px 0px;
}
.sidebar .archives-list li:last-child{
border-bottom:none;
padding-bottom:0px;
}
.sidebar .archives-list a{
position:relative;
display:block;
color:#666666;
font-size:14px;
font-weight:400;
line-height:24px;
}
.sidebar .archives-list a:hover{
color:#cee002;
}
.sidebar-widget.search-box span{
font-size: 16px;
}
.flickr-feed ul li {
display: inline-block;
margin-bottom: 4px;
}
.owl-carousel .overlay {
background-color: rgba(0, 0, 0, 0.42);
color: #fff;
height: 100%;
position: absolute !important;
width: 100%;
z-index: 2;
}
.no-border-radius {
border-radius: 0 !important;
}
.inner-blog-single .social-posts a span:hover {
background-color: #f68a15;
border-radius: 50%;
color: #fff;
line-height: 11px;
text-align: center;
}
/***
====================================================================
19.Main Footer
====================================================================
***/
.main-footer {
background-color: #000;
}
.main-footer .footer-1 p {
color: #FFF;
margin-top: 20px;
margin-bottom: 20px;
}
.main-footer .social li {
display: inline-block;
padding-right: 10px;
}
.main-footer .social li a:hover {
color: #cee002;
transition: all 500ms ease;
-webkit-transition: all 500ms ease;
-ms-transition: all 500ms ease;
-o-transition: all 500ms ease;
-moz-transition: all 500ms ease;
}
.main-footer .social li a span {
color: #cee002;
font-size: 11px;
text-transform: uppercase;
}
.main-footer h4 {
text-transform: uppercase;
font-family: 'PT Sans', sans-serif;
margin-bottom: 20px;
}
.footer-2 p,
.main-footer h4,
.social li a,
.footer-3 p {
color: #FFF;
}
.footer-2 p {
border-bottom: 1px solid #5a5856;
padding-bottom: 18px;
}
.footer-3 p span {
color: #cee002;
font-weight: 600;
}
.footer-3 p {
padding-bottom: 5px;
}
.main-footer .copyright {
text-align: center;
color: #FFF;
padding-bottom: 50px;
}
.main-footer .copyright a {
color: #cee002;
}
/***
====================================================================
20.Home about Two column
====================================================================
***/
.two-col-fluid {
background-attachment: fixed;
background-color: rgba(147, 180, 3, 0.86);
background-repeat: no-repeat;
background-size: cover;
position: relative;
}
.two-col-fluid::before {
background-color: rgba(147, 180, 3, 0.86);
content: "";
height: 100%;
left: 0;
position: absolute;
top: 0;
width: 100%;
}
.two-col-fluid .auto-container {
position: relative;
z-index: 2;
}
.two-col-fluid{
position:relative;
padding:50px 0px 50px;
color:#ffffff;
background-color:#242424;
}
.two-col-fluid .bg-grey{
background-color: #fff;
height: 101%;
position: absolute;
right: 153px;
top: 0;
width: 23%;
transform:skewX(-25deg);
-webkit-transform:skewX(-25deg);
-moz-transform:skewX(-25deg);
-ms-transform:skewX(-25deg);
-o-transform:skewX(-25deg);
}
.two-col-fluid .bg-image{
background-attachment: scroll;
background-clip: border-box;
background-color: #fff;
background-image: none;
background-origin: padding-box;
height: 100%;
position: absolute;
right: 0;
top: 0;
width: 25%;
}
.two-col-fluid .auto-container{
position:relative;
z-index:2;
}
/***
Bx Slider
***/
.bx-wrapper {
margin: 0;
position: relative;
}
.bx-wrapper::after {
content: '';
width: 100%;
height: 100%;
position: absolute;
background: rgba(0,0,0,0.5);
top: 0;
}
.bx-wrapper .bx-viewport {
background: transparent;
border: transparent;
box-shadow: none;
}
.bx-wrapper .bx-pager, .bx-wrapper .bx-controls-auto {
bottom: 0;
z-index: 1;
}
/***
====================================================================
21.Testimonials style Three
====================================================================
***/
.testimonial {
padding-bottom: 70px;
}
.testimonial-item {
padding: 25px;
border: 1px solid rgba(206, 224, 2, 0.20);
border-radius: 10px;
}
.testimonial-item p {
margin-top: 25px;
}
.testimonial-item .content {
padding-top: 30px;
}
.testimonial-item .content img {
float: left;
margin-right: 20px;
border-radius: 50%;
border: 3px solid #cee002;
width: 100px;
height: 100px;
}
.testimonial-item .content h4 {
text-transform: uppercase;
padding-top: 17px;
}
.testimonial-item .content p {
text-transform: uppercase;
font-size: 12px;
color: #cee002;
margin-top: 0;
}
.testimonial-item i {
font-size: 48px;
display: inherit;
color: #cee002;
}
.owl-nav {
position: absolute;
bottom: -80px;
}
.owl-next {
margin-left: 15px;
}
.owl-prev,
.owl-next {
background: transparent !important;
border: 1px solid #cee002 !important;
color: #cee002 !important;
border-radius: 0 !important;
padding: 4px 30px !important;
font-size: 20px !important;
float: left;
}
.owl-prev:hover,
.owl-next:hover {
background: #cee002 !important;
color: #FFF !important;
border: 1px solid #cee002 !important;
}
/***
====================================================================
22.Gallery Style One
====================================================================
***/
.gallery{
position:relative;
}
.gallery-title h2 span {
color: #cee002;
}
.gallery .section-title h2,
.gallery .section-title p {
color: #fff;
}
.gallery .section-title p {
margin-bottom: 15px;
}
.bg-light-grey{
background-color:#f8f8f8;
}
/*
====================================================================
portfolio css start
====================================================================
*/
.cs-portfolio-area,
.cs-portfolio-area-two {
padding: 80px 0 50px;
}
.portfolio {
margin: 20px 0;
overflow: hidden;
}
.portfolio .portfolio-item {
float: left;
}
.portfolio .portfolio-item .thumb {
position: relative;
}
.portfolio .portfolio-item .thumb img{
width: 100%;
height: auto;
display: block;
}
.portfolio-hover {
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
margin: 0;
-webkit-transition: all 0.3s;
transition: all 0.3s;
}
.portfolio-item:hover .portfolio-hover,
.portfolio-item:hover .portfolio-hover .portfolio-info
{
background-color: #111;
opacity: 0.7;
}
.portfolio-item:hover .portfolio-hover .portfolio-info {
bottom: 60%;
margin-bottom: -90px;
}
.portfolio-item:hover .portfolio-hover .portfolio-btn {
top: 44%;
margin-top: -55px;
opacity: 1;
}
.portfolio-hover .portfolio-info {
position: absolute;
bottom: 0%;
width: 100%;
opacity: 0;
-webkit-transform: translateY(-55%);
-ms-transform: translateY(-55%);
transform: translateY(-55%);
-webkit-transition: all 0.3s 0.2s;
transition: all 0.3s 0.2s;
}
.portfolio-hover .portfolio-btn {
position: absolute;
top: 0;
width: 100%;
opacity: 0;
text-align: center;
-webkit-transform: translateY(45%);
-ms-transform: translateY(45%);
transform: translateY(45%);
-webkit-transition: all 0.3s 0.2s;
transition: all 0.3s 0.2s;
font-size: 24px;
}
.portfolio-info,
.portfolio-info h4 a,
.portfolio-hover .portfolio-btn a {
text-align: center;
color: #222;
}
.portfolio-info h4 {
margin-bottom: 0;
font-size: 14px;
text-transform: uppercase;
letter-spacing: 1px;
font-family: 'Montserrat', sans-serif;
}
.portfolio-info p {
font-size:12px;
margin-bottom: 0;
font-style: italic;
font-weight: normal;
letter-spacing: 1px;
color: #757575;
font-family: 'Montserrat', sans-serif;
}
.portfolio-info a,
.portfolio-title a {
color: #757575;
}
/*gutter*/
.portfolio.gutter .portfolio-item {
padding: 10px;
}
/*portfolio 2 grid*/
.portfolio.col-2 .portfolio-item {
width: 49.99%;
}
/*portfolio 3 grid*/
.portfolio.col-3 .portfolio-item {
width: 33.3333333%;
}
/*portfolio 4 grid*/
.portfolio.col-4 .portfolio-item {
width: 24.98%;
}
/*portfolio 5 grid*/
.portfolio.col-5 .portfolio-item {
width: 19.99%;
}
/*portfolio 6 grid*/
.portfolio.col-6 .portfolio-item {
width: 16.666666667%;
}
.portfolio-filter {
margin:0px;
padding: 20px;
list-style: none;
}
.portfolio-filter li {
display: inline-block;
}
.portfolio-filter li a {
color: #1e1e1e;
margin: 0 10px;
font-size: 14px;
font-family: 'Open Sans', sans-serif;
padding: 10px;
text-transform: uppercase;
}
.portfolio-filter li a:hover,
.portfolio-filter li.active a{
color: #FFF;
background-color: #cee002;
border-radius: 5px;
}
.flex-container a:active, .flexslider a:active, .flex-container a:focus, .flexslider a:focus {
border: medium none;
outline: medium none;
}
.flex-control-nav {
border: medium none;
list-style: outside none none;
margin: 0;
padding: 0;
}
.flex-direction-nav {
display: none;
}
.flexslider {
margin: 0;
padding: 0;
position: relative;
}
.flex-viewport {
max-height: 2000px;
transition: all 1s ease 0s;
}
.flex-control-nav {
bottom: 15px;
margin: 0;
position: absolute;
right: 15px;
text-align: center;
z-index: 10;
}
.flex-control-nav li {
display: block;
float: left;
height: 10px;
margin: 0 3px;
width: 10px;
}
.flex-control-nav li a {
border: 1px solid #fff;
border-radius: 50%;
cursor: pointer;
display: block;
height: 10px;
text-indent: -9999px;
transition: all 0.3s ease-in-out 0s;
width: 10px;
}
.flex-control-nav li:hover a, .flex-control-nav li a.flex-active {
background-color: #fff;
}
.flex-direction-nav {
list-style: outside none none;
margin: 0;
padding: 0;
}
.flex-direction-nav {
}
.flex-direction-nav a {
background-color: rgba(0, 0, 0, 0.5);
color: rgba(0, 0, 0, 0.8);
cursor: pointer;
display: block;
height: 40px;
line-height: 40px;
margin: -40px 0 0;
overflow: hidden;
position: absolute;
text-decoration: none;
top: 50%;
transition: all 0.3s ease-in-out 0s;
width: 40px;
z-index: 200;
}
.flex-direction-nav a:hover {
background-color: rgba(0, 0, 0, 0.7);
}
.flex-direction-nav a::before {
color: #fff;
content: "";
display: block;
font-family: "fontawesome";
font-size: 16px;
text-align: center;
width: 40px;
}
.flex-direction-nav a.flex-next::before {
content: "";
}
.flex-direction-nav .flex-prev {
left: 0;
}
.flex-direction-nav .flex-next {
right: 0;
text-align: right;
}
.post-slider-thumb .flex-control-thumbs {
left: auto;
margin: 0 auto;
position: relative;
right: auto;
text-align: left;
top: 10px;
z-index: 10;
}
.post-slider-thumb .flex-control-thumbs li {
cursor: pointer;
display: inline-block;
float: none;
height: auto;
margin: 0 3px 0 0;
width: 80px;
}
.post-slider .flex-direction-nav, .post-slider-thumb .flex-direction-nav {
display: block;
}
.post-slider .flex-direction-nav .flex-prev, .post-slider .flex-direction-nav .flex-next, .post-slider-thumb .flex-direction-nav .flex-prev, .post-slider-thumb .flex-direction-nav .flex-next {
opacity: 0;
}
.post-slider:hover .flex-direction-nav .flex-prev, .post-slider:hover .flex-direction-nav .flex-next, .post-slider-thumb:hover .flex-direction-nav .flex-prev, .post-slider-thumb:hover .flex-direction-nav .flex-next {
opacity: 1;
}
.post-list-aside .post-img img {
border: 2px solid transparent;
}
.post-list-aside .post-img img.flex-active {
border: 2px solid rgba(0, 0, 0, 0.8);
}
.post-slider .flex-control-thumbs {
display: none;
}
.project-description i {
font-size: 14px;
}
/***
====================================================================
23.Gallery style Two
====================================================================
***/
.default-gallery-item{
position:relative;
padding:0px;
}
.default-gallery-item .inner-box{
position:relative;
display:block;
overflow:hidden;
}
.default-gallery-item .image-box{
position:relative;
display:block;
}
.default-gallery-item .image-box img{
position:relative;
display:block;
width:100%;
}
.default-gallery-item .overlay-box{
position:absolute;
left:0px;
top:0px;
width:100%;
height:100%;
text-align:center;
background:rgba(206, 224, 2, 0.85);
color:#ffffff;
opacity:0;
transition: all 500ms ease;
-webkit-transition: all 500ms ease;
-ms-transition: all 500ms ease;
-o-transition: all 500ms ease;
-moz-transition: all 500ms ease;
-webkit-transform:scale(0);
-ms-transform:scale(0);
-o-transform:scale(0);
-moz-transform:scale(0);
transform:scale(0);
}
.default-gallery-item .inner-box:hover .overlay-box{
opacity:1;
-webkit-transform:scale(1);
-ms-transform:scale(1);
-o-transform:scale(1);
-moz-transform:scale(1);
transform:scale(1);
}
.default-gallery-item .overlay-inner{
position:absolute;
left:0px;
top:0px;
width:100%;
height:100%;
display:table;
vertical-align:middle;
padding:10px 30px;
}
.default-gallery-item .overlay-inner .content{
position:relative;
display:table-cell;
vertical-align:middle;
}
.default-gallery-item .overlay-inner h3{
font-size:18px;
color:#ffffff;
letter-spacing:1px;
text-transform:uppercase;
}
.default-gallery-item .overlay-inner p{
font-size:10px;
color:#FFF;
text-transform:uppercase;
font-family:'Roboto Slab',sans-serif;
font-weight: 600;
font-style: italic;
}
.default-gallery-item .overlay-inner h3 a{
color:#ffffff;
}
.default-gallery-item .overlay-inner .image-link{
position:relative;
display:block;
font-size:20px;
color:#ffffff;
margin-bottom:20px;
}
.default-gallery-item .overlay-inner .image-link .icon{
display:inline-block;
font-size: 30px;
}
.menu_list ul {
text-align: center;
padding-bottom: 30px;
}
.menu_list ul li {
display: inline-block;
font-family: 'Open Sans', sans-serif;
font-weight: 600;
font-size: 1em;
border:1px solid transparent;
line-height: 27px;
padding:0 33px;
margin-right:10px;
cursor:pointer;
margin-top:10px;
color: #fff;
text-transform: uppercase;
}
.menu_list ul li.filter:hover,
.menu_list ul li.filter:focus,
.menu_list ul li.filter.active {
color: #cee002;
-webkit-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}
.menu_list ul li {
position: relative;
}
.menu_list ul li.filter.active:after {
background: #cee002 none repeat scroll 0 0;
content: "";
height: 2px;
left: 0;
margin-left: auto;
margin-right: auto;
margin-top: 0;
position: absolute;
right: 0;
top: 30px;
width: 50px;
}
/***
====================================================================
22.What We can offer & Latest Project
====================================================================
***/
.small-line,
.small-line-2{
position: relative;
}
.small-line::after {
bottom: -5px;
content: "";
height: 5px;
left: 0;
position: absolute;
width: 50px;
background: #cee002;
}
.small-line-2::after {
bottom: -5px;
content: "";
height: 2px;
left: 0;
position: absolute;
width: 35px;
background: #cee002;
transition: all 0.7s ease 0s;
}
.small-line-center::after {
right: 0;
left: 0;
margin: auto;
bottom: -5px;
content: "";
height: 2px;
position: absolute;
width: 50px;
background: #cee002;
}
/***
====================================================================
24.Latest Project
====================================================================
***/
.latest-project .img-box, .latest-project .content-box {
display: table-cell;
}
.latest-project .img-box,.latest-project img {
position: relative;
}
.latest-project .content-box {
padding-left: 20px;
vertical-align: top;
}
.latest-project .content-box h3 {
color: #272727;
font-size: 22px;
line-height: 30px;
margin: 0 0 6px;
transition: all 0.5s ease 0s;
}
.latest-project img:after {
position: absolute;
content: "";
height: 100%;
width: 100%;
background: black;
}
.construction-deatils li a {
font-size: 10px;
font-weight: 600;
}
.construction-deatils li {
line-height: 15px;
}
.construction-deatils li i {
font-size: 10px;
margin-right: 5px;
color: #cee002;
}
.latest-project .items {
margin-bottom: 30px;
}
/***
====================================================================
24.Featured Menu Style
====================================================================
***/
.featured-box i {
font-size: 45px;
// float: left;
margin-right: 20px;
}
.featured-box h5 {
margin-top:11px;
text-transform: uppercase;
}
.featured-box p {
margin-top: 15px;
color: #bcbcbc;
padding-bottom: 10px;
}
.featured-box {
padding:38px 10px 5px 25px;
background: #FFF;
margin-bottom: 30px;
}
.featured-box:hover i {
color: #cee002;
transition: all 500ms ease;
-webkit-transition: all 500ms ease;
-ms-transition: all 500ms ease;
-o-transition: all 500ms ease;
-moz-transition: all 500ms ease;
}
.featured-box:hover {
-webkit-box-shadow: 1px 2px 7px -3px rgba(0,0,0,0.75);
-moz-box-shadow: 1px 2px 7px -3px rgba(0,0,0,0.75);
box-shadow: 0px 2px 7px -3px rgba(0,0,0,0.75);
transition: all 500ms ease;
-webkit-transition: all 500ms ease;
-ms-transition: all 500ms ease;
-o-transition: all 500ms ease;
-moz-transition: all 500ms ease;
border-left: 1px solid #cee002;
}
.featured-title h2 {
font-family: 'PT Sans', sans-serif;
color: white;
text-transform: uppercase;
line-height: 42px;
}
.featured-title h2 span {
color: #333;
}
.featured-title p {
color: white;
font-size: 13px;
}
.featured-icon {
margin-top: 30px;
text-align: center;
}
.featured-icon i {
font-size: 50px;
color: #fff;
}
.featured-icon h4 {
font-size: 20px;
color: #fff;
font-weight: normal;
line-height: 40px;
letter-spacing: 0;
}
.featured-icon h4:before {
content: "";
position: absolute;
left: 0;
right: 0;
margin: auto;
bottom: 0px;
width: 65px;
height: 1px;
background: #FFF;
}
.featured-icon h4::after {
content: "";
position: absolute;
left: 0;
right: 0;
margin: auto;
bottom: 0px;
width: 35px;
height: 1px;
top: 45px;
background: #FFF;
}
.icon-box li {
padding-right: 15px;
padding-left: 0;
}
.featured-icon:hover span,
.featured-icon:hover h4 {
color: #222;
cursor: pointer;
transition:all 500ms ease-in-out;
-moz-transition:all 500ms ease-in-out;
-webkit-transition:all 500ms ease-in-out;
-ms-transition:all 500ms ease-in-out;
-o-transition:all 500ms ease-in-out;
}
.featured-icon:hover h4:before,
.featured-icon:hover h4:after {
background-color: #222;
transition:all 500ms ease;
-moz-transition:all 500ms ease;
-webkit-transition:all 500ms ease;
-ms-transition:all 500ms ease;
-o-transition:all 500ms ease;
}
/***
====================================================================
15.Our Departments
====================================================================
***/
.department-item {
overflow: hidden;
margin-bottom: 30px;
}
.department-title {
color: #FFF;
position: absolute;
bottom: -20px;
left: 20px;
padding-right: 20px;
transition:all 500ms ease;
-moz-transition:all 500ms ease;
-webkit-transition:all 500ms ease;
-ms-transition:all 500ms ease;
-o-transition:all 500ms ease;
}
.department-title h6,.department-title a {
color: #fff;
}
.department-title h6 {
letter-spacing: 5px;
}
.department-item .thumb {
position: relative;
}
.department-item .thumb:before {
position: absolute;
height: 100%;
width: 100%;
top: 0;
left: 0;
right: 0;
content: '';
transition:all 500ms ease;
-moz-transition:all 500ms ease;
-webkit-transition:all 500ms ease;
-ms-transition:all 500ms ease;
-o-transition:all 500ms ease;
background: -webkit-linear-gradient(bottom,rgba(6,35,57,.7),rgba(0,0,0,0));
background: -moz-linear-gradient(bottom,rgba(26,35,57,.7),rgba(0,0,0,0)); /* FF3.6-15 */
background: linear-gradient(bottom,rgba(6,35,57,.7),rgba(0,0,0,0));
}
.department-item:hover .thumb::before {
background: rgba(6,35,57,.9);
}
.department-item .department-dtls {
transition:all 500ms ease;
-moz-transition:all 500ms ease;
-webkit-transition:all 500ms ease;
-ms-transition:all 500ms ease;
-o-transition:all 500ms ease;
opacity: 0;
}
.department-item:hover .department-title,.department-item:hover .department-dtls {
bottom: 20px;
opacity: 1;
}
/***
====================================================================
25.404 Section Style
====================================================================
***/
.error li h2 {
font-size: 200px;
letter-spacing: 1px;
line-height: 1;
}
.error ul .zero {
font-size: 72px;
font-style: italic;
background-color: #cee002;
border-radius: 50%;
width: 150px;
height: 150px;
padding-top: 50px;
vertical-align: text-bottom;
font-weight: 300;
font-family: 'Playfair Display', serif;
}
.error h3 {
font-size: 48px;
color: #cee002;
font-style: italic;
font-weight: 300;
font-family: 'Playfair Display', serif;
}
/***
====================================================================
26.inner Page style
====================================================================
***/
.inner-title h2 {
color: #fff;
font-family: 'PT Sans', sans-serif;
font-size: 35px;
text-transform: uppercase;
line-height: 1.3;
}
.inner-title p {
color: #fff;
}
.inner-blog-grid .post {
padding-bottom: 30px;
}
.inner-blog-grid .post .post-info {
margin-top: 10px;
}
.inner-blog-grid .post .post-body {
padding-left: 0;
}
.inner-about .service-item img {
float: left;
width: 70px;
height: 70px;
}
.inner-about .service-item .content {
padding-left: 100px;
}
.inner-about .service-item {
padding-bottom: 30px;
}
.inner-blog-single .media-left {
padding-right: 30px;
}
.post .media-left {
overflow: hidden;
}
.post .media-left img {
transition: all .2s ease-in-out;
}
.post:hover .media-left img {
transform: scale(1.1);
}
.inner-blog-single .post h3 {
font-weight: 400px;
margin-top: 30px;
}
.inner-blog-single .post .post-italic {
font-family: 'Roboto Condensed', sans-serif;
font-style: italic;
color: #333;
font-size: 16px;
margin-top: 20px;
margin-bottom: 15px;
}
blockquote {
background-color: #f5f2eb;
font-size: 17.5px;
margin: 0 0 20px;
padding: 30px 17px;
border-left: 0px;
font-weight: 600;
}
.inner-blog-single .post-list li i {
color: #cee002;
margin-right: 15px;
}
.inner-blog-single .post-list {
font-size: 14px;
}
.inner-service .about-item {
margin-bottom: 30px;
}
.comment-heading {
font-size: 16px;
font-weight: 400;
}
.blog.classic .post {
margin-bottom: 40px;
}
.inner-blog-single .comment-info p {
font-size: 11px;
letter-spacing: 2px;
}
.inner-blog-single .post-share-options .social-posts {
font-family: 'Lato', sans-serif;
color: #bcbcbc;
}
.inner-blog-single .social-posts a span {
color: #bcbcbc;
padding: 10px;
width: 32px;
height: 32px;
}
.inner-blog-single .social-posts a span:hover {
color: #fff;
background-color: #cee002;
border-radius: 50%;
line-height: 11px;
text-align: center;
}
.inner-blog-single .inner-media {
border-radius: 50%;
}
.inner-blog-single .post-body {
padding-left: 0;
}
#contact_form span {
color: #cee002;
}
.inner-service .about-item {
padding-bottom: 30px;
}
.post .blog-effect img,
.department-item .thumb img {
width: 100%;
}
/***
====================================================================
Map Section Style
====================================================================
***/
/*
// .map-section{
// position:relative;
// }
// .map-section .map-container{
// position:relative;
// height:450px;
// }
// .map-section.extended .map-container{
// height:500px;
// }
// .map-section .map-data{
// text-align:center;
// font-size:14px;
// font-weight:400;
// font-family:'Roboto',sans-serif;
// }
// .map-section .map-data h6{
// font-size:18px;
// text-align:center;
// margin-bottom:5px;
// color:#2e2e2e;
// font-weight:700;
// font-family:'Roboto',sans-serif;
// }
// .map-section {
// position: relative;
// background: #f6f6f6;
// }
// .google-map {
// position: relative;
// width: 100%;
// height: 399px;
// }
// .map-section .content {
// position: absolute;
// bottom: -10px;
// width: 100%;
// }
// .map-section .content p {
// position: relative;
// font-size: 13px;
// font-weight: 400;
// color: #999999;
// line-height: 30px;
// padding: 48px 30px;
// background: #fff;
// display: inline-block;
// }
// .map-section .content p b {
// color: #808080;
// }
*/
/***
====================================================================
27.Theme Margin And Padding
====================================================================
***/
/*Padding*/
.pn {
padding: 0 !important;
}
.p10 {
padding: 10px;
}
.p20 {
padding: 30px;
}
.p30 {
padding: 30px;
}
.p40 {
padding: 40px;
}
.p50 {
padding: 50px;
}
.p60 {
padding: 60px;
}
.p70 {
padding: 70px;
}
.p80 {
padding: 80px;
}
.p90 {
padding: 90px;
}
/*// Padding None*/
.pln {
padding-left: 0;
}
.prn {
padding-right: 0;
}
.ptn {
padding-top: 0 !important;
}
.pbn {
padding-bottom: 0 !important;
}
/*// Padding Top*/
.pt10 {
padding-top: 10px;
}
.pt20 {
padding-top: 20px;
}
.pt30 {
padding-top: 30px;
}
.pt40 {
padding-top: 40px;
}
.pt50 {
padding-top: 50px;
}
.pt70 {
padding-top: 70px;
}
.pt100 {
padding-top: 100px;
}
.pt200 {
padding-top: 200px;
}
/*// Padding Bottom*/
.pb10 {
padding-bottom: 10px;
}
.pb20 {
padding-bottom: 20px;
}
.pb30 {
padding-bottom: 30px;
}
.pb40 {
padding-bottom: 40px;
}
.pb50 {
padding-bottom: 50px;
}
.pb100 {
padding-bottom: 100px;
}
.pb200 {
padding-bottom: 200px;
}
/*// Margin Right*/
.prn {
padding-right: 0;
}
.pr10 {
padding-right: 10px;
}
.pr15 {
padding-right: 15px;
}
.pr20 {
padding-right: 20px;
}
.pr30 {
padding-right: 30px;
}
.pr40 {
padding-right: 40px;
}
.pr50 {
padding-right: 50px;
}
/*// Margin Right*/
.pln {
padding-left: 0;
}
.pl10 {
padding-left: 10px;
}
.pl15 {
padding-left: 15px;
}
.pl20 {
padding-left: 20px;
}
.pl30 {
padding-left: 30px;
}
.pl40 {
padding-left: 40px;
}
.pl50 {
padding-left: 50px;
}
/*// Margin None*/
.mln {
margin-left: 0;
}
.mrn {
margin-right: 0;
}
.mtn {
margin-top: 0;
}
.mbn {
margin-bottom: 0;
}
/*// Margin Top*/
.mt10 {
margin-top: 10px;
}
.mt15 {
margin-top: 15px;
}
.mt20 {
margin-top: 20px;
}
.mt-30 {
margin-top: -50px;
z-index: 99;
}
.mt30 {
margin-top: 30px;
}
.mt40 {
margin-top: 40px;
}
.mt50 {
margin-top: 50px;
}
/*// Margin Bottom*/
.mb10 {
margin-bottom: 10px;
}
.mb15 {
margin-bottom: 15px;
}
.mb20 {
margin-bottom: 20px;
}
.mb30 {
margin-bottom: 30px;
}
.mb40 {
margin-bottom: 40px;
}
.mb50 {
margin-bottom: 50px;
}
/*// Margin Right*/
.mrn {
margin-right: 0;
}
.mr10 {
margin-right: 10px;
}
.mr15 {
margin-right: 15px;
}
.mr20 {
margin-right: 20px;
}
.mr30 {
margin-right: 30px;
}
.mr40 {
margin-right: 40px;
}
.mr50 {
margin-right: 50px;
}
/*// Margin Right*/
.mln {
margin-left: 0;
}
.ml10 {
margin-left: 10px;
}
.ml15 {
margin-left: 15px;
}
.ml20 {
margin-left: 20px;
}
.ml30 {
margin-left: 30px;
}
.ml40 {
margin-left: 40px;
}
.ml50 {
margin-left: 50px;
}
// Font Size
.fz30 {
font-size: 30px !important;
}
.fz2 {
font-size: 2.5em !important;
}
.fz3 {
font-size: 3em;
}
.fz4 {
font-size: 4em;
}
.letter-spacing-2 {
letter-spacing: 2px;
}
.letter-spacing-3 {
letter-spacing: 3px;
}
.letter-spacing-4 {
letter-spacing: 4px;
}
.letter-spacing-5 {
letter-spacing: 5px;
}
h1.error-font {
font-size: 6em;
}
.bg-img {
background-attachment: fixed;
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
}
.bg-dots {
background: rgba(0, 0, 0, 0) url("../images/dots2.png") repeat scroll 0 0;
}
.border-1 {
border-color: #eee;
border-style: solid;
border-width: 5px;
}
.txt-color-white {
color: #FFF;
}
.carousel-col-2 .owl-controls {
margin: 0;
padding: 0;
}
.carousel-col-2 .owl-dots {
position: relative;
top: 50px;
}
.carousel-col-2 .owl-dots .owl-dot {
margin-right: 5px;
}
.carousel-col-2 .owl-dots .owl-dot span {
background-color: #fff;
width: 18px;
height: 18px;
margin: 0;
border: 2px solid #fff;
-webkit-border-radius: 0;
-moz-border-radius: 0;
-o-border-radius: 0;
-ms-border-radius: 0;
border-radius: 0;
}
.carousel-col-2 .owl-dots .active span,
.owl-theme .owl-dots .owl-dot:hover span {
background-color: #cee002 !important;
}
.flexslider {
margin: 0 auto;
box-shadow: none;
min-height: 600px;
border: none;
}
.flexslider li {
position: relative;
}
.flexslider li .meta {
position: absolute;
bottom: 200px;
left: 60px;
color: white;
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: flex-start;
}
.flexslider li h1 {
background: rgba(51, 51, 51, 0.5);
padding: 12px 18px 12px;
margin-bottom: 0;
font-size: 3em;
font-weight: 300;
}
.flexslider li h2 {
background: rgba(51, 51, 51, 0.5);
padding: 13px 18px 11px;
font-size: 1.1em;
margin-bottom: 0;
font-weight: 300;
}
.flexslider li .category {
display: flex;
flex-direction: row;
}
.flexslider li .category p {
background: #e43837;
margin-right: 7px;
font-size: 1.1em;
padding: 12px 18px 10px;
font-weight: 300;
}
.flexslider li .category span {
background: #e43837;
margin-top: 17px;
padding: 8px 12px 0;
font-size: 0.9em;
font-weight: 300;
height: 26px;
}
.flexslider li h1,
.flexslider li h2,
.flexslider li .category p,
.flexslider li .category span {
-webkit-animation-duration: .6s;
animation-duration: .6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-animation-name: fadeOutLeft;
animation-name: fadeOutLeft;
}
.flexslider li.flex-active-slide .meta h1,
.flexslider li.flex-active-slide .meta h2,
.flexslider li.flex-active-slide .meta .category p,
.flexslider li.flex-active-slide .meta .category span {
-webkit-animation-delay: .4s;
animation-delay: .4s;
-webkit-animation-duration: .6s;
animation-duration: .6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-animation-name: fadeInLeft;
animation-name: fadeInLeft;
}
.flexslider li.flex-active-slide .meta h2 {
-webkit-animation-delay: .5s;
animation-delay: .5s;
}
.flexslider li.flex-active-slide .meta .category p {
-webkit-animation-delay: .6s;
animation-delay: .6s;
}
.flexslider li.flex-active-slide .meta .category span {
-webkit-animation-delay: .8s;
animation-delay: .8s;
}
.flex-direction-nav {
position: absolute;
top: 0;
left: 30px;
}
.flex-direction-nav a {
text-decoration: none;
display: block;
width: 30px;
height: 30px;
background-color: #333;
margin: -20px 0 0;
position: absolute;
top: 50px;
z-index: 10;
overflow: hidden;
opacity: .5;
cursor: pointer;
color: #fff;
-webkit-transition: all .3s ease;
-moz-transition: all .3s ease;
transition: all .3s ease;
}
.flex-direction-nav .flex-prev {
text-align: left;
left: -10px;
}
.flex-direction-nav .flex-next {
text-align: right;
left: 30px;
}
.flexslider:hover .flex-prev {
left: -10px;
}
.flexslider:hover .flex-next {
left: 30px;
}
.flexslider:hover .flex-next:hover,
.flexslider:hover .flex-prev:hover {
opacity: 1;
}
.flex-direction-nav a:before {
font-family: FontAwesome;
content: '\f104';
font-size: 25px;
display: flex;
justify-content: center;
align-items: center;
position: relative;
top: 0;
padding: 2px;
font-size: 19px;
line-height: 27px;
}
.flex-direction-nav a.flex-next:before {
content: '\f105';
}
@-webkit-keyframes fadeInLeft {
0% {
opacity: 0;
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
@keyframes fadeInLeft {
0% {
opacity: 0;
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
@-webkit-keyframes fadeOutLeft {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes fadeOutLeft {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
.bx-wrapper {
border: none;
}
#bx-pager {
text-align: center;
margin-top: 20px;
}
#bx-pager a {
margin: 0 3px;
}
.bx-wrapper, .bx-viewport {
height: 600px !important; //provide height of slider
}
#carousel {
width:800px;
height: 300px;
display: relative;
}
#carousel img {
display: hidden; /* hide images until carousel prepares them */
cursor: pointer; /* not needed if you wrap carousel items in links */
}
// Type Text Slider
.typing-slider h1 a.typewrite {
color: #FFF !important;
}
.typing-slider {
padding: 200px 0;
font-size: 1.2em;
}
// Swiper Slider
.swiper-container {
width: 300px;
height: 300px;
padding: 50px;
}
.swiper-slide {
background-position: center;
background-size: cover;
width: 300px;
height: 700px;
}
.style-two.overlayer.default-overlay.parallax.verstion {
padding: 200px 0;
}
.personal-info h1 {
font-size: 3.5em;
line-height: 70px;
}
/*
====================================================================
28. Shop Style css Start
====================================================================
*/
.cs-product-area {
width: 100%;
padding: 80px 0px 50px;
overflow: hidden;
}
.cs-product-col {
border: 1px solid #E6E6E6;
margin-bottom: 30px;
-webkit-transition: all 0.6s ease-in-out;
-moz-transition: all 0.6s ease-in-out;
-o-transition: all 0.6s ease-in-out;
-ms-transition: all 0.6s ease-in-out;
transition: all 0.6s ease-in-out;
}
.cs-product-col:hover {
border-color: #FFC41B;
-webkit-transition: all 0.6s ease-in-out;
-moz-transition: all 0.6s ease-in-out;
-o-transition: all 0.6s ease-in-out;
-ms-transition: all 0.6s ease-in-out;
transition: all 0.6s ease-in-out;
}
.cs-product-item {
position: relative;
overflow: hidden;
color: #fff;
}
.cs-product-item .cs-product-content {
text-align: center;
padding-top: 35px;
-webkit-transition: all 1s ease-in-out;
-moz-transition: all 1s ease-in-out;
-o-transition: all 1s ease-in-out;
-ms-transition: all 1s ease-in-out;
transition: all 1s ease-in-out;
}
.cs-product-img img {
max-width: 100%;
}
.cs-product-item:hover .cs-product-img:before,
.cs-product-item:hover .cs-product-content {
text-align: center;
top: 0;
opacity: 1;
-webkit-transition: all 0.6s ease-in-out;
-moz-transition: all 0.6s ease-in-out;
-o-transition: all 0.6s ease-in-out;
-ms-transition: all 0.6s ease-in-out;
transition: all 0.6s ease-in-out;
}
.cs-product-item .cs-product-img:before,
.cs-product-content {
background-color: rgba(6, 35, 57, 0.7);
content: " ";
height: 100%;
left: 0%;
position: absolute;
top: 99%;
opacity: 0;
width: 100%;
z-index: 0;
}
.cs-product-area .cs-product-content p span {
color: #FFC41B;
}
.cs-product-area .cs-product-content .cs-my-btn {
margin-top: 10px;
}
.cs-my-btn {
background: #b09991 none repeat scroll 0 0;
border: medium none;
border-radius: 0;
color: #fff;
padding: 12px 15px;
text-transform: uppercase;
transition: all 0.3s ease-in-out 0s;
}
.cs-my-btn:hover {
background: rgba(246, 138, 21, 0.5) none repeat scroll 0 0;
color: #fff;
transition: all 0.3s ease-in-out 0s;
}
.cs-product-area .cs-product-content .cs-icon-box {
width: 132px;
height: 35px;
background: #062339;
padding: 5px;
padding-top: 8px;
margin: auto;
margin-top: 10px;
text-align: center;
}
.cs-product-area .cs-product-content .cs-icon-box span {
margin-left: 10px;
margin-right: 10px;
color: #ffffff;
font-size: 14px;
}
.cs-product-area .cs-product-content .cs-icon-box span:hover {
color: #FFC41B;
}
.cs-product-area h4 span {
color: #264dc2;
}
.cs-filter-price {
background: #F7F7F7;
padding: 30px;
margin-bottom: 30px;
}
.cs-product-single-col {
border: none !important;
}
.cs-product-single-col img {
margin-bottom: 20px;
}
.accordion dt a.active {
color: #b09991;
}
.accordion dt a {
color: #333;
}
.accordion dt {
border: 1px solid #333;
padding: 15px 26px;
font-size: 14px;
margin-bottom: 15px;
}
.accordion dd {
padding: 20px;
background-color: #eee;
margin-bottom: 15px;
}
.accordion .form-group label {
font-size: 16px;
margin-bottom: 15px;
}
.cart-total li {
margin-top: 20px;
}
.cart-total span {
float: right;
}
.cart-total li:last-child {
margin-top: 0;
}
.cart-item .form-group {
border: 1px solid #eee;
}
.border-1 {
width: 100%;
height: 1px;
background-color: #eee;
margin-top: 20px;
margin-bottom: 5px;
}
.border-2 {
border: 2px solid #eee;
}
.btn-cart {
background: #b09991;
color: #FFF;
padding: 12px 15px;
text-transform: uppercase;
border: none;
border-radius: 0px;
-moz-border-radius: 0px;
-webkit-border-radius: 0px;
-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
-ms-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}
.btn-cart:hover {
background: #FFC41B;
color: #FFF !important;
-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
-ms-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}
.btn-shop {
background: #333;
color: #FFF;
padding: 12px 15px;
text-transform: uppercase;
border: none;
border-radius: 0px;
-moz-border-radius: 0px;
-webkit-border-radius: 0px;
-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
-ms-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}
.btn-shop:hover {
background: #264DC2;
color: #FFF !important;
-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
-ms-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}
.cs-chat-area .cs-checkbox {
background: rgba(0, 0, 0, 0.85);
padding: 15px;
color: #ffffff;
margin-bottom: 20px;
}
.cs-chat-area .cs-table {
border: 1px solid #ECF0F1;
margin-bottom: 20px;
}
.cs-table>tbody>tr>td {
border-top: none;
padding: 0px;
}
.cs-heading {
background: #ECF0F1;
}
.cs-table h4 {
margin-bottom: 0px;
padding: 20px 30px;
}
.cs-table-content {
border-bottom: 1px solid #ECF0F1;
}
.cs-table-content .cs-pad {
padding: 20px 20px 20px 30px !important;
}
.cs-table-content img {
width: 88px;
height: 90px;
}
.cs-table-content td img {
float: left;
margin-right: 10px;
}
.cs-table-content p {
margin-top: 30px;
}
.cs-table-content .form-control {
width: 65px;
margin-top: 30px;
border: 1px solid #ECF0F1;
}
.cs-couponbox {
border: 1px solid #ECF0F1;
padding: 30px 30px 20px 30px;
}
.cs-couponbox .cs-coupon-input {
border: 1px solid #ECF0F1;
height: 44px;
}
.cs-coupon-btn {
border-radius: 0px;
background: #FFC41B;
border: 1px solid #ECF0F1;
color: #ffffff;
height: 44px;
}
.cs-coupon-btn:hover {
color: #ffffff;
background: #264DC2;
border: 2px solid #ECF0F1;
}
.cs-calculate-area {
width: 100%;
padding: 0px 0px 50px;
}
.cs-calculate-area .cs-calculate-col {
margin-bottom: 30px;
}
.cs-calculate-area .cs-calculate-col h3 {
margin-bottom: 20px;
}
.cs-calculate-area .cs-calculate-col .form-control {
border: 1px solid #ECF0F1;
margin-bottom: 20px;
height: 44px;
}
.cs-calculate-area .cs-calculate-col .table {
border: 1px solid #ECF0F1;
}
.cs-calculate-area .cs-calculate-col .table>tbody>tr {
border-bottom: 1px solid #ECF0F1;
;
}
.cs-calculate-area .cs-calculate-col .table>tbody>tr>td {
border: none;
}
.cs-change-bgc {
background: #F9FBFB;
}
.cs-pad.cs-tab-button .btn-default {
font-size: 16px;
border-radius: 0;
padding: 12px 15px;
margin-top: 20px;
float: right;
}
.cs-pad.cs-tab-button .btn-default .icon {
font-size: 16px;
}
.cs-pad.cs-tab-button p {
float: left;
}
.table > tbody > tr > td, .table > tbody > tr > th, .table > tfoot > tr > td, .table > tfoot > tr > th, .table > thead > tr > td, .table > thead > tr > th
{
padding: 10px;
}
/*featherlight css start*/
.featherlight-next:hover, .featherlight-previous:hover {
background: rgba(0, 0, 0, 0.75);
}
.featherlight-next span, .featherlight-previous span {
font-size: 40px;
color: #FFC41B;
text-shadow: none;
}
/*featherlight css end*/
.cs-product-single-col i {
color: #FFC41B;
}
.cs-product-single-col .cs-price {
font-weight: bold;
color: #29af8a;
}
.cs-product-single-col .cs-price del {
margin-right: 20px;
color: #333333;
}
.cs-product-single-col h5 {
margin-top: 30px;
margin-bottom: 30px;
}
.cs-product-single-col .form-control {
width: 125px;
float: left;
border: 1px solid #29af8a;
margin-right: 20px;
}
.cs-add-to-cart {
margin-top: 30px;
}
.cs-add-to-cart .cs-my-btn {
margin-right: 50px;
}
.cs-add-to-cart a span {
margin-right: 10px;
color: #333333;
font-size: 16px;
}
.cs-add-to-cart a span:hover {
color: #29af8a;
}
.cs-similar-title {
margin-left: 15px;
}
.cs-similar-title p {
margin-bottom: 30px;
}
/*tab start*/
.cs-tab-area {
margin-bottom: 50px;
}
.cs-tab-content {
padding-top: 20px;
}
.cs-tab-area .cs-nav-tabs {
border-bottom: none;
}
.cs-tab-area .cs-nav-tabs>li.active>a {
background: #b09991;
color: #ffffff;
border-radius: 0px;
border: none;
}
.cs-tab-area .cs-nav-tabs>li>a {
color: #333333;
background: #EEEEEE;
border-radius: 0px;
border: none;
-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
-ms-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}
.cs-tab-area .cs-nav-tabs>li>a:hover {
border: none;
background: #b09991;
color: #ffffff;
-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
-ms-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}
.cs-tab-content h4 {
line-height: 1.4;
}
.woocommerce-result-count, .woocommerce-ordering {
float: left;
line-height: 2.5em;
margin: 0 0 2em;
width: 50%;
}
.nstSlider {
background: rgba(0, 0, 0, 0.07);
height: 8px;
width: 100%;
}
.nstSlider .bar {
background: transparent;
}
.nstSlider .leftGrip, .nstSlider .rightGrip {
background: #b09991;
top: -5px;
}
.filterprice .price,.filterprice .leftLabel,.filterprice .rightLabel {
float: left;
}
.filterprice button {
float: right;
}
.cs-product-single-col {
border: 1px solid rgba(6, 35, 57, 0.7);
}
/* these styles are for the demo, but are not required for the plugin */
.zoom {
display:inline-block;
position: relative;
}
/* magnifying glass icon */
.zoom:after {
content:'';
display:block;
width:33px;
height:33px;
position:absolute;
top:0;
right:0;
background:url(icon.html);
}
.zoom img {
display: block;
}
.zoom img::selection { background-color: transparent; }
/*
Box Layout
*/
.boxed-layout {
max-width: 1170px;
background: #FFF;
margin-left: auto;
margin-right: auto;
position: relative;
margin-top: 20px;
}
@media (max-width: 992px) {
padding: 18px 15px;
}
.new-lable {
background: red none repeat scroll 0 0;
border-radius: 50px;
color: white;
line-height: 50px;
min-height: 50px;
position: absolute;
right: 0;
text-align: center;
top: 0;
width: 50px;
z-index: 9999;
font-weight: bold;
}