body {
  background-image: url(/images/Untitled-1_07_sm.png);
  background-repeat: repeat;
  background-attachment: fixed;
  padding:0;
  border:0;
  margin:0;
}

/* centre website */
.photoGallery {
    max-width: 1200px;
    margin: auto;
}

/* add the yellow image slice to the top navigation */
.topnav {
    background-image: url(/images/topbg01.png);
    background-repeat: repeat-x;
    overflow:hidden;
}

/* style the links inside the top navigation bar */
.topnav a {
    float: left;
    display: block;
}

/* hide the link that should open and close the topnav on small screens */
.topnav .icon {
    display:none;
}

/* when the screen is less than 600 pixels wide, hide all links, except for the first one ("home").  Show the link that contains the topnav icon */
@media screen and (max-width: 600px) {
    .topnav a:not(:first-child) {display: none;}
    .topnav a.icon {
        float: right;
        display: block;
    }
}

/* the "responsive" class is added to the topnav with Javascript when the user clicks on the icon.  This class makes the topnav look good on small screens (displays the links vertically instead of horizontally) */
@media screen and (max-width: 600px) {
    .topnav.responsive {
        position: relative;
    }
    .topnav.responsive a.icon {
        position: absolute;
        right: 0;
        top: 0;
    }
    .topnav.responsive a {
        float: none;
        display: block;
        text-align: left;
    }
}

/* style the small aussie logo on topnav section */
#smallAussieLogo {
    float: right;
}

/* add the large yellow bar to the top of the page */
.largeYellowBar {
    clear: left;
    background-image: url(/images/topbg01big.png);
    background-repeat: repeat-x;
}

/* style the photo gallery */
.row {
    display: flex;
    flex-wrap: wrap;
    padding: 0 4px;
}

/* create two equal columns that sit next to each other */
.column {
    flex: 45%;
    max-width: 45%;
    padding: 0 4px;
}

.column img {
    margin-top: 8px;
    vertical-align: middle;
    width: 100%;
}

/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 600px){
    .column {
        flex: 100%;
        max-width: 100%;
    }
}

/* The Modal (background) */
.modal {
  display: none;
  position: fixed;
  z-index: 1;
  padding-top: 100px;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: black;
}

/* Modal Content */
.modal-content {
  position: relative;
  background-color: black;
  margin: auto;
  padding: 0;
  width: 90%;
  max-width: 1200px;
}

/* The Close Button */
.close {
  color: white;
  position: absolute;
  top: 10px;
  right: 25px;
  font-size: 35px;
  font-weight: bold;
}

.close:hover,
.close:focus {
  color: #999;
  text-decoration: none;
  cursor: pointer;
}

.mySlides {
  display: none;
}

.cursor {
  cursor: pointer;
}

/* Next & previous buttons */
.prev,
.next {
  cursor: pointer;
  position: absolute;
  top: 50%;
  width: auto;
  padding: 16px;
  margin-top: -50px;
  color: white;
  font-weight: bold;
  font-size: 20px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
  user-select: none;
  -webkit-user-select: none;
}

/* Position the "next button" to the right */
.next {
  right: 0;
  border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover,
.next:hover {
    background-color: black;
  background-color: rgba(0, 0, 0, 0.8);
}

/* Number text (1/3 etc) */
.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}

img {
  margin-bottom: -4px;
}

/* style the copyright div */
.copyright{
    clear: left;
    color: #FFF; 
    text-align: center;
    padding: 20px;
}

/* style the Australain map logo at bottom of page */
.australia {
    text-align: center;
}

/* style the list ofsigns section at the bottom of the page*/
.signs {
    text-align: center;
    color: #FFF;
    padding-top: 50px;
}