/*new galery*/

   * {
     box-sizing: boder-box;
   }

   body {
     margin: 0;
   }

   #main {
     position: relative;
     z-index: 20;
     background: #fff;
     -webkit-transition: -webkit-transform .6s ease;
     transition: -webkit-transform .6s ease;
     transition: transform .6s ease;
     transition: transform .6s ease, -webkit-transform .6s ease;
   }

   @media (min-width: 640px) {
     #main {
       padding: 1em;
     }
   }

   .fake-section {
     background: #eee;
     height: 300px;
   }

   .tiles-a {
     width: 100%;
     position: relative;
     overflow: hidden;
   }

   .tiles-a ul {
     margin: 0;
     padding: 0;
   }

   .tiles-a li {
     list-style: none;
   }

   @media (min-width: 640px) {
     .tiles-a li {
       float: left;
       width: 33.33%;
     }
   }

   .tiles-a a {
     margin: 1em;
     display: block;
     background: #222;
     padding-top: 73%;
     height: 0;
   }

   #aside {
     position: fixed;
     top: 0;
     right: 0;
     width: 60%;
     height: 80%;
     background: #eee;
     overflow-y: scroll;
     z-index: 10;
   }

   #aside img {
     width: 100%;
     height: auto;
     vertical-align: top;
   }

   #aside .wrapper {
     padding: 1em;
   }

   #aside .close {
     width: 25px;
     display: block;
     position: absolute;
     top: 1em;
     right: 1em;
     background-color: rgba(0, 0, 0, 0.5);
     border-radius: 50%;
   }

   .show-detail {}

   .show-detail #main {
     -webkit-transform: translateX(-60%);
     transform: translateX(-60%);
   }

   .visually-hidden {
     position: absolute;
     overflow: hidden;
     clip: rect(0 0 0 0);
     height: 1px;
     width: 1px;
     margin: -1px;
     padding: 0;
     border: 0;
   }