@font-face { font-family: 'Montserrat'; font-style: normal; font-weight: 400; src: local('Montserrat-Regular'), url(https://themes.googleusercontent.com/static/fonts/montserrat/v4/zhcz-_WihjSQC0oHJ9TCYBsxEYwM7FgeyaSgU71cLG0.woff) format('woff'); } @font-face { font-family: 'Montserrat'; font-style: normal; font-weight: 700; src: local('Montserrat-Bold'), url(https://themes.googleusercontent.com/static/fonts/montserrat/v4/IQHow_FEYlDC4Gzy_m8fcgFhaRv2pGgT5Kf0An0s4MM.woff) format('woff'); } @font-face { font-family: 'Open Sans'; font-style: normal; font-weight: 300; src: local('Open Sans Light'), local('OpenSans-Light'), url(https://themes.googleusercontent.com/static/fonts/opensans/v8/DXI1ORHCpsQm3Vp6mXoaTXhCUOGz7vYGh680lGh-uXM.woff) format('woff'); } html, body { width: 100%; height: 100%; margin: 0; padding: 0; } body { font-family: 'Open Sans', sans-serif; color: #fff; background: #000; webkit-tap-highlight-color: rgba(255,255,255,.2); } h2 { margin: 0 0 15px; text-transform: uppercase; font-family: Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif; font-weight: 700; letter-spacing: 1px; text-align: center; } p { margin: 0 0 15px; line-height: 1.5; text-align: center; } a, a:hover, a:focus { text-decoration: none; } #intro { display: table; width: 100%; height: 100%; color: #fff; background: #000 url(/img/intro-bg.jpg) no-repeat bottom center scroll; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } #intro-body { display: table-cell; vertical-align: middle; text-align: center; } #logo { font-size: 35px; text-transform: uppercase; font-family: Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif; font-weight: 700; letter-spacing: 1px; text-align: center; margin: 0; } h1 { font-size: 13px; text-transform: uppercase; font-family: Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif; margin-bottom: 12px; margin-top: 0; font-weight: 400; } #btn-circle { display: inline-block; width: 30px; height: 30px; line-height: 30px; border: 1px solid #fff; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; font-size: 15px; color: #fff; background: none; -webkit-transition: background .3s ease-in-out; -moz-transition: background .3s ease-in-out; transition: background .3s ease-in-out; text-decoration: none; } #btn-circle:hover, #btn-circle:focus { outline: 0; color: #fff; background: rgba(255,255,255,.1); } #about { width: 100%; height: 100%; color: #fff; display: table; background: #000; } #about-body { display: table-cell; vertical-align: middle; padding-left: 10px; padding-right: 10px; padding-top: 30px; padding-bottom: 30px; font-size: 13px; text-align: center; } ::-moz-selection { background: #fcfcfc; background: rgba(255,255,255,.2); } ::selection { background: #fcfcfc; background: rgba(255,255,255,.2); } input[type="text"] { border: 1px solid #488c1d; color: #488c1d; background: none; padding: 7px; font-family: 'Open Sans', sans-serif; font-size: 13px; margin: 15px 0 0 0; -moz-border-radius: 0px 3px 3px 0px; -webkit-border-radius: 0px 3px 3px 0px; border-radius: 0px 3px 3px 0px; -webkit-transition: background .3s ease-in-out; -moz-transition: background .3s ease-in-out; transition: background .3s ease-in-out; } input[type="text"]:hover, input[type="text"]:focus { border: 1px solid #488c1d; outline: 0; color: #000; background: #488c1d; } #ipbox { border: 1px solid #488c1d; color: #000; background: #488c1d; padding: 7px; margin: 15px 0 0 0; font-size: 13px; -moz-border-radius: 3px 0px 0px 3px; -webkit-border-radius: 3px 0px 0px 3px; border-radius: 3px 0px 0px 3px; } @media(min-width:767px) { h2 { margin: 0 0 25px; } p { margin: 0 0 20px; line-height: 1.5; } #about-body { padding-left: 90px; padding-right: 90px; padding-top: 40px; padding-bottom: 40px; font-size: 21px; } input[type="text"] { font-size: 21px; margin: 25px 0 0 0; } #ipbox { font-size: 21px; margin: 25px 0 0 0; } #btn-circle { font-size: 29px; width: 60px; height: 60px; line-height: 60px; border: 2px solid #fff; } #logo { font-size: 100px; } h1 { font-size: 25px; margin-bottom: 30px; } }