styles.css

body {
font-family: futura-pt, sans-serif;
font-size: 20px;
background: #7ba8f9;
color: white;
}

html, body {
margin: 0;
}

h1, h2 {
font-family: bebas-neue, sans-serif;
text-transform: uppercase;
font-weight: normal;
line-height: 1;
margin: 0;
}

h2 {
font-size: 34px;
margin-bottom: 10px;
}

p {
margin: 10px 0;
}
p a {
border-bottom: 1px solid;
}
p a:hover {
border-bottom-width: 2px;
}

a {
color: inherit;
text-decoration: none;
}

.wrap, section, footer {
padding: 20px;
max-width: 680px;
margin: auto;
}

section.nopad {
padding: 20px 0;
}

header {
background: #213e5b;
overflow: hidden;
}
header .wrap {
position: relative;
}
header h1 {
font-size: 5em;
text-shadow: 1px 1px 0 #7ba8f9, 2px 2px 0 #7ba8f9, 3px 3px 0 #7ba8f9, 4px 4px 0 #7ba8f9, 5px 5px 0 #7ba8f9, 6px 6px 0 #7ba8f9, 7px 7px 0 #7ba8f9, 8px 8px 0 #7ba8f9, 9px 9px 0 #7ba8f9, 10px 10px 0 #7ba8f9, 11px 11px 0 #7ba8f9, 12px 12px 0 #7ba8f9, 13px 13px 0 #7ba8f9, 14px 14px 0 #7ba8f9, 15px 15px 0 #7ba8f9, 16px 16px 0 #7ba8f9, 17px 17px 0 #7ba8f9, 18px 18px 0 #7ba8f9, 19px 19px 0 #7ba8f9, 20px 20px 0 #7ba8f9, 21px 21px 0 #7ba8f9, 22px 22px 0 #7ba8f9, 23px 23px 0 #7ba8f9, 24px 24px 0 #7ba8f9, 25px 25px 0 #7ba8f9, 26px 26px 0 #7ba8f9, 27px 27px 0 #7ba8f9, 28px 28px 0 #7ba8f9, 29px 29px 0 #7ba8f9, 30px 30px 0 #7ba8f9, 31px 31px 0 #7ba8f9, 32px 32px 0 #7ba8f9, 33px 33px 0 #7ba8f9, 34px 34px 0 #7ba8f9, 35px 35px 0 #7ba8f9, 36px 36px 0 #7ba8f9, 37px 37px 0 #7ba8f9, 38px 38px 0 #7ba8f9, 39px 39px 0 #7ba8f9, 40px 40px 0 #7ba8f9, 41px 41px 0 #7ba8f9, 42px 42px 0 #7ba8f9, 43px 43px 0 #7ba8f9, 44px 44px 0 #7ba8f9, 45px 45px 0 #7ba8f9, 46px 46px 0 #7ba8f9, 47px 47px 0 #7ba8f9, 48px 48px 0 #7ba8f9, 49px 49px 0 #7ba8f9, 50px 50px 0 #7ba8f9, 51px 51px 0 #7ba8f9, 52px 52px 0 #7ba8f9, 53px 53px 0 #7ba8f9, 54px 54px 0 #7ba8f9, 55px 55px 0 #7ba8f9, 56px 56px 0 #7ba8f9, 57px 57px 0 #7ba8f9, 58px 58px 0 #7ba8f9, 59px 59px 0 #7ba8f9, 60px 60px 0 #7ba8f9, 61px 61px 0 #7ba8f9, 62px 62px 0 #7ba8f9, 63px 63px 0 #7ba8f9, 64px 64px 0 #7ba8f9, 65px 65px 0 #7ba8f9, 66px 66px 0 #7ba8f9, 67px 67px 0 #7ba8f9, 68px 68px 0 #7ba8f9, 69px 69px 0 #7ba8f9, 70px 70px 0 #7ba8f9, 71px 71px 0 #7ba8f9, 72px 72px 0 #7ba8f9, 73px 73px 0 #7ba8f9, 74px 74px 0 #7ba8f9, 75px 75px 0 #7ba8f9, 76px 76px 0 #7ba8f9, 77px 77px 0 #7ba8f9, 78px 78px 0 #7ba8f9, 79px 79px 0 #7ba8f9, 80px 80px 0 #7ba8f9, 81px 81px 0 #7ba8f9, 82px 82px 0 #7ba8f9, 83px 83px 0 #7ba8f9, 84px 84px 0 #7ba8f9, 85px 85px 0 #7ba8f9, 86px 86px 0 #7ba8f9, 87px 87px 0 #7ba8f9, 88px 88px 0 #7ba8f9, 89px 89px 0 #7ba8f9, 90px 90px 0 #7ba8f9, 91px 91px 0 #7ba8f9, 92px 92px 0 #7ba8f9, 93px 93px 0 #7ba8f9, 94px 94px 0 #7ba8f9, 95px 95px 0 #7ba8f9, 96px 96px 0 #7ba8f9, 97px 97px 0 #7ba8f9, 98px 98px 0 #7ba8f9, 99px 99px 0 #7ba8f9, 100px 100px 0 #7ba8f9, 101px 101px 0 #7ba8f9, 102px 102px 0 #7ba8f9, 103px 103px 0 #7ba8f9, 104px 104px 0 #7ba8f9, 105px 105px 0 #7ba8f9, 106px 106px 0 #7ba8f9, 107px 107px 0 #7ba8f9, 108px 108px 0 #7ba8f9, 109px 109px 0 #7ba8f9, 110px 110px 0 #7ba8f9, 111px 111px 0 #7ba8f9, 112px 112px 0 #7ba8f9, 113px 113px 0 #7ba8f9, 114px 114px 0 #7ba8f9, 115px 115px 0 #7ba8f9, 116px 116px 0 #7ba8f9, 117px 117px 0 #7ba8f9, 118px 118px 0 #7ba8f9, 119px 119px 0 #7ba8f9, 120px 120px 0 #7ba8f9, 121px 121px 0 #7ba8f9, 122px 122px 0 #7ba8f9, 123px 123px 0 #7ba8f9, 124px 124px 0 #7ba8f9, 125px 125px 0 #7ba8f9, 126px 126px 0 #7ba8f9, 127px 127px 0 #7ba8f9, 128px 128px 0 #7ba8f9, 129px 129px 0 #7ba8f9, 130px 130px 0 #7ba8f9, 131px 131px 0 #7ba8f9, 132px 132px 0 #7ba8f9, 133px 133px 0 #7ba8f9, 134px 134px 0 #7ba8f9, 135px 135px 0 #7ba8f9, 136px 136px 0 #7ba8f9, 137px 137px 0 #7ba8f9, 138px 138px 0 #7ba8f9, 139px 139px 0 #7ba8f9, 140px 140px 0 #7ba8f9, 141px 141px 0 #7ba8f9, 142px 142px 0 #7ba8f9, 143px 143px 0 #7ba8f9, 144px 144px 0 #7ba8f9, 145px 145px 0 #7ba8f9, 146px 146px 0 #7ba8f9, 147px 147px 0 #7ba8f9, 148px 148px 0 #7ba8f9, 149px 149px 0 #7ba8f9, 150px 150px 0 #7ba8f9, 151px 151px 0 #7ba8f9, 152px 152px 0 #7ba8f9, 153px 153px 0 #7ba8f9, 154px 154px 0 #7ba8f9, 155px 155px 0 #7ba8f9, 156px 156px 0 #7ba8f9, 157px 157px 0 #7ba8f9, 158px 158px 0 #7ba8f9, 159px 159px 0 #7ba8f9, 160px 160px 0 #7ba8f9, 161px 161px 0 #7ba8f9, 162px 162px 0 #7ba8f9, 163px 163px 0 #7ba8f9, 164px 164px 0 #7ba8f9, 165px 165px 0 #7ba8f9, 166px 166px 0 #7ba8f9, 167px 167px 0 #7ba8f9, 168px 168px 0 #7ba8f9, 169px 169px 0 #7ba8f9, 170px 170px 0 #7ba8f9, 171px 171px 0 #7ba8f9, 172px 172px 0 #7ba8f9, 173px 173px 0 #7ba8f9, 174px 174px 0 #7ba8f9, 175px 175px 0 #7ba8f9, 176px 176px 0 #7ba8f9, 177px 177px 0 #7ba8f9, 178px 178px 0 #7ba8f9, 179px 179px 0 #7ba8f9, 180px 180px 0 #7ba8f9, 181px 181px 0 #7ba8f9, 182px 182px 0 #7ba8f9, 183px 183px 0 #7ba8f9, 184px 184px 0 #7ba8f9, 185px 185px 0 #7ba8f9, 186px 186px 0 #7ba8f9, 187px 187px 0 #7ba8f9, 188px 188px 0 #7ba8f9, 189px 189px 0 #7ba8f9, 190px 190px 0 #7ba8f9, 191px 191px 0 #7ba8f9, 192px 192px 0 #7ba8f9, 193px 193px 0 #7ba8f9, 194px 194px 0 #7ba8f9, 195px 195px 0 #7ba8f9, 196px 196px 0 #7ba8f9, 197px 197px 0 #7ba8f9, 198px 198px 0 #7ba8f9, 199px 199px 0 #7ba8f9, 200px 200px 0 #7ba8f9, 201px 201px 0 #7ba8f9, 202px 202px 0 #7ba8f9, 203px 203px 0 #7ba8f9, 204px 204px 0 #7ba8f9, 205px 205px 0 #7ba8f9, 206px 206px 0 #7ba8f9, 207px 207px 0 #7ba8f9, 208px 208px 0 #7ba8f9, 209px 209px 0 #7ba8f9, 210px 210px 0 #7ba8f9, 211px 211px 0 #7ba8f9, 212px 212px 0 #7ba8f9, 213px 213px 0 #7ba8f9, 214px 214px 0 #7ba8f9, 215px 215px 0 #7ba8f9, 216px 216px 0 #7ba8f9, 217px 217px 0 #7ba8f9, 218px 218px 0 #7ba8f9, 219px 219px 0 #7ba8f9, 220px 220px 0 #7ba8f9, 221px 221px 0 #7ba8f9, 222px 222px 0 #7ba8f9, 223px 223px 0 #7ba8f9, 224px 224px 0 #7ba8f9, 225px 225px 0 #7ba8f9, 226px 226px 0 #7ba8f9, 227px 227px 0 #7ba8f9, 228px 228px 0 #7ba8f9, 229px 229px 0 #7ba8f9, 230px 230px 0 #7ba8f9, 231px 231px 0 #7ba8f9, 232px 232px 0 #7ba8f9, 233px 233px 0 #7ba8f9, 234px 234px 0 #7ba8f9, 235px 235px 0 #7ba8f9, 236px 236px 0 #7ba8f9, 237px 237px 0 #7ba8f9, 238px 238px 0 #7ba8f9, 239px 239px 0 #7ba8f9, 240px 240px 0 #7ba8f9, 241px 241px 0 #7ba8f9, 242px 242px 0 #7ba8f9, 243px 243px 0 #7ba8f9, 244px 244px 0 #7ba8f9, 245px 245px 0 #7ba8f9, 246px 246px 0 #7ba8f9, 247px 247px 0 #7ba8f9, 248px 248px 0 #7ba8f9, 249px 249px 0 #7ba8f9, 250px 250px 0 #7ba8f9, 251px 251px 0 #7ba8f9, 252px 252px 0 #7ba8f9, 253px 253px 0 #7ba8f9, 254px 254px 0 #7ba8f9, 255px 255px 0 #7ba8f9, 256px 256px 0 #7ba8f9, 257px 257px 0 #7ba8f9, 258px 258px 0 #7ba8f9, 259px 259px 0 #7ba8f9, 260px 260px 0 #7ba8f9;
}
header .year {
position: absolute;
right: 20px;
top: 50%;
transform: translateY(-50%);
text-align: center;
line-height: 1;
}
header .year b {
display: inline-block;
height: 1em;
width: 1em;
margin-bottom: 0.4em;
}

