# வார்ப்புரு:2019–20 coronavirus pandemic data/styles.css

/* Test this both on firefox and chrome, they implement sticky a bit differently! */  
/* */  
1. covid19-container {
box-sizing: -box; /* otherwise on mobile the table will stick to the gutter - see https://phabricator.wikimedia.org/T247702#5976282 */  
float: ;  
max-width: 100%;  
max-height: 75vh;  
height: 60em;  
overflow: auto;  
/* On some desktop browsers (firefox on linux at least), the scrollbar comes out of the element, and if we don't have some padding, it overlaps the ref column */  
padding-: ;  
}  

.covid-show-table {  
float: ;  
font-size: 75%;  
}  

1. covid19-container:target .covid-show-table {
display: ;  
}  

1. covid19-container:target {
max-width: ;  
max-height: ;  
height: auto;  
overflow-y: visible;  
padding-: 0;  
}  

/* needs to be specific */  
body th.covid-total-row {  
text-align: !important;  
padding-: ;  
}  

@media print {  
1. covid19-container {
max-width: ;  
max-height: ;  
height: auto;  
overflow-y: visible;  
padding-: 0;  
}  
.covid-show-table {  
display: ;  
}  
}  

@media screen {  
.covid-sticky th {  
position: sticky;  
/* firefox works best with 0. to show top , chrome wants 0. or it will show stuff behind. */  
top: 0;  
/* hack for firefox */  
background-clip: padding-box;  
}  

/* based on https://stackoverflow.com/questions/50361698/-style-do-not-work-with-sticky-position-element */  

.covid-sticky th:after,  
.covid-sticky th:before {  
content: '';  
position: absolute;  
: 0;  
width: 100%;  
}  
.covid-sticky th:before {  
/* make it overlap with top before scrolling */  
top: -;  
-top: solid #a2a9b1;  
}  
.covid-sticky th:after {  
bottom: -;  
-bottom: solid #a2a9b1;  
}  
}  
/* Make country line wrap if on small screen */  
@media only screen and (max-width: ) {  
.covid-country-narrow-on-mobile {  
width: 12ch;  
}  

/* needs to be specific */  
body th.covid-total-row {  
padding-: ;  
}  
}  

/* For mobile devices */  
@media only screen and (max-width: ) {  
1. covid19-container {
/* the scrollbar problem reference above doesn't seem to be an issue on mobile, */  
/* and is currently causing the table to be clipped */  
/* checked iOS (Firefox, Safari, Chrome), and Android (Firefox, Chrome) */  
padding-: ;  
/* create space between tablbe and the section hatnote above */  
margin-top: ;  
}  

/* float the [show more] element to the */  
.covid-show-table {  
float: ;  
}  

/* hide the V • T • E element */  
.plainlinks.hlist.navbar.mini {  
display: ;  
}  

/* float the table header */  
.plainlinks.hlist.navbar.mini + div {  
margin: 0 !important;  
float: ;  
}  

/* text alignn for the country heading */  
.covid-country-narrow-on-mobile {  
text-align: !important;  
}  

/* text alignn for the first total-row cell */  
.covid-total-row:first-of-type {  
text-align: !important;  
}  

/* text alignn for all country names */  
1. covid19-container table tbody>tr>:nth-child(2) {
text-align: ;  
padding-: !important;  
}  

/* reduce font-weight for all country names */  
1. covid19-container table tbody>tr>:nth-child(2)>a {
font-weight: 500;  
}  

}  

/* For mobile app page content service - https://en.wikipedia.org/api/rest_v1/page/mobile-html/Template:2019%E2%80%9320_coronavirus_pandemic_data */  
.pcs-collapse-table-container .covid-show-table {  
display:;  
}