495 lines
9.9 KiB
CSS
495 lines
9.9 KiB
CSS
|
body {
|
||
|
|
margin:0;
|
||
|
|
padding:0;
|
||
|
|
background-color:#e6f5fc;
|
||
|
|
font-family: Helvetica, Arial;
|
||
|
|
padding-left: calc(100vw - 100%);
|
||
|
|
background: url(images/body_background.png) repeat-x 0 -15px;
|
||
|
|
padding-left: calc(100vw - 100%);
|
||
|
|
background-color:#e6f5fc;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
#ace_editor_demo, #embedded_ace_code {
|
||
|
|
height: 275px;
|
||
|
|
border: 1px solid #DDD;
|
||
|
|
border-radius: 4px;
|
||
|
|
border-bottom-right-radius: 0px;
|
||
|
|
margin-top: 5px;
|
||
|
|
}
|
||
|
|
|
||
|
|
#ace_editor_demo {
|
||
|
|
margin-bottom: 0px;
|
||
|
|
}
|
||
|
|
|
||
|
|
#embedded_ace_code {
|
||
|
|
height: 525px;
|
||
|
|
}
|
||
|
|
|
||
|
|
h1, h2, h3, h4, h5, h6 {
|
||
|
|
font-family: Helvetica;
|
||
|
|
font-weight: 100;
|
||
|
|
margin:0;
|
||
|
|
padding:0;
|
||
|
|
}
|
||
|
|
|
||
|
|
h2, h3, h4, h5, h6 {
|
||
|
|
padding-top: 30px;
|
||
|
|
border-bottom: 1px solid #bedaea;
|
||
|
|
}
|
||
|
|
|
||
|
|
H2 {
|
||
|
|
font-size:28px;
|
||
|
|
color:#263842;
|
||
|
|
padding-bottom:6px;
|
||
|
|
}
|
||
|
|
|
||
|
|
H3 {
|
||
|
|
font-size:22px;
|
||
|
|
color:#253741;
|
||
|
|
margin-bottom:8px;
|
||
|
|
}
|
||
|
|
|
||
|
|
H4 {
|
||
|
|
font-size:21px;
|
||
|
|
color:#222222;
|
||
|
|
margin-bottom:8px;
|
||
|
|
}
|
||
|
|
|
||
|
|
P {
|
||
|
|
padding:13px 0;
|
||
|
|
margin:0;
|
||
|
|
line-height:21px;
|
||
|
|
font-size: 15px;
|
||
|
|
}
|
||
|
|
|
||
|
|
UL{
|
||
|
|
font-size: 15px;
|
||
|
|
}
|
||
|
|
|
||
|
|
#header {
|
||
|
|
height: 93px;
|
||
|
|
position: relative;
|
||
|
|
background: linear-gradient(to bottom, #c0deef, #cde9fa 17px, #daf0fb 100px, #e4f4fc 150px, #e6f5fc 250px, #e6f5fc 100%);
|
||
|
|
border-bottom: 1px solid #C9E8FA;
|
||
|
|
margin-top: 40px;
|
||
|
|
}
|
||
|
|
|
||
|
|
#header .content .signature {
|
||
|
|
font-family:Trebuchet MS;
|
||
|
|
font-size:11px;
|
||
|
|
color:#ebe4d6;
|
||
|
|
position:absolute;
|
||
|
|
bottom:5px;
|
||
|
|
right:42px;
|
||
|
|
letter-spacing : 1px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.content {
|
||
|
|
width:970px;
|
||
|
|
position:relative;
|
||
|
|
margin:0 auto;
|
||
|
|
}
|
||
|
|
|
||
|
|
#header .content {
|
||
|
|
height: 100%;
|
||
|
|
z-index: 90000;
|
||
|
|
}
|
||
|
|
|
||
|
|
#header .content .logo {
|
||
|
|
width: 141px;
|
||
|
|
height: 92px;
|
||
|
|
background: url(images/logo_half.png) no-repeat 0 0;
|
||
|
|
position: absolute;
|
||
|
|
top: -14px;
|
||
|
|
left: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
#header .content .title {
|
||
|
|
width: 605px;
|
||
|
|
height: 58px;
|
||
|
|
background: url(images/ace.png) no-repeat 0 0;
|
||
|
|
position: absolute;
|
||
|
|
top: 22px;
|
||
|
|
left: 329px;
|
||
|
|
}
|
||
|
|
|
||
|
|
#wrapper .content {
|
||
|
|
font-family:Arial;
|
||
|
|
font-size:14px;
|
||
|
|
color:#222222;
|
||
|
|
width: 960px;
|
||
|
|
}
|
||
|
|
|
||
|
|
#wrapper .content .column1 {
|
||
|
|
position:relative;
|
||
|
|
overflow:hidden;
|
||
|
|
float:left;
|
||
|
|
width:315px;
|
||
|
|
margin-right:31px;
|
||
|
|
}
|
||
|
|
|
||
|
|
#wrapper .content .column2 {
|
||
|
|
position:relative;
|
||
|
|
overflow:hidden;
|
||
|
|
float:left;
|
||
|
|
/*width:600px;*/
|
||
|
|
}
|
||
|
|
|
||
|
|
#top_container h1 {
|
||
|
|
font-size: 68px;
|
||
|
|
line-height: 60px;
|
||
|
|
width: 515px;
|
||
|
|
float: left;
|
||
|
|
font-weight: 100;
|
||
|
|
font-family: Helvetica;
|
||
|
|
padding: 65px 0 0 14px;
|
||
|
|
color: #333;
|
||
|
|
}
|
||
|
|
|
||
|
|
#top_container {
|
||
|
|
background: linear-gradient(to bottom, #fff 0, #fff 2px, #f7f7f7 2px, #f2f2f2 298px);
|
||
|
|
overflow: hidden;
|
||
|
|
padding: 11px 36px 19px 40px;
|
||
|
|
height: 267px;
|
||
|
|
transition: height 0.4s ease-out, opacity 0.4s ease-out, padding 0.4s ease-out, margin 0.4s ease-out;
|
||
|
|
opacity: 1;
|
||
|
|
margin-top: 25px;
|
||
|
|
}
|
||
|
|
|
||
|
|
#top_container.collapse {
|
||
|
|
padding: 0px;
|
||
|
|
height: 0px;
|
||
|
|
opacity: 0;
|
||
|
|
margin: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
#page_logo {
|
||
|
|
padding: 35px 0 15px 0;
|
||
|
|
width: 350px;
|
||
|
|
float: right;
|
||
|
|
text-align: center;
|
||
|
|
height: 220px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.fork_on_github {
|
||
|
|
width:310px;
|
||
|
|
height:80px;
|
||
|
|
background:url(images/fork_on_github.png) no-repeat 0 0;
|
||
|
|
position:relative;
|
||
|
|
overflow:hidden;
|
||
|
|
margin-top:49px;
|
||
|
|
cursor:pointer;
|
||
|
|
}
|
||
|
|
|
||
|
|
.fork_on_github:hover {
|
||
|
|
background-position:0 -80px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.divider {
|
||
|
|
height: 1px;
|
||
|
|
background-color:#bedaea;
|
||
|
|
margin-bottom:3px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.menu, .site-menu {
|
||
|
|
padding: 25px 0 0 35px;
|
||
|
|
}
|
||
|
|
|
||
|
|
UL.content-list {
|
||
|
|
padding: 15px 0 15px 20px;
|
||
|
|
margin:0;
|
||
|
|
}
|
||
|
|
|
||
|
|
UL.content-list li {
|
||
|
|
padding-left: 10px;
|
||
|
|
padding-bottom: 3px;
|
||
|
|
}
|
||
|
|
|
||
|
|
ul.menu-list {
|
||
|
|
padding: 15px 0;
|
||
|
|
margin: 0 0 20px 0;
|
||
|
|
list-style-type: none;
|
||
|
|
line-height: 16px;
|
||
|
|
overflow: auto;
|
||
|
|
}
|
||
|
|
|
||
|
|
ul.menu-list li {
|
||
|
|
color: #2557B4;
|
||
|
|
font-family: Helvetica, Trebuchet MS;
|
||
|
|
font-size: 12px;
|
||
|
|
padding: 5px;
|
||
|
|
cursor: pointer;
|
||
|
|
display: block;
|
||
|
|
float: left;
|
||
|
|
margin-right: 15px;
|
||
|
|
margin-bottom: 20px;
|
||
|
|
width: 100px;
|
||
|
|
height: 90px;
|
||
|
|
border-radius: 5px;
|
||
|
|
position: relative;
|
||
|
|
background: rgba(255, 255, 255, 0.7);
|
||
|
|
margin-left: 22px;
|
||
|
|
margin-top: 20px;
|
||
|
|
box-shadow: 0 0 4px rgba(0, 0, 0, 0.1);
|
||
|
|
transition: box-shadow 0.4s;
|
||
|
|
border: 1px solid #999;
|
||
|
|
background-image: -webkit-repeating-linear-gradient(left, hsla(0,0%,100%,0) 0%, hsla(0,0%,100%,0) 6%, hsla(0,0%,100%, .1) 7.5%),
|
||
|
|
-webkit-repeating-linear-gradient(left, hsla(0,0%, 0%,0) 0%, hsla(0,0%, 0%,0) 4%, hsla(0,0%, 0%,.03) 4.5%),
|
||
|
|
-webkit-repeating-linear-gradient(left, hsla(0,0%,100%,0) 0%, hsla(0,0%,100%,0) 1.2%, hsla(0,0%,100%,.15) 2.2%),
|
||
|
|
|
||
|
|
-webkit-linear-gradient(-90deg, hsl(0,0%,78%) 0%,
|
||
|
|
hsl(0,0%,90%) 47%,
|
||
|
|
hsl(0,0%,78%) 53%,
|
||
|
|
hsl(0,0%,70%)100%);
|
||
|
|
background-image: -moz-repeating-linear-gradient(left, hsla(0,0%,100%,0) 0%, hsla(0,0%,100%,0) 6%, hsla(0,0%,100%, .1) 7.5%),
|
||
|
|
-moz-repeating-linear-gradient(left, hsla(0,0%, 0%,0) 0%, hsla(0,0%, 0%,0) 4%, hsla(0,0%, 0%,.03) 4.5%),
|
||
|
|
-moz-repeating-linear-gradient(left, hsla(0,0%,100%,0) 0%, hsla(0,0%,100%,0) 1.2%, hsla(0,0%,100%,.15) 2.2%),
|
||
|
|
|
||
|
|
-moz-linear-gradient(-90deg, hsl(0,0%,78%) 0%,
|
||
|
|
hsl(0,0%,90%) 47%,
|
||
|
|
hsl(0,0%,78%) 53%,
|
||
|
|
hsl(0,0%,70%)100%);
|
||
|
|
}
|
||
|
|
|
||
|
|
ul.menu-list li:hover {
|
||
|
|
box-shadow: 0 0 4px rgba(0, 0, 0, 0.5);
|
||
|
|
-moz-box-shadow: 0 0 4px rgba(0, 0, 0, 0.5);
|
||
|
|
}
|
||
|
|
|
||
|
|
ul.menu-list li a {
|
||
|
|
position: absolute;
|
||
|
|
bottom: 0px;
|
||
|
|
left: 0px;
|
||
|
|
color: white;
|
||
|
|
text-align: center;
|
||
|
|
font-weight: bold;
|
||
|
|
text-shadow: 0px 0px 4px rgba(0, 0, 0, 0.8);
|
||
|
|
width: 100%;
|
||
|
|
display: block;
|
||
|
|
background: rgba(0, 0, 0, 0.6);
|
||
|
|
line-height: 12px;
|
||
|
|
padding: 4px 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
UL.menu-list LI a:hover {
|
||
|
|
text-decoration: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
li#add_your_site p {
|
||
|
|
font-size: 32px;
|
||
|
|
border: 3px solid #34A034;
|
||
|
|
color: #34A034;
|
||
|
|
border-radius: 34px;
|
||
|
|
padding: 3px 4px 4px 5px;
|
||
|
|
width: 20px;
|
||
|
|
height: 22px;
|
||
|
|
line-height: 18px;
|
||
|
|
position: relative;
|
||
|
|
left: 33px;
|
||
|
|
top: 22px;
|
||
|
|
background: #fff;
|
||
|
|
}
|
||
|
|
|
||
|
|
ul.menu-list li#add_your_site a {
|
||
|
|
color: #A3EEA3;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* This is the animation code. */
|
||
|
|
@keyframes example {
|
||
|
|
0% { transform: rotate(0deg); }
|
||
|
|
25% { transform: rotate(3deg); }
|
||
|
|
50% { transform: rotate(0deg); }
|
||
|
|
75% { transform: rotate(-3deg); }
|
||
|
|
}
|
||
|
|
|
||
|
|
/* This is the element that we apply the animation to. */
|
||
|
|
li#add_your_site {
|
||
|
|
animation-name: example;
|
||
|
|
animation-duration: 0.4s;
|
||
|
|
animation-timing-function: ease; /* ease is the default */
|
||
|
|
animation-delay: 0s; /* 0 is the default */
|
||
|
|
animation-iteration-count: infinite; /* 1 is the default */
|
||
|
|
animation-direction: alternate; /* normal is the default */
|
||
|
|
}
|
||
|
|
|
||
|
|
A {
|
||
|
|
color:#2557b4;
|
||
|
|
text-decoration:none;
|
||
|
|
}
|
||
|
|
|
||
|
|
A:hover {
|
||
|
|
text-decoration:underline;
|
||
|
|
}
|
||
|
|
|
||
|
|
#footer {
|
||
|
|
height:40px;
|
||
|
|
position:relative;
|
||
|
|
overflow:hidden;
|
||
|
|
background:url(images/bottombar.png) repeat-x 0 0;
|
||
|
|
position:relative;
|
||
|
|
margin-top:40px;
|
||
|
|
}
|
||
|
|
|
||
|
|
UL.menu-footer {
|
||
|
|
padding:0;
|
||
|
|
margin:8px 11px 0 0;
|
||
|
|
list-style-type:none;
|
||
|
|
float:right;
|
||
|
|
}
|
||
|
|
|
||
|
|
UL.menu-footer LI {
|
||
|
|
color:white;
|
||
|
|
font-family:Arial;
|
||
|
|
font-size:12px;
|
||
|
|
display:inline-block;
|
||
|
|
margin:0 1px;
|
||
|
|
}
|
||
|
|
|
||
|
|
UL.menu-footer LI A {
|
||
|
|
color:#8dd0ff;
|
||
|
|
text-decoration:none;
|
||
|
|
}
|
||
|
|
|
||
|
|
UL.menu-footer LI A:hover {
|
||
|
|
text-decoration:underline;
|
||
|
|
}
|
||
|
|
|
||
|
|
.nav-pills.nav {
|
||
|
|
margin: 10px 0 25px 0;
|
||
|
|
padding: 0;
|
||
|
|
border-radius: 5px;
|
||
|
|
border: 1px solid #d7d7d7;
|
||
|
|
background: #eeeeee;
|
||
|
|
background: linear-gradient(to bottom, #eeeeee 0%,#cccccc 100%);
|
||
|
|
overflow: hidden;
|
||
|
|
}
|
||
|
|
|
||
|
|
.nav-pills > .active > a, .nav-pills > .active > a:hover {
|
||
|
|
color: white;
|
||
|
|
background-color: #555;
|
||
|
|
box-shadow: inset 0 0 8px rgba(0, 0, 0, 0.8)!important;
|
||
|
|
text-shadow: 0px 0px 3px #000;
|
||
|
|
}
|
||
|
|
|
||
|
|
.nav-tabs > li > a, .nav-pills > li > a {
|
||
|
|
padding-right: 17px;
|
||
|
|
padding-left: 17px;
|
||
|
|
border-right: 1px solid #bbb;
|
||
|
|
border-radius: 0;
|
||
|
|
margin: 0;
|
||
|
|
line-height: 25px;
|
||
|
|
font-size: 14px;
|
||
|
|
color: #333;
|
||
|
|
text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.3);
|
||
|
|
box-shadow: 0 0 1px rgba(255, 255, 255, 1);
|
||
|
|
transition: background 0.2s;
|
||
|
|
}
|
||
|
|
|
||
|
|
.nav.nav-pills li:first-child > a {
|
||
|
|
padding-left: 28px;
|
||
|
|
padding-right: 28px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.nav.nav-pills li:first-child > a > img {
|
||
|
|
width: 34px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.nav.nav-pills li:last-child > a {
|
||
|
|
border-right: none;
|
||
|
|
box-shadow: none;
|
||
|
|
-moz-box-shadow: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
.tab-content {
|
||
|
|
margin-bottom: 50px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.tab-content > .active, .pill-content > .active {
|
||
|
|
padding: 25px 30px;
|
||
|
|
}
|
||
|
|
|
||
|
|
#top_container, .tab-content > .active, .pill-content > .active {
|
||
|
|
border: 1px solid #DDD;
|
||
|
|
border-radius: 5px;
|
||
|
|
-moz-border-radius: 5px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.tab-content > .active, .pill-content > .active {
|
||
|
|
background: rgba(255, 255, 255, 0.7);
|
||
|
|
}
|
||
|
|
|
||
|
|
pre .xml .javascript, pre .xml .css {
|
||
|
|
opacity: 1;
|
||
|
|
}
|
||
|
|
|
||
|
|
#embed_link {
|
||
|
|
text-align: right;
|
||
|
|
padding-top: 0;
|
||
|
|
}
|
||
|
|
#embed_link a {
|
||
|
|
color: #059C05;
|
||
|
|
font-weight: 100;
|
||
|
|
font-family: helvetica;
|
||
|
|
font-size: 13px;
|
||
|
|
display: inline-block;
|
||
|
|
padding: 2px 10px;
|
||
|
|
background: #f4f4f4;
|
||
|
|
border: 1px solid #ddd;
|
||
|
|
border-top: none;
|
||
|
|
border-bottom-left-radius: 4px;
|
||
|
|
border-bottom-right-radius: 4px;
|
||
|
|
text-shadow: 0px 1px 0px rgba(255, 255, 255, 1);
|
||
|
|
text-decoration: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
p.highlight_note {
|
||
|
|
padding: 8px 35px 8px 14px;
|
||
|
|
margin-top: 10px;
|
||
|
|
color: #A0762E;
|
||
|
|
text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
|
||
|
|
background-color: #FCF8E3;
|
||
|
|
border: 1px solid #CA9C44;
|
||
|
|
border-radius: 4px;
|
||
|
|
}
|
||
|
|
|
||
|
|
p.highlight_note a {
|
||
|
|
color: #537CC7;
|
||
|
|
}
|
||
|
|
|
||
|
|
.prod_no_image {
|
||
|
|
position: relative; left: -10px; top: -12px;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
#api {
|
||
|
|
padding: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
/*https://github.com/twitter/bootstrap/issues/5262*/
|
||
|
|
img {
|
||
|
|
max-width: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
.text-logo{
|
||
|
|
color: black;
|
||
|
|
font-size: 24px;
|
||
|
|
font-weight: lighter;
|
||
|
|
margin-top: 23px;
|
||
|
|
text-align: center;
|
||
|
|
text-shadow: 1px 17px 2px gray, 1px 1px 2px gray;
|
||
|
|
}
|
||
|
|
|
||
|
|
.menu-list>li>img {
|
||
|
|
position: relative;
|
||
|
|
}
|
||
|
|
|
||
|
|
.rotating-logo {
|
||
|
|
transform: rotate(0deg);
|
||
|
|
transition: all 0.5s ease-out;
|
||
|
|
}
|
||
|
|
.rotating-logo:hover {
|
||
|
|
transform: rotate(360deg);
|
||
|
|
transition: all 0.5s ease-in-out;
|
||
|
|
}
|