@import url('https://fonts.googleapis.com/css2?family=Roboto+Condensed:ital,wght@0,100..900;1,100..900&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');
body {
    font-size: 24px;
    font-family: 'Roboto Condensed';
    font-weight: 300;
    /*font-family:'Roboto Condensed', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;*/
    /*background-image: url(https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcT4WkOhjNxqYcWLTeNYxbLOq3KR_Sag8AUxYg&s);
    background-attachment:fixed;
    color:white;*/
    background-image: linear-gradient(to bottom right, lightskyblue, pink);
    /*height: 88vh;*/ /*Viewport Height*/
    background-attachment: fixed;
}

h3 {
    font-style: italic;
    text-decoration: underline;
}

p {
    /*name:value;*/
    text-align: justify;
    text-indent: 48px;
    /*https://htmlbook.ru/faq/kak-mne-dlya-kazhdogo-abzatsa-dobavit-otstup-pervoy-stro*/
}

figure {
    text-align: center;
    font-style: italic;
    font-weight: 100;
}

ol {
    list-style: upper-roman;
}

ul {
    list-style: georgian;
}

a {
    color: darkgreen;
    /*padding:4px;*/
}

    a:visited {
        color: blue;
    }

    a:hover {
        font-weight: 800;
        /*font-size:32px;*/
        /*padding:0;*/
        color: black;
    }
/*li
{
    padding:4px;
}
    li:hover
    {
        padding:0px;
    }*/
/*.table-of-contents, #table-of-contents
{
    background-image:linear-gradient(to bottom right, darkgreen, lightblue);
}*/
.header {
    text-shadow: 5px 5px 8px grey;
}

#table-of-contents > li > a, #table-of-contents > li > a:visited {
    font-weight: 700;
}

#table-of-contents > li > ul > li > a, #table-of-contents > li > ul > li > a:visited {
    font-weight: 500;
}
/*ul > li + li
{
    background-color:red;
}*/



/*
tag
{
    styles;
    ......;
}
descriptor
{
    styles;
    ......;
}
#id
{
    styles;
    ......;
}
.class
{
    styles;
    ......;
}
*/
/*selector1 selector2
{
    styles;
    Стили будут применены ко всем 'selector2', которые вложены в 'selector1' на любом уровне.
}
selector1 > selector2
{
    styles;
    Стили будут применены ко всем 'selector2', которые непосредственно вложены в 'selector1'.
}
selector1 + selector2
{
    styles;
    Стили будут применены только к тем 'selector2', которые непосредственно следуют за 'selector1'.
}
selector1 ~ selector2
{
    styles;
    Стили будут применены ко всем 'selector2', которые следуют за 'selector1'.
}*/

#margin-and-padding {
    border: solid 1px;
    /* margin Внешний отступ*/
    /*margin:20px 50px 150px 250px;*/ /*Отступы применяются начиная от верхней границы по часовой стрелке*/
    margin: 20px 50px; /*верх-низ лево-право*/
    margin: 20px 30px 50px; /*up left-right down*/
    padding: 50px 0; /*Внутренний отступ*/
}

table {
    margin: 15px auto;
    border: solid 2px;
    border-spacing: 0;
    box-shadow: 0px -10px 25px 25px grey;
}

    table > caption {
        color: white;
    }

tr:hover {
    box-shadow: inset -0px -3px 10px 1px green;
}

th, td {
    border: solid 1px;
}

thead th {
    border: solid 1px black;
    padding: 15px 25px;
    background-color: blueviolet;
    color: aliceblue;
}

tbody th {
    text-align: left;
}

td {
    text-align: center;
}