*{
  margin:              0;
  padding:             0;
  font-family:         verdana;
}

/*HAWAI*/
#navhaw{
  width:               100%;
  height:              100vh;
  background-size:     cover;
  background-image:    url(destination/hawai1.jpg);
 }

/*BALI*/
#navbal{
  width:               100%;
  height:              100vh;
  background-size:     cover;
  background-image:    url(destination/bali1.jpg);
 }
 
/*MACHU*/
#navmac{
  width:               100%;
  height:              100vh;
  background-size:     cover;
  background-image:    url(destination/machu2.jpg);
 }

/*PATAGONIA*/
#navpat{
  width:               100%;
  height:              100vh;
  background-size:     cover;
  background-image:    url(destination/pat1.jpg);
 }
 
/*SANTORINI*/
#navsan{
  width:               100%;
  height:              100vh;
  background-size:     cover;
  background-image:    url(destination/santo1.jpg);
 }
 
/*MALDIVES*/
#navmal{
  width:               100%;
  height:              100vh;
  background-size:     cover;
  background-image:    url(destination/mal1.jpg);
 }
 
* {
    box-sizing:        border-box;
}


body {
    font-family:       Arial;
    font-size:         17px;
    text-align:        center;
}

/*writing on the image*/
.container {
    position:          relative;
    max-width:         100%;
    margin:            0 auto;
}
  
.container img {
 vertical-align:       middle;
 }
  
.container .content {
    position:          absolute;
    bottom:            0;
    background:        rgb(0, 0, 0); /* Fallback color */
    background:        rgba(0, 0, 0, 0.5); /* Black background with 0.5 opacity */
    color:             #f1f1f1;
    width:             100%;
    padding:           20px;
}

 /*NAVIGATION DETAILS*/
 nav{
  width:               100%;
  height:              80px;
  background-color:    #000;
  opacity:             0.6;
  line-height:         80px;
 }
 
 nav ul{
  float:              right;
  margin-right:       30px;
 }
 
 nav ul li{
  list-style-type:    none;
  display:            inline-block;
  transition:         0.4s all;
}

nav ul li:hover{
 background-color:   #2F4F4F;
 
}

nav ul li a{
 text-decoration:    none;
 color:              #fff;
 padding:            30px;
}

/* Container for flexboxes */
section {
  display:          -webkit-flex;
  display:          flex;
}
/* Style the content */
article {
  -webkit-flex:     3;
  -ms-flex:         3;
  flex:             3;
  background-color: #f1f1f1;
  padding:          10px;
}

#article1{
  -webkit-flex:     2;
  -ms-flex:         2;
  flex:             2;
  background:       #ccc;
  padding:          20px;
}

/*section footer*/
#footer{
    text-align:     center;
    margin:         10px;
    border:         10px solid;
    padding:        5px;
    color:          black;
}