blob: 7912e3490a816b05274493b4b16ff7c93a75c13c [file] [log] [blame]
/* =============================================================================
Columns
========================================================================== */
/* Applied to body to debug layout alignments
.grid {
width:100%;
height:100%;
background:url(../images/grid.png) center repeat-y;
top:0px;
margin:auto;
position:absolute;
}
*/
@media screen, projection, print {
.full {
padding: 2.5em 0;
border-top: solid 1px #ddd;
border-bottom: solid 1px #ddd;
background: #f7f7f7;
}
.wrap {
margin: 0 auto;
width: 100%;
min-width:600px;
clear: both;
}
.cols {
height: 1%;
margin: 0 -1.533742331288343558282%;
width: 103.06748466257669%}
*+html .cols {
margin-bottom: 20px;
}
.cols:after {
clear: both;
content: ' ';
display: block;
height: 0;
visibility: hidden;
}
.col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12,
.col-13, .col-14, .col-15, .col-16 {
float: left;
margin: 0 1.063829787234% 20px 1.063829787234%;
}
* html .col-1, * html .col-2, * html .col-3, * html .col-4, * html .col-5, * html .col-6, * html
.col-7, * html .col-8, * html .col-9, * html .col-10, * html .col-11, * html .col-12, * html
.col-13, * html .col-14, * html .col-15, * html .col-16 {
margin: 0;
margin: 0 1.063829787234% 20px 1.063829787234%;
}
[dir='rtl'] .col-1, [dir='rtl'] .col-2, [dir='rtl'] .col-3, [dir='rtl'] .col-4, [dir='rtl'] .col-5,
[dir='rtl'] .col-6, [dir='rtl'] .col-7, [dir='rtl'] .col-8, [dir='rtl'] .col-9, [dir='rtl'] .col-10,
[dir='rtl'] .col-11, [dir='rtl'] .col-12 {
float: right;
}
.col-1 {
width: 4.16666666666667%;
}
.col-2 {
width: 10.4166666666667%;
}
.col-3 {
width: 16.6666666666667%;
}
.col-4 {
width: 22.9166666666667%;
}
.col-5 {
width: 29.1666666666667%;
}
.col-6 {
width: 35.4166666666667%;
}
.col-7 {
width: 41.6666666666667%;
}
.col-8 {
width: 47.9166666666667%;
}
.col-9 {
width: 55.3333333333333%;
}
.col-10 {
width: 60.4166666666667%;
}
.col-11 {
width: 66.6666666666667%;
}
.col-12 {
width: 72.9166666666667%;
}
.col-13 {
width: 79.1666666666667%;
}
.col-14 {
width: 85.4166666666667%;
}
.col-15 {
width: 91.6666666666667%;
}
.col-16 {
width: 97.9166666666667%;
}
#header .col-1,
#nav-x .col-1 { width: 40px }
#header .col-2,
#nav-x .col-2 { width: 100px }
#header .col-3,
#nav-x .col-3 { width: 160px }
#header .col-4,
#nav-x .col-4 { width: 220px }
#header .col-5,
#nav-x .col-5 { width: 280px }
#header .col-6,
#nav-x .col-6 { width: 340px }
#header .col-7,
#nav-x .col-7 { width: 400px }
#header .col-8,
#nav-x .col-8 { width: 460px }
#header .col-9,
#nav-x .col-9 { width: 520px }
#header .col-10,
#nav-x .col-10 { width: 580px }
#header .col-11,
#nav-x .col-11 { width: 640px }
#header .col-12,
#nav-x .col-12 { width: 700px }
#header .col-13,
#nav-x .col-13 { width: 760px }
#header .col-14,
#nav-x .col-14 { width: 820px }
#header .col-15,
#nav-x .col-15 { width: 880px }
#header .col-16,
#nav-x .col-16 { width: 940px }
body {
padding:0 20px;
}
#header,
#searchResults,
#nav-x {
margin:0;
}
#body-content {
margin:0;
}
#body-content > .col-12 {
width:77.9804965%;
margin:0 0 0 0.97%; /* this percentage chosen to make IE9 happy */
}
#side-nav {
width: 19.9804965%;
margin:0 1.063829787234% 0 0;
}
#header .wrap {
max-width: 100%;
}
#header-wrapper #nav-x div.wrap,
#searchResults.wrap {
max-width:100%;
}
.nav-x {
margin:-2px 0 0 0;
}
#devdoc-nav.fixed,
#devdoc-nav.fixed a.totop {
left:20px; /* !important ... for IE i think */
}
#sticky-header {
padding: 0 20px;
}
#sticky-header > div {
width: 100%;
}
.sticky-menu {
width:100%;
left:-20px;
}
.col-right {
margin-right:0px;
}
@media screen and (max-width:772px) {
.col-5, .col-6, .col-7 {
clear: both;
width: 97.0238096%}
}