My Blog

CSS

[css]
body {
font-family: “Open Sans”, sans-serif;
background: #f1f1f1;
}.contain-to-grid .top-bar {
max-width: 48.5rem;
}h1, h1 a {
color: #383637;
font-family: “Open Sans”, sans-serif;
font-size: 28px;
font-weight: 300;
line-height: 1.27em;
margin: 25px 0;
}h2 {
color: #383637;
font-family: “Open Sans”, sans-serif;
font-size: 25px;
font-weight: 300;
line-height: 1.5rem;
margin: 25px 0;
}h3 {
color: #383637;
font-family: “Open Sans”, sans-serif;
font-size: 22px;
font-weight: 300;
line-height: 1.5rem;
margin: 25px 0;
}h4 {
font-family: “Open Sans”, sans-serif;
color: #383637;
font-size: 19px;
font-weight: 300;
line-height: 1.5rem;
margin: 25px 0;
}.large-text{
font-family: “Open Sans”, sans-serif;
color: #383637;
font-size: 20px;
font-weight: 300;
line-height: 1.5rem;
}p {
font-family: “Open Sans”, sans-serif;
color: #737373;
font-size: 16px;
font-weight: 300;
margin: 15px 0;
}ul {
list-style-type: none;
}li{
font-family: “Open Sans”, sans-serif;
font-size: 14px;
font-weight: 300;
color: #737373;
margin-bottom: 5px;
}li .fa{
margin-right: 10px;
color: #0f0f0f;
}strong{
color: #383637;
font-weight: 700;
}input:focus, textarea:focus{
border-color: #ffd349!important;
}textarea{
height: 120px;
}.row {
margin: 0 auto;
max-width: 75rem;
width: 100%;
}.page-wrapper {
max-width: 75rem;
clear: both;
}.content-wrapper{
position: relative;
display: block;
width: 100%;
float: left;
border-top: 2px solid #dcdcdc;
}.fade-on-scroll,
.fade-on-load{
opacity: 0;
}.animate-fast{
transition: all 250ms ease;
-webkit-transition: all 250ms ease;
-moz-transition: all 250ms ease;
-o-transition: all 250ms ease;
}.animate-normal{
transition: all 500ms ease;
-webkit-transition: all 500ms ease;
-moz-transition: all 500ms ease;
-o-transition: all 500ms ease;
}.animate-slow{
transition: all 1s ease;
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-o-transition: all 1s ease;
}.absolute{
position: absolute;
}.horizontal-center{
left: 50%;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
-moz-transform: translateX(-50%);
-o-transform: translateX(-50%);
}.vertical-center{
top: 50%;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-o-transform: translateY(-50%);
}.vertical-padding{
padding: 45px 0;
}.strip-padding{
padding-left: 0!important;
padding-right: 0!important;
}.white-bg{
background: #ffffff;
}.beige-bg{
background: #f1f1f1;
}.border-right{
border-right: 1px solid #e1e1e1;
}.border-left{
border-left: 1px solid #e1e1e1;
}.border-bottom{
border-bottom: 2px solid #dcdcdc;
}.box{
border: 1px solid #c7c7c7;
padding: 25px 20px;
}.box-shadow{
box-shadow: 1px -5px 10px 5px rgba(0,0,0,.1);
-webkit-box-shadow: 1px -5px 10px 5px rgba(0,0,0,.1);
-moz-box-shadow: 1px -5px 10px 5px rgba(0,0,0,.1);
}.button{
background: none;
border: 1px solid #4b4b4b;
color: #4b4b4b;
}.button:hover{
background: #f1f1f1;
border-color: transparent;
}.buttontwo{
background: white;
border: 1px solid #302f2b;
color: #302f2b;
}.buttontwo:hover{
background: #f1f1f1;
border-color: transparent;
}a{
color: #fff;
text-decoration: none;
line-height: inherit;
}.cta-button{
font-size: 13px;
font-weight: 700;
text-transform: uppercase;
line-height: 49px;
margin: 10px 0;
padding: 15px 20px;
}.cta-button:hover,.cta-button:focus{
color: #eaeaea;
background: #302f2b;
border-color: #eaeaea;
}.cta-button2{
font-size: 16px;
font-weight: 600;
width: 100%;
margin: 30px 0;
}.cta-button2:hover,.cta-button2:focus{
background: #383637;
}.page-bottom{
margin-top: 45px;
}.page-bottom p{
color: #383637;
font-weight: 300;
}body.preload{
overflow: hidden;
}#preloader{
opacity: 0;
display: none;
}.preload #preloader{
position: fixed;
opacity: 1;
display: block;
z-index: 9999;
top: 0;
left: 0;
width: 100%;
height: 100%;
font-size: 40px;
font-weight: 700;
color: #383637;
background: #f1f1f1;
overflow: hidden;
}#preloader div{
overflow: hidden;
}#preloader span{
display: block;
line-height: normal;
}#preloader span.gloss{
content: “”;
position: absolute;
z-index: 99999;
left: 0;
height: 100%;
width: 10%;
background: #f1f1f1;
-ms-transform: skewX(-20deg);
-webkit-transform: skewX(-20deg);
transform: skewX(-20deg);
opacity: .5;
}.header-wrapper{
border-top: 0px solid #383637;
}.header-wrapper .header-info{
padding: 20px 40px;
}.logo-wrapper {
width: 30%;
display: block;
float: left;
padding-right: 10px;
transform: translateY(-16%);
position: absolute;
z-index: 5;
}.company-info{
width: 90%;
display: block;
float: left;
}.header-company-title,
.header-company-title a {
color: #737374;
width: 100%;
margin: 0;
}.header-company-serviceorder{
margin: 0;
color: #ffffff;
transform: translateX(38%);
}.header-contact{
font-weight: 600;
}/*.header-contact:before{
content: “\f095”;
font-family: “fontAwesome”;
font-size: 30px;
color: #ffffff;
position: absolute;
left: -10px;
top: 50%;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-o-transform: translateY(-50%);
}*/.header-contact .contact-email.email{
font-size: 14px;
margin: 0;
color: #ffffff;
word-wrap: break-word;
}.navigation-wrapper{
display: block;
width: 100%;
background: #302f2b;
z-index: 1;
}.top-bar{
background: none;
}.top-bar-section ul li{
background: none;
position: relative;
margin-bottom: 0;
}.top-bar-section li:not(.has-form) a:not(.button),
.top-bar-section ul li > a{
background: none;
color: #ffffff;
font-family: “Open Sans”, sans-serif;
font-weight: 400;
font-size: 14px;
text-transform: uppercase;
letter-spacing: 2px;
}.top-bar-section li:not(.has-form) a:not(.button):before,
.top-bar-section li:not(.has-form) a:not(.button):after{
display: inline;
position: absolute;
width: 15px;
font-size: 18px;
font-weight: 300;
margin: 0;
opacity: 0;
transition: all 500ms ease;
-webkit-transition: all 500ms ease;
-moz-transition: all 500ms ease;
-o-transition: all 500ms ease;
}.top-bar-section li:not(.has-form) a:not(.button):before,
.top-bar-section ul li > a:before{
content: “[“;
left: 10px;
}.top-bar-section li:not(.has-form) a:not(.button):after,
.top-bar-section ul li > a:after{
content: “]”;
right: 10px;
text-align: right;
}.top-bar-section li.active:not(.has-form) a:not(.button),
.top-bar-section li.active:not(.has-form) a:hover:not(.button),
.top-bar-section li:not(.has-form) a:hover:not(.button),
.top-bar-section ul li:hover:not(.has-form) > a{
background: none;
color: #ffffff;
}.top-bar-section li.active:not(.has-form) a:not(.button):before,
.top-bar-section li.active:not(.has-form) a:hover:not(.button):before,
.top-bar-section li:not(.has-form) a:hover:not(.button):before{
opacity: 1;
left: 0;
}.top-bar-section li.active:not(.has-form) a:not(.button):after,
.top-bar-section li.active:not(.has-form) a:hover:not(.button):after,
.top-bar-section li:not(.has-form) a:hover:not(.button):after{
right: 0;
opacity: 1;
}.top-bar-section .dropdown{
background: #302f2b;
padding: 20px 15px;
}.top-bar-section .dropdown li:not(.has-form) a:not(.button),
.top-bar-section .dropdown li:not(.has-form) a:hover:not(.button),
.top-bar-section .dropdown li.active:not(.has-form) a:not(.button){
background: none;
color: #ffffff;
font-weight: 300;
text-align: center;
line-height: 35px;
}.top-bar-section .dropdown li:not(.has-form) a:not(.button):before,
.top-bar-section .dropdown li:not(.has-form) a:not(.button):after{
font-weight: 400;
}.top-bar-section li.active:not(.has-form) .dropdown a:not(.button):before{
left: 10px;
opacity: 0;
}.top-bar-section li.active:not(.has-form) .dropdown a:not(.button):after{
right: 10px;
opacity: 0;
}.top-bar-section .dropdown li.active:not(.has-form) a:not(.button):before,
.top-bar-section .dropdown li.active:not(.has-form) a:hover:not(.button):before,
.top-bar-section .dropdown li:not(.has-form) a:hover:not(.button):before{
opacity: 1;
left: 0;
}.top-bar-section .dropdown li.active:not(.has-form) a:not(.button):after,
.top-bar-section .dropdown li.active:not(.has-form) a:hover:not(.button):after,
.top-bar-section .dropdown li:not(.has-form) a:hover:not(.button):after{
right: 0;
opacity: 1;
}.home-slider-wrapper{
position: relative;
display: block;
width: 100%;
float: left;
height: 80%;
max-height: 700px;
margin-top: -45px;
}.home-slider-bottom{
display: block;
position: absolute;
bottom: 0;
width: 100%;
}.slider-nav .slick-dots{
bottom: auto;
position: relative;
margin-left: 0;
}.slider-nav .slick-dots li{
line-height: 85px;
height: 85px;
width: 30%;
background: rgba(255,255,255,.85);
margin: 0 15px;
transition: all 500ms ease;
-webkit-transition: all 500ms ease;
-moz-transition: all 500ms ease;
-o-transition: all 500ms ease;
}.slider-nav .slick-dots li:first-child{
margin-left: 0;
}.slider-nav .slick-dots li:last-child{
margin-right: 0;
}.slider-nav .slick-dots li.slick-active,
.slider-nav .slick-dots li:hover{
background: rgb(48, 47, 43,0.9);
}.slider-nav .slick-dots li a{
position: relative;
display: block;
width: 100%;
height: 100%;
font-family: “Open Sans”, sans-serif;
font-size: 20px;
font-weight: 400;
text-transform: uppercase;
color: #383637;
border: none;
padding: 0;
}.slider-nav .slick-dots li.slick-active a,
.slider-nav .slick-dots li:hover a{
color: #ffffff;
}.slider-nav .slick-dots li a span{
position: absolute;
left: 50%;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-moz-transform: translateX(-50%);
-o-transform: translateX(-50%);
}.slider-nav .slick-dots li.slick-active a span,
.slider-nav .slick-dots li:hover a span{
left: 35px;
transform: translateX(0);
-webkit-transform: translateX(0);
-moz-transform: translateX(0);
-o-transform: translateX(0);
}.slider-nav .slick-dots li a .fa{
opacity: 0;
color: #ffffff;
font-size: 25px;
position: absolute;
right: 20%;
}.slider-nav .slick-dots li.slick-active a .fa,
.slider-nav .slick-dots li:hover a .fa{
right: 15px;
opacity: 1;
}.slider-nav .slick-dots li a:before{
display: none;
}.home-tagline{
background: rgba(255,255,255,.7);
border-bottom: 1px solid #ffffff;
}.internal-tagline{
background: rgba(33,60,84,.5);
}.tagline p{
color: #383637;
font-size: 18px;
font-weight: 600;
margin: 0;
line-height: 50px;
}.scroll-to-content{
color: #383637;
text-align: center;
margin: 0 auto;
padding-top: 45px;
width: 200px;
cursor: pointer;
}.scroll-to-content p{
margin: 0;
color: #383637;
font-size: 12px;
font-weight: 700;
letter-spacing: 4px;
text-transform: uppercase;
}.scroll-to-content .fa{
font-size: 18px;
}.scroll-content p{
line-height: 2;
}.center-content{
padding-left: 60px;
}.center-content:before{
position: absolute;
left: 0;
top: 45px;
color: #ffd349;
font-size: 45px;
font-family: “fontAwesome”;
}.center-content.content-1:before{
content: “\f005”;
}.center-content.content-2:before{
content: “\f132”;
}.center-content.content-3:before{
content: “\f155”;
}.home-service-list p{
font-size: 14px;
font-weight: 600;
}.about-columns{
padding: 50px 50px 0;
}.about-columns h2{
position: relative;
font-weight: 400;
}.about-columns h2:before{
position: absolute;
content: “”;
height: 3px;
width: 40px;
background: #ffd349;
left: -60px;
top: 50%;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-o-transform: translateY(-50%);
}.about-img{
position: absolute;
bottom: 20px;
left: 0;
}.service-wrapper, .inner-service-wrapper{
float: left;
margin: 15px 0;
}.service{
padding: 0 0 0 60px;
}.service h2, .inner-service h2,
.inner-service h3{
position: relative;
float: left;
display: inline;
font-size: 16px;
font-weight: 700;
margin: 0 5px 0 0;
}.service h2:before{
position: absolute;
content: “”;
height: 3px;
width: 40px;
background: #ffd349;
left: -60px;
top: 50%;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-o-transform: translateY(-50%);
}.service p, .inner-service p{
margin: 0 0 5px 0;
}.service .cta-button2{
font-size: 14px;
line-height: 1.75;
padding: 0 30px;
margin-top: 10px;
}.inner-service{
margin: 15px 0;
}.inner-service h2,
.inner-service h3{
color: #737373;
}.inner-service span{
float: left;
margin: 0 5px 0 0;
}.contact-wrapper p:not(.large-text){
margin: 0 0 5px;
line-height: normal;
}.contact-wrapper .contact-info,
.contact-wrapper .contact-phone.phone,
.contact-wrapper .contact-email.email{
margin-bottom: 25px!important;
padding-left: 30px;
position: relative;
}.contact-wrapper .contact-info:before,
.contact-wrapper .contact-phone.phone:before,
.contact-wrapper .contact-email.email:before{
position: absolute;
top: 0;
left: 0;
font-size: 20px;
font-family: “fontAwesome”;
color: #383637;
}.contact-wrapper .contact-info:before{
content:”\f041″;
}.contact-wrapper .contact-phone.phone:before{
content:”\f095″;
}.contact-wrapper .contact-email.email:before{
content:”\f0e0″;
}.contactForm {
margin-top: 20px;
}.contactForm input {
width: 100%;
padding: 4px 8px;
margin-bottom: 10px;
}.contactForm textarea{
width: 100%;
}.contactForm .captchaWrapper,
.contactForm .captchaWrapper input{
margin: 0;
}.contactForm .submitWrapper {
text-align: center;
margin-top: 30px;
}.contactForm .submitWrapper span.submit {
font-size: inherit;
font-weight: bold;
background-color: #fafafa;
border: 1px solid #ddd;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1) inset;
padding: 3px 20px;
cursor: pointer;
}.emailConfirmation {
margin: 0 auto;
}.emailConfirmation h1 {
color: #00CC00;
}.footer-top {
position: relative;
display: block;
background: #302f2b;
width: 100%;
padding: 75px 0 35px;
}.footer-wrapper .top-bar-section li:not(.has-form) a:not(.button),
.footer-wrapper .top-bar-section ul li > a,
.footer-wrapper .top-bar-section li.active:not(.has-form) a:not(.button),
.footer-wrapper .top-bar-section li.active:not(.has-form) a:hover:not(.button),
.footer-wrapper .top-bar-section li:not(.has-form) a:hover:not(.button),
.footer-wrapper .top-bar-section ul li:hover:not(.has-form) > a{
color: #818181;
font-size: 12px;
}.footer-wrapper .top-bar-section li:not(.has-form) a:not(.button):before,
.footer-wrapper .top-bar-section ul li > a:before,
.footer-wrapper .top-bar-section li:not(.has-form) a:not(.button):after,
.footer-wrapper .top-bar-section ul li > a:after{
color: #ffd349;
}.footer-wrapper .top-bar-section .dropdown{
display: none!important;
}.social-icons .fa{
width: 44px;
line-height: 44px;
font-size: 22px;
color: #e5e5e5;
text-align: center;
}.social-icons .fa:hover{
background: #ffd34a;
color: #000000;
}.scroll-top{
position: absolute;
right: 2.5%;
background: #ffd34a;
color: #000000;
text-align: center;
width: 44px;
font-size: 35px;
cursor: pointer;
}.scroll-top .fa{
line-height: 44px;
}.disclaimer{
display: block;
width: 100%;
background: #302f2b;
padding: 10px;
}.disclaimer p{
margin: 0;
color: #ffffff;
text-transform: uppercase;
font-size: 9px;
line-height: 13px;
}.lnm-image img{
max-width: 95px;
}.slick-background-wrapper {
left: 0;
position: fixed;
top: 0;
z-index: -1;
width: 101% !important;
overflow: hidden;
}.container {
position: relative;
width: 50%;
}

