.clearfix:before,
.clearfix:after{content:" "; display:table}
.clearfix:after{clear:both}
.container > header{padding:0}
.container > header h1{font-size:2.125em; line-height:1.3; margin:0; float:left; font-weight:400}
.container > header span{display:block; font-weight:700; text-transform:uppercase; letter-spacing:0.5em; padding:0 0 0.6em 0.1em}
.container > header nav{float:right}
.container > header nav a{display:block; float:left; position:relative; width:2.5em; height:2.5em; background:none; border-radius:50%; color:transparent; margin:0 0.1em; border:4px solid #47a3da; text-indent:-8000px}
.container > header nav a:after{content:attr(data-info); color:#47a3da; position:absolute; width:600%; top:120%; text-align:right; right:0; opacity:0; pointer-events:none}
.container > header nav a:hover:after{opacity:1}
.container > header nav a:hover{background:#47a3da}
.main > section{max-width:48px; float:left; width:90%; margin:0 auto}
.main > section h2{font-weight:300; color:#ccc}
.main > section button{border:none; background:none; color:#000; padding:0; border-right:solid 1px #b6b6b6; display:block; width:100%; cursor:pointer; text-align:left; margin:0px 0 0; font-size:0.8em}
.main > section button:hover{}
.main > section button.active{}
.main > section button.disabled{pointer-events:none}
.icon-drop:before,
.icon-arrow-left:before{position:absolute; top:0; width:100%; height:100%; speak:none; font-style:normal; font-weight:normal; line-height:2; text-align:center; color:#47a3da; -webkit-font-smoothing:antialiased; text-indent:8000px; padding-left:8px}
.container > header nav a:hover:before{color:#fff}
.icon-drop:before{content:"\e000"}
.icon-arrow-left:before{content:"\f060"}