/lib/jquery-validate/demo/marketo/stylesheet.css
CSS | 1179 lines | 980 code | 184 blank | 15 comment | 0 complexity | 8f20154f1b6762ee1be0b4e8fcfc9f25 MD5 | raw file
Possible License(s): LGPL-2.1, Apache-2.0, BSD-3-Clause
- :-moz-any-link :focus {
- outline: none;
- }
- :focus {
- -moz-outline-style: none;
- outline: none;
- }
- body {
- font-size: 80%;
- margin: 0;
- padding: 0;
- font-family: tahoma, geneva, sans-serif;
- background-color: #000000;
- }
- a {
- color: #0653AB;
- outline: 0px;
- text-decoration: none;
- }
- a:hover {
- outline: 0px;
- text-decoration: underline;
- }
- img {
- border: 0px;
- }
- /* s1.0 - Page Containers */
- #letterbox {
- margin: 10px auto;
- width: 883px;
- background-color: #364158;
- border: 8px solid #D4D4D4;
- padding: 1px 1px 10px 1px;
- }
- #header-background {
- background: url(images/back_nav_blue.gif) repeat-x;
- margin: 0px auto;
- padding: 0px;
- height: 73px;
- width: 883px;
- border-top: 4px solid #CCEAFE;
- border-bottom: 4px solid #D4D4D4;
- }
- #page-container {
- width: 866px;
- margin: 0px auto;
- margin-top: 33px; /* pad from top menu to actions buts*/
- margin-bottom: -11px;
- padding-top: 8px;
- padding-bottom: 8px;
- background-color: #D4D4D4; /* light grey*/
- border-right: 1px solid #464646;
- }
- #page-content-inner {
- width: 849px;
- margin: 0px auto;
- border-top: 1px solid #9F9FA0;
- border-left: 1px solid #A2A09A;
- background-color: #F4F1E9;
- position: relative;
- }
- #page-content-inner #col-left {
- width: 210px;
- float: left;
- background-color: #F4F1E9;
- }
- #page-content-inner #col-main {
- width: 639px;
- background-color: #ffffff;
- position: absolute;
- right: 0px;
- top: 0px;
- }
- #footer-container {
- width: 866px;
- position: relative;
- left: 8px;
- padding: 2px 0px 10px 0px;
- background-color: #D4D4D4; /* light grey*/
- }
- /* s2.0 - Global navigation bar */
- .nav-global-container {
- width: 880px;
- margin: 0px auto;
- position: relative;
- }
- * html .nav-global-container { /* ie6 fix*/
- margin-bottom: -6px;
- }
- .login {
- position: absolute;
- right: 20px;
- text-align: center;
- }
- .login a,.login a span {
- display: block;
- height: 18px;
- font-size: 11px;
- background: url(images/login-sprite.gif) right -5px no-repeat;
- text-decoration: none;
- font-weight: bold;
- padding: 5px 10px 5px 10px;
- position: relative;
- }
- .login a:hover {
- color: #000000;
- text-decoration: underline;
- }
- div.login a span {
- background-position: left -105px;
- width: 4px;
- position: absolute;
- top: 0px;
- left: 0px;
- padding: 5px 0px 5px 0px;;
- }
- div.login a:hover span {
-
- }
- .logo {
- float: left;
- margin: 0px 0px -5px 0px; /* neg marging for ie6 */
- }
- .logo img {
- border: 0px;
- margin-left: -1px;
- }
- .nav-global {
- float: left;
- width: 645px;
- margin: 40px 0px 0px 40px;
- background-color: transparent;
- }
- .nav-global ul {
- margin: 0px;
- padding: 0px;
- list-style: none;
- }
- .nav-global li {
- float: left;
- white-space: nowrap;
- }
- div.nav-global li a,div.nav-global li a span {
- background-image: url(images/tab-sprite.gif);
- background-position: right 100px;
- background-repeat: no-repeat;
- height: 32px;
- color: #666666;
- text-decoration: none;
- font: bold 16px 'trebuchet ms';
- margin-right: 15px;
- display: block;
- position: relative;
- padding: 7px 15px 0px 15px;
- }
- div.nav-global li a:hover {
- background-position: right 0px;
- color: #333333;
- }
- div.nav-global li a:hover span {
- background-position: left -100px;
- display: block !important;
- }
- div.nav-global li a span {
- background-position: left 150px;
- width: 4px;
- position: absolute;
- left: 0px;
- top: 0px;
- padding: 7px 0px 0px 0px;
- }
- body.safari div.nav-global li a span {
- display: none;
- }
- div.nav-global li a.on,div.nav-global li a.on:hover {
- background-position: right -55px;
- color: #FFFFFF;
- }
- div.nav-global li a.on span,div.nav-global li a.on:hover span {
- background-position: left -155px;
- display: block !important;
- }
- div.action-container {
- position: relative;
- top: -45px;
- cursor: pointer;
- }
- div.action-icon-container {
- position: absolute;
- top: -17px;
- left: -17px;
- z-index: 10;
- width: 100px;
- height: 100px;
- overflow: hidden;
- }
- div.action-icon {
- border: 0px;
- position: absolute;
- top: -0px;
- left: 0px;
- }
- div.action-button-container {
- height: 106px;
- width: 180px;
- overflow: hidden;
- position: absolute;
- top: 0px;
- left: 0px;
- z-index: 5;
- }
- img.action-icon {
- border: 0px;
- position: absolute;
- top: 0px;
- left: 0px;
- z-index: 0
- }
- div.action-text {
- z-index: 20;
- color: #FFFFFF;
- position: absolute;
- left: 40px;
- top: 12px;
- font: 14px tahoma, geneva;
- padding-top: 30px;
- }
- div.bigbuttons {
- top: -20px;
- }
- div.action-header {
- z-index: 21;
- position: absolute;
- left: 40px;
- top: 10px;
- }
- div.action-header b {
- font: bold 17px tahoma, geneva;
- display: block;
- margin-bottom: 10px;
- color: #0b2c89;
- position: absolute;
- top: 0px;
- left: 0px;
- width: 130px;
- }
- div.action-header b.shadow {
- top: 1px;
- left: 1px;
- color: #d5d5d5;
- }
- img.action-button {
- position: relative;
- }
- div.hover img.action-button {
- top: -131px;
- }
- div.on img.action-button {
- top: -261px;
- }
- /* s3.0 - top of content Action Buttons */
- .action-buttons {
- width: 100%; /* ie6 requires */
- }
- .action-buttons ul {
- position: relative;
- padding: 0px;
- }
- .action-buttons li {
- position: relative; /* ie6 fix */
- float: left;
- list-style: none;
- text-align: center;
- line-height: 16px;
- margin: -61px 0px 0px 0px;
- }
- .action-home li {
- margin: -49px 0px 0px 0px;
- }
- .action-buttons a {
- display: block;
- height: 110px;
- width: 175px;
- padding: 14px 0px 0px 25px;
- text-decoration: none;
- font-size: 12px;
- font-weight: bold;
- color: #ffffff;
- }
- .action-buttons li span {
- color: #053880;
- line-height: 47px;
- font-size: 17px;
- }
- div.action-bottom {
- margin: 15px 0px 10px 0px;
- float: left;
- }
- div.action-bottom a {
- height: 61px;
- width: 178px;
- border: 0px;
- background: url(images/action-bottom.gif) no-repeat 0px 0px;
- color: #0b2c89;
- float: left;
- position: relative;
- font: bold 17px tahoma, geneva;
- text-decoration: none;
- margin-right: 10px;
- }
- div.action-bottom a span {
- position: absolute;
- top: 15px;
- left: 40px;
- }
- div.action-bottom a span.shadow {
- top: 16px;
- left: 41px;
- color: #d4d4d4;
- }
- .line-grey {
- background: url(images/line-grey.gif) 0 0 repeat-x;
- height: 2px;
- margin: 8px 25px 20px 0;
- }
- /* s4.0 - Home Hero Area */
- .hero-background {
- position: relative;
- width: 880px;
- background: url(images/back_home-hero.jpg) 10px 0px no-repeat;
- height: 211px;
- margin: -20px 0px 45px 0px;
- }
- .hero-text {
- float: right;
- width: 626px;
- margin-top: 26px;
- }
- .hero-text a { /* Sign Up Now Button */
- padding: 5px 32px 0px 0px;
- float: right;
- }
- .hero-text h1 {
- font-size: 2.3em;
- line-height: 1.2em;
- color: #333333;
- font-family: Trebuchet MS;
- margin: 12px 0px 10px 10px;
- }
- .hero-text h2 {
- margin: 0px;
- font-weight: normal;
- font-size: 1.35em;
- margin: 5px 0px 13px 10px
- }
- /* s4.1 - Home Left Header tab */
- .col-left-header-tab {
- position: relative; /* ie6 fix */
- background: url(images/tab_green.gif) 0 0 no-repeat;
- height: 30px;
- width: 166px;
- text-align: center;
- color: #ffffff;
- font: 20px 'trebuchet ms';
- padding-top: 2px;
- margin-top: -41px;
- margin-left: 20px;
- line-height: 29px;
- margin-bottom: 8px;
- display: block;
- }
- .col-left-header-tab a {
- color: #FFFFFF;
- }
- .callout-green {
- background: url(images/back_green-fade.gif) 0 0 repeat-x;
- font-size: 1.2em;
- padding: 10px 15px 20px 13px;
- color: #303B52;
- line-height: 1.4em;
- }
- /* s4.2 - Home Left Quote */
- .callout-tan {
- color: #666666;
- }
- .callout-tan h1 {
- background: #F4F1E9 url(images/back_tan-fade.gif) 0 0 repeat-y;
- font-size: 1.1em;
- text-align: center;
- margin: 0px;
- padding: 11px 5px 11px 2px;
- color: #333333;
- }
- .callout-tan p {
- margin: 0px;
- margin-top: 5px;
- line-height: 1.4em;
- padding: 5px 10px 7px 13px;
- }
- .callout-tan p img {
- float: left;
- margin: 5px 10px 5px 0px;
- }
- .callout-tan div {
- text-align: left;
- padding: 5px 10px 7px 0px;
- font-weight: bold;
- }
- /* s4.3 - purple home boxes */
- .box-purple {
- background: #C6C8E3 url(images/back_home-icons.png) 0px 0px repeat-x;
- border-left: 1px solid #ffffff;
- color: #333333;
- width: 581px;
- padding: 10px 15px 20px 15px;
- }
- div.box-purple a {
-
- }
- .box-purple h1 {
- font-size: 1.5em;
- margin: 10px 0px -15px 0px;
- }
- .box-purple li {
- margin: 0px 0px 0px -23px;
- line-height: 1.6em;
- font-size: 1em;
- }
- .box-purple div {
- padding: 0px 0px 0px 110px;
- }
- .icon-text01 {
- background-image: url(images/icon_search-engine-market.png);
- background-repeat: no-repeat;
- }
- * html .icon-text01 {
- width: 460px; /* must have a width or heigh tag for ie6*/
- background-image: none;
- filter: progid : DXImageTransform . Microsoft .
- AlphaImageLoader(src = "images/icon_search-engine-market.png",
- sizingMethod = "crop");
- }
- .icon-text02 {
- background: url(images/icon_landing-pages.png) 0 0 no-repeat;
- }
- * html .icon-text02 {
- width: 460px; /* must have a width or heigh tag for ie6*/
- background-image: none;
- filter: progid : DXImageTransform . Microsoft .
- AlphaImageLoader(src = "images/icon_landing-pages.png", sizingMethod =
- "crop");
- }
- .icon-text03 {
- background: url(images/icon_salesforce.png) 0 0 no-repeat;
- }
- * html .icon-text03 {
- width: 460px; /* must have a width or heigh tag for ie6*/
- background-image: none;
- filter: progid : DXImageTransform . Microsoft .
- AlphaImageLoader(src = "images/icon_salesforce.png", sizingMethod =
- "crop");
- }
- /* s4.4 - news home boxes */
- .callout-news {
- color: #555555;
- float: left;
- width: 49%;
- margin: 10px 1px 0px 0px;
- padding-bottom: 20px;
- text-align: left;
- }
- .line-news-r {
- border-right: 1px solid #D4D4D4;
- }
- .callout-news h1 {
- background-color: #EEEEEE;
- font-size: 1.2em;
- margin: 0px;
- padding: 11px 5px 11px 15px;
- color: #333333;
- }
- .callout-news p {
- margin: 10px 0px 0px 10px;
- padding: 0px 10px 7px 20px;
- background: url(images/news.gif) no-repeat left 1px;
- }
- .callout-news p a {
-
- }
- .callout-news ul {
- list-style-type: none;
- padding: 0;
- margin: 10px 0 0 10px;
- }
- .callout-news li {
- background: url(images/icon_news.gif) no-repeat left 2px;
- padding: 0px 5px 5px 20px;
- }
- .callout-news li a {
- display: block;
- margin-bottom: 5px;
- }
- .callout-news div {
- text-align: right;
- }
- #scrollup {
- position: relative;
- overflow: hidden;
- height: 440px;
- width: 200px
- }
- .headline {
- position: absolute;
- top: 600px;
- left: 5px;
- height: 585px;
- width: 190px;
- font: normal 12px tahoma, geneva !important;
- }
- div.more {
- margin: 5px 0px 0px 0px;
- padding: 0px 10px 0px 0px;
- letter-spacing: inherit;
- }
- div.more a {
- background: transparent url(images/arrow_r-blue.gif) no-repeat right 2px
- ;
- font-weight: bold;
- padding: 0px 20px 0px 0px;
- font-weight: bold;
- text-decoration: none;
- }
- div.more a:hover {
- text-decoration: underline;
- }
- /* sX.0 - Left Nav */
- .nav-left-back {
- background: url(images/back_nav_side.gif) 0 0 repeat-x;
- }
- div.empty {
- background: #F1F0E5 url(images/back_green-fade.gif) 0 0 repeat-x;
- }
- div.empty div.callout-green {
-
- }
- .nav-left {
- padding-top: 12px;
- /*background: url(images/logo_marketo_square.gif) 0 0 no-repeat;*/
- width: 210px;
- }
- .nav-left ul {
- margin: 0px;
- padding: 0px;
- list-style: none;
- }
- .nav-left li a {
- display: block;
- height: 24px;
- text-decoration: none;
- font-size: 12px;
- font-weight: bold;
- color: #ffffff;
- border-top: 1px solid #B3D38D;
- border-bottom: 1px solid #7CA84E;
- border-left: 1px solid #97B973;
- padding: 6px 0px 0px 20px;
- }
- .nav-left a:hover,.nav-left a.active:hover,#nav-left-sub a:hover {
- color: #4C6F28;
- background-color: #F4F1E9;
- }
- .nav-left a.open {
- background-image: url(images/arrow_d-green.gif);
- background-repeat: no-repeat;
- background-position: 6px 11px;
- }
- .nav-left-header-tab {
- position: relative; /* ie6 fix */
- background: url(images/tab_green.gif) 0 0 no-repeat;
- height: 32px;
- width: 166px;
- text-align: center;
- color: #ffffff;
- margin: -41px 0px 0px 22px;
- line-height: 22px;
- margin-bottom: 8px;
- display: block;
- }
- div.empty div.nav-left-header-tab {
- background: url(images/tab_green2.gif) 0 0 no-repeat;
- }
- .nav-left a.active {
- /* background: url(images/arrow_d-green.gif) 5px 10px no-repeat; */
- display: block;
- height: 24px;
- text-decoration: none;
- font-size: 12px;
- font-weight: bold;
- background-color: #F4F1E9;
- color: #4C6F28;
- border-top: 1px solid #D1E5BB;
- border-bottom: 1px solid #B0CB95;
- border-left: 1px solid #DADADA;
- padding: 6px 0px 0px 20px;
- }
- #nav-left-sub a {
- display: block;
- height: 24px;
- text-decoration: none;
- font-size: 12px;
- font-weight: bold;
- background-color: #D6E8C4;
- color: #4C6F28;
- border-top: 1px solid #D6E8C4;
- border-bottom: 1px solid #B0CB95;
- border-left: 1px solid #97B973;
- border-right: 1px solid #8DBE5A;
- padding: 6px 0px 0px 30px;
- }
- * html #nav-left-sub { /* ie6 fix */
- margin-top: -1px;
- }
- *+html #nav-left-sub { /* ie7 fix */
- margin-top: -1px;
- }
- #nav-left-sub a.active-page {
- display: block;
- height: 24px;
- text-decoration: none;
- font-size: 12px;
- font-weight: bold;
- background-color: #ffffff;
- color: #666666;
- border-top: 0px solid #7CA84E;
- border-bottom: 1px solid #B0CB95;
- border-left: 1px solid #97B973;
- border-right: 0px solid #8DBE5A;
- padding: 6px 0px 0px 30px;
- cursor: default; /* turns off hand icon for link */
- }
- /* sX.0 - Main Content */
- .main-content {
- color: #666666;
- position: absolute;
- right: 20px;
- padding-top: 20px;
- width: 585px;
- padding-bottom: 20px;
- }
- div.main-content div.main-content {
-
- }
- .main-content h1 {
- color: #5890D1;
- font-size: 1.9em;
- font-family: Trebuchet MS;
- border-bottom: 1px solid #cccccc;
- margin: 0px 10px 0px 0px;
- }
- .main-content h2 {
- color: #666666;
- font-size: 1.3em;
- font-weight: normal;
- margin: 10px 10px 5px 0px;
- }
- .main-content p {
- margin: 10px 10px 10px 0px;
- line-height: 1.55em;
- }
- /* sX.1 - Main Content Sub Styles */
- .sub-grey {
- border-top: 1px solid #D4D4D4;
- border-bottom: 1px solid #D4D4D4;
- background-color: #F4F4F4;
- margin: 10px 10px 0px 0px;
- padding: 0px 10px 20px 15px;
- }
- .sub-white {
- margin: 10px 10px 0px 0px;
- padding: 0px 10px 20px 15px;
- }
- img.screen-grab-r {
- margin-right: -8px;
- text-align: right;
- padding: 0px 0px 0px 10px;
- }
- div.main-content a.screenshot {
- float: right;
- padding: 10px 10px 0px 0px
- }
- .content-foot {
- border-top: 1px solid #D4D4D4;
- font-size: .9em;
- line-height: 1.45em;
- margin: 10px 20px 0px 0px;
- padding: 10px 10px 30px 0px;
- }
- div.main-content ul {
- position: relative;
- left: -25px;
- }
- div.main-content li {
- margin-bottom: 5px;
- list-style-type: disc
- }
- div.main-content li a {
- color: #6A6CB0;
- }
- /* sX.0 - Footer */
- div.footer {
- color: #666666;
- font-size: .85em;
- font-weight: normal;
- height: 18px;
- margin: 0px auto;
- font-family: Tahoma, Geneva, sans-serif;
- margin-top: 10px;
- }
- .footer ul {
- list-style-type: none;
- }
- .footer li {
- float: left;
- border-right: 1px solid #666666;
- padding: 0px 7px 0px 7px;
- margin-top: 3px;
- }
- .footer a {
- color: #666666;
- text-decoration: none;
- }
- .footer a:hover {
- color: #0653AB;
- text-decoration: none;
- }
- .footer li.line-off {
- border-right: 0px solid #ffffff;
- }
- div.footer strong {
- font-weight: normal;
- }
- /* sX.0 - General Colors */
- .line-grey,.line-grey-tier {
- border-top: 1px solid #A3A3A2;
- }
- .line-grey-tier {
- padding-bottom: 25px;
- }
- .bottom {
- height: 10px;
- }
- div.p10bottom {
- padding-bottom: 10px;
- }
- .clear {
- clear: both;
- }
- table.grid {
- background: #EEEEEE;
- }
- table.grid th {
- background-color: #F4F4F4;
- }
- table.grid td {
- background-color: #FFFFFF;
- }
- div.buttonSubmit {
- position: relative;
- }
- div.buttonSubmit input,div.buttonSubmit span {
- height: 36px;
- position: relative;
- background-image: url(images/button-submit.gif);
- background-repeat: no-repeat;
- background-position: right 0px;
- float: left;
- color: #FFFFFF;
- font-weight: bold;
- padding: 0px 15px 2px 15px;
- margin: 20px 0px 20px 0px;
- border: 0px;
- cursor: pointer;
- z-index: 5;
- }
- div.buttonSubmit input {
- width: auto;
- }
- div.buttonSubmit span {
- width: 4px;
- position: absolute;
- left: 0px;
- top: 0px;
- background-position: left -36px;
- padding: 0px 0px 0px 0px;
- z-index: 10;
- }
- body.safari div.buttonSubmit span {
- display: none
- }
- div.buttonSubmitHover input {
- background-position: right -72px;
- }
- div.buttonSubmitHover span {
- background-position: left -108px;
- }
- a.demoLink {
- padding: 1px 10px 0px 17px;
- height: 24px;
- background: url(images/bullet_triangle_blue.gif) no-repeat 0px 4px;
- display: block;
- float: left;
- }
- div.callout-tan a {
- background: none;
- color: #0653AB;
- margin: auto;
- display: block;
- }
- div.callout-tan a:hover {
- background: none;
- color: #0653AB;
- }
- label.error {
- display: block;
- color: red;
- font-style: italic;
- font-weight: normal;
- }
- input.error {
- border: 2px solid red;
- }
- p.demoBlock {
- border-bottom: 1px solid #DDDDDD;
- padding-bottom: 10px;
- }
- div.left-nav-callout {
- height: 200px;
- width: 190px;
- top: 55px;
- left: 5px;
- position: relative;
- padding-left: 9px;
- padding-top: 13px;
- }
- div.left-nav-callout img.png {
- position: absolute;
- z-index: 0;
- top: 0px;
- left: 0px;
- }
- div.left-nav-callout h6 {
- font: bold 14px tahoma, geneva;
- color: #333333;
- height: 36px;
- padding-left: 5px;
- margin: 0px;
- position: relative;
- z-index: 10;
- }
- div.left-nav-callout a {
- background: url(images/monitor24.gif) no-repeat 0px center;
- padding: 5px 0px 5px 30px;
- display: block;
- font: bold 12px tahoma, geneva;
- color: #336699;
- margin-bottom: 5px;
- position: relative;
- z-index: 10;
- width: 140px;
- }
- form table td {
- padding: 5px;
- }
- form table input {
- width: 200px;
- padding: 3px;
- margin: 0px;
- }
- textarea {
- width: 400px
- }
- td.label {
- width: 150px;
- }
- tr.required td.label {
- font-weight: bold;
- background: url(/images/forms/backRequiredGray.gif) no-repeat right
- center;
- }
- div.subTableDiv {
- width: 500px;
- }
- div.subTableDiv td.label {
- width: 135px;
- }
- ul#homeBlog li div.description {
- display: none;
- }
- td.field input.error, td.field select.error, tr.errorRow td.field input,tr.errorRow td.field select {
- border: 2px solid red;
- background-color: #FFFFD5;
- margin: 0px;
- color: red;
- }
- tr td.field div.formError {
- display: none;
- color: #FF0000;
- }
- tr.errorRow td.field div.formError {
- display: block;
- font-weight: normal;
- }
- div.error {
- color: red;
- }
- div.error a {
- color: #336699;
- font-size: 12px;
- text-decoration: underline
- }
- div.tooltip {
- position: absolute;
- left: 30px;
- bottom: 0px;
- display: none; /* in case javascript is disabled */
- width: 170px;
- background-color: #F4F1E9;
- z-index: 100;
- padding: 10px;
- border: 1px solid #CCCCCC;
- }
- div.offerbox {
- width: 125px;
- float: left;
- position: relative;
- }
- div.offerbox h3 {
- font: bold 17px tahoma, geneva;
- color: #333333;
- height: 55px;
- margin: 0px auto;
- text-align: center;
- }
- div.offerbox h4 {
- height: 100px;
- font: normal 13px tahoma, geneva;
- margin: 0px;
- }
- div.offerbox h5 {
- font: bold 14px tahoma, geneva;
- margin: 0px;
- height: 55px;
- }
- div.offerbox h5 small {
- float: left;
- font-weight: normal;
- font-size: 10px;
- }
- div.offerbox div.learnmore {
- padding-left: 25px;
- }
- div#marketoEditions {
- background: url(images/buynowBack.gif) no-repeat;
- width: 584px;
- height: 376px;
- float: left;
- position: relative;
- margin-bottom: 10px;
- }
- div.offerHeader {
- background: #0D8BBD;
- position: absolute;
- top: 20px;
- width: 266px;
- height: 34px;
- border: 1px solid #e1e4e2;
- }
- div.offerHeader span {
- font: 20px 'trebuchet ms';
- color: #FFFFFF;
- position: absolute;
- left: 0px;
- top: 0px;
- }
- div.offerHeader span.shadow {
- font: 20px 'trebuchet ms';
- color: #333333;
- position: absolute;
- }
- div.offerbox div.buttonSubmit {
- margin: 5px 0px 0px 10px;
- }
- div.footerAddress {
- position: absolute;
- bottom: 30px;
- left: 20px;
- color: #666666;
- font-size: 11px;
- display: none;
- }