#spinner-wrapper,.spinner-wrapper{
	width:100%;
	position:absolute;
	height:100%;
	top:0;
	left:0;
	font-size: 250%;
}
.spinner-wrapper-table{
	width:100%;
	height:100%;
	position:relative;
	display:table;
}
.spinner-wrapper-table-cell{
	width:100%;
	height:100%;
	position:relative;
	display:table-cell;
	vertical-align:middle;
}
#spinner-wrapper .spinner >div,.spinner-wrapper .spinner >div{
	height:5em;
}
#spinner-wrapper .spinner >div,.spinner-wrapper .spinner >div{
	background-color: rgba(255, 255, 255, 0.8);
	width: 0.4em;
}

.spinner {
  margin: 100px auto;
  width: 8em;
  height: 3em;
  text-align: center;
  font-size: 100%;
}

.spinner > div {
  background-color: #333;
  height: 100%;
  width: 6px;
  display: inline-block;
  
  -webkit-animation: stretchdelay 1.2s infinite ease-in-out;
  animation: stretchdelay 1.2s infinite ease-in-out;
}
.spinner-theme-dark0 > div{background-color: #333;}
.spinner-theme-dark1 > div{background-color: #666;}

.spinner .rect2 {
  -webkit-animation-delay: -1.1s;
  animation-delay: -1.1s;
}

.spinner .rect3 {
  -webkit-animation-delay: -1.0s;
  animation-delay: -1.0s;
}

.spinner .rect4 {
  -webkit-animation-delay: -0.9s;
  animation-delay: -0.9s;
}

.spinner .rect5 {
  -webkit-animation-delay: -0.8s;
  animation-delay: -0.8s;
}

@-webkit-keyframes stretchdelay {
  0%, 40%, 100% { -webkit-transform: scaleY(0.4) }  
  20% { -webkit-transform: scaleY(1.0) }
}

@keyframes stretchdelay {
  0%, 40%, 100% { 
    transform: scaleY(0.4);
    -webkit-transform: scaleY(0.4);
  }  20% { 
    transform: scaleY(1.0);
    -webkit-transform: scaleY(1.0);
  }
}


/* fallback */
@font-face {
  font-family: 'Material Icons';
  font-style: normal;
  font-weight: 400;
  src: local('Material Icons'), 
       local('MaterialIcons-Regular'), 
       url(fonts/google_material_icons/MaterialIcons-Regular.woff2 ) format('woff2'),
       url(fonts/google_material_icons/MaterialIcons-Regular.woff) format('woff'),
       url(fonts/google_material_icons/MaterialIcons-Regular.ttf) format('truetype');
}

.material-icons {
  font-family: 'Material Icons';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: 'liga';
  -webkit-font-smoothing: antialiased;


  font-feature-settings: 'liga';
}



@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 100;
  src: local('Roboto Thin'), local('Roboto-Thin'), 
       url(fonts/RobotoV15/Roboto-Thin.woff2) format('woff2'),
       url(fonts/RobotoV15/Roboto-Thin.woff) format('woff'),
       url(fonts/RobotoV15/Roboto-Thin.ttf) format('ttf');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
}


@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  src: local('Roboto Light'), local('Roboto-Light'), 
       url(fonts/RobotoV15/Roboto-Light.woff2) format('woff2'),
       url(fonts/RobotoV15/Roboto-Light.woff) format('woff'),
       url(fonts/RobotoV15/Roboto-Light.ttf) format('ttf');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
}


@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: local('Roboto Regular'), local('Roboto-Regular'), 
       url(fonts/RobotoV15/Roboto-Regular.woff2) format('woff2'),
       url(fonts/RobotoV15/Roboto-Regular.woff) format('woff'),
       url(fonts/RobotoV15/Roboto-Regular.ttf) format('ttf');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
}


@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  src: local('Roboto Medium'), local('Roboto-Medium'), 
       url(fonts/RobotoV15/Roboto-Medium.woff2) format('woff2'),
       url(fonts/RobotoV15/Roboto-Medium.woff) format('woff'),
       url(fonts/RobotoV15/Roboto-Medium.ttf) format('ttf');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
}


@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  src: local('Roboto Bold'), local('Roboto-Bold'), 
       url(fonts/RobotoV15/Roboto-Bold.woff2) format('woff2'),
       url(fonts/RobotoV15/Roboto-Bold.woff) format('woff'),
       url(fonts/RobotoV15/Roboto-Bold.ttf) format('ttf');

  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
}


@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 900;
  src: local('Roboto Black'), local('Roboto-Black'),
       url(fonts/RobotoV15/Roboto-Black.woff2) format('woff2'),
       url(fonts/RobotoV15/Roboto-Black.woff) format('woff'),
       url(fonts/RobotoV15/Roboto-Black.ttf) format('ttf');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
}