html { background: url("img/background-testing-3.jpg") no-repeat center center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; overflow-y: auto; } body { font-family: 'Roboto', sans-serif; margin: 0px; } .bck_cover { position: fixed; top: 0px; right: 0px; bottom: 0px; left: 0px; background: rgba(0, 0, 0, 0.7); z-index: -1; } .logo img { margin: 40px 0px 0px 60px; max-width: 180px; } .login-btn { float: right; margin-right: 60px; margin-top: 40px; display:inline-block; padding: 10px; } .login-btn a { color: #fff; text-decoration: none; } .login-btn span { display: inline-block; vertical-align: middle; } span.login-img { background: url('img/login-small-white.png') no-repeat center -25px; display: inline-block; vertical-align: middle; width: 25px; height: 25px; } #schedule_iframe, .tab_content { color: #fff; text-align: center; width: 770px; max-width: 770px; margin: 0 auto 0px -380px; padding: 10px; padding-left: 0px; padding-bottom: 140px !important; position: absolute; left: 50%; /* -webkit-transition-delay: 1s; transition-delay: 1s;*/ } #schedule_iframe.tab_content.current, .tab_content.current { /*display: block;*/ visibility: visible; } .about_us { -webkit-transition-delay: 2s; transition-delay: 2s; } .tab_content { /* -webkit-transition-delay: 1s; transition-delay: 1s;*/ transition: opacity 0.4s ease 0.4s; opacity: 0; } .current { opacity: 1; -webkit-transition: opacity 0.4s ease 0.0s; transition: opacity 0.4s ease 0.0s; } .about_us h1 { font-size: 80px; /** Fallback if vw is not suppoted */ font-size: 8vh; font-weight: 300; margin: 10px; } .about_us p { font-size: 24px; /** Fallback if vw is not suppoted */ font-size: 4vh; font-weight: 300; margin: 10px; } .podcast .rss_icon span { color: #fff; } .podcast .rss_icon:hover { opacity: 0.8; } .podcast .rss_icon { font-size: 14px; text-decoration: none; } .podcast .rss_icon img { vertical-align: middle; margin-left: 10px; } .login h2, .podcast h2 { font-size: 28px; font-weight: 300; } .rss-title-wrapper { overflow:hidden; } .rss-title-wrapper div { padding: 10px; } #rss-title { text-align:left; font-size: 28px; font-weight: 300; } #rss-subscribe { float: right; overflow:hidden; text-align: right; } @media screen and (max-width: 490px) { #rss-title { float: none; margin-right:0; width:auto; border:0; } } input[type="text"] { font-family: 'Roboto', sans-serif; color: #fff; font-size: 16px; font-weight: 300; padding: 20px; background: rgba(255, 255, 255, 0.2); border: none; margin-bottom: 1px; width: 100%; max-width: 380px; text-align: center; box-sizing: border-box; } input[type="text"]:hover { background: rgba(255, 255, 255, 0.3); } input[type="submit"] { font-family: 'Roboto', sans-serif; color: #fff; font-size: 18px; font-weight: 300; background: #459B8F; width: 100%; max-width: 380px; padding: 18px 20px; margin-top: 20px; border: none; cursor: pointer; box-sizing: border-box; } input[type="submit"]:hover { background-color: #409187; } @media (max-width: 780px) { .logo { display: block; text-align: center; } .logo img { margin: 20px 0px; } .login-btn { float: right; margin-right: 0px; margin-top: 0px; position: absolute; top: 15px; right: 5px; } span.login-img { display:none; } .tab_content { margin-top: 0px; width: auto; max-width: 100%; margin-left: auto; left: 10px; right: 10px; } #schedule_iframe { margin-top: 0px; max-width: 100%; margin-left: auto; left: 0px; right: 10px; } .about_us h1 { font-size: 40px; } .about_us p { font-size: 18px; } }