/**
 *  basic font size and model size
 *
 */

body{
  margin: 0;
}

a { color: inherit; }
a:active, a:hover {
  outline: 0;
}
a:link { text-decoration: inherit; }

/**
  0. html has a base font-size 10px, all other font-size are based on this
**/
html {
  font-size: 10px; /* 0 */
}
/**
  2. everything other than font-size reset to normal size (16px == 1em)
**/
body {
  font-size: 16px; /* 2 */
}

/**
  reset all head
**/
h1,h2,h3,h4,h5,h6 {
  font-weight: normal;
}
hgroup, .hgroup{
  margin: 1.5em 0;
}
/**
  six basic font-size, all scale with html's base font-size( 0 )
**/
.txxl, h1 { font-size: 4rem; }
.txl, h2 { font-size: 3.2rem; }
.tl, h3 { font-size: 2.4rem; }
.tm, h4 { font-size: 1.8rem; }
.ts, h5, a, p  { font-size: 1.5rem; }
.tx, h6 { font-size: 1.2rem; }
.b, .bold, b, strong {
  font-weight: bold;
}

/**
  small tag or .small class
  make this direct child of any basic text tag or class
  to have a slightly smaller sized text
**/
.small, small{
  font-size: .8em;
}
/**
  same as small, but bigger
**/
.big, big{
  font-size: 1.2em;
}

/**
  text only helper class
**/
.text-shadow{
  text-shadow: 1px 1px 1px currentColor,0 0 1px #7f7f7f;
}
.text-center{
  text-align: center;
}
.text-right{
  text-align: right;
}



/**
  List
**/

/*Remove the default list-style */
.list-unstyle{
  padding: 0;
  list-style-type: none;
}
.list-inline>li{
  display: inline-block;
}





/**
  misc helper class
**/
.hidden {
  display: none !important;
}

.img-fluid {
  display: block;
  width: 100%;
  height: auto;
}




.noselect{
  -webkit-touch-callout: none; /* iOS Safari */
  -webkit-user-select: none;   /* Chrome/Safari/Opera */
  -khtml-user-select: none;    /* Konqueror */
  -moz-user-select: none;      /* Firefox */
  -ms-user-select: none;       /* IE/Edge */
  user-select: none;
}










@media (max-width: 800px) {
 /* most tablets */
 .text-center-m{
   text-align: center;
 }
}

@media (max-width: 540px) {
 /* most large smartphones */
 html{
   font-size: 9px;
 }
 .text-center-s{
   text-align: center;
 }
}
@media (max-width: 320px) {
  /* most large smartphones */
  html{
    font-size: 8px;
  }


}
