.core-sprite-edit{
margin:0;
font-family:"Orion Icon Font";
font-size:16px;
-moz-osx-font-smoothing:grayscale;
-webkit-font-smoothing:antialiased;
line-height:normal;
vertical-align:middle;
color:#555;
border:none;
background:none;
}
.core-sprite-git-logo{
font-family:"Orion Icon Font";
font-size:20px;
-moz-osx-font-smoothing:grayscale;
-webkit-font-smoothing:antialiased;
line-height:normal;
vertical-align:middle;
color:#555;
border:none;
background:none;
}
.core-sprite-download,
.core-sprite-palette,
.core-sprite-collected-errors,
.core-sprite-listed-errors,
.core-sprite-checkmark,
.core-sprite-save,
.core-sprite-eraser{
font-family:"Orion Icon Font";
font-size:16px;
-moz-osx-font-smoothing:grayscale;
-webkit-font-smoothing:antialiased;
line-height:normal;
vertical-align:middle;
color:#555;
border:none;
background:none;
}
.core-sprite-edit:before{
content:"\E008";
}
.core-sprite-palette:before{
content:"\E055";
}
.core-sprite-git-logo:before{
content:"\E03B";
}
button,
.button{
border-style:solid;
border-width:0px;
cursor:pointer;
font-family:'Helvetica Neue',Helvetica,Roboto,Arial,sans-serif;
font-weight:normal;
line-height:normal;
margin:0 0 1.25rem;
position:relative;
text-decoration:none;
text-align:center;
-webkit-appearance:none;
-webkit-border-radius:0;
display:inline-block;
padding-top:1rem;
padding-right:2rem;
padding-bottom:1.0625rem;
padding-left:2rem;
font-size:1rem;
background-color:#FDD900;
border-color:#007095;
color:white;
transition:all 320ms ease-out;
}
button:hover,
.button:hover{
background-color:#c88c35;
color:white;
transition:all 320ms ease-in;
}
button.radius,
.button.radius{
border-radius:3px;
}
button.secondary,
.button.secondary{
background-color:transparent;
border-color:#fab550;
border-width:1px;
color:#c88c35;
}
button.secondary:hover,
.button.secondary:hover{
background-color:#fbbe68;
background-color:rgba(255,255,255,0.4);
}
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,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video{
border:0;
font-size:100%;
font:inherit;
vertical-align:baseline;
margin:0;
padding:0;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section{
display:block;
}
body{
line-height:1;
}
ol,
ul{
list-style:none;
}
blockquote,
q{
quotes:none;
}
blockquote:before,
blockquote:after,
q:before,
q:after{
content:none;
}
table{
border-collapse:collapse;
border-spacing:0;
}
.border-bottom{
border-bottom:1px solid #dddddd;
}
.center{
display:-webkit-flex;
display:-ms-flexbox;
display:flex;
-webkit-align-items:center;
-ms-flex-align:center;
align-items:center;
-webkit-justify-content:center;
-ms-flex-pack:center;
justify-content:center;
}
.center-text{
text-align:center;
}
.hide{
display:none !important;
}
.hide-for-small-only,
.show-for-large-only{
display:none !important;
}
.left{
display:-webkit-flex;
display:-ms-flexbox;
display:flex;
-webkit-align-content:flex-start;
-ms-flex-line-pack:start;
align-content:flex-start;
-webkit-align-items:flex-start;
-ms-flex-align:start;
align-items:flex-start;
}
.no-gutter{
padding-left:0 !important;
padding-right:0 !important;
}
.separate{
-webkit-justify-content:space-between;
-ms-flex-pack:justify;
justify-content:space-between;
}
@font-face{
font-family:'Open Sans';
font-style:normal;
font-weight:300;
src:local('Open Sans Light'),local('OpenSans-Light'),url(https://fonts.gstatic.com/s/opensans/v10/DXI1ORHCpsQm3Vp6mXoaTegdm0LZdjqr5-oayXSOefg.woff2) format('woff2');
unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2212,U+2215,U+E0FF,U+EFFD,U+F000;
}
html{
font-size:16px;
}
body{
color:#292f33;
font-family:'Helvetica Neue',Helvetica,Roboto,Arial,sans-serif;
font-weight:normal;
font-style:normal;
line-height:1.5;
}
h1,
h2,
h3,
h4,
h5,
h6{
font-family:'Helvetica Neue',Helvetica,Roboto,Arial,sans-serif;
font-weight:normal;
font-style:normal;
color:#555555;
text-rendering:optimizeLegibility;
margin-top:0.2rem;
margin-bottom:0.5rem;
line-height:1.4;
}
h1{
font-size:2.125rem;
}
h2{
font-size:1.5rem;
margin-bottom:25px;
}
h3{
font-size:1.02rem;
margin:0;
}
h4{
font-size:1.125rem;
}
h5{
font-size:1.125rem;
}
h6{
font-size:1rem;
}
p{
font-family:inherit;
font-weight:normal;
font-size:0.9rem;
line-height:1.6;
margin-bottom:1.25rem;
text-rendering:optimizeLegibility;
}
body{
margin:0;
}
img{
display:inline-block;
height:auto;
max-width:100%;
vertical-align:middle;
}
*,
*:before,
*:after{
box-sizing:border-box;
}
.container{
margin:0 auto;
max-width:62.5rem;
padding:0 1rem;
}
.row{
display:-webkit-flex;
display:-ms-flexbox;
display:flex;
-webkit-flex-direction:row;
-ms-flex-direction:row;
flex-direction:row;
box-sizing:border-box;
-webkit-flex:0 1 auto;
-ms-flex:0 1 auto;
flex:0 1 auto;
-webkit-flex-wrap:wrap;
-ms-flex-wrap:wrap;
flex-wrap:wrap;
margin-right:-1rem;
margin-left:-1rem;
}
.col-sm,
.col-sm-6,
.col-sm-12{
display:-webkit-flex;
display:-ms-flexbox;
display:flex;
-webkit-flex-direction:column;
-ms-flex-direction:column;
flex-direction:column;
box-sizing:border-box;
-webkit-flex:0 1 auto;
-ms-flex:0 1 auto;
flex:0 1 auto;
-webkit-flex-grow:0;
-ms-flex-positive:0;
flex-grow:0;
-webkit-flex-shrink:0;
-ms-flex-negative:0;
flex-shrink:0;
}
.col-sm{
-webkit-flex-grow:1;
-ms-flex-positive:1;
flex-grow:1;
-webkit-flex-basis:0;
-ms-flex-preferred-size:0;
flex-basis:0;
max-width:100%;
}
.col-sm-6{
-webkit-flex-basis:50%;
-ms-flex-preferred-size:50%;
flex-basis:50%;
max-width:50%;
}
.col-sm-12{
-webkit-flex-basis:100%;
-ms-flex-preferred-size:100%;
flex-basis:100%;
max-width:100%;
}
@media (max-width:40em){
.col-sm-12{
padding:0;
}
.container{
padding:0 2rem;
}
}
@media (min-width:40.063em){
.col-lg,
.col-lg-4,
.col-lg-6,
.col-lg-12{
box-sizing:border-box;
display:-webkit-flex;
display:-ms-flexbox;
display:flex;
-webkit-flex:0 1 auto;
-ms-flex:0 1 auto;
flex:0 1 auto;
-webkit-flex-direction:column;
-ms-flex-direction:column;
flex-direction:column;
-webkit-flex-grow:0;
-ms-flex-positive:0;
flex-grow:0;
-webkit-flex-shrink:0;
-ms-flex-negative:0;
flex-shrink:0;
padding:0 1rem;
}
.col-lg{
-webkit-flex-grow:1;
-ms-flex-positive:1;
flex-grow:1;
-webkit-flex-basis:0;
-ms-flex-preferred-size:0;
flex-basis:0;
max-width:100%;
}
.col-lg-4{
-webkit-flex-basis:33.333333333%;
-ms-flex-preferred-size:33.333333333%;
flex-basis:33.333333333%;
max-width:33.333333333%;
}
.col-lg-6{
-webkit-flex-basis:50%;
-ms-flex-preferred-size:50%;
flex-basis:50%;
max-width:50%;
}
.col-lg-12{
-webkit-flex-basis:100%;
-ms-flex-preferred-size:100%;
flex-basis:100%;
max-width:100%;
}
.hide-for-small-only,
.show-for-large-only{
display:inherit !important;
}
.show-for-small-only,
.hide-for-large-only{
display:none !important;
}
}
header .logo-container{
margin-top:20px;
margin-bottom:20px;
}
header .orion-auth-buttons{
display:-webkit-flex;
display:-ms-flexbox;
display:flex;
-webkit-align-content:flex-start;
-ms-flex-line-pack:start;
align-content:flex-start;
-webkit-align-items:flex-start;
-ms-flex-align:start;
align-items:flex-start;
-webkit-flex-wrap:nowrap;
-ms-flex-wrap:nowrap;
flex-wrap:nowrap;
-webkit-justify-content:flex-end;
-ms-flex-pack:end;
justify-content:flex-end;
}
header .orion-auth-buttons .orion-link-button{
padding:10px;
margin-top:26px;
margin-bottom:1.26rem;
font-size:12px;
color:#777777;
background:#ffffff;
}
header .orion-auth-buttons .orion-link-button:hover{
color:#ffffff;
background-color:#FDD900;
transition:all 320ms ease-in;
}
header .orion-container{
display:-webkit-flex;
display:-ms-flexbox;
display:flex;
width:100%;
max-width:62.5rem;
margin:0 auto;
-webkit-flex-direction:row;
-ms-flex-direction:row;
flex-direction:row;
-webkit-align-content:flex-start;
-ms-flex-line-pack:start;
align-content:flex-start;
-webkit-align-items:flex-start;
-ms-flex-align:start;
align-items:flex-start;
-webkit-flex-wrap:nowrap;
-ms-flex-wrap:nowrap;
flex-wrap:nowrap;
-webkit-justify-content:space-between;
-ms-flex-pack:justify;
justify-content:space-between;
}
.intro .orionExplained{
max-width:80%;
padding:60px 30px 20px 30px;
margin-bottom:0;
font-family:'Open Sans','Helvetica Neue',Helvetica,Roboto,Arial,sans-serif;
font-size:34px;
color:#555555;
}
.intro .orionExplained ~ .small{
color:#777777;
}
.intro .tryItContainer{
padding:0;
}
.intro .tryItContainer #tryIt{
z-index:1000;
display:block;
width:140px;
margin-right:auto;
margin-left:auto;
}
.intro .tryItContainer #tryIt.fixed-button{
position:fixed;
top:10px;
right:0;
left:0;
margin:0 auto;
}
.images{
margin-top:40px;
padding-bottom:40px;
}
.contentSwitcher .row{
border-top:1px solid #dddddd;
border-bottom:1px solid #dddddd;
}
.contentSwitcher .contentContainer{
color:#555555;
padding:0 20px 20px 20px;
transition:all 320ms ease-in;
}
.contentSwitcher .contentContainer h2{
font-family:'Open Sans','Helvetica Neue',Helvetica,Roboto,Arial,sans-serif;
}
.contentSwitcher .contentContainer.current{
background-color:#fddfb3;
}
.contentSwitcher .contentContainer:hover{
cursor:pointer;
background-color:#fddfb3;
transition:all 320ms ease-out;
}
.contentSwitcher .contentContainer .core-sprite-edit,
.contentSwitcher .contentContainer .core-sprite-palette,
.contentSwitcher .contentContainer .core-sprite-git-logo{
padding:30px;
font-size:32px;
}
.contentSwitcher .contentContainer .repeatTitle{
position:relative;
bottom:4px;
left:5px;
display:inline-block;
font-family:'Open Sans','Helvetica Neue',Helvetica,Roboto,Arial,sans-serif;
font-size:18px;
font-weight:bold;
}
.contentSwitcher .contentContainer .titleContent .icon{
line-height:100%;
text-align:center;
}
.contentSwitcher .mobileContent .contentImageText{
margin-top:8px;
}
.downloadsContainer{
display:flex;
flex-direction:column;
display:-webkit-flex;
display:-ms-flexbox;
display:flex;
-webkit-align-items:center;
-ms-flex-align:center;
align-items:center;
flex-direction:column;
-ms-flex-direction:column;
-webkit-flex-direction:column;
}
.pre-footer{
padding-top:80px;
margin-top:80px;
background-color:#fddfb3;
}
.pre-footer a{
color:#c88c35;
text-decoration:none;
}
.pre-footer h2{
font-family:'Open Sans','Helvetica Neue',Helvetica,Roboto,Arial,sans-serif;
}
.pre-footer p{
color:#555555;
margin-bottom:30px;
}
.pre-footer .button{
margin-bottom:50px;
}
.footer{
position:absolute;
bottom:0;
width:100%;
padding:0;
}
.social{
padding:1.25rem;
margin-bottom:1.25rem;
}
.social #getInTouchDetails{
color:#222222;
}
.social .orion-social-buttons{
float:none !important;
display:-webkit-flex;
display:-ms-flexbox;
display:flex;
-webkit-align-items:center;
-ms-flex-align:center;
align-items:center;
-webkit-justify-content:center;
-ms-flex-pack:center;
justify-content:center;
}
.social .orion-social-button{
display:inline-block;
width:45px;
height:45px;
margin:2px;
}
.social .orion-social-button > a{
transition:all 320ms ease-in;
display:inline-block;
width:100%;
height:100%;
font-size:18px;
background-size:45px 45px;
border-color:black;
border-radius:100px;
}
.social .orion-social-button > a.orion-google{
background-image:url(../images/social/g-plus.png);
}
.social .orion-social-button > a.orion-twitter{
background-image:url(../images/social/twitter.png);
}
.social .orion-social-button > a.orion-github{
background-image:url(../images/social/github.png);
}
.social .orion-social-button > a.orion-email{
background-image:url(../images/social/e-mail.png);
}
.social .orion-social-button > a:hover{
transition:all 320ms ease-out;
background-color:#FDD900;
opacity:0.9;
}
.social .orion-social-button > a > i{
width:100% !important;
font-size:1.5em;
line-height:45px;
transition:320ms;
text-align:center;
color:#555555;
}
.social .orion-social-button > a > i:hover{
color:#FDD900;
background-color:#ffffff;
transition:all 320ms ease-in;
}
.social .orion-google > i{
line-height:50px !important;
}
.social .orion-twitter > i{
line-height:49px !important;
}
.social .orion-email > i{
line-height:48px !important;
}
@media (max-width:62.5em){
header .header-content{
-webkit-flex-direction:column;
-ms-flex-direction:column;
flex-direction:column;
-webkit-align-items:center;
-ms-flex-align:center;
align-items:center;
}
header .orion-logo{
display:-webkit-flex;
display:-ms-flexbox;
display:flex;
-webkit-align-items:center;
-ms-flex-align:center;
align-items:center;
-webkit-justify-content:center;
-ms-flex-pack:center;
justify-content:center;
}
}
@media (max-width:40em){
.intro .orionExplained{
font-size:24px;
max-width:100%;
padding:15px;
}
.intro .tryItContainer{
padding:0;
}
.intro .tryItContainer #tryIt{
width:140px;
}
.intro .tryItContainer #tryIt.fixed-button{
top:0;
width:100%;
border-radius:0;
transition:width 320ms ease-out;
}
.imageRow{
padding-bottom:0;
}
.contentSwitcher .row{
border-bottom:none;
}
.contentSwitcher .contentContainer{
padding:0;
}
.contentSwitcher .contentContainer.current{
background-color:#ffffff;
}
.contentSwitcher .contentContainer .icon{
display:block;
padding:20px;
}
.orion-auth-buttons{
display:-webkit-flex;
display:-ms-flexbox;
display:flex;
float:none !important;
-webkit-align-items:center;
-ms-flex-align:center;
align-items:center;
-webkit-justify-content:center;
-ms-flex-pack:center;
justify-content:center;
}
.pre-footer{
margin-top:0;
}
.pre-footer .button{
display:block;
width:100%;
}
}
