@import url(http://fonts.googleapis.com/css?family=Lato:400,700);@font-face{font-family:'bpicons';font-weight:normal;font-style:normal;src:url('../fonts/bpicons/bpicons.eot');src:url('../fonts/bpicons/bpicons.eot?#iefix') format('embedded-opentype'),
url('../fonts/bpicons/bpicons.woff') format('woff'),
url('../fonts/bpicons/bpicons.ttf') format('truetype'),
url('../fonts/bpicons/bpicons.svg#bpicons') format('svg');}
*,
*:after,
*:before{box-sizing:border-box;}
.cf:before,
.cf:after{content:' ';display:table;}
.cf:after{clear:both;}
.hidden{position:absolute;opacity:0;pointer-events:none;}
.bp-header{width:90%;max-width:69em;margin:0 auto;padding:4em 1.875em 1.875em;text-align:center;}
.bp-header h1{font-size:2.125em;font-weight:400;line-height:1.3;margin:0 0 .6em 0;}
.bp-header h1 > span{font-size:50%;display:block;color:#4D4D5A;}
.bp-header > span{font-weight:700;font-size:0.85em;color:#5C5EDC;position:relative;z-index:100;display:block;padding:0 0 .6em .1em;letter-spacing:.5em;text-transform:uppercase;text-indent:30px;}
.bp-header > span span:after{font-size:50%;font-size:75%;position:relative;top:-8px;left:-12px;width:30px;height:30px;}
.bp-header > span span:hover:before{content:attr(data-content);font-size:110%;font-weight:700;line-height:1.2;position:absolute;left:auto;margin-left:4px;padding:.8em 1em;text-align:left;text-indent:0;letter-spacing:0;text-transform:none;color:#fff;background:#5C5EDC;}
.bp-header nav{text-align:center;margin:0 auto;}
.bp-header nav a{position:relative;display:inline-block;width:2.5em;height:2.5em;margin:0 .1em;text-align:left;border-radius:50%;}
.bp-header nav a > span{display:none;}
.bp-header nav a:hover:before{content:attr(data-info);color:#595A5F;font-weight:bold;font-size:0.85em;position:absolute;top:120%;right:0;width:600%;text-align:right;pointer-events:none;}
.bp-header nav a:hover{background:#5C5EDC;}
.bp-icon:after{font-family:'bpicons';font-weight:normal;font-style:normal;font-variant:normal;text-align:center;text-transform:none;color:#5C5EDC;speak:none;-webkit-font-smoothing:antialiased;}
.bp-header nav .bp-icon:after{line-height:2.4;position:absolute;top:0;left:0;width:100%;height:100%;text-indent:0;}
.bp-header nav a:hover:after{color:#fff;}
.bp-icon-next:after{content:'\e000';}
.bp-icon-drop:after{content:'\e001';}
.bp-icon-archive:after{content:'\e002';}
.bp-icon-about:after{content:'\e003';}
.bp-icon-prev:after{content:'\e004';}
@media screen and (max-width:40em){.bp-header h1{font-size:1.8em;}
}