/* Template Author : georgia-gibbs.com Author Email : georgiagibbsdesign(at)gmail[dot]com Template Name : JAX Vineyard ***************************************** - Header - Billboard - Call To Action - Services - Recent Work - Testimonials - Client - Footer */ /* Fonts */ /* @font-face { font-family: 'open_regular'; src: url('../fonts/opensans-regular.eot'); src: url('../fonts/opensans-regular.eot?#iefix') format('embedded-opentype'), url('../fonts/opensans-regular.woff') format('woff'), url('../fonts/opensans-regular.ttf') format('truetype'), url('../fonts/opensans-regular.svg#LatoRegular') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'open_bold'; src: url('../fonts/opensans-bold.eot'); src: url('../fonts/opensans-bold.eot?#iefix') format('embedded-opentype'), url('../fonts/opensans-bold.woff') format('woff'), url('../fonts/opensans-bold.ttf') format('truetype'), url('../fonts/opensans-bold.svg#LatoRegular') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'open_semibold'; src: url('../fonts/opensans-semibold.eot'); src: url('../fonts/opensans-semibold.eot?#iefix') format('embedded-opentype'), url('../fonts/opensans-semibold.woff') format('woff'), url('../fonts/opensans-semibold.ttf') format('truetype'), url('../fonts/opensans-semibold.svg#open_sanssemibold') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'satellite'; src: url('../fonts/satellite.eot'); src: url('../fonts/satellite.eot?#iefix') format('embedded-opentype'), url('../fonts/satellite.woff') format('woff'), url('../fonts/satellite.ttf') format('truetype'), url('../fonts/satellite.svg#open_sanssemibold') format('svg'); font-weight: normal; font-style: normal; } */ /* General CSS*/ .wrapper{ width: 960px; height: auto; margin: 0 auto; } font-family: "ff-din-web-1","ff-din-web-2", arial, sans-serif; line-height: 22px; text-align: center; } h2,h3,h4,h5,h6{ font-family: "ff-din-web-1","ff-din-web-2", arial, sans-serif; } footer .f_cols ul li { font-family: "ff-din-web-1","ff-din-web-2", arial, sans-serif!important; text-align:left!important;} p{ font-family: "ff-din-web-1","ff-din-web-2", arial, sans-serif; } .jax_cal h3 { font-size: 44px; color:#000000; font-family: "ff-din-web-1","ff-din-web-2", arial, sans-serif; } footer .f_cols ul.sm li a, header nav ul li a, footer a:hover{ transition:all .2s linear; -webkit-transition:all .2s linear; -moz-transition:all .2s linear; -o-transition:all .2s linear; } /* Header */ header.trasparent_nav{ width: 100%; height: 120px; background-color: rgba(255, 255, 255, .7); border-bottom: 1px rgba(0, 0, 0, .3) solid; top: 0; left: 0; position: absolute; z-index: 9999; } header.trasparent_nav .logo, header.fixed_nav .logo{ float: left; margin-top: 0px; margin-bottom:0px; } header.fixed_nav .logo{ margin-top: 0px; } .logo{ margin-right:20px; } header.trasparent_nav nav, header.fixed_nav nav{ float: left; margin-top: 40px; } header.fixed_nav nav{ margin-top: 32px; } header.trasparent_nav nav ul, header.fixed_nav nav ul{ list-style: none; } header.trasparent_nav nav ul li, header.fixed_nav nav ul li{ float: left; margin-left: 15px; } header.trasparent_nav nav ul li:first-child, header.fixed_nav nav ul li:first-child{ margin-left: 0; } header.trasparent_nav nav ul li a, header.fixed_nav nav ul li a{ text-decoration: none; color: rgb(55, 53, 52); font-family: "ff-din-web-1","ff-din-web-2",arial,sans-serif; font-size: 13px; text-transform:uppercase; font-weight:bold; } header.trasparent_nav nav ul li a:hover, header.fixed_nav nav ul li a:hover{ color: rgb(138, 21, 32); } header.trasparent_nav nav ul li a:active, header.fixed_nav nav ul li a:active{ color: #7f7f7f; } header.fixed_nav nav ul li a{ font-size: 13px; } header.fixed_nav{ width: 100%; height: 80px; background-color: #ffffff; border-bottom: 1px solid #d4d4d4; position: fixed; top: 0; left: 0; z-index: 9999; margin-top: -81px; } /* Billboard */ .billboard{ width: 100%; height: 580px; overflow: hidden; position: relative; /* background: url('../img/billboard.jpg') no-repeat; */ background-size: cover; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; } .eventContainer { cursor: pointer; position: relative; margin: 0px; margin-bottom: 10px; padding: 0px; border: 1px solid; border-color: black; width: 100%; max-width: 540px } .jax_cal{ overflow: hidden; position: relative; margin-top:100px; margin-left:30px; margin-right:30px; } .eventContainer { cursor: pointer; position: relative; margin: 0px; margin-bottom: 10px; padding: 0px; border: 1px solid; border-color: black; width: 100%; max-width: 540px } /* Call To Action Section */ .cta{ width: 1200px; height: 90px; margin: 0 auto; position: relative; } .cta p{ display: inline-block; font-family: "ff-din-web-1","ff-din-web-2",arial,sans-serif; font-size: 20px; margin: 35px 0 0 40px; letter-spacing: 1px; } .cta a{ float: right; padding: 17px 60px; text-decoration: none; font-family: "ff-din-web-1","ff-din-web-2",arial,sans-serif; font-size: 16px; text-transform: uppercase; letter-spacing: 1px; margin: 20px 40px 0 0; } .cta_top{ background-color: rgba(255, 255, 255, .8); margin-top: -90px; } .cta_top p{ color: #454545; } .cta_top a{ background: #e61c42; color: #fff; } .cta{ width: 940px; height: 90px; margin: 0 auto; position: relative; } /* Services */ .services, .testimonials{ padding: 10px 10px; background: #ffffff; width:100%; } .services h2{ color: #606060; font-family: "ff-din-web-1","ff-din-web-2",arial,sans-serif; font-size: 30px; font-weight: bold; text-align: center; } .services .separator{ text-align: center; margin: 20px 0; } .services ul{ list-style: none; margin-left: 80px; overflow: hidden; } .services ul li{ float: left; display: block; width: 320px; height: auto; margin-left: 10px; text-align: center; } .services ul li:first-child{ margin-left: 0; } .services ul li img.s_icons{ margin-bottom: 40px; } .services ul li h3{ color: #746969; font-family: "ff-din-web-1","ff-din-web-2",arial,sans-serif; font-size: 22px; font-weight: bold; margin-bottom: 20px; } .services ul li p{ color: #746969; font-family: "ff-din-web-1","ff-din-web-2",arial,sans-serif; font-size: 14px; line-height: 22px; } /* shadow ____________ */ .box { width:99%; height:260px; background:#FFF; margin-top:0px auto; } .effect6 { position:relative; -webkit-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset; -moz-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset; box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset; } .effect6:before, .effect6:after { content:""; position:absolute; z-index:-1; -webkit-box-shadow:0 0 20px rgba(0,0,0,0.8); -moz-box-shadow:0 0 20px rgba(0,0,0,0.8); box-shadow:0 0 20px rgba(0,0,0,0.8); top:50%; bottom:0; left:10px; right:10px; -moz-border-radius:100px / 10px; border-radius:100px / 10px; } .effect6:after { right:10px; left:auto; -webkit-transform:skew(8deg) rotate(3deg); -moz-transform:skew(8deg) rotate(3deg); -ms-transform:skew(8deg) rotate(3deg); -o-transform:skew(8deg) rotate(3deg); transform:skew(8deg) rotate(3deg); } /* Recent Work */ a:link { text-decoration:none; } .recent_work{ width: 100%; height: auto; background: #ffffff; overflow: hidden; text-align:center; vertical-align:top; } .recent_work .work{ display:inline-block; float:none; /* reset the text-align */ text-align:center; vertical-align: text-top; /* inline-block space fix */ margin-right:-4px; margin-top:20px; width: 30%; height: 100%; padding:20px; } .work p { padding:3px; } .floating-box { display: inline-block; min-width: 290px; height: 340px; margin-top: 20px; border: 0px solid; padding:8px; vertical-align:bottom; } .floating-box2 { display: inline-block; width: 2px; height: 280px; margin-top: 30px; border: 0px solid; background-color:#cccccc; padding:0px; vertical-align:top; } #work a.button { background: transparent!important; border: 2px solid #000000!important; border-radius: 0px; clear: both; color: #000000!important; font-family: "ff-din-web-1","ff-din-web-2",arial,sans-serif; font-size: 16px; font-weight:bold; text-align: center; text-decoration:none; text-transform:none; height: 28px; padding:18px 18px 18px 18px; } #work a.button:hover { background: #c8c8c8!important; border: 2px solid #000000!important; border-radius: 0px; clear: both; color: #000000!important; font-family: "ff-din-web-1","ff-din-web-2",arial,sans-serif; font-size: 16px; font-weight:bold; text-align: center; text-decoration:none; text-transform:none; height: 28px; padding:18px 18px 18px 18px; } #work li{ font-family:'ff-din-web-1','ff-din-web-2',arial,sans-serif!important; color:#000000; font-size:14px; text-transform: none; line-height:1.5; } #work_h1{ color: #000000; font-family: "ff-din-web-1","ff-din-web-2",arial,sans-serif; font-size: 20px; font-weight: 200; text-transform: none; text-align: center; line-height:1.5; } #work_h2{ color: #000000; font-family: "ff-din-web-1","ff-din-web-2",arial,sans-serif; font-size: 24px; font-weight: 200; text-transform: uppercase; text-align: center; line-height:1.5; } #work_h3{ color: #000000; font-family: "ff-din-web-1","ff-din-web-2",arial,sans-serif; font-size: 16px; font-weight: 400; text-transform: none; text-align: center; line-height:1.3; } #work_p{ color: #000000; font-family: "ff-din-web-1","ff-din-web-2",arial,sans-serif; font-size: 20px; font-weight: normal; text-transform: none; text-align: center; line-height:1.5; padding:6px; } #work_b{ color: #000000; font-family: "ff-din-web-1","ff-din-web-2",arial,sans-serif; font-size: 15px; font-weight: bold; text-transform: none; text-align: center; line-height:1.5; } .work h4{ color: #000; font-family: "ff-din-web-1","ff-din-web-2",arial,sans-serif; font-size: 20px; font-weight: normal; text-transform: uppercase; line-height: 1.4; padding: 16px 0 6px 0; text-align: center; } /* Testimonials */ .testimonials{ height: auto; padding-bottom: 100px; } .testimonials h3{ color: #616161; font-family: "ff-din-web-1","ff-din-web-2",arial,sans-serif; font-size: 26px; font-weight: bold; text-transform: uppercase; text-align: center; } .testimonials ul.testi_boxs{ list-style: none; overflow: hidden; margin-top: 80px; } .testimonials ul.testi_boxs li{ float: left; display: block; width: 293px; height: auto; margin-left: 80px; } .testimonials ul.testi_boxs img.avatar{ border-radius: 100px; -webkit-border-radius: 100px; -moz-border-radius: 100px; -o-border-radius: 100px; margin-bottom: 20px; } .testimonials ul.testi_boxs h2{ color: #616161; font-family: "ff-din-web-1","ff-din-web-2",arial,sans-serif; font-size: 16px; font-weight: bold; letter-spacing: .5px; } .testimonials ul.testi_boxs h2 span{ color: #756a6a; font-family: "ff-din-web-1","ff-din-web-2",arial,sans-serif; font-weight: normal; font-size: 12px; } .testimonials ul.testi_boxs p{ color: #747474; font-family: "ff-din-web-1","ff-din-web-2",arial,sans-serif; font-size: 14px; line-height: 22px; margin-top: 20px; } /* Clients */ .clients{ width: 100%; height: 120px; background: #f2f1f1; } .clients ul{ list-style: none; } .clients ul li{ display: block; float: left; margin-left: 120px; } .clients ul li a img{ margin-top: 45px; display: inline-block; } .clients ul li:first-child{ margin-left: 42px; } /* Footer */ footer{ width: 100%; height: 300px; background-image: url("images/lighting.png") repeat-x; background-color: #000000; overflow: hidden; padding-bottom: 20px; } footer .cta_footer{ background-color: #171717; } footer .cta_footer p{ color: #ffffff; } footer .cta_footer a{ color: rgb (138,21,32); font-size: 12px; font-weight: normal; text-transform: none; } footer .footer_widget{ overflow: hidden; padding-bottom: 30px; margin-bottom: 10px; /* border-bottom: 1px #434343 solid; */ } footer .f_cols{ display: block; height: auto; float: right; margin:30px 40px 0 0; min-width:140px; max-width:160px; padding:0px; } footer .f_cols:last-child{ margin-right: 0; } footer .f_cols h3{ color: rgb(180, 180, 180); font-family: "ff-din-web-1","ff-din-web-2",arial,sans-serif; font-size: 12px; font-weight: bolde; margin-bottom: 13px; letter-spacing: 1px; text-transform:uppercase; } footer .f_cols p{ font-family: "ff-din-web-1","ff-din-web-2",arial,sans-serif; font-size: 12px; line-height: 26px; letter-spacing: 1px; color: rgb(112, 112, 112); margin-bottom: 20px; } footer .f_cols span.phone{ display: block; font-family: "ff-din-web-1","ff-din-web-2",arial,sans-serif; font-weight: bold; color: #ffffff; } footer .f_cols ul.sm{ list-style: none; overflow: hidden; } footer .f_cols ul li{ color: rgb(112, 112, 112); font-size: 12px; line-height:13px; } footer .f_cols ul.sm li{ float: left; margin-left: 10px; color: rgb(112, 112, 112); font-size: 12px; line-height:24px; font-weight: normal; text-transform: uppercase; } footer .f_cols ul.sm li:first-child{ margin-left: 0; } footer .f_cols ul.sm li a{ display: block; width: 25px; height: 25px; background: url('../img/social.png') no-repeat; } footer .f_cols ul.sm li a.fb{ background-position: 0 0; } footer .f_cols ul.sm li a.twitter{ background-position: -26px 0; } footer .f_cols ul.sm li a.dribbble{ background-position: -52px 0; } footer .f_cols ul.sm li a:hover{ background: url('../img/social_hover.png') no-repeat; } footer .f_cols ul.sm li a.fb:hover{ background-position: 0 0; } footer .f_cols ul.sm li a.twitter:hover{ background-position: -26px 0; } footer .f_cols ul.sm li a.dribbble:hover{ background-position: -52px 0; } footer .f_cols a{ display: inline-block; font-family: "ff-din-web-1","ff-din-web-2",arial,sans-serif; color: rgb(191, 29, 45)!important; font-size: 12px; font-weight: normal; text-transform: none; } footer .f_cols a:hover{ color: #ffffff; } footer .f_cols ul li{ list-style: none; margin-bottom: 15px; } footer .f_cols ul li a{ text-decoration: none; color: rgb (191, 29, 45)!important; font-family: "ff-din-web-1","ff-din-web-2",arial,sans-serif; font-size: 12px; } footer .f_cols ul li a:hover{ color: #e61c42; } .joinus a.button { background: transparent!important; border: 2px solid #ffffff!important; border-radius: 0px; clear: both; color: #ffffff!important; font-family: "ff-din-web-1","ff-din-web-2",arial,sans-serif; font-size: 13px; font-weight:normal; text-align: center; text-decoration:none; height: 28px; margin-top: 25px; width: 200px; float:right; padding:18px 6px 6px 6px; } .joinus a.button:hover { background: #c8c8c8!important; border: 2px solid #ffffff!important; border-radius: 0px; clear: both; color: #000000!important; font-family: "ff-din-web-1","ff-din-web-2",arial,sans-serif; font-size: 13px; font-weight:normal; text-align: center; text-decoration:none; height: 28px; margin-top: 25px; width: 200px; float:right; padding:18px 6px 6px 6px; } .joinus2 a.button { background: transparent!important; border: 2px solid #ffffff!important; border-radius: 0px; clear: both; color: #ffffff!important; font-family: "ff-din-web-1","ff-din-web-2",arial,sans-serif; font-size: 13px; font-weight:normal; text-align: center; text-decoration:none; height: 28px; margin-top: 0px; width: 80px; float:left; padding:18px 6px 6px 6px; } .joinus2 a.button:hover { background: #c8c8c8!important; border: 2px solid #ffffff!important; border-radius: 0px; clear: both; color: #000000!important; font-family: "ff-din-web-1","ff-din-web-2",arial,sans-serif; font-size: 13px; font-weight:normal; text-align: center; text-decoration:none; height: 28px; margin-top: 0px; width: 80px; float:left; padding:18px 6px 6px 6px; } abbr { font-size: 9px; font-weight: bold; margin-right: 8px; } p.rights{ display: block; text-align: left; margin: 0; padding: 0; color: rgb(112, 112, 112); font-family: "ff-din-web-1","ff-din-web-2",arial,sans-serif; font-size: 12px; font-weight: normal; letter-spacing: 1px; height:40px; } p.rights a{ font-family: "ff-din-web-1","ff-din-web-2",arial,sans-serif; font-weight: normal; font-size:12px; color: rgb(112, 112, 112); }