Untitled

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="shortcut icon" href="images/favicon.ico">
    <link rel="stylesheet" href="css/style.css">
    <title>Анимационни герои</title>
    <style>
        body {
            background-image: url("background-video.png");
            margin: 0px;
            padding: 0px;
            background-color: lightgray;
            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
        }
    .text {
        font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
        text-align: center;
    }

    #img {
        margin: 50px;
        padding: 30px;
        text-align: center;
    }

    .video {
        text-align: center;
    }

    .text2 {
        text-align: center;
        font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
        font-size: 20px;
        margin: 20px;
        padding: 30px;
        border-style: dotted;
    }

    .bbuny {
        text-align: center;
        border-style: dotted;
        margin: 20px;
        padding: 30px;
    }

    .video2 {
        text-align: center;
    }

    a {
        text-decoration: none;
    }

    /*nav {
        background-color: gray;
        color: darkblue;
        font-size: 20px;
    }*/

    nav a {
        background-color: gray;
        color: darkblue;
        font-size: 20px;
        padding: 10px;
        border-radius: 15px;
        box-shadow: 3px 3px 5px gray;
    }

    </style>
</head>
<body>
    <div class="text">
    <h1>Анимационни герои</h1>

    <h2>Фред Флинстоун Уилма Флинстоун Барни и Бети</h2>
</div>

    <div id="img">
    <img
    src="images/fred.png"
    width="200px"
    height="300px"
    alt="IMG IS NOT LOADING"
    title="Фред"
    >

    <img
    src="images/wilma.png"
    width="200px";
    height="300px";
    alt="IMG IS NOT LOADING"
    title="Уилма"
    >

    <img
    src="images/betty-barney.png"
    width="300px";
    height="300px";
    alt="IMG IS NOT LOADING"
    title="Бети и Барни"
    url="https://google.com"
    >
    <div class="ahref">
    <nav>
        <a href="https://www.google.com" target="_blank">Фред</a>
        <a href="https://www.telerikacademy.com/" target="_blank">Уилма</a>
        <a href="https://www.youtube.com/" target="_blank">Бети и барни</a>
        </nav>
    </div>

<div class="text2">
<p>

        <strong>Фредерик „Фред“ Флинстоун</strong>
        (на английски: Frederick "Fred" Flintstone) е главният герой в
        анимационния сериал „Семейство Флинстоун“, излъчен по ABC в периода 1960–1966 г. Фред е съпругът на Уилма Флинстоун и бащата на Пебълс Флинстоун.
        Неговите най-добри приятели са съседите му Барни и

        <!-- Можеш ли сам да разбереш какво прави този таг? -->
        <em>Бети Ръбъл</em>
        , които имат осиновен син - Бам-бам.

        </p>
    </div>

        <div class="video">
        <iframe
        width="640";
        height="360";
        src="https://www.youtube.com/embed/3qstYnzcamI"
        frameborder="0"
        allow="autoplay; encrypted-media"
        allowfullscreen
        align: center
    ></iframe>
    </div>


    <div class="bbuny">
    <p><h2><a href="https://bg.wikipedia.org/wiki/%D0%91%D1%8A%D0%B3%D1%81_%D0%91%D1%8A%D0%BD%D0%B8">Бъгс Бъни</a></h2> (на английски: Bugs Bunny) е измислен анимационен герой (антропоморфен заек) и носител на награда Оскар, който се появява във филмчетата на „Шантави рисунки“ и „Весели мелодии“, продуцирани от Warner Bros., и е един от най-разпознаващите се персонажи в света. Неговата най-известна реплика е „Какво става, шефе?“, обикновено казана с хапка морков в устата.</p>
</div>


<div class="video2">
<iframe
width="734"
height="413"
src="https://www.youtube.com/embed/Q8AZ16uBhr8"
frameborder="0"
allow="autoplay; encrypted-media"
align: center;
allowfullscreen
>
</div>


</body>
</html>