view/theme/quattro/style.css

   1 /**
   2  * Fabio Comuni <http://kirgroup.com/profile/fabrixxm>
   3  **/
   4 /* global */
   5 body {
   6   font-family: Liberation Sans, helvetica, arial, clean, sans-serif;
   7   font-size: 12px;
   8   background-color: #ffffff;
   9   color: #2d2d2d;
  10   margin: 0px;
  11   display: table-row;
  12 }
  13 a, a:visited, a:link {
  14   color: #005c94;
  15   text-decoration: none;
  16 }
  17 a:hover {
  18   text-decoration: underline;
  19 }
  20 .left {
  21   float: left;
  22 }
  23 .right {
  24   float: right;
  25 }
  26 /* icons */
  27 .icon {
  28   background-color: transparent ;
  29   background-repeat: no-repeat;
  30   background-position: center center;
  31   display: block;
  32   overflow: hidden;
  33   text-indent: -9999px;
  34 }
  35 .icon.s22 {
  36   width: 22px;
  37   height: 22px;
  38   padding: 1px;
  39 }
  40 .icon.s22.notify {
  41   background-image: url("../../../images/icons/notify_off_22.png");
  42 }
  43 .icon.s22.gear {
  44   background-image: url("../../../images/icons/gear_22.png");
  45 }
  46 /* header */
  47 header {
  48   position: fixed;
  49   left: 43%;
  50   right: 43%;
  51   top: 0px;
  52   margin: 0px;
  53   padding: 0px;
  54   /*width: 100%; height: 12px; */
  55
  56   z-index: 110;
  57   color: #ffffff;
  58 }
  59 header #site-location {
  60   /*font-size:8px;
  61                 float:left;
  62                 background-color: @Metalic3;
  63                 padding: 1px 5px;
  64                 margin-left: 20px;
  65                 .roundbottom()*/
  66
  67   display: none;
  68 }
  69 header #banner {
  70   text-align: center;
  71   width: 100%;
  72 }
  73 header #banner a,
  74 header #banner a:active,
  75 header #banner a:visited,
  76 header #banner a:link,
  77 header #banner a:hover {
  78   color: #ffffff;
  79   text-decoration: none;
  80   outline: none;
  81   vertical-align: bottom;
  82 }
  83 header #banner #logo-img {
  84   height: 22px;
  85   margin-top: 5px;
  86 }
  87 header #banner #logo-text {
  88   font-size: 22px;
  89 }
  90 /* nav */
  91 nav {
  92   width: 100%;
  93   height: 32px;
  94   position: fixed;
  95   left: 0px;
  96   top: 0px;
  97   padding: 0px;
  98   background-color: #0e232e;
  99   color: #ffffff;
 100   z-index: 100;
 101   -webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.7);
 102   -moz-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.7);
 103   box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.7);
 104 }
 105 nav a,
 106 nav a:active,
 107 nav a:visited,
 108 nav a:link,
 109 nav a:hover {
 110   color: #ffffff;
 111   text-decoration: none;
 112   outline: none;
 113 }
 114 nav ul {
 115   margin: 0px;
 116   padding: 0px 20px;
 117 }
 118 nav ul li {
 119   list-style: none;
 120   margin: 0px;
 121   padding: 0px;
 122   float: left;
 123 }
 124 nav ul li .menu-popup {
 125   left: 0px;
 126   right: auto;
 127 }
 128 nav .nav-menu-icon {
 129   position: relative;
 130   height: 22px;
 131   padding: 5px;
 132   margin: 0px 10px;
 133   -moz-border-radius: 5px 5px 0 0;
 134   -webkit-border-radius: 5px 5px 0 0;
 135   border-radius: 5px 5px 0 0;
 136 }
 137 nav .nav-menu-icon.selected {
 138   background-color: #364e59;
 139 }
 140 nav .nav-menu-icon img {
 141   width: 22px;
 142   height: 22px;
 143 }
 144 nav .nav-menu-icon .nav-notify {
 145   top: 3px;
 146 }
 147 nav .nav-menu {
 148   position: relative;
 149   height: 16px;
 150   padding: 5px;
 151   margin: 3px 15px 0px;
 152   font-size: 14px;
 153   border-bottom: 3px solid #0e232e;
 154 }
 155 nav .nav-menu.selected {
 156   border-bottom: 3px solid #9eabb0;
 157 }
 158 nav .nav-notify {
 159   display: none;
 160   position: absolute;
 161   background-color: #19aeff;
 162   -moz-border-radius: 5px 5px 5px 5px;
 163   -webkit-border-radius: 5px 5px 5px 5px;
 164   border-radius: 5px 5px 5px 5px;
 165   font-size: 10px;
 166   padding: 1px 3px;
 167   top: 0px;
 168   right: -10px;
 169   min-width: 15px;
 170   text-align: right;
 171 }
 172 nav .nav-notify.show {
 173   display: block;
 174 }
 175 nav #nav-help-link,
 176 nav #nav-search-link,
 177 nav #nav-directory-link,
 178 nav #nav-apps-link,
 179 nav #nav-site-linkmenu {
 180   float: right;
 181 }
 182 nav #nav-help-link .menu-popup,
 183 nav #nav-search-link .menu-popup,
 184 nav #nav-directory-link .menu-popup,
 185 nav #nav-apps-link .menu-popup,
 186 nav #nav-site-linkmenu .menu-popup {
 187   right: 0px;
 188   left: auto;
 189 }
 190 nav #nav-notifications-linkmenu.selected .icon.s22.notify {
 191   background-image: url("../../../images/icons/notify_on_22.png");
 192 }
 193 ul.menu-popup {
 194   position: absolute;
 195   display: none;
 196   width: 10em;
 197   background: #ffffff;
 198   color: #2d2d2d;
 199   margin: 0px;
 200   padding: 0px;
 201   list-style: none;
 202   border: 3px solid #364e59;
 203   z-index: 100000;
 204   -webkit-box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.7);
 205   -moz-box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.7);
 206   box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.7);
 207 }
 208 ul.menu-popup a {
 209   display: block;
 210   color: #2d2d2d;
 211   padding: 5px 10px;
 212 }
 213 ul.menu-popup a:hover {
 214   background-color: #bdcdd4;
 215 }
 216 ul.menu-popup .menu-sep {
 217   border-top: 1px solid #9eabb0;
 218 }
 219 ul.menu-popup li {
 220   float: none;
 221   overflow: auto;
 222   height: auto;
 223   display: block;
 224 }
 225 ul.menu-popup .empty {
 226   padding: 5px;
 227   text-align: center;
 228   color: #9eabb0;
 229 }
 230 #nav-notifications-menu {
 231   width: 400px;
 232 }
 233 #nav-notifications-menu img {
 234   float: left;
 235   margin-right: 5px;
 236 }
 237 #nav-notifications-menu .contactname {
 238   font-weight: bold;
 239 }
 240 #nav-notifications-menu .notif-when {
 241   font-size: 10px;
 242   color: #9eabb0;
 243   display: block;
 244 }
 245 /* aside */
 246 aside {
 247   display: table-cell;
 248   width: 200px;
 249   padding: 50px 10px 0px 20px;
 250 }
 251 /* section */
 252 section {
 253   display: table-cell;
 254   width: 800px;
 255   padding: 50px 20px 0px 10px;
 256 }