body{
                
                margin: 0;
                padding: 0;
            }
            
            /*Top black div containing the logo, links and social media icons */
            
            #topMenuContainer{
                
                width: 100%;
                height: 70px;
                background-color: black;
                color: white;
                font-family: sans-serif;
                position: fixed;
                top: 0;
                opacity:0.9;
                z-index: 300;
               
            }
            
            /* Container that centres he log and links in the center of the page */
            
            #logoContainer{
                
                width:1100px;
                height: 70px;
                margin: 0 auto;
                display: block;
                font-size: 40px;
                padding-top: 8px;
                overflow: hidden;
                
            }
            
            #salonPink{
                
                color: #ff8bd0;
            }
            
            #siteContent{
                
                padding-top: 70px;
                width: 100%;
                margin:0 auto;
                height:1000px;;
            }
            
            /*Styling to links in the black container*/
            
            #logoText a{
                
                color: white;
                font-size: 18px;
                text-decoration: none;
                margin-left: 30px;
            }
            
            /*Changes the links to pink wen hovered over*/
            
            #logoText a:hover{
                
                color:#ff8bd0;
                transition: 0.5s;
            }
            
            #logoText img{
                
                width: 25px;
               
            }
            
            /* Changes the opacity of the social icons when hovered over*/
            
            #logoText img:hover{
                
                opacity:0.5;
                
            }
            
            body, html {
                
                height: 100%;
            }

            /* The hero image */
            
            .hero-image {
                background-image: url("images/airsalon-main-image");
  				height: 90%;
                background-position: center;
                background-repeat: no-repeat;
                background-size: cover;
              	position: relative;
                
            }

            /* The styling for div containing h1 logo, and phone number */
            
            .hero-text {
                    
                text-align: center;
                position: absolute;
                top: 50%;
                left: 75%;
                transform: translate(-50%, -50%);
                color: white;
                }
            
            /* The styling for large logo on hero image */
            
            h1{
                
                font-size:100px;
                font-family: sans-serif;
                font-weight: normal;
                margin-bottom: 0;
            }
            
            /* The styling for appointment button */
            
            #appointmentButton{
                
                font-size: 25px;
                border-radius: 5px;
                padding: 5px 8px 5px 8px;
                margin-top: 40px;
                background-color: white;
                color: black;
                font-family: sans-serif;
                width: 250px;
                position: relative;
                left: 50px;
                
            }
            
            #appointmentButton a{
                
               color: black;
                
            }
            
            #appointmentButton:hover{
                
                background-color: #ff8bd0;
                transition: 0.5s;
            }
            
            #phoneNumber{
                
                font-family: sans-serif;
                font-size: 40px;
                margin-top: 0; 
            }
            
            /* The styling for phone number and when hovering */
            
            .hero-text a{
                
                text-decoration: none;
                color: white; 
            }
            
            .hero-text a:hover{
                
                color: #ff8bd0;
            }
            
            /* The div containing the our salon contant */
            
            #Our-Salon-Page{
                
                width:1000px;
                margin: 0 auto;
                text-align: center; 
            }
            
            /* The styling for the our salon title */
            
            #Our-Salon-Page h1{
                
                font-family: sans-serif;
                font-size: 60px;
                padding-bottom: 15px;
                padding-top: 60px;
            }
            
            /* The styling for quote text */
            
            #salonQuote{
                
                font-family:'Raleway', sans-serif;
                font-size: 40px;
                font-style: italic;
                width:400px;
                margin: 0 auto;
                text-align: center;
                padding-top: 15px;
                padding-bottom:15px;
            }
            
            /* The styling for the pink lines above the quote */
            
            #Our-Salon-Page hr{
                
                border:1px solid #ff8bd0;
                width: 30px;
                
            }
            
            /* The styling for div containing the left paragraph text */
            
            #leftParagraphContainer{
                
                width:500px;
                height:260px;
                margin-top: 30px;
                float: left;
                font-family: 'Raleway', sans-serif;
            }
            
            /* The styling for div containing the right paragraph text */
            
            #rightParagraphContainer{
                
                width:500px;
                height:260px;
                float: left;
                margin-top: 30px;
                font-family: 'Raleway', sans-serif;
            }
            
            /* The styling for the left paragraph text */
            
            #leftParagraph{
                
                float: left;
                padding: 0px 40px 0px 40px;
                text-align: justify;
            }
            
            /* The styling for the right paragraph text */
            
            #rightParagraph{
                
                float:left;
                padding: 0px 40px 0px 40px;
                text-align: justify;
            }
            
            /* The styling for the container for the image in the our salon section */
            
            #ourSalonImage{
                
                width: 100%;
                object-fit: contain;
                width:920px;
                margin: 0 auto;
                text-align: center;
            }
            
            /* The styling for image in the our salon section */
            
            #ourSalonImage img{
                
                width:100%;
                padding-top: 40px;
            }
            
            /* The styling for meet the team background */
            
            #Meet-The-Team-Page{
                
                width:100%;
                height:820px;
                background-color: #f7f9fb;
                margin-top:40px;
            }
            
            /* The styling for the div that contains all content on meet team section */
            
            #ourTeamPage{
                
                width:1000px;
                margin: 0 auto;
                text-align: center;
                height: 770px;
            }
            
            /* The styling for the team age title */
            
            #teamPageTitle{
                
                font-family: sans-serif;
                font-size: 60px;
                padding-bottom: 15px;
                padding-top: 60px;
            }         
            
            
            /* The styling for the pink horizontal lines */
            
            #ourTeamPage hr{
                
                border:1px solid #ff8bd0;
                width: 30px;
                
            }
            
            /* The styling for the text between the pink lines */
            
            #ourTeamPage p {
                
                font-family: 'Raleway', sans-serif;
                padding: 15px 30px 15px 30px;
            }
            
            /* The styling for the sections containing the information for individual staff members */
            
            #staffMemberContainer{
                
                height:450px;
                width:220px;
                margin-left: 25px;
                margin-top: 40px;
                float: left;
            }
            
            /* The styling for meet the team images */
            
            #hairdresser1 img{
                
                border-radius: 50%;
                border: 15px solid #f7f9fb;
                box-shadow: 2px 2px 4px #a9a9a9;
                filter: grayscale(100%);
                transition: 0.5s;
                
            }
            
            #hairdresser1 img:hover{
                
                filter: grayscale(0);
            }
            
            /* The styling for the job title*/
    
            #jobTitle1{
                
                background-color: #f7f9fb;
                width:110px;
                font-family: 'Raleway', sans-serif;
                font-size: 15px;
                padding: 2px 10px;
                color: black;
                border-radius: 20px;
                position: relative;
                top: -55px;
                left:30px;
            }
            
            /* The styling for the first name */
            
            #firstName1{
                
                font-family: 'Raleway', sans-serif;
                font-size: 20px;
                width:60px;
                margin-left: 40px;
                
            }
            
            /* The styling for the last name */
            
            #lastName1{
                
                font-family: 'Raleway', sans-serif;
                font-size: 25px;
            }
            
            /* The styling for staff biog text */
            
            #staffBio1{
                
                font-family: 'Raleway', sans-serif;
                font-size: 13px;
                text-align: justify;
                padding-top: 15px;
                
            }
            
            #Services-Page{
                
                width:1000px;
                margin: 0 auto;
                text-align: center;
                height: 750px;
            }
            
            #servicesImagesContainer{
                
                width: 1000px;
                height:500px;
                margin: 0 auto;
                text-align: center;
                margin-top: 30px;
            }
            
            #servicePageTitle{
                
                font-family: sans-serif;
                font-size: 60px;
                padding-bottom: 15px;
                padding-top:60px;
                
            }
            
            #Services-Page hr{
                
                border:1px solid #ff8bd0;
                width: 30px;
                
            }
            
            /* The styling for the text between the pink lines */
            
            #Services-Page p {
                
                font-family: 'Raleway', sans-serif;
                padding: 15px 30px 15px 30px;
            }
            
            /* The styling for all 7 services images */
            
            #Services-Page img{
                
                border: 2px solid white;
            }
            
            /* The styling for all 7 services images when hovered over */
            
            #Services-Page img:hover{
                
                border: 2px solid #ff8bd0;
                transition:0.5s;
                    
            }
            
            /* The styling andpositioning for all 7 individual services images  */
            
            #serviceImage1{
                
                width:200px;
                height:250px;
                float: left;
                position: relative;
                left:20px;
                
            }
            
            #serviceImage2{
                
                width:200px;
                height:250px;
                float: left;
                position:relative;
                top: 180px;
                left: -50px;
                
            }
            
            #serviceImage3{
                
                width:200px;
                height:250px;
                float: left;
                position:relative;
                left: -130px;
                
            }
            
            #serviceImage4{
                
                width:200px;
                height:250px;
                float: left;
                position:relative;
                top: 180px;
                left: -200px;
                
            }
            
            #serviceImage5{
                
                width:200px;
                height:250px;
                float: left;
                position:relative;
                left: -270px;
                
            }
            
            #serviceImage6{
                
                width:200px;
                height:250px;
                float: left;
                position:relative;
                left:650px;
                top:-70px;
                
            }
            
            #serviceImage7{
                
                width:200px;
                height:250px;
                float: left;
                position:relative;
                left: 580px;
                top:-250px;
                
            }
            
            /* The styling for the individual product containers */
            
            #productContainer{
                
                width:200px;
                height:425px;
                background-color: #f7f9fb;
                font-size: 12px;
                float:left;
                margin-left: 40px;
                margin-top: 10px;
            }
            
            /* The styling for the product page title */
            
            #productPageTitle{
                
                font-family: sans-serif;
                font-size: 60px;
                padding-bottom: 15px;
                padding-top: 60px;
                 
            }
            
            /* The styling for the product page images */
            
            #productContainer img{
                
                margin-top: 10px;
                opacity: 1;
                border:none;
            }
            
            #productContainer img:hover{
                
                opacity: 1;
                border:none;
            }
            
            /* The styling for the product page links */
            
            #productContainer h3{
                
                text-decoration: none;
                color:#ff8bd0;
                font-family:  'Raleway', sans-serif;
                font-weight: bold;
                
            }
            
            /* The styling for the product descriptions */
            
            #productContainer p{
                
                text-align: justify;
                padding:0px 10px 10px 10px;
                font-size: 12px;
                margin-top:0;
            }
            
            #Products-Page a{
                
                text-decoration: none;
                color:#ff8bd0;
                
            }
            
            .clearFloats{
                
                clear: both;
            }
            
            /* The styling for individual article containers */
            
            #article{
                
                
                height:300px;
                margin-top: 40px;
                margin-bottom: 40px;
            }
            
            /* The styling for the article text  */
            
            #articleContent{
                
                background-color: #f7f9fb;
                width: 600px;
                text-align: justify;
                float:left;
                height:350px;
                margin-top: 7px;
            }
            
            /* The styling for the article heading */
            
            #articleContent h2{
                
                text-align: center;
                font-family:  'Raleway', sans-serif;
                
                
            }
            
            /* The styling for the article image */
            
            #articleImage{
                
                float: left;
                padding-top: 5px;
                padding-left: 5px;
            }
            
            #articleContent a{
                
                text-decoration: none;
                font-weight: bolder;
                color:#ff8bd0;
            }
            
            /* The styling for the black footer at the bottom of the page */
            
            #footer{
                
                width:100%;
                background-color: black;
                height:18px;
                position: fixed;
                bottom:0px;
                left:0px;
                color:white;
                font-family: 'Raleway', sans-serif;
                font-size: 12px;
                padding-top: 5px;
            }
            
            #footer a{
                
                text-decoration: none;
                color:white;
                font-family: 'Raleway', sans-serif;
                font-size: 12px;
            }
            
            #contactPageTitle{
                
                font-family: sans-serif;
                font-size: 60px;
                padding-bottom: 15px;
                padding-top:60px;
                
            }
            
            #gapAboveMap{
                
                height:40px;
            }
            
            /* The styling for the contact details and social icons */
            
            #contactDetails{
                
                height:600px;
                background-color: #f7f9fb;
                margin-bottom:40px;
                
            }
            
            #contactDetails a{
                
                text-decoration: none;
                color:black;
                
            }
            
            #contactDetails img{
                
                opacity: 1;
                border:none;
                
            }
            
            #contactDetails img:hover{
                
               border:none;
                
            }
            
            #iconsAddress{
                
                width:500px;
                float: left;
            }
            
            #iconsAddress img{
                
                border:none;
                width:50px;
                margin-top: 20px;
            }
            
            #iconsAddress img:hover{
                
                border:none;
            }

            #contactDetails{
                
                font-family: 'Raleway', sans-serif;
            }

            #openHours{
                
                font-family: 'Raleway', sans-serif;

            }

            #contact details ul{
                
                color: aqua;
    
    
            }

            
            /* The styling for the external image of the salon */
            
            #externalImage{
                
                height:350px;
                float: left;
                margin-top: 40px;
                opacity: 1;
            }
            
            /* The styling for the services prices sections */
            
            #pricesContainer{
                
                width:1000px;
                margin: 0 auto;
                background-color: #f7f9fb;
                padding-top: 20px;
            }
            
            #mensPricesContainer{
                
                width:1000px;
                margin: 0 auto;
                background-color: #f7f9fb;
            }
            
            
            #leftLines{
                
                width: 350px;
                height: 10px;
                border-top: 3px solid pink;
                border-bottom: 3px solid pink;
                float:left;
                margin-right: 20px;
                margin-top: 10px;
                margin-left: 80px;
            }
            
            #rightLines{
                
                width: 350px;
                height: 10px;
                border-top: 3px solid pink;
                border-bottom: 3px solid pink;
                float:left;
                margin-left: 20px;
                margin-top: 10px;
            }
            
            #leftLinesMen{
                
                width: 350px;
                height: 10px;
                border-top: 3px solid pink;
                border-bottom: 3px solid pink;
                float:left;
                margin-right: 25px;
                margin-top: 10px;
                margin-left: 80px;
            }
            
            #rightLinesMen{
                
                width: 350px;
                height: 10px;
                border-top: 3px solid pink;
                border-bottom: 3px solid pink;
                float:left;
                margin-left: 25px;
                margin-top: 10px;
            }
            
            #pricesContainer h2{
                
                float:left;
                margin-top: 0;
                font-family: 'Raleway', sans-serif;
            }
            
            #mensPricesContainer h2{
                
                float:left;
                margin-top: 0;
                font-family: 'Raleway', sans-serif;
            }
            
            #pricesContainer p{
                
                margin:0;
                padding-top: 3px;
                background-color: #f7f9fb;
                height: 30px;
            }
            
            #pricesContainer{
                
                height: 603px;
            }
            
            #mensPricesContainer{
                
                height: 398px;
            }
            
            .clearfloats{
                
                clear: both;
            }
            
            #ladiesServices{
                
                width:500px;
                height: 25px;
                float:left;
                font-family: 'Raleway', sans-serif;
                text-align: center;
            }
            
            #ladiesPrices{
                
                width:500px;
                height:25px;
                float: left;
                font-family: 'Raleway', sans-serif;
                text-align: center;
                
            }
            
            #leftLinesTech{
                
                width: 270px;
                height: 10px;
                border-top: 3px solid pink;
                border-bottom: 3px solid pink;
                float:left;
                margin-right: 25px;
                margin-top: 10px;
                margin-left: 80px;
            }
            
            #rightLinesTech{
                
                width: 270px;
                height: 10px;
                border-top: 3px solid pink;
                border-bottom: 3px solid pink;
                float:left;
                margin-left: 25px;
                margin-top: 10px;
            }
            
            #techPricesContainer h2{
                
                float:left;
                margin-top: 0;
                font-family: 'Raleway', sans-serif;
            }
            
            #techPricesContainer{
                
                width:1000px;
                margin: 0 auto;
                background-color: #f7f9fb;
                height: 1050px;
            }
            
            /* The styling for the 2 product descriptions */
            
            #keratinDes{
                
                font-family: 'Raleway', sans-serif;
                font-size: 12px;
                text-align: justify;
                padding:0 100px 40px 80px;
                background-color: #f7f9fb;
                
            }
            
            #leftLinesSuper{
                
                width: 270px;
                height: 10px;
                border-top: 3px solid pink;
                border-bottom: 3px solid pink;
                float:left;
                margin-right: 45px;
                margin-top: 10px;
                margin-left: 80px;
            }
            
            #rightLinesSuper{
                
                width: 270px;
                height: 10px;
                border-top: 3px solid pink;
                border-bottom: 3px solid pink;
                float:left;
                margin-left: 35px;
                margin-top: 10px;
            }
            
            #superPricesContainer h2{
                
                float:left;
                margin-top: 0;
                font-family: 'Raleway', sans-serif;
            }
            
            #superPricesContainer{
                
                width:1000px;
                margin: 0 auto;
                background-color: #f7f9fb;
                height:300px;
            }
            
            #leftLinesCon{
                
                width: 270px;
                height: 10px;
                border-top: 3px solid pink;
                border-bottom: 3px solid pink;
                float:left;
                margin-right: 55px;
                margin-top: 10px;
                margin-left: 80px;
            }
            
            #rightLinesCon{
                
                width: 270px;
                height: 10px;
                border-top: 3px solid pink;
                border-bottom: 3px solid pink;
                float:left;
                margin-left: 45px;
                margin-top: 10px;
            }
            
            #concessionPricesContainer h2{
                
                float:left;
                margin-top: 0;
                font-family: 'Raleway', sans-serif;
            }
            
            #concessionPricesContainer{
                
                width:1000px;
                margin: 0 auto;
                background-color: #f7f9fb;
                height:120px;
            }