4832ff5798fb5c1d4b7a8c186ee97ad58aa4887f
[face-privacy-filter.git] / web_demo / face-privacy.css
1 /*
2   ===============LICENSE_START=======================================================
3   Acumos Apache-2.0
4   ===================================================================================
5   Copyright (C) 2017-2018 AT&T Intellectual Property & Tech Mahindra. All rights reserved.
6   ===================================================================================
7   This Acumos software file is distributed by AT&T and Tech Mahindra
8   under the Apache License, Version 2.0 (the "License");
9   you may not use this file except in compliance with the License.
10   You may obtain a copy of the License at
11
12   http://www.apache.org/licenses/LICENSE-2.0
13
14   This file is distributed on an "AS IS" BASIS,
15   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
16   See the License for the specific language governing permissions and
17   limitations under the License.
18   ===============LICENSE_END=========================================================
19 */
20 body {
21   font-size:100%;
22   font-family:Trebuchet MS,Tahoma,Verdana,Arial,sans-serif;
23 }
24
25 #resultsDiv {
26   position: absolute;
27   top: 120px;
28   right: 50px;
29   color: #000;
30   text-align: center;
31   font-size: 20px;
32   background-color: rgba(221, 221, 221, 0.8);
33   width: 220px;
34   padding: 10px 0;
35   z-index: 2147483647;
36 }
37
38 hr {
39     margin: 10px 0;
40     width:100%;
41     clear: both;
42     float: none;
43 }
44
45 #srcVideo {
46   z-index: 1;
47 }
48 .videoWin {
49     //margin: -25px 0px;
50     //height: 80px;
51     // width: 120px;
52     // position: absolute;
53     // left: 15px;
54     // top: 10px;
55     max-width:100%;
56     max-height:300px;
57     margin-left: auto;
58     margin-right: auto;
59     width: auto;
60     height: auto;
61 }
62
63
64 .workingImage {
65     opacity: 0.7;
66 }
67
68 table {
69   border-collapse: collapse;
70   width: 100%;
71 }
72
73 th, td {
74   text-align: left;
75   padding: 8px;
76 }
77
78 th, .header {
79   background-color: #4CAF50;
80   color: white;
81 }
82
83 .tableConfig td:nth-child(odd) {
84     text-align:right;
85 }
86
87 tr:nth-child(even){
88   background-color: #c8c8c8;
89 }
90
91 br {
92     float: none;
93     clear: both;
94 }
95
96 .tiny {
97     font-size: x-small;
98     text-transform: uppercase;
99 }
100
101 .mediaRibbon div {
102     float:left;
103     clear: none;
104     padding: 2px;
105     border: solid #888 3px;
106     margin: 2px;
107     width: 40%;
108     background: rgba(221, 221, 221, 0.8); // #DDD;
109 }
110
111 #sourceRibbon div {
112     width:15%;
113 }
114
115 #sourceRibbon div:hover, #sourceRibbon div.selected {
116     border: solid blue 3px;
117     background: #BBB;
118 }
119
120
121 .mediaRibbon div img, .mediaRibbon div canvas {
122     display: block;
123     max-width:100%;
124     max-height:300px;
125     margin-left: auto;
126     margin-right: auto;
127     width: auto;
128     height: auto;
129 }
130
131
132 #sourceRibbon div img, #sourceRibbon div canvas {
133     max-height:95px;
134 }
135
136 .mediaRibbon div span {
137     font-size: small;
138     text-align: center;
139     clear: both;
140     display: block;
141 }
142