/* MEYER RESET
--------------------------------------------------
   http://meyerweb.com/eric/tools/css/reset/
   v2.0 | 20110126
   License: none (public domain)
*/

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 {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
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: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/* End Meyer Reset
-------------------------------------------------- */

/* Start Custom CSS Styling
-------------------------------------------------- */

/* Body, HTML
-------------------------------------------------- */

body.main, html.main {
    overflow:hidden;
    height: 100%;
}

.non-sketch {
    background-color: rgb(237,228,223);
} 

/* Disable Text Selection
-------------------------------------------------- */

body, html, .nav, a, li, ul, .container, .row, p, p2, p3, p4, p6, .subHead, .emphasis, #scrolltext.visible, .smallCaps, #feature, #block1, #block2, #block3, #block4, #block5, #block6, #block7, #block8, .quotation, #credit, #logolarge, #description, #intro, #smallNav1, #smallNav2, #smallNav3, #smallNav4, #logo, .instructions, .verticalNav, .sidelink, .sidelink a, .sidenav {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
} 

::-moz-selection {
    background: none;
    color: none;
}
::selection {  
    background: none;
    color: none;
}

/* Global links and rollovers
-------------------------------------------------- */

a {
    text-decoration: none;
    color: rgb(20,12,15);
}

a:hover {
    color: #ffffff;
    text-decoration: none;    
}

a:active {
    color: #ffffff;
    text-decoration: none;    
}

.nav>li>a:focus, .nav>li>a:hover {
    text-decoration: none;
    background-color: transparent !important;
  }


.currentpage a {
    color: #ffffff !important;
}

.currentpage a:hover, .currentpage a:active {
    color: rgb(20,12,15) !important;
}

/* Side Nav
-------------------------------------------------- */

ul.verticalNav {
    list-style-type: none;
    height: 100%;
}

li.verticalNav {
    display: block;
    text-align: center;
}

ul.verticalNav_about {
    list-style-type: none;
}

li.verticalNav_about {
    text-align: center;
}

.middlenavs {
    padding-bottom: 40px;   
}

.middlenavs_about {
    padding-bottom: 40px;   
}

.sideNav {
    position: fixed;
    width: 37px;
}

.sideNav_about {
    width: 37px;
    position: inherit;
}

#sideNavCol {
padding-left: 28px;
}

.verticalNav {
    font-family: "neuzeit-grotesk";
    font-weight: 400;
    font-size: 1.25rem;
    text-transform: uppercase;
}

.sidelink a {
font-family: "neuzeit-grotesk";
    font-weight: 400;
    font-size: 1.25rem;
    text-transform: uppercase;
}

/* Override Bootstrap collapsible nav feature
-------------------------------------------------- */

.navbar-collapse.collapse {
    display: block!important;
}

.navbar-nav>li, .navbar-nav {
    float: left !important;
}

.navbar-nav.navbar-right:last-child {
    margin-right: -15px !important;
}

.navbar-nav.navbar-left:first-child {
     margin-left: -15px !important;
}

.navbar-right {
    float: right!important;
}

.navbar-right li {
    margin: 0px;
    padding-left: 30px;   
}


/* Top and Bottom Navs
-------------------------------------------------- */

.nav {
    padding-top:30px;
    padding-bottom:30px;
    margin: 0px;
}

.nav>li>a {
    padding-left: 0px;
    padding-right: 0px; 
    padding-top: 0px;
    padding-bottom: 0px;    
}

#smallNav1, #smallNav2, #smallNav3, #smallNav4 {
    font-family: "neuzeit-grotesk";
    font-weight: 400;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.2rem;
}

#logo {
    font-family: "neuzeit-grotesk";
    font-weight: 400;
    font-size: 2.5rem;
}

/* Bootstrap containers, rows and columns
-------------------------------------------------- */

body > .container {
    padding-left: 0;
    padding-right: 0;
    padding-bottom: 0px;
    padding-top:0;
}

.row {
    margin-bottom: 0px;
    padding-bottom: 0px;
}

.row .row {
    /* Nested rows */
    margin-top: 0px;
    margin-bottom: 0px;
}

[class*="col-"] {
    padding-top: 0px;
    padding-bottom: 0px;
}

p {
    display: inline-block;
}

/* Main Body Typography
-------------------------------------------------- */

p, p2, p3, p4 {
    font-family: "latienne-pro";
    font-weight: 400;  
    margin-bottom: 0;
    margin-top: 0;
    color: rgb(20,12,15);    
}

p, p2, p3 {
    font-size: 1.4rem;
    line-height: 2rem;
}

p4 {
    font-size: 1rem;
    line-height: 1.7rem;
}

