html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, address, del, em, img, small, strong, sub, sup, ol, ul, li, form, label, table, article, aside, canvas, footer, header, hgroup, menu, nav, section, time, audio, video { margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline; background:transparent; } body { padding: 0; margin: 0; background:rgba(43,52,68,.7); color: #666; font-size: 12px; line-height: 18px; } h1, h2, h3, h4, h5, h6 { clear: both; font-weight: normal; } p { font-size: 14px; margin-bottom: 8px; } h2 { font-size: 16px; } h3 { font-size: 14px; } h4 { font-size: 13px; margin-bottom: 15px; } a:link { color: #000; text-decoration: none; } a:visited { color: #000; text-decoration: none; } a:active, a:hover { color: #757576; text-decoration: none; } a:active, a:focus, input { outline: 0; outline-style:none; outline-width:0; } .screen-reader-text { position: absolute; left: -9000px; } .header { margin: 0 0 50px 0; } .container { margin: 0 auto; text-align: center; } .card .content { margin: 100px auto; width:450px; background: #fff; padding: 70px 20px 40px; -webkit-animation-name: none; -webkit-animation-iteration-count: infinite; -webkit-animation-timing-function: linear; -webkit-animation-duration: 400s; border-top: 1px solid #fff; box-shadow: 0px 7px 9px #555; border-radius: 4px; } #icon { display: block; box-sizing: border-box; margin:0 0 -34px 50px; padding: 0; width:50px; height:50px; background: #FFF; } .card .search { margin: 10px; } .card-bottom { margin-top: 20px; } .contact-info { font-size: 12px; } @media (max-width: 480px) { .card .content { margin: 50px auto; -webkit-animation-name: none; width:85%; } .header { margin: 0 0 55px 0; } #icon { display: inline; box-sizing: border-box; margin:0 0 0px 0px; padding: 0; width:50px; height:50px; background: #FFF; } } .modal-open { overflow: hidden; } .modal { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 1050; display: none; overflow: hidden; -webkit-overflow-scrolling: touch; outline: 0; } .modal.fade .modal-dialog { -webkit-transition: -webkit-transform .3s ease-out; -o-transition: -o-transform .3s ease-out; transition: transform .3s ease-out; -webkit-transform: translate3d(0, -25%, 0); -o-transform: translate3d(0, -25%, 0); transform: translate3d(0, -25%, 0); } .modal.in .modal-dialog { -webkit-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .modal-open .modal { overflow-x: hidden; overflow-y: auto; } .modal-dialog { position: relative; width: auto; margin: 10px; } .modal-content { position: relative; background-color: #fff; -webkit-background-clip: padding-box; background-clip: padding-box; border: 1px solid #999; border: 1px solid rgba(0, 0, 0, .2); border-radius: 6px; outline: 0; -webkit-box-shadow: 0 3px 9px rgba(0, 0, 0, .5); box-shadow: 0 3px 9px rgba(0, 0, 0, .5); } .modal-backdrop { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 1040; background-color: #000; } .modal-backdrop.fade { filter: alpha(opacity=0); opacity: 0; } .modal-backdrop.in { filter: alpha(opacity=50); opacity: .5; } .modal-header { min-height: 16.42857143px; padding: 15px; border-bottom: 1px solid #e5e5e5; } .modal-header .close { margin-top: -2px; } .modal-title { margin: 0; line-height: 1.42857143; } .modal-body { position: relative; padding: 15px; } .modal-footer { padding: 15px; text-align: right; border-top: 1px solid #e5e5e5; } .modal-footer .btn + .btn { margin-bottom: 0; margin-left: 5px; } .modal-footer .btn-group .btn + .btn { margin-left: -1px; } .modal-footer .btn-block + .btn-block { margin-left: 0; } .modal-scrollbar-measure { position: absolute; top: -9999px; width: 50px; height: 50px; overflow: scroll; } @media (min-width: 768px) { .modal-dialog { width: 600px; margin: 30px auto; } .modal-content { -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, .5); box-shadow: 0 5px 15px rgba(0, 0, 0, .5); } .modal-sm { width: 300px; } } @media (min-width: 992px) { .modal-lg { width: 777px; } } /*============================================ Intro ==============================================*/ @keyframes blink { 0% { opacity: 0; } 25% { opacity: 1; } 50% { opacity: 1; } 100% { opacity: 0; } } @-webkit-keyframes blink { 0% { opacity: 0; } 25% { opacity: 1; } 50% { opacity: 1; } 100% { opacity: 0; } } @-ms-keyframes blink { 0% { opacity: 0; } 25% { opacity: 1; } 50% { opacity: 1; } 100% { opacity: 0; } } @-moz-keyframes blink { 0% { opacity: 0; } 25% { opacity: 1; } 50% { opacity: 1; } 100% { opacity: 0; } } .welcome::after { visibility: visible; content: ''; background-color:green; opacity: 0; display: inline-block; position: relative; width: 0.2em; height: 1em; top: 5px; margin-left: 0; margin-bottom: 2px; -webkit-animation: blink 1s 20; -moz-animation: blink 1s 20; animation: blink 1s 20; } .welcome-back-text::after { visibility: visible; content: ''; background-color:green; opacity: 0; display: inline-block; position: relative; width: 0.2em; height: 1em; top: 5px; margin-left: 0; margin-bottom: 2px; -webkit-animation: blink 1s 3; -moz-animation: blink 1s 3; animation: blink 1s 3; } .welcome-back { margin: 120px 0 0 0; text-align: left; min-height: 300px; padding: 50px 25px; font-size: 18px; font-family: monospace; color: #34F743; background: transparent url('../img/terminal.svg'); background-size: cover; border-radius: 18px; } .terminal-welcome .modal-content { margin: 0 0 100px; border: none; box-shadow:none; background-color: transparent !important; text-align: left; } .terminal { margin-top:30px; } .terminal .modal-content { margin: 0 0 100px; border: none; box-shadow:none; background-color: transparent !important; } [contenteditable] {outline: none;} .typed-cursor{ display: none; } .thermo { font-family: monospace; font-size: 18px !important; } .thermo span.prompt { color: #389436; } .thermo p.input { font-size: 18px; font-family: monospace; margin: 10px 0; } .thermo p.response { font-size: 18px; margin: 0px; color:#34F743; } .thermo span.u { color: #389436; } .thermo span.at { color: #38BBC6; } .thermo span.mee { color: #389436; } .thermo-intro span.prompt { color: #389436; } .thermo-intro p.input { font-size: 18px; font-family: monospace; line-height: 11px !important; margin: 10px 0; } .thermo-intro p.response { font-size: 18px; line-height: 11px !important; margin: 0px; color:#34F743; } .thermo-intro span.u { color: #389436; } .thermo-intro span.at { color: #38BBC6; } .thermo-intro span.mee { color: #389436; }