@font-face{
font-family:'EnzoOT-Light';
src: url('../fonts/EnzoOT-Light.otf');
src: url('../fonts/enzoot-light-webfont.eot');
src: url('../fonts/enzoot-light-webfont.woff');
src: url('../fonts/enzoot-light-webfont.woff2');
src: url('../fonts/enzoot-light-webfont.svg');
src: url('../fonts/enzoot-light-webfont.ttf');
}
body {
}
/* ==========================================================================
Typography
========================================================================== */
body {
font-family: 'EnzoOT-Light', sans-serif;
font-weight: 100;
font-size: 15px;
}
h1, h2, h3 ,h4, h5, p, ul{
font-family: 'EnzoOT-Light', sans-serif;
/*font-weight:lighter;*/
/*color:#9b9ea6;*/
font-weight: 200;
color:#7e8084;
}
p {
margin:0 0 20px 0;
}
ul {
list-style:none;
padding:0px;
}
li {
background:url(../images/bullet.png);
background-position: 0px 5px;
padding-left:30px;
padding-bottom:20px;
background-repeat:no-repeat;
}
/* ==========================================================================
Nav bar
========================================================================== */
.nav-bar {
margin-bottom: 0px;
}
.navbar-static-top {
height:140px;
background:url(../images/nav-bg.png);
-webkit-border-radius: 0px;
-moz-border-radius: 0px;
border-radius: 0px;
font-size:18px;
background-position:top center;
background-color:transparent;
border-color:transparent;
}
ul.nav {
background:#212F43;
}
ul.nav li {
background:none;
padding:0px;
}
.navbar-default .navbar-nav > li > a {
color: #fff;
}
.navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li > a:focus {
color: #fff;
}
.dropdown-toggle {
cursor:pointer;
}
.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus {
background-color: #217DB1;
color: #fff;
background-position:bottom center;
}
.navbar-nav {
margin-top: 0px;
}
.navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:hover, .navbar-default .navbar-nav > .open > a:focus {
background-color: #217DB1;
color: #fff;
}
.navbar-toggle {
background:#212F43 url(../images/icon-menu-open.png) no-repeat;
width:72px;
height:72px;
display:block;
background-size:72px 72px;
border-radius: 0px;
border:none;
margin:34px 15px 34px 0px;
}
.navbar-default .navbar-collapse {
border-color: #212F43;
min-width:200px;
max-height: 430px;
}
.navbar-default .navbar-nav .open .dropdown-menu > li > a:hover {
color: #fff;
}
.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus {
background:#212F43 url(../images/icon-menu-open.png) no-repeat;
background-size:72px 72px;
opacity:0.5;
}
.navbar-toggle.collapsed {
background:#212F43 url(../images/icon-menu-closed.png) no-repeat;
background-size:72px 72px;
}
.navbar-default .navbar-toggle.collapsed:hover, .navbar-default .navbar-toggle.collapsed:focus {
background:#212F43 url(../images/icon-menu-closed.png) no-repeat;
background-size:72px 72px;
opacity:0.5;
}
.navbar .container {
position:relative;
}
.logo {
height: 36px;
left: 30px;
position: absolute;
top: 45px;
width: 156px;
}
.container {
margin-left: auto;
margin-right: auto;
padding-left: 20px;
padding-right: 20px;
}
@media (min-width: 768px) {
.container {
margin-left: auto;
margin-right: auto;
padding-left: 15px;
padding-right: 15px;
}
.logo {
height: 57px;
width: 282px;
}
.navbar-default .navbar-toggle {
display:none;
}
.navbar-static-top {
font-size:14px;
}
.navbar-default .navbar-nav > li > a {
display:block;
color: #fff;
background:#212F43 url(../images/nav-marker-bg-normal.png) no-repeat;
background-color:#212F43;
background-position:bottom center;
/*background-size:200px 50px;*/
padding: 10px 10px;
text-align:center;
margin:0px;
-webkit-transition: background-color 0.5s linear;
-moz-transition: background-color 0.5s linear;
-o-transition: background-color 0.5s linear;
transition: background-color 0.5s linear;
}
.navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > .active > a:focus {
/*background-color:#217DB1;*/
color: #fff;
background: #217DB1 url(../images/nav-marker-bg-normal.png) no-repeat;
background-color:#217DB1;
/*background-color:#217DB1;*/
background-position:bottom center;
/*background-size:200px 50px;*/
/*padding: 10px 30px;*/
text-align:center;
-webkit-transition: background-color 0.5s linear;
-moz-transition: background-color 0.5s linear;
-o-transition: background-color 0.5s linear;
transition: background-color 0.5s linear;
}
.navbar-default .navbar-nav > li.active > a, .navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > li.active > a:hover {
display:block;
color: #fff;
background: #217DB1 url(../images/nav-marker-bg-normal.png) no-repeat;
background-color:#217DB1;
/*background-color:#217DB1;*/
background-position:bottom center;
/*background-size:200px 50px;*/
/*padding: 10px 30px;*/
text-align:center;
-webkit-transition: background-color 0.5s linear;
-moz-transition: background-color 0.5s linear;
-o-transition: background-color 0.5s linear;
transition: background-color 0.5s linear;
}
.navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:hover, .navbar-default .navbar-nav > .open > a:focus {
display:block;
color: #fff;
background: #217DB1 url(../images/nav-marker-bg-normal.png) no-repeat;
background-color:#217DB1;
background-position:bottom center;
/*padding: 10px 30px;*/
text-align:center;
-webkit-transition: background-color 0.5s linear;
-moz-transition: background-color 0.5s linear;
-o-transition: background-color 0.5s linear;
transition: background-color 0.5s linear;
}
/*.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus {
background-color: #217DB1;
color: #fff;
}*/
.navbar-nav {
margin-top: 0;
padding-bottom: 10px;
padding-top: 45px;
margin-right: -22px;
}
.dropdown-menu {
background-clip: padding-box;
background-color: #212F43;
border: 1px solid rgba(0, 0, 0, 1);
border-radius: 0px;
box-shadow:none;
display: none;
float: left;
font-size: 14px;
left: -15px;
list-style: none outside none;
margin: 10px 0 0;
min-width: 160px;
padding: 0px;
position: absolute;
top: 100%;
z-index: 1000;
}
.dropdown-menu > li > a {
clear: both;
color: #fff;
display: block;
font-weight: normal;
line-height: 1.42857;
padding: 5px 20px 5px 30px;
white-space: nowrap;
font-size:14px;
background:url(../images/nav-marker-arrow.png) no-repeat;
background-position:center left;
}
.dropdown-menu > li > a {
border-bottom:1px solid #217DB1;
}
.dropdown-menu > li:last-child > a {
border-bottom:none;
}
.navbar-nav > li > .dropdown-menu {
border-top-left-radius: 0;
border-top-right-radius: 0;
margin-top: 12px;
}
/*.dropdown-menu > li > a {
clear: both;
color: #FFFFFF;
display: block;
font-weight: normal;
line-height: 1.42857;
white-space: nowrap;
}*/
.dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus, .dropdown-menu > .active > a, .dropdown-menu > .active > a:focus , .dropdown-menu > .active > a:hover{
background-color: #217DB1;
}
}
@media (min-width: 991px) {
.navbar-static-top {
font-size:16px;
}
.navbar-default .navbar-nav > li > a {
padding: 10px 20px;
}
.navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > .active > a:focus {
padding: 10px 20px;
}
.navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:hover, .navbar-default .navbar-nav > .open > a:focus {
padding: 10px 20px;
}
.navbar-default .navbar-nav > li.active > a, .navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > li.active > a:hover {
padding: 10px 20px;
}
}
@media (min-width: 1200px) {
.navbar-static-top {
font-size:18px;
}
.navbar-default .navbar-nav > li > a {
padding: 10px 20px;
}
.navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > .active > a:focus {
padding: 10px 20px;
}
.navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:hover, .navbar-default .navbar-nav > .open > a:focus {
padding: 10px 20px;
}
.navbar-default .navbar-nav > li.active > a, .navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > li.active > a:hover {
padding: 10px 20px;
}
}
/*@media (min-width: 768px) {
ul.nav {
background:none;
}
.navbar-nav {
margin-top: 0px;
padding-top: 0px;
padding-bottom: 0px;
height:112px;
}
.navbar-nav > li > a {
height:112px;
padding-top:65px;
background-image:url(../images/nav-home-bg.png);
background-repeat:no-repeat;
background-position: 50% 30px;
-webkit-transition: all 0.25s ease-in-out 0s;
-moz-transition: all 0.25s ease-in-out 0s;
-o-transition: all 0.25s ease-in-out 0s;
transition: all 0.25s ease-in-out 0s;
}
.navbar-nav > li > a:hover {
background-image:url(../images/nav-home-bg.png);
background-position: 50% 0px;
-webkit-transition: all 0.25s ease-in-out 0s;
-moz-transition: all 0.25s ease-in-out 0s;
-o-transition: all 0.25s ease-in-out 0s;
transition: all 0.25s ease-in-out 0s;
}
.navbar-nav > li > a.selected {
background-image:url(../images/nav-home-bg.png);
background-position: 50% 0px;
-webkit-transition: all 0.25s ease-in-out 0s;
-moz-transition: all 0.25s ease-in-out 0s;
-o-transition: all 0.25s ease-in-out 0s;
transition: all 0.25s ease-in-out 0s;
}
.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus {
color: #969494;
background-color: #fff;
background-position: 50% 0px;
-webkit-transition: all 0.25s ease-in-out 0s;
-moz-transition: all 0.25s ease-in-out 0s;
-o-transition: all 0.25s ease-in-out 0s;
transition: all 0.25s ease-in-out 0s;
}
.navbar-nav > li + li > a { background-image:url(../images/nav-brand-bg.png); }
.navbar-nav > li + li > a:hover { background-image:url(../images/nav-brand-bg.png); }
.navbar-nav > li + li > a.selected { background-image:url(../images/nav-brand-bg.png); }
.navbar-nav > li + li + li > a { background-image:url(../images/nav-work-bg.png); }
.navbar-nav > li + li + li > a:hover { background-image:url(../images/nav-work-bg.png); }
.navbar-nav > li + li + li > a.selected { background-image:url(../images/nav-work-bg.png); }
.navbar-nav > li + li + li + li > a { background-image:url(../images/nav-clients-bg.png); }
.navbar-nav > li + li + li + li > a:hover { background-image:url(../images/nav-clients-bg.png); }
.navbar-nav > li + li + li + li > a.selected { background-image:url(../images/nav-clients-bg.png); }
.navbar-nav > li + li + li + li + li > a { background-image:url(../images/nav-about-bg.png); }
.navbar-nav > li + li + li + li + li > a:hover { background-image:url(../images/nav-about-bg.png); }
.navbar-nav > li + li + li + li + li > a.selected { background-image:url(../images/nav-about-bg.png); }
.navbar-nav > li + li + li + li + li + li> a { background-image:url(../images/nav-contact-bg.png); }
.navbar-nav > li + li + li + li + li +li > a:hover { background-image:url(../images/nav-contact-bg.png); }
.navbar-nav > li + li + li + li + li +li> a.selected { background-image:url(../images/nav-contact-bg.png); }
footer {
text-align:left;
}
}
@media (min-width: 768px) and (max-width: 991px) {
.logo {
margin-top:45px;
width:35%;
height:auto;
}
.biscuit-nav {
font-size:13px;
}
}
@media (min-width: 991px) {
.logo {
margin-top:35px;
width:35%;
height:auto;
}
.biscuit-nav {
font-size:18px;
}
}
.navbar-toggle {
background-color: rgba(0, 0, 0, 0);
border: 1px solid transparent;
border-radius: 4px 4px 4px 4px;
float: right;
margin-bottom: 8px;
margin-right: 15px;
margin-top: 40px;
padding: 9px 10px;
position: relative;
}*/
#content-wrapper {
display:block;
width:100%;
overflow:hidden;
}
/* --------------------------------------------- */
/* ------------------ home --------------------- */
/* --------------------------------------------- */
.feature {
text-align:center;
}
#home .about, #home .industries-section, #home .technologies, #home .facilities {
padding-top:50px;
padding-bottom:50px;
}
#home .about {
margin-top:-130px;
}
#home .about P{
font-size:16px;
}
#home .industries-section {
background:url(../images/bg-industries.png);
background-repeat:repeat-x;
}
#home h3 {
text-align:center;
}
#home .about h1 {
font-size:40px;
padding-bottom:30px;
}
#home .about .thumb img {
height:auto;
width:234px;
}
#home h2 {
font-size:40px;
padding-bottom:30px;
}
#home .industries-section h2 {
text-align:center;
color:#227db2;
}
#home .industries-section h3 {
color:#227db2;
}
#home .industries-section a {
color: #227DB2;
}
#home .industries-section p {
text-align:center;
font-size:16px;
}
#home .industries-section .feature {
text-align:center;
min-height: 360px;
}
#home .industries-section .thumb img {
width:93%;
height:auto;
}
#home .technologies-section {
background:#5aaddc url(../images/bg-technologies.jpg);
background-position: top center;
background-size:cover;
padding-top:0px;
padding-bottom:0px;
}
#home .technologies-content{
position:relative;
}
#home .technologies-top {
width:100%;
background:url(../images/mask-tech-top.png);
background-position: top center;
background-repeat:no-repeat;
padding-top:50px;
}
#home .technologies-bottom {
width:100%;
background:url(../images/mask-tech-bottom.png);
background-position: bottom center;
background-repeat:no-repeat;
padding-bottom:50px;
}
#home .technologies-section .hex1 {
width:157px;
height:137px;
top:250px;
right:1350px;
}
#home .technologies-section .hex2 {
width:91px;
height:79px;
top:120px;
right:1210px;
}
#home .technologies-section .hex3 {
height: 35px;
right: 1180px;
top: 200px;
width: 40px;
}
#home .technologies-section .hex4 {
height: 52px;
right: 1390px;
top: 415px;
width: 60px;
}
#home .technologies-section h2 {
text-align:center;
color:#eef1fc;
}
#home .technologies-section p {
text-align:center;
color:#fff;
font-size:20px;
}
#home .technologies-section h3 {
margin-top: 5px;
color:#fff;
}
#home .technologies-section .feature {
margin-top:30px;
}
#home .technologies-section .thumb img {
width:25%;
height:auto;
}
#home .facilities h2 {
text-align:center;
color:#e5a139;
}
#home .facilities h3 {
color:#e5a139;
}
#home .facilities a {
color:#e5a139;
}
#home .facilities a:hover {
color:#e5a139;
}
#home .facilities p {
text-align:center;
font-size:15px;
}
@media (min-width: 768px) {
#home .industries-section h2 {
font-size:60px;
}
#home .technologies-sectionh2 {
font-size:60px;
}
#home .facilities h2 {
font-size:60px;
}
}
#content-wrapper{
position:absolute;
top:0px;
width:100%;
}
#promo, #hero {
width:100%;
overflow:hidden;
height:625px;
position:relative;
}
#promo img, #hero img {
position:absolute;
width:auto;
height:625px;
}
@media (min-width: 991px) {
#promo img, #hero img {
position:absolute;
width:100%;
/*height:625px;*/
height:auto;
}
}
.promo-link {
position:absolute;
top:190px;
visibility:hidden;
}
.hero-link {
position:absolute;
top:280px;
}
#p1 {
}
#home .promo-link h1{
font-size:42px;
}
#home .promo-link h2{
font-size:28px;
}
.hero-link h1 {
color:#fff;
font-size:40px;
margin:0px 0px 10px 0px;
}
@media (min-width: 768px) {
.promo-link {
position:absolute;
top:240px;
}
.hero-link {
position:absolute;
top:280px;
}
#home .promo-link h1{
font-size:40px;
}
#home .promo-link h2{
font-size:35px;
}
.hero-link h1 {
color:#fff;
font-size:60px;
margin:0px 0px 10px 0px;
}
}
.promo-link h1 a, .hero-link h1 a {
color:#212f43;
/*color:#212f43;
-webkit-transition: color 0.25s ease-in-out;
-moz-transition: color 0.25s ease-in-out;
-o-transition: color 0.25s ease-in-out;
transition: color 0.25s ease-in-out;*/
}
.promo-link h1 a:hover, .hero-link h1 a:hover {
color:#212f43;
text-decoration:none;
/*color:#227db2;
text-decoration:none;
-webkit-transition: color 0.25s ease-in-out;
-moz-transition: color 0.25s ease-in-out;
-o-transition: color 0.25s ease-in-out;
transition: color 0.25s ease-in-out;*/
}
.promo-link h2{
color:#fff;
font-size:60px;
margin:0px;
-webkit-transition: color 0.25s ease-in-out;
-moz-transition: color 0.25s ease-in-out;
-o-transition: color 0.25s ease-in-out;
transition: color 0.25s ease-in-out;
}
.promo-link h2 a {
color:#fff;
-webkit-transition: color 0.25s ease-in-out;
-moz-transition: color 0.25s ease-in-out;
-o-transition: color 0.25s ease-in-out;
transition: color 0.25s ease-in-out;
}
.promo-link h2 a:hover {
color:#fff;
text-decoration:none;
-webkit-transition: all 0.25s ease-in-out;
-moz-transition: all 0.25s ease-in-out;
-o-transition: all 0.25s ease-in-out;
transition: all 0.25s ease-in-out;
}
.promo-mask, .hero-mask {
position:absolute;
top:0px;
background:url(../images/hero-mask.png) bottom center;
height:625px;
width: 100%;
}
.hex-overlay {
position:absolute;
top:20px;
background:url(../images/hex-overlay.png) bottom center;
height:625px;
width: 100%;
opacity:0.5;
/*filter: blur(1px); -webkit-filter: blur(1px); -moz-filter: blur(1px);
-o-filter: blur(1px); -ms-filter: blur(1px);
filter: url(blur.svg#blur);
filter:progid:DXImageTransform.Microsoft.Blur(PixelRadius='1');*/
}
.promo-content, .hero-content{
position:relative;
height:625px;
}
.hexagon {
width:157px;
height:137px;
background:url(../images/hexagon-white.png);
background-size:contain;
position:absolute;
display:block;
overflow:hidden;
}
.hexagon-blue {
width:157px;
height:137px;
background:url(../images/hexagon-blue.png);
background-size:contain;
position:absolute;
display:block;
overflow:hidden;
}
.promo-content .hex1, .hero-content .hex1 {
height: 137px;
left: 1028px;
top: 222px;
width: 157px;
}
.promo-content .hex2, .hero-content .hex2 {
width:29px;
height:25px;
top:355px;
left:1000px;
}
.promo-content .hex3, .hero-content .hex3 {
width:110px;
height:96px;
top:320px;
left:870px;
}
.promo-content .hex4, .hero-content .hex4 {
width:49px;
height:43px;
top:435px;
left:890px;
}
.promo-content .hex5, .hero-content .hex5 {
width:29px;
height:25px;
top:405px;
left:850px;
}
.promo-content .hex6, .hero-content .hex6 {
width:49px;
height:43px;
top:350px;
left:810px;
}
.promo-content .hex7, .hero-content .hex7 {
width:100px;
height:87px;
top:400px;
left:655px;
}
.promo-content .hex8 , .hero-content .hex8 {
width:49px;
height:43px;
top:433px;
left:890px;
}
.promo-content .hex9, .hero-content .hex9 {
width:198px;
height:173px;
top:460px;
left:730px;
}
#home .facilities {
overflow:hidden;
}
#home .facilities-content {
position:relative;
}
#home .facilities-content .hex1 {
bottom: -150px;
height: 200px;
left: 1250px;
width: 230px;
}
#home .facilities-content .hex2 {
bottom: 20px;
height: 35px;
left: 1220px;
width: 40px;
}
#home .facilities-content .hex3 {
bottom: -100px;
height: 90px;
left: 1130px;
width: 103px;
}
#home .facilities-content .hex4 {
bottom: -150px;
height: 180px;
right: 1170px;
width: 207px;
}
#home .facilities-content .hex5 {
bottom: 12px;
height: 25px;
right: 1170px;
width: 29px;
}
#home .facilities-content .hex6 {
bottom: -40px;
height: 43px;
right: 1120px;
width: 49px;
}
#home .facilities-content .hex7 {
bottom: 50px;
height: 87px;
right: 1290px;
width: 100px;
}
#home .home-facilities-img {
position:relative;
}
#home .home-facilities-image img{
width:100%;
height:auto;
padding:2px;
}
#home .home-facilites-mask {
/*position:absolute;
top:0px;
width:100%;
height:auto;
display:block;*/
background:url(../images/mask-home-facilities.png);
display: block;
height: 66%;
left: -10px;
position: absolute;
top: -11px;
width: 119%;
background-size:contain;
}
#home .home-facilites-mask1 {
/*position:absolute;
top:0px;
width:100%;
height:auto;
display:block;*/
background:url(../images/mask-home-facilities.png);
display: block;
height: 66%;
left: 10px;
position: absolute;
top: 2px;
width: 119%;
background-size:contain;
}
.technologies .thumb, .industries .thumb{
/* filter: url("data:image/svg+xml;utf8,#grayscale"); */
/*filter: grayscale(80%);
-webkit-filter: grayscale(80%); */
position:relative;
top:0px;
-webkit-transition: all 0.25s ease-in-out;
-moz-transition: all 0.25s ease-in-out;
-o-transition: all 0.25s ease-in-out;
transition: all 0.25s ease-in-out;
}
#home .technologies-section.thumb:hover, #home .industries-section .thumb:hover {
/* filter: url("data:image/svg+xml;utf8,#grayscale");*/
/*filter: grayscale(0%);
-webkit-filter: grayscale(0%); */
/* top:-15px;
-webkit-transition: all 0.25s ease-in-out;
-moz-transition: all 0.25s ease-in-out;
-o-transition: all 0.25s ease-in-out;
transition: all 0.25s ease-in-out;*/
/*-webkit-transition: filter 0.5s linear;
-moz-transition: filter 0.5s linear;
-o-transition: filter 0.5s linear;
transition: filter 0.5s linear;*/
}
.page-content{
position:relative;
padding-bottom:100px;
}
.page-content .hex1 {
bottom: -100px;
height: 200px;
left: 1250px;
width: 230px;
}
.page-content .hex2 {
bottom: 70px;
height: 35px;
left: 1220px;
width: 40px;
}
.page-content .hex3 {
bottom: -50px;
height: 90px;
left: 1130px;
width: 103px;
}
.page-content .hex4 {
bottom: -100px;
height: 180px;
right: 1170px;
width: 207px;
}
.page-content .hex5 {
bottom: 62px;
height: 25px;
right: 1170px;
width: 29px;
}
.page-content .hex6 {
bottom: 10px;
height: 43px;
right: 1120px;
width: 49px;
}
.page-content .hex7 {
bottom: 100px;
height: 87px;
right: 1290px;
width: 100px;
}
/* --------------------------------------------- */
/* ------------------ about us --------------- */
/* --------------------------------------------- */
.about-us .thumb img {
height: auto;
width:234px;
}
/* --------------------------------------------- */
/* ------------------ facitlites --------------- */
/* --------------------------------------------- */
.hero-link h1.facilities {
color:#212F43;
}
.facilities .page-content h2 {
padding:0px;
margin-bottom: 20px;
margin-top: 20px;
color:#f1b23c;
font-size:40px;
}
.img{
height: auto;
}
.facilities-img{
height: auto;
position: relative;
width: 100%;
margin-top:30px;
}
.facilities-image img{
width:100%;
height:auto;
padding:1px;
}
.facilites-mask-right {
background:url(../images/mask-facilities-right.png);
background-size:100% auto;
display: block;
height: 112%;
left:15px;
position: absolute;
top: 0;
width:96%;
}
.facilites-mask-left {
background:url(../images/mask-facilities-left.png);
background-size:100% auto;
display: block;
height: 124%;
left: 15px;
position: absolute;
top: 0;
width:96%;
}
/* --------------------------------------------- */
/* ------------------ page --------------- */
/* --------------------------------------------- */
/*
.page-content.agrochemicals, .page-content.home-garden, .page-content.pest-control, .page-content.timber-treatment {
}*/
#page {
background:url(../images/bg-page-honeycomb.png);
background-position:center 500px;
background-repeat:no-repeat;
position:relative;
}
#page.industries {
background:url(../images/bg-page-honeycomb.png);
background-position:center 500px;
background-repeat:no-repeat;
}
#page.news {
background:none;
}
#page .page-content {
position:relative;
margin-top:-50px;
min-height:400px;
}
#page .page-content h1{
margin-bottom:40px;
}
#page.technologies {
background:none;
}
/* --------------------------------------------- */
/* ---------------- industries --------------- */
/* --------------------------------------------- */
.industries .thumb img {
height: auto;
width: 74%;
margin-left:12px;
}
/* --------------------------------------------- */
/* ---------------- technologies --------------- */
/* --------------------------------------------- */
.tech-holder {
min-height:300px;
}
.tech {
visibility:hidden;
position:absolute;
top:0px;
right:0px;
}
#tech1 {
position:absolute;
visibility:visible;
}
.tech-thumb {
text-align:center;
}
.tech-thumb a:focus { -moz-outline: none; }
/*.tech-thumb a::focus {outline:none;}*/
.tech-thumb a::-moz-focus-inner {border:0;}
.tech-thumb a {
width:95%;
height:auto;
display:block;
margin:0px auto;
}
.tech-thumb a img {
width:100%;
height:auto;
}
:focus, :active {
outline: 0;
border: 0;
}
a, a:visited, a:focus, a:active, a:hover{
outline:0 none !important;
}
.tech-thumb-holder {
width:19%;
display:inline-block;
position:relative;
}
.tech-menu {
min-height:70px;
z-index:1500;
}
.tech-thumb-holder h2 {
text-align:center;
color:#1D6B9A;
font-size:12px;
margin-top: 20px;
margin-bottom:0px;
position:absolute;
width:100%;
}
.tech-holder {
position:relative;
}
@media (min-width: 480px) {
.tech-thumb a {
width:85%;
}
.tech-menu {
min-height:120px;
z-index:1500;
}
.tech-holder {
min-height:800px;
}
}
@media (min-width: 768px) {
#home .home-facilites-mask {
/*position:absolute;
top:0px;
width:100%;
height:auto;
display:block;*/
background:url(../images/mask-home-facilities.png);
background-size:contain;
display: block;
height: 53%;
left: -17px;
position: absolute;
top: -30px;
width: 109%;
}
#home .home-facilites-mask1 {
/*position:absolute;
top:0px;
width:100%;
height:auto;
display:block;*/
background:url(../images/mask-home-facilities.png);
display: block;
background-size:contain;
height: 60%;
left: -10px;
position: absolute;
top: -28px;
width: 146%
}
.facilites-mask-right {
background:url(../images/mask-facilities-right.png);
background-size:100% auto;
display: block;
height: 112%;
left:15px;
position: absolute;
top: 0;
width:92%;
}
.facilites-mask-left {
background:url(../images/mask-facilities-left.png);
background-size:100% auto;
display: block;
height: 124%;
left: 15px;
position: absolute;
top: 0;
width:91%;
}
.logo{
width:156px;
height:36px;
}
.tech-thumb-holder {
width:100%;
}
.tech-thumb-holder h2 {
font-size:16px;
margin-top: 15px;
margin-bottom:40px;
position:static;
}
.tech-thumb a {
width:30%;
height:auto;
display:block;
margin:0px auto;
}
}
/* --------------------------------------------- */
/* --------------------- news ------------------ */
/* --------------------------------------------- */
.news-story {
margin-bottom:50px;
}
.news-story .entry-title a {
color:#9b9ea6;
}
.news-story .entry-title {
margin-top: 80px;
}
.date-holder {
/*background:url(../images/news-date-bg.png);
background-position:center right;
background-repeat:no-repeat;
display:block;
min-height:180px;
position:relative;*/
}
.date-holder .time {
background:url(../images/news-date-left.png);
background-position: center right;
margin-top: 0px;
padding:12px 20px 0px 10px;
height:65px;
position:absolute;
left:-10px;
color:#FFFFFF;
font-size:26px;
line-height:22px;
letter-spacing:-1px;
min-width:80px;
}
.date-holder .time sup {
letter-spacing:1px;
font-size:14px;
}
.date-holder .time span {
display:block;
font-size:16px;
text-transform:uppercase;
letter-spacing:1px;
}
/*.pager li.previous {
text-align:right;
}
.pager li.next {
text-align:left;
}*/
.post-nav li{
background:none;
}
.previous a {
color:#e5a139;
background:url(../images/nav-prev.png);
background-repeat:no-repeat;
background-position: 75px center ;
padding-right:20px;
font-size:20px;
-webkit-transition: all 0.25s ease-in-out;
-moz-transition: all 0.25s ease-in-out;
-o-transition: all 0.25s ease-in-out;
transition: all 0.25s ease-in-out;
}
.previous a:hover {
text-decoration:none;
background-position:70px center ;
-webkit-transition: all 0.25s ease-in-out;
-moz-transition: all 0.25s ease-in-out;
-o-transition: all 0.25s ease-in-out;
transition: all 0.25s ease-in-out;
}
.next a {
color:#e5a139;
background:url(../images/nav-next.png);
background-repeat:no-repeat;
background-position: left center ;
padding-left:20px;
font-size:20px;
-webkit-transition: all 0.25s ease-in-out;
-moz-transition: all 0.25s ease-in-out;
-o-transition: all 0.25s ease-in-out;
transition: all 0.25s ease-in-out;
}
.next a:hover {
text-decoration:none;
background-position:5px center ;
-webkit-transition: all 0.25s ease-in-out;
-moz-transition: all 0.25s ease-in-out;
-o-transition: all 0.25s ease-in-out;
transition: all 0.25s ease-in-out;
}
.news-story a.more {
color:#e5a139;
background:url(../images/nav-next.png);
background-repeat:no-repeat;
background-position: left center ;
padding-left:20px;
font-size:20px;
-webkit-transition: all 0.25s ease-in-out;
-moz-transition: all 0.25s ease-in-out;
-o-transition: all 0.25s ease-in-out;
transition: all 0.25s ease-in-out;
}
.news-story a.more:hover{
text-decoration:none;
background-position:5px center ;
-webkit-transition: all 0.25s ease-in-out;
-moz-transition: all 0.25s ease-in-out;
-o-transition: all 0.25s ease-in-out;
transition: all 0.25s ease-in-out;
}
@media (min-width: 768px) {
.news-story {
margin-bottom:50px;
}
.news-story .entry-title {
margin-top: 25px;
}
.news-story .no-img {
padding-left:30px;
}
.news-thumb {
/*width:100%;*/
margin-top:30px;
margin-left:20px;
}
.news-thumb img{
width:100%;
height:auto;
}
.date-holder {
background:url(../images/news-date-bg.png);
background-position:center right;
background-repeat:no-repeat;
display:block;
min-height:180px;
position:relative;
}
.date-holder .time {
background:url(../images/news-date.png);
background-position: center left;
margin-top: 62px;
padding:12px 10px 0px 20px;
height:65px;
position:absolute;
left:auto;
right:0px;
color:#FFFFFF;
font-size:26px;
line-height:22px;
letter-spacing:-1px;
min-width:80px;
}
.date-holder .time sup {
letter-spacing:1px;
font-size:14px;
}
.date-holder .time span {
display:block;
font-size:16px;
text-transform:uppercase;
letter-spacing:1px;
}
.pager li > a, .pager li > span {
background:none;
background-color:transparent;
border: none;
border-radius:0px;
display: inline-block;
padding: 5px 14px;
}
.pager li{
background:none;
}
.pager li > a:hover, .pager li > a:focus {
background:none;
background-color: transparent;
border: none;
border-radius: 0px;
display: inline-block;
padding: 5px 14px;
}
.pager .previous > a, .pager .previous > span {
float: right;
margin-right:30px;
}
.pager .next > a, .pager .next > span {
float: left;
margin-left:30px;
}
.pager li.previous a {
color:#e5a139;
background:url(../images/nav-prev.png);
background-repeat:no-repeat;
background-position: 75px center ;
padding-right:20px;
font-size:20px;
-webkit-transition: all 0.25s ease-in-out;
-moz-transition: all 0.25s ease-in-out;
-o-transition: all 0.25s ease-in-out;
transition: all 0.25s ease-in-out;
}
.pager li.previous a:hover {
text-decoration:none;
background-position:70px center ;
-webkit-transition: all 0.25s ease-in-out;
-moz-transition: all 0.25s ease-in-out;
-o-transition: all 0.25s ease-in-out;
transition: all 0.25s ease-in-out;
}
.pager li.next a {
color:#e5a139;
background:url(../images/nav-next.png);
background-repeat:no-repeat;
background-position: left center ;
padding-left:20px;
font-size:20px;
-webkit-transition: all 0.25s ease-in-out;
-moz-transition: all 0.25s ease-in-out;
-o-transition: all 0.25s ease-in-out;
transition: all 0.25s ease-in-out;
}
.pager li.next a:hover {
text-decoration:none;
background-position:5px center ;
-webkit-transition: all 0.25s ease-in-out;
-moz-transition: all 0.25s ease-in-out;
-o-transition: all 0.25s ease-in-out;
transition: all 0.25s ease-in-out;
}
}
/* --------------------------------------------- */
/* ------------------ contact ------------------ */
/* --------------------------------------------- */
.map {
display:block;
width:100%;
height:100%;
/*margin-top:30px;*/
border-bottom: 7px solid #e5a139;
}
.contact h1 {
margin-top:50px;
margin-bottom:50px;
}
.contact .mail, .contact .call , .contact .add{
padding-bottom: 20px;
font-size:20px;
line-height: 1.2;
}
.contact .mail {
padding-left: 50px;
background:url(../images/icon-mail.png);
background-repeat:no-repeat;
background-size:33px 37px;
font-size:20px;
}
.contact .call {
padding-left: 50px;
background:url(../images/icon-call.png);
background-repeat:no-repeat;
background-size:33px 37px;
font-size:20px;
}
.contact .add {
padding-left: 50px;
background:url(../images/icon-add.png);
background-repeat:no-repeat;
background-size:33px 37px;
line-height: 1.3;
font-size:20px;
}
.contact .mail span {
padding:0px;
margin:0px;
font-size:24px;
display:block;
color:#1d6b9a;
}
.contact .call span {
padding:0px;
margin:0px;
font-size:24px;
display:block;
color:#1d6b9a;
}
.contact .add span {
padding:0px;
margin:0px;
font-size:24px;
display:block;
color:#1d6b9a;
}
.contact .social {
padding-top:10px;
padding-bottom:10px;
}
/*.contact .social p{
color:#1d6b9a;
}*/
.contact .twitter {
padding-left: 50px;
background:url(../images/feedback.png);
background-repeat:no-repeat;
background-size:38px 34px;
line-height: 1.4;
font-size:20px;
}
.contact .twitter span {
padding:0px;
margin:0px;
font-size:24px;
display:block;
color:#1d6b9a;
}
.contact .linkedin {
padding-left: 50px;
background:url(../images/icon-linkedin.png);
background-repeat:no-repeat;
background-size:38px 34px;
line-height: 1.3;
font-size:20px;
}
.contact .linkedin span {
padding:0px;
margin:0px;
font-size:24px;
display:block;
color:#1d6b9a;
}
.contact .mail a, .contact .call a, .contact .add a, .contact .twitter a, .contact .linkedin a{
color:#787a80;
}
.contact .mail a:hover, .contact .call a:hover, .contact .add a:hover, .contact .twitter a:hover, .contact .linkedin a:hover{
}
/* --------------------------------------------- */
/* ------------------ footer --------------------- */
/* --------------------------------------------- */
.info {
background:#1d6b9a;
min-height:200px;
}
.social {
background:#fff;
}
.social .icons {
text-align:center;
}
.social .links {
padding-top: 0px;
text-align:center;
}
.social .links a{
font-weight:bold;
color: #1D6B9A;
opacity:1;
-webkit-transition: opacity 0.25s ease-in-out;
-moz-transition: opacity 0.25s ease-in-out;
-o-transition: opacity 0.25s ease-in-out;
transition: opacity 0.25s ease-in-out;
}
.social .links a:hover{
text-decoration:none;
opacity:0.8;
-webkit-transition: opacity 0.25s ease-in-out;
-moz-transition: opacity 0.25s ease-in-out;
-o-transition: opacity 0.25s ease-in-out;
transition: opacity 0.25s ease-in-out;
}
@media (min-width: 1200px) {
#home .home-facilites-mask {
/*position:absolute;
top:0px;
width:100%;
height:auto;
display:block;*/
background:url(../images/mask-home-facilities.png);
display: block;
height: 66%;
left: -10px;
position: absolute;
top: -11px;
width: 119%;
background-size:contain;
}
#home .home-facilites-mask1 {
/*position:absolute;
top:0px;
width:100%;
height:auto;
display:block;*/
background:url(../images/mask-home-facilities.png);
display: block;
height: 66%;
left: 10px;
position: absolute;
top: 2px;
width: 119%;
background-size:contain;
}
.facilites-mask-right {
background:url(../images/mask-facilities-right.png);
background-size:100% auto;
display: block;
height: 112%;
left:15px;
position: absolute;
top: 0;
width:96%;
}
.facilites-mask-left {
background:url(../images/mask-facilities-left.png);
background-size:100% auto;
display: block;
height: 124%;
left: 15px;
position: absolute;
top: 0;
width:96%;
}
.logo{
width:282px;
height:57px;
}
.social .icons {
text-align:left;
}
.social .links {
padding-top: 10px;
text-align:right;
}
}
.info h3 {
text-align:left;
color:#90d0f7;
}
.info ul {
padding:0px;
list-style:none;
}
.info li {
background:none;
padding:0px;
}
.info p {
color:#fff;
}
.info a {
color:#fff;
}
.mail, .call , .add{
font-family: 'EnzoOT-Light', sans-serif;
/*font-weight:lighter;*/
/*color:#9b9ea6;*/
font-weight: 200;
padding-bottom: 20px;
font-size:16px;
line-height: 1.2;
}
.mail {
font-family: 'EnzoOT-Light', sans-serif;
/*font-weight:lighter;*/
/*color:#9b9ea6;*/
font-weight: 200;
padding-left: 50px;
background:url(../images/icon-mail.png);
background-repeat:no-repeat;
background-size:33px 37px;
}
.call {
font-family: 'EnzoOT-Light', sans-serif;
/*font-weight:lighter;*/
/*color:#9b9ea6;*/
font-weight: 200;
padding-left: 50px;
background:url(../images/icon-call.png);
background-repeat:no-repeat;
background-size:33px 37px;
}
.add {
padding-left: 50px;
background:url(../images/icon-add.png);
background-repeat:no-repeat;
background-size:33px 37px;
line-height: 1.3;
}
.mail span {
font-family: 'EnzoOT-Light', sans-serif;
/*font-weight:lighter;*/
/*color:#9b9ea6;*/
font-weight: 200;
padding:0px;
margin:0px;
font-size:16px;
display:block;
}
.call span {
padding:0px;
margin:0px;
font-size:16px;
display:block;
}
.add {
font-family: 'EnzoOT-Light', sans-serif;
/*font-weight:lighter;*/
/*color:#9b9ea6;*/
font-weight: 200;
font-size:15px;
}
.social {
text-align:center;
padding-top:30px;
padding-bottom:10px;
}
.social p{
color:#1d6b9a;
}
.social-tw {
display:inline-block;
width: 38px;
height:34px;
text-indent: -9999em;
overflow:hidden;
margin-right:10px;
background:url(../images/icon-twitter.png);
background-size:38px 34px;
opacity:0.99;
-webkit-transition: all 0.25s ease-in-out;
-moz-transition: all 0.25s ease-in-out;
-o-transition: all 0.25s ease-in-out;
transition: all 0.25s ease-in-out;
}
.social-in {
display:inline-block;
width: 38px;
height:34px;
text-indent: -9999em;
overflow:hidden;
margin-right:10px;
background:url(../images/icon-in.png);
background-size:38px 34px;
opacity:0.99;
-webkit-transition: all 0.25s ease-in-out;
-moz-transition: all 0.25s ease-in-out;
-o-transition: all 0.25s ease-in-out;
transition: all 0.25s ease-in-out;
}
.social-fb {
display:inline-block;
width: 38px;
height:34px;
text-indent: -9999em;
overflow:hidden;
margin-right:10px;
background:url(../images/icon-fb.png);
background-size:38px 34px;
opacity:0.99;
-webkit-transition: all 0.25s ease-in-out;
-moz-transition: all 0.25s ease-in-out;
-o-transition: all 0.25s ease-in-out;
transition: all 0.25s ease-in-out;
}
.social-gp {
display:inline-block;
width: 38px;
height:34px;
text-indent: -9999em;
overflow:hidden;
margin-right:10px;
background:url(../images/icon-gp.png);
background-size:38px 34px;
opacity:0.99;
-webkit-transition: all 0.25s ease-in-out;
-moz-transition: all 0.25s ease-in-out;
-o-transition: all 0.25s ease-in-out;
transition: all 0.25s ease-in-out;
}
.social-tw:hover, .social-fb:hover, .social-gp:hover, .social-in:hover {
opacity:0.6;
-webkit-transition: all 0.25s ease-in-out;
-moz-transition: all 0.25s ease-in-out;
-o-transition: all 0.25s ease-in-out;
transition: all 0.25s ease-in-out;
}
.social .company {
padding-top:10px;
text-align:center;
}
@media (min-width: 768px) {
.social {
text-align:left;
padding-top:10px;
padding-bottom:10px;
}
}
#loader {
position:absolute;
top:0px;
left:0px;
display:block;
width:100%;
height:100%;
}
.dropdown-menu li:hover .sub-menu {
visibility: visible;
}
.dropdown:hover .dropdown-menu {
display: block;
}
.dropdown-menu .sub-menu {
left: 100%;
position: absolute;
top: 0;
visibility: hidden;
margin-top: -1px;
}
.nav-tabs .dropdown-menu, .nav-pills .dropdown-menu, .navbar .dropdown-menu {
margin-top: 0 !important;
}
body{
margin:0;
padding:0;
font-family:'EnzoOT-Light',sans-serif
}
div#envelope{
width:50%;
margin:10px 30% 10px 25%;
background-color:#f2f4fb;
padding:10px 0;
border:1px solid gray;
border-radius:10px
}
form{
width:70%;
margin:0 15%
}
form header{
text-align:center;
font-family:'EnzoOT-Light',sans-serif
}
/* Makes responsive fields. Sets size and field alignment. */
input[type=text]{
margin-bottom:3px;
margin-top:10px;
width:100%;
height:44px;
padding:7px;
border-radius:5px;
border:1px solid #1d6b9a;
}
input[type=submit]{
margin-bottom:20px;
width:100%;
padding:15px;
border-radius:5px;
border:1px solid #1d6b9a;
background-color:#1d6b9a;
}
textarea{
width:100%;
padding:15px;
margin-top:10px;
border:1px solid #1d6b9a;
border-radius:5px;
margin-bottom:20px;
height:150px;
}
input[type=text]:focus,textarea:focus{
border-color:#1d6b9a;
}
/* By using @ media form can have different layout for screen, mobile phone, tablet. */
/* Sets the form layout for mobile phone, tablet. */
@media screen and (max-device-width: 600px){
* {
/* With these codes padding and border does not increase it's width.Gives intuitive style. */
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box
}
body{
margin:0;
padding:0;
font-family:'EnzoOT-Light',sans-serif
}
div#envelope{
width:50%;
margin:10px 30% 10px 25%;
background-color:#f2f4fb;
padding:10px 0;
border:1px solid gray;
border-radius:10px
}
form{
width:70%;
margin:0 15%
}
form header{
text-align:center;
font-family:'EnzoOT-Light',sans-serif
}
/* Makes responsive fields.Sets size and field alignment. */
input[type=text]{
margin-bottom:3px;
margin-top:10px;
width:100%;
padding:5px;
border-radius:5px;
border:1px solid #1d6b9a;
}
input[type=submit]{
margin-bottom:20px;
width:100%;
padding:15px;
border-radius:5px;
border:1px solid #1d6b9a;
background-color:#1d6b9a;
}
textarea{
width:100%;
padding:15px;
margin-top:10px;
border:1px solid #1d6b9a;
border-radius:5px;
margin-bottom:20px;
resize:none
}
input[type=text]:focus,textarea:focus{
border-color:#1d6b9a;
}
}