Расписание

by pharma_nsk

HTML

<body>
<div class="container">

<table>
<caption>Расписание</caption>
<tr>
<th>Физика / Химия</th>
<th></th>
</tr>
<tr>
  <td>06 декабря (сб. - 10:00)</td>
  <td>Осталось 133 места</td>
</tr>
<tr>
  <td>06 декабря (сб. - 14:00)</td>
  <td>Осталось 136 мест</td>
</tr>
<tr>
<th>Все предметы</th>
<th></th>
</tr>
<tr>
  <td>13 декабря (сб. - 10:00)</td>
  <td>Осталось 142 места</td>
</tr>
<tr>
  <td>13 декабря (сб. - 14:00)</td>
  <td>Осталось 149 мест</td>
</tr>
<tr>
  <td>20 декабря (сб. - 10:00)</td>
  <td>Осталось 168 мест</td>
</tr>
<tr>
  <td>20 декабря (сб. - 14:00)</td>
  <td>Осталось 176 мест</td>
</tr>
</table>
<div class="button">

<a href="#">Записаться на РТ</a>
<a href="#">Узнать результаты РТ</a>
</div>
</div>
</body>

CSS

body {background-color:white; font-family:  serif;; font-size:14px;}
.container {width: 90%; margin: 10px auto; box-shadow: -3px 10px 18px 0px rgba(158,158,158,1);padding:10px 0;}
caption {font-size:14px; color:#006B99; text-transform:uppercase; text-align:left; padding-bottom:10px; font-weight:bold; }
table {border-collapse:collapse; width:90%; margin:10px auto;}
th {padding:10px 5px; text-align:left; }
td {text-align:center; padding:10px; color:#6E6E6E;}
tr:first-child  {background-color:#DBF4FF; border-top:5px solid #D1D1D1;  border-bottom:1px solid #D1D1D1; color:#474747;}
tr:nth-child(4) {background-color:#F5F5F5; border-top:5px solid #D1D1D1;  border-bottom:1px solid #D1D1D1; color:#474747;}
.button {width:90%; margin:10px auto;}
 a{display:inline-block; text-decoration:none; height:40px; padding:0 20px; font-size:11px; font-weight:bold; line-height:40px; color:white; text-transform:uppercase; background: linear-gradient(#2EEAFF, #109CC7 48%, #0881A6 52%, #06538A); margin-right:20px; border-radius:5px; text-shadow: 0 -1px 1px #777;  box-shadow: 0 0 0 60px rgba(0,0,0,0) inset, .1em .1em .2em #41629C;}
 a:hover {background: linear-gradient(#D49CFF, #BE80ED 48%, #7E0FD4 52%, #580399);}