@charset "utf-8"; html, body, div, span, td, tr, th, tbody, thead, tfoot, font, iframe, blockquote, a, pre, img, input, textarea, select, h1, h2, h3, h4, h5, h6, ol, ul, li, p, label, b, i, center, strong, footer, header, section, time, article, code, aside, em, figure, embed, hr, dl, dt, dd, fieldset { margin: 0; padding: 0; border: 0; font: inherit; color: inherit; font-size: inherit; text-decoration: none; font-variant: normal; letter-spacing: inherit; word-spacing: inherit; line-height: inherit; vertical-align: baseline; } html, body { width: 100%; height: 100%; min-height: 100%; background-color: #ffffff; } html { position: relative; overflow: auto; } strong, b { font-weight: bold; } em, i { font-style: italic; } table { border-collapse: collapse; border-spacing: 0; } body { font-size: 14px; font-family: open-sans, helvetica, arial; text-align: left; } textarea:focus, input:focus { outline: none; } form { display: inline; margin: 0; padding: 0; } select, select:focus { display: block; border: 0; box-shadow: none; text-shadow: none; border-color: transparent; border-image: 0; border-image-width: 0; outline: 0; text-indent: 0.01px; text-overflow: ""; appearance: none; -webkit-appearance: none; -moz-appearance: none; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; background: transparent; opacity: 0; } select::-ms-expand { display: none; } select option { display: block; box-shadow: none; outline: 0; box-shadow: none; text-shadow: none; border: 0; border-color: transparent transparent transparent transparent; border-image: 0 0 0 0; border-image-width: 0 0 0 0; }  #all { position: relative; top: 0; left: 0; width: 100%; min-height: 100vh; margin: 0; padding: 0 0 0 0; overflow: auto; background: linear-gradient( to right, #ffffff, #ffffff calc( 50% - 700px ), #f8f8f8 calc( 50% - 700px ), #f8f8f8 calc( 50% + 700px ), #ffffff calc( 50% + 700px ), #ffffff ); } #all:after { display: block; width: 100%; height: 380px; content: ""; clear: both; }  #loadtime { position: fixed; z-index: 5; width: 73px; bottom: 0px; left: -70px; padding: 9px 0px 9px 0px; background-color: #000000; color: #ffffff; text-align: center; font-weight: bold; } #loadtime:hover { left: 0px; } .nosel { -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; }  #bl { position: absolute; width: 100%; height: 100%; overflow: hidden; text-align: center; background-color: #000000; } #bl h1 { margin: 70px 10px 20px 10px; font-size: 48px; color: #ff0000; line-height: 100%; font-weight: lighter; } #bl p { margin: 0 10px 0 10px; font-size: 18px; text-transform: uppercase; color: #ffffff; line-height: 150%; font-weight: lighter; } #bl a:hover { color: #a00000; }  #offline { position: absolute; width: 100%; height: 100%; overflow: auto; color: #aa0000; text-align: center; text-shadow: 0px 0px 1px #aa0000; background-color: #ffffff; } #offline h1 { margin: 50px 0 40px 0; font-size: 40px; line-height: 150%; } #offline p { font-size: 20px; text-transform: uppercase; line-height: 200%; }  #page-not-found-all { position: absolute; top: 0; left: 0; width: 100%; height: 200%; margin: 0; overflow: hidden; }  #page-not-found { position: absolute; top: 0; left: 0; width: 100%; height: 50%; overflow: hidden; text-align: center;  } #page-not-found article { position: absolute; top: 40%; left: 50%; width: 600px; height: 300px; margin: -150px 0 0 -300px; } #page-not-found h1 { margin: 0 0 40px 0; font-size: 30px; font-weight: bold; color: #f0f0f0; line-height: 100%; text-transform: uppercase; } #page-not-found p { margin: 0; font-size: 24px; font-weight: lighter; color: #f0f0f0; line-height: 160%; text-transform: uppercase; } #page-not-found a { color: #cd1231; } #page-not-found a:hover { color: #ed1231; } @font-face { font-family: open-sans; font-style: normal; font-weight: 100; src: url( "../fonts/open-sans/open-sans-light.ttf" ), url( "../fonts/open-sans/open-sans-light.eot" ) format( 'truetype' ); } @font-face { font-family: open-sans; font-style: normal; font-weight: 400; src: url( "../fonts/open-sans/open-sans.ttf" ), url( "../fonts/open-sans/open-sans.eot" ) format( 'truetype' ); } @font-face { font-family: open-sans; font-style: normal; font-weight: 700; src: url( "../fonts/open-sans/open-sans-bold.ttf" ), url( "../fonts/open-sans/open-sans-bold.eot" ) format( 'truetype' ); } @font-face { font-family: open-sans; font-style: italic; font-weight: 100; src: url( "../fonts/open-sans/open-sans-light-italic.ttf" ), url( "../fonts/open-sans/open-sans-light-italic.eot" ) format( 'truetype' ); } @font-face { font-family: open-sans; font-style: italic; font-weight: 400; src: url( "../fonts/open-sans/open-sans-italic.ttf" ), url( "../fonts/open-sans/open-sans-italic.eot" ) format( 'truetype' ); } @font-face { font-family: open-sans; font-style: italic; font-weight: 700; src: url( "../fonts/open-sans/open-sans-bold-italic.ttf" ), url( "../fonts/open-sans/open-sans-bold-italic.eot" ) format( 'truetype' ); } @font-face { font-family: bebasneue; font-style: normal; font-weight: 100; src: url( "../fonts/bebasneue/bebasneue-light.ttf" ), url( "../fonts/bebasneue/bebasneue-light.eot" ) format( 'truetype' ); } @font-face { font-family: bebasneue; font-style: normal; font-weight: 400; src: url( "../fonts/bebasneue/bebasneue.ttf" ), url( "../fonts/bebasneue/bebasneue.eot" ) format( 'truetype' ); } @font-face { font-family: bebasneue; font-style: normal; font-weight: 700; src: url( "../fonts/bebasneue/bebasneue-bold.ttf" ), url( "../fonts/bebasneue/bebasneue-bold.eot" ) format( 'truetype' ); } @font-face { font-family: bebasneue; font-style: italic; font-weight: 100; src: url( "../fonts/bebasneue/bebasneue-light.ttf" ), url( "../fonts/bebasneue/bebasneue-light.eot" ) format( 'truetype' ); } @font-face { font-family: bebasneue; font-style: italic; font-weight: 400; src: url( "../fonts/bebasneue/bebasneue.ttf" ), url( "../fonts/bebasneue/bebasneue.eot" ) format( 'truetype' ); } @font-face { font-family: bebasneue; font-style: italic; font-weight: 700; src: url( "../fonts/bebasneue/bebasneue-bold.ttf" ), url( "../fonts/bebasneue/bebasneue-bold.eot" ) format( 'truetype' ); }   #header { position: fixed; z-index: 11; top: 0; left: 0; display: block; width: 100%; height: 80px; } #header nav { display: block; max-width: 1400px; height: 80px; margin: 0 auto 0 auto; background-color: #fff200; border-bottom: 1px solid #cfc200; } #header figure { display: block; float: left; width: 80px; height: 80px; margin: 0 0 0 0; background: url( "../images/global.png" ) no-repeat; } #header ul { display: block; float: left; margin: 0 0 0 10px overflow: visible; list-style: none; } #header ul li { position: relative; display: block; float: left; height: 80px; padding: 0 20px 0 20px; font-weight: bold; color: #000000; } #header ul li:hover { color: #000000; } #header ul a { display: block; margin: 0; font-size: 16px; line-height: 80px; text-transform: uppercase; }  #header ol { display: block; float: right; margin: 0 10px 0 0; overflow: visible; list-style: none; } #header ol li { position: relative; display: block; float: left; height: 80px; font-weight: bold; color: #000000; } #header ol li:hover { color: #000000; } #header ol a { display: block; margin: 0 20px 0 20px; font-size: 16px; line-height: 80px; text-transform: uppercase; }  #footer-space { display: block; width: 100%; min-height: 350px; overflow: hidden; clear: both; }  #footer { position: absolute; left: 0; bottom: 0; display: block; width: 100%; min-height: 250px; margin: 0 auto 0 auto; padding: 50px 0 0 0; overflow: auto; } #footer nav { position: relative; max-width: 1400px; margin: 0 auto 0 auto; padding: 50px 30px 50px 30px; background: #121212; overflow: hidden; box-sizing: border-box; }  #footer nav ol { float: left; width: 64%; margin: 0 0 0 0; padding: 30px 50px 0 50px; list-style: none; box-sizing: border-box; } #footer nav ol li { position: relative; display: block; float: left; width: 33.33%; margin: 0 0 0 0; padding: 0 0 0 30px; font-size: 14px; color: #e0e0e0; line-height: 40px; box-sizing: border-box; } #footer nav ol li:after { position: absolute; top: 15px; left: 0; display: block; width: 10px; height: 10px; content: ""; background-color: #fff200; border-radius: 50%; }   #footer nav > div { float: right; width: 36%; list-style: none; padding: 0 0 0 0; border-left: 1px dotted #c0c0c0; box-sizing: border-box; } #footer nav div div { display: block; float: left; width: calc( 50% - 70px ); margin: 0 0 0 0; padding: 30px 0 0 0; font-size: 14px; color: #e0e0e0; line-height: 40px; } #footer nav div div:first-child { text-align: right; } #footer nav em { display: block; margin: 0 0 0 0; padding: 0 20px 0 20px; font-size: 14px; color: #e0e0e0; line-height: 40px; font-style: normal; box-sizing: border-box; } #footer nav h3 { position: absolute; bottom: 50px; left: 30px; font-size: 16px; font-weight: bold; color: #fff200; line-height: 16px; text-transform: uppercase; transform: rotate(-90deg); transform-origin: left top; } #footer nav figure { display: block; float: left; width: 140px; height: 140px; background: url( "../images/global.png" ) no-repeat -360px 0; opacity: 0.5; } #footer nav figure:hover { opacity: 1; }  #footer p { max-width: 1400px; margin: 0 auto 0 auto; padding: 30px 30px 30px 30px; background-color: #fff200; box-sizing: border-box; } #footer p:after { display: block; width: 100%; height: 0; clear: both; content: ""; } #footer p span, #footer p a { display: block; float: left; margin: 0 20px 0 0; color: #3c3c3c; line-height: 30px; } #footer p i { display: block; float: right; margin: 0; font-style: normal; } #footer p i a { display: block; width: 30px; height: 30px; margin: 0 0 0 20px; background: url( "../images/global.png" ) no-repeat 0 0; opacity: 0.8; border-radius: 50%; box-shadow: 0 0 0 1px rgba( 0, 0, 0, 0.5 ); } #footer p i a:hover { opacity: 1; } #footer p i .fb { background-position: -60px -160px; } #footer p i .tw { background-position: -10px -160px; } #footer p i .gp { background-position: -110px -160px; } #footer p i .in { background-position: -160px -160px; } #footer p i .rss { background-position: -210px -160px; } #home-works { position: relative; max-width: 1400px; margin: 0 auto 0 auto; } #home-works:after { display: block; width: 100%; height: 0; clear: both; content: ""; } #home-works h2 { margin: 0 auto 20px auto; text-align: center; font-size: 16px; text-transform: uppercase; } #home-works .slider { position: relative; max-width: 1400px; overflow: hidden; height: 800px; } #home-works .slider ul { position: absolute; top: 0; left: 0; display: block; width: 2000%; height: 100%; list-style: none; transition: all .25s ease-in-out; } #home-works .slider ul li { display: block; float: left; width: 5%; height: 100%; } #home-works img { display: block; }  #home-works nav { position: absolute; z-index: 3; right: 30px; top: 30px; display: block; width: 120px; height: 50px; } #home-works nav span, #home-works nav i { width: 50px; height: 50px; box-sizing: border-box; border: 1px solid #4b4200; background: url( "../images/global.png" ) no-repeat; cursor: pointer; border-radius: 3px; opacity: 1; } #home-works nav span { float: left; background-position: -100px -50px; } #home-works nav i { float: right; background-position: -150px -50px; } #home-works nav span:hover, #home-works nav i:hover { opacity: 1; } #home-intro { position: relative; display: block; max-width: 1400px; height: 800px; margin: 0 auto 20px auto; background-color: #fff200; overflow: hidden; } #home-intro ul { position: absolute; top: 0; left: 0; display: block; width: 1000%; height: 100%; list-style: none; transition: all .25s ease-in-out; } #home-intro ul li { display: block; float: left; width: 10%; height: 100%; background-position: center, top; background-repeat: no-repeat, no-repeat; background-size: cover, cover; } #home-intro .banner-1 { background-image: url( "../images/banner-1.jpg" ); } #home-intro .banner-2 { background-image: url( "../images/banner-2.jpg" ); } #home-intro .banner-3 { background-image: url( "../images/banner-3.jpg" ); } #home-intro .banner-4 { background-image: url( "../images/banner-4.jpg" ); } #home-intro .banner-5 { background-image: url( "../images/banner-5.jpg" ); } #home-intro .banner-6 { background-image: url( "../images/banner-6.jpg" ); } #home-intro .left-overlay { position: absolute; z-index: 2; left: -30%; top: -30%; width: 60%; height: 160%; background-color: #fff200; transform: rotate( 30deg ); } #home-intro .right-overlay { position: absolute; z-index: 2; right: -40%; top: -20%; width: 60%; height: 160%; background-color: #fff200; transform: rotate( 30deg ); opacity: 0.7; }  #home-intro nav { position: absolute; z-index: 3; right: 30px; bottom: 30px; display: block; width: 120px; height: 50px; } #home-intro nav span, #home-intro nav i { width: 50px; height: 50px; box-sizing: border-box; border: 1px solid #4b4200; background: url( "../images/global.png" ) no-repeat; cursor: pointer; border-radius: 3px; opacity: 1; } #home-intro nav span { float: left; background-position: -100px -50px; } #home-intro nav i { float: right; background-position: -150px -50px; } #home-intro nav span:hover, #home-intro nav i:hover { opacity: 1; }  #home-intro ol { position: absolute; z-index: 4; display: block; top: 200px; left: 100px; width: 70%; list-style: none; } #home-intro ol li { position: absolute; top: 0; left: 0; display: block; width: 100%; height: 100%; transition: all .25s ease-in-out; opacity: 0; } #home-intro ol .sel { opacity: 1; } #home-intro ol h3 { margin: 0 0 50px 0; font-size: 50px; text-transform: uppercase; color: #121212; } #home-intro ol span { display: block; margin: 0 0 10px 0; clear: both; } #home-intro ol p { margin: 0 0 0 0; font-size: 26px; color: #454545; }   #reviewform { display: none; top: 0; left: 0; z-index: 11; position: fixed; width: 100%; height: 100%; background-color: rgba( 0, 0, 0, 0.6 ); } #reviewform article { position: relative; display: block; max-width: 600px; margin: 100px auto 0 auto; background-color: #ffffff; box-shadow: 0 0 2px 0 rgba( 0, 0, 0, 0.5 ); overflow: hidden; border-radius: 3px; } #reviewform header { height: 50px; background-color: #a0a0a0; } #reviewform header h2 { float: left; margin: 0 0 0 20px; line-height: 50px; color: #ffffff; font-weight: bold; text-transform: uppercase; } #reviewform header span { float: right; display: block; width: 50px; height: 50px; margin: 0; background: url( "../images/cp.png" ) no-repeat -100px -100px #c03020; cursor: pointer;cursor: pointer; } #reviewform input { display: block; width: 100%; height: 50px; padding: 0 20px 0 20px; color: #454a4f; line-height: 48px; background-color: transparent; border-bottom: 1px solid #e0e0e0; border-top: 1px solid #e0e0e0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } #reviewform textarea { display: block; width: 100%; min-height: 150px; padding: 10px 20px 20px 20px; color: #454a4f; line-height: 30px; background-color: transparent; resize: vertical; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } #reviewform footer { display: block; height: 50px; } #reviewform footer div { float: left; width: 80px; text-align: center; line-height: 50px; color: #ffffff; font-weight: bold; background-color: #0e488b; cursor: pointer; border-radius: 0 3px 0 0; } #reviewform footer a { float: right; margin: 0 20px 0 0; font-size: 10px; line-height: 50px; color: #90959a; text-transform: uppercase; } #reviewform ol { display: block; width: 250px; height: 50px; margin: 0 0 0 10px; clear: both; list-style: none; clear: both; overflow: hidden; } #reviewform li { float: left; display: block; width: 50px; height: 50px; background: url( "/app/images/global.png" ) no-repeat -450px -50px; cursor: pointer; transition: all .25s ease-in-out; -webkit-transition: all .25s ease-in-out; } #reviewform li:hover { transform: scale( 1.3, 1.3 ); } #reviewform .star { background-position: -450px 0; } #reviewform .loading { position: absolute; display: none; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba( 0, 0, 0, 0.8 ); } #reviewform .loading img { position: absolute; display: block; top: 50%; left: 50%; width: 100px; height: 20px; margin: -10px 0 0 -50px; }  #contactform { display: none; top: 0; left: 0; z-index: 11; position: fixed; width: 100%; height: 100%; background-color: rgba( 0, 0, 0, 0.6 ); } #contactform article { position: relative; display: block; max-width: 600px; margin: 100px auto 0 auto; background-color: #ffffff; box-shadow: 0 0 2px 0 rgba( 0, 0, 0, 0.5 ); overflow: hidden; border-radius: 3px; } #contactform header { height: 50px; background-color: #a0a0a0; } #contactform header h2 { float: left; margin: 0 0 0 20px; line-height: 50px; color: #ffffff; font-weight: bold; text-transform: uppercase; } #contactform header span { float: right; display: block; width: 50px; height: 50px; margin: 0; background: url( "../images/cp.png" ) no-repeat -100px -100px #c03020; cursor: pointer;cursor: pointer; } #contactform input { display: block; width: 100%; height: 50px; padding: 0 20px 0 20px; color: #454a4f; line-height: 48px; background-color: transparent; border-bottom: 1px solid #e0e0e0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } #contactform textarea { display: block; width: 100%; min-height: 150px; padding: 10px 20px 20px 20px; color: #454a4f; line-height: 30px; background-color: transparent; resize: vertical; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } #contactform footer { display: block; height: 50px; } #contactform footer div { float: left; width: 80px; text-align: center; line-height: 50px; color: #ffffff; font-weight: bold; background-color: #0e488b; cursor: pointer; border-radius: 0 3px 0 0; } #contactform footer a { float: right; margin: 0 20px 0 0; font-size: 10px; line-height: 50px; color: #90959a; text-transform: uppercase; } #contactform ol { display: block; width: 250px; height: 50px; margin: 0 0 0 10px; clear: both; list-style: none; clear: both; overflow: hidden; } #contactform li { float: left; display: block; width: 50px; height: 50px; background: url( "/app/images/global.png" ) no-repeat -450px -50px; cursor: pointer; transition: all .25s ease-in-out; -webkit-transition: all .25s ease-in-out; } #contactform li:hover { transform: scale( 1.3, 1.3 ); } #contactform .star { background-position: -450px 0; } #contactform .loading { position: absolute; display: none; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba( 0, 0, 0, 0.8 ); } #contactform .loading img { position: absolute; display: block; top: 50%; left: 50%; width: 100px; height: 20px; margin: -10px 0 0 -50px; }  #popup { display: none; position: fixed; z-index: 13; top: 0; left: 0; width: 100%; height: 100%; padding: 0; background-color: rgba( 0, 0, 0, 0.6 ); } #popup section { display: block; max-width: 600px; height: auto; margin: 100px auto 0 auto; padding: 0; overflow: hidden; border-radius: 3px; } #popup header { display: block; height: 50px; padding: 0 0 0 20px; line-height: 50px; color: #ffffff; font-size: 18px; } #popup header span { display: block; float: right; width: 50px; height: 50px; background: url( "../images/global.png" ) no-repeat -250px -50px; cursor: pointer; } #popup .error { background-color: #d04030; } #popup .error span { background-color: #c03020; } #popup .error span:hover { background-color: #eb4836; } #popup .success { background-color: #7cb644; } #popup .success span { background-color: #6ca634; } #popup .success span:hover { background-color: #8cc654; } #popup .warning { background-color: #eea510; } #popup .warning span { background-color: #de9500; } #popup .warning span:hover { background-color: #feb520; } #popup article { min-height: 80px; padding: 20px; font-size: 16px; color: #70757a; line-height: 150%; background-color: #ffffff; overflow: hidden; } #popup .cb, #popup .cbs { float: left; display: block; width: 18px; height: 18px; margin: 0 20px 0 0; border: 1px solid #ccddee; background-color: transparent; font-size: 0; line-height: 0; cursor: pointer; } #popup .cbs { width: 20px; height: 20px; border: 0; background: url( '../images/global.png' ) no-repeat -315px -65px; } #popup label { float: left; line-height: 20px; } #popup .row { display: block; padding: 20px 0 20px 0; } #popup footer { display: block; height: 40px; margin: 0; padding: 20px 0 20px 0; clear: both; border-top: 1px solid #f0f0f0; background-color: #ffffff; } #popup footer span { position: relative; display: block; width: 100px; height: 40px; line-height: 40px; font-weight: bold; cursor: pointer; text-align: center; text-transform: uppercase; background-color: #d04030; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; border-radius: 3px; overflow: hidden; } #popup footer span:before { } #popup footer .ok { float: left; margin: 0 0 0 20px; padding: 0 0 0 40px; color: #ffffff; background-color: #7cb644; } #popup footer .ok:before { position: absolute; top: 0; left: 0; width: 40px; height: 40px; display: block; content: ""; background: url( "../images/global.png" ) no-repeat -305px -55px #6ca634; } #popup footer .ok:hover { background-color: #8cc654; } #popup footer .ok:hover:before { background-color: #7cb644; } #popup footer .no { float: right; margin: 0 20px 0 0; color: #8b98a0; background-color: #fafafa; border: 1px solid #abb8c0; } #popup footer .no:hover { background-color: #f0f5fa; }  #about-all { position: relative; width: 100%; overflow: hidden; clear: both; }  #about { display: block; height: 100%; margin: 0 auto 0 auto; padding: 0 0 0 0; overflow: hidden; clear: both; font-size: 20px; }  #about .intro { position: relative; width: 100%; min-height: 100vh; overflow: hidden; background: url( "../images/about-background.jpg" ) scroll no-repeat center center / cover #f0f0f0; } #about .intro:after { position: absolute; top: 0; left: 0; display: block; width: 100%; height: 100%; content: ""; } #about .intro div { position: absolute; top: 50%; left: 0; display: block; width: 100%; margin: -120px 0 0 0; } #about .intro img { display: block; width: 200px; height: 80px; margin: 0 auto 30px auto; border-radius: 5px; } #about .intro h1 { display: block; margin: 0 10px 30px 10px; font-size: 3em; font-weight: 300; color: #fff200; font-weight: bold; line-height: 100%; text-align: center; text-shadow: 0 2px 3px rgba( 0, 0, 0, 0.4 ); } #about .intro h2 { display: block; margin: 0 10px 0 10px; font-size: 1.5em; font-weight: 300; color: #fff200; line-height: 100%; text-align: center; text-shadow: 0 2px 3px rgba( 0, 0, 0, 0.4 ); }  #about article { display: block; max-width: 1200px; margin: 0 auto 30px auto; padding: 50px 20px 0 20px; } #about article p { margin: 0 0 20px 0; line-height: 180%; } #about article li { margin: 0 0 20px 50px; line-height: 180%; }  #press-all { position: relative; top: 0; left: 0; display: block; width: 100%; min-height: 100%; height: auto; margin: 0; padding: 0; overflow: auto; clear: both; background-color: #ffffff; } #press-all:after { display: inline-block; width: 100%; height: 100%; content: " "; overflow: auto; clear: both; }  #press { position: relative; display: block; margin: 0 auto 0 auto; padding: 0 0 0 0; overflow: hidden; } #press .intro { position: relative; height: 500px; margin: 0 0 90px 0; padding: 0 0 0 0; background: url( "../images/press-intro.jpg" ) scroll no-repeat center center / cover #d5dae5; } #press .intro div { position: relative; display: block; max-width: 800px; height: 500px; margin: 0 auto 0 auto; padding: 0 20px 0 20px; } #press .intro h1 { position: absolute; bottom: 80px; left: 20px; font-size: 40px; font-weight: 100; color: #ffffff; line-height: 60px; text-transform: uppercase; text-shadow: 0 1px 2px rgba( 0, 0, 0, 0.6 ); } #press .intro time { position: absolute; bottom: 30px; left: 20px; font-size: 26px; color: #b0b7be; line-height: 30px; text-transform: uppercase; } #press .intro h6 { position: absolute; right: 20px; bottom: 30px; font-size: 16px; color: #e84c3d; line-height: 30px; text-transform: uppercase; } #press .intro nav { position: absolute; bottom: 30px; left: 20px; width: 140px; height: 40px; font-size: 14px; color: #ffffff; line-height: 40px; text-transform: uppercase; border: 1px solid #f0f0f0; border-radius: 3px; list-style: none; cursor: pointer; } #press .intro nav:before { position: absolute; top: 0; right: 0; display: block; width: 35px; height: 40px; content: ""; background: url( "../images/global.png" ) no-repeat -155px -55px; } #press .intro span { display: block; line-height: 40px; padding: 0 0 0 10px; cursor: pointer; } #press .intro ul { position: absolute; z-index: 11; top: 42px; left: 0; display: none; width: 100%; overflow: auto; max-height: 180px; background-color: #f0f0f0; border-radius: 3px; box-shadow: 1px 1px 2px 0 rgba( 0, 0, 0, 0.3 ); list-style: none; } #press .intro li { display: block; } #press .intro li a { display: block; padding: 0 0 0 10px; color: #50575a; font-size: 14px; line-height: 30px; text-transform: uppercase; } #press .intro ul a:hover { color: #f0f0f0; background-color: #50575a; } #press article { max-width: 800px; margin: 0 auto 70px auto; padding: 0 20px 50px 20px; font-size: 16px; color: #70777f; line-height: 180%; border-bottom: 1px dotted #e0e7ef; } #press header { position: relative; min-height: 30px; margin: 0 0 40px 0; } #press header h2 { margin: 0 0 20px 0; padding: 0 120px 0 0; font-size: 16px; font-weight: bold; color: #00050a; line-height: 30px; text-transform: uppercase; } #press header time { position: absolute; top: 0; right: 0; font-size: 16px; color: #b0b7be; line-height: 30px; text-transform: uppercase; } #press header a:hover { color: #e84c3d; } #press article p { margin: 0 0 20px 0; padding: 0; text-align: justify; } #press article ul, #press article ol { padding: 0 0 0 0; list-style-position: inside; } #press article li { padding: 0 0 0 0; } #press article br { clear: both; } #press article .more { display: block; width: 100px; clear: both; line-height: 40px; font-size: 12px; color: #80878f; text-align: center; text-transform: uppercase; border: 1px solid #e0eaef; border-radius: 3px; transition: all 0.2s ease-in-out; } #press article .more:hover { color: #f83c2d; border: 1px solid #f83c2d; }  #press footer { display: block; max-width: 800px; min-height: 40px; margin: 0 auto 0 auto; padding: 0; overflow: auto; clear: both; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: one; } #press footer span , #press footer a { float: left; width: 30px; margin: 0 10px 0 0; padding: 0; color: #ffffff; font-weight: bold; line-height: 30px; text-align: center; text-shadow: 1px 1px 0px rgba( 0, 0, 0, 0.2 ); background-color: #3b81de; border-radius: 3px; } #press footer a:hover { background-color: #cd1231; cursor: pointer; } #press footer span { color: #ffffff; background-color: #232323; } #press footer h4 { float: right; margin: 4px 0 0 0; font-size: 16px; font-weight: bold; }  #press .share { max-width: 800px; height: 50px; margin: 0 auto 20px auto; padding: 0 20px 0 20px; overflow: visible; text-align: center; list-style-type: none; } #press .share li { position: relative; float: left; width: 40px; height: 40px; margin: 0; padding: 0; } #press .share a { position: absolute; top: 5px; left: 0; display: block; width: 30px; height: 30px; background: url( "../images/global.png" ) no-repeat #b2ada1; border-radius: 3px; transition: all .25s ease-in-out; } #press .share li:hover a { top: 0px; left: -5px; box-shadow: 5px 5px 0px 0 rgba( 0, 0, 0, 0.4 ); } #press .share .fb { background-position: -60px -160px; } #press .share .tw { background-position: -10px -160px; } #press .share .gp { background-position: -110px -160px; } #press .share .in { background-position: -160px -160px; } #press .share .fb:hover { background-color: #39599f; } #press .share .tw:hover { background-color: #45b0e3; } #press .share .gp:hover { background-color: #d83d2d; } #press .share .in:hover { background-color: #0084d7; } #solutions-main { padding: 130px 0 0 0; } #solutions-main header { position: relative; display: block; max-width: 1200px; height: 40px; margin: 0 auto 50px auto; overflow: hidden; } #solutions-main h1 { position: absolute; z-index: 9; top: 0; left: 50%; display: block; width: 400px; max-width: 1200px; margin: 0 0 0 -200px; text-align: center; font-size: 30px; line-height: 40px; font-weight: bold; background-color: #ffffff; } #solutions-main header:after { position: absolute; display: block; top: 19px; left: 0; height: 2px; width: 100%; content: ""; background-color: #c0c0c0; } #solutions-main ul { display: block; max-width: 1200px; margin: 0 auto 0 auto; list-style: none; } #solutions-main li { position: relative; display: block; float: left; width: 50%; height: 0; padding: 0 0 50% 0; } #solutions-main li:after { position: absolute; display: block; width: 0; height: 0; content: ""; } #solutions-main article { position: absolute; top: 20px; left: 20px; width: calc( 100% - 40px ); height: calc( 100% - 40px ); } #solutions-main h2 { margin: 0 0 20px 0; font-size: 26px; } #solutions-main p { margin: 0 0 10px 0; font-size: 16px; } #solutions-main a { margin: 0 0 10px 0; font-size: 16px; } #solutions-main .cell-1 { background-color: #f5f5f5; } #solutions-main .cell-1:after { top: 50%; right: 0; margin: -40px 0 0 0; border-top: 40px solid transparent; border-bottom: 40px solid transparent; border-right: 40px solid #f0f0f0; } #solutions-main .cell-2 { background-color: #f0f0f0; } #solutions-main .cell-3 { background-color: #f0f0f0; } #solutions-main .cell-3:after { top: 0; left: 50%; margin: 0 0 0 -40px; border-left: 40px solid transparent; border-right: 40px solid transparent; border-top: 40px solid #f5f5f5; } #solutions-main .cell-4 { background-color: #f5f5f5; } #solutions-main .cell-4:after { top: 50%; left: 0; margin: -40px 0 0 0; border-top: 40px solid transparent; border-bottom: 40px solid transparent; border-left: 40px solid #f0f0f0; } #solutions-main .cell-5 { background-color: #f5f5f5; } #solutions-main .cell-5:after { top: 0; left: 50%; margin: 0 0 0 -40px; border-left: 40px solid transparent; border-right: 40px solid transparent; border-top: 40px solid #f0f0f0; } #solutions-main .cell-6 { background-color: #f0f0f0; } #solutions-main .cell-6:after { top: 50%; left: 0 margin: -40% 0 0 0; border-top: 40px solid transparent; border-bottom: 40px solid transparent; border-left: 40px solid #f5f5f5; } #solutions-main .cell-7 { background-color: #f0f0f0; } #solutions-main .cell-7:after { top: 0; left: 50%; margin: 0 0 0 -40px; border-left: 40px solid transparent; border-right: 40px solid transparent; border-top: 40px solid #f5f5f5; } #solutions-main .cell-8 { background-color: #f5f5f5; } #solutions-main .cell-8:after { top: 0; left: 50%; margin: 0 0 0 -40px; border-left: 40px solid transparent; border-right: 40px solid transparent; border-top: 40px solid #f0f0f0; }  #support-center-all { position: relative; top: 0; left: 0; display: block; width: 100%; min-height: 100%; height: auto; margin: 0; padding: 0; overflow: auto; clear: both; background: url( "../images/support-pattern-bg.png" ) scroll repeat #f0f5fa; } #support-center-all:after { display: inline-block; width: 100%; height: 100%; content: " "; overflow: auto; clear: both; }  #support-center { position: relative; display: block; margin: 0 auto 0 auto; padding: 0 0 0 0; overflow: hidden; }  #support-center section { padding: 0 20px 50px 20px; }  #support-center article { max-width: 800px; margin: 0 auto 70px auto; padding: 0 0 50px 0; font-size: 16px; color: #70777f; line-height: 180%; } #support-center article:after { display: block; width: 100%; height: 0; padding: 0; content: ""; clear: both; }  #support-center fieldset { display: block; min-height: 40px; margin: 0 0 40px 0; clear: both; } #support-center fieldset:after { display: block; width: 100%; height: 0; padding: 0; content: ""; clear: both; }  #support-center article h2 { margin: 0 0 40px 0; padding: 0; font-size: 26px; font-weight: 100; color: #232629; text-transform: uppercase; }  #support-center article h3 { margin: 0 0 0 0; padding: 0; font-size: 18px; color: #232629; text-align: justify; }  #support-center article h4 { margin: 0; padding: 0; font-weight: bold; font-size: 16px; color: #50555a; line-height: 50px; text-transform: uppercase; }  #support-center article p { margin: 0 0 20px 0; padding: 0; text-align: left; color: #202f3f; word-break: break-all; }  #support-center a { color: #e84c3d; outline: none; } #support-center a:hover { color: #f80c0d; }  #support-center article i { float: left; margin: 0 10px 10px 0; padding: 0; color: #a0a5aa; }  #support-center article br { clear: both; }  #support-center article input, #support-center article textarea { display: block; width: 100%; margin: 0; color: #404040; background-color: #ffffff; border: 2px solid #d5d5d5; border-radius: 3px; box-sizing: border-box; } #support-center article input { height: 40px; padding: 0 10px 0 10px; line-height: 36px; } #support-center article textarea { min-height: 150px; padding: 10px; resize: vertical; } #support-center article input:focus, #support-center article textarea:focus { border: 2px solid #c5c5c5; }  #support-center article label { display: block; margin: 0 0 10px 0; clear: both; font-size: 16px; font-style: italic; color: #a0a5aa; }  #support-center article .cb, #support-center article .cbs { position: absolute; top: 10px; left: 0; display: block; width: 16px; height: 16px; content: ""; border: 2px solid #d5d5d5; border-radius: 2px; cursor: pointer; } #support-center article .cbs { background: url( "../images/global.png" ) -317px -67px no-repeat #1e88e5; border-color: #1e88e5; }  #support-center article .add-file { position: relative; display: block; width: 40px; height: 40px; background-color: #ffffff; border: 2px solid #d5d5d5; border-radius: 50%; cursor: pointer; } #support-center article .add-file:before { position: absolute; top: 0; left: 0; display: block; width: 40px; height: 40px; content: ""; background: url( "../images/global.png" ) no-repeat -105px -105px; border-radius: 50%; opacity: 0.4; } #support-center article .add-file:hover { border: 2px solid #c5c5c5; } #support-center article .add-file input { display: block; width: 100%; height: 40px; opacity: 0; }  #support-center article .clear-files { display: inline-block; clear: both; font-weight: bold; color: #e84c3d; cursor: pointer; } #support-center article .clear-files:hover { color: #f85c4d; }  #support-center .capcha { position: relative; display: block; width: 130px; height: 40px; overflow: hidden; background-color: #ffffff; } #support-center .capcha span { position: absolute; top: 2px; left: 2px; display: block; width: 86px; padding: 0; font-weight: bold; color: #404040; line-height: 36px; text-align: center; border-right: 2px solid #dddddd; } #support-center .capcha input { position: absolute; top: 0; left: 0; width: 130px; padding: 0 0 0 90px; font-weight: bold; text-align: center; background-color: transparent; }  #support-center article ul { display: block; max-width: 800px; margin: 0; overflow: hidden; list-style: none; } #support-center article ul:after { display: block; width: 100%; height: 0; padding: 0; content: ""; clear: both; } #support-center article ul li { position: relative; display: block; margin: 0; padding: 0 0 0 0; color: #60656a; line-height: 40px; }  #support-center article .reasons li { padding: 0 0 0 40px; }  #support-center .menu { min-height: 10px; padding: 0; }  #support-center article ol { display: block; max-width: 800px; min-height: 40px; margin: 0; list-style: none; } #support-center article ol:after { display: block; width: 100%; height: 0; padding: 0; content: ""; clear: both; } #support-center article ol li { position: relative; display: block; float: left; width: 40px; height: 40px; margin: 0 20px 0 0; padding: 0 0 0 0; border-radius: 3px; background-color: #484848; } #support-center article ol li:hover { background-color: #e84c3d; cursor: pointer; } #support-center article ol .edit { background: url( "../images/global.png" ) -255px -155px no-repeat #484848; } #support-center article ol .back { background: url( "../images/global.png" ) -405px -155px no-repeat #484848; } #support-center article ol .delete { background: url( "../images/global.png" ) -355px -55px no-repeat #484848; } #support-center article ol .solved { background: url( "../images/global.png" ) -305px -155px no-repeat #484848; } #support-center article ol .faq { float: right; margin: 0 0 0 20px; background: url( "../images/global.png" ) -355px -155px no-repeat #484848; } #support-center article ol .create { float: right; margin: 0 0 0 20px; background: url( "../images/global.png" ) -105px -55px no-repeat #484848; } #support-center article ol a { display: block; height: 40px; }  #support-center article .submit { display: block; float: none; width: 130px; clear: both; font-size: 14px; font-weight: bold; color: #ffffff; line-height: 40px; text-align: center; text-transform: uppercase; background-color: #e84c3d; border-radius: 3px; cursor: pointer; } #support-center article .submit:hover { background-color: #f85c4d; }  #support-center article header { position: relative; min-height: 50px; margin: 0 0 20px 0; padding: 0; border-bottom: 1px solid #e0e7ef; }  #support-center article time { position: absolute; top: 0; right: 0; font-size: 16px; color: #b0b7be; line-height: 50px; text-transform: uppercase; }  #support-center .ticket { min-height: 200px; padding: 0 20px 20px 20px; background-color: #ffffff; border: 1px solid #e0e7ef; border-radius: 4px; box-sizing: border-box; box-shadow: 0 0 2px 0 rgba( 0, 0, 0, 0.1 ); }  #support-center .invalidfield { border: 2px solid #f85c4d; }  #support-center .error, #support-center .success, #support-center .warning { margin: 0 auto 120px auto; padding: 20px; border-radius: 5px; box-sizing: border-box; } #support-center .error, #support-center .success, #support-center .warning h6 { font-weight: normal; line-height: 180%; }  #support-center .error { color: #ffffff; background-color: #d04030; }  #support-center .success { color: #ffffff; background-color: #7cb644; }  #support-center .warning { color: #ffffff; background-color: #eea510; }  #support-center .invalid { display: block; padding: 0 0 20px 0; font-size: 32px; line-height: 100%; text-transform: uppercase; text-align: center; } #support-center footer a { margin: 0 20px 0 0; }  #support-center .home { }  #support-center .home h5 { max-width: 1200px; margin: 0 auto 50px auto; font-size: 18px; color: #232629; line-height: 180%; text-align: justify; }  #support-center .home h6 { display: block; max-width: 300px; margin: 0 auto 50px auto; font-weight: bold; font-size: 16px; color: #ffffff; line-height: 50px; text-align: center; background-color: #e84c3d; border-radius: 3px; } #support-center .home h6:hover { background-color: #95c450; } #support-center .home h6 a { display: block; color: #ffffff; } #support-center .home ul { display: block; max-width: 1200px; margin: 0 auto 40px auto;  list-style: none; } #support-center .home ul:after { display: block; width: 100%; height: 0; padding: 0; content: ""; clear: both; } #support-center .home li { position: relative; display: block; float: left; width: 33.33%; height: 0; padding: 0 0 25% 0; } #support-center .home ul div { position: absolute; top: 0; left: 5%; display: block; width: 90%; height: 100%; padding: 10px 0 0 0; background: url( "../images/support-cell-bg.png" ) scroll no-repeat center center / cover #f8fcff; border: 1px solid #e0e5ea; border-radius: 5px; box-sizing: border-box; transition: 0.2s all ease-in-out; } #support-center .home ul h2 { display: block; margin: 0 20px 20px 20px; padding: 20px 0 0 0; font-size: 26px; font-weight: 100; color: #40474f; text-align: center; } #support-center .home ul h4 { display: block; margin: 0 20px 20px 20px; padding: 20px 0 0 0; font-size: 16px; font-weight: 300; color: #40474f; text-align: center; } #support-center .home ul .ico { display: block; margin: 0 auto 0 auto; width: 90px; height: 90px; opacity: 0.3; } #support-center .home .how { background: url( "../images/global.png" ) no-repeat -205px -455px; } #support-center .home .faq { background: url( "../images/global.png" ) no-repeat -5px -455px; } #support-center .home .status { background: url( "../images/global.png" ) no-repeat -105px -455px; } #support-center .home ul h2 { color: #e84c3d; } #support-center .home ul div:hover { background-color: #e5e5e5; border: 1px solid #d0d5da; transform: scale( 1.05 ); } #support-center .home ul div:hover h2 { color: #95c450; }  #support-center .intro { position: relative; height: 500px; margin: 0 0 90px 0; padding: 0 0 0 0; background: url( "../images/support-center-bg.jpg" ) #d5dae5; } #support-center .intro:before { position: absolute; top: 0; left: 0; display: block; width: 100%; height: 100%; content: ""; background-color: rgba( 255, 255, 255, 0.1 ); background: radial-gradient( circle, rgba( 0, 0, 0, 0.3 ), rgba( 0, 0, 0, 0.1 ) ); }  #support-center h1 { position: absolute; top: 180px; left: 0; display: block; width: 100%; font-size: 40px; font-weight: 100; color: #ffffff; line-height: 60px; text-transform: uppercase; text-align: center; text-shadow: 0 1px 2px rgba( 0, 0, 0, 0.6 ); }  #support-center .intro div { position: absolute; top: 280px; left: 50%; display: block; width: 550px; height: 50px; margin: 0 0 0 -275px; padding: 0; overflow: hidden; background-color: #ffffff; border-radius: 3px; } #support-center .intro input { display: block; float: left; width: 470px; height: 30px; padding: 10px; font-size: 16px; color: #70777f; line-height: 40px; background-color: transparent; } #support-center .intro span { position: relative; display: block; float: right; width: 50px; height: 50px; background: url( "../images/global.png" ) no-repeat -600px -100px; cursor: pointer; opacity: 0.7; } #support-center .intro span:before { position: absolute; top: 5px; left: -1px; display: block; width: 1px; height: 40px; content: ""; background-color: #d0d7df; }  #faq-all { position: relative; top: 0; left: 0; display: block; width: 100%; min-height: 100%; height: auto; margin: 0; padding: 0; overflow: auto; clear: both; background: url( "../images/support-pattern-bg.png" ) scroll repeat #f0f5fa; } #faq-all:after { display: inline-block; width: 100%; height: 100%; content: " "; overflow: auto; clear: both; }  #faq { position: relative; display: block; margin: 0 auto 0 auto; padding: 0 0 0 0; overflow: hidden; }  #faq .content { max-width: 800px; margin: 0 auto 0 auto; padding: 0 10px 90px 10px; overflow: hidden; }  #faq .error, #faq .success, #faq .warning { margin: 0 auto 120px auto; padding: 20px; border-radius: 5px; box-sizing: border-box; } #faq .error, #faq .success, #faq .warning h6 { font-weight: normal; line-height: 180%; }  #faq .error { color: #ffffff; background-color: #d04030; }  #faq .success { color: #ffffff; background-color: #7cb644; }  #faq .warning { color: #ffffff; background-color: #eea510; } #faq article { float: left; width: 70%; max-width: 800px; margin: 0 auto 0 auto; padding: 0 0 0 20px; font-size: 16px; color: #70777f; line-height: 180%; box-sizing: border-box; } #faq article:after { display: block; width: 100%; height: 0; padding: 0; content: ""; clear: both; }  #faq article .list { display: block; max-width: 800px; margin: 0; overflow: hidden; list-style: none; } #faq article .list:after { display: block; width: 100%; height: 0; padding: 0; content: ""; clear: both; } #faq article .list li { position: relative; display: block; margin: 0; padding: 0 0 0 0; color: #60656a; line-height: 40px; }  #faq article h2 { margin: 0 0 40px 0; padding: 0; font-size: 26px; font-weight: 100; color: #232629; text-transform: uppercase; }  #faq article p { margin: 0 0 20px 0; padding: 0; text-align: left; color: #202f3f; }  #faq article a { color: #232629; } #faq article a:hover { color: #f80c0d; }  #faq article br { clear: both; }  #faq article ul { display: block; max-width: 800px; margin: 0; overflow: hidden; list-style: none; } #faq article ul:after { display: block; width: 100%; height: 0; padding: 0; content: ""; clear: both; } #faq article ul li { position: relative; display: block; margin: 0; padding: 0 0 0 0; color: #60656a; line-height: 40px; }  #faq article ol { display: block; max-width: 800px; margin: 0; overflow: hidden; list-style: none; } #faq article ol:after { display: block; width: 100%; height: 0; padding: 0; content: ""; clear: both; } #faq article ol li { position: relative; display: block; margin: 0; padding: 0 0 0 0; color: #60656a; line-height: 40px; }  #faq aside { float: left; width: 30%; padding: 0 20px 0 0; border-right: 1px dotted #a0a0a0; box-sizing: border-box; } #faq aside ul { display: block; max-width: 800px; margin: 0 auto 44px auto; padding: 0 0 24px 0; overflow: hidden; border-bottom: 1px dotted #a0a0a0; list-style: none; } #faq aside ul:after { display: block; width: 100%; height: 0; padding: 0; content: ""; clear: both; } #faq aside li { position: relative; display: block; line-height: 40px; margin: 0 0 0 0; font-weight: bold; } #faq aside li a { color: #232629; } #faq aside .sel a { color: #e84c3d; } #faq aside span { display: block; margin: 0; padding: 0 20px 0 20px; font-weight: bold; font-size: 16px; color: #ffffff; line-height: 40px; text-align: center; background-color: #e84c3d; border-radius: 3px; } #faq aside span:hover { background-color: #95c450; } #faq .intro { position: relative; height: 500px; margin: 0 0 90px 0; padding: 0 0 0 0; background: url( "../images/support-center-bg.jpg" ) #d5dae5; } #faq .intro:before { position: absolute; top: 0; left: 0; display: block; width: 100%; height: 100%; content: ""; background-color: rgba( 255, 255, 255, 0.1 ); background: radial-gradient( circle, rgba( 0, 0, 0, 0.3 ), rgba( 0, 0, 0, 0.1 ) ); }  #faq h1 { position: absolute; top: 180px; left: 0; display: block; width: 100%; font-size: 40px; font-weight: 100; color: #ffffff; line-height: 60px; text-transform: uppercase; text-align: center; text-shadow: 0 1px 2px rgba( 0, 0, 0, 0.6 ); }  #faq .intro div { position: absolute; top: 280px; left: 50%; display: block; width: 550px; height: 50px; margin: 0 0 0 -275px; padding: 0; overflow: hidden; background-color: #ffffff; border-radius: 3px; } #faq .intro input { display: block; float: left; width: 470px; height: 30px; padding: 10px; font-size: 16px; color: #70777f; line-height: 40px; background-color: transparent; } #faq .intro span { position: relative; display: block; float: right; width: 50px; height: 50px; background: url( "../images/global.png" ) no-repeat -600px -100px; cursor: pointer; opacity: 0.7; } #faq .intro span:before { position: absolute; top: 5px; left: -1px; display: block; width: 1px; height: 40px; content: ""; background-color: #d0d7df; }  #faq .search { max-width: 800px; margin: 0 auto 70px auto; padding: 0 0 50px 0; } #faq .search ul { display: block; max-width: 800px; margin: 0; overflow: hidden; list-style: none; } #faq .search ul:after { display: block; width: 100%; height: 0; padding: 0; content: ""; clear: both; } #faq .search li { position: relative; display: block; margin: 0; padding: 0 0 0 0; } #faq .search a { display: inline-block; font-size: 16px; color: #e84c3d; line-height: 40px; outline: none; } #faq .search a:hover { color: #f80c0d; } #contact-all { position: relative; top: 0; left: 0; display: block; width: 100%; min-height: 100%; height: auto; margin: 0; padding: 0; overflow: auto; clear: both; background: url( "../images/support-pattern-bg.png" ) scroll repeat #f0f5fa; } #contact-all:after { display: inline-block; width: 100%; height: 100%; content: " "; overflow: auto; clear: both; }  #contact { position: relative; display: block; margin: 0 auto 0 auto; padding: 0 0 0 0; overflow: hidden; }  #contact section { padding: 0 20px 50px 20px; }  #contact article { max-width: 800px; margin: 0 auto 50px auto; padding: 0 0 50px 0; font-size: 16px; color: #70777f; line-height: 180%; } #contact article:after { display: block; width: 100%; height: 0; padding: 0; content: ""; clear: both; }  #contact fieldset { display: block; min-height: 40px; margin: 0 0 40px 0; clear: both; } #contact fieldset:after { display: block; width: 100%; height: 0; padding: 0; content: ""; clear: both; }  #contact article h2 { margin: 0 0 40px 0; padding: 0; font-size: 26px; font-weight: 100; color: #232629; text-transform: uppercase; }  #contact article p { margin: 0 0 20px 0; padding: 0; font-size: 18px; color: #232629; text-align: justify; }  #contact p { margin: 0 0 20px 0; padding: 0; text-align: left; color: #202f3f; }  #contact a { color: #e84c3d; outline: none; } #contact a:hover { color: #f80c0d; }  #contact article br { clear: both; }  #contact article input, #contact article textarea { display: block; width: 100%; margin: 0; color: #404040; background-color: #ffffff; border: 2px solid #d5d5d5; border-radius: 3px; box-sizing: border-box; } #contact article input { height: 40px; padding: 0 10px 0 10px; line-height: 36px; } #contact article textarea { min-height: 150px; padding: 10px; resize: vertical; } #contact article input:focus, #contact article textarea:focus { border: 2px solid #c5c5c5; }  #contact article label { display: block; margin: 0 0 10px 0; clear: both; font-size: 16px; font-style: italic; color: #a0a5aa; }  #contact article .capcha { position: relative; display: block; width: 130px; height: 40px; overflow: hidden; background-color: #ffffff; } #contact article .capcha span { position: absolute; top: 2px; left: 2px; display: block; width: 86px; padding: 0; font-weight: bold; color: #404040; line-height: 36px; text-align: center; border-right: 2px solid #cccccc; } #contact article .capcha input { position: absolute; top: 0; left: 0; width: 130px; padding: 0 0 0 90px; font-weight: bold; text-align: center; background-color: transparent; }  #contact .select { position: relative; display: block; height: 40px; margin: 0 0 0 0; background-color: #ffffff; border: 2px solid #d5d5d5; border-radius: 3px; cursor: pointer; box-sizing: border-box; } #contact .select:after { position: absolute; top: 0; right: 0; display: block; width: 36px; height: 36px; content: ""; background: url( "../images/global.png" ) no-repeat -457px -307px; border-left: 2px solid #80858a; opacity: 0.3; } #contact .select h6 { position: absolute; top: 0; left: 10px; width: 200px; padding: 0; overflow: hidden; font-size: 14px; font-weight: normal; color: #404040; line-height: 40px; white-space: nowrap; text-overflow: ellipsis; } #contact .select ol { position: absolute; top: 36px; left: -2px; display: none; width: 100%; overflow: hidden; list-style: none; background-color: #ffffff; border: 2px solid #d5d5d5; border-radius: 0 0 3px 3px; } #contact .select ol li { display: block; width: 100%; height: 36px; padding: 0 0 0 10px; color: #505050; font-size: 14px; line-height: 36px; border-bottom: 2px solid #d5d5d5; cursor: pointer; } #contact .select ol li:hover { color: #303030; background-color: #f0f0f0; } #contact .select ol li:last-child { border: 0; }  #contact .submit { display: block; float: none; width: 130px; clear: both; font-size: 14px; font-weight: bold; color: #ffffff; line-height: 40px; text-align: center; text-transform: uppercase; background-color: #e84c3d; border-radius: 3px; cursor: pointer; } #contact .submit:hover { background-color: #f85c4d; }  #contact .invalidfield { border: 2px solid #f85c4d; }  #contact .error, #contact .success, #contact .warning { margin: 0 auto 120px auto; padding: 20px; border-radius: 5px; box-sizing: border-box; } #contact .error, #contact .success, #contact .warning h5 { font-weight: normal; line-height: 180%; }  #contact .error { color: #ffffff; background-color: #d04030; }  #contact .success { color: #ffffff; background-color: #7cb644; }  #contact .warning { color: #ffffff; background-color: #eea510; }  #contact .intro { position: relative; height: 500px; margin: 0 0 90px 0; padding: 0 0 0 0; background: url( "../images/support-center-bg.jpg" ) #d5dae5; } #contact .intro:before { position: absolute; top: 0; left: 0; display: block; width: 100%; height: 100%; content: ""; background-color: rgba( 255, 255, 255, 0.1 ); background: radial-gradient( circle, rgba( 0, 0, 0, 0.3 ), rgba( 0, 0, 0, 0.1 ) ); }  #contact h1 { position: absolute; top: 180px; left: 0; display: block; width: 100%; font-size: 40px; font-weight: 100; color: #ffffff; line-height: 60px; text-transform: uppercase; text-align: center; text-shadow: 0 1px 2px rgba( 0, 0, 0, 0.6 ); }  #contact .intro div { position: absolute; top: 280px; left: 50%; display: block; width: 550px; height: 50px; margin: 0 0 0 -275px; padding: 0; overflow: hidden; background-color: #ffffff; border-radius: 3px; } #contact .intro input { display: block; float: left; width: 470px; height: 30px; padding: 10px; font-size: 16px; color: #70777f; line-height: 40px; background-color: transparent; } #contact .intro span { position: relative; display: block; float: right; width: 50px; height: 50px; background: url( "../images/global.png" ) no-repeat -600px -100px; cursor: pointer; opacity: 0.7; } #contact .intro span:before { position: absolute; top: 5px; left: -1px; display: block; width: 1px; height: 40px; content: ""; background-color: #d0d7df; } #partners { padding: 130px 0 50px 0; } #partners header { position: relative; display: block; max-width: 1200px; height: 40px; margin: 0 auto 50px auto; overflow: hidden; } #partners h1 { position: absolute; z-index: 9; top: 0; left: 50%; display: block; width: 400px; max-width: 1200px; margin: 0 0 0 -200px; text-align: center; font-size: 30px; line-height: 40px; font-weight: bold; background-color: #f8f8f8; } #partners header:after { position: absolute; display: block; top: 19px; left: 0; height: 2px; width: 100%; content: ""; background-color: #c0c0c0; } #partners p { margin: 0 0 50px 0; font-size: 20px; line-height: 34px; color: #808080; text-align: center; } #partners ul { display: block; max-width: 800px; margin: 0 auto 0 auto; list-style: none; } #partners ul:after { display: block; width: 100%; height: 0; clear: both; content: ""; } #partners li { position: relative; display: block; float: left; width: 50%; height: 0; padding: 0 0 calc( 50% - 1px ) 0; box-sizing: border-box; border-top: 1px solid #e5e5e5; border-right: 1px solid #ffffff; } #partners li:nth-child( odd ) { border-right: 1px solid #e5e5e5; } #partners li:nth-child( 1 ), #partners li:nth-child( 2 ) { border-top: 0; } #partners li:hover { background-color: #a0a0a0; } #partners li img { display: block; width: 100%; margin: 0 auto 0 auto; opacity: 1; transition: all 0.2s ease-in-out; } #partners li:hover img { opacity: 0.8; }  #accounts { position: absolute; top: 100px; left: 50%; display: block; width: 400px; height: auto; margin: 0 0 0 -200px; padding: 0 0 0 0; overflow: auto; background-color: rgba( 53, 117, 211, 0.9 ); box-shadow: 0 0 10px 0 rgba( 0, 0, 0, 0.5 ); } #accounts header { display: block; width: 80%; height: 50px; margin: 0 auto 0 auto; padding: 30px 0 0 0; } #accounts h1 { float: left; display: block; width: 80%; margin: 0 0 0 0; color: #ffffff; font-size: 24px; line-height: 24px; } #accounts header a { float: right; margin: 0; color: #ddeeff; font-size: 12px; line-height: 24px; text-transform: uppercase; } #accounts .success, #accounts .error, #accounts .warning { display: block; width: 80%; height: auto; margin: 0 auto 20px auto; padding: 10px; font-size: 14px; font-weight: bold; color: #ffffff; text-align: center; line-height: 150%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } #accounts .success { background-color: #7aa13d; } #accounts .error { background-color: #aa0000; } #accounts .warning { color: #232323; background-color: #fff6cd; } #accounts label { display: block; width: 80%; padding: 0 0 5px 0; margin: 0 auto 0 auto; color: #ccddee; font-size: 10px; clear: both; text-transform: uppercase; line-height: 100%; } #accounts input { display: block; width: 80%; height: 40px; margin: 0 auto 20px auto; padding: 0 10px 0 10px; line-height: 40px; font-size: 15px; color: #ccddee; background-color: #1f4966; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } #accounts input:hover { color: #ffffff; background-color: #3072a0; } #accounts .select { position: relative; width: 80%; height: 40px; margin: 0 0 20px 10%; padding: 8px 10px 8px 10px; background-color: #1f4966; border: 0; opacity: 1; transition:all .25s ease-in-out; -webkit-transition: all .25s ease-in-out; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } #accounts .select span { position: absolute; top: 0px; left: 10px; color: #ccddee; font-size: 15px; line-height: 40px; text-transform: uppercase; } #accounts .select:after { position: absolute; display: block; top: 0px; right: 0px; width: 40px; height: 40px; content: ""; background: url( '../images/global.png') no-repeat 0px -250px; } #accounts select { z-index: 3; position: absolute; top: 0px; left: 0px; width: 100%; height: 40px; padding: 5px 0 5px 0; color: #aabbcc; font-weight: normal; background-color: #1f4966; opacity: 0; text-transform: uppercase; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } #accounts .cb, #accounts .cbs { float: right; width: 18px; height: 18px; margin: 0 10% 10px 10px; border: 1px solid #ccddee; background-color: transparent; font-size: 0px; cursor: pointer; } #accounts .cbs { width: 20px; height: 20px; border: 0; background: url( '../images/global.png' ) no-repeat -365px -15px; } #accounts h5 { float: right; font-size: 12px; margin: 0 0 10px 0; color: #ccddee; line-height: 20px; } #accounts .submit { float: left; width: 80%; height: 40px; margin: 20px 0 20px 10%; padding: 0; font-size: 14px; line-height: 40px; color: #ffffff; background-color: #bf2e1b; cursor: pointer; font-weight: bold; text-align: center; text-transform: uppercase; clear: both; } #accounts .submit:hover { background-color: #ea3a2a; }  #accounts footer { float: left; width: 100%; height: 40px; margin: 0; padding: 0; border-top: 1px solid #3072a0; background-color: rgba( 0, 0, 0, 0.5 ); } #accounts footer a { display: block; float: left; width: 33.33%; padding: 0 0 0 0; margin: 0; font-size: 12px; color: #aabbcc; cursor: pointer; font-weight: bold; text-align: center; line-height: 40px; border-right: 1px solid #3072a0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } #accounts footer a:last-child { border: none; } #accounts footer a:hover { color: #fe4448; } #accounts .strength { display: block; width: 80%; height: 5px; margin: 0 auto 0 auto; } #accounts .strength div { display: none; float: left; width: 80px; height: 5px; background-color: #aa0033; }  #legal { position: relative; max-width: 800px; min-height: 100px; margin: 0 auto 0 auto; padding: 100px 10px 20px 10px; overflow: hidden; font-size: 16px; color: #50555a; line-height: 180%; } #legal header { display: block; margin: 0 0 20px 0; padding: 0 0 20px 0; overflow: hidden; text-align: center; border-bottom: 1px dotted #e0e5ea; } #legal h1 { position: relative; display: inline-block; height: auto; font-size: 20px; font-weight: normal; color: #000000; line-height: 40px; text-transform: uppercase; vertical-align: middle; } #legal h2 { position: relative; height: auto; margin: 0 0 10px 0; padding: 20px 0 0 0; font-size: 20px; font-weight: 100; color: #10151a; line-height: 30px; text-transform: uppercase; vertical-align: middle; } #legal p { margin: 0 0 1em 0; text-align: justify; } #legal br { clear: both; } #legal ul { margin: 0 0 1em 0; padding: 0 0 0 1em; } #legal ul li { position: relative; margin: 0 0 0 0; padding: 0 0 0 1em; } #legal ol { margin: 0 0 1em 0; padding: 0 0 0 1em; list-style: none; } #legal ol li { position: relative; display: block; margin: 0 0 0 0; padding: 0 0 0 1em; } #legal ol li:before { position: absolute; top: 0; left: 0; content: "-"; } #legal a { color: #11a6bb; } #legal a:hover { color: #fe5c57; } #legal i { display: block; color: #80858a; }  #status-page { position: relative; max-width: 800px; min-height: 100px; margin: 0 auto 0 auto; padding: 40px 10px 20px 10px; overflow: hidden; font-size: 16px; } #status-page h1 { position: relative; height: auto; margin: 0 0 0 0; padding: 0 0 0 0; font-size: 20px; font-weight: bold; color: #ffffff; line-height: 50px; text-align: center; text-transform: uppercase; vertical-align: middle; background-color: #60bc73; } #status-page h2 { position: relative; display: block; font-weight: 400; color: #30353a; font-size: 20px; line-height: 50px; text-align: center; text-transform: uppercase; vertical-align: middle; background-color: #e0e5ea; border-bottom: 1px solid #e0e5ea; } #status-page section { margin: 0 0 50px 0; overflow: hidden; border: 1px solid #e0e5ea; border-radius: 3px; } #status-page br { clear: both; } #status-page a { color: #11a6bb; } #status-page a:hover { color: #fe5c57; } #status-page header { display: block; height: 50px; } #status-page ul { list-style: none; overflow: hidden; clear: both; } #status-page ul li { position: relative; display: block; min-height: 50px; padding: 15px 0 0 150px; overflow: hidden; border-top: 1px dashed #e0e5ea; } #status-page p { display: block; margin: 0 0 20px 0; color: #6b6d68; line-height: 20px; } #status-page time { position: absolute; top: 17px; left: 0; display: block; font-size: 12px; color: #a0a5aa; line-height: 12px; text-transform: uppercase; } #status-page h4 { float: left; font-size: 16px; font-weight: bold; color: #3b3d38; line-height: 50px; } #status-page h5 { float: right; font-size: 14px; color: #4b4d58; line-height: 50px; text-transform: uppercase; }  #status-page .actual article { position: relative; display: block; padding: 0 20px 0 50px; overflow: hidden; background-color: #f0f5fa; border-bottom: 1px solid #e0e5ea; } #status-page .actual article:last-child { border: 0; } #status-page .normal:before { position: absolute; top: 22px; left: 22px; display: block; width: 6px; height: 6px; content: ""; background-color: #60bc73; border-radius: 50%; } #status-page .warning:before { position: absolute; top: 22px; left: 22px; display: block; width: 6px; height: 6px; content: ""; background-color: #e9815d; border-radius: 50%; } #status-page .problem:before { position: absolute; top: 22px; left: 22px; display: block; width: 6px; height: 6px; content: ""; background-color: #d04030; border-radius: 50%; } #status-page .normal h5 { color: #60bc73; } #status-page .warning h5 { color: #e9815d; } #status-page .problem h5 { color: #d04030; }  #status-page .history article { padding: 20px; line-height: 180%; background-color: #f0f5fa; border-bottom: 1px solid #e0e5ea; } #status-page .history article:last-child { border: 0; }   #my-files { position: absolute; z-index: 11; top: 0; left: 0; display: none; width: 250px; height: 100%; margin: 0; padding: 0; overflow: hidden; background-color: rgba( 255, 255, 255, 1 ); }  #my-files header { display: block; height: 50px; background-color: #c40223; } #my-files header span { position: relative; display: block; float: right; width: 50px; height: 50px; margin: 0; padding: 0; overflow: hidden; cursor: pointer; box-sizing: border-box; } #my-files header span:after { position: absolute; top: 0; left: 0; display: block; width: 50px; height: 50px; content: ""; background: url( "../images/global.png" ) no-repeat; opacity: 0.9; } #my-files header span:hover:after { background-color: #d41233; opacity: 1; } #my-files header .cb:after { background-position: -450px -50px; } #my-files header .cbs:after { background-position: -500px -50px; } #my-files header .del:after { background-position: -350px -50px; } #my-files header .filter:after { background-position: -400px -50px; } #my-files header .email:after { background-position: -550px -50px; } #my-files header .find:after { background-position: -600px -50px; } #my-files header .settings:after { background-position: -650px -50px; } #my-files header .close:after { background-position: -250px -50px; } #my-files ol { display: block; float: left; height: 50px; list-style: none; } #my-files ol li { position: relative; display: block; float: left; width: 50px; height: 50px; margin: 0; padding: 0; overflow: hidden; border-right: 1px solid rgba( 0, 0, 0, 0.1 ); cursor: pointer; box-sizing: border-box; } #my-files ol li:last-child { border: 0; } #my-files ol li:after { position: absolute; top: 0; left: 0; display: block; width: 50px; height: 50px; content: ""; background: url( "../images/global.png" ) no-repeat; opacity: 0.9; } #my-files ol li:hover:after { background-color: #d41233; opacity: 1; }  #my-files article { position: absolute; z-index: 11; top: 50px; left: 0; display: none; width: 100%; margin: 0; padding: 20px 0 20px 0; background-color: rgba( 255, 255, 255, 1 ); box-shadow: 0 1px 4px 0 rgba( 0, 0, 0, 0.5 ); } #my-files article input { display: block; width: 220px; height: 40px; margin: 0 0 20px 15px; padding: 0 10px 0 13px; color: #50555a; background-color: transparent; border: 1px solid #e0e5ea; border-radius: 3px; box-sizing: border-box; } #my-files article .select { position: relative; display: block; height: 40px; margin: 0 15px 20px 15px; border: 1px solid #e0e5ea; border-radius: 3px; cursor: pointer; } #my-files article .select span { position: absolute; top: 0; left: 13px; padding: 0; font-size: 14px; color: #505657; line-height: 40px; } #my-files article .select:before { position: absolute; top: 0; right: 0; display: block; width: 40px; height: 40px; content: ""; background: url( "../images/global.png" ) no-repeat -155px -105px; opacity: 0.3; } #my-files article .select select { width: 100%; height: 40px; padding: 10px 0 20px 13px; font-size: 14px; color: #717478; line-height: 40px; } #my-files article .select option { padding: 0 0 0 13px; line-height: 40px; } #my-files article .submit { display: block; margin: 0 15px 0 15px; color: #f0f0f0; line-height: 40px; text-align: center; text-transform: uppercase; background-color: #5199da; border-radius: 3px; cursor: pointer; } #my-files article .submit:hover { color: #ffffff; background-color: #61a9ea; } #my-files article .cancel { float: left; margin: 0; color: #50555a; line-height: 40px; text-align: center; text-transform: uppercase; border-radius: 3px; cursor: pointer; } #my-files ul { display: block; width: 270px; height: calc( 100% - 100px ); padding: 0 0 0 0; overflow: auto; list-style: none; } #my-files ul li { position: relative; display: block; height: 70px; margin: 0; padding: 20px 0 0 50px; overflow: hidden; border-bottom: 1px solid rgba( 0, 0, 0, 0.1 ); }  #my-files ul li:first-child { height: auto; padding: 20px 0 15px 15px; } #my-files ul h3 { display: block; float: left; width: 130px; margin: -3px 0 5px 0; color: #30353a; font-size: 14px; line-height: 20px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } #my-files ul h4 { display: block; float: left; width: 150px; margin: 0 0 5px 0; overflow: hidden; color: #b0b5ba; font-size: 12px; line-height: 12px; text-transform: uppercase; white-space: nowrap; text-overflow: ellipsis; } #my-files ul h5 { display: block; float: left; margin: 0 10px 0 0; color: #b0b5ba; font-size: 12px; line-height: 12px; cursor: pointer; } #my-files ul h5:hover { color: #c40223; } #my-files ul figure { float: left; width: 50px; height: 50px; margin: 0 10px 0 0; background: url( "../images/global.png" ) 0 0 no-repeat; border-radius: 3px; } #my-files ul .ico-0 { background-color: #555555; background-position: 50px 50px; } #my-files ul .ico-1 { background-color: #b82341; background-position: 0px -250px; } #my-files ul .ico-2 { background-color: #7ec069; background-position: -50px -250px; } #my-files ul .ico-3 { background-color: #f0cc39; background-position: -100px -245px; } #my-files ul .ico-4 { background-color: #607ec0; background-position: -150px -250px; } #my-files ul .ico-5 { background-color: #2c9748; background-position: -200px -250px; } #my-files ul .ico-6 { background-color: #e0001f; background-position: -250px -250px; } #my-files ul .ico-7 { background-color: #ec6b37; background-position: -300px -250px; } #my-files ul .ico-8 { background-color: #40c9c8; background-position: -350px -250px; } #my-files ul .cb, #my-files ul .cbs { position: absolute; left: 15px; top: 35px; display: block; width: 16px; height: 16px; margin: 0; cursor: pointer; border-radius: 3px; border: 2px solid #cccccc; } #my-files ul .cbs { background: url( "../images/global.png" ) -317px -67px no-repeat #1e88e5; border: 2px solid #1e88e5; }  #my-files nav { display: block; margin: 0; padding: 10px 0 0 20px; overflow: auto; clear: both; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; } #my-files nav label, #my-files nav span { display: block; float: left; padding: 0 10px 0 10px; margin: 0 10px 0 0; font-weight: bold; color: #40454a; line-height: 30px; background-color: #e0e5ea; border-radius: 3px; } #my-files nav span:hover { color: #ffffff; background-color: #cd1231; cursor: pointer; } #my-files nav label { color: #ffffff; background-color: #272835; } #my-files nav strong { float: right; margin: 0; font-weight: bold; font-size: 16px; line-height: 30px; }  #space-form { position: absolute; z-index: 12; top: 5%; left: 50%; display: none; width: 360px; min-height: 300px; margin: 0 0 0 -180px; padding: 0 0 0 0; overflow: hidden; box-shadow: 0 0 2px 0 rgba( 0, 0, 0, 0.1 ); border-radius: 5px; }  #space-form article { display: none; padding: 30px 0 1px 0; background-color: rgba( 255, 255, 255, 1 ); } #space-form .focus { display: block; }  #space-form header { display: block; min-height: 80px; margin: 0 0 0 0; overflow: hidden; background-color: #37434c; } #space-form header h2 { display: block; color: #a7b3bc; padding: 20px 0 0 0; margin: 0 0 5px 30px; font-size: 20px; font-weight: bold; line-height: 20px; text-transform: uppercase; } #space-form header p { display: block; margin: 0 0 0 30px; font-size: 14px; font-style: italic; color: #87939c; line-height: 20px; } #space-form header p:last-child { padding: 0 0 20px 0; } #space-form header h6 { position: absolute; top: 0; right: 0; display: block; width: 50px; height: 50px; background: url( "../images/global.png" ) -250px -50px no-repeat; opacity: 0.5; cursor: pointer; } #space-form header h6:hover { opacity: 1; } #space-form header ol { display: block; margin: 0 0 0 0; list-style: none; } #space-form header li { position: relative; display: block; float: left; width: 120px; height: 80px; margin: 0; padding: 0; overflow: hidden; cursor: pointer; box-sizing: border-box; } #space-form header li:before { position: absolute; bottom: 15px; left: 0; width: 100%; content: attr( data-label ); font-size: 14px; color: #ffffff; text-align: center; line-height: 14px; } #space-form header span { position: absolute; top: 5px; left: 50%; width: 50px; height: 50px; margin: 0 0 0 -25px; content: ""; background: url( "../images/global.png" ) no-repeat; opacity: 0.9; } #space-form header .settings { background-position: -650px -50px; } #space-form header .security { background-position: -700px -50px; } #space-form header .details { background-position: -750px -50px; } #space-form header .sel { background-color: #ffffff; } #space-form header .sel:before { color: #50555a; } #space-form header .sel .settings { background-position: -650px -100px; } #space-form header .sel .security { background-position: -700px -100px; } #space-form header .sel .details { background-position: -750px -100px; }  #space-form footer { display: block; height: 60px; padding: 20px 0 0 0; background-color: #e0e5ea; } #space-form footer div { float: left; display: block; width: 100px; margin: 0 30px 0 30px; font-size: 12px; font-weight: bold; color: #f0f0f0; line-height: 40px; text-align: center; text-transform: uppercase; background-color: #5199da; border-radius: 3px; cursor: pointer; } #space-form footer div:hover { color: #ffffff; background-color: #61a9ea; } #space-form footer span, #space-form footer a { display: block; float: left; margin: 0 30px 0 0; font-weight: bold; font-size: 12px; color: #80858a; line-height: 40px; text-transform: uppercase; cursor: pointer; } #space-form footer span:hover, #space-form footer a:hover { color: #5199da; }  #space-form label { display: block; margin: 0 0 5px 30px; clear: both; font-size: 10px; color: #a0a5aa; text-transform: uppercase; }  #space-form input { display: block; width: 300px; height: 40px; margin: 0 0 20px 30px; padding: 0 10px 0 10px; clear: both; color: #60656a; line-height: 40px; background-color: transparent; border: 1px solid #e0e5ea; border-radius: 3px; box-sizing: border-box; } #space-form input:focus { border: 1px solid #d0d5da; } #space-form textarea { display: block; width: 300px; height: 60px; margin: 0 0 20px 30px; padding: 10px 10px 0 10px; clear: both; color: #60656a; line-height: 20px; background-color: transparent; border: 1px solid #e0e5ea; border-radius: 3px; box-sizing: border-box; resize: none; } #space-form textarea:focus { border: 1px solid #d0d5da; }  #space-form .file { position: relative; display: block; height: 32px; margin: 0 0 20px 30px; } #space-form .file div { position: relative; display: block; float: left; width: 30px; height: 30px; margin: 0 20px 0 0; background-color: #ffffff; border: 2px solid #d5d5d5; border-radius: 50%; cursor: pointer; } #space-form .file div:before { position: absolute; top: 0; left: 0; display: block; width: 30px; height: 30px; content: ""; background: url( "../images/global.png" ) no-repeat -110px -110px; border-radius: 50%; opacity: 0.4; } #space-form .file div:hover { border: 2px solid #c5c5c5; } #space-form .file input { display: block; width: 100%; height: 30px; margin: 0; padding: 0; opacity: 0; cursor: pointer; } #space-form .file h4 { display: block; float: left; color: #80858a; line-height: 32px; } #space-form .file span { display: block; float: left; max-width: 150px; margin: 0 10px 0 0; overflow: hidden; color: #80858a; line-height: 32px; white-space: nowrap; text-overflow: ellipsis; } #space-form .file span:last-child { margin: 0; color: #5199da; cursor: pointer; } #space-form .file span:last-child:hover { color: #d1141a; }  #space-form .aci { position: relative; display: block; min-height: 40px; margin: 0 30px 20px 30px; overflow: hidden; } #space-form .aci span { position: relative; display: block; width: 100%; height: 40px; padding: 10px; color: #60656a; border: 1px solid #e0e5ea; border-radius: 3px; box-sizing: border-box; cursor: pointer; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; } #space-form .aci span:after { position: absolute; top: 0; right: 0; display: block; width: 40px; height: 38px; content: ""; background: url( "../images/global.png" ) no-repeat -455px -305px; border-left: 1px solid #c0c5ca; opacity: 0.5; } #space-form .aci input { position: absolute; z-index: 6; top: 50px; left: 10px; display: none; width: 280px; height: 40px; margin: 0; padding: 10px; clear: both; color: #60656a; border: 1px solid #e0e5ea; border-radius: 3px; box-sizing: border-box; } #space-form .aci ol { display: none; width: 100%; padding: 60px 0 0 0; overflow: hidden; background-color: #ffffff; border-left: 1px solid #e0e5ea; border-right: 1px solid #e0e5ea; border-bottom: 1px solid #e0e5ea; border-radius: 0 0 3px 3px; box-sizing: border-box; list-style-type: none; } #space-form .aci li { display: block; width: 100%; padding: 0 0 0 10px; color: #60656a; line-height: 30px; box-sizing: border-box; cursor: pointer; } #space-form .aci li:hover { background-color: #d5d5d5; } #space-form .aci .sel { background-color: #a5a5a5; } #space-form .aciv { } #space-form .aciv input { display: block; } #space-form .aciv ol { display: block; list-style: none; } #space-form .aciv span:after { background-position: -405px -305px; border: 0; } #space-form .aciv span { border-bottom: 0; }  #space-form .submit { display: block; margin: 0 30px 20px 30px; clear: both; color: #f0f0f0; line-height: 40px; text-align: center; text-transform: uppercase; background-color: #5199da; border-radius: 3px; cursor: pointer; } #space-form .submit:hover { color: #ffffff; background-color: #61a9ea; }  #space-form .cb, #space-form .cbs { display: block; float: left; width: 16px; height: 16px; margin: 0 10px 20px 30px; border: 2px solid #cccccc; border-radius: 3px; cursor: pointer; } #space-form .cbs { background: url( "../images/global.png" ) -317px -67px no-repeat #1e88e5; border: 2px solid #1e88e5; } #space-form i { float: left; margin: 0 0 20px 0; font-size: 14px; color: #b0b5ba; line-height: 20px; }  #space-form .on, #space-form .off, #space-form .yes, #space-form .no { display: block; width: 80px; height: 40px; margin: 0 0 20px 30px; overflow: hidden; background: url( "../images/global.png" ) #e0e0e0 no-repeat; border-radius: 3px; cursor: pointer; transition: all .25s ease-in-out; -webkit-transition: all .25s ease-in-out; } #space-form .on { background-position: -250px -705px; } #space-form .off { background-position: -290px -705px; } #space-form .yes { background-position: -400px -705px; } #space-form .no { background-position: -440px -705px; }  #space-form .select { position: relative; display: block; height: 40px; margin: 0 30px 20px 30px; border: 1px solid #e0e5ea; border-radius: 3px; cursor: pointer; } #space-form .select:after { position: absolute; top: 0; right: 0; display: block; width: 40px; height: 40px; content: ""; background: url( "../images/global.png" ) no-repeat -455px -305px; border-left: 1px solid #a0a5aa; opacity: 0.3; } #space-form .select h6 { position: absolute; top: 0; left: 10px; width: 200px; padding: 0; font-size: 14px; font-weight: normal; color: #40454a; line-height: 40px; } #space-form .select ol { position: absolute; z-index: 11; top: 40px; left: -1px; display: none; width: 100%; max-height: 205px; overflow: auto; list-style: none; background-color: #ffffff; border: 1px solid #e0e5ea; border-radius: 0 0 3px 3px; } #space-form .select ol li { display: block; height: 40px; padding: 0 0 0 10px; color: #5a5f67; line-height: 40px; border-bottom: 1px solid #e0e5ea; cursor: pointer; } #space-form .select ol li:last-child { border: 0; }  #space-form .footer-link { display: inline-block; margin: 0 0 30px 30px; color: #5199da; line-height: 100%; cursor: pointer; } #space-form .footer-link:hover { color: #d1141a; }  #spaceloginbg { position: fixed; z-index: 10; top: 0; left: 0; display: none; width: 100%; height: 100%; background-color: rgba( 0, 0, 0, 0.5 ); }  #how-it-works { position: relative; max-width: 600px; min-height: 100px; margin: 0 auto 0 auto; padding: 40px 10px 20px 10px; font-size: 16px; line-height: 180%; overflow: hidden; } #how-it-works header { overflow: hidden; display: block; margin: 0 0 40px 0; padding: 0 0 0 0; text-align: left; } #how-it-works h1 { position: relative; display: inline-block; height: auto; color: #ff0000; font-size: 20px; line-height: 40px; font-weight: 400; text-transform: uppercase; vertical-align: middle; }  #how-it-works h2 { position: relative; height: auto; margin: 0 0 20px 0; padding: 0 0 0 20px; color: #30353a; font-size: 20px; line-height: 20px; font-weight: bold; vertical-align: middle; } #how-it-works h2:before { position: absolute; top: 0; left: 0; width: 5px; height: 100%; background-color: #ff0000; content: ""; } #how-it-works p { margin: 0 0 1em 0; text-align: justify; color: #30353a; } #how-it-works br { clear: both; } #how-it-works ul { margin: 0 0 0 0; padding: 0 0 0 1em; } #how-it-works ul li { position: relative; margin: 0 0 0 0; padding: 0 0 0 1em; color: #30353a; } #how-it-works ol { margin: 0 0 1em 0; padding: 0 0 0 1em; } #how-it-works ol li { margin: 0 0 1em 0; padding: 0 0 0 1em; color: #30353a; } #how-it-works a { color: #11a6bb; } #how-it-works a:hover { color: #fe5c57; }  @media only screen and ( max-width : 1200px ) {       #support-center .home li { padding: 0 0 30% 0; } #support-center .home ul h4 { display: none; } } @media only screen and ( max-width : 960px ) {  #about { font-size: 16px; } #about .upload h2 { padding: 60px 0 0 0; } #about .upload .storage { transform: scale( 0.8 ); } #about .upload span { transform: scale( 0.8 ); }  #advertise { font-size: 16px; } #advertise .stats ul li { width: 50%; } #advertise .stats ul li:nth-child( odd ) { border-right: 2px solid rgba( 0, 0, 100, 0.1 ); } #advertise .stats ul li:last-child { width: 100%; border-top: 2px solid rgba( 0, 0, 100, 0.1 ); border-right: 0; } #advertise .stats .b-right { border-right: 0; }   #footer aside { width: 35%; } #footer nav { width: 65%; } #footer div span { margin: 0 20px 0 0; }   #support-center .home li { padding: 0 0 33.33% 0; } } @media only screen and ( max-width : 800px ) {    #footer aside { float: none; width: 260px; margin: 0 auto 50px auto; clear: both; } #footer nav { float: none; width: 100%; clear: both; } #footer nav ul { width: 23.33%; margin: 0 5% 50px 5%; } #footer div { text-align: center; } #footer div span { float: none; margin: 0 10px 0 10px; } #footer ol { float: none; padding: 20px 0 0 0; clear: both; text-align: center; } #footer ol li { float: none; display: inline-block; margin: 0 5px 0 5px; }  #press .intro h1 { font-size: 30px; line-height: 50px; } #press .intro time { font-size: 20px; } #press .share li { float: none; display: inline-block; }  #support-center .home ul h2 { font-size: 20px; }  #faq aside { float: none; width: 100%; margin: 0 0 20px 0; padding: 0 0 20px 0; border-right: 0; border-bottom: 1px solid #a0a0a0; } #faq aside ul { margin: 0 auto 20px auto; border-bottom: 1px solid #a0a0a0; } #faq aside li { text-align: center; } #faq aside span { display: block; width: 200px; margin: 0 auto 0 auto; } #faq article { float: none; width: 100%; } #faq article .list li { border-bottom: 1px dotted #a0a0a0; } } @media only screen and ( max-width : 640px ) {  #page-not-found article { top: 20%; left: 0; width: 100%; height: 100%; margin: 0 0 0 0; }  #about { font-size: 12px; } #about .hero img { display: block; width: 60px; height: 60px; margin: 0 auto 20px auto; } #about .hero h1 { margin: 0 10px 20px 10px; line-height: 120%; } #about .hero h2 { font-size: 2em; } #about .upload .storage { transform: scale( 0.6 ); } #about .upload span { transform: scale( 0.6 ); } #about .details article {  }  #advertise { font-size: 12px; } #advertise .stats ul li { float: none; width: 100%; clear: both; border-bottom: 2px solid rgba( 0, 0, 100, 0.1 ); } #advertise .stats ul li:nth-child( odd ) { border-right: 0; } #advertise .stats ul li:last-child { border: 0; }   #footer article { padding: 0 10px 0 10px; } #footer nav ul { width: 33.33%; margin: 0 0 50px 0; } #footer nav ul li { text-align: center; } #footer div span { margin: 0 5px 0 5px; } #footer div span:first-child { float: none; display: block; margin: 0 0 20px 0; clear: both; }   #support-center .intro div { width: 350px; margin: 0 0 0 -175px; } #support-center .intro input { width: 270px; } #support-center .home li { padding: 0 0 30% 0; } #support-center .home ul h2 { display: none; }  #faq h1 { font-size: 30px; line-height: 40px; } #faq .intro div { width: 350px; margin: 0 0 0 -175px; } #faq .intro input { width: 270px; }  #contact h1 { font-size: 30px; line-height: 40px; } #contact .intro div { width: 350px; margin: 0 0 0 -175px; } #contact .intro input { width: 270px; } } @media only screen and ( max-width : 480px ) {  #about .hero img { } #about .hero h1 { } #about .hero h2 { }   #footer aside { margin: 0 auto 35px auto; } #footer nav ul { float: none; width: 100%; margin: 0 0 0 0; } #footer nav ul:last-child { margin: 0 0 35px 0; } #footer nav ul li:first-child { display: none; } #footer div { padding: 35px 0 0 0; }   #support-center .home ul .ico { margin: -10px auto 0 auto; } } 