/************************************************\
» Main Layout - Screen
--------------------------------------------------
// CSS V.2.12 (26/01/2011)
- Graphic effects added: transparency box
// CSS V.2.11 (21/12/2010)
- Some code reorganized
// CSS V.2.10 (06/12/2010)
- Added Graphic Effects tab
- Optimized Code
// CSS V.2.00 (16/08/2010)
- Added Eric Meyer's CSS reset v1.0
- Added basic structural layout templates
- Corrected mainmenu dropdown template
- Added rounded Corners to graphic objects
// CSS V.1.00 (01/02/2010)
- basic css template  created
--------------------------------------------------
           By Epoch Multimédia 2010
\************************************************/

/************************************************\
» RESET
\************************************************/

/* 
Eric Meyer's CSS reset v1.0 | 20080212 
http://meyerweb.com/eric/tools/css/reset/
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; }
body { line-height: 1; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
/* remember to define focus styles! */
:focus { outline: 0; }
/* remember to highlight inserts somehow! */
ins { text-decoration: none; }
del { text-decoration: line-through; }
/* tables still need 'cellspacing="0"' in the markup */
table { border-collapse: collapse; border-spacing: 0; }

/************************************************\
» GLOBAL PARAMETERS
\************************************************/

body,
html { 	height: 100%; }
body { background-color: #FFF; behavior: url("temas/clientside/csshover3.htc"); /* IE6 png fix */ text-align: center; }
img, 
div, 
input { behavior: url("temas/clientside/iepngfix.htc") } /* IE6 png fix */
a img { border: none }
p,
h1,
h2,
h3,
h4,
h5,
hr,
ul,
form,
fieldset,
table { clear: both; padding-bottom: 20px; }
ul { list-style: none;}
legend { display: none; }
fieldset { border: none }

/************************************************\
» TYPE
\************************************************/

/* Shared ****************************************/

body,
textarea,
input { font: 16px  "Trebuchet MS", Arial, Helvetica, sans-serif }

h1,
h2,
h3,
h4,
h5,
#header .featured_banner,
#header .mainmenu,
#footer { font-family: /*'Exo 2'*/'Open Sans', sans-serif;, "Trebuchet MS", Arial, Helvetica, sans-serif }

/* Colors ****************************************/

body,
.mainmenu a,
.mainmenu li:hover li a { color: #333 } /* DARK GRAY */
.gray,
.teaser .summary { color: #666 } /* MEDIUM GRAY */
#footer,
#footer a,
#footer a:hover,
#footer .mainmenu a:hover { color: #999 } /* LIGHT GRAY */
.error { color: #F00; } /* RED */
.confirm { color: #690; } /* GREEN */
a,
.green,
.content h2,
.mainmenu a:hover,
.mainmenu li:hover a,
.mainmenu a:hover,
.mainmenu li.selected a,
.mainmenu li:hover li a:hover { color: #81ad47 } /* ENTERPRISE GREEN */
.white,
.alert.error,
.alert.confirm,
input[type="submit"],
#home .teaser .img,
.defaultpage .teaser .img,
.defaultpage .mainmenu a,
#header .featured_banner .headlines { color: #FFF; } /* WHITE  */

/* Size ******************************************/

h1 { font-size: 28px }
h2 { font-size: 20px }
h3 { font-size: 18px }
h4 { font-size: 16px }
h5 { font-size: 14px }
#footer { font-size: 12px }
small,
.note { font-size: 11px; }

/* Variations ************************************/

#header .mainmenu a,
#header .featured_banner .headlines h2 { font-weight: bold }
a,
.teaser .content a:hover,
.teaser .sidebar  a:hover { text-decoration: none }
#footer a:hover,
.content a:hover,
.sidebar a:hover{ text-decoration: underline }
#header .featured_banner .headlines,
#header .mainmenu { text-transform: uppercase }
.text-center { text-align: center }
blockquote,
.italico { font-style: italic; }
a[target="_blank"]:before,
a[target="new"]:before { } /* links on new windows */

/************************************************\
» STRUCTURAL LAYOUT
\************************************************/

/* Main *****************************************/

#container,
.wrapper { margin: 0 auto; text-align: left; }
#header,
#footer { float: left; }
.wrapper { clear: both; }
.content { }
.sidebar { }
#footer { }

/* Fixed Width **********************************/

#container,
#container #header,
#container #footer { width: 100%; }

.wrapper { width: 940px; }

/* 2 Col (fixed) */

	#container .wrapper.twoCol .content { float: left; width: 600px; }
	#container .wrapper.twoCol .sidebar { float: right; width: 300px; }

	#container .wrapper.twoCol.samewidth .content,
	#container .wrapper.twoCol.samewidth .sidebar { width: 450px}
	
/* 3 Col (fixed) */

	#container .wrapper.threeCol .content { float: left; margin-right: 30px; width: 290px; }
	#container .wrapper.threeCol .sidebar { float: left; width: 300px; }

/************************************************\
» GRAPHIC LAYOUT
\************************************************/

/* Shared ***************************************/

/* Global */

body {}
#container { border-top: solid 4px #81ad47}
.defaultpage .content,
.defaultpage .sidebar { line-height: 1.6em }

/* Objects */

input[type="text"],
input[type="email"],
input[type="number"],
textarea,
select { border: solid 1px #CCC; }
input[type="submit"] { border: none; cursor: pointer; background-color: #619100; padding: 5px 8px; }
.btn { background: #CCC; display: block; float: left; padding: 6px 10px; }
a[target="_blank"]:before,
a[target="new"]:before { } /* links on new windows */
label { display: inline-block; }
hr { border: none; border-top: solid 1px #CCC; color: #FFF; }

/* Header ***************************************/

#header .wrapper { position: relative }
#header h1 { left: 0; position: absolute; top: 20px }
#header h1 a { background: url(../gfx/layout/logo-a4u-header.jpg) no-repeat; display: block; height: 66px; overflow: hidden; text-indent: -10000px; width: 160px;  }

#header .bg { background-color: #FFF; height: 105px; left: 0; position: absolute; top: 0; width: 100%; z-index: -10 }
.defaultpage #header .bg { background-color: #231F20; }
.defaultpage #header h1 a { background-image: url(../gfx/layout/logo-a4u-negative-header.jpg); }

/* Main Menu */
* html .mainmenu a:hover { visibility:visible } /* hack para IE6 */
#header .mainmenu { float: right; padding-bottom: 0; margin-right: 50px; z-index: 90; }
#header .mainmenu a { display: block; padding: 39px 20px; }
	#header .mainmenu a:hover, 
	#header .mainmenu li:hover { background-color: #EEE }
#header .mainmenu ul { list-style-type: none; }
#header .mainmenu li { float: left; margin: 0; position: relative; }
#header .mainmenu li ul { background: #F1F1F1; display: none; left: 0px; position: absolute; top: 90px; width: 200px; }
/* to override top and left in browsers other than IE, which will position to the top right of the containing li, rather than bottom left */
#header .mainmenu li>ul { top: 97px; left: 0px; width: 200px; }
#header .mainmenu li li { background: #F1F1F1; float: none; height: auto; margin: 0; width: 200px; }
#header .mainmenu li:hover ul, 
#header .mainmenu li.over ul { display: block; } /* lists nested under hovered list items */
#header .mainmenu li li:hover, 
#header .mainmenu li li.over { background-color: #CCC; }
#header .mainmenu li li a { padding: 8px 12px; height: auto; }

#header .flag { position: absolute; right: 0px; top: 45px; }
#header .flag li { float: left; position: relative }
#header .flag li a { display: block; height: 11px; width: 16px;  }
#header .flag li a img { position: absolute; top: 0; left: 0; }
#header .flag li a:hover img,
#header .flag li.selected a img { display: none; }
#header .flag li.pt a { background: url(../gfx/layout/icon-flagPT-color-s.png); margin-right: 10px; }
#header .flag li.en a { background: url(../gfx/layout/icon-flagEN-color-s.png); }

/* Global Content *******************************/

/* Wrapper */

.wrapper { }
.wrapper.xtrainfo { height: 35px; }
.wrapper.xtrainfo .sidebar { text-align: right; /* padding-bottom: 15px; */ }

/* Content */
.content { }
.content ul,
.sidebar ul { list-style: disc inside;  }
.content li,
.sidebar li { padding: 5px 0 }
.content li li,
.sidebar li li { list-style-type: circle }
.content ul.featured,
.sidebar ul.featured { list-style: none; margin-left: 0 } 
.content ul.featured li,
.sidebar ul.featured li { background: #FFF url(../gfx/layout/icon-arrow-to-right-s-slim.png) 20px center no-repeat; margin-bottom: 1px; padding: 5px 0 5px 60px }
ul.featured h1,
ul.featured h2,
ul.featured h3,
ul.featured h4,
ul.featured h5,
ul.featured p { margin-bottom: 0;}

/* teaser */
.teaser a { display: block; }
.teaser .img { background: #CCC; display: block; padding-bottom: 10px; text-align: center; width: 100%;  }
.teaser .img span { display: block; position: relative; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); }
.teaser .summary { background: url(../gfx/layout/icon-arrow-to-right-xxl-slim.jpg) right no-repeat; min-height: 72px; padding-right: 50px; }
.teaser .img { height: 137px; }

.defaultpage .teaser { padding-top: 30px;}
.defaultpage .teaser .img { height: 73px; padding-bottom: 0; margin-bottom: 20px }
.defaultpage .teaser .summary { display: none; }

.teaser .content.one .img { background: url(../gfx/content/xtrainfo-como_vemos_iluminacao.jpg) no-repeat }
.teaser .content.two .img { background: url(../gfx/content/xtrainfo-poupanca.jpg) no-repeat }
.teaser .sidebar.three .img { background: url(../gfx/content/xtrainfo-catalogo.jpg) no-repeat }

/* Sidebar */

.sidebar { }

/* Footer ***************************************/

#footer { border-top: solid 1px #CCC; margin-top: 10px; padding: 30px 0; }
#footer .content,
#footer .sidebar { margin-right: 20px !important; list-style: none; }
#footer .content ul,
#footer .sidebar ul { list-style: none; }
#footer .wrapper .content.one { width: 150px; }
	#footer .wrapper .content.one .logo { background: url(../gfx/layout/logo-a4u-footer.jpg) no-repeat; height: 50px; margin-bottom: 0; overflow: hidden; text-indent: -10000px; width: 102px }
#footer .wrapper .content.two { text-align: center; padding-top: 10px; width: 480px; }
	#footer .wrapper .content.two .social,
	#footer .wrapper .content.two .mainmenu { display: inline-block; }
	#footer .wrapper .content.two .social li,
	#footer .wrapper .content.two .mainmenu li { float: left; padding-right: 20px;  }
	#footer .wrapper .content.two .social { padding: 0 100px;}
		#footer .wrapper .content.two .social li a { display: block; overflow: hidden; text-indent: -1000px}
		#footer .wrapper .content.two .social li.fb a { background:url(../gfx/layout/icon-fb-gray-s.jpg) no-repeat; height: 19px; width:9px } 
		#footer .wrapper .content.two .social li.twitter a { background:url(../gfx/layout/icon-twitter-gray-s.jpg) no-repeat; height: 13px; width:19px } 
		#footer .wrapper .content.two .social li.in a { background:url(../gfx/layout/icon-linkedin-gray-s.jpg) no-repeat; height: 18px; width:19px } 
#footer .wrapper .sidebar.three { margin-right: 0 !important; padding: 10px; text-align: right; width: 240px; }

/************************************************\
» SPECIFIC PAGES
\************************************************/

/* Contactos ************************************/

.newsletter label { width: 50px; }

/* Produtos e Projectos *************************/

.content .temp { text-align: center; height: 412px; width: 940px; }
.content .temp h3 { position: relative; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); }
.content .temp.produtos { background: url(../gfx/content/produtos.jpg) no-repeat }
.content .temp.projetos { background: url(../gfx/content/projectos.jpg) no-repeat; line-height: 2.2em; }
.content .temp.projetos a { color: #99c37d; text-decoration: underline}
.content .temp.projetos a:hover { color: #FFF; }

.content .produtos ul { list-style: none; border-bottom: solid 1px #CCC; overflow: auto; }
.content .produtos li { float: left; width: 290px; margin-right: 30px; text-align: center; }
.content .produtos li img { opacity: 0.5;  -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; }
.content .produtos li h3 a:hover img,
.content .produtos li.catalogo-on h3 a img,
.content .produtos li.catalogo-on h3 a:active { opacity: 1;  -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; }
.content .produtos li:last-child  { margin-right: 0; }
.content .produtos li h3 { padding-bottom: 0 }

/************************************************\
» GRAPHIC EFFECTS
\************************************************/

/* Rounded corners ******************************/

.btn { -moz-background-clip:border; -moz-background-inline-policy:continuous; -moz-background-origin:padding; }
.btn { border-radius: 10px; -moz-border-radius: 10px; -khtml-border-radius: 10px; -webkit-border-radius: 10px; }
#null { border-top-left-radius: 10px; -moz-border-radius-topleft: 10px; -webkit-border-top-left-radius: 10px; }
#null { border-top-right-radius: 10px; -moz-border-radius-topright: 10px; -webkit-border-top-right-radius: 10px; }

/* Transparency *********************************/

.teaser a .summary,
#footer .wrapper .content.two .social li a { filter:alpha(opacity=70); -moz-opacity:0.7; -khtml-opacity: 0.7; opacity: 0.7; }
.teaser a:hover .summary,
#footer .wrapper .content.two .social li a:hover { filter:alpha(opacity=100); -moz-opacity:1; -khtml-opacity: 1; opacity: 1; }

/* Drop Shadows *********************************/

.btn { 
box-shadow: 0px 2px 3px #999; -moz-box-shadow: 0px 2px 3px #999; 
-webkit-box-shadow: 0px 2px 3px #999;
filter: progid:DXImageTransform.Microsoft.Shadow(Strength=2, Direction=155, Color='#999999'); /*--> For IE 5.5 - 7 */ 
-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=2, Direction=155, Color='#999999')"; /*--> For IE 8 */
}
.btn:hover { 
box-shadow: 0px 1px 3px #333; 
-moz-box-shadow: 0px 1px 3px #333; 
-webkit-box-shadow: 0px 1px 3px #333; 
filter: progid:DXImageTransform.Microsoft.Shadow(Strength=2, Direction=155, Color='#333333'); /*--> For IE 5.5 - 7 */ 
-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=2, Direction=155, Color='#333333')"; /*--> For IE 8 */ 
}

/* Transparency box *****************************/

#null {
background: rgb(0, 0, 0); /*--> Fallback for web browsers that doesn't support RGBa */
background: rgba(0, 0, 0, 0.6); /*--> RGBa with 0.6 opacity */
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000); /*--> For IE 5.5 - 7*/
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000)"; /*--> For IE 8*/
}

/* Text Shadows *********************************/

.temp .white { text-shadow: 2px 2px 6px #000; /* filter: dropshadow(color=#FFFFFF,offX=0,offY=1);  Though it works with IE, it conflits with other parameters... BEWARE! */ }
.teaser .img span { text-shadow: 1px 1px 4px #000; /* filter: dropshadow(color=#FFFFFF,offX=0,offY=1);  Though it works with IE, it conflits with other parameters... BEWARE! */ }

/************************************************\
» NOTIFICATIONS
\************************************************/

.alert { padding: 5px 8px; }
.alert.error { background-color: #F00}
.alert.confirm { background-color: #9C0}

/************************************************\
» VARIATIONS	
\************************************************/

.hide { display: none }
.R { float: right; }
.L { float: left; }
.bloc { display: block; padding: 20px 20px 1px 20px;; margin-bottom: 20px; }

/* largura de colunas prédefinidas */
.colS { width: 30% } 
.colM { width: 49% } /* IE... */
.colL { width: 70% }
.colXL { width: 100% }

/* graphic */
.bottom-border { border-bottom: solid 1px #CCC; margin-bottom: 20px; padding-bottom: 20px; }
.top-border { border-top: solid 1px #CCC; padding-top: 20px; }
.left-border { border-left: solid 1px #CCC; padding-left: 30px }
.right-border { border-right: solid 1px #CCC; padding-right: 15px; }
.light-featured { background-color: #EEE }

/************************************************\
» API's CSS
\************************************************/

/* unslider */
#header .featured_banner { background-color: #000; margin: 0 0 20px 0; padding: 0; overflow: auto; position: relative; width: 100%; z-index: -1;}
#header .featured_banner ul { width: 101%;}
#header .featured_banner li { background-size: 100%; list-style: none;  width: 100%; }
#header .featured_banner ul li { float: left; }
#header .featured_banner .headlines { border-top: dotted 1px #FFF; border-bottom: dotted 1px #FFF; margin: 70px auto; padding: 50px 0 40px 0; position: relative; text-align: center; width: 360px }
#header .featured_banner .headlines.energia {}
#header .featured_banner .headlines.futuro {}
#header .featured_banner .headlines.poupanca {}
#header .featured_banner .headlines h1 { position: relative; top: auto; left:auto;}
#header .featured_banner .headlines h1 { font-size: 50px; font-weight: normal; padding-bottom: 10px; line-height: 1.2em; }
#header .featured_banner .headlines h2 { font-size: 22px; font-weight: normal; padding-bottom: 10px; line-height: 1.2em; }
#header .featured_banner li { height: 400px; }
.defaultpage #header .featured_banner .headlines { display: none }
.defaultpage #header .featured_banner li { height:80px } 

/* Google maps */
#header .googlemap { background-color: #F1F1F1; height:400px; margin: 0 0 20px 0; padding: 0; overflow: hidden; width: 100%;}