/*
 */
 
/* FONTS */
  @import url('https://fonts.googleapis.com/css?family=Open+Sans');
  @import url('https://fonts.googleapis.com/css?family=Fira+Sans');



/* Palette generated by Material Palette - materialpalette.com/light-blue/deep-orange */

.dark-primary-color    { background: #0288D1; }
/* .default-primary-color { background: #03A9F4; color: white; } */
.default-primary-color { background: #428bca; color: white; }
.light-primary-color   { background: #B3E5FC; }
.text-primary-color    { color: #FFFFFF; }
.accent-color          { background: #FF5722; }
.default-background          { background: white; }
.primary-text-color    { color: #212121; }
.secondary-text-color  { color: #757575; }
.divider-color         { border-color: #BDBDBD; }

.navbar {margin-bottom: 0;}

/* shadows */
.card {
  border-radius: 2px;
  display: inline-block;
  height: 300px;
  margin: 0rem;
  position: relative;
  width: 300px;
}

/* somes boxes ... */
.square {
  position: relative;
  width: 50%;
}

.square:after {
  content: "";
  display: block;
  padding-bottom: 100%;
}

.content {
  position: absolute;
  width: 100%;
  height: 100%;
}



.card-1 {
  box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
  transition: all 0.3s cubic-bezier(.25,.8,.25,1);
}

.card-1:hover {
  box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);
}

.card-2 {
  box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
}

.card-3 {
  box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
}

.card-4 {
  box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);
}

.card-5 {
  box-shadow: 0 19px 38px rgba(0,0,0,0.30), 0 15px 12px rgba(0,0,0,0.22);
}

/* OVERALL ASPECT */

html {
  height: 100%;
  width:100%;
}

body {
  background-color: #f2f2f2;
    font-family: "Open Sans";
    font-weight: 300;
    font-size: 14px;
    color: #555;
    -webkit-font-smoothing: antialiased;
    -webkit-overflow-scrolling: touch;
   padding: 0px;   
}



/* .container{ */
/*     box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24); */
/* } */




/* Links */
a {
    color: #428bca;

    -webkit-transition: color 0.1s ease-in, background 0.1s ease-in;
    -moz-transition: color 0.1s ease-in, background 0.1s ease-in;
    -ms-transition: color 0.1s ease-in, background 0.1s ease-in;
    -o-transition: color 0.1s ease-in, background 0.1s ease-in;
    transition: color 0.1s ease-in, background 0.1s ease-in;
}

a:hover,
a:focus {
    color: #7b7b7b;
    text-decoration: none;
    outline: 0;
}

a:before,
a:after {
    -webkit-transition: color 0.1s ease-in, background 0.1s ease-in;
    -moz-transition: color 0.1s ease-in, background 0.1s ease-in;
    -ms-transition: color 0.1s ease-in, background 0.1s ease-in;
    -o-transition: color 0.1s ease-in, background 0.1s ease-in;
    transition: color 0.1s ease-in, background 0.1s ease-in;
}

/* Text labels for three.js */

.text-label {
  color: #ff1744;
  font-family: "Fira Mono", Monaco, "Andale Mono", "Lucida Console", "Bitstream Vera Sans Mono", "Courier New", Courier, monospace;
  font-size:14px;
  margin: -5px 0 0 15px;
  pointer-events:none;
  z-index: 1000;
}


.modal-content{
    /* background-image: url("../img/wheel.gif"); */
    /* background-color: 'rgba(255,255,0,0.1)'; */ 
    /* background-color:#0288D1; */ 
    /* background-repeat: no-repeat; */
    /* background-attachment: fixed; */
    /* background-position: center; */
    opacity: 0.8;               /* Good browsers */

}
.modal-body{
    /* background-image: url("../img/wheel.gif"); */
    /* min-width:800; */
    /* min-height:600;} */