<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
body{margin:0px auto;}
.sdiv { margin:0px; background:black; float:left;}
.sdiv > div{background:limegreen; margin:1px; float:left; text-align:center; padding:5px 11px; font-family: arial; font-size:20px; font-weight:bold; color:white;
}

.sdiv> div,a:link, a:active, a:visited {color:white; text-decoration:none;}
.sdiv> div:hover {background:red; cursor:pointer; text-decoration:underline;}

    img {
      float: left;
      width: 100px;
      height: 100px;
      padding: 3px;
      margin: 3px;
      padding-top: 3px;
      border: 1px dashed #fff;
      border-radius: 7px;
    }
    
   img:hover {
  border: 1px solid red;
  opacity: 0.9;
}

a:hover {
  background-color: #ff0000;
  color: white;
}
.active {
  background-color: #ff0000;
  color: white;
}


@media screen and (max-width: 500px) {
.sdiv{margin:0px; background:yellow; width:48%; background:none; float:left;}
.sdiv> div {background:limegreen; text-align:center; border:1px solid black; padding:5px 11px; width:93%; margin:0px 2px;
}
img{width:100px;}

}

</style>
</head>
<body bgcolor="black">

<div class="sdiv">
<div><a href="" > LOGO</div>
<div><a href="" > HOME</a></div>
<div><a href=""> ABOUT</a></div>
</div>

<div class="sdiv">
<div><a href="upload_image_and_thumb.php"> UPLOAD</a></div>
  <div><a href=""> SERVICES</a></div>
  <div><a href=""> CONTACT</a></div>
</div>

<br><br><br>

<?php
    function mtimecmp($a, $b) {
        $mt_a = filemtime($a);
        $mt_b = filemtime($b);

        if ($mt_a == $mt_b)
            return 0;
        else if ($mt_a < $mt_b)
            return -1;
        else
            return 1;
    }

    $images = glob($dirname."./*.{JPG,jpg,gif,png,bmp}", GLOB_BRACE);
    usort($images, "mtimecmp");
    $images=array_reverse($images);

    foreach ($images as $image) {
        echo '<a href="'.$image.'"><img src="../thumbs/'.$image.'" height ="400"/></a>';
    }
    
?>



<?php /*
$folder_path = './';
$files = glob($folder_path . "*.{JPG,jpg,gif,png,bmp}", GLOB_BRACE);
foreach($files as $file){
echo '<a href="'.$file.'"> <img src="'.$file.'" width="100px" vspace="2px" hspace="2px"  /> </a>';
} */
?>





</body>
</html>
