*{
    box-sizing: border-box;
    font-family: 'Lato', sans-serif;
}

body{
    margin:0;
    padding:0;
    display: flex;
    align-content: center;
    flex-direction: column;
}
section p{
    color: rgb(255,255,255);
    font-weight: 900;
    margin:0;
}
nav{
    background: rgb(0,0,0); 
    position:fixed;
    overflow:hidden;
    top:0;
    width: 100%;
}
nav a img{
    padding:3%;
    max-width:10%;
    background: rgb(0,0,0); 
}
nav a{
    float: left;
    text-decoration: none;
}

.about-1, .about-2, .about-3, .about-4, .about-5, .about-6,
.about-7, .about-9{
    padding: 5% 7%;
}
.about-1, .about-3, .about-5, .about-9, .about-8 p, footer{
    background: rgb(0,0,0);
}

a{
    text-decoration: none;
}

p, ol{
    font-size: 40px;
}

.about-1 p, .about-2 p, .about-4, .about-5 p, .about-8 p, .about-9{
    text-align: center;
}

.about-1{
    padding-top:6%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-content: center;
    align-items: center;
}
.about-1 img{
    max-width: 30%;
}

.about-2, .about-4, .about-9{
    background: rgb(33,33,33);
}
.about-2, .about-5{
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center; 
}
.about-2 img{
    max-width: 15%;
}

.about-3{
    background: url(../img/c-coffee-bg.jpg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover; 
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-content: center;
    align-items: center;
}
.about-3 img{
    max-width: 35%;
}

.about-5 img{
    max-width: 30%;
}

.about-6{
    background: url(../img/fuel-bg.jpg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    display: flex;
}
.about-6 ol li{
    color: rgb(255,255,255);
    font-size: 25px;
}
.about-6 ul{
    list-style: none;
    padding-left:0;
}
.about-6 ul img{
    max-width:30%;
}

.about-7{
    background: -webkit-gradient(linear, right top, left top, from(rgba(20, 11, 19, 1)), color-stop(8.85%, rgba(25, 16, 28, 1)), color-stop(28.23%, rgba(34, 25, 44, 1)), color-stop(43.87%, rgba(37, 28, 49, 1)), color-stop(51.49%, rgba(49, 35, 63, 1)), color-stop(65.9%, rgba(79, 54, 100, 1)), color-stop(85.46%, rgba(128, 84, 159, 1)), color-stop(85.66%, rgba(129, 84, 160, 1)), color-stop(88.87%, rgba(132, 83, 157, 1)), color-stop(91.41%, rgba(140, 82, 147, 1)), color-stop(93.73%, rgba(153, 79, 130, 1)), color-stop(95.91%, rgba(173, 75, 107, 1)), color-stop(97.98%, rgba(197, 69, 76, 1)), color-stop(99.97%, rgba(228, 63, 40, 1)), to(rgba(228, 63, 39, 1)));
    background: -webkit-linear-gradient(right, rgba(20, 11, 19, 1) 0%, rgba(25, 16, 28, 1) 8.85%, rgba(34, 25, 44, 1) 28.23%, rgba(37, 28, 49, 1) 43.87%, rgba(49, 35, 63, 1) 51.49%, rgba(79, 54, 100, 1) 65.9%, rgba(128, 84, 159, 1) 85.46%, rgba(129, 84, 160, 1) 85.66%, rgba(132, 83, 157, 1) 88.87%, rgba(140, 82, 147, 1) 91.41%, rgba(153, 79, 130, 1) 93.73%, rgba(173, 75, 107, 1) 95.91%, rgba(197, 69, 76, 1) 97.98%, rgba(228, 63, 40, 1) 99.97%, rgba(228, 63, 39, 1) 100%);
    background: -o-linear-gradient(right, rgba(20, 11, 19, 1) 0%, rgba(25, 16, 28, 1) 8.85%, rgba(34, 25, 44, 1) 28.23%, rgba(37, 28, 49, 1) 43.87%, rgba(49, 35, 63, 1) 51.49%, rgba(79, 54, 100, 1) 65.9%, rgba(128, 84, 159, 1) 85.46%, rgba(129, 84, 160, 1) 85.66%, rgba(132, 83, 157, 1) 88.87%, rgba(140, 82, 147, 1) 91.41%, rgba(153, 79, 130, 1) 93.73%, rgba(173, 75, 107, 1) 95.91%, rgba(197, 69, 76, 1) 97.98%, rgba(228, 63, 40, 1) 99.97%, rgba(228, 63, 39, 1) 100%);
    background: linear-gradient(-90deg, rgba(20, 11, 19, 1) 0%, rgba(25, 16, 28, 1) 8.85%, rgba(34, 25, 44, 1) 28.23%, rgba(37, 28, 49, 1) 43.87%, rgba(49, 35, 63, 1) 51.49%, rgba(79, 54, 100, 1) 65.9%, rgba(128, 84, 159, 1) 85.46%, rgba(129, 84, 160, 1) 85.66%, rgba(132, 83, 157, 1) 88.87%, rgba(140, 82, 147, 1) 91.41%, rgba(153, 79, 130, 1) 93.73%, rgba(173, 75, 107, 1) 95.91%, rgba(197, 69, 76, 1) 97.98%, rgba(228, 63, 40, 1) 99.97%, rgba(228, 63, 39, 1) 100%);
    /* filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#140B13',endColorstr='#E43F27' , GradientType=1); */
}
.about-7{
    text-align: center;
}
.about-7 img{
    max-width:30%;
}
.about-7 p{
    padding: 2% 0;
}
.about-7 a{
    text-transform: uppercase;
    color: rgb(224,223,0);
    text-decoration: none;
    text-align:center; 
    padding:3% 0;
}

.about-8{
    display: flex;
    flex-direction: column;
}
.about-8 img{
    width:100%;
    display: block;
}
.about-8 p{
    padding: 5% 0;
}

.about-9 img{
    max-width: 20%;
}

footer{
    color: rgb(255,255,255);
    font-weight: 400;
    font-size: 10px;
    text-align: center;
    padding:30px 0 15px;
}

@media all and (max-width:992px){
    .about-1, .about-3, .about-6{
        flex-direction: column;
        text-align: center;
    }
    p{
        font-size: 30px;
    }
    .about-2 img{
        max-width: 20%;
    }
    .about-9 img{
        max-width: 30%;
    }
    .about-3 img{
        max-width:70%;
    }
    .about-3 p{
        padding: 20px 0 0;
    }
    .about-6{
        align-items: center;
    }
    .about-6 ol{
        text-align:left;
    }
    .about-7 img{
        max-width:70%;
    }
}

@media all and (max-width:768px){
    .about-1, .about-2, .about-3, .about-4, .about-5, .about-6, .about-7, .about-8 p, .about-9, footer{
        padding: 20% 15%;
    }
    p{
        font-size: 25px;
    }
    .about-1 img{
        max-width:75%;
    }
    .about-3 img{
        max-width:90%;
    }
    .about-5 img{
        max-width:70%;
    }
    .about-6 ol li{
        font-size: 20px;
    }
    .about-6 img{
        max-width:110%;
    }
    .about-6 ul img{
        max-width:70%;
    }
    .about-6 ul img:first-child{
        padding: 0 0 25px;
    }
    .about-7 img{
        max-width:100%;
    }
    .about-7 p{
        padding:10% 0 15%;
    }
    footer span{
        text-align: center;
    }
}