CSS not linking to my index.html

I'm a beginner in this so I apologise in this since I'm learning myself so please cut me some slack. I'm having a problem in linking my CSS into my index, all I'm trying to do is make a certian portion on top of the page black, like a box just filled black. The banner area technically. And it's not linking for some reason? Here is the CSS and HTML code - I've tried opening in Chrome and explorer and nothing is happening? Please help.

/*! normalize.css v3.0.1 | MIT License | git.io/normalize */
html {
    font-family: volkorn;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
}

body {
    margin: 0;
}

.top-section {
    padding: 30px 0;
    margin-bottom: 0;
    color: #000000;
    background-color: #000000;
    background-size: cover;
}

.top-section {
padding-top: 100px;
padding-bottom: 100px;
}

<!DOCTYPE html>
<!--[if lt IE 7 ]> <html class="ie6" lang="en"> <![endif]-->
<!--[if IE 7 ]>    <html class="ie7" lang="en"> <![endif]-->
<!--[if IE 8 ]>    <html class="ie8" lang="en"> <![endif]-->
<!--[if (gte IE 9)|!(IE)]><!--> <html lang="en"> <!--<![endif]-->
<title>Upload Festival</title>  
    <head>
  
      <!-- Meta -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="">
    <meta name="keywords" content="">
    <meta name="author" content="">
    <meta name="googlebot" content="index,follow">
        
    <!--css-->
    <link href="css/customization.css" rel="custom" style="text/css">
  </head>
<body class="index">
<header class="top-section" role="banner"></header>
</body>
</html>

Solution

I you are a beginner, then start with simple an basic concepts...
Use this template that is the structure of a HTML page:

<html>
    <head>

        <title>Page Title</title>
        <!--Link to an external resource-->
        <link rel="stylesheet" type="text/css" href="css-folder/css-file.css">

    </head>
    <body>
        <header class="top-section" role="banner"></header>
    </body>
</html>

Put your style sheets into another file. For example:

css-folder/css-file.css:

html {
    font-family: volkorn;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
}

body {
    margin: 0;
}

.top-section {
    padding: 30px 0;
    margin-bottom: 0;
    color: #000000;
    background-color: #000000;
    background-size: cover;
}

.top-section {
    padding-top: 100px;
    padding-bottom: 100px;
}

You don't need to know about the conditional comments and doctypes and meta datas right now!
Good luck.