/*
* HTML5 Boilerplate
*
* What follows is the result of much research on cross-browser styling.
* Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
* Kroc Camen, and the H5BP dev community and team.
*
* Detailed information about this CSS: h5bp.com/css
*
* ==|== normalize ==========================================================
*/
@font-face {
font-family: 'Open Sans Condensed';
font-style: normal;
font-weight: 300;
src: local('Open Sans Cond Light'), local('OpenSans-CondensedLight'), url('../fonts/gk5FxslNkTTHtojXrkp-xF1YPouZEKgzpqZW9wN-3Ek.woff') format('woff');
}
@font-face {
font-family: 'Playfair Display';
font-style: italic;
font-weight: 400;
src: local('Playfair Display Italic'), local('PlayfairDisplay-Italic'), url('../fonts/9MkijrV-dEJ0-_NWV7E6N3aqFElqJjV-H5EUExnZgmU.woff') format('woff');
}
/* =============================================================================
HTML5 display definitions
========================================================================== */
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
audio:not([controls]) { display: none; }
[hidden] { display: none; }
/* =============================================================================
Base
========================================================================== */
/*
* 1. Correct text resizing oddly in IE6/7 when body font-size is set using em units
* 2. Prevent iOS text size adjust on device orientation change, without disabling user zoom: h5bp.com/g
*/
html { font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
html, button, input, select, textarea { font-family: sans-serif; color: #222; }
body { margin: 0; font-size: 1em; line-height: 1.4; }
/*
* Remove text-shadow in selection highlight: h5bp.com/i
* These selection declarations have to be separate
* Also: hot pink! (or customize the background color to match your design)
*/
::-moz-selection { background: #fe57a1; color: #fff; text-shadow: none; }
::selection { background: #fe57a1; color: #fff; text-shadow: none; }
/* =============================================================================
Links
========================================================================== */
a { color: #00e; }
a:visited { color: #551a8b; }
a:hover { color: #06e; }
a:focus { outline: thin dotted; }
/* Improve readability when focused and hovered in all browsers: h5bp.com/h */
a:hover, a:active { outline: 0; }
/* =============================================================================
Typography
========================================================================== */
abbr[title] { border-bottom: 1px dotted; }
b, strong { font-weight: bold; }
blockquote { margin: 1em 40px; }
dfn { font-style: italic; }
hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }
ins { background: #ff9; color: #000; text-decoration: none; }
mark { background: #ff0; color: #000; font-style: italic; font-weight: bold; }
/* Redeclare monospace font family: h5bp.com/j */
pre, code, kbd, samp { font-family: monospace, serif; _font-family: 'courier new', monospace; font-size: 1em; }
/* Improve readability of pre-formatted text in all browsers */
pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; }
q { quotes: none; }
q:before, q:after { content: ""; content: none; }
small { font-size: 85%; }
/* Position subscript and superscript content without affecting line-height: h5bp.com/k */
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }
/* =============================================================================
Lists
========================================================================== */
ul, ol { margin: 1em 0; padding: 0 0 0 40px; }
dd { margin: 0 0 0 40px; }
nav ul, nav ol { list-style: none; list-style-image: none; margin: 0; padding: 0; }
/* =============================================================================
Embedded content
========================================================================== */
/*
* 1. Improve image quality when scaled in IE7: h5bp.com/d
* 2. Remove the gap between img and borders on image containers: h5bp.com/i/440
*/
img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; }
/*
* Correct overflow not hidden in IE9
*/
svg:not(:root) { overflow: hidden; }
/* =============================================================================
Figures
========================================================================== */
figure { margin: 0; }
/* =============================================================================
Forms
========================================================================== */
form { margin: 0; }
fieldset { border: 0; margin: 0; padding: 0; }
/* Indicate that 'label' will shift focus to the associated form element */
label { cursor: pointer; }
/*
* 1. Correct color not inheriting in IE6/7/8/9
* 2. Correct alignment displayed oddly in IE6/7
*/
legend { border: 0; *margin-left: -7px; padding: 0; white-space: normal; }
/*
* 1. Correct font-size not inheriting in all browsers
* 2. Remove margins in FF3/4 S5 Chrome
* 3. Define consistent vertical alignment display in all browsers
*/
button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; *vertical-align: middle; }
/*
* 1. Define line-height as normal to match FF3/4 (set using !important in the UA stylesheet)
*/
button, input { line-height: normal; }
/*
* 1. Display hand cursor for clickable form elements
* 2. Allow styling of clickable form elements in iOS
* 3. Correct inner spacing displayed oddly in IE7 (doesn't effect IE6)
*/
button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; -webkit-appearance: button; *overflow: visible; }
/*
* Re-set default cursor for disabled elements
*/
button[disabled], input[disabled] { cursor: default; }
/*
* Consistent box sizing and appearance
*/
input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0; *width: 13px; *height: 13px; }
input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }
input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; }
/*
* Remove inner padding and border in FF3/4: h5bp.com/l
*/
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }
/*
* 1. Remove default vertical scrollbar in IE6/7/8/9
* 2. Allow only vertical resizing
*/
textarea { overflow: auto; vertical-align: top; resize: vertical; }
/* Colors for form validity */
input:valid, textarea:valid { }
input:invalid, textarea:invalid { background-color: #f0dddd; }
/* =============================================================================
Tables
========================================================================== */
table { border-collapse: collapse; border-spacing: 0; }
td { vertical-align: top; }
/* =============================================================================
Chrome Frame Prompt
========================================================================== */
.chromeframe { margin: 0.2em 0; background: #ccc; color: black; padding: 0.2em 0; }
/* ==|== primary styles =====================================================
Author: CG
========================================================================== */
/*----- BODY -------*/
body{width:100%;
font-family:Verdana, Geneva, sans-serif;
font-size:12px;
color:#000;
margin:0;
background: url(../img/fundo2.png) top left repeat-x;
}
.sobre{background: url(../img/metal.png) top left repeat;
width:100%;
height:100%;
position:fixed;
z-index:2;
opacity:0.7;
}
/*------ CONTEUDO ----*/
div#content{position:absolute;
top:0;
left:0;
z-index:50;
width:100%;
}
div#center{ width:960px;
margin: 10px auto;
z-index:0;
}
.headerTotal{ width:100%;
height:105px;
background:#941232;
z-index:1;
border-bottom: #CCC solid 1px;
}
.header{ width:960px;
height:105px;
margin: 0 auto;
}
.header .logo{ width:340px;
height:105px;
float:left;
}
.logo img{ padding:0 0 0 0;
}
.logo img:hover{ opacity:0.7;
}
.wrapperLocalCaminho {
width:960px;
height:35px;
color:#FFF;
text-shadow:1px 1px 1px #333;
font-size: 14px;
font-weight:bold;
font-family: 'Open Sans Condensed', sans-serif;
font-style:normal;
padding: 20px 0 0 0;
}
.wrapperLocalCaminho a {
color:#CCC;
text-decoration: none;
text-shadow:1px 1px 1px #333;
font-size: 14px;
font-weight:bold;
font-family: 'Open Sans Condensed', sans-serif;
}
.wrapperLocalCaminho a:hover {
text-decoration: none;
color:#FF6;
text-shadow:1px 1px 1px #333;
}
div#main{width:960px;
height:320px;
}
.referenceContent{ width:316px;
float:left;
padding: 0 0 0 0;
background:#FFF url(../img/backgroundContent22.png) top left repeat-x;
/* border:#941232 1px solid;*/
}
.referenceContentSombra{ width:316px;
height:24px;
float:left;
background: url(../img/sombra.png) top left no-repeat;
}
.referenceContentTudo{ width:316px;
float:left;
margin: 2px;
}
.referenceContent .top { width:314px;
float:left;
background: url(../img/grd-4x4.png);
border: 1px solid #FFF;
}
.referenceContent .icon1 { width:75px;
height:75px;
margin:2px;
float:left;
background: url(../img/reboque2.png) top no-repeat;
}
.referenceContent .icon2 { width:75px;
height:75px;
margin:2px;
float:left;
background: url(../img/reboque.png) top no-repeat;
}
.referenceContent .icon3 { width:75px;
height:75px;
margin:2px;
float:left;
background: url(../img/oficina.png) top no-repeat;
}
.referenceContent .titulo { width:200px;
margin:2px;
float:left;
padding: 30px 0 0 20px;
font-size: 22px;
font-family: 'Playfair Display', serif;
font-style: italic;
color: #b5b5b5;
}
.referenceContent .description { width:289px;
height:220px;
margin:2px 4px 0 4px;
float:left;
padding: 10px;
font-size: 18px;
font-family: 'Open Sans Condensed', sans-serif;
font-style:normal;
color: #0a518b;
background: url(../img/logoBfundo.png) center no-repeat;
text-align:center;
}
.referenceContent .bottom { width:310px;
height:30px;
margin:0 4px 3px 4px;
float:left;
background: url(../img/ver-1x1.png);
}
.referenceContent .verMais { width:70px;
height:19px;
float:right;
text-align:center;
padding:2px 0 2px 0;
font-size: 15px;
font-family: 'Open Sans Condensed', sans-serif;
font-style:italic;
color: #0a518b;
margin: 3px 15px 0 0;
background:#efedee;
}
.referenceContent .verMais:hover{ background:#5095ce;
color: #FFF;
}
div#fotter{width:100%;
background:#941232 url(../img/logoBoucinha50.png) repeat-x;;
height:32px;
color:#FFFFFF;
text-shadow: 1px 1px 1px #999;
position:fixed;
bottom:0;
z-index:999;
}
.footerContent{ width:960px;
padding: 0 0 0 0;
height:24px;
margin: 0 auto;
}
.footerContentMenu{ font-family: 'Open Sans Condensed', sans-serif;
font-size: 16px;
width:550px;
padding: 4px 0 0 10px;
height:18px;
margin: 5px 0 5px 5px;
text-transform: uppercase;
text-shadow: 1px 1px 1px #999999;
float:left;
}
.footerContentMenu a{ text-decoration:none;
color:#FFFFFF;
}
.footerContentMenu a:hover{ color:#999 !important;
}
.footerLink{ padding: 0 0 0 10px;}
.ft{ padding: 0 0 0 10px;}
.footerLinkAtivo{ color:#999 !important;}
.footerContentRight{ width:370px;
padding: 8px 0 0 0;
height:25px;
margin: 2px 0 0 0;
float:left;
font-family: 'Open Sans Condensed', sans-serif;
font-size: 14px;
text-align:right;
}
.footerContentRightLogo{ width:80px;
float: right;
margin:-4px 0 0 0;
}
/* ==|== media queries ======================================================
EXAMPLE Media Query for Responsive Design.
This example overrides the primary ('mobile first') styles
Modify as content requires.
========================================================================== */
@media only screen and (min-width: 35em) {
/* Style adjustments for viewports that meet the condition */
}
/* ==|== non-semantic helper classes ========================================
Please define your styles before this section.
========================================================================== */
/* For image replacement */
.ir { display: block; border: 0; text-indent: -999em; overflow: hidden; background-color: transparent; background-repeat: no-repeat; text-align: left; direction: ltr; *line-height: 0; }
.ir br { display: none; }
/* Hide from both screenreaders and browsers: h5bp.com/u */
.hidden { display: none !important; visibility: hidden; }
/* Hide only visually, but have it available for screenreaders: h5bp.com/v */
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }
/* Extends the .visuallyhidden class to allow the element to be focusable when navigated to via the keyboard: h5bp.com/p */
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }
/* Hide visually and from screenreaders, but maintain layout */
.invisible { visibility: hidden; }
/* Contain floats: h5bp.com/q */
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { *zoom: 1; }
/* ==|== print styles =======================================================
Print styles.
Inlined to avoid required HTTP connection: h5bp.com/r
========================================================================== */
@media print {
* { background: transparent !important; color: black !important; box-shadow:none !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; } /* Black prints faster: h5bp.com/s */
a, a:visited { text-decoration: underline; }
a[href]:after { content: " (" attr(href) ")"; }
abbr[title]:after { content: " (" attr(title) ")"; }
.ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; } /* Don't show links for img, or javascript/internal links */
pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
thead { display: table-header-group; } /* h5bp.com/t */
tr, img { page-break-inside: avoid; }
img { max-width: 100% !important; }
@page { margin: 0.5cm; }
p, h2, h3 { orphans: 3; widows: 3; }
h2, h3 { page-break-after: avoid; }
}
/*===================== MENU ==========================*/
/*===================== MENU ==========================*/
ul#navigation {
/*position: fixed;*/
float:right;
margin: 0px;
padding: 0px;
top: 0px;
right: 10px;
list-style: none;
z-index:999999;
width:615px;
}
ul#navigation li {
width: 123px;
display:inline;
float:left;
}
ul#navigation li a {
display: block;
float:left;
margin-top: -2px;
width: 120px;
height: 25px;
/* background-color:#E7F2F9;*/
background-color:#FFF;
background-repeat:no-repeat;
background-position:50% 10px;
border:1px solid #941322;
-moz-border-radius:0px 0px 10px 10px;
-webkit-border-bottom-right-radius: 10px;
-webkit-border-bottom-left-radius: 10px;
-khtml-border-bottom-right-radius: 10px;
-khtml-border-bottom-left-radius: 10px;
border-bottom-left-radius:10px;
border-bottom-right-radius:10px;
text-decoration:none;
text-align:center;
padding-top:80px;
opacity: 0.9;
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=90);
}
ul#navigation li a:hover{ background-color: transparent;
opacity: 1;
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100);
border:1px solid #BDDCEF;
}
ul#navigation li a span{letter-spacing:2px;
font-size:16px;
font-weight:bold;
color:#60ACD8;
text-shadow: 0 -1px 1px #fff;
font-family: 'Open Sans Condensed', sans-serif;
}
ul#navigation li a span:hover{ color:#FFFFFF !important;
}
#ativo span{ color:#941322 !important;
font-size: 18px !important;
}
ul#navigation .home a{
background-image: url(../img/home.png);
}
ul#navigation .about a {
background-image: url(../img/id_card.png);
}
ul#navigation .search a {
background-image: url(../img/search.png);
}
ul#navigation .portfolio a {
background-image: url(../img/portfolio.png);
}
ul#navigation .contact a {
background-image: url(../img/mail.png);
}
/*===================== LOGO ==========================*/
ul#carlos {
position: fixed;
margin: 0px;
padding: 0px;
bottom: 3px;
right: 0px;
list-style: none;
z-index:999999;
width:185px;
}
ul#carlos li {
width: 185px;
display:inline;
float:left;
}
ul#carlos li a {
display: block;
float:left;
margin-bottom: -2px;
width: 187px;
height: 12px;
background-repeat:no-repeat;
text-decoration:none;
text-align:center;
padding-bottom:18px;
}
ul#carlos li a:hover{
background-position: center;
}
ul#carlos .neiva a{
background: url(../img/solracinformatica.png);
}
/************************
EMPRESA
*********************/
.container-container { position:relative;
width:897px;
background: #FFF;
height:350px;
margin: 125px 25px 0 25px;
padding: 30px 0 0 15px;
background: #FFF url(../img/logoBoucinha50-2.png) bottom right no-repeat;
}
.sombraBottom { background: url(../img/sombraCentro.png) top no-repeat;
height:25px;
width:960px;
float:left;
}
.container-container .description { width:697px;
margin:0 30px 0 20px;
float:right;
padding: 0;
font-size: 18px;
font-family: 'Open Sans Condensed', sans-serif;
font-style:normal;
color: #0a518b;
text-align:justify;
}
.container-container .left { width:128px;
height: 315px;
margin: 0 0 0 20px;
float:left;
background: url(../img/left_empresa.jpg);
border: solid 1px #999999;
}
.container-header { width:960px;
background:url(../img/headline-bg3.png) top no-repeat;
height:151px;
z-index:1;
}
.container-header .header { width:912px;
margin: 0 0 0 25px;
padding: 60px 0 0 0;
font-size: 32px;
font-family: 'Open Sans Condensed', sans-serif;
font-style: normal;
color: #CCC;
font-weight:bold;
text-shadow: 3px 3px 3px #999;
text-align: center;
}
.container-footer { position:relative;
width:912px;
margin:0 25px 0 25px;
background: url(../img/sombraCentro.png) top no-repeat;
height:30px;
}
/************************
LOCALIZAÇÃO
*********************/
.container-container2 { float:left;
width:897px;
background: #FFF;
height: auto;
margin: 125px 25px 0 25px;
padding: 30px 0 0 15px;
background: #FFF url(../img/logoBoucinha50-2.png) bottom right no-repeat;
}
.sombraBottom { background: url(../img/sombraCentro.png) top no-repeat;
height:25px;
width:960px;
float:left;
}
.container-container2 .description { width:697px;
margin:0 30px 0 20px;
float:right;
padding: 0;
font-size: 18px;
font-family: 'Open Sans Condensed', sans-serif;
font-style:normal;
color: #0a518b;
text-align:justify;
}
.container-container2 .left { width:128px;
height: 315px;
margin: 0 0 0 20px;
float:left;
background: url(../img/left_empresa.jpg);
border: solid 1px #999999;
}
.container-header { position: absolute;
width:960px;
background:url(../img/headline-bg3.png) top no-repeat;
height:151px;
z-index:1;
}
.container-header .header { width:912px;
margin: 0 0 0 25px;
padding: 60px 0 0 0;
font-size: 32px;
font-family: 'Open Sans Condensed', sans-serif;
font-style: normal;
color: #CCC;
font-weight:bold;
text-shadow: 3px 3px 3px #999;
text-align: center;
}
.container-footer { position:relative;
width:912px;
margin:0 25px 0 25px;
background: url(../img/sombraCentro.png) top no-repeat;
height:30px;
}
/************************
LOCALIZAÇÃO
*********************/
.container-containerLocal { position:relative;
width:911px;
background: #FFF;
height:850px;
margin: 125px 25px 0 25px;
}
.container-containerLocal .titulo { width:350px;
height: 30px;
margin: 30px 50px 0 30px;
padding: 0 0 0 30px;
float:left;
background:url(../img/logoBoucinha50.png);
font-size: 24px;
font-family: 'Open Sans Condensed', sans-serif;
font-style: normal;
text-shadow: 1px 1px 1px #999999;
color:#941232 ;
}
.container-containerLocal .tituloMorada { width:200px;
height: 30px;
margin: 30px 72px 0 30px;
float: right;
background:url(../img/logoBoucinha50.png);
font-size: 24px;
font-family: 'Open Sans Condensed', sans-serif;
font-style: normal;
text-shadow: 1px 1px 1px #999999;
padding: 0 0 0 30px;
color:#941232 ;
}
.container-containerLocal .localizacao { width:550px;
height: 315px;
margin: 10px 0 0 30px;
float:left;
border: solid 1px #999999;
}
.container-containerLocal .localizacaoMorada { width:270px;
height: 710px;
margin: 10px 30px 0 0;
float: right;
background:url(../img/logoBoucinha.png) bottom right no-repeat;
}
.localizacaoMorada #titulo{ font-size: 18px;
font-family: 'Open Sans Condensed', sans-serif;
font-style: normal;
text-shadow: 1px 1px 1px #999999;
color: #006;
padding: 10px 0 20px 10px;
}
.localizacaoMorada #descritivo{ font-size: 18px;
font-family: 'Open Sans Condensed', sans-serif;
font-style: normal;
padding: 0 0 0 20px;
color: #0a518b;
}
.container-containerLocal .envioEmail { width:520px;
height: 315px;
margin: 20px 0 0 50px;
float:left;
}
.container-containerLocal .localizacaoLogo { width:270px;
height: 315px;
margin: 0 0 0 30px;
float:left;
background:url(../img/logoBoucinha.png);
border: solid 1px #999999;
}
/* GOOGLE MAP -----------------------------------------------------*/
.gmap3{
width:546px;
height:311px;
margin-bottom: 20px;
border:#fff 2px solid;
}
.labels {
color: red;
background-color: white;
font: normal 115% 'Yanone Kaffeesatz', arial, sans-serif;
text-align: center;
width: 100px;
border: 1px solid black;
white-space: nowrap;
}
/********************
* FEATURE CAROUSEL *
********************/
.carousel-container {
position:relative;
width:960px;
background:url(../img/headline-bg2.png);
}
#carousel {
height:280px;
width:960px;
position:relative;
margin-bottom:0.5em;
font-family: 'Open Sans Condensed', sans-serif;
font-style:normal;
font-size:12px;
}
.carousel-image {
border:0;
display:block;
}
.carousel-feature {
position:absolute;
top:-1000px;
left:-1000px;
border:2px solid #FFF;
cursor:pointer;
}
.carousel-feature .carousel-caption {
position:absolute;
bottom: 4px;
width:100%;
background:#000 url(../img/metal.png);
}
.carousel-feature .carousel-caption p {
margin:0;
padding:5px;
font-weight:bold;
font-family: 'Open Sans Condensed', sans-serif;
font-size:18px;
color:white;
}
.tracker-summation-container {
position:absolute;
color:#941232;
right:48px;
top:230px;
padding:3px;
margin:3px;
}
.tracker-individual-container {
position:absolute;
color:#941232;
right:48px;
top:210px;
padding:0;
margin:0;
}
.tracker-individual-container li {
list-style:none;
}
.tracker-individual-container .tracker-individual-blip {
margin:0 3px;
padding:0 3px;
color:#941232;
text-align:center;
border:1px solid #941232;
}
.tracker-individual-container .tracker-individual-blip-selected {
color:white;
font-weight:bold;
background-color:#941232;
}
#carousel-left {
position:absolute;
bottom:33px;
left:180px;
cursor:pointer;
opacity: 0.7;
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=70);
}
#carousel-right {
position:absolute;
bottom:33px;
right:180px;
cursor:pointer;
opacity: 0.6;
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=60);
}
#carousel-right:hover {opacity: 1;
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100);
}
#carousel-left:hover {opacity: 1;
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100);
}
/* FORMS ------------------------------------------------------------*/
#contactForm{
margin-bottom: 18px;
}
#contactForm input,
#contactForm textarea{
padding: 5px 5px ;
background-color:transparent;
color: #941232;
border: 1px solid #941232;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
overflow: auto;
}
#contactForm input:hover,
#contactForm textarea:hover{
border: 1px solid #03C;
}
#contactForm input:focus,
#contactForm textarea:focus{
border: 1px solid #03C;
background: url(../img/barra_fundo.png) top left repeat;
color: #009;
}
#contactForm input{
width: 340px;
margin-bottom: 20px;
}
#contactForm textarea{
width: 400px;
height: 120px;
}
#contactForm #submit{
width: 100px;
margin: 21px 0px;
padding: 5px 5px;
color: #cbcbcb;
text-shadow: 0px 1px 0px #CCCCCC;
background: -webkit-gradient(linear, left top, left bottom, from(#656464), to(#303030));
background: -moz-linear-gradient(top, #656464, #303030);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#656464', endColorstr='#303030', GradientType=0);
}
#contactForm #submit:hover{
opacity: 0.8;
}
#contactForm label{
padding-left: 7px;
font: normal 140% 'Yanone Kaffeesatz', arial, sans-serif !important;
color:#999;
}
#respond{
margin: 25px 0 0px 0px;
overflow: hidden;
}
#respond .cancel-comment-reply a{
color: #282d34;
text-decoration: none;
margin-bottom: 20px;
display: block;
}
#error{
margin-left: 10px;
font: normal 120% 'Yanone Kaffeesatz', arial, sans-serif !important;
color:#F00;
}
.success{
font: normal 130% 'Yanone Kaffeesatz', arial, sans-serif !important;
padding: 0 0 0 20px !important;
color:#0a518b !important;
}
/*---------- FICHA TÉCNICA------------------*/
.panel_ft {
position: fixed;/* absolute;*/
right: 40px;
letter-spacing:1px;
bottom: 120px;
display: none;
background: #FFF url(../img/logoBoucinha.png)no-repeat right;
border-radius:10px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
box-shadow: 5px 5px 20px #000, -5px -5px 20px #000;
-moz-box-shadow: 5px 5px 20px #000, -5px -5px 20px #000;
-webkit-box-shadow: 5px 5px 20px #000, -5px -5px 20px #000;
border:1px solid #941232;
width: 800px;
height: 340px;
z-index:998;
}
.panel_ft .titulo { width:490px;
height: 35px;
margin: 2px 0 0 15px;
padding: 5px 0 0 30px;
float:left;
background:url(../img/logoBoucinha50.png);
font-size: 24px;
font-family: 'Open Sans Condensed', sans-serif;
font-style: normal;
text-shadow: 1px 1px 1px #999;
color:#941232 ;
}
.panel_ft .texto { width:480px;
height: 200px;
margin: 2px 0 0 15px;
padding: 5px 0 0 30px;
float:left;
font-size: 16px;
font-family: 'Open Sans Condensed', sans-serif;
font-style: normal;
/*text-shadow: 1px 1px 1px rgba(0,0,0,0.7);*/
color:#0a518b ;
text-align:justify;
}
.panelFechar{
float:right;
width:50px;
height:26px;
background: url(../img/button_close.png) no-repeat right -26px;
margin:15px 15px 0 0;
}
.panelFechar:hover{
background: url(../img/button_close.png) no-repeat right 0px;
}
/* PORTFOLIO --------------------------------------------------------*/
#projects-list{
overflow: hidden;
}
#projects-list .project{
position: relative;
float: left;
width: 438px;
margin-left: 30px;
margin-bottom: 30px;
padding-bottom: 30px;
background: url(../img/portfolio-divider.png) no-repeat bottom center;
}
#projects-list .project h1 a{
display: block;
text-decoration: none;
margin-bottom: 20px;
color: #51565b;
}
.project-shadow{
background: url(../img/shadow-project.png) no-repeat 0px 267px;
}
#projects-list .project .project-thumbnail{
position: relative;
overflow: hidden;
width: 438px;
height: 267px;
margin-bottom: 20px;
background: #f1f1f1;
border-radius: 10px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
}
#projects-list .project .project-thumbnail .cover{
position: absolute;
top:0px;
left: 0px;
}
#projects-list .project .project-thumbnail .meta{
display: block;
width: 252px;
height: 207px;
font-size: 16px;
line-height: 2em;
position: absolute;
top:30px;
left: 30px;
}
#projects-list .project .read-more{
display: block;
position: absolute;
bottom: -17px;
left: 160px;
}
/* PROJECT --------------------------------------------------------*/
.project-column{
width: 438px;
float: left;
margin-left: 30px;
}
.project-column .project-thumbnail{
overflow: hidden;
width: 438px;
height: 267px;
margin-bottom: 30px;
border-radius: 10px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
}
#content .project-column .meta a{
display: inline;
font-size: 12px;
color: #fff;
padding: 3px 10px;
text-decoration: none;
background: #363636;
border-radius: 10px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
}
#content .project-column .meta a:hover{ background: #000;}
.project-column .project-title{
margin-bottom: 20px;
}
.project-column .portfolio-left-shadow{
height: 26px;
margin-bottom: 20px;
background: url(../img/portfolio-left-shadow.png) no-repeat center bottom;
}
/* PROJECT-GALLERY -----------------------------------------------*/
.project-column .project-gallery{
display: block;
overflow: hidden;
width: 468px;
}
.project-column .project-gallery li{
display: block;
float: left;
overflow: hidden;
background: url(../img/plus-sign.png) center center no-repeat;
width: 204;
height: 148px;
margin-right: 30px;
margin-top: 30px;
border-radius: 10px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
}
/* GALLERY -----------------------------------------------*/
#content .filter li.selected{
background: #000;
}
/***********************************************************************************************************************
EXTRA STYLES ADDED FOR MOUSEOVER / ACTIVE EVENTS
************************************************************************************************************************/
.on {
background: #990000;
}
.over {
background: #CCCCCC;
}
/*----------------------------------------------*/
/* Portofolio */
/*----------------------------------------------*/
.portofolio{
position: relative;
width: 100%;
}
.portofolio li{
float: left;
position: relative;
}
.portofolio a.buttonPro{
margin-top: 20px;
}
.category-title{
position: relative;
width: 775px;
}
.category-title a{
display: inline-block;
text-decoration: none;
outline: none;
cursor: pointer;
font: bold 12px/1em Arial, sans-serif;
padding: 10px 13px;
color: #a7a7a7; !important;
text-shadow: 0 1px 0 #fff;
background: #f1f1f1; /* Old browsers */
background: -moz-linear-gradient(top, #f1f1f1 0%, #e9e9e9 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f1f1f1), color-stop(100%,#e9e9e9)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #f1f1f1 0%,#e9e9e9 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #f1f1f1 0%,#e9e9e9 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #f1f1f1 0%,#e9e9e9 100%); /* IE10+ */
background: linear-gradient(top, #f1f1f1 0%,#e9e9e9 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f1f1f1', endColorstr='#e9e9e9',GradientType=0 ); /* IE6-9 */
border-bottom: solid 1px #ddd;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
-webkit-box-shadow: 0 0 3px #eaeaea, inset 0 1px 0 #fdfdfd;
-moz-box-shadow: 0 0 3px #eaeaea, inset 0 1px 0 #fdfdfd;
box-shadow: 0 0 3px #eaeaea, inset 0 1px 0 #fdfdfd;
}
.category-title a:hover{
position: relative;
background: #efefef;
background: -webkit-gradient(linear, left top, left bottom, from(#e7e7e7), to(#e9e9e9)) !important;
background: -moz-linear-gradient(top, #e7e7e7, #e9e9e9) !important;
cursor: pointer;
}
.category-title a:active{
background: #efefef;
-moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none;
}
.pPage{
width: 100px;
position: relative;
padding: 10px 0 0 20px;
text-align: right;
}
.pPage a.prev, .pPage a.next{
padding: 5px 10px 5px 10px;
margin: 0 3px 0 px;
background: #cdcdcd;
}
.pPage a.prev:hover, .pPage a.next:hover{
background: #3080b6;
}
/*----------------------------------------------*/
/* Comments */
/*----------------------------------------------*/
#comments{
position: relative;
margin: 0;
}
.postComment {
position: relative;
margin: 15px 0 15px 0;
overflow: hidden;
max-width: 100%;
}
.postComment ul{
padding: 10px;
border: solid 1px #eee;
}
.postComment ul img{
float: left;
}
.postComment ul li{
margin: 0 15px 0 15px;
}
.postComment h4{
font-weight: bold;
}
.postComment ul li:first-child{
overflow: hidden;
display: inline-block;
width: 60px;
float: left;
margin-left: 0 !important;
}
.postComment ul li:last-child{
overflow: hidden;
padding-left: 10px;
border-left: 1px solid #eee;
}
.dateComments{
font-size: 12px;
color: #bbb;
font-style: italic;
}
.postComment ul li p{
margin-top: 20px;
font-size: 12px;
color: #909090;
line-height: 1.5em;
}
.postComment .reply{
position: absolute;
right: 10px;
top: 10px;
}
.postComment h4{
color: #909090;
}
.reply a{
text-decoration: none;
color: #aaaaaa;
font-size: 12px;
}
.reply a:hover{
color: #62a5c8;
}
.reply a img{
margin-bottom: -2px;
padding-right: 5px;
}
.reply1{
margin: 15px 0 0 30px !important;
}
.reply2{
margin: 15px 0 0 60px !important;
}
#respon{
padding: 0px 0 20px 0;
}
#respon .nameInput, #respon .emailInput, #respon .webInput{
width: 45%;
background: #efefef;
height: 28px;
margin-bottom: 10px;
border: 1px solid #dedede;
padding-left: 12px;
color: #bbb;
}
#respon .messageInput{
font-family: Arial,sans-serif;
font-size: 12px;
width: 70%;
height: 100px;
margin-bottom: 15px;
border: 1px solid #dedede;
padding-top: 12px;
padding-left: 12px;
background: #eee;
color: #bbb;
}
#respon label{
display: block;
margin-bottom: 4px;
color: #aaa;
font-size: 12px;
}
#respon .nameInput:hover, #respon .emailInput:hover, #respon .webInput:hover, #respon .messageInput:hover{
border: 1px solid #d0d0d0;
}
#respon .nameInput:focus, #respon .emailInput:focus, #respon .webInput:focus, #respon .messageInput:focus{
outline: none;
background-color: #e7e7e7;
color: #a1a1a1;
}
#respon #submit{
display: inline-block;
text-decoration: none;
outline: none;
cursor: pointer;
font: bold 12px/1em Arial, sans-serif;
padding: 10px 13px;
color: #a7a7a7; !important;
text-shadow: 0 1px 0 #fff;
background: #f7f7f7;
background: -webkit-gradient(linear, left top, left bottom, from(#f1f1f1), to(#e9e9e9));
background: -moz-linear-gradient(top, #f1f1f1, #e9e9e9);
border-bottom: solid 1px #ddd !important;
border: none;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
-webkit-box-shadow: 0 0 3px #eaeaea, inset 0 1px 0 #fdfdfd;
-moz-box-shadow: 0 0 3px #eaeaea, inset 0 1px 0 #fdfdfd;
box-shadow: 0 0 3px #eaeaea, inset 0 1px 0 #fdfdfd;
}
#respon #submit:hover{
position: relative;
background: #efefef;
background: -webkit-gradient(linear, left top, left bottom, from(#e7e7e7), to(#e9e9e9)) !important;
background: -moz-linear-gradient(top, #e7e7e7, #e9e9e9) !important;
cursor: pointer;
}
#respon #submit:active{
background: #efefef;
-moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none;
}
/*----------------------------------------------*/
/* Shortcodes - Columns*/
/*----------------------------------------------*/
.fullWidth{
float: left;
width: 900px;
clear: both;
}
.outerOneHalf{
float: left;
width: 425px;
margin-right: 26px;
}
.outerOneHalf h3{ width:430px;
float:left;
padding: 0 0 0 2px !important;
font-size: 18px;
font-family: 'Playfair Display', serif;
font-style: italic;
color: #666;
}
.outerOneHalf h4 { margin:0px !important;
float:left;
padding: 0px 0px 60px 6px !important;
font-size: 12px;
font-style:normal;
color: #7F7F7F;
}
.last{
margin-right:0px !important;
clear:right;
}
/* SHORTCODE - img */
.imageWrap{
line-height: 0;
display: block;
position: relative;
margin-bottom: 20px;
}
.imageWrap img:hover{ opacity:0.7;
border: 4px solid #CCC;
}
.shadowHolder img{
display: block;
margin-left: auto;
margin-right: auto;
position: relative;
max-width: 100%;
margin-top: -20px;
}
.imageWrap img{
display: block;
width: 100%;
height: auto;
border: 4px solid #F0F0F0;
}