XylotrechusZ
@charset "utf-8";
/**
*
* -----------------------------------------------------------------------------
*
* Template : Dabble - Creative Agencey & Portfolio WordPress Theme
* Author : rs-theme
* Author URI : http://www.rstheme.com/
*
* -----------------------------------------------------------------------------
*
**/
/* Table Of Content
---------------------------------------------------------
01. General CSS
02. Global Class
03. Header Section
04. Sticky Menu
05. Slider Section
06. About Us
07. Services
08. Calltoaction
09. Portfolio
10. Pricing Tables
11. Team Member
12. Newsletter
13. Testimonial
15. Contact Us
16. Footer
17. Scroll Up
18. Video
19. Counter up
20. Breadcrumbs
21. Portfolio Details
25. Home Banner
26. Preloader
27. FAQ
--------------------------------------------------------*/
@bodyFont: 'Montserrat', sans-serif;
@titleFont: 'Montserrat', sans-serif;
@transition: all 0.3s ease 0s;
@primaryColor: #191821;
@secondaryColor: #CE1446;
@thirdColor: #BA1266;
@whiteColor: #ffffff;
@titleColor: #0a0a0a;
@menuColor: #000;
@btnColor: #ce1446;
@linkColor: #CE1446;
@hoverColor: #CE1446;
@globalColor: #444;
@bodyColor: #454545;
@formBg: #fc4073;
@lightColor: #969696;
@btnBgColor: #ce1446;
@btnHoverColor: #fff;
@import "contact.less";
@import "blog.less";
@import "header.less";
@import "footer.less";
@import "rsaddons.less";
@import "price_table.less";
@import "woocommerce.less";
/* -----------------------------------
01. General CSS
-------------------------------------*/
html,
body {
font-size: 15px;
color: @bodyColor;
font-family: @bodyFont;
vertical-align: baseline;
line-height: 1.7;
font-weight: 400;
overflow-x: hidden;
}
/* Hide scrollbar for Chrome, Safari and Opera */
body.rs-scrollbar, html.rs-scrollbar {
overflow: hidden;
}
body.rs-scrollbar::-webkit-scrollbar {
display: none;
}
/* Hide scrollbar for IE, Edge and Firefox */
body.rs-scrollbar {
-ms-overflow-style: none; /* IE and Edge */
scrollbar-width: none; /* Firefox */
}
img {
max-width: 100%;
height: auto;
}
p {
margin: 0 0 26px;
}
h1,
h2,
h3,
h4,
h5,
h6 {
font-family: @titleFont;
color: @titleColor;
margin: 0 0 26px;
}
h1, h2, h3, h4, h5, h6 {margin:0 0 26px; padding:0; letter-spacing: 0; font-weight: 400;}
h1 {
font-size: 52px;
line-height: 62px;
font-weight: 700;
}
h2 {
font-size: 40px;
line-height: 50px;
font-weight: 700;
}
h3 {
font-size: 28px;
line-height: 42px;
font-weight: 700;
}
h4 {
font-size: 26px;
line-height: 36px;
font-weight: 700;
}
h5 {
font-size: 24px;
line-height: 32px;
font-weight: 600;
}
h6 {
font-size: 20px;
line-height: 28px;
font-weight: 500;
}
a {
color: @primaryColor;
transition: @transition;
text-decoration: none;
outline: none !important;
}
a:active,
a:hover {
text-decoration: none;
outline: 0 none;
color: @hoverColor;
}
ul {
list-style: outside none none;
margin: 0;
padding: 0;
}
.clear {
clear: both;
}
::-moz-selection {
background: @secondaryColor;
text-shadow: none;
color: #ffffff;
}
::selection {
background: @secondaryColor;
text-shadow: none;
color: #ffffff;
}
.box-shadow{
box-shadow: 0px 14px 30px rgba(0, 0, 0, 0.07);
border-radius: 7px;
}
body .bg-fixed{
background-attachment: fixed !important;
background-position: center top !important;
}
body .bg-top{
background-position: center top !important;
}
body .bg-left{
background-position: bottom left !important;
}
body .bg-right{
background-position: top right !important;
}
body .bg-bottom{
background-position: center bottom !important;
}
body .main-contain{
background-size: cover;
background-repeat: no-repeat;
}
table th{
background: @secondaryColor;
color:#fff;
padding:10px;
}
table th a{
color:#fff;
}
table td{
padding: 10px;
}
.ball {
position: absolute;
border-radius: 100%;
opacity: 1;
}
.rs-z_index_1,
.rs-z_index_10{
position: relative;
}
.rs-z_index_1{
z-index: 1;
}
.rs-z_index_10{
z-index: 10;
}
.border-left-radius > .vc_column-inner{
border-top-left-radius: 7px;
border-bottom-left-radius: 7px;
}
.border-right-radius > .vc_column-inner{
border-top-right-radius: 7px;
border-bottom-right-radius: 7px;
}
.overflow-visible{
overflow: visible !important;
z-index: 1;
}
.overflow-hidden{
overflow: hidden !important;
}
.max-width-700{
max-width: 700px;
margin: 0 auto;
}
.white-color{
color: #fff;
h1,
h2,
h3,
h4{
color: #fff;
}
}
iframe{
width: 100%;
}
.floating-box{
position: relative;
z-index: 9;
top: 160px;
}
.custom-max-width{
max-width: 800px;
}
.menu-cart-area h2{
display: none;
}
.bs-sidebar{
#wp-calendar{
th{
background: @secondaryColor;
color: #fff;
}
}
table{
margin-bottom: 0;
}
.widget select{
margin: 0;
}
}
.common-shadow{
box-shadow: 0 0 150px #eee;
background: #fff;
}
ul.profile_info{
padding-left: 0;
margin-left: 0;
li{
list-style: none;
margin-bottom: 10px;
font-size: 15px;
padding: 5px 0px;
position: relative;
.title{
color: @globalColor;
margin-right: 10px;
position: relative;
&:after{
content: "";
position: absolute;
background: @secondaryColor;
width: 30px;
height: 3px;
left: 0;
z-index: -1;
bottom: 5px;
opacity: 0.6;
}
}
a{
color: @bodyColor;
}
}
}
.top__service .elementor-column-gap-default .elementor-element .elementor-widget-container:hover,
.top__service .elementor-column-gap-default:not(:hover) .elementor-element.d__active .elementor-widget-container{
background-color: #FFCC00;
}
/* -----------------------
404
--------------------------*/
.page-error{
position: relative;
display: table;
width: 100%;
height: 100vh;
background-repeat: no-repeat !important;
background-size: cover !important;
background: #000;
#content {
padding-bottom: 60px !important;
}
.container{
position: fixed;
top: 50%;
left: 0;
right: 0;
transform: translateY(-50%);
}
.content-area {
position: relative;
z-index: 101;
margin: 0 auto;
text-align: center;
h1.page-title{
color: @whiteColor;
font-size: 100px;
margin-bottom: 30px;
margin-top: 0px;
}
h2{
color: @whiteColor;
font-size: 35px;
font-weight: 700 !important;
margin-bottom: 50px;
margin-top: 80px;
span{
display: block;
font-size: 250px;
line-height: 175px;
margin: 0 0 60px;
}
}
}
.bs-sidebar{
max-width: 400px;
margin: 0 auto;
padding-bottom: 20px;
}
.bs-sidebar{
padding: 10px 0 35px;
}
.flaticon-right-arrow:before{
padding-left: 5px;
}
.readon{
font-size: 18px;
padding: 18px 40px 18px;
background-image: linear-gradient(90deg, @secondaryColor 10%, @thirdColor 100%);
border-radius:0;
&:focus{
color:@whiteColor;
}
}
&.coming-soon{
height: 100vh;
background:#101010;
.content-area{
h3{
font-size: 30px;
margin-top: 40px;
margin-bottom: 60px;
display: block;
span{
font-size: 80px;
text-shadow: unset;
text-transform: uppercase;
line-height: 90px;
padding-bottom: 20px;
letter-spacing: 5px;
display: block;
font-weight: 900 !important
}
}
}
.countdown-inner{
width: 600px;
margin: 0 auto;
max-width: 100%;
.time_circles{
position: relative;
justify-content: center;
align-items: center;
canvas{
opacity: 0;
display: none;
}
div{
color: @whiteColor;
font-size: 36px;
font-weight: 600;
padding-top: 25px;
width: 120px !important;
height: 120px !important;
display: grid;
align-items: center;
margin: 0 auto;
border-radius: 100%;
border: 5px solid @whiteColor;
background: @primaryColor;
box-shadow: 0 0 52px rgba(0,0,0,0.3);
display: inline-block;
margin: 0 12px;
&:first-child{
padding-left: 0;
}
&:last-child{
margin-right: 0;
}
span,
h4{
color: #ffffff;
}
span{
line-height: 1;
font-size: 55px;
display: block;
}
h4{
margin: 0;
font-weight: 400 !important;
text-transform: uppercase;
}
}
}
}
.follow-us-sbuscribe{
p{
color: @whiteColor;
font-size: 30px;
padding-top: 50px;
font-weight: 500;
margin-bottom: 5px;
}
ul{
list-style: none;
margin:0;
li{
display: inline-block;
margin-right: 18px;
&:last-child{
margin-right:0;
}
a{
width: 45px;
height: 45px;
line-height: 35px;
border-radius: 50%;
padding: 0;
color: @whiteColor;
&:hover{
opacity: .9;
}
}
i{
line-height: 45px;
font-size: 18px;
}
}
}
}
}
}
/* ------------------------------------
02. Global Class
---------------------------------------*/
.rectangle{
position: relative;
&:after{
position: absolute;
content: "";
height: 120px;
width: 1px;
background: #404c51;
right: -20px;
top: 50%;
transform: translateY(-50%);
}
}
.orange{
color: @secondaryColor;
}
span.yellow{
color: @primaryColor;
}
.overflow-show{
overflow: visible !important;
}
input[type="checkbox"], input[type="radio"] {
margin-right: 8px;
vertical-align: text-top;
}
.sticky{
.menu-area{
padding: 0
}
}
.alignleft{
margin-bottom: 26px;
}
.alignright{
margin-bottom: 26px;
}
.vertical-middle{
display: table;
width: 100%;
height: 100%;
.vertical-middle-cell{
display: table-cell;
vertical-align: middle;
}
}
.display-table {
display: table;
height: 100%;
width: 100%;
}
.display-table-cell {
display: table-cell;
vertical-align: middle;
}
ul.stylelisting{
list-style-type: none;
margin-left: 20px !important;
li{
position: relative;
padding-left: 22px !important;
line-height: 34px;
border: none !important;
&:before{
position: absolute;
top: 0;
left: 0;
z-index: 0;
content: "\f054";
font-family: 'FontAwesome';
color: #437ff9;
font-size: 12px;
}
}
}
.prelements-heading .title-inner .title span:not(.watermark){
position:relative;
z-index: 1;
&:after{
content: "";
height: 8px;
position: absolute;
bottom: 10px;
right: 0;
left: 0px;
-webkit-transition: all .3s ease;
transition: all .3s ease;
z-index: -1;
}
}
blockquote::before {
content: "\f129" !important;
font-size: 35px;
color: @secondaryColor;
padding-bottom: 0;
display: inline-block;
font-family: flaticon;
font-weight: 400;
text-align: center;
top: 0;
background: 0 0 !important;
transform: rotate(180deg);
}
blockquote{
margin:35px 0px !important;
padding: 40px 60px;
color: #666;
position: relative;
background: rgba(0,0,0,.01) !important;
font-weight: normal;
font-style: italic;
text-align: left;
clear: both;
font-weight: 400;
border-radius:8px;
cite{
font-size: 15px;
display: block;
margin-top: 10px;
&:before{
content: "";
font-size: 28px;
color: #ff5421;
padding-bottom: 0px;
display: inline-block;
background: @secondaryColor;
height: 2px;
width: 40px;
font-weight: 400;
text-align: center;
top: -4px;
margin-right: 10px;
position: relative;
}
}
p{
margin-bottom: 10px !important;
font-size: 20px;
strong{
color: #000 !important;
font-size: 18px;
padding-top: 20px !important;
margin-bottom: 10px;
display: block;
}
}
}
mark, ins, kbd{
background: @secondaryColor;
color: #fff;
padding: 0 4px;
}
code{
background: @secondaryColor;
color: #fff !important;
}
.border-image {
.vc_single_image-wrapper{
position: relative;
&:after{
position: absolute;
content: '';
width: 0;
height: 0;
border-top: 200px solid @secondaryColor;
border-right: 200px solid transparent;
left: -32px;
top: -32px;
}
&:before{
position: absolute;
content: '';
width: 0;
height: 0;
border-bottom: 300px solid @secondaryColor;
border-left: 300px solid transparent;
right: -32px;
bottom: -32px;
}
img{
position: relative;
z-index: 99;
}
}
&.small-border{
.vc_single_image-wrapper{
&:after{
border-top: 250px solid @secondaryColor;
border-right: 250px solid transparent;
left: -21px;
top: -21px;
}
&:before{
border-bottom: 250px solid @secondaryColor;
border-left: 250px solid transparent;
right: -21px;
bottom: -21px;
}
}
}
}
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
color: #fff;
padding:17px 30px;
font-size: 14px;
text-transform: capitalize;
outline: none;
transition: all .5s ease;
border-radius: 0 3px 3px 0;
background: @secondaryColor;
position: relative;
border: none;
}
.mb-30{
margin-bottom: 30px;
}
.top-float{
float: left;
}
.submit-btn{
display: block;
position: relative;
cursor: pointer;
position: relative;
transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
border-radius: 3px;
font-size: 14px;
font-weight: 500;
color: #fff;
z-index: 2;
border: none;
.wpcf7-submit{
position: relative;
cursor: pointer;
display: inline-block;
border-radius: 3px;
font-size: 14px;
font-weight: 500;
cursor: pointer;
color: #fff;
background: none;
border: none;
&:hover{
color:@secondaryColor;
}
}
&:hover{
background: transparent;
color: @secondaryColor;
opacity: 0.99;
}
}
button:hover, html input[type="button"]:hover, input[type="reset"]:hover{
background: @primaryColor;
color:@whiteColor;
}
input[type="submit"]:hover{
opacity: .9;
}
.main-contain {
#content {
padding-top: 130px;
padding-bottom: 130px;
}
.rs-porfolio-details{
#content {
padding-bottom: 110px;
}
}
.page-error{
#content {
padding-top: 60px;
}
}
}
.rs__banner__slider{
.rs-slide{
.slide-img{
position:relative;
.slide_des{
position:absolute;
top: 50%;
transform: translateY(-50%);
left: 0;
z-index: 1;
right: 0;
.watermark{
z-index: 5;
position: absolute;
font-size: 200px;
font-weight: 900;
top: -110px;
opacity: 1;
line-height: 1;
left: 0;
right: 0;
max-width: 1260px;
margin: 0 auto;
color: rgba(0,0,0,.08);
}
.title{
font-size: 65px;
font-weight: 900;
line-height: 1.2;
margin: 0;
}
.description{
font-size: 18px;
font-weight: 600;
margin-top: 35px;
}
.rs__button{
margin-top: 40px;
a{
background:@secondaryColor;
color: @whiteColor;
display: inline-block;
padding: 18px 30px;
line-height: 1;
font-weight: 600;
text-transform: uppercase;
}
}
}
}
span.number{
position: absolute;
left: 0;
right: 0;
text-align: center;
top: auto;
bottom: 42px;
font-size: 20px;
font-weight: 400;
font-family: @titleFont;
color: @bodyColor;
.first{
font-size: 60px;
font-weight: 700;
color: #000;
}
}
}
.slider-button {
margin-top: 48px;
ul {
margin: 0;
list-style-type: none;
li {
display: inline-block;
+ li {
margin-left: 10px;
}
}
}
}
.slick-arrow {
width: 42px;
height: 42px;
line-height: 42px;
text-align: center;
color: @primaryColor;
opacity: 1;
-webkit-transition: 0.3s all ease;
transition: 0.3s all ease;
top: auto;
bottom: 40;
visibility: visible;
border-radius: 0;
background: transparent;
box-shadow:none;
&:before {
display: none !important;
}
&:after {
color: inherit;
top: -2px;
font-family: "Flaticon";
font-size: 25px;
}
}
.slick-prev {
right: auto;
left: 45%;
top: auto;
bottom: 40px;
z-index: 1;
&:after {
font-family: "Flaticon";
content: "\f111" !important;
color: #000;
text-indent: 4px;
}
}
.slick-next {
left: auto;
right: 45%;
top: auto;
bottom: 40px;
&:after {
font-family: "Flaticon";
content: "\f110" !important;
color: #000;
text-indent: -4px;
}
}
&:hover {
.slick-prev {
right: auto;
left: 45%;
}
.slick-next {
left: auto;
right: 45%;
}
}
.readons{
border: 2px solid #000;
color: #000;
padding: 14px 35px;
border-radius: 3px;
font-size: 16px;
font-weight: 500;
&:hover{
background: #000;
color: #fff;
border: 2px solid #000;
}
}
}
.rs-portfolio-style8{
.portfolio-item{
.portfolio-img{
overflow: hidden;
position: relative;
img {
transform: scale(1);
transition: all 1s;
-webkit-transition: all 1s;
-o-transition: all 1s;
-moz-transition: all 1s;
-ms-transition: all 1s;
}
.p-icon {
position: absolute;
left: 50%;
top: 70%;
transform: translate(-50%, -50%);
z-index: 1;
opacity: 0;
visibility: hidden;
transition: all 0.8s;
-webkit-transition: all 0.8s;
-o-transition: all 0.8s;
-moz-transition: all 0.8s;
-ms-transition: all 0.8s;
a {
width: 40px;
height: 40px;
line-height: 40px;
border-radius: 100%;
display: inline-block;
text-align: center;
background: @secondaryColor;
i {
color: #fff;
&:before {
font-size: 15px;
margin: 0;
}
}
}
}
&:before{
content: "";
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 0;
background: #000;
opacity: 0;
visibility: hidden;
transition: all 0.4s ease 0s;
z-index: 1;
}
}
.portfolio-content{
margin: 0;
padding: 15px 0;
list-style: none;
display: flex;
justify-content: space-between;
.p-title{
font-size: 20px;
line-height: 30px;
margin-bottom: 0;
span{
font-size: 16px;
font-weight: 600;
padding-bottom: 5px;
display: block;
}
span,
a{
color: #0a0a0a;
}
a:hover{
color: @secondaryColor;
}
}
.p-category {
margin: 0;
a {
font-weight: 500;
color: @titleColor;
&:hover{
color: @secondaryColor;
}
}
}
}
&:hover {
.portfolio-img {
img {
transform: scale(1.05);
}
.p-icon {
opacity: 1;
visibility: visible;
top: 50%;
}
&:before{
opacity: .2;
visibility: visible;
height: 100%;
}
&:after{
visibility: visible;
transform: scale(1.02);
transition: all 1s;
-webkit-transition: all 1s;
-o-transition: all 1s;
-moz-transition: all 1s;
-ms-transition: all 1s;
}
}
}
}
}
#content{
.project-gallery {
.p-gallery-title{
margin: 0 0 40px;
}
}
}
.rs-slider-video{
position: relative;
i{
position: relative;
z-index: 2;
}
&:before{
position: relative;
content: "";
position: absolute;
z-index: 2;
left: 50%;
top: 50%;
transform: translateX(-50%) translateY(-50%);
display: block;
width: 60px;
height: 60px;
background: @secondaryColor !important;
border-radius: 50%;
}
&:after{
position: relative;
content: "";
position: absolute;
z-index: -1;
left: 50%;
top: 50%;
transform: translateX(-50%) translateY(-50%);
display: block;
width: 70px;
height: 70px;
opacity: .3 !important;
background: @secondaryColor;
border-radius: 50%;
animation: pulse-border 3000ms ease-out infinite;
}
}
body.single-teams {
.main-contain{
#content {
padding-bottom: 90px;
}
}
}
.single-product .main-contain #content{
padding-bottom: 45px;
}
.woocommerce-cart {
.main-contain {
#content {
padding-bottom: 100px !important;
}
}
}
.sign{
margin-top:15px;
}
.rs-heading.bigger-text h2.title{
font-size: 55px;
line-height: 65px;
}
.rs-heading.bigger-text p{
color: #fff;
font-size: 18px;
}
ul.unorder-list{
margin:20px 0 0;
padding: 0;
list-style: none;
li{
display: block;
position: relative;
padding-left: 25px;
padding-bottom: 15px;
font-weight: 500;
line-height: 25px;
&:before{
position: absolute;
top: 0px;
left: 0;
content: "\f105";
font-family: FontAwesome;
color: @secondaryColor;
font-size: 20px;
}
}
}
ul.check-icon{
list-style: none;
margin-left: 20px;
li{
position: relative;
padding-left: 22px;
padding-bottom: 4px;
font-size: 16px;
&:before{
position: absolute;
top: 4px;
left: 0;
content: "\f11b";
font-family: Flaticon;
color: @primaryColor;
font-weight: 700;
font-size: 14px;
}
}
&.two-call{
column-count: 2;
li{
padding-right: 10px;
}
}
}
.light-faq{
.vc_toggle{
.vc_toggle_title{
h4{
color: #fff;
}
}
.vc_toggle_content{
color: #fff;
}
}
}
body.archive.tax-portfolio-category{
.rs-blog.blog-page{
padding-top: 120px;
padding-bottom: 50px;
}
}
.bluecolor4 {
color: #0073ff;
div.rs_splitted_chars {
color: #0073ff !important;
}
}
.lightredcolor {
color: #f24c1a;
div.rs_splitted_chars {
color: #f24c1a !important;
}
}
.post-password-required input[type="password"]{
margin-left: 5px;
}
.post-password-required input[type="submit"] {
margin-left: -4px;
border-radius: 0 3px 3px 0;
padding: 11px 20px;
}
input[type="text"],
input[type="number"],
input[type="password"],
textarea,
input[type="email"]{
color: @bodyColor ;
width: 100%;
max-width: 100%;
opacity:1;
&::-webkit-input-placeholder { /* Chrome/Opera/Safari */
color: #4444447A;
opacity:1;
}
&::-moz-placeholder { /* Firefox 19+ */
color: #4444447A;
opacity:1;
}
&:-ms-input-placeholder { /* IE 10+ */
color: #4444447A;
opacity:1;
}
&:-moz-placeholder { /* Firefox 18- */
color: #4444447A;
opacity:1;
}
}
select{
color: @bodyColor;
cursor: pointer;
&:valid{
color:@bodyColor;
}
}
/*--------------------------------------------------------------
## Links
--------------------------------------------------------------*/
a {
color: @primaryColor;
}
a:hover, a:focus, a:active {
color: @secondaryColor;
}
a:focus {
outline: thin dotted;
}
a:hover, a:active {
outline: 0;
}
.wp-block-calendar tfoot a{
color: @primaryColor;
&:hover{
color:@secondaryColor;
}
}
/********************* RS Particle Banner **************************/
.rs-particle-banner {
width: 100%;
position: relative;
.particle-content {
position: absolute;
top: 50%;
transform: translateY(-50%);
.banner_title {
display: inline-block;
margin-bottom: 25px;
font-size: 65px;
position: relative;
z-index: 9;
color: #444;
line-height: 70px;
}
.banner-button {
margin-top: 20px;
&.btn-light {
.readon:not(.border) {
&:hover {
background: transparent;
border-color: #fff !important;
color: #fff !important;
}
}
.readon.border {
border-color: #fff !important;
color: #fff !important;
&:hover {
border-color: @primaryColor !important;
}
}
}
a{
&:hover{
opacity: .8;
}
}
}
.banner-introtext{
display: block;
font-size: 16px;
line-height: 22px;
padding-bottom: 25px;
}
}
ul {
list-style-type: none;
margin: 0;
padding: 0;
li {
display: inline-block;
margin: 0 25px 25px 0;
}
}
.arrow-btn {
width: 26px;
height: 55px;
bottom: 0%;
left: 50%;
z-index: 2;
text-align: center;
position: absolute;
border: 1px solid #999;
border-radius: 20px;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
i {
color: #999;
font-size: 22px;
line-height: 80px;
-webkit-animation: bounce 2s infinite;
-moz-animation: bounce 2s infinite;
-ms-animation: bounce 2s infinite;
-o-animation: bounce 2s infinite;
animation: bounce 2s infinite;
transition: 0.4s;
-webkit-transition: 0.4s;
-webkit-font-smoothing: antialiased;
font-smoothing: antialiased;
&:hover {
-webkit-animation: none;
-moz-animation: none;
-ms-animation: none;
-o-animation: none;
animation: none;
}
}
}
}
@-webkit-keyframes bounce {
from,
20%,
53%,
80%,
to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
40%,
43% {
-webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
-webkit-transform: translate3d(0, -30px, 0);
transform: translate3d(0, -30px, 0);
}
70% {
-webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
-webkit-transform: translate3d(0, -15px, 0);
transform: translate3d(0, -15px, 0);
}
90% {
-webkit-transform: translate3d(0, -4px, 0);
transform: translate3d(0, -4px, 0);
}
}
@keyframes bounce {
from,
20%,
53%,
80%,
to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
40%,
43% {
-webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
-webkit-transform: translate3d(0, -30px, 0);
transform: translate3d(0, -30px, 0);
}
70% {
-webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
-webkit-transform: translate3d(0, -15px, 0);
transform: translate3d(0, -15px, 0);
}
90% {
-webkit-transform: translate3d(0, -4px, 0);
transform: translate3d(0, -4px, 0);
}
}
/*--------------------------------------------------------------
--------------------------------------------------------------*/
.ceo-founder p{
font-weight: 500;
color: @titleColor;
}
.sticky-logo{
display: none;
}
.sticky {
.logo-area{
display: none;
}
.logo-area.sticky-logo{
display: block;
}
}
.owl-carousel {
padding-top: 0;
.owl-nav {
right: 0;
[class*="owl-"] {
font-size: 0;
width: 42px;
height: 42px;
line-height: 42px;
background: @secondaryColor;
color: #fff;
border-radius: 50%;
position: absolute;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
transition: 0.6s ease all;
opacity: 0;
visibility: hidden;
&:before {
font-family: Flaticon;
position: absolute;
font-size: 20px;
top: 50%;
left: 50%;
-webkit-transform: translateY(-50%) translateX(-50%);
transform: translateY(-50%) translateX(-50%);
}
&.owl-prev{
left: 0;
&:before {
content: "\f112";
}
}
&.owl-next {
right: 0;
&:before {
content: "\f113";
margin-left: 2px;
}
}
&:hover {
background: @primaryColor;
color: #fff;
}
}
}
&:hover {
.owl-nav {
[class*="owl-"] {
opacity: 1;
visibility: visible;
&.owl-prev{
left: -60px;
}
&.owl-next {
right: -60px;
}
}
}
}
.partner-item{
a{
img{
width: auto;
margin: 0 auto;
}
}
}
}
.sidenav {
width: 100%;
.widget-title{
color: #fff !important;
padding: 0 0 15px;
font-size: 30px !important;
line-height: 30px;
font-weight: 600 !important;
position: relative;
&:before {
content: "";
position: absolute;
background: #fff;
height: 2px;
width: 50px;
left: 0;
bottom: 0;
display: block;
z-index: 1;
}
}
.offcanvas_logo{
padding-bottom:40px;
}
.widget {
padding: 0;
.widget-title {
font-size: 26px;
color: #fff;
margin-bottom: 30px;
}
.search-form {
.search-input {
height: 42px;
background: rgba(255,255,255,0.1);
border-color: rgba(255,255,255,0.3) !important;
color: #fff;
font-size: 14px;
outline: none;
&::-webkit-input-placeholder { /* Chrome/Opera/Safari */
color: #fff;
}
&::-moz-placeholder { /* Firefox 19+ */
color: #fff;
}
&:-ms-input-placeholder { /* IE 10+ */
color: #fff;
}
&:-moz-placeholder { /* Firefox 18- */
color: #fff;
}
}
button {
padding: 8px 12px;
color: #fff;
background: transparent !important;
-webkit-transition: 0.3s ease all;
transition: 0.3s ease all;
&:hover {
opacity: 0.7;
}
}
}
}
.fa-ul{
margin-left: 0;
text-align: left;
font-size: 15px;
li{
padding: 7px 0;
display: flex;
align-items: center;
i{
padding-right: 15px;
&:before{
font-size:26px;
margin-left: 0 !important;
}
&.flaticon-email{
position: relative;
top: 1px;
}
}
&.address1{
padding-left:45px;
padding-top: 0;
font-size: 18px;
margin-bottom: 4px;
padding-right: 40px;
i{
position: absolute;
top: 3px;
left: 0;
}
}
}
}
.offcanvas_social{
margin-left: 0;
list-style-type: none;
padding-bottom: 0;
margin: 50px 0 0;
li{
display: inline-block;
a{
-webkit-transition: all 0.35s;
-o-transition: all 0.35s;
transition: all 0.35s;
-moz-transition: all 0.35s;
-ms-transition: all 0.35s;
float: left;
margin-right: 0;
i{
font-size: 15px;
color: #fff;
margin: 0 8px 0 0;
text-align: center;
border: 1px solid rgba(255,255,255,.1);
width: 35px;
height: 35px;
line-height: 35px;
border-radius: 0px;
&:hover{
background: @secondaryColor;
border-color:@secondaryColor;
}
}
}
&:last-child{
a{
margin-right: 0;
}
}
}
}
.nav-close-menu-li {
margin: 0;
padding-bottom: 30px;
text-align: right;
a{
font-size: 0;
text-align: center;
display: inline-block;
border: 2px solid #fff;
width: 36px;
height: 36px;
line-height: 36px;
border-radius: 100%;
margin-right: 10px;
position: relative;
&:after, &:before {
content: '';
position: absolute;
width: 2px;
height: 14px;
background-color: #fff;
top: 9px;
}
&:before {
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}
&:after {
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
}
&:hover{
background:#fff;
color: #000;
border-color: #fff;
&:after, &:before {
background-color: @primaryColor;
}
}
}
}
.widget_nav_menu {
ul{
padding: 0;
margin: 0;
text-align: left;
li{
list-style: none;
border: none !important;
margin-left: 0;
padding: 0;
position:relative;
a{
font-size: 15px;
display: block;
color: #fff;
font-family: @titleFont;
line-height: 45px;
font-weight: 500 !important;
&:hover{
color: #ce1446;
}
}
&:before{
display: none;
}
ul{
li{
a{
text-transform: capitalize;
padding: 10px 0;
line-height: 24px;
}
}
}
}
}
}
.bs-search button{
padding: 5px 11px;
}
li.nav-link-container{
color: @secondaryColor;
text-align: center;
display: block;
border-radius: 30px;
height: 40px;
right: 15px;
width: 40px;
top: 5px;
position: absolute;
-webkit-transition: transform .5s ease;
-moz-transition: transform .5s ease;
transition: transform .5s ease;
&:hover{
a{
display: block;
}
}
a{
display: block;
background:none !important;
span{
background: @primaryColor !important;
height: 3px;
width: 25px;
}
}
.nav-menu-link{
padding: 13px 15px 15px 10px !important;
span.hamburger1{
transform: rotate(-45deg) translate(-5px, 5px);
}
span.hamburger3{
-webkit-transform: rotate(45deg) translate(0px, 0px);
transform: rotate(45deg) translate(0px, 0px);
}
}
}
}
.rs-addon-slider .slick-dots li button, .rs-testimonial-dots-style2 .slick-dots li button {
border-radius: 0px !important;
}
.fa-ul{
list-style: none;
}
.mobile-menu-container {
.nav-close-menu-li {
padding-top: 50px;
a{
padding: 0
}
}
ul{
padding-left: 0;
margin: 0;
text-align: left;
li{
list-style: none;
border: none !important;
margin-left: 0;
padding: 0;
a{
font-size: 15px;
padding: 12px 0;
display: block;
color: #222;
border-bottom: none;
&:hover{
opacity: 0.9;
}
}
&:before{
display: none;
}
}
}
}
.nav-active-menu-container{
-ms-transform: translate(0);
-webkit-transform: translate(0);
-moz-transform: translate(0);
transform: translate(0);
}
.prelements-heading{
.pre-heading-line{
height: 5px;
width: 90px;
background: @secondaryColor;
margin: 0px;
position: relative;
border-radius: 30px;
&:before{
content: '';
position: absolute;
left: 0;
top: -2.7px;
height: 10px;
width: 10px;
border-radius: 50%;
background: @primaryColor;
-webkit-animation-duration: 3s;
animation-duration: 3s;
-webkit-animation-timing-function: linear;
animation-timing-function: linear;
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
-webkit-animation-name: pre-move-dot;
animation-name: pre-move-dot;
}
}
&.center{
.pre-heading-line{
margin: 20px auto;
}
.sub-text{
.pre-heading-line{
margin: 0 auto 20px;
}
}
}
&.right{
.pre-heading-line{
margin-left: auto;
margin-right: 0;
}
}
}
@-webkit-keyframes pre-move-dot{
from {
-webkit-transform: translateX(0);
transform: translateX(0)
}
to {
-webkit-transform: translateX(88px);
transform: translateX(88px)
}
}
@keyframes pre-move-dot{
from {
-webkit-transform: translateX(0);
transform: translateX(0)
}
to {
-webkit-transform: translateX(88px);
transform: translateX(88px)
}
}
.rs-portfolio-style6 .portfolio-item .portfolio-content:before{
border-radius: 0;
}
.prelements-heading .pre-heading-line1:after{
content: "";
width: 65px;
height: 4px;
background: @secondaryColor;
position: absolute;
bottom: -4px;
right: 0;
left: 50%;
margin-left: -20px;
border-radius: 2px;
-webkit-transition: all .3s ease;
transition: all .3s ease;
z-index: 0;
}
.prelements-heading .pre-heading-line1:before{
content: "";
width: 12px;
height: 4px;
background: @secondaryColor;
position: absolute;
bottom: -4px;
left: 50%;
margin-left: -35px;
transform: translateX(-50%);
border-radius: 2px;
-webkit-transition: all .3s ease;
transition: all .3s ease;
z-index: 1;
}
.pre-heading-line1{
position: relative;
}
.prelements-heading.left{
.pre-heading-line1:before, .pre-heading-line1:after{
left: 0;
}
.pre-heading-line1{
position: relative;
margin-left: 44px;
margin-top: 20px;
}
}
.prelements-gradient-heading .title-inner .title, .prelements-gradient-heading .title-inner span.subtitle{
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.rs-btn a{
cursor: pointer;
display: inline-block;
position: relative;
transition: all 0.4s;
padding: 8px 30px;
font-size: 15px;
font-weight: 600;
line-height: 26px;
text-transform: uppercase;
color: #ffffff;
background: @secondaryColor;
z-index: 1;
border-radius: 30px;
}
.prelements-heading .sub-text .pre-heading-line{
display: block;
}
.prelements-heading{
&.center{
.sub-text .pre-heading-line1{
top: -22px;
padding-right: 0;
max-width: 120px;
margin: 0 auto;
display: block;
}
}
&.right{
.sub-text .pre-heading-line1{
top: -10px;
padding-left: 75px;
padding-right:0;
float: right;
clear: right;
}
.sub-text .pre-heading-line{
display: block;
top: 10px;
float: right;
clear: left;
margin-left: 25px;
margin-right: 0px;
}
}
&.left{
.sub-text .pre-heading-line{
display: block;
top: 10px;
float: left;
clear: left;
margin-right: 25px;
}
}
}
.prelements-heading.right{
.pre-heading-line1:before, .pre-heading-line1:after{
right: 0;
left: auto;
}
.pre-heading-line1{
position: relative;
margin-left: 44px;
margin-top: 20px;
}
.sub-text .pre-heading-line1:after{
margin-right: 25px;
margin-left: 0;
}
}
.elementor-widget-container:hover .pre-heading-line1:before{
width: 65px;
margin-left: -5px;
background: @secondaryColor;
}
.elementor-widget-container:hover .pre-heading-line1:after{
width: 12px;
margin-left: 35px;
background: @secondaryColor;
}
.elementor-widget-container:hover .prelements-heading.right .sub-text .pre-heading-line1:before {
margin-right: -14px;
margin-left: 0;
}
.elementor-widget-container:hover .prelements-heading.right .sub-text .pre-heading-line1:after {
margin-right: 0px;
}
.sub-text .pre-heading-line1{
top: -13px;
padding-right: 75px;
}
#rs-header.header-transparent .menu-sticky.sticky ul.offcanvas-icon.sidenav .nav-link-container span{
background: #fff !important;
}
#rs-header .menu-area .navbar ul .menu-item:not(.mega) ul li ul.sub-menu,
#rs-header .menu-area .navbar ul .page_item:not(.mega) ul li ul.sub-menu{
position: absolute;
left: 100%;
top: 0px;
opacity: 0;
transform: scaleY(0);
visibility: hidden;
}
#rs-header .menu-area .navbar ul .menu-item:not(.mega) ul > li:hover > ul.sub-menu,
#rs-header .menu-area .navbar ul .page_item:not(.mega) ul > li:hover > ul.sub-menu {
opacity: 1;
transform: scaleY(1);
visibility: visible;
}
.secondarycolor{
color: @secondaryColor;
}
#rs-header .menu-area .navbar ul li.three-col ul > li{
width: 33.33%;
}
#rs-header .menu-area .navbar ul li.four-col ul > li{
width: 25%;
}
.transparent_header {
position: absolute;
}
.transparent_header .menu-area .navbar ul > li > a:after {
background: #fff;
}
.transparent_header .sticky .navbar ul > li > a:after{
background: @primaryColor;
}
.default_header .menu-area .navbar ul > li > a:after {
background: @primaryColor;
}
.customrev{
.rev-btn{
i{
position: absolute;
top: 50%;
right: 26px;
transition: all 0.3s;
transform: translateY(-50%);
opacity: 1;
font-size: 16px;
}
&:hover{
i{
opacity: 1;
right: 18px;
}
}
}
}
.space15 .elementor-accordion-item{
margin-bottom: 20px !important;
}
.elementor-widget-rs-logo{
.slick-track{
display: flex;
align-items: center;
flex-wrap: wrap;
}
}
/*------------------------------------
04. Sticky Menu
--------------------------------------*/
.menu-sticky{
margin: 0;
width: 100%;
z-index: 99;
transition: all 300ms ease-in-out;
background: transparent;
&.sticky{
position: fixed !important;
background: rgba(255,255,255,0.9);
box-shadow: 0 0 20px -10px rgba(0,0,0,0.8);
padding: 0;
.toolbar-area {
display: none;
}
.navbar-menu{
width: 100%;
text-align: right;
ul.menu{
text-align: right;
}
}
.navbar{
ul{
li{
> a{
color: @titleColor;
font-size:14px;
}
}
}
}
.btn_quote{
padding-top: 28px !important;
padding-bottom: 28px !important;
}
.nav-link-container{
i{
color: @titleColor;
}
}
}
}
.max900{
.vc_column-inner{
max-width: 900px;
margin: 0 auto;
}
}
.formbtn{
.form-button{
text-align: center;
}
}
.rs-portfolio.style1 .slick-dots li button{
background:transparent !important;
}
/* -----------------------
17. Scroll Up
--------------------------*/
.clpricing-table .price-table.style1{
border:none;
}
.faq-simple{
.elementor-accordion-item{
margin-bottom: 25px;
box-shadow: 0 0 22px rgba(0,0,0,.1);
}
}
/* ------------------------------------
20. Breadcrumbs
---------------------------------------*/
.rs-breadcrumbs {
position: relative;
background: #000;
.breadcrumbs-title{
font-size: 0;
color: #a5a4a4;
display: flex;
align-items: center;
justify-content: center;
> span{
margin-right: 12px;
a.home {
display: block;
padding: 0 41px 0 0;
position: relative;
span{
display: none;
}
&:before{
content: "\f015";
position: relative;
display: block;
font-family: FontAwesome;
font-weight: normal;
font-style: normal;
color: #fff;
font-size: 20px;
}
&:after{
content: "";
position: absolute;
right: 0;
top: 10px;
width: 26px;
height: 1px;
background: #ffffff;
}
}
}
span{
font-size: 16px;
position: relative;
padding-right: 4px;
font-weight: 600;
line-height: 20px;
text-transform: uppercase;
&.current-item{
margin-right: 0;
padding-right:0;
}
a{
span{
color: @primaryColor;
&:hover{
opacity:.7;
}
}
}
}
.current-item{
color: @primaryColor;
}
}
.breadcrumbs-inner{
padding: 180px 0 130px;
text-align: center;
position: relative;
.banner-desc{
margin-top: 10px;
margin-bottom: 10px;
color: #fff;
text-align: left;
}
.cate-single{
.post-categories{
padding: 0 0 8px 0;
a{
background: #fbfbfb;
color: @bodyColor !important;
padding: 6px 19px 5px;
border-radius: 5px;
font-size: 13px;
margin-right: 10px;
margin-bottom: 10px;
display: inline-block;
}
}
}
.bs-meta{
padding-left: 0;
li{
margin-right: 13px;
font-size: 13px;
i{
margin-right: 3px;
&:before{
font-size: 14px;
font-weight: 600;
}
}
}
}
}
.container-fluid{
padding-left: 100px;
padding-right: 100px;
}
.breadcrumbs-single{
background-size: cover;
background-position: center top;
}
.trail-browse{
display: none !important;
}
.trail-items li{
position: relative;
a{
padding-right: 20px;
}
}
.trail-items li::after {
right: 0px;
position: absolute;
padding: 0;
content: "\f147";
font-family: Flaticon;
font-style: normal;
font-weight: 300;
display: block !important;
top: 0;
}
.trail-items li.trail-end::after{
display: none !important;
}
.page-title {
margin: 0 auto;
max-width: 850px;
padding-bottom: 35px !important;
color: #fff !important;
text-shadow: 1px 1px 2px rgba(0,0,0,0.3);
font-size: 48px;
}
.breadcrumbs {
text-align: center;
}
.trail-items li::after {
font-size: 12px;
}
ul {
display: inline-block;
padding: 5px 20px;
margin: 0px;
li {
color: #000;
display: inline-block;
font-size: 14px;
* {
color: #000;
}
a {
padding: 0 8px;
color: #000;
&:hover {
color: @primaryColor;
}
}
&.trail-begin{
a {
position: relative;
display: inline-block;
padding-left: 0;
&:hover {
opacity: 0.7;
}
}
}
&.trail-end{
padding-left: 8px;
}
}
}
&.porfolio-details {
position: relative;
}
}
.counter-top-area .rs-counter-list .count-text .rs-counter{
font-family: @titleFont !important;
}
.mc4wp-form-fields{
input[type="email"]{
&::-webkit-input-placeholder { /* Chrome/Opera/Safari */
color: #999;
}
&::-moz-placeholder { /* Firefox 19+ */
color: #999;
}
&:-ms-input-placeholder { /* IE 10+ */
color: #999;
}
&:-moz-placeholder { /* Firefox 18- */
color: #999;
}
}
}
.entry-content .page-links{
padding-top: 30px;
}
.comment-reply-title{
font-size: 24px;
font-weight: 700;
margin-top: 14px;
}
.page{
.comments-title{
font-size: 24px;
font-weight: 700;
}
}
.single-post{
.bs-sidebar{
h2{
margin-top: 0;
}
}
}
.recent-widget .show-featured .post-img img{
border-radius: 1px;
}
.format-aside .single-content-full .bs-desc {
margin-top: 0;
}
.close5{
background: #28406d;
color: #fff;
border-radius: 50%;
}
.wpb-js-composer .vc_tta.vc_tta-accordion .vc_tta-controls-icon-position-left.vc_tta-panel-title > a {
padding-right: 46px !important;
padding-left: 20px !important;
}
.wpb-js-composer .vc_tta-color-white.vc_tta-style-flat .vc_tta-controls-icon::after, .wpb-js-composer .vc_tta-color-white.vc_tta-style-flat .vc_tta-controls-icon::before {
border-color: @secondaryColor !important;
}
.wpb-js-composer .vc_tta-color-white.vc_tta-style-flat .vc_tta-panel .vc_tta-panel-title > a {
color: #000 !important;
border-radius:3px;
}
.wpb-js-composer .vc_tta-color-white.vc_tta-style-flat .vc_tta-panel.vc_active .vc_tta-panel-title > a {
color: #fff !important;
}
.wpb-js-composer .vc_tta-color-white.vc_tta-style-flat .vc_tta-panel .vc_tta-panel-title > a:hover {
color: #fff !important;
}
body.wpb-js-composer .vc_tta.vc_general .vc_tta-panel.vc_active .vc_tta-panel-title a > i.vc_tta-controls-icon:before{
border-color: #fff !important;
}
body.wpb-js-composer .vc_tta.vc_general .vc_tta-panel .vc_tta-panel-title a:hover > i.vc_tta-controls-icon:before,
body.wpb-js-composer .vc_tta.vc_general .vc_tta-panel .vc_tta-panel-title a:hover > i.vc_tta-controls-icon:after
{
border-color: #fff !important;
}
.home1-contact{
input.wpcf7-text,
select,
textarea{
background: @secondaryColor;
border: none;
color: #fff;
width: 100%;
margin-bottom: 30px;
outline: none;
}
input[type="submit"]{
background:@btnColor;
width: 100%;
font-size: 16px;
letter-spacing: 2px;
text-transform: uppercase;
margin-top: -7px;
border-radius: 0;
}
input.wpcf7-text{
height: 55px;
}
textarea{
height: 170px;
}
input[type="text"],
textarea,
input[type="email"]{
&::-webkit-input-placeholder { /* Chrome/Opera/Safari */
color: #fff;
opacity: 1;
}
&::-moz-placeholder { /* Firefox 19+ */
color: #fff;
opacity: 1;
}
&:-ms-input-placeholder { /* IE 10+ */
color: #fff;
opacity: 1;
}
&:-moz-placeholder { /* Firefox 18- */
color: #fff;
opacity: 1;
}
}
}
.dark-contact{
input.wpcf7-text,
select,
textarea{
background: transparent;
border: none;
border-bottom: 2px solid #999;
color: #fff;
width: 100%;
margin-bottom: 30px;
outline: none;
padding-left: 0;
}
input[type="submit"]{
background: @secondaryColor;
width: 100%;
font-size: 14px;
text-transform: uppercase;
border-radius: 0;
border-color: @secondaryColor;
padding: 12px 30px;
&:hover{
border-color: @secondaryColor;
background: transparent;
color: #fff;
}
}
input.wpcf7-text{
height: 55px;
}
textarea{
height: 120px;
}
input[type="text"],
textarea,
input[type="email"]{
&::-webkit-input-placeholder { /* Chrome/Opera/Safari */
color: #fff;
opacity: 1;
}
&::-moz-placeholder { /* Firefox 19+ */
color: #fff;
opacity: 1;
}
&:-ms-input-placeholder { /* IE 10+ */
color: #fff;
opacity: 1;
}
&:-moz-placeholder { /* Firefox 18- */
color: #fff;
opacity: 1;
}
}
}
.footer-top-contact{
.rs-contact{
color: #fff;
.contact-address{
.address-text{
h3{
color: #fff;
font-weight: 500;
}
a{
color: #fff;
&:hover{
color: @primaryColor;
}
}
}
}
}
}
.rs-portfolio-style7 .showcase-item img{
-webkit-animation: scale-up-center 0.8s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
animation: scale-up-center 0.8s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}
@-webkit-keyframes scale-up-center {
0% {
-webkit-transform: scale(0.5);
transform: scale(0.5);
}
100% {
-webkit-transform: scale(1);
transform: scale(1);
}
}
@keyframes scale-up-center {
0% {
-webkit-transform: scale(0.5);
transform: scale(0.5);
}
100% {
-webkit-transform: scale(1);
transform: scale(1);
}
}
.subscribe-form{
p{
text-align: center;
margin: 0 auto;
}
.mc4wp-form-fields{
margin: 0 auto;
}
input{
display: inline-block;
height: 70px;
line-height: 70px;
padding: 0 30px;
}
input[type="email"]{
width: 70%;
border-radius: 30px 0 0 30px;
}
input[type="submit"]{
border-radius: 0 30px 30px 0;
position: relative;
}
.signup-post{
display: none;
}
}
/*********************
FAQ
**********************/
.home-faq{
.vc_toggle{
color: #fff;
background: #333;
padding:16px 20px;
.vc_toggle_title > h4{
color: #fff;
-webkit-transition: background-color 2s ease-out;
-moz-transition: background-color 2s ease-out;
-o-transition: background-color 2s ease-out;
transition: background-color 2s ease-out;
font-size: 16px;
font-weight: 600;
}
.vc_toggle_content{
margin-bottom: 0 !important;
p{
margin-bottom: 5px;
}
}
}
}
body.wpb-js-composer .vc_tta.vc_general .vc_tta-panel .vc_tta-panel-title{
-webkit-transition: background-color 2s ease-out;
-moz-transition: background-color 2s ease-out;
-o-transition: background-color 2s ease-out;
transition: background-color 2s ease-out;
font-size: 15px;
font-weight: 600;
font-family: @titleFont;
}
body.wpb-js-composer .vc_tta.vc_general .vc_tta-panel.vc_active .vc_tta-panel-title a,
body.wpb-js-composer .vc_tta.vc_general .vc_tta-panel .vc_tta-panel-title:hover a{
color: #fff;
> i.vc_tta-controls-icon:before, > i.vc_tta-controls-icon:after{
border-color: #fff;
}
}
body .wpb-js-composer .vc_tta-color-white.vc_tta-style-classic .vc_tta-panel .vc_tta-panel-title > a{
color: @primaryColor !important;
}
.page-template-full-page{
#fp-nav{
ul{
>li{
> a{
&.active, &:hover{
span{
background: @secondaryColor;
}
}
}
}
}
}
}
/*********************
Contact
**********************/
.contact-business{
z-index: 9;
.form-button{
margin: 10px auto 0;
}
&.content-center
.form-button{
margin: 0 auto;
p{
text-align: center;
margin: 0 auto;
display: block;
}
}
}
.rsaddon-unique-slider .blog-content .blog-footer .blog-meta i {
color: @secondaryColor;
}
.rsaddon-unique-slider .blog-content .blog-footer .blog-meta .date{
font-size: 14px;
}
.woocommerce .loader:before{
display: none;
}
/*----------------------------------------------
Preloader
----------------------------------------------*/
#pre-load{
background-color: #fff;
height: 100%;
width: 100%;
position: fixed;
margin-top: 0px;
top: 0px;
z-index: 9999;
}
.loader .loader-container {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 100px;
height: 100px;
border: 5px solid #ebebec;
border-radius: 50%;
}
.loader .loader-container:before {
position: absolute;
content: "";
display: block;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 100px;
height: 100px;
border-top: 4px solid #f00c46;
border-radius: 50%;
animation: loaderspin 1.8s infinite ease-in-out;
-webkit-animation: loaderspin 1.8s infinite ease-in-out;
}
.loader .loader-icon {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 80px;
text-align: center;
}
.loader .loader-icon img {
animation: loaderpulse alternate 900ms infinite;
width: 30px;
}
.woocommerce .quantity input[type="number"]::-webkit-input-placeholder {
/* Chrome/Opera/Safari */
color: #363636 !important;
opacity: 1;
}
.woocommerce .quantity input[type="number"]::-moz-placeholder {
/* Firefox 19+ */
color: #363636 !important;
opacity: 1;
}
.woocommerce .quantity input[type="number"]:-ms-input-placeholder {
/* IE 10+ */
color: #363636 !important;
opacity: 1;
}
.woocommerce .quantity input[type="number"]:-moz-placeholder {
/* Firefox 18- */
color: #363636 !important;
opacity: 1;
}
@keyframes loaderspin {
0% {
transform: translate(-50%, -50%) rotate(0deg);
}
100% {
transform: translate(-50%, -50%) rotate(360deg);
}
}
@-webkit-keyframes loaderspin {
0% {
transform: translate(-50%, -50%) rotate(0deg);
}
100% {
transform: translate(-50%, -50%) rotate(360deg);
}
}
@keyframes loaderpulse {
0% {
transform: scale(1);
}
100% {
transform: scale(1.2);
}
}
/*-------------------------
33.Preloader CSS
---------------------------*/
#braintech-load{
background-color: #fff;
height: 100%;
width: 100%;
position: fixed;
z-index: 1;
margin-top: 0px;
top: 0px;
z-index: 999999;
img{
position: absolute;
top: 50%;
left: 50%;
padding:15px;
transform: translate(-50%, -50%);
}
}
.loader-braintech {
position: absolute;
width: 75px;
height: 100px;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
.spinner {
width: 40px;
height: 40px;
margin-top: -20px;
margin-left: -20px;
background-color: @secondaryColor;
border-radius: 100%;
-webkit-animation: sk-scaleout 1.0s infinite ease-in-out;
animation: sk-scaleout 1.0s infinite ease-in-out;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
.spinner_inner-image{
position: absolute;
top: 50%;
left: 50%;
z-index: 99;
transform: translate(-50%, -50%);
}
@-webkit-keyframes sk-scaleout {
0% { -webkit-transform: scale(0) }
100% {
-webkit-transform: scale(1.1);
opacity: 0;
}
}
@keyframes sk-scaleout {
0% {
-webkit-transform: scale(0);
transform: scale(0);
} 100% {
-webkit-transform: scale(1.1);
transform: scale(1.1);
opacity: 0;
}
}
.flaticon-cross.closes:before{
color: @whiteColor;
margin: 0;
font-size: 20px;
font-weight: 700;
}
.sidenav{
.widget_nav_menu ul li.mega{
position:relative !important;
}
}
.max1000{
.slick-list{
max-width: 1000px !important;
margin: 0 auto !important;
}
}
@-webkit-keyframes braintech-loader-anim {
0% {
opacity: 1;
-webkit-transform: scale(.1);
transform: scale(.1);
}
70% {
opacity: .5;
-webkit-transform: scale(1);
transform: scale(1);
}
95% {
opacity: 0;
}
}
@-moz-keyframes braintech-loader-anim {
0% {
opacity: 1;
-moz-transform: scale(.1);
transform: scale(.1);
}
70% {
opacity: .5;
-moz-transform: scale(1);
transform: scale(1);
}
95% {
opacity: 0;
}
}
@-o-keyframes braintech-loader-anim {
0% {
opacity: 1;
-o-transform: scale(.1);
transform: scale(.1);
}
70% {
opacity: .5;
-o-transform: scale(1);
transform: scale(1);
}
95% {
opacity: 0;
}
}
@keyframes braintech-loader-anim {
0% {
opacity: 1;
-webkit-transform: scale(.1);
-moz-transform: scale(.1);
-o-transform: scale(.1);
transform: scale(.1);
}
70% {
opacity: .5;
-webkit-transform: scale(1);
-moz-transform: scale(1);
-o-transform: scale(1);
transform: scale(1);
}
95% {
opacity: 0;
}
}
@-webkit-keyframes anim {
from {
left: -100%;
}
to {
left:100%;
}
}
@keyframes anim {
from {
left: -100%;
}
to {
left:100%;
}
}
.zin-1{
.rs-animation-shape-image .middle-image{
z-index: -1 !important;
}
}
.rs-testimonial .rs-addon-slider{
.slick-prev{
visibility: visible;
opacity: 1;
left: 0;
border: 1px solid #fff;
&:before{
line-height: 45px;
}
}
.slick-next{
visibility: visible;
opacity: 1;
right: 0;
border: 1px solid #fff;
&:before{
line-height: 45px;
}
}
}
.rs-portfolio-slider.rs-portfolio-style3{
&.rs-custom{
.slick-prev{
visibility: visible;
opacity: 1;
left: 0;
border: 1px solid #fff;
&:before{
line-height: 45px;
}
}
.slick-next{
visibility: visible;
opacity: 1;
right: 0;
border: 1px solid #fff;
&:before{
line-height: 45px;
}
}
}
}
.rs-logo-grid{
&.style2tws{
.cols{
.logo-title{
position: relative;
&:before{
content: '';
position: absolute;
top: 0;
left: 50%;
height: 40px;
width: 1px;
transform: translateX(-50%);
background-color: #FFFFFF21;
-webkit-transition: all 0.25s ease;
transition: all 0.25s ease;
}
&:after{
content: '';
position: absolute;
top: 40px;
left: 50.3%;
height: 12px;
border-radius: 50%;
width: 12px;
transform: translateX(-50%);
background-color: #FFFFFF21;
-webkit-transition: all 0.25s ease;
transition: all 0.25s ease;
}
}
}
}
}
.rs-addon-slider{
.slick-next{
&:before{
content: "\f114";
font-size: 18px;
color: @secondaryColor;
margin: 0;
display: inline-block;
font-family:flaticon !important;
font-weight: 600;
text-align: center;
}
}
.slick-prev{
&:before{
content: "\f115";
font-size: 18px;
color: @secondaryColor;
margin: 0;
display: inline-block;
font-family:flaticon !important;
font-weight: 600;
text-align: center;
}
}
}
.rs-gradient-yes{
.rs-counter-list .count-text span{
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-image: linear-gradient(90deg, @secondaryColor 10%, @thirdColor 100%);
}
}
.rs-counter-list .count-text span.rs-counter{
position:relative;
z-index: 2;
&:after{
content: "";
height: 8px;
position: absolute;
bottom: 12px;
right: 0;
left: 0px;
-webkit-transition: all .3s ease;
transition: all .3s ease;
z-index: -1;
}
}
.breadcrumbs-inner{
.page-title{
position:relative;
z-index: 2;
&:after{
content: "";
height: 8px;
position: absolute;
bottom: 43px;
right: 0;
left: 0px;
-webkit-transition: all .3s ease;
transition: all .3s ease;
z-index: -1;
background:@secondaryColor;
width: 140px;
margin: 0 auto;
}
}
}
.cd-title {
position: relative;
height: 160px;
text-align: center;
}
.cd-intro {
width: 90%;
max-width: 768px;
text-align: center;
}
.cd-words-wrapper {
display: inline-block;
position: relative;
text-align: left;
margin-left: 10px;
}
.cd-words-wrapper p {
display: inline-block;
position: absolute;
white-space: nowrap;
left: 0;
top: 0;
}
.cd-words-wrapper p.is-visible {
position: relative;
}
.no-js .cd-words-wrapper p {
opacity: 0;
}
.no-js .cd-words-wrapper p.is-visible {
opacity: 1;
}
body .wpcf7 form.invalid .wpcf7-response-output,
body .wpcf7 form.unaccepted .wpcf7-response-output{
border-color: @secondaryColor;
}
.dark-border-color .wpcf7 form.invalid .wpcf7-response-output,
.dark-border-color .wpcf7 form.unaccepted .wpcf7-response-output{
border-color: @secondaryColor;
color: #fff;
}
.blog-btn i,
.rs-btn .rs_button i{
transition: 0.4s;
&:before{
font-weight: 500;
font-size: 17px;
margin: 0;
}
}
/* --------------------------------
xrotate-1
-------------------------------- */
.cd-headline.rotate-1 .cd-words-wrapper {
-webkit-perspective: 300px;
-moz-perspective: 300px;
perspective: 300px;
}
.cd-headline.rotate-1 p {
opacity: 0;
-webkit-transform-origin: 50% 100%;
-moz-transform-origin: 50% 100%;
-ms-transform-origin: 50% 100%;
-o-transform-origin: 50% 100%;
transform-origin: 50% 100%;
-webkit-transform: rotateX(180deg);
-moz-transform: rotateX(180deg);
-ms-transform: rotateX(180deg);
-o-transform: rotateX(180deg);
transform: rotateX(180deg);
}
.cd-headline.rotate-1 p.is-visible {
opacity: 1;
-webkit-transform: rotateX(0deg);
-moz-transform: rotateX(0deg);
-ms-transform: rotateX(0deg);
-o-transform: rotateX(0deg);
transform: rotateX(0deg);
-webkit-animation: cd-rotate-1-in 1.2s;
-moz-animation: cd-rotate-1-in 1.2s;
animation: cd-rotate-1-in 1.2s;
}
.cd-headline.rotate-1 p.is-hidden {
-webkit-transform: rotateX(180deg);
-moz-transform: rotateX(180deg);
-ms-transform: rotateX(180deg);
-o-transform: rotateX(180deg);
transform: rotateX(180deg);
-webkit-animation: cd-rotate-1-out 1.2s;
-moz-animation: cd-rotate-1-out 1.2s;
animation: cd-rotate-1-out 1.2s;
}
@-webkit-keyframes cd-rotate-1-in {
0% {
-webkit-transform: rotateX(180deg);
opacity: 0;
}
35% {
-webkit-transform: rotateX(120deg);
opacity: 0;
}
65% {
opacity: 0;
}
100% {
-webkit-transform: rotateX(360deg);
opacity: 1;
}
}
@-moz-keyframes cd-rotate-1-in {
0% {
-moz-transform: rotateX(180deg);
opacity: 0;
}
35% {
-moz-transform: rotateX(120deg);
opacity: 0;
}
65% {
opacity: 0;
}
100% {
-moz-transform: rotateX(360deg);
opacity: 1;
}
}
@keyframes cd-rotate-1-in {
0% {
-webkit-transform: rotateX(180deg);
-moz-transform: rotateX(180deg);
-ms-transform: rotateX(180deg);
-o-transform: rotateX(180deg);
transform: rotateX(180deg);
opacity: 0;
}
35% {
-webkit-transform: rotateX(120deg);
-moz-transform: rotateX(120deg);
-ms-transform: rotateX(120deg);
-o-transform: rotateX(120deg);
transform: rotateX(120deg);
opacity: 0;
}
65% {
opacity: 0;
}
100% {
-webkit-transform: rotateX(360deg);
-moz-transform: rotateX(360deg);
-ms-transform: rotateX(360deg);
-o-transform: rotateX(360deg);
transform: rotateX(360deg);
opacity: 1;
}
}
@-webkit-keyframes cd-rotate-1-out {
0% {
-webkit-transform: rotateX(0deg);
opacity: 1;
}
35% {
-webkit-transform: rotateX(-40deg);
opacity: 1;
}
65% {
opacity: 0;
}
100% {
-webkit-transform: rotateX(180deg);
opacity: 0;
}
}
@-moz-keyframes cd-rotate-1-out {
0% {
-moz-transform: rotateX(0deg);
opacity: 1;
}
35% {
-moz-transform: rotateX(-40deg);
opacity: 1;
}
65% {
opacity: 0;
}
100% {
-moz-transform: rotateX(180deg);
opacity: 0;
}
}
@keyframes cd-rotate-1-out {
0% {
-webkit-transform: rotateX(0deg);
-moz-transform: rotateX(0deg);
-ms-transform: rotateX(0deg);
-o-transform: rotateX(0deg);
transform: rotateX(0deg);
opacity: 1;
}
35% {
-webkit-transform: rotateX(-40deg);
-moz-transform: rotateX(-40deg);
-ms-transform: rotateX(-40deg);
-o-transform: rotateX(-40deg);
transform: rotateX(-40deg);
opacity: 1;
}
65% {
opacity: 0;
}
100% {
-webkit-transform: rotateX(180deg);
-moz-transform: rotateX(180deg);
-ms-transform: rotateX(180deg);
-o-transform: rotateX(180deg);
transform: rotateX(180deg);
opacity: 0;
}
}
/* --------------------------------
xtype
-------------------------------- */
.cd-headline.type .cd-words-wrapper {
vertical-align: top;
overflow: hidden;
}
.cd-headline.type .cd-words-wrapper::after {
/* vertical bar */
content: '';
position: absolute;
right: 0;
top: 50%;
bottom: auto;
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-o-transform: translateY(-50%);
transform: translateY(-50%);
height: 90%;
width: 1px;
background-color: #aebcb9;
}
.nicescroll-rails{
z-index: 999 !important;
}
.cd-headline.type .cd-words-wrapper.waiting::after {
-webkit-animation: cd-pulse 1s infinite;
-moz-animation: cd-pulse 1s infinite;
animation: cd-pulse 1s infinite;
}
.cd-headline.type .cd-words-wrapper.selected {
background-color: #aebcb9;
}
.cd-headline.type .cd-words-wrapper.selected::after {
visibility: hidden;
}
.cd-headline.type .cd-words-wrapper.selected p {
color: #0d0d0d;
}
.cd-headline.type p {
visibility: hidden;
}
.cd-headline.type p.is-visible {
visibility: visible;
}
.cd-headline.type i {
position: absolute;
visibility: hidden;
}
.cd-headline.type i.in {
position: relative;
visibility: visible;
}
@-webkit-keyframes cd-pulse {
0% {
-webkit-transform: translateY(-50%) scale(1);
opacity: 1;
}
40% {
-webkit-transform: translateY(-50%) scale(0.9);
opacity: 0;
}
100% {
-webkit-transform: translateY(-50%) scale(0);
opacity: 0;
}
}
@-moz-keyframes cd-pulse {
0% {
-moz-transform: translateY(-50%) scale(1);
opacity: 1;
}
40% {
-moz-transform: translateY(-50%) scale(0.9);
opacity: 0;
}
100% {
-moz-transform: translateY(-50%) scale(0);
opacity: 0;
}
}
@keyframes cd-pulse {
0% {
-webkit-transform: translateY(-50%) scale(1);
-moz-transform: translateY(-50%) scale(1);
-ms-transform: translateY(-50%) scale(1);
-o-transform: translateY(-50%) scale(1);
transform: translateY(-50%) scale(1);
opacity: 1;
}
40% {
-webkit-transform: translateY(-50%) scale(0.9);
-moz-transform: translateY(-50%) scale(0.9);
-ms-transform: translateY(-50%) scale(0.9);
-o-transform: translateY(-50%) scale(0.9);
transform: translateY(-50%) scale(0.9);
opacity: 0;
}
100% {
-webkit-transform: translateY(-50%) scale(0);
-moz-transform: translateY(-50%) scale(0);
-ms-transform: translateY(-50%) scale(0);
-o-transform: translateY(-50%) scale(0);
transform: translateY(-50%) scale(0);
opacity: 0;
}
}
/* --------------------------------
xrotate-2
-------------------------------- */
.cd-headline.rotate-2 .cd-words-wrapper {
-webkit-perspective: 300px;
-moz-perspective: 300px;
perspective: 300px;
}
.cd-headline.rotate-2 i, .cd-headline.rotate-2 em {
display: inline-block;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.cd-headline.rotate-2 b {
opacity: 0;
}
.cd-headline.rotate-2 i {
-webkit-transform-style: preserve-3d;
-moz-transform-style: preserve-3d;
-ms-transform-style: preserve-3d;
-o-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-transform: translateZ(-20px) rotateX(90deg);
-moz-transform: translateZ(-20px) rotateX(90deg);
-ms-transform: translateZ(-20px) rotateX(90deg);
-o-transform: translateZ(-20px) rotateX(90deg);
transform: translateZ(-20px) rotateX(90deg);
opacity: 0;
}
.is-visible .cd-headline.rotate-2 i {
opacity: 1;
}
.cd-headline.rotate-2 i.in {
-webkit-animation: cd-rotate-2-in 0.4s forwards;
-moz-animation: cd-rotate-2-in 0.4s forwards;
animation: cd-rotate-2-in 0.4s forwards;
}
.cd-headline.rotate-2 i.out {
-webkit-animation: cd-rotate-2-out 0.4s forwards;
-moz-animation: cd-rotate-2-out 0.4s forwards;
animation: cd-rotate-2-out 0.4s forwards;
}
.cd-headline.rotate-2 em {
-webkit-transform: translateZ(20px);
-moz-transform: translateZ(20px);
-ms-transform: translateZ(20px);
-o-transform: translateZ(20px);
transform: translateZ(20px);
}
.no-csstransitions .cd-headline.rotate-2 i {
-webkit-transform: rotateX(0deg);
-moz-transform: rotateX(0deg);
-ms-transform: rotateX(0deg);
-o-transform: rotateX(0deg);
transform: rotateX(0deg);
opacity: 0;
}
.no-csstransitions .cd-headline.rotate-2 i em {
-webkit-transform: scale(1);
-moz-transform: scale(1);
-ms-transform: scale(1);
-o-transform: scale(1);
transform: scale(1);
}
.no-csstransitions .cd-headline.rotate-2 .is-visible i {
opacity: 1;
}
@-webkit-keyframes cd-rotate-2-in {
0% {
opacity: 0;
-webkit-transform: translateZ(-20px) rotateX(90deg);
}
60% {
opacity: 1;
-webkit-transform: translateZ(-20px) rotateX(-10deg);
}
100% {
opacity: 1;
-webkit-transform: translateZ(-20px) rotateX(0deg);
}
}
@-moz-keyframes cd-rotate-2-in {
0% {
opacity: 0;
-moz-transform: translateZ(-20px) rotateX(90deg);
}
60% {
opacity: 1;
-moz-transform: translateZ(-20px) rotateX(-10deg);
}
100% {
opacity: 1;
-moz-transform: translateZ(-20px) rotateX(0deg);
}
}
@keyframes cd-rotate-2-in {
0% {
opacity: 0;
-webkit-transform: translateZ(-20px) rotateX(90deg);
-moz-transform: translateZ(-20px) rotateX(90deg);
-ms-transform: translateZ(-20px) rotateX(90deg);
-o-transform: translateZ(-20px) rotateX(90deg);
transform: translateZ(-20px) rotateX(90deg);
}
60% {
opacity: 1;
-webkit-transform: translateZ(-20px) rotateX(-10deg);
-moz-transform: translateZ(-20px) rotateX(-10deg);
-ms-transform: translateZ(-20px) rotateX(-10deg);
-o-transform: translateZ(-20px) rotateX(-10deg);
transform: translateZ(-20px) rotateX(-10deg);
}
100% {
opacity: 1;
-webkit-transform: translateZ(-20px) rotateX(0deg);
-moz-transform: translateZ(-20px) rotateX(0deg);
-ms-transform: translateZ(-20px) rotateX(0deg);
-o-transform: translateZ(-20px) rotateX(0deg);
transform: translateZ(-20px) rotateX(0deg);
}
}
@-webkit-keyframes cd-rotate-2-out {
0% {
opacity: 1;
-webkit-transform: translateZ(-20px) rotateX(0);
}
60% {
opacity: 0;
-webkit-transform: translateZ(-20px) rotateX(-100deg);
}
100% {
opacity: 0;
-webkit-transform: translateZ(-20px) rotateX(-90deg);
}
}
@-moz-keyframes cd-rotate-2-out {
0% {
opacity: 1;
-moz-transform: translateZ(-20px) rotateX(0);
}
60% {
opacity: 0;
-moz-transform: translateZ(-20px) rotateX(-100deg);
}
100% {
opacity: 0;
-moz-transform: translateZ(-20px) rotateX(-90deg);
}
}
@keyframes cd-rotate-2-out {
0% {
opacity: 1;
-webkit-transform: translateZ(-20px) rotateX(0);
-moz-transform: translateZ(-20px) rotateX(0);
-ms-transform: translateZ(-20px) rotateX(0);
-o-transform: translateZ(-20px) rotateX(0);
transform: translateZ(-20px) rotateX(0);
}
60% {
opacity: 0;
-webkit-transform: translateZ(-20px) rotateX(-100deg);
-moz-transform: translateZ(-20px) rotateX(-100deg);
-ms-transform: translateZ(-20px) rotateX(-100deg);
-o-transform: translateZ(-20px) rotateX(-100deg);
transform: translateZ(-20px) rotateX(-100deg);
}
100% {
opacity: 0;
-webkit-transform: translateZ(-20px) rotateX(-90deg);
-moz-transform: translateZ(-20px) rotateX(-90deg);
-ms-transform: translateZ(-20px) rotateX(-90deg);
-o-transform: translateZ(-20px) rotateX(-90deg);
transform: translateZ(-20px) rotateX(-90deg);
}
}
/* --------------------------------
xloading-bar
-------------------------------- */
.cd-headline.loading-bar span {
display: inline-block;
padding: .2em 0;
}
.cd-headline.loading-bar .cd-words-wrapper {
overflow: hidden;
vertical-align: top;
}
.cd-headline.loading-bar .cd-words-wrapper::after {
/* loading bar */
content: '';
position: absolute;
left: 0;
bottom: 0;
height: 3px;
width: 0;
background: #0096a7;
z-index: 2;
-webkit-transition: width 0.3s -0.1s;
-moz-transition: width 0.3s -0.1s;
transition: width 0.3s -0.1s;
}
.cd-headline.loading-bar .cd-words-wrapper.is-loading::after {
width: 100%;
-webkit-transition: width 3s;
-moz-transition: width 3s;
transition: width 3s;
}
.cd-headline.loading-bar p {
top: .2em;
opacity: 0;
-webkit-transition: opacity 0.3s;
-moz-transition: opacity 0.3s;
transition: opacity 0.3s;
}
.cd-headline.loading-bar p.is-visible {
opacity: 1;
top: 0;
}
/* --------------------------------
xslide
-------------------------------- */
.cd-headline.slide span {
display: inline-block;
padding: .2em 0;
}
.cd-headline.slide .cd-words-wrapper {
overflow: hidden;
vertical-align: top;
}
.cd-headline.slide p {
opacity: 0;
top: .2em;
}
.cd-headline.slide p.is-visible {
top: 0;
opacity: 1;
-webkit-animation: slide-in 0.6s;
-moz-animation: slide-in 0.6s;
animation: slide-in 0.6s;
}
.cd-headline.slide p.is-hidden {
-webkit-animation: slide-out 0.6s;
-moz-animation: slide-out 0.6s;
animation: slide-out 0.6s;
}
@-webkit-keyframes slide-in {
0% {
opacity: 0;
-webkit-transform: translateY(-100%);
}
60% {
opacity: 1;
-webkit-transform: translateY(20%);
}
100% {
opacity: 1;
-webkit-transform: translateY(0);
}
}
@-moz-keyframes slide-in {
0% {
opacity: 0;
-moz-transform: translateY(-100%);
}
60% {
opacity: 1;
-moz-transform: translateY(20%);
}
100% {
opacity: 1;
-moz-transform: translateY(0);
}
}
@keyframes slide-in {
0% {
opacity: 0;
-webkit-transform: translateY(-100%);
-moz-transform: translateY(-100%);
-ms-transform: translateY(-100%);
-o-transform: translateY(-100%);
transform: translateY(-100%);
}
60% {
opacity: 1;
-webkit-transform: translateY(20%);
-moz-transform: translateY(20%);
-ms-transform: translateY(20%);
-o-transform: translateY(20%);
transform: translateY(20%);
}
100% {
opacity: 1;
-webkit-transform: translateY(0);
-moz-transform: translateY(0);
-ms-transform: translateY(0);
-o-transform: translateY(0);
transform: translateY(0);
}
}
@-webkit-keyframes slide-out {
0% {
opacity: 1;
-webkit-transform: translateY(0);
}
60% {
opacity: 0;
-webkit-transform: translateY(120%);
}
100% {
opacity: 0;
-webkit-transform: translateY(100%);
}
}
@-moz-keyframes slide-out {
0% {
opacity: 1;
-moz-transform: translateY(0);
}
60% {
opacity: 0;
-moz-transform: translateY(120%);
}
100% {
opacity: 0;
-moz-transform: translateY(100%);
}
}
@keyframes slide-out {
0% {
opacity: 1;
-webkit-transform: translateY(0);
-moz-transform: translateY(0);
-ms-transform: translateY(0);
-o-transform: translateY(0);
transform: translateY(0);
}
60% {
opacity: 0;
-webkit-transform: translateY(120%);
-moz-transform: translateY(120%);
-ms-transform: translateY(120%);
-o-transform: translateY(120%);
transform: translateY(120%);
}
100% {
opacity: 0;
-webkit-transform: translateY(100%);
-moz-transform: translateY(100%);
-ms-transform: translateY(100%);
-o-transform: translateY(100%);
transform: translateY(100%);
}
}
/* --------------------------------
xclip
-------------------------------- */
.cd-headline.clip span {
display: inline-block;
padding: .2em 0;
}
.cd-headline.clip .cd-words-wrapper {
overflow: hidden;
vertical-align: top;
}
.cd-headline.clip .cd-words-wrapper::after {
/* line */
content: '';
position: absolute;
top: 0;
right: 0;
width: 2px;
height: 100%;
background-color: #aebcb9;
}
.cd-headline.clip p {
opacity: 0;
margin-bottom: 0;
}
.cd-headline.clip p.is-visible {
opacity: 1;
}
/* --------------------------------
xzoom
-------------------------------- */
.cd-headline.zoom .cd-words-wrapper {
-webkit-perspective: 300px;
-moz-perspective: 300px;
perspective: 300px;
}
.cd-headline.zoom p {
opacity: 0;
}
.cd-headline.zoom p.is-visible {
opacity: 1;
-webkit-animation: zoom-in 0.8s;
-moz-animation: zoom-in 0.8s;
animation: zoom-in 0.8s;
}
.cd-headline.zoom p.is-hidden {
-webkit-animation: zoom-out 0.8s;
-moz-animation: zoom-out 0.8s;
animation: zoom-out 0.8s;
}
#rs-newsletter-subscribe {
.newsletter-title {
color: rgb(255, 255, 255);
margin-bottom: 0px;
font-size: 36px;
}
.text-right {
position: relative;
text-align: left !important;
}
.text-right input[type="email"] {
margin-bottom: 0px;
max-width: 390px;
padding-top: 19px;
padding-bottom: 19px;
border-radius: 5px;
}
.text-right input[type="submit"] {
position: absolute;
z-index: 2;
right: 15px;
top: 50%;
transform: translateY(-50%);
font-size: 16px;
font-weight: 600;
height: 60px;
border-radius: 5px;
background: rgb(3, 46, 66);
transition: all 0.3s ease 0s;
}
.row {
align-items: center;
}
}
@-webkit-keyframes zoom-in {
0% {
opacity: 0;
-webkit-transform: translateZ(100px);
}
100% {
opacity: 1;
-webkit-transform: translateZ(0);
}
}
@-moz-keyframes zoom-in {
0% {
opacity: 0;
-moz-transform: translateZ(100px);
}
100% {
opacity: 1;
-moz-transform: translateZ(0);
}
}
@keyframes zoom-in {
0% {
opacity: 0;
-webkit-transform: translateZ(100px);
-moz-transform: translateZ(100px);
-ms-transform: translateZ(100px);
-o-transform: translateZ(100px);
transform: translateZ(100px);
}
100% {
opacity: 1;
-webkit-transform: translateZ(0);
-moz-transform: translateZ(0);
-ms-transform: translateZ(0);
-o-transform: translateZ(0);
transform: translateZ(0);
}
}
@-webkit-keyframes zoom-out {
0% {
opacity: 1;
-webkit-transform: translateZ(0);
}
100% {
opacity: 0;
-webkit-transform: translateZ(-100px);
}
}
@-moz-keyframes zoom-out {
0% {
opacity: 1;
-moz-transform: translateZ(0);
}
100% {
opacity: 0;
-moz-transform: translateZ(-100px);
}
}
@keyframes zoom-out {
0% {
opacity: 1;
-webkit-transform: translateZ(0);
-moz-transform: translateZ(0);
-ms-transform: translateZ(0);
-o-transform: translateZ(0);
transform: translateZ(0);
}
100% {
opacity: 0;
-webkit-transform: translateZ(-100px);
-moz-transform: translateZ(-100px);
-ms-transform: translateZ(-100px);
-o-transform: translateZ(-100px);
transform: translateZ(-100px);
}
}
/* --------------------------------
xrotate-3
-------------------------------- */
.cd-headline.rotate-3 .cd-words-wrapper {
-webkit-perspective: 300px;
-moz-perspective: 300px;
perspective: 300px;
}
.cd-headline.rotate-3 p {
opacity: 0;
}
.cd-headline.rotate-3 i {
display: inline-block;
-webkit-transform: rotateY(180deg);
-moz-transform: rotateY(180deg);
-ms-transform: rotateY(180deg);
-o-transform: rotateY(180deg);
transform: rotateY(180deg);
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.is-visible .cd-headline.rotate-3 i {
-webkit-transform: rotateY(0deg);
-moz-transform: rotateY(0deg);
-ms-transform: rotateY(0deg);
-o-transform: rotateY(0deg);
transform: rotateY(0deg);
}
.cd-headline.rotate-3 i.in {
-webkit-animation: cd-rotate-3-in 0.6s forwards;
-moz-animation: cd-rotate-3-in 0.6s forwards;
animation: cd-rotate-3-in 0.6s forwards;
}
.cd-headline.rotate-3 i.out {
-webkit-animation: cd-rotate-3-out 0.6s forwards;
-moz-animation: cd-rotate-3-out 0.6s forwards;
animation: cd-rotate-3-out 0.6s forwards;
}
.no-csstransitions .cd-headline.rotate-3 i {
-webkit-transform: rotateY(0deg);
-moz-transform: rotateY(0deg);
-ms-transform: rotateY(0deg);
-o-transform: rotateY(0deg);
transform: rotateY(0deg);
opacity: 0;
}
.no-csstransitions .cd-headline.rotate-3 .is-visible i {
opacity: 1;
}
@-webkit-keyframes cd-rotate-3-in {
0% {
-webkit-transform: rotateY(180deg);
}
100% {
-webkit-transform: rotateY(0deg);
}
}
@-moz-keyframes cd-rotate-3-in {
0% {
-moz-transform: rotateY(180deg);
}
100% {
-moz-transform: rotateY(0deg);
}
}
@keyframes cd-rotate-3-in {
0% {
-webkit-transform: rotateY(180deg);
-moz-transform: rotateY(180deg);
-ms-transform: rotateY(180deg);
-o-transform: rotateY(180deg);
transform: rotateY(180deg);
}
100% {
-webkit-transform: rotateY(0deg);
-moz-transform: rotateY(0deg);
-ms-transform: rotateY(0deg);
-o-transform: rotateY(0deg);
transform: rotateY(0deg);
}
}
@-webkit-keyframes cd-rotate-3-out {
0% {
-webkit-transform: rotateY(0);
}
100% {
-webkit-transform: rotateY(-180deg);
}
}
@-moz-keyframes cd-rotate-3-out {
0% {
-moz-transform: rotateY(0);
}
100% {
-moz-transform: rotateY(-180deg);
}
}
@keyframes cd-rotate-3-out {
0% {
-webkit-transform: rotateY(0);
-moz-transform: rotateY(0);
-ms-transform: rotateY(0);
-o-transform: rotateY(0);
transform: rotateY(0);
}
100% {
-webkit-transform: rotateY(-180deg);
-moz-transform: rotateY(-180deg);
-ms-transform: rotateY(-180deg);
-o-transform: rotateY(-180deg);
transform: rotateY(-180deg);
}
}
/* --------------------------------
xscale
-------------------------------- */
.cd-headline.scale p {
opacity: 0;
}
.cd-headline.scale i {
display: inline-block;
opacity: 0;
-webkit-transform: scale(0);
-moz-transform: scale(0);
-ms-transform: scale(0);
-o-transform: scale(0);
transform: scale(0);
}
.is-visible .cd-headline.scale i {
opacity: 1;
}
.cd-headline.scale i.in {
-webkit-animation: scale-up 0.6s forwards;
-moz-animation: scale-up 0.6s forwards;
animation: scale-up 0.6s forwards;
}
.cd-headline.scale i.out {
-webkit-animation: scale-down 0.6s forwards;
-moz-animation: scale-down 0.6s forwards;
animation: scale-down 0.6s forwards;
}
.no-csstransitions .cd-headline.scale i {
-webkit-transform: scale(1);
-moz-transform: scale(1);
-ms-transform: scale(1);
-o-transform: scale(1);
transform: scale(1);
opacity: 0;
}
.no-csstransitions .cd-headline.scale .is-visible i {
opacity: 1;
}
@-webkit-keyframes scale-up {
0% {
-webkit-transform: scale(0);
opacity: 0;
}
60% {
-webkit-transform: scale(1.2);
opacity: 1;
}
100% {
-webkit-transform: scale(1);
opacity: 1;
}
}
@-moz-keyframes scale-up {
0% {
-moz-transform: scale(0);
opacity: 0;
}
60% {
-moz-transform: scale(1.2);
opacity: 1;
}
100% {
-moz-transform: scale(1);
opacity: 1;
}
}
@keyframes scale-up {
0% {
-webkit-transform: scale(0);
-moz-transform: scale(0);
-ms-transform: scale(0);
-o-transform: scale(0);
transform: scale(0);
opacity: 0;
}
60% {
-webkit-transform: scale(1.2);
-moz-transform: scale(1.2);
-ms-transform: scale(1.2);
-o-transform: scale(1.2);
transform: scale(1.2);
opacity: 1;
}
100% {
-webkit-transform: scale(1);
-moz-transform: scale(1);
-ms-transform: scale(1);
-o-transform: scale(1);
transform: scale(1);
opacity: 1;
}
}
@-webkit-keyframes scale-down {
0% {
-webkit-transform: scale(1);
opacity: 1;
}
60% {
-webkit-transform: scale(0);
opacity: 0;
}
}
@-moz-keyframes scale-down {
0% {
-moz-transform: scale(1);
opacity: 1;
}
60% {
-moz-transform: scale(0);
opacity: 0;
}
}
@keyframes scale-down {
0% {
-webkit-transform: scale(1);
-moz-transform: scale(1);
-ms-transform: scale(1);
-o-transform: scale(1);
transform: scale(1);
opacity: 1;
}
60% {
-webkit-transform: scale(0);
-moz-transform: scale(0);
-ms-transform: scale(0);
-o-transform: scale(0);
transform: scale(0);
opacity: 0;
}
}
/* --------------------------------
xpush
-------------------------------- */
.cd-headline.push p {
opacity: 0;
}
.cd-headline.push p.is-visible {
opacity: 1;
-webkit-animation: push-in 0.6s;
-moz-animation: push-in 0.6s;
animation: push-in 0.6s;
}
.cd-headline.push p.is-hidden {
-webkit-animation: push-out 0.6s;
-moz-animation: push-out 0.6s;
animation: push-out 0.6s;
}
@-webkit-keyframes push-in {
0% {
opacity: 0;
-webkit-transform: translateX(-100%);
}
60% {
opacity: 1;
-webkit-transform: translateX(10%);
}
100% {
opacity: 1;
-webkit-transform: translateX(0);
}
}
@-moz-keyframes push-in {
0% {
opacity: 0;
-moz-transform: translateX(-100%);
}
60% {
opacity: 1;
-moz-transform: translateX(10%);
}
100% {
opacity: 1;
-moz-transform: translateX(0);
}
}
@keyframes push-in {
0% {
opacity: 0;
-webkit-transform: translateX(-100%);
-moz-transform: translateX(-100%);
-ms-transform: translateX(-100%);
-o-transform: translateX(-100%);
transform: translateX(-100%);
}
60% {
opacity: 1;
-webkit-transform: translateX(10%);
-moz-transform: translateX(10%);
-ms-transform: translateX(10%);
-o-transform: translateX(10%);
transform: translateX(10%);
}
100% {
opacity: 1;
-webkit-transform: translateX(0);
-moz-transform: translateX(0);
-ms-transform: translateX(0);
-o-transform: translateX(0);
transform: translateX(0);
}
}
@-webkit-keyframes push-out {
0% {
opacity: 1;
-webkit-transform: translateX(0);
}
60% {
opacity: 0;
-webkit-transform: translateX(110%);
}
100% {
opacity: 0;
-webkit-transform: translateX(100%);
}
}
@-moz-keyframes push-out {
0% {
opacity: 1;
-moz-transform: translateX(0);
}
60% {
opacity: 0;
-moz-transform: translateX(110%);
}
100% {
opacity: 0;
-moz-transform: translateX(100%);
}
}
@keyframes push-out {
0% {
opacity: 1;
-webkit-transform: translateX(0);
-moz-transform: translateX(0);
-ms-transform: translateX(0);
-o-transform: translateX(0);
transform: translateX(0);
}
60% {
opacity: 0;
-webkit-transform: translateX(110%);
-moz-transform: translateX(110%);
-ms-transform: translateX(110%);
-o-transform: translateX(110%);
transform: translateX(110%);
}
100% {
opacity: 0;
-webkit-transform: translateX(100%);
-moz-transform: translateX(100%);
-ms-transform: translateX(100%);
-o-transform: translateX(100%);
transform: translateX(100%);
}
}