@charset "UTF-8";
/*All rules starting by (* html ) are IE6 only*/
/*Start of Eric Meyer's reset styles*/
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,
dd,dl,dt,li,ol,ul,
fieldset,form,label,legend,
table,caption,tbody,tfoot,thead,tr,th,td {
margin: 0;
padding: 0;
border: 0;
font-weight: normal;
font-style: normal;
font-size: 100%;
line-height: 1;
font-family: inherit;
text-align: left;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
ol,ul {
list-style: none;
}
q:before,q:after,
blockquote:before,blockquote:after {
content: "";
}
/*End of Eric Meyer's reset styles*/
body {
font-size: 62.5%;
background: #d30000 url(images/bg_rings_lt.png);
font-family: Houschka, Arial, Helvetica, sans-serif;
}
h1 {
margin-bottom: 12px;
padding: 2px;
padding-left: 4px;
-moz-border-radius: 5px;
background-color: #666666;
color: #fff;
font-size: 2.2em;
}
h2 {
margin-bottom: 12px;
padding: 4px;
padding-left: 4px;
-moz-border-radius: 5px;
background-color: #666666;
color: #fff;
font-size: 1.9em;
}
h3 {
color: #e86c1f;
font-size: 1.3em;
font-weight: bold;
margin-bottom: 0.3em;
}
h4 {
color: #000000;
font-size: 1.3em;
font-weight: bold;
}
.box1 h3 {
color: #666666;
}
.box3 h3 {
color: #000;
}
ul {
margin-bottom: 0.3em;
}
p,
li,
label {
line-height: 1.2em;
color: #666666;
font-size: 1.2em;
}
p {
margin-bottom: 1em;
font-size: 1.5em;
}
p.register {
text-align:center;
font-size: 1.2em;
}
ol {
font-size: 1.2em;
list-style: inside decimal;
line-height: 1.2em;
margin-bottom: 1.2em;
}
table {
width: 100%;
background-color: #fff;
margin-bottom: 10px;
}
thead {
background-color: #666666;
font-size: 1.4em;
color: #e86c1f;
}
th,
td {
padding: 5px;
}
th {
font-weight: bold;
}
td {
font-size: 1.2em;
}
tr.odd {
background-color: #666666;
}
caption {
font-size: 1.4em;
margin-bottom: 5px;
text-align: center;
color: #FFF;
}
a {
color: #414141;
text-decoration: none;
}
.box1 a {
color: #fff;
}
a:hover {
text-decoration: underline;
font-weight: bold;
}
a#logout {
position: absolute;
right: 5px;
top: 6px;
color: #fff;
font-size: 1.5em;
display: block;
height: 20px;
line-height: 1.2em;
color: #d30000;
}
#outerContainer {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
background: url(images/bg_movi_rb.png) no-repeat right bottom;
}
#innerContainer {
position: relative;
width: 829px;
margin: 0 auto;
}
#secondarySection {
position: absolute;
top: 0;
left: 0;
}
#secondarySection img.logo {
margin: 20px 0 0 0;
}
#mainSection {
}
#header {
margin-left: 110px;
margin-bottom: 50px;
}
#header img.logo {
margin: 40px 0 0 20px;
}
.persistentButtons {
display: block;
clear: both;
}
.persistentButtons li {
float: right;
display: block;
margin-right: 10px;
}
#mainContent {
clear: both;
width: 829px;
float: left;
}
/*FORMS*/
.line {
float: left;
clear: both;
margin-bottom: 1em;
color: #fff;
width: 100%;
}
label {
float: left;
display: block;
width: 150px;
font-weight: bold;
padding-top: 3px;
}
.textField,
select,
textarea {
width: 200px;
color: #e86c1f;
}
#portForwarding .textField,
#portForwarding select,
#portForwarding textarea {
width: 88px;
}
select {
width: 202px;
}
.box2 .textField,
.box2 select,
.box2 textarea {
border: 1px solid #000;
color: #000;
}
.box3 .textField,
.box3 select,
.box3 textarea {
border: 1px solid #002b5c;
color: #002b5c;
}
.buttons {
float: left;
clear: both;
width: 100%;
}
* html .buttons {
margin-bottom: 10px;
}
.buttons input {
float: right;
}
.submit {
cursor: pointer;
font-weight: bold;
}
.reset {
cursor: pointer;
}
.cancel {
cursor: pointer;
}
/*BLOCKS*/
.block {
margin: 0 15px 15px 0;
float: left;
width: 373px;
}
* html .block {
margin: 0 7px 7px 0;
}
.blockWhole {
margin: 0 15px 15px 0;
clear: both;
width: 100%;
}
/*SPECIFIC BLOCKS
#portForwarding {
width: 430px;
border: 1px solid #00FF00;
}
*/
/*BREADCRUMBS*/
#breadCrumbs {
height: 30px;
background: url(images/blackBarR.png) no-repeat right top;
position: relative;
margin-bottom: 10px;
}
#breadCrumbs ul {
display: block;
height: 30px;
margin-right: 6px;
background: url(images/blackBarL.png) no-repeat left top;
padding: 7px 0 0 5px;
}
#breadCrumbs ul.right {
text-align: right;
}
#breadCrumbs li {
display: inline;
color: #d30000;
font-size: 1.5em;
}
#breadCrumbs li a {
color: #d30000;
}
/*ICONS*/
ul.icons li {
float: left;
display: block;
margin-right: 15px;
margin-left: 14px;
}
a.icon {
color: #000;
display: block;
padding: 90px 0 0;
font-size: 1.2em;
width: 85px;
height: 2.5em;
text-align: center;
background-position: center top;
background-repeat: no-repeat;
}
a.iconsmall {
color: #000;
display: block;
padding: 0px 0 0;
font-size: 1.2em;
width: 25px;
height: 25px;
text-align: center;
background-position: center top;
background-repeat: no-repeat;
}
#dashboardLogo {
background-image: url(images/lafonera20.png);
}
#foneraStatusButton a.icon {
background-image: url(icons/fonera_on.png);
}
#webcamButton a.icon {
background-image: url(icons/webcam_on.png);
}
#dashboardButton a.icon {
background-image: url(icons/dashboard.png);
}
#registerButton a.icon {
background-image: url(icons/register.png);
}
#plugins a.icon {
background-image: url(icons/plugins.png);
}
#networkServices a.icon {
background-image: url(icons/networkServices.png);
}
#settings a.icon {
background-image: url(icons/settings.png);
}
#passwd a.icon {
background-image: url(icons/pass.png);
}
#reboot a.icon {
background-image: url(icons/firmware.png);
}
a.icon.register {
margin: 20px auto;
background-image: url(icons/register.png);
}
/*BOXES*/
.box1,
.box2,
.box3,
.box4,
.box5 {
display: block;
position: relative;
float: left;
width: 817px;
clear: both;
margin: 0 12px 22px 0;
background-position: left top;
background-repeat: no-repeat;
background-image: url(images/Boxes/boxBlackTL.png);
}
* html .box1,
* html .box2,
* html .box3 {
width: 800px;
margin: 0 0 10px 0;
background-image: none;
background-color: #e86c1f;
}
.box2 {
background-image: url(images/Boxes/boxBlackTL.png);
}
* html .box2 {
background: #000;
}
.box3 {
background-image: url(images/Boxes/boxBlackTL.png);
}
* html .box3 {
background: #0C0C0C;
}
.box4 {
background-image: url(images/Boxes/boxFojoTL.png);
}
* html .box4 {
background: #0C0C0C;
}
.box5 {
background-image: url(images/Boxes/boxBlackTL.png);
}
* html .box5 {
background: #0C0C0C;
}
.box1 .inner,
.box2 .inner,
.box3 .inner,
.box4 .inner,
.box5 .inner {
position: relative;
right: -12px;
top: 0;
background-position: right top;
background-repeat: no-repeat;
background-image: url(images/Boxes/boxBlackTR.png);
}
* html .box1 .inner,
* html .box2 .inner,
* html .box3 .inner {
right: 0;
background-image: none;
}
.box2 .inner {
background-image: url(images/Boxes/boxBlackTR.png);
}
.box3 .inner {
background-image: url(images/Boxes/boxBlackTR.png);
}
.box4 .inner {
background-image: url(images/Boxes/boxFojoTR.png);
}
.box5 .inner {
background-image: url(images/Boxes/boxBlackTR.png);
}
.boxFooter {
clear: both;
position: relative;
height: 12px;
bottom: -12px;
left: -12px;
background-position: left bottom;
background-repeat: no-repeat;
background-image: url(images/Boxes/boxBlackBL.png);
}
* html .boxFooter {
height: 1px;
bottom: 0;
left: 0;
background-image: none;
}
.box2 .inner .boxFooter {
background-image: url(images/Boxes/boxBlackBL.png);
}
* html .box2 .inner .boxFooter {
background-image: none;
}
.box3 .inner .boxFooter {
background-image: url(images/Boxes/boxBlackBL.png);
}
* html .box3 .inner .boxFooter {
background-image: none;
}
.box4 .inner .boxFooter {
background-image: url(images/Boxes/boxFojoBL.png);
}
* html .box4 .inner .boxFooter {
background-image: none;
}
.box5 .inner .boxFooter {
background-image: url(images/Boxes/boxBlackBL.png);
}
* html .box5 .inner .boxFooter {
background-image: none;
}
.boxFooter .inner {
position: absolute;
width: 12px;
height: 12px;
background-position: right bottom;
background-repeat: no-repeat;
background-image: url(images/Boxes/boxBlackBR.png);
}
* html .boxFooter .inner {
display: none;
}
.box2 .inner .boxFooter .inner {
background-image: url(images/Boxes/boxBlackBR.png);
}
.box3 .inner .boxFooter .inner {
background-image: url(images/Boxes/boxBlackBR.png);
}
.box4 .inner .boxFooter .inner {
background-image: url(images/Boxes/boxFojoBR.png);
}
.box5 .inner .boxFooter .inner {
background-image: url(images/Boxes/boxBlackBR.png);
}
.boxContent {
padding: 20px 12px 0 0;
}
* html .boxContent {
padding: 10px;
}
.boxContent img.logo {
float: left;
margin: 0 20px 0 0;
}
/*SPECIFIC BOXES*/
#dashboardBox {
background-image: url(images/Boxes/boxBlackTL.png);
}
* html #dashboardBox {
background-image: none;
background: #0C0C0C;
}
#dashboardBox .inner {
background-image: url(images/Boxes/boxBlackTR.png);
}
* html #dashboardBox .inner {
background-image: none;
}
#dashboardBox .inner .boxFooter {
background-image: url(images/Boxes/boxBlackBL.png);
}
* html #dashboardBox .inner .boxFooter {
background-image: none;
}
#dashboardBox .inner .boxFooter .inner {
background-image: url(images/Boxes/boxBlackBR.png);
}
* html #dashboardBox .inner .boxFooter .inner {
background-image: none;
}
#summaryBox {
width: 208px;
margin-right: 22px;
clear: left;
}
* html #summaryBox {
margin-right: 10px;
}
#quickEditBox {
clear: right;
width: 587px;
}
* html #quickEditBox {
width: 570px;
}
.cbi-value-error input,
.cbi-value-error select {
color: red;
background-color: #ffcccc;
}
#cbi-firewall-redirect select {
width: 140px
}
#cbi-firewall-redirect .textField {
width: 140px
}