/* EUMETSAT UFA Layout CSS - designed by Phil Nolan of Rational Systems in September 2013 Designed for use with the 960 Grid System. Learn more ~ http://960.gs/ Licensed under GPL and MIT. */ /* -------------------------------------------- Layout Sections ----------------------------------------------- */ body {padding:0px 0px 40px 0px;color: #122632;background: #112632;border-top:5px solid #000;} #branding {height: 70px;max-height: 90px;padding:10px 1em 10px 0px;text-align:right;background:#fff url("../../img/jpg_bg_head.jpg") left center no-repeat;margin-bottom:0;} .box {padding: 10px 10px 10px 0px;background-color: #fff;margin-bottom: 20px; overflow: auto;} .boxnp p {padding: 0 !important; } .block {padding-bottom: 0px;padding-top: 10px;overflow: auto; } .block-noheader {padding-bottom:0px;padding-top:0px;} .block-gallery {padding-bottom:10px;padding-top:0px;} .block-noheader p {margin-top:1em;margin-bottom:1em;} div.menu {padding:0;} div.menu h2 {margin:0;} div.menu .block {padding-top:0;} ul.blue {list-style-image: url(../../img/ico_bullet_blue.gif); } #content ul,#content ol {margin-top:1em;margin-bottom:1em;} #content ol.indent {margin-top:1em;margin-bottom:1em;margin-left:1em;} #title {min-height:60px; height:auto !important; color: white; margin-bottom: 20px; margin-top: 20px; background:#00a2dd url(../../img/Bannerbg_w940.jpg) left center no-repeat; font-style: normal; padding-right: .5em;} #title div {margin:14px 0 7px 0; line-height: 30px; font-size: 24px;padding:0 20px 0 10px; color: white; vertical-align: middle; font-family: NettoWeb, NettoOTRegular, Arial, sans-serif; text-transform: uppercase; display: inline-block; background-color: #334d7c; text-align:left; filter:alpha(opacity=90); -moz-opacity:0.9; -khtml-opacity: 0.9; opacity: 0.9;} #title div.subhead{margin:14px 0 7px -3px; line-height: 14px; font-size: 12px; font-weight:600; padding:1px 20px 1px 5px; color: #00a2dd; vertical-align: middle; font-family: NettoWeb, NettoOTRegular, Arial, sans-serif; text-transform: uppercase; display: inline-block; background-color: #fff; text-align:left; filter:alpha(opacity=90); -moz-opacity:0.9; -khtml-opacity: 0.9; opacity: 0.9;} /* -------------------------------------------- Headings ----------------------------------------------- */ h1 {color: #00205B;font-family: NettoWeb, NettoOTRegular, Tahoma, sans-serif;font-style: normal;font-weight: normal;font-size: 1.2em;line-height: 1em;margin-top: -2px;} h2 {margin: 2px 2px 2px 10px;color: #968c83;} .box h1 {padding-left:10px;padding-bottom:10px; } .box h2 {display:block;margin:-10px -10px 0px 0px;padding:2px 10px 2px 10px;border-bottom-color:#e0e5e9;border-bottom-width:1px;border-bottom-style:solid;color:#fff;background:#334d7c;} .box h2 a {display:block;color:#fff;} .box h2 a.hidden {margin:-2px -10px -2px -10px;padding:2px 20px 2px 30px;background-position:10px 45%;background-repeat:no-repeat;background-image:url(../../img/switch_plus.gif);} .box h2 a.visible {margin:-2px -10px -2px -10px;padding:2px 20px 2px 30px;background-position:10px 45%;background-repeat:no-repeat;background-image:url(../../img/switch_minus.gif);} .box h2 a.hidden:hover,.box h2 a.visible:hover {cursor:pointer;margin:-2px -10px -2px -10px;padding:2px 20px 2px 30px;background-color:#00b5e2;-webkit-transition: all 0.1s ease-in-out;-moz-transition: all 0.1s ease-in-out;-o-transition: all 0.1s ease-in-out;transition: all 0.1s ease-in-out;} #content h2 {margin:2px 0px 2px 0px;background-color:white;color:#968c83;border:0;} h3 {padding: 2px 2px 2px 10px;color:white;display:block;background-color:#00a2dd;font-weight: bold;} h3 a {color: #fcd216 !important;} h4 { margin: 2px 2px 2px 10px; display: block; font-weight: bold; color: #00a2dd; } h4.left { margin: 2px 2px 2px 0; } h5 {margin: 2px 2px 2px 10px;font-weight:bold;display:block;color:#00a2dd;} h6 {margin: 2px 2px 2px 10px;font-weight:bold;color:#00a2dd;} /*h7 {margin: 2px 2px 2px 0px;font-weight:bold;color:#00a2dd;} h8 {margin:2px 2px 2px 0px;font-weight:bold;color:#00a2dd;}*/ /* -------------------------------------------- Anchors ----------------------------------------------- */ a {color: #00a2dd;font-weight: bold;text-decoration: none;} a:hover {font-weight: bold;text-decoration: none;} p a:hover,#content a:hover,#branding a:hover {color: #00b5e2;text-decoration: underline;} .block a, #content a {padding-left: 9px;background-position: left 50%;background-repeat: no-repeat;background-image: url(../../img/ico_link_blu.gif);color: #00a2dd;font-weight: bold;} #branding a {text-transform: uppercase;padding-left: 9px;background-position: left 50%;background-repeat: no-repeat;background-image: url(../../img/ico_link_blu.gif);color: #00a2dd;font-weight: bold;} fieldset a {background-image:none;} /* -------------------------------------------- Images ----------------------------------------------- */ a.thumbnail-left,a.thumbnail-left2url,a.thumbnail-left2inline,a.fb-multimedia,a.image-imggal {background-color: white;background-image:none;margin: 3px 10px 3px 10px;padding:4px;float: left;border:1px solid #eef2f4;} a.thumbnail-left img,a.thumbnail-left2url img,a.thumbnail-left2inline img,a.fb-multimedia img {z-index: 0;float: left;} a.image-imggal img {width: 75px;height: 75px;z-index: 0;float: left;} a.thumbnail-left span,a.thumbnail-left2url span,a.thumbnail-left2inline span, a.thumbnail-right span,a.thumbnail-right2url span,a.thumbnail-right2inline span,a.fb-multimedia span,a.image-imggal span {position: absolute;display: block;width: 20px;height: 20px;background-image: url(../../img/ico_expand-img.png);background-position: left top;background-repeat: no-repeat;} a.thumbnail-right,a.thumbnail-right2url,a.thumbnail-right2inline {background-color: white;background-image: none;margin: 3px 10px 3px 10px;padding:4px;float: right;border:1px solid #00a2dd;} a.thumbnail-left:hover,a.thumbnail-left2url:hover,a.thumbnail-left2inline:hover,a.fb-multimedia:hover,a.image-imggal:hover,a.thumbnail-right:hover,a.thumbnail-right2url:hover,a.thumbnail-right2inline:hover {color: #122632;background-color: #7fdcf1;border:1px solid #968c83;-webkit-box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.3);-moz-box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.3);box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.3);filter:progid:DXImageTransform.Microsoft.dropshadow(OffX=5, OffY=5,Color='gray');-ms-filter:"progid:DXImageTransform.Microsoft.dropshadow(OffX=5,OffY=5, Color='gray')";} a.thumbnail-right img,a.thumbnail-right2url img,a.thumbnail-right2inline img {float:right;} .image-left {background-color: white;margin: 3px 10px 3px 10px;padding:4px;float:left;border:1px solid #e0e5e9;} .image-left img {float:left;} .image-right {background-color: white;margin:3px 0px 3px 10px;padding:4px;float:right;border:1px solid #e0e5e9;} .image-right img {float:right;} /* -------------------------------------------- Default paragraphs, quotes and lists ----------------------------------------------- */ p {padding-left: 10px;} .boxout-right {margin:0px 0px 0px 10px;padding:4px 4px 4px 10px;width:200px;display: block;float:right;} .boxout-left {margin:0px 10px 0px 2px;width:200px;display: block;float:left;} blockquote {color: #fcd216;font-family: NettoWeb, NettoOTRegular, Tahoma, sans-serif;font-style: normal;font-weight: normal;font-size: 1.5em;} blockquote cite {padding-left: 8px;color: #fcd216;font-style: normal;font-weight: normal;font-family: NettoWeb, NettoOTRegular, Tahoma, sans-serif;font-size:.9em;} ul, ol {padding-bottom: 0px;padding-top:0;} ul.margin, ol.margin {margin-bottom: 10px;} /* -------------------------------------------- Sidebar (News, Links) ----------------------------------------------- */ ul.related {list-style:none;} ul.related li {margin:0;} ul.related li a {color: #122632;display: block;font-style: normal;font-weight: normal;padding-top: 5px;padding-bottom: 5px;padding-left: 0px;background-image: none;border-top-color: #dad7cb;border-top-style: solid;border-top-width: 4px;-webkit-transition: all 0.1s ease-in-out;-moz-transition: all 0.1s ease-in-out;-o-transition: all 0.1s ease-in-out;transition: all 0.1s ease-in-out;} ul.related p {padding-left: 10px;padding-top: 5px;padding-right: 5px;} ul.related li a:hover,ul.related li a:focus {background-color: #e5e8ee;} .relatedfoot {padding:10px 5px 0px 0px;border-top: 4px solid #dad7cb;} .language { padding: 5px 0 5px 0; } /*border-top: 4px solid #dad7cb;border-bottom: 4px solid #dad7cb;}*/ /* -------------------------------------------- Tables ----------------------------------------------- */ table {margin:10px 0px 10px 10px;border-style: none;width: 98%;text-align:left;} summary {position:absolute;left: -3000px;} th, td {padding-left: 10px;padding-bottom: .2em;padding-right: 1em;padding-top: .2em;text-align:left; vertical-align: top; } thead th {background-color: #968c83;padding:0.2em 1em .2em 10px;text-transform: uppercase;font-size: 1em;font-weight: bold;color: white;} thead th.table-head {font-style: normal;font-size: 1.2em;font-weight: normal;text-transform:uppercase;color:#fff;background:#968c83;} tbody th,tbody td {background:#dad7cb;} tbody tr.odd th,tbody tr.odd td {background:#fff;} tbody tr.selected th,tbody tr.selected td {color: white;background-color: #968c83;} tbody td.active a {color:#122632; padding:2px;} tbody td.active a:hover {cursor:hand; color:white; background-color:#00b5e2; -webkit-transition: all 0.1s ease-in-out; -moz-transition: all 0.1s ease-in-out; -o-transition: all 0.1s ease-in-out; transition: all 0.1s ease-in-out;} tfoot th,tfoot td {background-color: #dad7cb;border-top-color: #00b5e2;border-top:2px solid;} tfoot tr.total th {text-transform:uppercase;} th.currency,td.currency {text-align:right;} /* -------------------------------------------- Image Gallery Element ----------------------------------------------- */ ul.imagegal {background:#dad7cb;padding: 10px 0px 10px 10px;display: block;margin:0;overflow:hidden;position: relative;list-style: none;} ul.imagegal li {margin: 0px;padding: 10px 20px 10px 0px;float:left;width: 30%;} ul.imagegal-blog li {margin: 0px;padding: 10px 20px 10px 0px;float: left; width: 17%;} ul.imagegal li a {background-image: none;} /* -------------------------------------------- Forms ----------------------------------------------- */ form {overflow:hidden;} fieldset {padding: 10px 10px 10px 0px;border-style: solid;position:relative;margin-bottom:10px;background-color: #d5d1cd;} legend {padding: 2px 20px 2px 10px;text-transform: uppercase;color: white;background:#00a2dd;} select {border-color: #00b5e2;border-style: solid;border-width: 1px;} fieldset select {width: 50%;} fieldset select.inactive {color: #7e7e7e;border-color: #7f7f7f;border-style: solid;border-width: 1px;width: 50%;} fieldset textarea {border-color: #5b7f95;border-style: solid;border-width: 1px;width: 600px;} fieldset textarea.required {border-color: #00b5e2;border-style: solid;border-width: 1px;} fieldset textarea.requiredS {border-color: #00b5e2;border-style: solid;border-width: 1px; } fieldset label {line-height:2em;margin-right:3%;text-align:right;} fieldset input {border-color: #00a2dd;border-style: solid;border-width: 1px;} fieldset input select {border-style: solid;border-color: #cac0b6;border-width: 1px;width: 90%;vertical-align:50%;} fieldset input.required {border-color: #00b5e2;border-style: solid;border-width: 1px; width: 100%;} form p.notice {font-weight:bold;} input.search.text {background-position: 0;border-width: 1px;border-style: solid;border-color: #00b5e2;float: right;} /* -------------------------------------------- Footer ----------------------------------------------- */ #footer-box {padding:0;} #footer {background-color: #cac0b6;color: #968c83;z-index: 0;display: block;margin:0;overflow:hidden;position: relative;text-transform: uppercase;} #footer h1 {font-size: 1.2em;color:#968c83;padding-top:3px;padding-bottom:4px;padding-left: 0px;text-transform: uppercase;} #footer .address {padding-top: 28px;float: left;width: 20%;} #footer .social {float: left;width: 30%;} #footer .flags {float: left;width: 50%;} #footer a.link {padding-left: 9px;padding-right: 10px;background-position:left 3px;background-image: url(../../img/ico_link_blu.gif);background-repeat: no-repeat;font-style: normal;font-weight: normal;color: #968c83;text-decoration: none;} #footer a.link:hover,#footer a.link:focus {color: #00b5e2;font-style: normal;font-weight: normal;text-decoration: underline;} .flag-footer {border-style: none;padding:2px;background:#cac0b6;} .flag-footer:hover {background-color: #00b5e2;} /* -------------------------------------------- Buttons ----------------------------------------------- */ .button, .button_a {padding: 2px 10px 2px 10px;min-height: 17px;border-width: 0;background-position:2px 50% !important;background-image: url(../../img/ico_link_wht.gif) !important;background-repeat: no-repeat !important;font-size:11px;font-style: normal;font-weight: normal !important;text-transform: uppercase;text-decoration: none !important;cursor:pointer;color: white !important;background-color: #00a2dd;-webkit-transition: all 0.1s ease-in-out;-moz-transition: all 0.1s ease-in-out;-o-transition: all 0.1s ease-in-out;transition: all 0.1s ease-in-out;} .button:hover,.button:focus {color: white !important;font-style: normal;font-weight: normal;text-decoration: none;background-color: #00b5e2;} .button-inactive,.button-inactive:hover,.button-inactive:focus {padding: 2px 10px 2px 10px;min-height: 17px;background-position:2px 50%;background-image: url(../../img/ico_link_wht.gif);background-repeat: no-repeat;border-width: 0px;font-size:11px;font-style: normal;font-weight: normal;text-decoration: none;text-transform: uppercase;color: white;background-color: #e0e5e9;} .button-selected,.button-selected:hover,.button-selected.focus {padding: 2px 10px 2px 10px;min-height: 17px;background-position:2px 50%;background-image: url(../../img/ico_link_wht.gif);background-repeat: no-repeat;font-size:11px;font-style: normal;font-weight: normal;text-transform: uppercase;text-decoration: none !important;color: white !important;background-color: #fcd216;} .button-add { margin: 5px 2px 2px 2px; border-width: 0; width: 1px; height: 19px; background-position:3px 50%; background-image: url(../../img/switch_plus.gif); background-repeat: no-repeat; border-width: 0px; font-size:11px; font-style: normal; font-weight: normal; text-transform: uppercase; text-decoration: none; background-color: #4c6792; color: white; -webkit-transition: all 0.1s ease-in-out; -moz-transition: all 0.1s ease-in-out; -o-transition: all 0.1s ease-in-out; transition: all 0.1s ease-in-out; } .button-add:hover, .button-add:focus { color: white; font-style: normal; font-weight: normal; text-transform: uppercase; text-decoration: none; background-color: #00b5e2; } .button-remove {margin: 32px 0px 2px 2px; border-width: 0; width: 19px; height: 19px; background-position:50% 50%; background-image: url(../../img/switch_minus.gif); background-repeat: no-repeat; font-size: 11px; font-style: normal; font-weight: normal; text-transform: uppercase; background-color: #00a2dd; color: white; text-decoration: none; float:right;-webkit-transition: all 0.1s ease-in-out; -moz-transition: all 0.1s ease-in-out; -o-transition: all 0.1s ease-in-out; transition: all 0.1s ease-in-out; } .button-remove:hover, .button-remove:focus {color: white; font-style: normal; font-weight: normal; text-transform: uppercase; text-decoration: none; background-color: #00b5e2; } /* -------------------------------------------- Interactive elements ----------------------------------------------- */ .toggler {padding-left: 25px;margin:0 0 5px 0;background-position: 10px 50%;background-repeat: no-repeat;background-image: url('data:image/gif;base64,R0lGODlhCwALAJECAODl6f///////wAAACH5BAEAAAIALAAAAAALAAsAAAIYhI8my6zd3goRNOqsCJwvuVWXCGVlliQFADs=') /*../../img/switch_plus.gif*/;background-color: #00a2dd;display: block;padding-bottom: 3px;padding-right: 20px;padding-top: 2px;} .toggler.current,.toggler.current:hover {cursor:default;background-image: url('data:image/gif;base64,R0lGODlhCwALAJECAODl6f///////wAAACH5BAEAAAIALAAAAAALAAsAAAIWhI8my6zdHlxyvoAxBdPxLlSQGCVmAQA7') /*../../img/switch_minus.gif*/;background-color: #fcd216;} .toggler:hover {cursor:pointer;background-color: #00b5e2;-webkit-transition: all 0.1s ease-in-out;-moz-transition: all 0.1s ease-in-out;-o-transition: all 0.1s ease-in-out;transition: all 0.1s ease-in-out;} #slider div{overflow:hidden;position:relative;padding-left:15px;margin:0;} #slider .item{padding:2px 20px 3px 25px;margin-bottom:5px;margin-top: 5px;background-position: 10px 50%;background-repeat: no-repeat;background-image: url(../../img/ico_link_wht.gif);background-color: #00a2dd;display: block;color:white;} #slider .item:hover,#slider .item.active:hover {cursor:pointer;background-color: #00b5e2;-webkit-transition: all 0.1s ease-in-out;-moz-transition: all 0.1s ease-in-out;-o-transition: all 0.1s ease-in-out;transition: all 0.1s ease-in-out;} #slider .item.active{cursor:pointer;background-position: 10px 50%;background-repeat: no-repeat;background-image: url('data:image/gif;base64,R0lGODlhBwAIAIAAAP///////yH5BAEAAAEALAAAAAAHAAgAAAIMjI8IyxDtDEsxWVQAADs=') /*../../img/ico_link_wht_down.gif*/;color: white;background-color: #7dc2b8;-webkit-transition: all 0.1s ease-in-out;-moz-transition: all 0.1s ease-in-out;-o-transition: all 0.1s ease-in-out;transition: all 0.1s ease-in-out;} /* -------------------------------------------- Misc. ----------------------------------------------- */ #loading {float:right; margin-right:14px; margin-top:-2px;} #hidden {display:none;} .padtop6{ padding-top: 8px; } .padtop12{ padding-top: 12px; } .margin0{ margin: 0 !important; } .editortablenomargin table{ margin: 0; } /* THESE STYLES ARE PART OF THE DESIGN BUT NOT CURRENTLY USED */ /* -------------------------------------------- Gallery and Archive Layout Component ----------------------------------------------- */ ul.gallery-3,ul.gallery-4 {display: block;margin:0;overflow:hidden;position: relative;list-style: none;} ul.gallery-3 li {margin:0;background-color: #fff;padding:10px 10px 0px 10px;float:left;width: 30%;height: 205px;} ul.gallery-4 li {margin:0;background-color: #fff;padding:10px 10px 0px 10px;float:left;width: 22%;} ul.gallery-3 li:hover,ul.gallery-4 li:hover {background-color: #e0e5e9;-webkit-transition: all 0.1s ease-in-out;-moz-transition: all 0.1s ease-in-out;-o-transition: all 0.1s ease-in-out;transition: all 0.1s ease-in-out;} ul.gallery-3 li a,ul.gallery-4 li a {padding-right: 10px;padding-left: 0px;color: #122632;font-style: normal;font-weight: normal;display:block;width:100%;height:100%;background-image: none;} ul.gallery-3 .image {padding-bottom: 10px;border-width: 0px;border-style: none;width: 200px;height: 200px;} ul.gallery-4 .image {padding-bottom: 10px;border-width: 0px;border-style: none;width: 150px;height: 150px;} ul.gallery-3 p,ul.gallery-4 p {padding-left: 8px;padding-top: 0px;} /* -------------------------------------------- Secondary Navigation ----------------------------------------------- */ ul.menu {list-style:none;} ul.menu li {margin:0;} ul.menu li a {border-bottom-style: solid;padding:4px 2px 2px 10px;display:block;border-bottom:1px;-webkit-transition: all 0.1s ease-in-out;-moz-transition: all 0.1s ease-in-out;-o-transition: all 0.1s ease-in-out;transition: all 0.1s ease-in-out;} ul.menu li a:hover {color: white;background-position: left 65%;background-image: url('data:image/gif;base64,R0lGODlhBgAIALMAABMeKeDh4u/w8UJLVKGlqdDS1GJpcHF4fyMtN7C0uDI8RpGWm4GHjf///wAAAAAAACH5BAEAAAEALAAAAAAGAAgAAAQNMIQma6P2Zj15rxMoRgA7') /*../../img/ico_link_wht.gif*/;background-color: #00b5e2;} ul.menu li a:active {color: white;background-color: #fcd216;} ul.menu ul {list-style:none;margin:0;} ul.section {border-top:0;margin-bottom:0;} ul.section li {cursor:pointer;text-transform:uppercase;font-weight:normal;} ul.section li a {border-bottom-color: #dad7cb;border-bottom-style: solid;border-bottom-width: 1px;text-transform: uppercase;color:#fff;background:#968c83;font-weight:normal;} ul.section li a:hover {color: white;background:#00b5e2;} ul.section li li a {word-wrap: normal;padding-left: 20px;background:#00a2dd;} ul.section li a.selected {color: white;background:#fcd216;} ul.section li a.selected:hover {color: #00a2dd;border-bottom-color: #fff;border-bottom-style: solid;border-bottom-width: 1px;background:#ccf1fa;}