@font-face {
    font-family: 'Produkt-Bold-Web';
    src: url(../../../koronavirus/css/fonts/Produkt-Bold-Web.woff);
}
@font-face {
    font-family: 'AktivGrotesk-Bold';
    src: url(../../../koronavirus/css/fonts/AktivGrotesk_W_Bd.woff);
}
@font-face {
    font-family: 'AktivGrotesk-Medium';
    src: url(../../../koronavirus/css/fonts/AktivGrotesk_W_Md.woff);
}

circle{stroke-width:1px!important}
html,body{margin: 0; padding: 0; font-family: Arial;}

body::-webkit-scrollbar{width: 12px;}
body::-webkit-scrollbar-track{-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); -webkit-border-radius: 6px; border-radius: 6px;}
body::-webkit-scrollbar-thumb{-webkit-border-radius: 6px; border-radius: 6px; -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5);}
body.a::-webkit-scrollbar-track{background: rgba(240,240,240,0.8);}
body.a::-webkit-scrollbar-thumb{background: rgba(127,127,127,0.8);}
body.a::-webkit-scrollbar-thumb:window-inactive{background: rgba(127,127,127,0.4);}

.header{background-color: #232C4F; padding: 20px; margin-bottom: 25px;}
.header img{max-height: 30px;}

.footer{background-color: #232C4F; color: #ffffff; padding: 5px; margin-top: 25px;}
.footer a{color: #ffffff; text-decoration: none; font: normal 11px Arial;}


.header-row{margin-bottom: 10px;}
.header-row .row-title a{font-size: 18px; font-family: 'Produkt-Bold-Web'; color: #C31719; line-height: 30px; text-decoration: underline;}
.header-row .row-title a:hover{color: #9c1718;}
.header-row .row-title a img{width: 17px; margin-left: 10px;}


#coronaMapsContainer{margin-bottom: 25px; padding-bottom: 25px; border-bottom: 1px solid #e3e3e3;}
#coronaMapsContainer .map-container{width: 100%; height: 490px; overflow-y: hidden;}
#coronaMapsContainer .map-container #bubbles{width: 930px; height: 470px; margin: 0 auto; position:relative;}
#coronaMapsContainer .map-container #bubbles .map-lejant{position: absolute; left: 0; bottom: 10px; width: 120px;}
#coronaMapsContainer .map-container .map-info{line-height: 25px; font-size: 13px; font-style: italic; text-align: center;}


#coronaCountsContainer{margin-bottom: 25px; padding-bottom: 25px; border-bottom: 1px solid #e3e3e3;}
#coronaCountsContainer .counts-container .corona-counts-header{margin-bottom: 10px;}
#coronaCountsContainer .counts-container .corona-counts-header .row-title{font-size: 14px; font-weight: bold; font-family: Arial; color: #000000; line-height: 20px;}
#coronaCountsContainer .counts-container .corona-counts-header .row-last-update-date{height: 20px; color: #919191; text-align: right; font-weight: bold; font-size: 12px;}
#coronaCountsContainer .counts-container.turkey-counts-container .corona-info-boxes div:nth-of-type(1) .corona-info-box{background-color: #5F7389;}
#coronaCountsContainer .counts-container.turkey-counts-container .corona-info-boxes div:nth-of-type(2) .corona-info-box{background-color: #304156;}
#coronaCountsContainer .counts-container.turkey-counts-container .corona-info-boxes div:nth-of-type(3) .corona-info-box{background-color: #0E2235;}
#coronaCountsContainer .counts-container.world-counts-container .corona-info-boxes div:nth-of-type(1) .corona-info-box{background-color: #CC9899;}
#coronaCountsContainer .counts-container.world-counts-container .corona-info-boxes div:nth-of-type(2) .corona-info-box{background-color: #A24546;}
#coronaCountsContainer .counts-container.world-counts-container .corona-info-boxes div:nth-of-type(3) .corona-info-box{background-color: #6E1617;}
#coronaCountsContainer .counts-container .corona-info-boxes .corona-info-box{padding: 10px 0; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px;}
#coronaCountsContainer .counts-container .corona-info-boxes .corona-info-box .title,
#coronaCountsContainer .counts-container .corona-info-boxes .corona-info-box .count{height: 20px; line-height: 20px; color: #ffffff;}
#coronaCountsContainer .counts-container .corona-info-boxes .corona-info-box .title{font-family: 'AktivGrotesk-Medium'; font-size: 16px; opacity: 0.6;}
#coronaCountsContainer .counts-container .corona-info-boxes .corona-info-box .count{font-family: 'AktivGrotesk-Bold'; font-size: 22px;}


#coronaTableContainer{margin-bottom: 25px; padding-bottom: 25px; border-bottom: 1px solid #e3e3e3;}
#coronaTableContainer .table-container .table {border: none; color: #ffffff; border-collapse: collapse; margin: 0; padding: 0; width: 100%;}
#coronaTableContainer .table-container .table tr {background-color: #212529; border: 1px solid #32383e; padding: .35em;}
#coronaTableContainer .table-container .table thead tr{background-color: #676F7E; font-size: 13px;}
#coronaTableContainer .table-container .table th, .table td {padding: .625em; text-align: left;}
#coronaTableContainer .table-container .table td {font-size: 1.1em;}
#coronaTableContainer .table-container .table th {font-size: 1.2em; font-weight: bold; letter-spacing: .1em;}
#coronaTableContainer .table-container #tableSearchInputContainer{display: none;}
#coronaTableContainer .table-container #tableSearchInputContainer #tableSearchInput{float: right; width: 85%;}
#coronaTableContainer .table-container table.dataTable.dtr-inline.collapsed > tbody > tr[role="row"] > td:first-child:before{top: 13px;}


#coronaNewsContainer{ margin-bottom: 25px; padding-bottom: 25px; border-bottom: 1px solid #e3e3e3;}
#coronaNewsContainer .news-container .row div a{text-decoration: none; display: block;}
#coronaNewsContainer .news-container .row div a .image{position: relative; float: left; width: 100%; margin-bottom: 5px; /*height: 120px; -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; background-size: cover; background-position: center;*/}
#coronaNewsContainer .news-container .row div a .image img{-webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px;}
#coronaNewsContainer .news-container .row div a .image .play-button{width: 50px; height: 50px; position: absolute; top: 5px; left: 5px; z-index: 9999999;}
#coronaNewsContainer .news-container .row div a .image .news-text{text-align: center; background-color: #C31719; color: #ffffff; position: absolute; top: 5px; right: 5px; font-size: 11px; font-weight: bold; z-index: 9999999; padding: 5px;}
#coronaNewsContainer .news-container .row div a .time{float: left; display: block; width: max-content; padding: 2px 5px; margin-bottom: 5px; background-color: #C31719; color: #ffffff; text-align: center; font-size: 11px; font-weight: bold; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;}
#coronaNewsContainer .news-container .row div a .title{float: left; width: 100%; font-size: 14px; font-weight: bold; color: #000000;}
#coronaNewsContainer .news-container .row div:hover a .title{color: #C31719;}


#coronaInfoContainer .info-container .row div a{text-decoration: none; display: block;}
#coronaInfoContainer .info-container .row div a img{-webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px;}
#coronaInfoContainer .info-container .row div a .title{width: 100%; margin-top: 5px; font-size: 14px; font-weight: bold; color: #000000;}
#coronaInfoContainer .info-container .row div:hover a .title{color: #C31719;}


@media only screen and (max-width: 930px) {
    #coronaMapsContainer .map-container{height: 420px; overflow-x: scroll;}
    #coronaMapsContainer .map-container #bubbles{height:420px;}
}
@media only screen and (max-width: 639.98px) {
    #coronaTableContainer .table-container #tableSearchInputContainer{display: block;}
    #coronaTableContainer .table-container .dataTables_filter{display: none;}
}

@media only screen and (max-width: 767.98px) {
    .header-row .row-title{font-size: 16px;}
}