p6 {
    font-family: "neuzeit-grotesk";
    font-weight: 400;
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.15rem;
    text-align: center;
}

.subHead {
    font-family: "latienne-pro";
    font-weight: 500;
    font-size: 1.6rem;
}

.emphasis {
    font-weight: 400;
    font-style: italic;
}

.p-break {
	margin-top: 20px;
}

p.padded {
    padding-left: 56px;
}

/* 'Reflect' Sketch
-------------------------------------------------- */

.split-text {
    width: 49%;
    margin-left: 41%;
    padding-right: 0px;
}

.split-paragraph {
    margin-bottom: 19px;
}

#paragraph-one {
    font-weight: 500;
    margin-top: 15.6%;
}

#reflect-text {
    position: absolute;
    height: 50%;
    top: 25%;
}

/* 'Remove' Sketch
-------------------------------------------------- */

.specialcol {
    color: rgb(91,55,70) !important;  
}

/* 'Restore' Sketch
-------------------------------------------------- */

#fade_box { 
    transform-origin: top left;
    display: block;
    padding-left: 50px;
    padding-top: 47px;
    width: 95%;
    padding-right: 30px;
}


/* Scrolling Home Page
-------------------------------------------------- */

.introcontainer {
    width:100%;
    margin:0px auto;
}

#scrollingintro {
    height: 11000px;
	margin: 0;
    background-color: rgb(237,228,223);
}

#arrow.visible {
    width:28px;
    position: absolute;
    top: 58.25%;
    left:37.5%;
}

#arrow.invisible {
    display:none;
}

#scrolltext.visible {
    width: 30px;
    position: absolute;
    top: 58%;
    left: 40.5%;
    font-family: "neuzeit-grotesk";
    font-weight: 400;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.2rem;
    color: rgb(20,12,15);
}

#scrolltext.invisible {
    display:none;
}

.smallCaps {
    font-family: "neuzeit-grotesk";
    font-weight: 400;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.2rem;
    color: rgb(20,12,15);
}

#feature {
    font-family: "neuzeit-grotesk";
    font-weight: 400;
    font-size: 12rem;
    text-align: center;
}

#block1 {
    display: block;
    text-align: left;
    font-family: "latienne-pro";
    font-weight: 500;
    font-size: 1.6rem;
    line-height: 2.1rem;
    color: rgb(20,12,15);
    width: 100%;
}

#block2, #block3, #block4, #block5, #block6, #block7 {
    display: block;
    font-family: 'neuzeit-grotesk', serif;
    font-weight: 300;
    font-size: 1.25rem;
    line-height: 1.9rem;
    color: rgb(20,12,15);
    width: 100%;    
}

#block8 {
    display: block;
    width: 100%;
}

/* Scrolling blocks: horizontal positions
----------------------------------------- */

#block1 h1 {
    width: 27%;
    margin: 0 auto;
    padding-left:1.5%;
}

#block2 h1, #block4 h1, #block6 h1 {
    width: 22%; 
    margin-left: 37.5%;
    text-align: left;
}

#block3 h1 {
    width: 24%; 
    margin-left: 42.5%;
    text-align: right;
}

#block5 h1 {
     width: 23%; 
    margin-left: 43.5%;
    text-align: right;
}

#block7 h1 {
    width: 22%; 
    margin-left: 44.5%;
    text-align: right;
}

#block8 h1 {
    width: 29%; 
    margin-left: 37%;
    text-align: right;
}

/* Scrolling block typography
----------------------------------------- */

#kerning {
    letter-spacing: 0.4rem;
}

.pad-line {
    padding-right:5px;
}

.quotation { 
    font-family: 'latienne-pro';    
    font-weight: 500;
    font-size: 1.2rem;    
}

.quotation.new-line { 
    display: inline-block;     
    text-indent: -0.6em;    
}

.new-line-right { 
    display: inline-block;
    padding-right:10px;     
}

.space-right {
    display: inline-block;
    padding-right: 10px;    
}

#credit {
    font-family: "neuzeit-grotesk";
    font-weight: 400;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.1rem;
    line-height: 1.4rem;
}

#intro {
    position: relative;
    width: 40%;
    margin-left:30%;
    margin-right:30%;
    text-align: center;
}

#logolarge {
    font-family: "neuzeit-grotesk";
    font-weight: 400;
    font-size: 12rem;
    text-align: left;
    width: 40%;
    margin: 0px auto;
    padding-left: 10px;
    margin-bottom: 0;
    color: rgb(20,12,15);
}

#description {
    font-family: 'latienne-pro';
    font-size: 0.9rem;
    font-weight: 400;
    line-height: 1.2rem;
    color: rgb(20,12,15);
    text-align:left;
    width: 40%;
    margin: 0px auto;
    margin-bottom: 50px;
    margin-top: -5px;
    padding-left: 33px;
}

