/*http://meyerweb.com/eric/tools/css/reset/*/ html,body,div,span,button,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 { font: inherit; font-family: 'Lato', 'Helvetica Neue', Helvetica, sans-serif; font-size: 100%; margin: 0; padding: 0; vertical-align: baseline; border: 0 } html { width: 100%; } body { overflow-x: hidden; width: 100%; height: 100%; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); -webkit-touch-callout: none } .fluid { -webkit-transition: all .1s ease; -moz-transition: all .1s ease; -ms-transition: all .1s ease; -o-transition: all .1s ease; transition: all .1s ease; } .fluid-slow { -webkit-transition: all .5s ease; -moz-transition: all .5s ease; -ms-transition: all .5s ease; -o-transition: all .5s ease; transition: all .5s ease; } hr { width: 100%; height: 1px; float: left; border: none; background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0)); } a { color: #3A96DD; text-decoration: none; } li { color: #fff; } button.flip>i { height: 3vh; width: 3vh; display: block; background-size: cover; } button.expand>i {} i.left { background-image: url("../icons/ic_keyboard_arrow_left_black_48px.svg"); } i.right { background-image: url("../icons/ic_keyboard_arrow_right_black_48px.svg"); } i.expand { background-image: url("../icons/ic_expand_less_white_48px.svg"); } button.flip { cursor: pointer; position: absolute; height: 6vh; width: 3vh; outline: none; background-color: rgba(255, 255, 255, 0.5); } button.flip.left { top: calc(50% - 3vh); left: 0; } button.flip.right { top: calc(50% - 3vh); right: 0; } button.flip:hover { background-color: rgba(255, 255, 255, 0.7); } button.flip:active { background-color: rgba(255, 255, 255, 0.9); } button.expand { cursor: pointer; position: absolute; height: 6vh; width: 4vh; outline: none; background-color: rgba(255, 255, 255, 0.5); } span>a:hover { color: #767676; } span>a:active { color: #393939; } #wrapper { position: relative; width: 100%; z-index: 1; background-color: #4C4A48; height: auto; min-height: 100%; overflow: hidden; } #wrapper:before { position: absolute; z-index: -1; width: 100%; min-height: 100vh; top: 0vh; content: ''; display: block; } section { width: 100%; min-height: 100%; display: flex; justify-content: center; z-index: 2; } #intro, #calendar, #updates, #officers, #excomm, #senators, #sponsors, #resources, #forms { /*max-width: 1200px;*/ display: flex; margin: 0 12.5vw; width: 75vw; height: 100%; justify-content: center; flex-flow: row wrap; } #intro, #calendar, #updates, #resources, #forms { padding: 2.5vh 0; } #resources, #forms { min-height: calc(60vh - ((2.75em + 42px) / 4)); } #sponsors { padding-bottom: 2.5vh; } section h1 { font-size: 3.5em; margin-top: 0.5em; } section h2, #intro-title { width: 100%; font-size: 2.1em; font-weight: bold; color: #fff; margin: 2.5vh 0; display: inline-block; text-align: left; } #intro-text { text-align: center; flex-grow: calc(50% - 8vw); margin: 0 2vw; } #intro-image { text-align: center; flex-grow: calc(50% - 8vw); } #intro-image>img { margin-top: calc(5vh + 3.1em); width: 100%; } #tweets, #feedback { text-align: center; margin: 0 2vw; } #letter { width: 100%; font-size: 1.2em; display: inline-block; text-align: left; color: #fff; clear: both; } #letter>p { margin: 0.5em 0; } .desc { font-size: 1.1em; color: #fff; margin: 0.5em 5vw; } .list>ul { font-size: 1.1em; margin: 0 2vw 0 8vw; } .desc>span { display: inline-block; } .links>h2, .list>h2 { text-align: center; }