958 lines
23 KiB
CSS
958 lines
23 KiB
CSS
|
/*==================================
|
||
|
|
* Author : "ThemeSine"
|
||
|
|
* Template Name : Listrace HTML Template
|
||
|
|
* Version : 1.0
|
||
|
|
==================================== */
|
||
|
|
|
||
|
|
/*==================================
|
||
|
|
font-family: 'Roboto', sans-serif;
|
||
|
|
==================================== */
|
||
|
|
|
||
|
|
|
||
|
|
/*=========== TABLE OF CONTENTS ===========
|
||
|
|
1. General css (Reset code)
|
||
|
|
2. Header-top
|
||
|
|
3. Top-area
|
||
|
|
4. Welcome-hero
|
||
|
|
5. List-topics
|
||
|
|
6. Works
|
||
|
|
7. Explore
|
||
|
|
8. Reviews
|
||
|
|
9. Counter
|
||
|
|
10. Blog
|
||
|
|
11. Subscribe
|
||
|
|
12. Footer
|
||
|
|
==========================================*/
|
||
|
|
|
||
|
|
/*-------------------------------------
|
||
|
|
1.General css (Reset code)
|
||
|
|
--------------------------------------*/
|
||
|
|
*{
|
||
|
|
padding: 0;
|
||
|
|
margin: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
*{
|
||
|
|
-webkit-box-sizing:border-box;
|
||
|
|
-moz-box-sizing:border-box;
|
||
|
|
-o-box-sizing:border-box;
|
||
|
|
-ms-box-sizing:border-box;
|
||
|
|
box-sizing:border-box;
|
||
|
|
}
|
||
|
|
body{
|
||
|
|
font-family: 'Poppins', sans-serif;
|
||
|
|
font-size:14px;
|
||
|
|
color:#a09e9c;
|
||
|
|
text-transform:initial;
|
||
|
|
max-width:1920px;
|
||
|
|
margin:0 auto;
|
||
|
|
overflow-x:hidden;
|
||
|
|
}
|
||
|
|
|
||
|
|
a,a:hover,a:active,a:focus {
|
||
|
|
display:inline-block;
|
||
|
|
text-decoration:none;
|
||
|
|
color: #343a3f;
|
||
|
|
font-size:16px;
|
||
|
|
padding:0;
|
||
|
|
font-weight: 500;
|
||
|
|
text-transform: capitalize;
|
||
|
|
}
|
||
|
|
h1,h2,h3,h4,h5,h6 {
|
||
|
|
margin: 0;
|
||
|
|
color:#343a3f;
|
||
|
|
font-size: 18px;
|
||
|
|
font-weight: 500;
|
||
|
|
text-transform: capitalize;
|
||
|
|
}
|
||
|
|
p {
|
||
|
|
margin: 0;
|
||
|
|
color:#767f86;
|
||
|
|
font-size:14px;
|
||
|
|
line-height: 1.8;
|
||
|
|
text-transform: initial;
|
||
|
|
}
|
||
|
|
img{border:none;max-width:100%; height:auto;}
|
||
|
|
ul{
|
||
|
|
padding: 0;
|
||
|
|
margin: 0 auto;
|
||
|
|
list-style: none;
|
||
|
|
}
|
||
|
|
ul li {
|
||
|
|
list-style: none;
|
||
|
|
|
||
|
|
}
|
||
|
|
select,input,textarea,button{box-shadow:none;outline:0!important;}
|
||
|
|
button {background: transparent;border: 0;font-size: 12px;}
|
||
|
|
|
||
|
|
html,body{height: 100%;}
|
||
|
|
|
||
|
|
[placeholder]:focus::-webkit-input-placeholder {
|
||
|
|
-webkit-transition: opacity 0.3s 0.3s ease;
|
||
|
|
-moz-transition: opacity 0.3s 0.3s ease;
|
||
|
|
-ms-transition: opacity 0.3s 0.3s ease;
|
||
|
|
-o-transition: opacity 0.3s 0.3s ease;
|
||
|
|
transition: opacity 0.3s 0.3s ease;
|
||
|
|
opacity: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* section-header */
|
||
|
|
.section-header{
|
||
|
|
position: relative;
|
||
|
|
text-align: center;
|
||
|
|
}
|
||
|
|
.section-header h2{
|
||
|
|
color: #505866;
|
||
|
|
font-size:24px;
|
||
|
|
font-weight: 500;
|
||
|
|
margin-bottom: 24px;
|
||
|
|
text-transform: uppercase;
|
||
|
|
letter-spacing: 1.3px;
|
||
|
|
}
|
||
|
|
.section-header h2 span{text-transform: lowercase;}
|
||
|
|
.section-header p{
|
||
|
|
font-size:16px;
|
||
|
|
}
|
||
|
|
/* section-header */
|
||
|
|
.fix{position: relative;clear: both;}
|
||
|
|
/*=============Style css=========*/
|
||
|
|
|
||
|
|
|
||
|
|
/*-------------------------------------
|
||
|
|
2. Header-top
|
||
|
|
--------------------------------------*/
|
||
|
|
.header-top{border-bottom:1px solid #f6f8fa;}
|
||
|
|
|
||
|
|
.header-top ul li {display: inline-block;}
|
||
|
|
|
||
|
|
.header-top-left li,.header-top-right li {display: inline-block;}
|
||
|
|
|
||
|
|
/*.select-opt*/
|
||
|
|
.select-opt,.header-top-contact{
|
||
|
|
padding: 10px 18px;
|
||
|
|
border-right: 1px solid #f6f8fa;
|
||
|
|
}
|
||
|
|
.header-top-contact{
|
||
|
|
border-right: 0;
|
||
|
|
border-left: 1px solid #f6f8fa;
|
||
|
|
font-size: 12px;
|
||
|
|
}
|
||
|
|
.select-opt select {
|
||
|
|
border: none;
|
||
|
|
cursor:pointer;
|
||
|
|
color:#a7b0ba;
|
||
|
|
font-size: 12px;
|
||
|
|
font-weight: 300;
|
||
|
|
}
|
||
|
|
.select-opt option{
|
||
|
|
color:#a7b0ba;
|
||
|
|
text-transform: uppercase;
|
||
|
|
}
|
||
|
|
.select-opt a span.lnr-magnifier:before {
|
||
|
|
font-size: 12px;
|
||
|
|
color: #373939;
|
||
|
|
}
|
||
|
|
.select-opt a span.lnr-magnifier:before {
|
||
|
|
font-size: 12px;
|
||
|
|
color: #373939;
|
||
|
|
}
|
||
|
|
/*.select-opt*/
|
||
|
|
|
||
|
|
.header-top-right ul li a{
|
||
|
|
color:#a7b0ba;
|
||
|
|
font-size: 12px;
|
||
|
|
font-weight: 300;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/*-------------------------------------
|
||
|
|
3. Top-area
|
||
|
|
--------------------------------------*/
|
||
|
|
nav.navbar.bootsnav {
|
||
|
|
background-color:#fff;
|
||
|
|
border-bottom: transparent;
|
||
|
|
}
|
||
|
|
.wrap-sticky nav.navbar.bootsnav.sticked {background-color: #fff;box-shadow: 0 2px 5px rgba(0,0,0,.2);}
|
||
|
|
|
||
|
|
/*.navbar-brand*/
|
||
|
|
.navbar-header a.navbar-brand,.navbar-header a.navbar-brand:hover,.navbar-header a.navbar-brand:focus {
|
||
|
|
display: inline-block;
|
||
|
|
color: #1b1e20;
|
||
|
|
font-size: 20px;
|
||
|
|
font-weight: 700;
|
||
|
|
padding: 34px 0px;
|
||
|
|
text-transform:capitalize;
|
||
|
|
}
|
||
|
|
.navbar-header a.navbar-brand span{display: inline-block;color:#ff545a;text-transform:capitalize;}
|
||
|
|
|
||
|
|
.wrap-sticky nav.navbar.bootsnav.sticked .navbar-header a.navbar-brand,.wrap-sticky nav.navbar.bootsnav.sticked .navbar-header a.navbar-brand:hover,.wrap-sticky nav.navbar.bootsnav.sticked .navbar-header a.navbar-brand:focus {padding:30px 0px;}
|
||
|
|
/*.navbar-brand*/
|
||
|
|
|
||
|
|
/*.nav li*/
|
||
|
|
nav.navbar.bootsnav ul.nav > li > a {
|
||
|
|
color: #859098;
|
||
|
|
font-size: 14px;
|
||
|
|
font-weight: 500;
|
||
|
|
text-transform:uppercase;
|
||
|
|
-webkit-transition: 0.3s linear;
|
||
|
|
-moz-transition: 0.3s linear;
|
||
|
|
-ms-transition: 0.3s linear;
|
||
|
|
-o-transition: 0.3s linear;
|
||
|
|
transition: 0.3s linear;
|
||
|
|
}
|
||
|
|
nav.navbar.bootsnav ul.nav > li > a {padding:34px 21px;}
|
||
|
|
nav.navbar.bootsnav ul.nav > li > a:hover,nav.navbar.bootsnav ul.nav > li > a:focus{color: #ff545a;}
|
||
|
|
nav.navbar.bootsnav ul.nav > li.active>a {color: #ff545a;}
|
||
|
|
|
||
|
|
nav.navbar.bootsnav ul.nav > li.dropdown > a.dropdown-toggle:after {
|
||
|
|
content: "";
|
||
|
|
}
|
||
|
|
nav.navbar.bootsnav ul.nav > li.dropdown span {
|
||
|
|
font-size: 8px;
|
||
|
|
margin-left: 15px;
|
||
|
|
}
|
||
|
|
.wrap-sticky nav.navbar.bootsnav.sticked ul.nav > li > a{padding:34px 21px;}
|
||
|
|
/*.nav li*/
|
||
|
|
|
||
|
|
/*.menu-ui-design*/
|
||
|
|
.menu-ui-design{overflow-y:scroll;height: 350px;}
|
||
|
|
.menu-ui-design::-webkit-scrollbar {
|
||
|
|
width:5px;
|
||
|
|
}
|
||
|
|
.menu-ui-design::-webkit-scrollbar-track {
|
||
|
|
-webkit-box-shadow: inset 0 0 8px #000;
|
||
|
|
}
|
||
|
|
.menu-ui-design::-webkit-scrollbar-thumb {
|
||
|
|
background-color: #ff545a;
|
||
|
|
}
|
||
|
|
/*.menu-ui-design*/
|
||
|
|
|
||
|
|
/*.navbar-toggle */
|
||
|
|
nav.navbar.bootsnav .navbar-toggle {
|
||
|
|
position: relative;
|
||
|
|
background-color: transparent;
|
||
|
|
border: 1px solid #ff545a;
|
||
|
|
padding: 10px;
|
||
|
|
top: 0;
|
||
|
|
}
|
||
|
|
nav.navbar.bootsnav .navbar-toggle i{color: #ff545a;}
|
||
|
|
/*.navbar-toggle */
|
||
|
|
|
||
|
|
/*-------------------------------------
|
||
|
|
4. Welcome-hero
|
||
|
|
--------------------------------------*/
|
||
|
|
.welcome-hero {
|
||
|
|
position: relative;
|
||
|
|
background:url(../images/wurscht.png)no-repeat;
|
||
|
|
background-position:center;
|
||
|
|
background-size:cover;
|
||
|
|
text-align: center;
|
||
|
|
height:800px;
|
||
|
|
z-index: 1;
|
||
|
|
}
|
||
|
|
.welcome-hero:before{
|
||
|
|
position: absolute;
|
||
|
|
content: " ";
|
||
|
|
top: 0;
|
||
|
|
left: 0;
|
||
|
|
width: 100%;
|
||
|
|
height: 100%;
|
||
|
|
background:rgba(65,73,89,.65);
|
||
|
|
z-index: -1;
|
||
|
|
}
|
||
|
|
.welcome-hero-txt { padding-top: 155px;}
|
||
|
|
|
||
|
|
.welcome-hero-txt h2 {
|
||
|
|
font-size: 48px;
|
||
|
|
color: #fff;
|
||
|
|
font-weight: 700;
|
||
|
|
text-transform: uppercase;
|
||
|
|
letter-spacing: 2.4px;
|
||
|
|
line-height: 1.4;
|
||
|
|
}
|
||
|
|
.welcome-hero-txt p {
|
||
|
|
font-size: 18px;
|
||
|
|
color: #fcfcfc;
|
||
|
|
margin-top: 25px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.welcome-hero-serch-box{margin-top: 78px;display: flex;}
|
||
|
|
.welcome-hero-form {
|
||
|
|
display: flex;
|
||
|
|
background: #fff;
|
||
|
|
height: 70px;
|
||
|
|
border-radius: 3px;
|
||
|
|
width: 85%;
|
||
|
|
}
|
||
|
|
.single-welcome-hero-form {
|
||
|
|
position: relative;
|
||
|
|
display: flex;
|
||
|
|
flex-direction: row;
|
||
|
|
align-items: center;
|
||
|
|
width: 50%;
|
||
|
|
padding: 0 30px;
|
||
|
|
}
|
||
|
|
.single-welcome-hero-form:first-child{border-right: 1px solid #edeff1;}
|
||
|
|
.single-welcome-hero-form input {
|
||
|
|
margin-left: 10px;
|
||
|
|
height: 70px;
|
||
|
|
width: 300px;
|
||
|
|
border: 0;
|
||
|
|
background: transparent;
|
||
|
|
}
|
||
|
|
.single-welcome-hero-form input[type="text"]{
|
||
|
|
font-size: 14px;
|
||
|
|
color: #859098;
|
||
|
|
text-transform: capitalize;
|
||
|
|
font-weight: 500;
|
||
|
|
}
|
||
|
|
.welcome-hero-form-icon {
|
||
|
|
position: absolute;
|
||
|
|
top: 20px;
|
||
|
|
right: 30px;
|
||
|
|
color: #252d32;
|
||
|
|
}
|
||
|
|
.welcome-hero-btn {
|
||
|
|
display: flex;
|
||
|
|
justify-content: center;
|
||
|
|
align-items: center;
|
||
|
|
font-size: 14px;
|
||
|
|
color: #fff;
|
||
|
|
width: 170px;
|
||
|
|
height: 70px;
|
||
|
|
background: #ff545a;
|
||
|
|
text-transform: capitalize;
|
||
|
|
margin-left: 30px;
|
||
|
|
border-radius: 3px;
|
||
|
|
-webkit-transition: 0.3s linear;
|
||
|
|
-moz-transition: 0.3s linear;
|
||
|
|
-ms-transition: 0.3s linear;
|
||
|
|
-o-transition: 0.3s linear;
|
||
|
|
transition: 0.3s linear;
|
||
|
|
}
|
||
|
|
.welcome-hero-btn:hover{/*background: #fd4043;*/background: #f43032;}
|
||
|
|
|
||
|
|
.welcome-hero-btn svg {
|
||
|
|
width: 14px;
|
||
|
|
height: auto;
|
||
|
|
margin-left: 12px;
|
||
|
|
}
|
||
|
|
|
||
|
|
[class^="icon-"]:before, [class*=" icon-"]:before,
|
||
|
|
[class^="icon-"]:after, [class*=" icon-"]:after {
|
||
|
|
font-size: 20px;
|
||
|
|
font-style: normal;
|
||
|
|
margin-left: 0px;
|
||
|
|
}
|
||
|
|
|
||
|
|
/*-------------------------------------
|
||
|
|
5. List-topuics
|
||
|
|
--------------------------------------*/
|
||
|
|
.list-topics-content {
|
||
|
|
position: relative;
|
||
|
|
top: -98px;
|
||
|
|
z-index: 1;
|
||
|
|
}
|
||
|
|
.list-topics-content ul li { display: inline-block;}
|
||
|
|
|
||
|
|
.single-list-topics-content{
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
flex-direction: column;
|
||
|
|
justify-content: center;
|
||
|
|
width: 205px;
|
||
|
|
height: 170px;
|
||
|
|
background:#fff;
|
||
|
|
border-radius: 3px;
|
||
|
|
margin-right: 20px;
|
||
|
|
margin-bottom: 20px;
|
||
|
|
box-shadow: 0 0px 10px rgba(71,71,71,.2);
|
||
|
|
-webkit-transition: .3s linear;
|
||
|
|
-moz-transition:.3s linear;
|
||
|
|
-ms-transition:.3s linear;
|
||
|
|
-o-transition:.3s linear;
|
||
|
|
transition: .3s linear;
|
||
|
|
}
|
||
|
|
.single-list-topics-content h2>a { margin: 13px 0;}
|
||
|
|
/*.single-list-topics-content:last-child{margin-right: 0;}*/
|
||
|
|
|
||
|
|
.single-list-topics-icon [class^="icon-"]:before,.single-list-topics-icon [class*=" icon-"]:before,.single-list-topics-icon [class^="icon-"]:after,.single-list-topics-icon [class*=" icon-"]:after {font-size: 45px;color:#343a3f;}
|
||
|
|
.single-list-topics-content:hover .single-list-topics-icon [class^="icon-"]:before,.single-list-topics-content:hover .single-list-topics-icon [class*=" icon-"]:before,.single-list-topics-content:hover .single-list-topics-icon [class^="icon-"]:after,.single-list-topics-content:hover .single-list-topics-icon [class*=" icon-"]:after {color:#fff;}
|
||
|
|
|
||
|
|
.single-list-topics-content:hover h2>a,.single-list-topics-content:hover p{color: #fff!important;}
|
||
|
|
.single-list-topics-content:hover{
|
||
|
|
color: #fff;
|
||
|
|
background:#ff545a;
|
||
|
|
box-shadow: 0 5px 10px rgba(71,71,71,.4);
|
||
|
|
}
|
||
|
|
|
||
|
|
/*-------------------------------------
|
||
|
|
6. Works
|
||
|
|
--------------------------------------*/
|
||
|
|
.works{padding: 0 0 90px;}
|
||
|
|
.works-content {margin-top: 73px;}
|
||
|
|
|
||
|
|
.single-how-works{
|
||
|
|
text-align: center;
|
||
|
|
padding:50px 42px;
|
||
|
|
border-radius: 3px;
|
||
|
|
box-shadow: 0 0px 5px rgba(71,71,71,.2);
|
||
|
|
margin-bottom: 30px;
|
||
|
|
-webkit-transition: .3s linear;
|
||
|
|
-moz-transition:.3s linear;
|
||
|
|
-ms-transition:.3s linear;
|
||
|
|
-o-transition:.3s linear;
|
||
|
|
transition: .3s linear;
|
||
|
|
}
|
||
|
|
|
||
|
|
.single-how-works-icon {
|
||
|
|
display: inline-block;
|
||
|
|
color: #50616c;
|
||
|
|
width: 80px;
|
||
|
|
height: 80px;
|
||
|
|
line-height: 80px;
|
||
|
|
background: #eef2f6;
|
||
|
|
border-radius: 50%;
|
||
|
|
}
|
||
|
|
.single-how-works h2 a {
|
||
|
|
font-size: 18px;
|
||
|
|
margin: 35px 0 20px;
|
||
|
|
}
|
||
|
|
.single-how-works h2 a span {text-transform: lowercase;}
|
||
|
|
.single-how-works p {margin-bottom: 25px;text-transform: initial;}
|
||
|
|
|
||
|
|
.single-how-works-icon [class^="icon-"]:before,.single-how-works-icon [class*=" icon-"]:before,.single-how-works-icon [class^="icon-"]:after,.single-how-works-icon [class*=" icon-"]:after {font-size: 35px;}
|
||
|
|
.single-how-works:hover .single-how-works-icon [class^="icon-"]:before,.single-how-works:hover .single-how-works-icon [class*=" icon-"]:before,.single-how-works:hover .single-how-works-icon [class^="icon-"]:after,.single-how-works:hover .single-how-works-icon [class*=" icon-"]:after {color:#ff545a;}
|
||
|
|
|
||
|
|
.welcome-hero-btn.how-work-btn {
|
||
|
|
display: inline-block;
|
||
|
|
margin: 0;
|
||
|
|
width: 100px;
|
||
|
|
height: 35px;
|
||
|
|
font-size: 12px;
|
||
|
|
background: transparent;
|
||
|
|
color: #767f86;
|
||
|
|
border: 1px solid #d3d6d9;
|
||
|
|
border-radius: 3px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.single-how-works:hover h2 a,.single-how-works:hover p{color: #fff;}
|
||
|
|
.single-how-works:hover .single-how-works-icon{background: #fff;}
|
||
|
|
.single-how-works:hover .welcome-hero-btn.how-work-btn{background: #fff;color: #ff545a;}
|
||
|
|
.single-how-works:hover{box-shadow: 0 0px 10px rgba(71,71,71,.4);background: #ff545a;}
|
||
|
|
|
||
|
|
/*-------------------------------------
|
||
|
|
7. Explore
|
||
|
|
--------------------------------------*/
|
||
|
|
.explore{
|
||
|
|
padding:117px 0 95px;
|
||
|
|
background: #f8fafb;
|
||
|
|
}
|
||
|
|
.explore-content{margin-top: 78px;}
|
||
|
|
|
||
|
|
.single-explore-item {
|
||
|
|
background: #fff;
|
||
|
|
border: 1px solid #edeff1;
|
||
|
|
border-radius: 3px;
|
||
|
|
margin-bottom: 25px;
|
||
|
|
-webkit-transition: .3s linear;
|
||
|
|
-moz-transition:.3s linear;
|
||
|
|
-ms-transition:.3s linear;
|
||
|
|
-o-transition:.3s linear;
|
||
|
|
transition: .3s linear;
|
||
|
|
}
|
||
|
|
.single-explore-img{position:relative;overflow: hidden;}
|
||
|
|
.single-explore-img:before {
|
||
|
|
position: absolute;
|
||
|
|
content: "";
|
||
|
|
top: 0;
|
||
|
|
left: 0;
|
||
|
|
width: 100%;
|
||
|
|
height: 100%;
|
||
|
|
background: rgba(162,172,177,.2);
|
||
|
|
}
|
||
|
|
.single-explore-img-info {
|
||
|
|
position: absolute;
|
||
|
|
bottom:-20px;
|
||
|
|
left: 0;
|
||
|
|
width: 100%;
|
||
|
|
opacity:0;
|
||
|
|
visibility:hidden;
|
||
|
|
-webkit-transition: .3s linear;
|
||
|
|
-moz-transition: .3s linear;
|
||
|
|
-ms-transition: .3s linear;
|
||
|
|
-o-transition: .3s linear;
|
||
|
|
transition: .3s linear;
|
||
|
|
}
|
||
|
|
.single-explore-item:hover .single-explore-img-info{
|
||
|
|
opacity:1;
|
||
|
|
visibility:visible;
|
||
|
|
bottom:0px
|
||
|
|
}
|
||
|
|
.single-explore-img-info button{
|
||
|
|
position: absolute;
|
||
|
|
bottom: 15px;
|
||
|
|
left: 15px;
|
||
|
|
width: 83px;
|
||
|
|
height: 21px;
|
||
|
|
line-height: 21px;
|
||
|
|
background: #ff545a;
|
||
|
|
border-radius: 3px;
|
||
|
|
color: #fcfcfc;
|
||
|
|
text-transform: capitalize;
|
||
|
|
text-align: center;
|
||
|
|
font-size: 12px;
|
||
|
|
}
|
||
|
|
.single-explore-image-icon-box {
|
||
|
|
text-align: right;
|
||
|
|
position: absolute;
|
||
|
|
bottom: 10px;
|
||
|
|
right: 10px;
|
||
|
|
}
|
||
|
|
.single-explore-image-icon-box ul li {
|
||
|
|
display: inline-block;
|
||
|
|
width: 30px;
|
||
|
|
height: 28px;
|
||
|
|
line-height: 28px;
|
||
|
|
background: #252d32;
|
||
|
|
text-align: center;
|
||
|
|
margin-left: 5px;
|
||
|
|
color: #cbcccd;
|
||
|
|
}
|
||
|
|
.single-explore-image-icon-box ul li:hover i{color: #267dff;}
|
||
|
|
|
||
|
|
.single-explore-txt {
|
||
|
|
padding: 26px 25px 24px 15px;
|
||
|
|
}
|
||
|
|
.single-explore-txt.bg-theme-1 .explore-rating{background: #70a9ff;}
|
||
|
|
.single-explore-txt.bg-theme-2 .explore-rating{background: #00c61c;}
|
||
|
|
.single-explore-txt.bg-theme-3 .explore-rating{background: #ffcc5d;}
|
||
|
|
.single-explore-txt.bg-theme-4 .explore-rating{background: #bd70ff;}
|
||
|
|
.single-explore-txt.bg-theme-5 .explore-rating{background: #ff7a40;}
|
||
|
|
|
||
|
|
.explore-rating-price,.explore-rating-price a {
|
||
|
|
font-size: 12px;
|
||
|
|
color: #777f85;
|
||
|
|
text-transform: capitalize;
|
||
|
|
font-weight: 400;
|
||
|
|
margin: 15px 0 20px;
|
||
|
|
}
|
||
|
|
.explore-rating-price a {margin:0;}
|
||
|
|
.explore-rating {
|
||
|
|
display: inline-block;
|
||
|
|
width: 32px;
|
||
|
|
height: 20px;
|
||
|
|
line-height: 20px;
|
||
|
|
color: #fff;
|
||
|
|
text-align: center;
|
||
|
|
border-radius: 3px;
|
||
|
|
font-weight: 500;
|
||
|
|
margin-right: 10px;
|
||
|
|
}
|
||
|
|
.explore-price {color: #f63138;}
|
||
|
|
.explore-price-box {
|
||
|
|
display: inline-block;
|
||
|
|
padding: 0 10px;
|
||
|
|
margin: 0 8px;
|
||
|
|
border-left: 1px solid #dde0e4;
|
||
|
|
border-right: 1px solid #dde0e4;
|
||
|
|
}
|
||
|
|
.explore-person {
|
||
|
|
padding-bottom: 28px;
|
||
|
|
border-bottom: 1px solid #e1e5eb;
|
||
|
|
}
|
||
|
|
.explore-person-img{
|
||
|
|
width: 40px;
|
||
|
|
height: 40px;
|
||
|
|
border-radius: 50%;
|
||
|
|
}
|
||
|
|
.explore-person p {font-size: 12px;}
|
||
|
|
.explore-open-close-part {
|
||
|
|
margin-top: 20px;
|
||
|
|
}
|
||
|
|
.close-btn {
|
||
|
|
color: #f63138;
|
||
|
|
text-transform: capitalize;
|
||
|
|
}
|
||
|
|
.close-btn.open-btn {color: #00c437;}
|
||
|
|
.explore-map-icon{text-align: right;}
|
||
|
|
.explore-map-icon a svg {
|
||
|
|
width: 12px;
|
||
|
|
height: 14px;
|
||
|
|
margin-left: 23px;
|
||
|
|
color: #767f86;
|
||
|
|
}
|
||
|
|
.explore-map-icon a svg:hover{color: #f63138;}
|
||
|
|
.single-explore-txt.bg-theme-2 .explore-map-icon a svg:hover{color: #00c437;}
|
||
|
|
.single-explore-item:hover{box-shadow: 0 10px 20px rgba(21,19,19,.2);}
|
||
|
|
|
||
|
|
/*-------------------------------------
|
||
|
|
8. Reviews
|
||
|
|
--------------------------------------*/
|
||
|
|
.reviews{padding:117px 0 75px;}
|
||
|
|
.reviews-content {margin-top:36px;}
|
||
|
|
|
||
|
|
/*single-testimonial-box */
|
||
|
|
.single-testimonial-box {
|
||
|
|
padding: 50px 30px;
|
||
|
|
box-shadow: 0 0px 5px rgba(71,71,71,.2);
|
||
|
|
overflow-x:hidden;
|
||
|
|
-webkit-transition: .3s;
|
||
|
|
-moz-transition:.3s;
|
||
|
|
-ms-transition:.3s;
|
||
|
|
-o-transition:.3s;
|
||
|
|
transition: .3s;
|
||
|
|
}
|
||
|
|
.single-testimonial-box:hover{box-shadow:0 10px 20px rgba(21,19,19,.2);}
|
||
|
|
.slick-current .single-testimonial-box{box-shadow:0 10px 20px rgba(21,19,19,.2);}
|
||
|
|
/*testimonial-description*/
|
||
|
|
.single-testimonial-box{
|
||
|
|
width: 404px;
|
||
|
|
background:#fff;
|
||
|
|
}
|
||
|
|
/* testimonial-info */
|
||
|
|
.testimonial-info {
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
text-transform:capitalize;
|
||
|
|
}
|
||
|
|
.testimonial-img {
|
||
|
|
position: relative;
|
||
|
|
top: 11px;
|
||
|
|
margin-right: 5px;
|
||
|
|
border-radius:50%;
|
||
|
|
-webkit-transition: .3s;
|
||
|
|
-moz-transition:.3s;
|
||
|
|
-ms-transition:.3s;
|
||
|
|
-o-transition:.3s;
|
||
|
|
transition: .3s;
|
||
|
|
}
|
||
|
|
.testimonial-person {
|
||
|
|
margin-left: 15px;
|
||
|
|
margin-top: 11px;
|
||
|
|
}
|
||
|
|
.testimonial-person h2 {
|
||
|
|
color: #505866;
|
||
|
|
font-size: 18px;
|
||
|
|
}
|
||
|
|
.testimonial-person h4 {
|
||
|
|
color: #a2a5ab;
|
||
|
|
font-size: 14px;
|
||
|
|
font-weight: 400;
|
||
|
|
margin-top: 10px;
|
||
|
|
}
|
||
|
|
.testimonial-person-star i {
|
||
|
|
color: #ffda2b;
|
||
|
|
margin: 9px 4px 0 0;
|
||
|
|
}/* testimonial-info */
|
||
|
|
|
||
|
|
|
||
|
|
/* testimonial-comment */
|
||
|
|
.testimonial-comment {
|
||
|
|
margin-top: 18px;
|
||
|
|
}
|
||
|
|
.testimonial-comment p{
|
||
|
|
color: #8d939e;
|
||
|
|
font-size: 14px;
|
||
|
|
font-weight: 300;
|
||
|
|
}/* testimonial-comment */
|
||
|
|
|
||
|
|
|
||
|
|
/*.slick-slide*/
|
||
|
|
.slick-initialized .slick-slide {
|
||
|
|
display: block;
|
||
|
|
padding: 40px 0;
|
||
|
|
}
|
||
|
|
.slick-slide.slick-cloned {outline: 0!important;}
|
||
|
|
.slick-slide {
|
||
|
|
margin: 0px 10px;
|
||
|
|
}
|
||
|
|
.slick-slide {
|
||
|
|
transition: all ease-in-out .3s;
|
||
|
|
opacity: .5;
|
||
|
|
}
|
||
|
|
.slick-active {
|
||
|
|
opacity: .5;
|
||
|
|
}
|
||
|
|
.slick-current {
|
||
|
|
opacity: 1;
|
||
|
|
}
|
||
|
|
/*.slick-slide*/
|
||
|
|
|
||
|
|
/*-------------------------------------
|
||
|
|
9. Counter
|
||
|
|
--------------------------------------*/
|
||
|
|
.statistics{
|
||
|
|
position:relative;
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
background:url(../../assets/images/counter/counter-banner.jpg)no-repeat fixed;
|
||
|
|
background-position:center;
|
||
|
|
background-size:cover;
|
||
|
|
padding:127px 0 120px;
|
||
|
|
}
|
||
|
|
.statistics:before{
|
||
|
|
position:absolute;
|
||
|
|
content:'';
|
||
|
|
background: rgba(75,75,75,.60);
|
||
|
|
height:100%;
|
||
|
|
width:100%;
|
||
|
|
top:0;
|
||
|
|
left:0;
|
||
|
|
}
|
||
|
|
/* single-ststistics-box */
|
||
|
|
.single-ststistics-box {
|
||
|
|
text-align: center;
|
||
|
|
margin-bottom:30px;
|
||
|
|
|
||
|
|
}
|
||
|
|
/* single-ststistics-box */
|
||
|
|
.statistics-content{
|
||
|
|
display: flex;
|
||
|
|
justify-content: center;
|
||
|
|
color:#fff;
|
||
|
|
font-size:60px;
|
||
|
|
}
|
||
|
|
.statistics-content span {
|
||
|
|
margin-left: 5px;
|
||
|
|
}
|
||
|
|
.single-ststistics-box h3{
|
||
|
|
color:#fff;
|
||
|
|
font-size:24px;
|
||
|
|
text-transform:capitalize;
|
||
|
|
font-weight: 500;
|
||
|
|
}
|
||
|
|
|
||
|
|
/*-------------------------------------
|
||
|
|
10. Blog
|
||
|
|
--------------------------------------*/
|
||
|
|
.blog{padding:120px 0 90px;}
|
||
|
|
.blog-content{margin-top: 80px;}
|
||
|
|
|
||
|
|
.single-blog-item{
|
||
|
|
margin-bottom: 30px;
|
||
|
|
box-shadow: 0 0px 5px rgba(71,71,71,.2);
|
||
|
|
-webkit-transition: .3s;
|
||
|
|
-moz-transition:.3s;
|
||
|
|
-ms-transition:.3s;
|
||
|
|
-o-transition:.3s;
|
||
|
|
transition: .3s;
|
||
|
|
}
|
||
|
|
.single-blog-item-txt {padding: 25px 28px 27px;}
|
||
|
|
.single-blog-item-txt h2 a {text-transform: initial;line-height: 1.8;}
|
||
|
|
.single-blog-item-txt h4 {
|
||
|
|
font-size: 14px;
|
||
|
|
color: #8f949d;
|
||
|
|
font-weight: 400;
|
||
|
|
margin: 12px 0 20px;
|
||
|
|
}
|
||
|
|
.single-blog-item-txt h4 a {
|
||
|
|
font-size: 14px;
|
||
|
|
padding-right: 14px;
|
||
|
|
border-right: 1px solid #dde0e4;
|
||
|
|
margin-right: 15px;
|
||
|
|
text-transform: uppercase;
|
||
|
|
}
|
||
|
|
|
||
|
|
.single-blog-item:hover h2 a {color:#ff545a;}
|
||
|
|
.single-blog-item:hover{
|
||
|
|
box-shadow: 0 10px 20px rgba(21,19,19,.4);
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/*-------------------------------------
|
||
|
|
11. Subscribe
|
||
|
|
--------------------------------------*/
|
||
|
|
.subscription{
|
||
|
|
background: #f8fafb;
|
||
|
|
padding:150px 0;
|
||
|
|
}
|
||
|
|
/*subscribe-title*/
|
||
|
|
.subscribe-title {margin-bottom: 52px;}
|
||
|
|
|
||
|
|
.subscribe-title h2{
|
||
|
|
font-size:24px;
|
||
|
|
font-weight: 500;
|
||
|
|
text-transform: uppercase;
|
||
|
|
}
|
||
|
|
.subscribe-title p{
|
||
|
|
color:#7b8088;
|
||
|
|
font-size:16px;
|
||
|
|
font-weight: 500;
|
||
|
|
margin-top: 28px;
|
||
|
|
}/*subscribe-title*/
|
||
|
|
|
||
|
|
|
||
|
|
/*custom-input-group*/
|
||
|
|
.subscription-input-group {
|
||
|
|
position: relative;
|
||
|
|
text-align: center;
|
||
|
|
max-width: 630px;
|
||
|
|
margin:0 auto;
|
||
|
|
}
|
||
|
|
|
||
|
|
.subscription-input-group .subscription-input-form{
|
||
|
|
display: inline-block;
|
||
|
|
width: 630px;
|
||
|
|
height: 60px;
|
||
|
|
padding-left:30px;
|
||
|
|
font-size: 16px;
|
||
|
|
color: #a5adb3;
|
||
|
|
-webkit-border-radius:3px;
|
||
|
|
-moz-border-radius:3px;
|
||
|
|
border-radius:3px;
|
||
|
|
border:1px solid #fff;
|
||
|
|
box-shadow: 0 0px 10px rgba(21,19,19,.1);
|
||
|
|
-webkit-transition:0.3s linear;
|
||
|
|
-moz-transition:0.3s linear;
|
||
|
|
-o-transition:0.3s linear;
|
||
|
|
transition:0.3s linear;
|
||
|
|
}
|
||
|
|
.subscription-input-group:hover .subscription-input-form{
|
||
|
|
box-shadow: 0 5px 20px rgba(21,19,19,.4);
|
||
|
|
}
|
||
|
|
/*custom-input-group*/
|
||
|
|
|
||
|
|
/*appsLand-btn*/
|
||
|
|
.appsLand-btn {
|
||
|
|
position: absolute;
|
||
|
|
top: 0;
|
||
|
|
right: 0;
|
||
|
|
background: #ff545a;
|
||
|
|
display: inline-block;
|
||
|
|
width: 180px;
|
||
|
|
height: 60px;
|
||
|
|
line-height: 60px;
|
||
|
|
text-decoration: none;
|
||
|
|
border-top-right-radius:3px;
|
||
|
|
border-bottom-right-radius:3px;
|
||
|
|
text-transform:capitalize;
|
||
|
|
color: #fff;
|
||
|
|
font-size: 16px;
|
||
|
|
font-weight: 500;
|
||
|
|
border: 0;
|
||
|
|
overflow: hidden;
|
||
|
|
cursor: pointer;
|
||
|
|
-webkit-transition:0.3s ease-in-out;
|
||
|
|
-moz-transition:0.3s ease-in-out;
|
||
|
|
-o-transition:0.3s ease-in-out;
|
||
|
|
transition:0.3s ease-in-out;
|
||
|
|
}
|
||
|
|
.appsLand-btn:hover, .appsLand-btn:focus, .appsLand-btn:active {
|
||
|
|
text-decoration: none;
|
||
|
|
outline: none;
|
||
|
|
}
|
||
|
|
.appsLand-btn:hover {
|
||
|
|
box-shadow:0 5px 10px rgba(71,71,71,.4);
|
||
|
|
background: #f43032;
|
||
|
|
}
|
||
|
|
/*appsLand-btn*/
|
||
|
|
|
||
|
|
/*-------------------------------------
|
||
|
|
12. Footer
|
||
|
|
--------------------------------------*/
|
||
|
|
.footer-menu {padding: 45px 0;}
|
||
|
|
.footer-menu .navbar-header{padding:0;}
|
||
|
|
.footer-menu .navbar-header a.navbar-brand,.footer-menu.footer-menu .navbar-header a.navbar-brand:hover,.footer-menu .navbar-header a.navbar-brand:focus{
|
||
|
|
padding:0;
|
||
|
|
height: 0;
|
||
|
|
}
|
||
|
|
.footer-menu ul.footer-menu-item{text-align: right;}
|
||
|
|
.footer-menu ul.footer-menu-item li{display: inline-block;}
|
||
|
|
.footer-menu ul.footer-menu-item li a {
|
||
|
|
color: #859098;
|
||
|
|
font-size: 14px;
|
||
|
|
text-transform: uppercase;
|
||
|
|
padding-left: 40px;
|
||
|
|
-webkit-transition:0.3s linear;
|
||
|
|
-moz-transition:0.3s linear;
|
||
|
|
-o-transition:0.3s linear;
|
||
|
|
transition:0.3s linear;
|
||
|
|
}
|
||
|
|
.footer-menu ul.footer-menu-item li a:hover{color: #f43032;}
|
||
|
|
.hm-footer-copyright {
|
||
|
|
padding: 40px 0;
|
||
|
|
border-top: 1px solid #e1e5eb;
|
||
|
|
}
|
||
|
|
.hm-footer-copyright p,.hm-footer-copyright p a {
|
||
|
|
color: #a5adb3;
|
||
|
|
font-size: 14px;
|
||
|
|
font-weight: 400;
|
||
|
|
text-transform: capitalize;
|
||
|
|
}
|
||
|
|
.footer-social {text-align: right;}
|
||
|
|
.footer-social .fa-phone:before {
|
||
|
|
position: relative;
|
||
|
|
top: 2px;
|
||
|
|
}
|
||
|
|
.footer-social a ,.footer-social span {
|
||
|
|
display: inline-block;
|
||
|
|
color: #afb4bf;
|
||
|
|
font-size: 14px;
|
||
|
|
margin-left: 15px;
|
||
|
|
-webkit-transition: .3s;
|
||
|
|
-moz-transition:.3s;
|
||
|
|
-ms-transition:.3s;
|
||
|
|
-o-transition:.3s;
|
||
|
|
transition: .3s;
|
||
|
|
}
|
||
|
|
.footer-social a {
|
||
|
|
width: 35px;
|
||
|
|
height: 35px;
|
||
|
|
line-height: 35px;
|
||
|
|
background: #eef2f6;
|
||
|
|
text-align: center;
|
||
|
|
border-radius: 50%;
|
||
|
|
}
|
||
|
|
.footer-social span {margin-right:15px;margin-left: 0;color: #a5adb3;}
|
||
|
|
.footer-social span:hover{color: #ff545a;}
|
||
|
|
.footer-social a:hover {background:#ff545a;color: #fff;}
|
||
|
|
|
||
|
|
/*===============================
|
||
|
|
Scroll Top
|
||
|
|
===============================*/
|
||
|
|
#scroll-Top .return-to-top {
|
||
|
|
position: fixed;
|
||
|
|
right: 30px;
|
||
|
|
bottom: 30px;
|
||
|
|
display: none;
|
||
|
|
width: 40px;
|
||
|
|
line-height: 40px;
|
||
|
|
height: 40px;
|
||
|
|
text-align: center;
|
||
|
|
font-size: 20px;
|
||
|
|
cursor: pointer;
|
||
|
|
color: #fff;
|
||
|
|
background:#ff545a;
|
||
|
|
border:1px solid #ff545a;
|
||
|
|
border-radius:50%;
|
||
|
|
-webkit-transition: .5s;
|
||
|
|
-moz-transition:.5s;
|
||
|
|
-ms-transition:.5s;
|
||
|
|
-o-transition:.5s;
|
||
|
|
transition: .5s;
|
||
|
|
z-index: 2;
|
||
|
|
}
|
||
|
|
#scroll-Top .return-to-top:hover {
|
||
|
|
background:#f43032;
|
||
|
|
border:1px solid #ff545a;
|
||
|
|
}
|
||
|
|
|
||
|
|
#scroll-Top .return-to-top i{
|
||
|
|
position:relative;
|
||
|
|
bottom:0;
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
#scroll-Top .return-to-top i{
|
||
|
|
position: relative;
|
||
|
|
animation-name: example;
|
||
|
|
animation-direction: alternate;
|
||
|
|
animation-iteration-count: infinite;
|
||
|
|
animation-duration:1s;
|
||
|
|
}
|
||
|
|
@keyframes example {
|
||
|
|
0% {bottom:0px;}
|
||
|
|
100% {bottom:7px;}
|
||
|
|
}
|
||
|
|
/*========================Thank you=================
|