.folderContainer{
  float:left; 
   margin:10px 10px 10px 10px;
 }
 .folderContainer a{
   text-decoration:none;
   color:black;
 }
 .folder {
   position: relative;
   top: 0;
   left: 0;
   background:#2D0653;
   width: 170px;
   height: 100px;
   box-sizing: border-box;
   border: 8px solid white;
   border-top-width: 32px;
   border-radius: 0 3.25px 3.25px;
   transition: border-top-width 0.3s, transform 0.2s;
   transform-origin: 0 100%;
   cursor: pointer;
   
 }
 .folder:before,
 .folder:after {
   content: '';
   background: white;

 }
 .folder:before,
 .folder:after,
 .folder i {
   position: absolute;
 }
 .folder:before {
   width: 70px;
   height: 9px;
   bottom: 90px;
   left: -8px;
   border-radius: 3.25px 3.25px 0 0;
   border-top:1px solid dodgerblue;
   
 }
 .folder i,
 .folder:after {
   width: 170px;
   height: 97px;
   line-height: 72px;
   text-align: center;
   bottom: -8px;
   left: -8px;
   transition: transform 0.2s, background 0.2s;
   transform-origin: 0 100%;
 }
 .folder:after {
   background-color: white;
   border-bottom: 1px solid rgba(0, 0, 0, 0.15);
   border-radius: 3.25px;
 }
 .folder i {
   z-index: 2;
   color: #2D0653;
   font-size: 19px;
   text-shadow: 0 1px 0 rgba(255, 255, 255, 0.25);
   border-top:1px solid dodgerblue;
 }
 .folder:hover {
   border-top-width: 8px;
 }
 .folder:hover:after,
 .folder:hover i {
   transform: scaleY(0.85) skewX(-15deg);
 }
 .folder:hover:after {
   background: white;
 }
 .folder:hover:i {
   color: #fff;
 }
 
 .folderContainer h3{
   text-align:center;
 }
 /*============ Files ===================*/
 body {
   background-color: #EEEEFD;
   text-align: center;
   font-family: 'Roboto', sans-serif;
 }
 h5{
   color:#2D0653;
 }
 
 