+++ /dev/null
-* {
- -webkit-box-sizing: border-box;
- Box-Sizing: border-box;
- -webkit-backface-visibility: hidden;
- -webkit-transition: translate3d(0,0,0);
-}
-html, body {
- width: 1280px;
- height: 720px;
- margin: 0;
- padding: 0;
- background: transparent;
- overflow: hidden;
- -webkit-font-smoothing: antialiased !important;
-}
-body {
- font-family: 'Lato', sans-serif;
- color: white;
-}
-
-/* Score */
-.scorebug {
- position: fixed;
- font-size: 25px;
- left: 10px;
- top: 10px;
- border-collapse: collapse;
- white-space: nowrap;
- border: 3px solid black;
- z-index: 1;
-}
-.scorebug td {
- border: 3px solid #008;
-}
-.team1color, .team2color {
- width: 15px;
- margin: 5px;
-}
-.team1color {
- background: red;
-}
-.team2color {
- background: green;
-}
-.team1, .team2 {
- font-weight: bold;
- width: 100px;
- text-align: center;
- height: 35px;
- background: #00a;
-}
-.score {
- text-align: center;
- background: #00c;
- width: 110px;
- height: 35px;
-}
-
-/* Clock, to the right of score */
-.clockbug {
- position: fixed;
- font-size: 25px;
- left: 360px;
- top: 10px;
- border-collapse: collapse;
- white-space: nowrap;
- border: 3px solid black;
-}
-.clock {
- border: 3px solid #008;
- background: #00a;
- text-align: center;
- height: 35px;
- width: 90px;
-}
-.clockbug-hidden {
- -webkit-transform:translateX(-200%);
-}
-.clockbug-animate-in {
- -webkit-animation: from-left 1s ease;
-}
-.clockbug-animate-out {
- -webkit-animation: to-left 1s ease;
- -webkit-transform:translateX(-200%);
-}
-
-/* Comment, below score */
-.commentbug {
- position: fixed;
- font-size: 20px;
- left: 10px;
- top: 52px;
- border-collapse: collapse;
- white-space: nowrap;
- border: 3px solid black;
-}
-.comment {
- border: 3px solid #008;
- background: #00a;
- text-align: center;
- height: 30px;
- width: 340px;
-}
-
-.commentbug-hidden {
- -webkit-transform:translateY(-40px);
-}
-.commentbug-animate-in {
- -webkit-animation: from-top 0.5s ease;
-}
-.commentbug-animate-out {
- -webkit-animation: to-top 0.5s ease;
- -webkit-transform:translateY(-40px);
-}
-
-/* Lower third */
-.lowerthird-headline {
- position: fixed;
- font-size: 40px;
- left: 10px;
- top: 520px;
- border-collapse: collapse;
- white-space: nowrap;
- border: 2px solid #ccc;
- height: 118px;
- font-weight: bold;
- width: 1050px;
- /*background: linear-gradient(to right, #ccc, #fff 15px); */
- background-image: url(lowerthird-bg.png);
- color: black;
- /* padding-top: 20px; */
-}
-.lowerthird-headline-hidden {
- width: 0px;
- border-left: 0px;
- border-right: 0px;
-}
-.lowerthird-headline-animate-in {
- -webkit-animation: scale-out 1.0s;
-}
-.lowerthird-headline-animate-out {
- -webkit-animation: scale-in 1.0s;
-}
-.lowerthird-headline-content {
- padding-left: 20px;
- position: absolute;
-}
-.lowerthird-headline-content-hidden {
- clip: rect(0px,0px,200px,0px);
-}
-.lowerthird-headline-content-animate-in {
- -webkit-animation: wipe-out 2.0s ease;
-}
-.lowerthird-headline-content-animate-out {
- -webkit-animation: wipe-in 2.0s ease;
- clip: rect(0px,0px,200px,0px);
-}
-.lowerthird-subheading {
- position: fixed;
- font-size: 24px;
- left: 40px;
- top: 637px;
- height: 40px;
- width: 500px;
- border-collapse: collapse;
- white-space: nowrap;
- border: 1px solid black;
- /*display: flex;
- align-items: center; */
- /*background: linear-gradient(to right, #44c, #33a 15px); */
- background-image: url(lowerthird-bg2.png);
-}
-.lowerthird-subheading-hidden {
- clip: rect(0px,0px,200px,0px);
-}
-.lowerthird-subheading-animate-in {
- -webkit-animation: scale-out-small 1.6s ease;
-}
-.lowerthird-subheading-animate-out {
- -webkit-animation: scale-in-small 1.6s ease;
- width: 0px;
- border-left: 0px;
-}
-.lowerthird-subheading-content {
- position: absolute;
- padding-left: 20px;
-}
-.lowerthird-subheading-content-hidden {
- width: 0px;
- border: 0px;
-}
-.lowerthird-subheading-content-animate-in {
- -webkit-animation: wipe-out 2.2s ease;
-}
-.lowerthird-subheading-content-animate-out {
- -webkit-animation: wipe-in 2.2s ease;
- clip: rect(0px,0px,200px,0px);
-}
-
-/* these are hidden when actually run in casparcg */
-#area {
- position: fixed;
- left: 0px;
- top: 0px;
- width: 1280px;
- height: 720px;
- background: cyan;
-}
-#carousel {
- z-index: 3;
- position: fixed;
- top: 250px;
- font-size: 50px;
- /* background: rgba(0, 0, 170, 0.8); */
- background: transparent;
- top: 20px;
- left: 50px;
- right: 50px;
- width: 1180px;
- border-spacing: 0px 7px;
- text-align: left;
- border-collapse: separate;
- text-transform: uppercase;
- display: none;
-}
-#carousel thead tr {
- text-transform: none;
- text-align: center;
-}
-#carousel thead th {
- text-transform: none;
- text-align: center;
- font-size: 50px;
- -webkit-animation: fade-in 1.0s ease;
- -webkit-animation-delay: 0.0s;
- -webkit-animation-fill-mode: both;
-}
-#carousel tr.subfooter {
- -webkit-animation: fade-in 1.0s ease;
- -webkit-animation-delay: 0.25s;
- -webkit-animation-fill-mode: both;
-}
-#carousel tr {
- /* background: rgba(0, 0, 170, 0.8); */
- background: linear-gradient(to bottom, rgba(0, 0, 170, 0.8), rgba(0, 0, 130, 0.8));
- /* -webkit-animation: fade-in calc(counter(rowNumber) * 1.0)s ease; */
- -webkit-animation: fade-in calc(counter-value(rowNumber) * 1.0s) ease;
-}
-#carousel tr.footer {
- -webkit-animation: fade-in 2.0s ease;
- -webkit-animation-delay: 0.5s;
- -webkit-animation-fill-mode: both;
-}
-#carousel td, #carousel th {
- padding: 8px;
- font-size: 40px;
-}
-#carousel tr.footer td {
- font-size: 20px;
- text-transform: none;
- text-align: center;
-}
-#carousel th.rank {
- padding-left: 20px;
-}
-#carousel td.team {
- width: auto;
-}
-.nplayed, .gd, .pts {
- text-align: center;
-}
-
-#manualcontrols {
- z-index: 4;
- position: fixed;
- top: 250px;
-}
-
-/* Animations */
-@-webkit-keyframes from-left {
- 0% {
- -webkit-transform:translateX(-200%);
- }
- 100% {
- -webkit-transform:translateX(0);
- }
-}
-@-webkit-keyframes to-left {
- 0% {
- -webkit-transform:translateX(0);
- }
- 100% {
- -webkit-transform:translateX(-200%);
- }
-}
-@-webkit-keyframes from-top {
- 0% {
- -webkit-transform:translateY(-40px);
- }
- 100% {
- -webkit-transform:translateY(0);
- }
-}
-@-webkit-keyframes to-top {
- 0% {
- -webkit-transform:translateY(0);
- }
- 100% {
- -webkit-transform:translateY(-40px);
- }
-}
-
-@-webkit-keyframes scale-out {
- 0% {
- width: 0px;
- }
- 100% {
- width: 1050px;
- }
-}
-@-webkit-keyframes scale-in {
- 0% {
- width: 1050px;
- border: 2px solid #ccc;
- }
- 100% {
- width: 0px;
- border: 2px solid #ccc;
- }
-}
-@-webkit-keyframes scale-out-small {
- 0% {
- width: 0px;
- border: 0px;
- }
- 19.99% {
- border: 0px;
- }
- 20% {
- width: 0px;
- border: 1px solid black;
- }
- 100% {
- width: 500px;
- }
-}
-@-webkit-keyframes scale-in-small {
- 0% {
- width: 500px;
- border: 1px solid black;
- }
- 80% {
- width: 0px;
- border: 1px solid black;
- }
- 80.01% {
- border: 0px;
- }
- 100% {
- width: 0px;
- border: 0px;
- }
-}
-@-webkit-keyframes wipe-out {
- 0% {
- clip: rect(0px,0px,200px,0px);
- }
- 20% {
- clip: rect(0px,0px,200px,0px);
- }
- 100% {
- clip: rect(0px,1050px,200px,0px);
- }
-}
-@-webkit-keyframes wipe-in {
- 0% {
- clip: rect(0px,1050px,200px,0px);
- }
- 20% { /* Not symmetrical! */
- clip: rect(0px,0px,200px,0px);
- }
- 100% {
- clip: rect(0px,0px,200px,0px);
- }
-}
-@-webkit-keyframes fade-in {
- 0% {
- opacity: 0.0001;
- }
- 100% {
- opacity: 1;
- }
-}
projects / ultimatescore / blobdiff