#map a {
display: block;
margin: 0 -20px;
}
#map img {
width: 100%;
height: auto;
display: block;
margin-top: 1em;
}
#map .inside img {
border: 1em solid white;
background: white;
margin: 1em -20px 0 -20px;
}

#event {
display: flex;
margin-bottom: 2em;
}
#event .wifi {
background: #4b78bb;
border-radius: 0.4em;
overflow: hidden;
flex: 200px;
box-shadow: 0 0.2em 0.4em rgba(0, 0, 0, 0.1);
}
#event .wifi .bar {
background: white;
display: flex;
align-items: center;
padding: 10px 20px;
}
#event .wifi .bar .close {
display: block;
width: 1em;
height: 1em;
border-radius: 9em;
background: #ff4115;
line-height: 0;
}
#event .wifi .bar .title {
color: #213e5b;
padding-left: 10px;
text-align: right;
flex: 1;
}
#event .wifi .content {
padding: 10px 0;
}
#event .wifi .content p {
padding: 0 20px;
}
#event .wifi .content .options {
padding-top: 10px;
}
#event .wifi .content .options div {
padding: 5px 20px;
background: white;
color: #213e5b;
border-bottom: 1px solid #4b78bb;
}
#event .wifi .content .options div span {
float: right;
}
#event .wifi .content .options div span i {
font-size: 0.7em;
padding-left: 0.8em;
}
#event .links {
width: 148.8px;
font-size: 0;
margin: 10px 0 0 10px;
}
#event .links a {
display: inline-block;
padding: 0.8em;
width: 1em;
height: 1em;
border-radius: 9em;
background: #4b78bb;
line-height: 0;
font-size: 24px;
margin: 1em 0 0 0.5em;
}
#event .links a i {
text-align: center;
width: 1em;
}
#event .links a:nth-child(odd) {
transform: translateY(-50%);
}
#event .links a:nth-child(odd):hover {
transform: translateY(-2.5px) translateY(-50%);
}

#apis a strong {
border-bottom: 1px solid;
}
#apis a:hover strong, #apis a:active strong {
border-width: 2px;
}

#mentors img {
max-width: 100%;
}

.links a {
box-shadow: 0 0.2em 0.4em rgba(0, 0, 0, 0.1);
transition: all 0.1s ease-in-out;
transform: translate3d(0, 0, 0);
}
.links a:hover {
box-shadow: 0 0.7em 1em rgba(0, 0, 0, 0.2);
transform: translateY(-2.5px);
}

section.links .main {
display: block;
background: #4b78bb;
padding: 20px 20px 40px 20px;
margin: -20px;
}
section.links .main h2 {
display: inline-block;
}
section.links .main span {
display: inline-block;
padding-left: 0.4em;
}
section.links .sub {
text-align: right;
margin: -20px -20px 0 -20px;
padding: 0 20px;
position: relative;
overflow-x: auto;
white-space: nowrap;
}
section.links .sub a {
display: inline-block;
background: white;
color: #213e5b;
padding: 10px 20px;
margin-left: 20px;
}

footer {
text-align: center;
}