#entersite {
    width: 20%;
    margin-left: 31.1%;  
}

.button {
    position: fixed;
    top: 80%;
    stroke: 1px solid rgb(91,55,70);
    width: 10%;
    text-align: center;
    padding-top: 7px;
    padding-bottom: 7px;
    left: 45%;
    right: 45%;
}

/* Scrolling block vertical measurements
----------------------------------------- */

/* Optical margin adjustments
----------------------------------------- */

#block1 {
    margin-top: -5.5%;
}

#block2 {
    margin-top: -3.5%;
}

#block3 {
    margin-top: -3.5%;
}

#block4 {
    margin-top: -4.5%;
}

#block5 {
    margin-top: -3%;
}

#block6 {
    margin-top: -8.5%;
}

#block7 {
    margin-top: -3%;
}

#block8 {
  margin-top: 0.25%;  
}

/* Dynamic Scrolling Classes
----------------------------------------- */

#block1.top1 {
    position: fixed;
    top: 8%;
}

#block1.float1 {
    position: absolute;
    top:50%;
}

#block2.top2 {
    position: fixed;
    top: 45.45%;
}

#block2.float2 {
    position: absolute;
    top:150%;
}

#block2.go2 {
    position: absolute;
    top: 340.9%;
}

#block3.top3 {
    position: fixed;
    top: 54.54%;
}

#block3.float3 {
    position: absolute;
    top:250%;
}

#block3.go3 {
    position: absolute;
    top: 350%;
}

#block4.top4 {
    position: fixed;
    top: 45.45%;
}

#block4.float4 {
    position: absolute;
    top:450%;
}

#block4.go4 {
    position: absolute;
    top: 640.9%;
}

#block5.top5 {
    position: fixed;
    top: 54.54%;
}

#block5.float5 {
    position: absolute;
    top:550%;
}

#block5.go5 {
    position: absolute;
    top: 650%;
}

#block6.top6 {
    position: fixed;
    top: 45.45%;
}

#block6.float6 {
    position: absolute;
    top:750%;
}

#block6.go6 {
    position: absolute;
    top: 1081.8%;
}

#block7.top7 {
    position: fixed;
    top: 54.54%;
}

#block7.float7 {
    position: absolute;
    top:850%;
}

#block7.go7 {
    position: absolute;
    top: 1090.9%;
}

#block8.top8 {
    position: fixed;
    top: 63.63%;
}

#block8.float8 {
    position: absolute;
    top:950%;
}

#block8.go8 {
    position: absolute;
    top: 1100%;
}

#block9 {
    position: fixed;
    width: 100%;
    height: 100%;
}

/* Typography for 'Reading Tips', 'About', 'Index' and 'Reference' Pages 
----------------------------------------------------------------------------------- */

#icons {
    position: relative;
    height: 160px;
    padding-left: 56px;
}

.instructions li {
    display: inline-block;
    width: 32%;
    font-family: "neuzeit-grotesk";
    margin: 0 auto;
    padding: 0;
}

ul.instructions {
    width: 100%;
    padding-left: 15px;
    margin: 0px;
    list-style: none;
    text-align: left;
}

.italic {
    font-style: italic;
}

#readingtips_container {
    position: relative;
    padding-left: 56px;
}

.padded-2col {
    padding-left: 56px;    
}

.p-break-about {
    font-weight: 400;
    font-size: 1rem;
    line-height: 1.7rem;
    margin-top: 20px;
}

.p-break-subHead {
    margin-top: 20px;
    line-height: 40px;
    font-weight: 500;
    font-size: 1.2rem;
}

.p-break-2col {
    margin-top: 20px;
    line-height: 40px;
    font-weight: 400;
    font-size: 1rem;
}

.p-break-endline {
    margin-top: 0px;
    line-height: 40px;
    font-weight: 400;
    font-size: 1rem;
}

.p-break-endline-sml {
    margin-top: 0px;
    line-height: 40px;
    font-size: 0.8rem;
}

.p-break-sml {
	margin-top: 20px;
    font-weight: 400;
    font-size: 0.8rem;
    line-height: 40px;
}

#p-break-last {
    margin-top: 19px;
}

#about_subHead {
    line-height: 2.3rem;
}

.references {
    margin-top: 20px;
    font-weight: 400;
    font-size: 0.8rem;
    line-height: 1.15rem;
}

#ref-spaced {
    margin-top: 20px;
    font-weight: 400;
    font-size: 0.8rem;
    line-height: 1.2rem;
}

.ref-ital {
    font-style: italic;
}

#textfiller {
    opacity: 0;    
}