.image {
opacity: 1;
display: block;
width: 100%;
height: auto;
transition: .5s ease;
backface-visibility: hidden;
box-shadow: #cccccc 1px 1px 7px;
}

.middle {
transition: .5s ease;
opacity: 0;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
text-align: center;
}

.container:hover .image {
opacity: 0.3;
}
.text {
background-color: #23282d;
color: white;
font-size: 16px;
padding: 16px 32px;
}
.container:hover .middle {
opacity: 1;
}.bgbar {
background: url(%UPLOAD%/2019/02/bgbar.jpg);
}
@media only screen and (max-width: 1440px){
.header-company-serviceorder {
transform: translateX(36%);
}.buttontranslate {
transform: translateX(25%);
}.cta-button {
font-size: 12px;
line-height: 85px;
padding: 15px 4px;
}
}

@media only screen and (min-width: 1025px) {
.top-bar-section .dropdown{
left: 50%;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
-moz-transform: translateX(-50%);
-o-transform: translateX(-50%);
}.top-bar-section .has-dropdown > a{
padding-right: 15px!important;
}.top-bar-section .has-dropdown > a::after{
top: auto;
right: auto;
border: none;
}
}
@media only screen and (max-width: 1024px){
h1, h1 a {
font-size: 25px;
}h2 {
font-size: 22px;
}h3 {
font-size: 20px;
}h4, .large-text {
font-size: 17px;
}p {
font-size: 15px;
}.box{
margin: 5px 0;
}#preloader{
font-size: 25px;
}.header-wrapper .header-info{
padding: 25px 0;
}.logo-wrapper{
width: 8%;
}.header-wrapper .header-info .border-left{
border: none;
}.header-wrapper .header-info .cta-button{
margin: 0;
}.navigation-wrapper{
background: rgba(33,60,84,.85);
}.top-bar.expanded .title-area{
background: none;
}.top-bar.expanded .toggle-topbar a{
color: #ffffff;
}.top-bar-section li:not(.has-form) a:not(.button),
.top-bar-section ul li > a{
color: #ffffff;
text-align: center;
}.top-bar-section li:not(.has-form) a:not(.button):before,
.top-bar-section li:not(.has-form) a:not(.button):after{
display: none;
}.top-bar-section li:not(.has-form) a:hover:not(.button),
.top-bar-section li.active:not(.has-form) a:not(.button){
background: #302f2d;
}.top-bar-section .dropdown li:not(.has-form) a:not(.button){
background: none;
}.top-bar-section .dropdown li:not(.has-form) a:hover:not(.button),
.top-bar-section .dropdown li.active:not(.has-form) a:not(.button){
background: rgba(33,60,84,.85);
color: #ffffff;
}.home-slider-wrapper{
margin-top: 0;
}.slick-slider{
margin-bottom: 0;
}.slider-nav .slick-dots li a{
font-size: 13px;
}.center-content:before{
top: 25px;
left: 5px;
}.about-columns{
padding-top: 10px;
}.about-img{
position: relative;
float: left;
margin-top: 25px;
}.buttontranslate {
transform: translateX(0%);
}.header-company-serviceorder {
transform: translateX(0%);
margin-bottom: 20px;
}.logo-wrapper {
width: 40%;
position: relative;
}
}
@media only screen and (max-width: 767px){
#preloader img{
width: 50%;
}.vertical-padding{
padding: 20px 0;
}.logo-wrapper{
width: 100%;
text-align: center;
padding: 0;
}.logo-wrapper img{
width: 100%;
}.buttontranslate {
transform: translateX(0%);
}.cta-button {
padding: 4px 22px;
}.company-info{
width: 100%;
text-align: center;
}.header-company-title,
.header-company-title a{
text-align: center;
font-size: 18px;
}.header-wrapper .header-info .contact-email.email{
display: none;
}.header-wrapper .header-info .cta-button{
line-height: 2;
}.header-contact{
line-height: 2;
}.header-contact:before{
display: none;
}.home-slider-bottom{
position: relative;
}.slider-nav .slick-dots li{
width: 33%;
margin: 0;
}.slider-nav .slick-dots li a{
font-size: 11px;
}.slider-nav .slick-dots li a span,
.slider-nav .slick-dots li.slick-active a span,
.slider-nav .slick-dots li:hover a span{
position: relative;
left: auto;
transform: translateX(0);
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
-moz-transform: translateX(0);
-o-transform: translateX(0);
}.slider-nav .slick-dots li a .fa,
.slider-nav .slick-dots li.slick-active a .fa,
.slider-nav .slick-dots li:hover a .fa{
display: none;
}.slider-nav .slick-dots{
margin-bottom: 0;
}.tagline p{
font-size: 16px;
line-height: normal;
padding: 10px 0;
}.about-columns{
padding: 0;
}.about-columns h2,
.service h2{
border-bottom: 3px solid #ffd34a;
}.about-columns h2:before,
.service h2:before{
display: none;
}.service-wrapper{
margin: 5px 0;
}.service{
padding: 0;
}.service h2, .inner-service h2,
.inner-service h3{
display: block;
float: none;
text-align: center;
font-size: 18px;
}
}
[/css]

Powered by
►
Necessary cookies enable essential site features like secure log-ins and consent preference adjustments. They do not store personal data.
None
►
Functional cookies support features like content sharing on social media, collecting feedback, and enabling third-party tools.
None
►
Analytical cookies track visitor interactions, providing insights on metrics like visitor count, bounce rate, and traffic sources.
None
►
Advertisement cookies deliver personalized ads based on your previous visits and analyze the effectiveness of ad campaigns.
None
Powered by