@font-face { font-family: 'FontAwesome'; src: url('../fonts/fontawesome-webfont.eot?v=4.3.0'); src: url('../fonts/fontawesome-webfont.eot?#iefix&v=4.3.0') format('embedded-opentype'), url('../fonts/fontawesome-webfont.woff2?v=4.3.0') format('woff2'), url('../fonts/fontawesome-webfont.woff?v=4.3.0') format('woff'), url('../fonts/fontawesome-webfont.ttf?v=4.3.0') format('truetype'), url('../fonts/fontawesome-webfont.svg?v=4.3.0#fontawesomeregular') format('svg'); font-weight: normal; font-style: normal; } body { font-size: 14px; } h1, h2, h3, h4, h5, h6, p, ul, li, span, a { margin: 0; padding: 0; } ul { list-style: none; } ul a { text-transform: none; } ul a:hover { text-transform: none; text-decoration: none; } a { color: inherit; } a:hover { text-decoration: none; color: inherit; } .main-text { color: black; font-family: UnicaOne; text-transform: uppercase; } .delete-pad-mar { margin: 0; padding: 0; } .menumob { width: 123px; margin: 0 auto 55px; color: #fff; } .menumob__but { background: none; width: 25px; height: 15px; border: none; background-image: url('/img/menubtn.png'); margin-right: 20px; outline: none; } .menumob__menu { font-family: UnicaOne; font-size: 15px; font-weight: 400; text-transform: uppercase; } .menumob__ul { position: absolute; width: 100%; background-color: #202020; padding-top: 120px; padding-bottom: 104px; opacity: 0.95; z-index: 40; display: none; flex-direction: column; align-items: center; } .menumob__ul > li { padding-top: 24px; padding-bottom: 24px; cursor: pointer; font-family: UnicaOne; font-size: 15px; font-weight: 400; text-transform: uppercase; color: white; } .menumob__ul > li ul { text-align: center; display: none; } .menumob__ul > li ul li { padding-top: 27px; } .menumob__ul > li ul li a { color: #6f6f6f; } .menumob_close { position: absolute; top: 45px; right: 37px; width: 14px; height: 14px; background: none; background-image: url('../img/menubtn_close.png'); border: none; outline: none; } .selected__item { border-top: 1px solid #434343 ; border-bottom: 1px solid #434343 ; } .theme { background-color: #202020; padding: 30px 94px; } .theme__block { display: flex; flex-direction: row; align-items: center; justify-content: space-between; } .theme__about { color: #c3c3c3; font-family: 'Lato', sans-serif; font-size: 15px; font-weight: 300; line-height: 25px; } .theme__name { color: white; font-family: 'UnicaOne'; font-size: 36px; font-weight: 400; line-height: 36px; text-transform: uppercase; border-top: 3px solid white; border-bottom: 3px solid white; } .social a { color: white; font-family: FontAwesome; font-size: 16px; font-weight: 400; line-height: 32px; margin-right: 27px; } .social a:last-child { margin-right: 6px; } <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1, user-scalable=no"> <meta name="viewport" content="initial-scale=1.0, user-scalable=no, maximum-scale=1"/> <title>Title</title> <link rel="stylesheet" href="css/bootstrap.min.css"> <link href="https://fonts.googleapis.com/css?family=Unica+One" rel="stylesheet"> <link href="https://fonts.googleapis.com/css?family=Lato" rel="stylesheet"> <link rel="stylesheet" href="css/font-awesome.min.css"> <link rel="stylesheet" href="css/owl.carousel.css"> <link rel="stylesheet" href="css/style.css"> <link rel="stylesheet" href="css/media.css"> <!--<script src="libs/jquery-3.1.1.min.js"></script>--> <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.11.2.min.js"></script> <script src="libs/bootstrap.min.js"></script> <script src="libs/owl.carousel.min.js"></script> <script src="js/main.js"></script> </head> <body> <header> <ul class="menumob__ul hidden-md hidden-lg" id="mobile-menu"> <button class="menumob_close"></button> <li><a href="">HOME</a></li> <li class="">CATEGORIES <ul> <li><a href="">TRAVEL</a></li> <li><a href="">LIFESTYLE</a></li> <li><a href="">FOOD</a></li> <li><a href="">CLOTHES</a></li> </ul> </li> <li><a href="">ABOUT ME</a></li> <li><a href="">CONTACT</a></li> </ul> <div class="theme"> <div class="menumob hidden-md hidden-lg"> <button class="menumob__but"></button> <span class="menumob__menu">MENU</span> </div> <!--todo: сделать шрифт --> <div class="theme__block"> <span class="theme__about theme__about-postabl">Travel & Photo blog.</span> <div><h3 class="theme__name theme__name-postabl">Mundial</h3></div> <div class="social"> <a href=""><i class="fa fa-facebook" aria-hidden="true"></i></a> <a href=""><i class="fa fa-twitter" aria-hidden="true"></i></a> <a href=""><i class="fa fa-instagram" aria-hidden="true"></i></a> <a href=""><i class="fa fa-search" aria-hidden="true"></i></a> </div> </div> </div> I do everything as in the instructions:
<link href="https://fonts.googleapis.com/css?family=Lato" rel="stylesheet"> Did also through @import. Fonts are loaded, but not displayed. In the Manager it is clear that the element corresponds to the prescribed font in css. What is the problem?
