/*
* 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.
*/
/* ==========================================================================
Base styles: opinionated defaults
========================================================================== */
html,
button,
input,
select,
textarea {
color: #222;
}
body {
font-size: 1em;
line-height: 1.4;
}
/*
* Remove text-shadow in selection highlight: h5bp.com/i
* These selection declarations have to be separate.
* Customize the background color to match your design.
*/
::-moz-selection {
background: #b3d4fc;
text-shadow: none;
}
::selection {
background: #b3d4fc;
text-shadow: none;
}
/*
* A better looking default horizontal rule
*/
hr {
display: block;
height: 1px;
border: 0;
border-top: 1px solid #ccc;
margin: 1em 0;
padding: 0;
}
/*
* Remove the gap between images and the bottom of their containers: h5bp.com/i/440
*/
img {
vertical-align: middle;
}
/*
* Remove default fieldset styles.
*/
fieldset {
border: 0;
margin: 0;
padding: 0;
}
/*
* Allow only vertical resizing of textareas.
*/
textarea {
resize: vertical;
}
/* ==========================================================================
Chrome Frame prompt
========================================================================== */
.chromeframe {
margin: 0;
background: Red url(../_img/ico_warning.png) 5px no-repeat;
color: #FFFFFF;
padding: 8px 8px 8px 24px;
position: fixed;
top: 0px;
left: 0px;
display: block;
width: 100%;
z-index: 999;
opacity: 0.8;
font-size: 11px;
}
.chromeframe a {
color: #FFFFFF;
text-decoration: underline;
}
/* ==========================================================================
Author's custom styles
========================================================================== */
#seefullclose {
position: absolute;
right: -15px;
top: -15px;
width: 22px;
height: 22px;
background: #FFFFFF;
border-radius: 50px 50px 50px 0px;
color: #333333;
font-weight: bold;
text-decoration: none;
border: 2px solid #333333;
}
#seefullclose span {
display: block;
margin: 3px 0px 0px 7px;
font-size: 11px;
text-shadow: 0px 0px 1px #333333;
}
#pagination {
list-style-type: none;
height: 29px;
padding: 2px;
margin: 20px 0;
}
#pagination li {
float: right;
display: inline;
margin: 0px 2px 0px 0px;
}
#pagination li a {
padding: 6px 12px 6px 12px;
border: 1px solid #AAAAAA;
color: #333333;
background: #fefcea;
background: -moz-linear-gradient(top, #fefcea 0%, #eeeeee 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fefcea), color-stop(100%,#eeeeee));
background: -webkit-linear-gradient(top, #fefcea 0%,#eeeeee 100%);
background: -o-linear-gradient(top, #fefcea 0%,#eeeeee 100%);
background: -ms-linear-gradient(top, #fefcea 0%,#eeeeee 100%);
background: linear-gradient(to bottom, #fefcea 0%,#eeeeee 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fefcea', endColorstr='#eeeeee',GradientType=0 );
border-radius: 2px;
}
#pagination li a:hover {
background: #eeeeee;
background: -moz-linear-gradient(top, #eeeeee 0%, #ffffff 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#eeeeee), color-stop(100%,#ffffff));
background: -webkit-linear-gradient(top, #eeeeee 0%,#ffffff 100%);
background: -o-linear-gradient(top, #eeeeee 0%,#ffffff 100%);
background: -ms-linear-gradient(top, #eeeeee 0%,#ffffff 100%);
background: linear-gradient(to bottom, #eeeeee 0%,#ffffff 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee', endColorstr='#ffffff',GradientType=0 );
}
#pagination li a.active {
background: none !important;
border: 0px !important;
cursor: default !important;
}
p.formP {
width: 366px;
clear: right;
padding: 5px 0px 5px 0px;
}
p.formP span {
float: right;
display: block;
margin: 5px 4px 0px 0px;
}
p.formP input, textarea
{
float: right;
}
p.formP textarea,
p.formP input[type=text],
p.formP input[type=password] {
width: 200px;
padding: 5px;
font-size: 12px;
border-radius: 3px;
border: 1px solid #AAAAAA;
outline: 0;
resize: none;
background-color: #CCEAF2;
margin-bottom: 5px;
}
p.formP textarea:focus,
p.formP input:focus {
background: #E3FFFF;
}
a.genericButton {
padding: 7px 8px 6px 28px !important;
color: #888 !important;
border: 1px solid #AAA;
text-decoration: none;
font-size: 11px;
border-radius: 3px;
display: inline-block;
position: relative;
background: white;
background: -moz-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(238, 238, 238, 1) 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255, 255, 255, 1)), color-stop(100%,rgba(238, 238, 238, 1)));
background: -webkit-linear-gradient(top, rgba(255, 255, 255, 1) 0%,rgba(238, 238, 238, 1) 100%);
background: -o-linear-gradient(top, rgba(255, 255, 255, 1) 0%,rgba(238, 238, 238, 1) 100%);
background: -ms-linear-gradient(top, rgba(255, 255, 255, 1) 0%,rgba(238, 238, 238, 1) 100%);
background: linear-gradient(to bottom, rgba(255, 255, 255, 1) 0%,rgba(238, 238, 238, 1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#eeeeee',GradientType=0 );
}
a.genericButton strong {
display: block;
width: 12px;
height: 12px;
position: absolute;
left: 10px;
top: 8px;
text-indent: -6666px;
}
a.genericButton strong.mail {
background: url(../_img/ico_metaphor_mail.png) center no-repeat;
}
a.genericButton:hover {
background: rgb(238,238,238) !important;
background: -moz-linear-gradient(top, rgba(238,238,238,1) 0%, rgba(255,255,255,1) 100%) !important;
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(238,238,238,1)), color-stop(100%,rgba(255,255,255,1))) !important;
background: -webkit-linear-gradient(top, rgba(238,238,238,1) 0%,rgba(255,255,255,1) 100%) !important;
background: -o-linear-gradient(top, rgba(238,238,238,1) 0%,rgba(255,255,255,1) 100%) !important;
background: -ms-linear-gradient(top, rgba(238,238,238,1) 0%,rgba(255,255,255,1) 100%) !important;
background: linear-gradient(to bottom, rgba(238,238,238,1) 0%,rgba(255,255,255,1) 100%) !important;
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee', endColorstr='#ffffff',GradientType=0 ) !important;
color: #888 !important;
}
a.genericButton span {
position: absolute !important;
left: 0px;
top: 0px;
display: block;
width: 100% !important;
height: 100% !important;
background: #FFFFFF;
text-indent: -6666px;
opacity: 0.0;
background: #FFFFFF url(../_img/loader_rec.gif) center no-repeat;
border-radius: 3px;
}
.globalMessage {
width: 250px;
color: #FFFFFF;
border-radius: 5px;
position: fixed;
right: 5px;
top: -300px;
opacity: 0;
}
.globalMessage div {
padding: 25px;
position: relative;
}
.globalMessage div p {
color: #FFFFFF;
padding: 0px;
font-size: 11px;
}
.globalMessage div a {
display: block;
width: 16px;
height: 16px;
color: #FFFFFF;
font-weight: bold;
text-align: center;
vertical-align: middle;
background: #333333;
border-top-right-radius: 5px;
border-bottom-left-radius: 5px;
position: absolute;
padding: 4px;
top: 0px;
right: 0px;
text-transform: uppercase;
text-decoration: none;
}
.gbnormal {
background: #a4b357;
background: -moz-linear-gradient(-45deg, #a4b357 0%, #75890c 100%);
background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#a4b357), color-stop(100%,#75890c));
background: -webkit-linear-gradient(-45deg, #a4b357 0%,#75890c 100%);
background: -o-linear-gradient(-45deg, #a4b357 0%,#75890c 100%);
background: -ms-linear-gradient(-45deg, #a4b357 0%,#75890c 100%);
background: linear-gradient(135deg, #a4b357 0%,#75890c 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a4b357', endColorstr='#75890c',GradientType=1 );
}
.gberrno {
background: #a90329;
background: -moz-linear-gradient(-45deg, #a90329 0%, #8f0222 44%, #6d0019 100%);
background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#a90329), color-stop(44%,#8f0222), color-stop(100%,#6d0019));
background: -webkit-linear-gradient(-45deg, #a90329 0%,#8f0222 44%,#6d0019 100%);
background: -o-linear-gradient(-45deg, #a90329 0%,#8f0222 44%,#6d0019 100%);
background: -ms-linear-gradient(-45deg, #a90329 0%,#8f0222 44%,#6d0019 100%);
background: linear-gradient(135deg, #a90329 0%,#8f0222 44%,#6d0019 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a90329', endColorstr='#6d0019',GradientType=1 );
}
/*
* ------------------------------
* Marcador:
* ------------------------------
*/
div#masterContainer {
width: 1024px;
min-height: 700px;
margin: 20px auto;
}
div#masterContainer .noLink {
text-decoration: none;
outline: none;
}
div#masterContainer .occult {
display: none;
visibility: hidden;
}
div#masterContainer div#column-left {
width: 300px;
float: left;
}
div#masterContainer div#column-right {
width: 714px;
float: right;
}
div#masterContainer div#column-right div#background-right{
position: absolute;
width: 714px;
height: 0;
z-index: -1;
background: #7c084f; /* Old browsers */
background: -moz-linear-gradient(top, #7c084f 14%, #bd218e 45%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(14%,#7c084f), color-stop(45%,#bd218e)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #7c084f 14%,#bd218e 45%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #7c084f 14%,#bd218e 45%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #7c084f 14%,#bd218e 45%); /* IE10+ */
background: linear-gradient(to bottom, #7c084f 14%,#bd218e 45%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7c084f', endColorstr='#bd218e',GradientType=0 ); /* IE6-9 */
}
div#masterContainer div#column-right div#background-right span {
position: absolute;
display: block;
width: 650px;
height: 700px;
}
div#masterContainer div#column-right div#background-right span.sp1 {
background: url('../_img/fundos.jpg') no-repeat 0 0;
z-index: 2;
}
div#masterContainer div#column-right div#background-right span.sp2 {
background: url('../_img/fundos.jpg') no-repeat 0 -700px;
z-index: 1;
}
div#masterContainer div#column-left ul {
list-style-type: none;
padding: 0;
margin: 0;
}
div#masterContainer div#column-left div.separador {
margin: 10px 0;
background: url('../_img/main.jpg') no-repeat 0 -233px;
height: 30px;
}
div#masterContainer div#column-left div#photo {
width: 100%;
height: 153px;
background: url('../_img/main.jpg') no-repeat 0 0;
}
div#masterContainer div#column-left div#menu {
text-align: right;
margin: 30px 30px 0 0;
font-family: Arial, Helvetica, sans-serif;
font-size: 15px;
font-weight: bold;
}
div#masterContainer div#column-left div#menu ul li a{
color: #BD1C8D;
}
div#masterContainer div#column-left div#menu ul li a span{
font-weight: normal;
color: #B3B3B3;
}
div#masterContainer div#column-left div#menu ul li a.active,
div#masterContainer div#column-left div#menu ul li a:hover{
color: #DB73C1;
}
div#masterContainer div#column-left div#sub-menu {
text-align: right;
margin-right: 30px;
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
font-weight: bold;
}
div#masterContainer div#column-left div#sub-menu ul li a{
color: #999;
}
div#masterContainer div#column-left div#menu ul li a span{
font-weight: normal;
color: #B3B3B3;
}
div#masterContainer div#column-left div#sub-menu ul li a.active,
div#masterContainer div#column-left div#sub-menu ul li a:hover{
color: #CCC;
}
div#masterContainer div#column-left div#text {
font-family: Tahoma, sans-serif;
font-size: 22px;
margin-top: 80px;
margin-right: 30px;
color: #D3D3D3;
text-align: right;
}
div#masterContainer div#column-left div#text p {
margin: 0;
}
div#masterContainer div#column-left div#logo span.l1{
margin-right: 30px;
display: block;
float: right;
width: 62px;
height: 61px;
background: url('../_img/main.jpg') no-repeat -64px -158px;
}
div#masterContainer div#column-left div#logo span.l2{
margin-left: 50px;
display: block;
float: left;
width: 52px;
height: 61px;
background: url('../_img/main.jpg') no-repeat -7px -158px;
}
div#masterContainer div#column-right div#header {
background: url('../_img/topo.png') no-repeat 0 0;
height: 152px;
margin-left:15px;
position: relative;
border-bottom: 1px solid #5C294B;
}
div#masterContainer div#column-right div#header div {
position: absolute;
color: #FFF;
}
div#masterContainer div#column-right div#header div.dir {
font-weight: bold;
font-size: 11px;
top: 120px;
}
div#masterContainer div#column-right div#header div.dir p {
margin: 0;
padding: 0;
}
div#masterContainer div#column-right div#header div.dir span {
font-weight: normal;
}
div#masterContainer div#column-right div#header div.marcacao {
font-weight: bold;
top: 40px;
right: 25px;
}
div#masterContainer div#column-right div#header div.marcacao a {
color: #FFF;
text-decoration: none;
}
div#masterContainer div#column-right div#header div.links {
right: 0;
bottom: 10px;
}
div#masterContainer div#column-right div#header div.links a {
display: inline-block;
width: 36px;
height: 36px;
}
div#masterContainer div#masterFooter {
border-top: 1px solid #5C294B;
color: #FFF;
margin-left: 15px;
padding-top: 10px;
position: relative;
}
div#masterContainer div#masterFooter p {
padding: 0;
margin: 0;
font-size: 11px;
}
div#masterContainer div#masterFooter div#creditos {
color: #FFF;
font-size: 9px;
position: absolute;
top: 10px;
right: 0;
}
div#masterContainer div#masterFooter div#creditos a {
display: inline-block;
width: 98px;
height: 14px;
background: url('../_img/logo_ie.png') no-repeat 0 0;
position: relative;
top: 5px;
}
div#masterContainer div#content {
min-height: 525px;
margin-left: 15px;
padding-top: 20px;
}
div#masterContainer div#content div.content-title {
font-size: 30px;
color: #FFF;
}
div#masterContainer div#content div#home {
position: relative;
}
div#masterContainer div#content div#home ul {
list-style-type: none;
padding: 0;
margin: 0;
}
div#masterContainer div#content div#home li {
float: left;
text-align: center;
}
div#masterContainer div#content div#home li a {
margin-right: 30px;
padding: 4px;
color: #F363C1;
}
div#masterContainer div#content div#home li a.li-last {
margin-right: 0;
}
div#masterContainer div#content div#home li a:hover {
background-color: #622B45;
/* Fallback for web browsers that doesn't support RGBa */
background: rgb(255, 255, 255 );
/* RGBa with 0.6 opacity */
background: rgba(255, 255, 255, 0.15 );
}
div#masterContainer div#content div#home div#text {
position: absolute;
top: 110px;
left: 90px;
color: #0FF;
font-size: 20px;
}
div#masterContainer div#content div#home div#text span {
opacity: 0;
position: relative;
}
div#masterContainer div#content div#home div#text span.t1 {
display: block;
font-size: 25px;
}
div#masterContainer div#content div#home div#text span.t2 {
margin-left: 50px;
}
div#masterContainer div#content div#home div#text span.t3 {
right: 50px;
top: 25px;
}
div#masterContainer div#content div#home div#text span.t4 {
width: 230px;
display: block;
color: #FFF;
top: 90px;
left: 300px;
background: url('../_img/seta.png') no-repeat right;
}
div#masterContainer div#content div#unidades {
color: #FFF;
font-size: 13px;
}
div#masterContainer div#content div.sub-title {
font-weight: bold;
font-size: 15px;
padding: 10px 0 50px 0;
}
div#masterContainer div#content div#unidades p.texto-titulo {
color: #D588BF;
margin-top: 0;
padding-top: 0;
}
div#masterContainer div#content div#unidades div#photo{
float: left;
width: 325px;
height: 236px;
overflow: hidden;
}
div#masterContainer div#content div#unidades div#menu{
float: left;
width: 100px;
margin-left: 25px;
}
div#masterContainer div#content div#unidades div#menu ul{
list-style-type: none;
padding: 0;
margin: 0;
}
div#masterContainer div#content div#unidades div#menu ul li {
padding: 2px 0;
}
div#masterContainer div#content div#unidades div#menu ul a {
display: block;
color: #FFF;
padding: 1px;
}
div#masterContainer div#content div#unidades div#menu ul a.active,
div#masterContainer div#content div#unidades div#menu ul a:hover {
background-color: #622B45;
/* Fallback for web browsers that doesn't support RGBa */
background: rgb(255, 255, 255 );
/* RGBa with 0.6 opacity */
background: rgba(255, 255, 255, 0.4 );
}
div#masterContainer div#content div#unidades div#unidades-container div#texto {
float: right;
width: 200px;
}
div#masterContainer div#content div#unidades div#servicos-container p {
margin-top: 40px;
margin-left: 20px;
padding-left: 115px;
height: 70px;
}
div#masterContainer div#content div#unidades div#servicos-container p span {
display: block;
padding-bottom: 5px;
font-weight: bold;
color: #33FFFF;
}
div#masterContainer div#content div#unidades div#servicos-container p.analises {
background: url('../_img/icones.png') no-repeat 0 0;
}
div#masterContainer div#content div#unidades div#servicos-container p.agua {
background: url('../_img/icones.png') no-repeat 0 -70px;
}
div#masterContainer div#content div#unidades div#servicos-container p.entidade {
background: url('../_img/icones.png') no-repeat 0 -140px;
}
div#masterContainer div#content div#unidades div#servicos-container p.domicilio {
background: url('../_img/icones.png') no-repeat 0 -210px;
}
div#masterContainer div#content div#unidades div#localizacao-container div#photo {
width: 508px;
height: 260px;
float: left;
position: relative;
}
div#masterContainer div#content div#unidades div#localizacao-container div#photo img {
position: absolute;
bottom: 5px;
right: 5px;
}
div#masterContainer div#content div#unidades div#localizacao-container div#photo a {
position: absolute;
display: block;
width: 100%;
height: 100%;
}
div#masterContainer div#content div#unidades div#localizacao-container .satao {
background: url('../_img/mapas.jpg') no-repeat 0 0px;
}
div#masterContainer div#content div#unidades div#localizacao-container .sernancelhe {
background: url('../_img/mapas.jpg') no-repeat 0 -260px;
}
div#masterContainer div#content div#unidades div#localizacao-container .torredeita {
background: url('../_img/mapas.jpg') no-repeat 0 -520px;
}
div#masterContainer div#content div#unidades div#localizacao-container .vilanova {
background: url('../_img/mapas.jpg') no-repeat 0 -780px;
}
div#masterContainer div#content div#unidades div#localizacao-container .penedono {
background: url('../_img/mapas.jpg') no-repeat 0 -1040px;
}
div#masterContainer div#content div#unidades div#localizacao-container .aguiar {
background: url('../_img/mapas.jpg') no-repeat 0 -1300px;
}
div#masterContainer div#content div#unidades div#localizacao-container .viseu {
background: url('../_img/mapas.jpg') no-repeat 0 -1560px;
}
div#masterContainer div#content div#unidades div#localizacao-container .repeses {
background: url('../_img/mapas.jpg') no-repeat 0 -1820px;
}
div#masterContainer div#content div#unidades div#lab-container {
padding-top: 50px;
}
div#masterContainer div#content div#unidades div#lab-container div#photo {
padding-right: 30px;
padding-bottom: 30px;
}
div#masterContainer div#content div#unidades div#lab-container p:first-child {
margin: 0;
}
div#masterContainer div#content div#contactos-container {
color: #FFF;
font-size: 13px;
padding-top: 20px;
}
div#masterContainer div#content div#contactos-container span {
display: block;
color: #66FFFF;
font-weight: bold;
font-size: 14px;
padding-bottom: 5px;
}
div#masterContainer div#content div#contactos-container p {
margin-top: 0;
height: 50px;
border-bottom: 1px dashed #E443B4;
}
div#masterContainer div#content div#contactos-container div#texto-esquerda {
float: left;
width: 460px;
}
div#masterContainer div#content div#contactos-container div#texto-esquerda p:last-child {
border: none;
}
div#masterContainer div#content div#contactos-container div#texto-direita {
float: right;
width: 205px;
font-size: 20px;
}
div#masterContainer div#content div#contactos-container div#texto-direita a {
font-size: 20px;
color: #FFF;
text-decoration: none;
}
div#masterContainer div#content div#contactos-container div#texto-direita p:first-child {
padding-bottom: 30px;
}
div#masterContainer div#content div#contactos-container div#texto-direita p:last-child {
border: none;
}
div#masterContainer div#content div#contactos-container div#texto-direita p {
padding-bottom: 15px;
}
div#masterContainer div#content div#contactos-container div#texto-direita span.sub-title {
color: #FF6699;
}
div#masterContainer div#content div#politica-container {
color: #FFF;
font-size: 13px;
padding-top: 25px;
}
div#masterContainer div#content div#estrutura-container {
width: 585px;
height: 429px;
margin: 25px auto 0 auto;
}
div#masterContainer div#content form#form {
width: 425px;
}
div#masterContainer div#content form#form label {
color: #FFF;
width: 90px;
display: inline-block;
}
div#masterContainer div#content form#form textarea,
div#masterContainer div#content form#form input[type="text"] {
width: 322px;
padding: 5px;
outline: 0;
border: 1px solid #E23FB1;
background-color: #E23FB1;
resize: none;
color: #FFF;
font-size: 11px;
}
div#masterContainer div#content form#form textarea:focus,
div#masterContainer div#content form#form input[type="text"]:focus {
border-color: #3FF;
}
div#masterContainer div#content form#form p#submit a {
outline: none;
background: url('../_img/email.png') no-repeat 0 center;
padding: 5px 5px 5px 20px;
color: #FFF;
text-decoration: none;
float: right;
}
div#masterContainer div#content form#form p#submit span {
display: block;
width: 43px;
height: 32px;
background: url('../_img/loader.gif') no-repeat 0 center;
float: right;
display: none;
}
/*
* ------------------------------
* Marcador:
* ------------------------------
*/
.cl {
clear: both;
padding: 0px;
margin: 0px;
height: 0px;
}
div.errorBubbleMessage {
background: #FF4444;
position: absolute;
padding: 0px;
font-size: 9px;
color: #FFFFFF !important;
border-radius: 3px;
opacity: 0.8;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
font-family: Arial, Helvetica, sans-serif;
z-index: 1000;
}
div.errorBubbleMessage div {
position: relative;
padding: 4px;
}
div.errorBubbleMessage div span {
width: 9px;
height: 5px;
display: block;
position: absolute;
left: 8px;
bottom: -5px;
background: url(../_img/errorBubbleMessageTip.png) 0px 0px no-repeat;
text-indent: -6666px;
}
.popupBubble {
border: 1px solid #CCCCCC;
width: 200px;
font-size: 11px;
color: #777777;
background: #FFFFFF;
box-shadow: 0px 0px 3px #CCCCCC;
position: absolute;
border-radius: 3px;
}
.popupBubble div {
position: relative;
padding: 10px;
}
.popupBubble div span {
display: block;
width: 11px;
height: 8px;
background: url(../_img/bk_bubble_tip.png) 0px 0px no-repeat;
position: absolute;
right: 50px;
bottom: -7px;
text-indent: -6666px;
}
.popupBubble div a {
position: absolute;
top: 0px;
right: 0px;
width: 16px;
height: 16px;
background: #CCCCCC url(../_img/bk_white_cross.png) 4px 4px no-repeat;
border-top-right-radius: 2px;
border-bottom-left-radius: 2px;
text-indent: -6666px;
}
/* ==========================================================================
Helper classes
========================================================================== */
/*
* Image replacement
*/
.ir {
background-color: transparent;
border: 0;
overflow: hidden;
/* IE 6/7 fallback */
*text-indent: -9999px;
}
.ir:before {
content: "";
display: block;
width: 0;
height: 100%;
}
/*
* 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;
}
/*
* Clearfix: contain floats
*
* For modern browsers
* 1. The space content is one way to avoid an Opera bug when the
* `contenteditable` attribute is included anywhere else in the document.
* Otherwise it causes space to appear at the top and bottom of elements
* that receive the `clearfix` class.
* 2. The use of `table` rather than `block` is only necessary if using
* `:before` to contain the top-margins of child elements.
*/
.clearfix:before,
.clearfix:after {
content: " "; /* 1 */
display: table; /* 2 */
}
.clearfix:after {
clear: both;
}
/*
* For IE 6/7 only
* Include this rule to trigger hasLayout and contain floats.
*/
.clearfix {
*zoom: 1;
}
/* ==========================================================================
EXAMPLE Media Queries for Responsive Design.
Theses examples override the primary ('mobile first') styles.
Modify as content requires.
========================================================================== */
@media only screen and (min-width: 35em) {
/* Style adjustments for viewports that meet the condition */
}
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 144dpi) {
/* Style adjustments for high resolution devices */
}
/* ==========================================================================
Print styles.
Inlined to avoid required HTTP connection: h5bp.com/r
========================================================================== */
@media print {
* {
background: transparent !important;
color: #000 !important; /* Black prints faster: h5bp.com/s */
box-shadow:none !important;
text-shadow: none !important;
}
a,
a:visited {
text-decoration: underline;
}
a[href]:after {
content: " (" attr(href) ")";
}
abbr[title]:after {
content: " (" attr(title) ")";
}
/*
* Don't show links for images, or javascript/internal links
*/
.ir a:after,
a[href^="javascript:"]:after,
a[href^="#"]:after {
content: "";
}
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;
}
}