@import url("https://fonts.googleapis.com/css?family=Roboto+Condensed:400,300,700"); | |
@import url("https://fonts.googleapis.com/css?family=Open+Sans:400,300,400italic,300italic,600,600italic,700,700italic,800,800italic"); | |
@font-face { | |
font-family: 'icomoon'; | |
src: url('../fonts/icomoon.eot?z8h1zd'); | |
src: url('../fonts/icomoon.eot?z8h1zd#iefix') format('embedded-opentype'), | |
url('../fonts/icomoon.ttf?z8h1zd') format('truetype'), | |
url('../fonts/icomoon.woff?z8h1zd') format('woff'), | |
url('../fonts/icomoon.svg?z8h1zd#icomoon') format('svg'); | |
font-weight: normal; | |
font-style: normal; | |
} | |
[class^="icon-"], [class*=" icon-"] { | |
/* use !important to prevent issues with browser extensions that change fonts */ | |
font-family: 'icomoon' !important; | |
speak: none; | |
font-style: normal; | |
font-weight: normal; | |
font-variant: normal; | |
text-transform: none; | |
line-height: 1; | |
/* Better Font Rendering =========== */ | |
-webkit-font-smoothing: antialiased; | |
-moz-osx-font-smoothing: grayscale; | |
} | |
@font-face { | |
font-family: 'menu'; | |
src: url('../fonts/menu.eot?799wtq'); | |
src: url('../fonts/menu.eot?799wtq#iefix') format('embedded-opentype'), | |
url('../fonts/menu.ttf?799wtq') format('truetype'), | |
url('../fonts/menu.woff?799wtq') format('woff'), | |
url('../fonts/menu.svg?799wtq#menu') format('svg'); | |
font-weight: normal; | |
font-style: normal; | |
} | |
[class^="menuicon-"], [class*=" menuicon-"] { | |
/* use !important to prevent issues with browser extensions that change fonts */ | |
font-family: 'menu' !important; | |
speak: none; | |
font-style: normal; | |
font-weight: normal; | |
font-variant: normal; | |
text-transform: none; | |
line-height: 1; | |
/* Better Font Rendering =========== */ | |
-webkit-font-smoothing: antialiased; | |
-moz-osx-font-smoothing: grayscale; | |
} | |
.menuicon-keyboard_arrow_right:before { | |
content: "\e900"; | |
} | |
.menuicon-keyboard_arrow_left:before { | |
content: "\e901"; | |
} | |
.menuicon-menu:before { | |
content: "\e9bd"; | |
} | |
.icon-envelope:before { | |
content: "\e903"; | |
} | |
.icon-twitter:before { | |
content: "\e901"; | |
} | |
.icon-slack:before { | |
content: "\e909"; | |
} | |
.icon-keyboard_arrow_right:before { | |
content: "\e900"; | |
} | |
/* normalize.css 2012-07-07T09:50 UTC - http://github.com/necolas/normalize.css */ | |
/* ========================================================================== HTML5 display definitions ========================================================================== */ | |
/** Correct `block` display not defined in IE 8/9. */ | |
article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary { display: block; } | |
/** Correct `inline-block` display not defined in IE 8/9. */ | |
audio, canvas, video { display: inline-block; } | |
/** Prevent modern browsers from displaying `audio` without controls. Remove excess height in iOS 5 devices. */ | |
audio:not([controls]) { display: none; height: 0; } | |
/** Address `[hidden]` styling not present in IE 8/9. Hide the `template` element in IE, Safari, and Firefox < 22. */ | |
[hidden], template { display: none; } | |
/* ========================================================================== Base ========================================================================== */ | |
/** 1. Set default font family to sans-serif. 2. Prevent iOS text size adjust after orientation change, without disabling user zoom. */ | |
html { font-family: sans-serif; /* 1 */ -ms-text-size-adjust: 100%; /* 2 */ -webkit-text-size-adjust: 100%; /* 2 */ } | |
/** Remove default margin. */ | |
body { margin: 0; } | |
/* ========================================================================== Links ========================================================================== */ | |
/** Remove the gray background color from active links in IE 10. */ | |
a { background: transparent; } | |
/** Address `outline` inconsistency between Chrome and other browsers. */ | |
a:focus { outline: thin dotted; } | |
/** Improve readability when focused and also mouse hovered in all browsers. */ | |
a:active, a:hover { outline: 0; } | |
/* ========================================================================== Typography ========================================================================== */ | |
/** Address variable `h1` font-size and margin within `section` and `article` contexts in Firefox 4+, Safari 5, and Chrome. */ | |
h1 { font-size: 2em; margin: 0.67em 0; } | |
/** Address styling not present in IE 8/9, Safari 5, and Chrome. */ | |
abbr[title] { border-bottom: 1px dotted; } | |
/** Address style set to `bolder` in Firefox 4+, Safari 5, and Chrome. */ | |
b, strong, .strong { font-weight: bold; } | |
/** Address styling not present in Safari 5 and Chrome. */ | |
dfn, em, .em { font-style: italic; } | |
/** Address differences between Firefox and other browsers. */ | |
hr { -moz-box-sizing: content-box; box-sizing: content-box; height: 0; } | |
/* proper formatting (http://blog.fontdeck.com/post/9037028497/hyphens) | |
*/ | |
p { -webkit-hyphens: auto; -epub-hyphens: auto; -moz-hyphens: auto; hyphens: auto; } | |
/* Addresses margins set differently in IE6/7. */ | |
pre { margin: 0; } | |
/** Correct font family set oddly in Safari 5 and Chrome. */ | |
code, kbd, pre, samp { font-family: monospace, serif; font-size: 1em; } | |
/** Improve readability of pre-formatted text in all browsers. */ | |
pre { white-space: pre-wrap; } | |
/** Set consistent quote types. */ | |
q { quotes: "\201C" "\201D" "\2018" "\2019"; } | |
/** Address inconsistent and variable font size in all browsers. */ | |
q:before, q:after { content: ''; content: none; } | |
small, .small { font-size: 75%; } | |
/** Prevent `sub` and `sup` affecting `line-height` in all browsers. */ | |
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } | |
sup { top: -0.5em; } | |
sub { bottom: -0.25em; } | |
/* ========================================================================== Lists | |
========================================================================== */ | |
/* Addresses margins set differently in IE6/7. */ | |
dl, menu, ol, ul { margin: 1em 0; } | |
dd { margin: 0; } | |
/* Addresses paddings set differently in IE6/7. */ | |
menu { padding: 0 0 0 40px; } | |
ol, ul { padding: 0; /*list-style-type: none;*/ } | |
/* Corrects list images handled incorrectly in IE7. */ | |
nav ul, nav ol { list-style: none; list-style-image: none; } | |
/* =============================================== Embedded content ========================================================================== */ | |
/** Remove border when inside `a` element in IE 8/9. */ | |
img { border: 0; } | |
/** Correct overflow displayed oddly in IE 9. */ | |
svg:not(:root) { overflow: hidden; } | |
/* ========================================================================== Figures ========================================================================== */ | |
/** Address margin not present in IE 8/9 and Safari 5. */ | |
figure { margin: 0; } | |
/* ========================================================================== Forms ========================================================================== */ | |
/** Define consistent border, margin, and padding. */ | |
fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em; } | |
/** 1. Correct `color` not being inherited in IE 8/9. 2. Remove padding so people aren't caught out if they zero out fieldsets. */ | |
legend { border: 0; /* 1 */ padding: 0; /* 2 */ } | |
/** 1. Correct font family not being inherited in all browsers. 2. Correct font size not being inherited in all browsers. 3. Address margins set differently in Firefox 4+, Safari 5, and Chrome. */ | |
button, input, select, textarea { font-family: inherit; /* 1 */ font-size: 100%; /* 2 */ margin: 0; /* 3 */ } | |
/** Address Firefox 4+ setting `line-height` on `input` using `!important` in the UA stylesheet. */ | |
button, input { line-height: normal; } | |
/** Address inconsistent `text-transform` inheritance for `button` and `select`. All other form control elements do not inherit `text-transform` values. Correct `button` style inheritance in Chrome, Safari 5+, and IE 8+. Correct `select` style inheritance in Firefox 4+ and Opera. */ | |
button, select { text-transform: none; } | |
/** 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` and `video` controls. 2. Correct inability to style clickable `input` types in iOS. 3. Improve usability and consistency of cursor style between image-type `input` and others. */ | |
button, html input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: button; /* 2 */ cursor: pointer; /* 3 */ } | |
/** Re-set default cursor for disabled elements. */ | |
button[disabled], html input[disabled] { cursor: default; } | |
/** 1. Address box sizing set to `content-box` in IE 8/9/10. 2. Remove excess padding in IE 8/9/10. */ | |
input[type="checkbox"], input[type="radio"] { box-sizing: border-box; /* 1 */ padding: 0; /* 2 */ } | |
/** 1. Address `appearance` set to `searchfield` in Safari 5 and Chrome. 2. Address `box-sizing` set to `border-box` in Safari 5 and Chrome (include `-moz` to future-proof). */ | |
input[type="search"] { -webkit-appearance: textfield; /* 1 */ -moz-box-sizing: content-box; -webkit-box-sizing: content-box; /* 2 */ box-sizing: content-box; } | |
/** Remove inner padding and search cancel button in Safari 5 and Chrome on OS X. */ | |
input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; } | |
/** Remove inner padding and border in Firefox 4+. */ | |
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; } | |
/** 1. Remove default vertical scrollbar in IE 8/9. 2. Improve readability and alignment in all browsers. */ | |
textarea { overflow: auto; /* 1 */ vertical-align: top; /* 2 */ } | |
/* ========================================================================== Tables ========================================================================== */ | |
/** Remove most spacing between table cells. */ | |
table { border-collapse: collapse; border-spacing: 0; } | |
* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } | |
.image-replacement, .ir { text-indent: 100%; white-space: nowrap; overflow: hidden; } | |
.clearfix, .cf, .comment-respond { zoom: 1; } | |
.clearfix:before, .clearfix:after, .cf:before, .comment-respond:before, .cf:after, .comment-respond:after { content: ""; display: table; } | |
.clearfix:after, .cf:after, .comment-respond:after { clear: both; } | |
/* | |
use the best ampersand | |
http://simplebits.com/notebook/2008/08/14/ampersands-2/ | |
*/ | |
span.amp { font-family: Baskerville,'Goudy Old Style',Palatino,'Book Antiqua',serif !important; font-style: italic; } | |
/********************* | |
GRID STYLES | |
*********************/ | |
.last-col { float: right; padding-right: 0 !important; } | |
@media (max-width: 767px) { .m-all { float: left; padding-right: 0.75em; width: 100%; padding-right: 0; } | |
.m-1of2 { float: left; padding-right: 0.75em; width: 50%; } | |
.m-1of3 { float: left; padding-right: 0.75em; width: 33.33%; } | |
.m-2of3 { float: left; padding-right: 0.75em; width: 66.66%; } | |
.m-1of4 { float: left; padding-right: 0.75em; width: 25%; } | |
.m-3of4 { float: left; padding-right: 0.75em; width: 75%; } } | |
/* Portrait tablet to landscape */ | |
@media (min-width: 768px) and (max-width: 1029px) { .t-all { float: left; padding-right: 0.75em; width: 100%; padding-right: 0; } | |
.t-1of2 { float: left; padding-right: 0.75em; width: 50%; } | |
.t-1of3 { float: left; padding-right: 0.75em; width: 33.33%; } | |
.t-2of3 { float: left; padding-right: 0.75em; width: 66.66%; } | |
.t-1of4 { float: left; padding-right: 0.75em; width: 25%; } | |
.t-3of4 { float: left; padding-right: 0.75em; width: 75%; } | |
.t-1of5 { float: left; padding-right: 0.75em; width: 20%; } | |
.t-2of5 { float: left; padding-right: 0.75em; width: 40%; } | |
.t-3of5 { float: left; padding-right: 0.75em; width: 60%; } | |
.t-4of5 { float: left; padding-right: 0.75em; width: 80%; } } | |
/* Landscape to small desktop */ | |
@media (min-width: 1030px) { .d-all { float: left; padding-right: 0.75em; width: 100%; padding-right: 0; } | |
.d-1of2 { float: left; padding-right: 0.75em; width: 50%; } | |
.d-1of3 { float: left; padding-right: 0.75em; width: 33.33%; } | |
.d-2of3 { float: left; padding-right: 0.75em; width: 66.66%; } | |
.d-1of4 { float: left; padding-right: 0.75em; width: 25%; } | |
.d-3of4 { float: left; padding-right: 0.75em; width: 75%; } | |
.d-1of5 { float: left; padding-right: 0.75em; width: 20%; } | |
.d-2of5 { float: left; padding-right: 0.75em; width: 40%; } | |
.d-3of5 { float: left; padding-right: 0.75em; width: 60%; } | |
.d-4of5 { float: left; padding-right: 0.75em; width: 80%; } | |
.d-1of6 { float: left; padding-right: 0.75em; width: 16.6666666667%; } | |
.d-1of7 { float: left; padding-right: 0.75em; width: 14.2857142857%; } | |
.d-2of7 { float: left; padding-right: 0.75em; width: 28.5714286%; } | |
.d-3of7 { float: left; padding-right: 0.75em; width: 42.8571429%; } | |
.d-4of7 { float: left; padding-right: 0.75em; width: 57.1428572%; } | |
.d-5of7 { float: left; padding-right: 0.75em; width: 71.4285715%; } | |
.d-6of7 { float: left; padding-right: 0.75em; width: 85.7142857%; } | |
.d-1of8 { float: left; padding-right: 0.75em; width: 12.5%; } | |
.d-1of9 { float: left; padding-right: 0.75em; width: 11.1111111111%; } | |
.d-1of10 { float: left; padding-right: 0.75em; width: 10%; } | |
.d-1of11 { float: left; padding-right: 0.75em; width: 9.09090909091%; } | |
.d-1of12 { float: left; padding-right: 0.75em; width: 8.33%; } } | |
/********************* | |
GENERAL STYLES | |
*********************/ | |
body { font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif; /*font-size: 100%;*/font-size:10.5pt; line-height: 1.5; color: #0b0b0b; background-color: #ff; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -webkit-hyphens: none; -epub-hyphens: none; -moz-hyphens: none; hyphens: none; } | |
p { -webkit-hyphens: none; -epub-hyphens: none; -moz-hyphens: none; hyphens: none; letter-spacing: 1px; line-height: 1.8em; font-size: 10.5pt; } | |
ol {padding-left:20px;font-size:11pt;line-height:1.8em;letter-spacing:1px;} | |
ul{padding-left:20px;list-style-image:url('../images/bullet.png');font-size:11pt;line-height:1.8em;letter-spacing:1px;margin-bottom:25px;} | |
ul li {margin-bottom:10px;} | |
img { max-width: 100%; height: auto; } | |
.header { box-shadow: 0 0 10px rgba(0, 0, 0, 0.25); -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.25); -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.25); } | |
.thin {font-weight:400;} | |
.desktop {display:none;} | |
.orange-bold {color:#c97644;font-weight:bold;font-style:italic;} #configuration .orange-bold {margin-bottom:10px;} | |
.short-mrg {margin-bottom:10px;} | |
.slack { | |
background:url('../images/slack_mark_16px.png') no-repeat 0 center; | |
padding-left:21px; | |
} | |
.github { | |
background:url('../images/github.png') no-repeat 0 center; | |
padding-left:21px; | |
} | |
.mail { | |
background:url('../images/mail.png') no-repeat 0 center; | |
padding-left:21px; | |
} | |
.jira { | |
background:url('../images/jira.png') no-repeat 0 center; | |
padding-left:21px; | |
} | |
.twitter-icon { | |
background:url('../images/twitter-icon.png') no-repeat 0 center; | |
padding-left:21px; | |
} | |
/********************* | |
LAYOUT | |
*********************/ | |
.wrap { width: 85%; margin: 0 auto; } | |
#mainwrap {position:relative;} | |
.box-shadow { | |
-webkit-box-shadow: 4px 4px 10px 0px rgba(50, 50, 50, 0.35); | |
-moz-box-shadow: 4px 4px 10px 0px rgba(50, 50, 50, 0.35); | |
box-shadow: 4px 4px 10px 0px rgba(50, 50, 50, 0.35); | |
margin-bottom:25px; | |
} | |
/********************* | |
PUSH MENU | |
*********************/ | |
.cbp-spmenu button{position:absolute;top:5px;right:2px;margin:15px 5px 0 0;border:none;background-color:transparent;font-size:2em;color:#fff;text-indent:-999999px;background:url('../images/open.png')no-repeat;width:29px;height:30px;padding:0;} | |
.cbp-spmenu.cbp-spmenu-open button {background:url('../images/close.png') no-repeat;} | |
.cbp-spmenu{background:#d0cbc5;position:absolute;} | |
.cbp-spmenu h3{color:#ffffff;font-size:1.9em;padding:20px 0 20px 20px;margin:0 0 15px;font-size:16pt;font-weight:500;text-transform:uppercase;font-family:'Open Sans',sans-serif;letter-spacing:0;} | |
.cbp-spmenu-open h3 {background-color:#bfb8b0;} | |
.cbp-spmenu a{display:block;color:#c77240;font-family:'Open Sans',sans-serif;text-transform:uppercase;font-weight:700;font-size:11pt} | |
.cbp-spmenu a:active{background:#afdefa;color:#47a3da} | |
.cbp-spmenu-vertical{width:240px;height:100%;top:0;z-index:1000} | |
.cbp-spmenu-vertical a{padding:10px 10px 10px 20px} | |
.cbp-spmenu-vertical .sub-menu{padding-bottom:5px} | |
.cbp-spmenu-vertical ul{margin:0 0 20px;padding-left:20px} | |
.cbp-spmenu-vertical ul > li > a{padding:0;color:#da8f56;text-transform:none;line-height:1.8em;font-weight:600} | |
.cbp-spmenu-vertical ul > li > a:hover {color:#3e3e40;} | |
.cbp-spmenu-vertical ul > li{margin:0;padding:0} | |
.cbp-spmenu-left{left:-195px} | |
.cbp-spmenu-left.cbp-spmenu-open{left:0} | |
.cbp-spmenu,.cbp-spmenu-push{-webkit-transition:all .3s ease;-moz-transition:all .3s ease;transition:all .3s ease} | |
/********************* | |
BACK TO TOP | |
*********************/ | |
.cd-container { | |
width: 90%; | |
max-width: 768px; | |
margin: 2em auto; | |
} | |
.cd-container::after { | |
/* clearfix */ | |
content: ''; | |
display: table; | |
clear: both; | |
} | |
.cd-top { | |
display: inline-block; | |
height: 40px; | |
width: 40px; | |
position: fixed; | |
bottom: 40px; | |
right: 10px; | |
box-shadow: 0 0 10px rgba(0, 0, 0, 0.05); | |
/* image replacement properties */ | |
overflow: hidden; | |
text-indent: 100%; | |
white-space: nowrap; | |
background: rgba(201, 118, 68, 0.8) url('../images/cd-top-arrow.svg') no-repeat center 50%; | |
visibility: hidden; | |
opacity: 0; | |
-webkit-transition: opacity .3s 0s, visibility 0s .3s; | |
-moz-transition: opacity .3s 0s, visibility 0s .3s; | |
transition: opacity .3s 0s, visibility 0s .3s; | |
} | |
.cd-top.cd-is-visible, .cd-top.cd-fade-out, .no-touch .cd-top:hover { | |
-webkit-transition: opacity .3s 0s, visibility 0s 0s; | |
-moz-transition: opacity .3s 0s, visibility 0s 0s; | |
transition: opacity .3s 0s, visibility 0s 0s; | |
} | |
.cd-top.cd-is-visible { | |
/* the button becomes visible */ | |
visibility: visible; | |
opacity: 1; | |
} | |
.cd-top.cd-fade-out { | |
/* if the user keeps scrolling down, the button is out of focus and becomes less visible */ | |
opacity: .5; | |
} | |
.no-touch .cd-top:hover { | |
background-color: #c97644; | |
opacity: 1; | |
} | |
/****************************************************************** | |
H1, H2, H3, H4, H5 STYLES | |
******************************************************************/ | |
h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5 { text-rendering: optimizelegibility; font-weight: 500; color: #c97644;letter-spacing:2px; } | |
h1 a, .h1 a, h2 a, .h2 a, h3 a, .h3 a, h4 a, .h4 a, h5 a, .h5 a { text-decoration: none; } | |
h1, .h1 { font-size: 2.2em; line-height: 1.333em; } | |
h2, .h2 { font-size: 1.75em; line-height: 1.4em; margin-bottom: 0.375em; } | |
h3, .h3 { font-size: 1.4em; color:#8e8506; margin:15px 0 5px;} | |
h4, .h4 { font-size: 1.1em; font-weight: 700; } | |
h5, .h5 { font-size: 0.846em; line-height: 2.09em; text-transform: uppercase; letter-spacing: 2px; } | |
.gray {color:#a3a3a1;text-transform:uppercase;margin-bottom:10px;}<p class="short-mrg"> | |
#configuration .gray {margin-bottom:5px;} | |
p {margin:0 0 30px;} | |
/********************* | |
BUTTON STYLES | |
*********************/ | |
.y-btn {display:inline-block;margin:0;} | |
.y-btn, .y-btn:visited { background: transparent; padding: 10px 35px; border: 2px solid #c97644; color: #c97644; text-align:center;text-decoration: none; font-weight: bold; font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif; text-transform: uppercase; letter-spacing: 1px; font-size: 10.5pt; -webkit-transition: all .3s ease; -moz-transition: all .3s ease; -ms-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; display:block;margin:0 auto 15px;max-width:225px;} | |
.y-btn:hover, .y-btn:focus, .y-btn:active, .y-btn:visited:hover, .y-btn:visited:focus, .y-btn:visited:active { background: #c97644; color: white; } | |
/********************* | |
LINK STYLES | |
*********************/ | |
a, a:visited { color: #c97644; -webkit-transition: color .3s ease; -moz-transition: color .3s ease; -ms-transition: color .3s ease; -o-transition: color .3s ease; transition: color .3s ease; text-decoration: none; /* on hover */ /* on click */ /* mobile tap color */ } | |
a:hover, a:focus, a:visited:hover, a:visited:focus { color: #3e3e40; } | |
a:link, a:visited:link { /* | |
this highlights links on iPhones/iPads. | |
so it basically works like the :hover selector | |
for mobile devices. | |
*/ -webkit-tap-highlight-color: rgba(0, 0, 0, 0.3); } | |
/********************* | |
HEADER STYLES | |
*********************/ | |
.header { background-color: white; } | |
#logo { margin: 25px 0 15px; text-align: center; } | |
#logo a { color: white; } | |
#masthead { background: url("../images/masthead-bg.jpg") no-repeat bottom center; background-size: cover; clear: both; padding: 50px 0; -webkit-box-shadow: inset 0 0 5px 8px rgba(0, 0, 0, 0.2); box-shadow: inset 0 0 5px 8px rgba(0, 0, 0, 0.2); text-align: center;min-height:250px;} | |
#masthead h1 { color: #f9bf12; line-height: 1.2em; max-width: 600px; text-align: center; display: block; margin: 0 auto;color:#fff;font-weight:bold;letter-spacing:1px;} | |
#masthead h1.thin {font-weight:400;} | |
#masthead p { color: #fff; line-height: 1.8em; text-align: center; letter-spacing: 1px; font-size: 11pt; } | |
#masthead .contribute h3 {color:#fff;letter-spacing:1px;font-size:1.3em;font-weight:500;} | |
#masthead .btn-margin {text-align:center;margin:25px auto 0;max-width:250px;} | |
#masthead .y-btn {padding:10px 15px;max-width:100%;color:#fff;border-color:#fff;} | |
#masthead {text-align:center;} | |
#masthead h1 {font-weight:400;} | |
/********************* | |
NAVIGATION STYLES | |
*********************/ | |
.nav { border-bottom: 0; margin: 0; font-family: "Roboto", "Helvetica Neue", Helvetica, Arial, sans-serif; /* end .menu li */ /* highlight current page */ /* end current highlighters */ } | |
.nav li a { display: block; color: white; text-decoration: none; padding: 0.75em; } | |
.nav li ul.sub-menu li a, .nav li ul.children li a { padding-left: 30px; } | |
.menu-item-has-children > a {cursor:default;} | |
/********************* | |
FOOTER STYLES | |
*********************/ | |
#more-info { background: #4b4547; padding: 50px 0; } | |
#more-info p { text-align: center; } | |
.social-icons {text-align:center;margin-bottom:50px;} | |
.social-icons a {font-size:2em;color:#fff;} | |
.social-icons a:hover {color:#c97644;} | |
.social-icons a:first-child {margin-right:15px;} | |
.add-to-slack {margin:0 0 0 15px;} | |
.add-to-slack {position:relative;top:5px;} | |
#and .and-cell p {font-size:13pt;line-height:1.2em;} | |
.citation {font-size:.7em;line-height:1.5em;margin:50px 0 15px;} | |
.disclaimer {color:#fff;font-size:.7em;line-height:1.3em;} | |
.footer { clear: both; background-color: #363132; color: #f8f9fa; min-height: 50px; } | |
.copyright {margin:14px 0;} | |
/************************ | |
ORIGINAL STYLES | |
*************************/ | |
img {height: auto;max-width: 100%;} | |
p.terminal {background: #4b4547;border: 2px solid #4b4547;border-radius: 25px;color: #FFFFFF;margin-left: 0;padding: 20px;} | |
table.configuration {margin-left: 20px;margin-right: 20px;width: 90%;table-layout:fixed;} | |
table.configuration th {background-color: #212F3C;color: white;padding:10px;} | |
table.configuration th:first-of-type {background:#8e8506;} | |
table.configuration th:nth-child(2) {background:#807705;} | |
table.configuration th:nth-child(3) {background:#797105;} | |
table.configuration td {padding: 8px;text-align: center;vertical-align:top;word-wrap:break-word;} | |
table.configuration tr:nth-child(2) td {padding-top:25px;} | |
table.configuration tr:last-child td {padding-bottom:25px;} | |
table.configuration tr td:first-of-type {background-color: #e6e6e6;} | |
table.configuration tr td:nth-child(2) {background-color:#cfcfcf;} | |
table.configuration tr td:nth-child(3) {background-color:#c4c4c4;} | |
table.configuration.config2 tr td:nth-child(2) {font-size:9.5pt !important;} | |
.sidenav {background-color: #212F3C;height: 100%strong;left: 0;overflow-x: hidden;padding-top: 60px;position: absolute;top: 0;transition: 0.5s;width: 200px;z-index: 1;} | |
.sidenav a {color: #818181;display: block;font-size: 20px;padding: 8px 8px 8px 32px;text-decoration: none;transition: 0.3s;} | |
.sidenav li {color: #818181;} | |
.sidenav a:hover, .offcanvas a:focus {color: #f1f1f1;} | |
.sidenav .closebtn {font-size: 36px;margin-left: 50px;position: absolute;right: 25px;top: 0;} | |
.main {/*padding: 20px;margin-left:45px;*/padding:20px 20px 20px 65px;transition: margin-left .5s;} | |
.main {max-width:100%;overflow:hidden;} | |
.main.tan-bg { | |
background:#e8e5e0; | |
} | |
@media only screen and (min-width:768px) { | |
.wrap { width: 760px; } | |
#masthead {min-height:300px;} | |
#masthead .wrap {min-height:250px;} | |
#masthead .wrap { text-align: left; position:relative;min-height:550px;} | |
.contribute {position:absolute;bottom:0;right:0;max-width:500px;color:#fff;text-align:center;} | |
#masthead h1 { text-align: left; margin: 0; } | |
#masthead p { text-align: left; } | |
.page #masthead .wrap {min-height:250px;} | |
.page #masthead h1 {text-align:center;margin:0 auto;} | |
} | |
@media only screen and (min-width:1030px) { | |
.desktop {display:block;} | |
.mobile {display:none;} | |
.wrap { width: 1040px; } | |
#logo { float: left; text-align: left; } | |
.cd-top { height: 60px; width: 60px; right: 30px;bottom: 30px; } | |
.nav li a { padding: .75em 1.6em; } | |
.nav li:last-child a {padding-right:0;} | |
.nav li ul.sub-menu.com-sm li a { | |
border-bottom:none; | |
} | |
.dropmenu-head { | |
float: none; | |
border-right: 0; | |
display: block; | |
width: 235px; | |
text-transform:uppercase; | |
color:#666; | |
padding:0 10px 0 15px; | |
border-bottom:none; | |
font-size:.95em; | |
} | |
.sub-menu.com-sm .dropmenu-head:first-child { | |
padding-top:10px; | |
} | |
.sub-menu.com-sm .mail, | |
.sub-menu.com-sm .slack, | |
.sub-menu.com-sm .github, | |
.sub-menu.com-sm .twitter-icon, | |
.sub-menu.com-sm .jira { | |
background-position:left 15px center; | |
} | |
.nav li ul.sub-menu.com-sm li .mail, | |
.nav li ul.sub-menu.com-sm li .slack, | |
.nav li ul.sub-menu.com-sm li .github, | |
.nav li ul.sub-menu.com-sm li .twitter-icon, | |
.nav li ul.sub-menu.com-sm li .jira { | |
padding-left:40px; | |
} | |
.sub-menu.com-sm li a { | |
padding:5px 10px 5px 25px; | |
} | |
li.divider { | |
border-bottom:1px solid #ccc; | |
width:100%; | |
margin:10px 0 !important; | |
} | |
.nav li ul.sub-menu.com-sm li { | |
margin-bottom:0; | |
} | |
.nav li ul.sub-menu.com-sm li a { | |
padding-left:15px; | |
} | |
#masthead .wrap {min-height:360px;display: flex; justify-content: flex-end; align-items: center; align-content: flex-end;text-align:right;} | |
.cbp-spmenu {position:fixed;} | |
/********************* NAVIGATION STYLES ********************/ | |
.nav { border: 0; float: right; margin-top: 35px; } | |
.nav ul { background: #e8e5e0; margin-top: 0; } | |
.nav li { float: left; position: relative;margin-bottom:0; } | |
.nav li a { border-bottom: 0; color: #626366; font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif; font-weight: 700; text-transform: uppercase; font-size: 10.2pt; letter-spacing: 1px; padding: .75em 1.2em;line-height: 1.4em;} | |
.nav li a:hover, .nav li a:focus { color: #c97644; } | |
.nav li.active > a {color:#c97644;} | |
.nav li ul.sub-menu, .nav li ul.children { margin-top: 0; position: absolute; visibility: hidden;opacity:0; z-index: 8999;padding-left:0; -webkit-transition: all 0.3s ease-in-out 0s, visibility 0s linear 0.3s, z-index 0s linear 0.01s;-moz-transition: all 0.3s ease-in-out 0s, visibility 0s linear 0.3s, z-index 0s linear 0.01s;-ms-transition: all 0.3s ease-in-out 0s, visibility 0s linear 0.3s, z-index 0s linear 0.01s; -o-transition: all 0.3s ease-in-out 0s, visibility 0s linear 0.3s, z-index 0s linear 0.01s;transition: all 0.3s ease-in-out 0s, visibility 0s linear 0.3s, z-index 0s linear 0.01s; -webkit-transform: translateY(-2em); -moz-transform: translateY(-2em); -o-transform: translateY(-2em); -ms-transform: translateY(-2em);translateY(-2em);} | |
.nav li ul.sub-menu li a, .nav li ul.children li a { float:none;padding-left: 10px; border-right: 0; display: block; width: 235px; border-bottom: 1px solid #ccc; } | |
.nav li ul.sub-menu li a:hover, .nav li ul.children li a:hover {color:#c97644;} | |
.nav li ul.sub-menu li:last-child a, .nav li ul.children li:last-child a { border-bottom: 0; } | |
.nav li ul.sub-menu li ul, .nav li ul.children li ul { top: 0; left: 100%; } | |
.nav li:hover > ul { top: auto; visibility: visible; opacity:1;-moz-transform: translateY(0%);-webkit-transform: translateY(0%); -o-transform: translateY(0%);-ms-transform: translateY(0%); transform: translateY(0%); -webkit-transition-delay: 0s, 0s, 0.3s;-moz-transition-delay: 0s, 0s, 0.3s;-o-transition-delay: 0s, 0s, 0.3s;transition-delay: 0s, 0s, 0.3s;} | |
} | |
.under-dev { | |
background:#aea698; | |
color:#fff; | |
font-weight:700; | |
text-transform: uppercase; | |
padding:10px; | |
width:100%; | |
border-bottom:1px solid #ccc; | |
line-height: 1.4em; | |
font-size:10.2pt; | |
letter-spacing: 1px; | |
text-align: center; | |
} | |
@media only screen and (min-width:1240px) { | |
body {margin-left:240px;} | |
.cbp-spmenu-left {left:0;} | |
.cbp-spmenu button {display:none;} | |
.cbp-spmenu h3 {background:#bfb8b0;padding:37px 25px;margin:5px;text-align:center;} | |
#masthead {min-height:350px;} | |
} | |
@media only screen and (min-width:1600px) { | |
#masthead{min-height:400px;} | |
} | |
@media only screen and (min-width:1920px) { | |
#masthead{min-height:400px;background-position:top -334px center;} | |
} |