Untitled

CSS:

body
{
  border:0%;
  margin: 0;
}


.container
{
  margin: 0 auto;
  max-width: 1280px;
  width: 70%;
}


nav {
  color: #fff;
  background-color:#4CAF50 ;
  width: 100%;
  height: 56px;
  line-height: 56px;
 }
  nav a {
    color: #fff;
    text-decoration: none;}
  nav .nav-wrapper {
    position: relative;
    height: 100%; }
    nav .nav-wrapper i {
      display: block;
      font-size: 2rem; }
  nav .nome {
    position: absolute;
    color: #fff;
    display: inline-block;
    font-size: 2.1rem;
    padding: 0;
    white-space: nowrap; }
  nav ul {
    margin: 0;
    list-style-type: none; }
    nav ul li {
      -webkit-transition: background-color .3s;
      -moz-transition: background-color .3s;
      -o-transition: background-color .3s;
      -ms-transition: background-color .3s;
      transition: background-color .3s;
      box-decoration-break: none;
      float: left;
      padding: 0; }
      nav ul li:hover, nav ul li.active {
        background-color: rgba(0, 0, 0, 0.1); }
    nav ul a {
      font-size: 1rem;
      color: #fff;
      display: block;
      padding: 0 15px; }
    nav ul.right {
      float: right; }
    }

.verde{
  background-color: #4CAF50;
}

.verde{
  background-color: #4CAF50;
}

.sezione {
  padding-top: 1rem;
  padding-bottom: 1rem; }
  .sezione.no {
    padding: 0; }
  .sezione.nosot {
    padding-bottom: 0; }
  .sezione.nosu {
    padding-top: 0; }

}
#index-banner {
    min-height: 632px;
    max-height: 864px;
    position: relative;
    background-color: #2196F3;
}
.header {
    padding: 15% 0;
    font-size: 4.0em;
    font-weight: 800;
    color:white;
}
.centro{
  text-align: center;
}
h1, h2, h3, h4, h5, h6 {
  font-weight: 400;
  line-height: 1.1; }
  h1 {
  font-size: 4.2rem;
  line-height: 110%;
  margin: 2.1rem 0 1.68rem 0; }


HTML


<!DOCTYPE html>
<html>
	<head>
    	<meta name="theme-color" content="#4CAF50">
    		<title>LiM Illusion</title>
    	<!-- CSS  -->
    	<link href="css/style.css" type="text/css" rel="stylesheet">
    	<link href="css/font-awesome.min.css" type="text/css" rel="stylesheet" >
</head>
	<body  id="top" class="scrollspy">
		<!--Barra di navigazione-->
		<nav>
			<div class="verde container">
			<div class="nav-wrapper">
			<a href="#" class="nome">LiM Illusion</a>
			<ul class="right hide-on-med-and-down">
                    <li><a href="#intro">Service</a></li>
                    <li><a href="#work">Work</a></li>
                    <li><a href="#team">Team</a></li>
                    <li><a href="#contact">Contact</a></li>
                    <li><a href="https://github.com/joashp/material-design-template" target="_blank">Download</a></li>
            </ul>
            </div>
            </div>
		</nav>
		<div class="verde header centro sezione nosot" id="index-banner">
    		<div class="container">
            	<span>Ciao,sono </span>
            	<span>
                <b class="is-visible">un mago</b>
                <b>un videomaker</b>
                <b>uno sviluppatore</b>
                <b>LiM</b>
            	</span>
    		</div>
		</div>
	</body>
</html>