.span-1 {


  width: 144px;


}





.span-2 {


  width: 307px;


}





.span-3 {


  width: 470px;


}





.span-4 {


  width: 634px;


}





.span-5 {


  width: 797px;


}





.span-6 {


  width: 960px;


}





.offset-1 {


  margin-left: 163px;


}





.offset-2 {


  margin-left: 326px;


}





.offset-3 {


  margin-left: 490px;


}





.offset-4 {


  margin-left: 653px;


}





.offset-5 {


  margin-left: 816px;


}





@media(max-width: 768px) {


  .fluid-span-1 {


    width: 15%;


  }





  .fluid-span-2 {


    width: 32%;


  }





  .fluid-span-3 {


    width: 49%;


  }





  .fluid-span-4 {


    width: 66%;


  }





  .fluid-span-5 {


    width: 83%;


  }





  .fluid-span-6 {


    width: 100%;


  }





  .fluid-offset-1 {


    margin-left: 17%;


  }





  .fluid-offset-2 {


    margin-left: 34%;


  }





  .fluid-offset-3 {


    margin-left: 51%;


  }





  .fluid-offset-4 {


    margin-left: 68%;


  }





  .fluid-offset-5 {


    margin-left: 85%;


  }





}


@media(max-width: 320px) {


  .span-1 {


    width: 960px;


  }





}