Mercurial > hg > nodescore
diff www/m/css/nodescore-tablet.css @ 42:49c94f63b8b0
css for nexus 7 and associated files- archive m.a added - remove later
author | tzara <rc-web@kiben.net> |
---|---|
date | Tue, 04 Sep 2012 07:25:49 +0000 |
parents | |
children | 7f0485e0d0ff |
line wrap: on
line diff
--- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/www/m/css/nodescore-tablet.css Tue Sep 04 07:25:49 2012 +0000 @@ -0,0 +1,373 @@ +body{ + background-color: black; + color: white; + font: 12px Helvetica, Arial; + padding:0px; + margin-top:0px; + margin-left:0px; + height:100%; +} + + + +h3,h4,h5,h6 { + width: 400px; + background-color: white; + display: inline; + color: #666; + z-index: 2; +} + +h1{ background-color: black; color:white;font: 44px Helvetica, Arial; } +h2{ font: 28px Helvetica, Arial; color:white} +h3{ font: 12px Helvetica, Arial; color:white } +h4{ background-color: black; font: 19px Helvetica, Arial; + text-align: center; margin-left:auto; margin-right:auto; color:white} + +a:link {color:#666;} +a:visited {color: #666;} +a:hover {color: black; background-color:gray;} +a:active {color: black;background-color:white;} + +ul, li, h4, h3, h2, h1, p{ + padding:0; + margin:0; + list-style:none; +} + + +.outermaster{ + margin-top:4px; + height: 470px; + width: 1024px; + border-radius: 15px; + background-color:black; + border: 1px solid gray; + position: relative; + !padding: 5px 5px 5px 5px ; + color: white; + opacity:0.8; + !top: 10% + +filter: invert(100%); + margin-left: 0px; + padding:0px; +} + +#live{ + !margin-left:auto; + !margin-right:auto; + !margin-top:5px; + !margin: 2px; + width: 100%; + height: 465px; + text-align: center; + border-radius: 15px; + background-color:black; + border: 0px solid blue; + position: absolute; +! padding: 5px 5px 5px 5px ; + color: white; + top: 0px; + +filter: invert(100%); + z-index:-1; + margin-left: 0px; + padding:0px; +} + +#info{ +position: absolute; +border: 0px solid red; +border-radius:15px; +top: 338px; +!padding: 5px 5px 5px 5px; +height: 135px; +width: 100%; +} + +#comms{ + border-radius: 15px; + height: 120px; + width: 250px; + margin: 0px; + border: 1px solid gray; + color: black; + float:left; + padding: 5px 5px 5px 5px; +} + +#midfoot{ + !margin-left:auto; margin-right:auto; + border-radius: 15px; + height: 120px; + width: 30%; + margin: 0px; + margin-left:15px; + border: 1px solid gray; + padding: 5px 5px 5px 5px ; + background: black; + opacity:1; + float:left; +} + +#preview{ + border-radius: 15px; + height: 120px; + width: 400px; + margin: 0px; + border: 1px solid gray; + !position: absolute; + !top: 325px; + !right: 0px; + padding: 5px 5px 5px 5px ; + color: black; + overflow:hidden; + float:right; +} + +#timeinfo{ + border-radius: 15px; + height:80px; + width: 95%; + margin: 0px; + padding: 5px 5px 5px 5px ; + background: transparent; + position:relative; + top:30px; +} + +#remainingtime{ +!display:table-cell; vertical-align:middle; +font-size:1.4em; +color:white; +position:relative; +left:30px; +top:40px; +width: 120px; +float:left; +background-color:transparent; +} + +.footdata{ + !margin-top:10px; + margin-left:auto; margin-right:auto; + border-radius: 15px; + height: 50px; + width: 100%; + !margin: 10px; + border: 0px solid gray; + position:absolute; + top: 0px; +! padding: 5px 5px 5px 5px ; + background: black; + opacity:1; +} + + +.outersquare{ + border-radius: 15px; + border: 1px solid blue; + ! position: absolute; + !top: 50px; + !left: 110px; + padding: 1px 1px 1px 1px ; + background: black; + width: 99%; + height: 690px; +} + +.svgmusic { + display:block; + border-radius: 15px; + margin: 0px; + width: 100%; +height: 450px; +} + +.magicsquare { +! margin: 10px; + border-radius: 5px; + border: 1px solid yellow; + !padding: 2px 2px 2px 2px; + background: transparent; + width: 50px; height: 45px; + border-radius: 10px; + float: left; + color: white; + font-size: 3em; + text-align: center; +} + +.latencies{ +! height: 90px; width: 200px; +! border: 1px solid blue; +! position: relative; top: 15%; +! float: right; +! padding: 5px 5px 5px 5px ; +! background-color: yellow; +} + + +#datetime{ +! display:table-cell; vertical-align:middle; + width:80px; + float:clear; + !margin-top: 30px; + !margin-right: 30px; + !float:left; + !padding: 1px 1px 1px 1px; + font-size:1em; color: white; + !position: absolute; + !bottom: 10px; + !left: 25%; + !float: left; + !background-color: transparent; + !opacity: 0.7; +} + +#current{ + float:right; + position: relative; + right: 5%; + bottom:-5px; + font-size:1.7em; + font-weight: bold; + color: white; + background-color: transparent; + z-index: 3; + opacity: 0.8; + padding: 3px 3px 3px 3px; +} + +#client_latency{ + background:transparent; + width:135px; + font-size:1.2em; + color: white; + z-index: 1; + padding: 3px 3px 3px 3px; + opacity: 0.6; + float:left; + position:relative; + left: 100px; + bottom: 10px; + +} + +.metrocase { + float:right; + border-radius: 5px; + position: relative; + right: 40px; + top:-25px; + width: 50px; + height: 30px; + color: black; + text-align: center; + font-size: 4em; font-color: black; + background: transparent; + z-index: 2; + border: 1px solid white; +} + +#metronome0 { position: absolute; width: 50px; height: 30px; border-radius: 5px; float:left; } +#metronome1 { width: 50px; height: 40px; border-radius: 30px; float:left; } +#metronome2 { width: 50px; height: 40px; border-radius: 30px; float:left; } +#metronome3 { width: 50px; height: 40px; border-radius: 30px; float:left; } + +#fluid {} +.fluid-img{ height:50%; width:50%; } + +.clear { clear:both; } + +#midcomms{ +color:white; +width:160px; +height:40px; +background-color:transparent; +border: 0px solid yellow; +float:left; +} + +#client_chronometer{ + display:table-cell; vertical-align:middle; + border-radius: 15px; + !border: 2px solid gray ; + float:right; + background-color: black; + color: white; + font-size: 2.8em; + text-align: center; + opacity:0.7; + position: relative; + left: 20px; + bottom:10px; + width: 200px; + !height: 40px; + z-position: 2; +} + +#counttitle{ + font-size:3em; + margin:0; + float:left; + width:120px; + position:relative; + top:5px; + left:5px; +} + +#count { + width:40px; + font-size: 5em; + font-weight:bolder; + margin:0; + padding:0; + position:relative; + left:15px; + top: -10px; + background:transparent; + float:left; + display:inline; +} + +#totalcountdown { + font-size: 1.3em; + color:red; + position:relative; + left: 10px; + !top: 0px; + !text-align:center + font-weight:bolder; + !width:100%; + !float:left; + display:inline; + + +} + +#countinnumber{ + border-radius: 15px; + position: absolute; + !width: 100%; + !height: 90%; + background-color:black; + font-size: 10em; + font-weight:bolder; + display:inline; + text-align:center; + z-index: 2; + opacity:0.5; + float:left; +} + +#content-txt { + width: 100%; height: 90%; + font-size:3em; + text-align:center; + background-color:black; + border:1px solid white; + margin-left:auto; margin-right:auto; + display:table-cell; + vertical-align:middle; + border-radius: 15px; +} \ No newline at end of file