@import url("https://fonts.googleapis.com/css?family=Titillium+Web");
 * {
  đệm: 0;
  lề: 0;
  font-size: medium;
  font-family: 'Titillium Web', sans-serif;
}
.l-app__menu {
  position: fixed;
  top: 0;
  height: 100vh;
  width: 270px;
  transform: translateX(-100%);
  transition: 1s ease-in-out;
}
.c-hamburger--icon:checked ~ .l-app__menu {
  transform: translateX(0);
  background: #000;
  opacity: .7;
}
.l-app__left {
  float: bên trái;
  position: fixed;
  background: #185a9d;
  chiều rộng: 50%;
  height: 100%;
  overflow: hidden;
}
@media (max-width: 1200px) {
  .l-app__left {
    position: static;
    width: 100%;
    height: 100vh;
    background: #fff;
  }
}
.l-app__right {
  float: right;
  background: #fff;
  chiều rộng: 50%;
  height: 100vh;
}
@media (max-width: 1200px) {
  .l-app__right {
    position: static;
    width: 100%;
    background: #bfbfbf;
  }
}
.l-app__right--inner {
  padding: 50px;
}
.l-app__hamburger {
  position: fixed;
  z-index: 1;
}
.c-bike__image {
  background: url(http://bikeshopgirl.com/wp-content/uploads/2011/10/15038.jpg) no-repeat;
  background-size: contain;
  min-height: 100%;
  opacity: .9;
  top: 0;
  vị trí: tương đối;
}
@media (max-width: 1200px) {
  .c-bike__image {
    position: static;
    width: auto;
    opacity: 1;
  }
}
.c-bike__header {
  font-size: 150%;
  padding: 15px;
}
@media (max-width: 1200px) {
  .c-bike__header {
    đệm: 0;
  }
}
.c-bike__article {
  letter-spacing: .3px;
  padding: 10px;
}
.c-bike__article.c-bike__header {
  font-size: 120%;
  đệm: 0;
}
.c-hamburger {
  background: transparent;
  hiển thị: khối;
  vị trí: tương đối;
  overflow: hidden;
  lề: 0;
  đệm: 0;
  width: 96px;
  height: 96px;
  font-size: 0;
  text-indent: -9999px;
  appearance: none;
  box-shadow: none;
  border-radius: none;
  border: none;
  cursor: pointer;
  transition: background .3s;
}
.c-hamburger:focus {
  outline: none;
}
.c-hamburger--icon {
  display: none;
}
.c-hamburger--icon ~ .c-hamburger--htx {
  transition: transform 1s;
}
.c-hamburger--icon:checked ~ .c-hamburger--htx {
  transform: translate(250px, 0) rotate(90deg);
  transition: 1s ease-in-out;
}
.c-hamburger--icon:checked ~ .c-hamburger--htx .c-hamburger__span {
  background: none;
}
.c-hamburger--icon:checked ~ .c-hamburger--htx .c-hamburger__span::before {
  top: 0;
  transform: rotate(45deg);
}
.c-hamburger--icon:checked ~ .c-hamburger--htx .c-hamburger__span::after {
  dưới cùng: 0;
  transform: rotate(-45deg);
}
.c-hamburger--htx__span {
  transition: transform .5s;
}
.c-hamburger--htx__span::before {
  transition-property: top, transform;
}
.c-hamburger--htx__span:after {
  transition-property: bottom, transform;
}
.c-hamburger__span {
  hiển thị: khối;
  vị trí: tuyệt đối;
  top: 44px;
  left: 18px;
  right: 18px;
  height: 8px;
  background: #930202;
  border-radius: 5px;
}
.c-hamburger__span::before,
.c-hamburger__span::after {
  vị trí: tuyệt đối;
  hiển thị: khối;
  left: 0;
  width: 100%;
  height: 8px;
  background: #930202;
  border-radius: 5px;
  content: "";
}
.c-hamburger__span::before {
  top: -20px;
}
.c-hamburger__span::after {
  bottom: -20px;
}

  

    
    
      
    
    
  

  

    

  

  

    

      

        

          
Bike name

        

        

          

            
Secion name

          

          

            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce quis diam egestas, dictum augue ut, dignissim lorem. Integer eros felis, sodales at viverra et, ultricies malesuada lacus. Nullam ex orci, vulputate vitae porta eu, gravida vel arcu. Curabitur
            mattis quis dolor sit amet dapibus. Etiam mattis diam id rhoncus tempor. Phasellus tristique auctor luctus. Nulla ullamcorper tempus porttitor. Sed et tincidunt sem. Morbi dictum ut orci sit amet pretium. Integer feugiat enim vitae neque commodo,
            ac malesuada lacus scelerisque. Donec quis odio in ipsum facilisis auctor. Vestibulum turpis turpis, blandit sit amet tempus sed, facilisis nec tellus. Morbi elementum vulputate sem a rhoncus. Vivamus bibendum congue velit, ac hendrerit est
            suscipit ac. Nunc a molestie libero.