#main, #convert_info{ text-align: center; padding: 20px 0px; background: none; border-top-style: solid; }
#main{ border: none;   }
.gimn{ font-size: 0.75em; }
.gimn p{  }

#convert_info table{ font-size: 0.8em; width: 100%; }
#convert_info table tr{  }
#convert_info table tr th{ color: #003366; text-transform: uppercase; font-size: 0.8em; }
#convert_info table tr td{ font-size: 0.9em; }
#convert_info table tr td[data-role="filename"]{ width: 50%; }
#convert_info table tr td[data-role="speed"]{ width: 10%; }
#convert_info table tr td[data-role="elapsed_time_pretty"]{ width: 20%; color: #570000 }
#convert_info table tr td[data-role="left_time_pretty"]{ width: 20%; color: #006600; }
#convert_info .noconvert{ font-size: 0.8em; color: #006600; }

#convert_info #convert_progress{ width: 100%; height: 40px; margin: 10px 0px; background: #CFCFCF; background: linear-gradient(90deg, #CFCFCF 0%, #707070 50%, #CFCFCF 100%); border: 1px solid #444444; border-radius: 5px; position: relative; overflow: hidden; }
#convert_info #convert_progress #progressbar{ display: block; height: 100%; width: 100%; background: #009900; z-index: 1; }
#convert_info #convert_progress #progressbar{ background: linear-gradient(90deg, #59C22F 0%, #009E00 100%); }
#convert_info #convert_progress #progress_text{ display: block; height: 100%; width: 100%; position: absolute; top: 0px; left: 0px; z-index: 2; text-align: center;  }
#convert_info #convert_progress #progress_text table{ width: 100%; height: 100%; }
#convert_info #convert_progress #progress_text table td{ vertical-align: middle; font-weight: normal; font-size: 1em; color: #FFFFFF; text-shadow: #000000 0px 0px 3px; }


#top_newest .catalog_media_frame{ border-bottom-style: solid; padding-top: 10px; padding-bottom: 10px; }
#top_newest .catalog_media_frame:last-of-type{ border: none; }
#top_newest .catalog_media_frame h2{ float: right; text-align: left; width: calc( 100% - 240px - 10px ); }
#top_newest .catalog_media_frame h2 a{ color: #333333; }
#top_newest .catalog_media_frame .previev
{
    display: block;
    text-align: center;
    position: relative;
    float: left;
    width: 240px;
    height: 350px;
    border: 1px solid #444444;
    overflow: hidden;
}
#top_newest .catalog_media_frame .previev img{ height: 100%; border: none; }

#top_newest .catalog_media_frame .previev .imdb_rating{ position: absolute; display: inline-block; top: 10px; right: 10px; z-index: 4; width: 80px; background: #FFC300; color: #000000; font-size: 0.8em; font-weight: bold; padding: 3px; border: 1px solid #000000; box-shadow: 0px 0px 10px #000000; }
#top_newest .catalog_media_frame .previev .imdb_rating::before { content: 'IMDB: '; font-size: 0.85em; }

#top_newest .catalog_media_frame .info   { display: block; position: relative; float: right; width: calc( 100% - 240px ); padding-left: 10px;  }
#top_newest .catalog_media_frame .description{ margin: 20px 0px; font-size: 0.8em; text-align: justify; }
#top_newest .catalog_media_frame .description p{ margin-bottom: 10px; }
#top_newest .catalog_media_frame .description p:last-of-type{ margin-bottom: 0px; }
#top_newest .catalog_media_frame .details
{
    --button-height: 50px;
    --button-font-size: 0.8em;
    display: block;
    height: var( --button-height );
    width: 200px;
}
#top_newest .catalog_media_frame .details a
{
    display: inline-block;
    background: #009900;
    color: #FFFFFF;
    height: 100%;
    width: 100%;
    text-align: center;
    border: 1px solid #009900;
    border-radius: 13px;
    text-transform: uppercase;
    font-size: var( --button-font-size );
    padding-top: calc( var(--button-height)/2 - (var(--button-font-size)/4)*3 );
}
#top_newest .catalog_media_frame .tags{  }
#top_newest .catalog_media_frame .tags a.tag{ display: inline-block; margin-right: 10px; color: #333333; font-style: italic; font-size: 0.75em; }
#top_newest .catalog_media_frame .tags a.tag:hover{ color: #00478F; text-decoration: underline; }
#top_newest .catalog_media_frame .tags a.tag.area_link{ color: #00478F; font-weight: bold; }


@media (hover:none) and (orientation: portrait),
    (hover:on-demand) and (orientation: portrait),
    (max-device-width: 680px)
{
    #top_newest .catalog_media_frame .previev,
    #top_newest .catalog_media_frame h2,
    #top_newest .catalog_media_frame .details,
    #top_newest .catalog_media_frame .info
    { float: none; clear: both; width: 100%; margin: 0px; }
    #top_newest .catalog_media_frame .info{ padding: 10px; }
    #top_newest .catalog_media_frame .description{ margin: 10px 0px 10px 0px; }
    #top_newest .catalog_media_frame .previev{ border: none; height: auto; max-height: 400px; }
    #top_newest .catalog_media_frame h2{ text-align: center; }
    #top_newest .catalog_media_frame .tags{ text-align: center; }
    #top_newest .catalog_media_frame .previev img{ border: 1px solid #333333; }
	#top_newest .catalog_media_frame .previev .imdb_rating{ right: calc( ( 100% - 80px ) / 2 ); }
}

span.date[data-val]{ display: inline-block; position: relative; padding-left: 10px; color: #CCCCCC; font-weight: normal; font-size: 0.8em; }
span.date[data-val]::before { content: '('; }
span.date[data-val]::after { content: ')'; }
span.date[data-val=""]{ display: none; }

