html, body {
  font-family: 'Roboto', sans-serif;
  font-size:14px;
  height:100%;
  margin: 0px;
  padding: 0px;
}

/* Toolbar area */

.menu {
  background-color: transparent;
  border: none;
  height: 40px;
  margin: 12px;
  width: 36px;
}

.logo{
  height:62px;
  margin:5px;
  cursor: pointer;
}

.centeredContent{
  text-align: center;
}

.sectionTitle{
  padding-left: 10px;
}

md-toolbar h3 {
  margin: auto;
  font-weight: 500;
}

/* Sidenav area */

md-list-item > button {
  width:100%;
  text-align:left !important;
}

  md-list .md-button.selected {
    color: #03a9f4;
  }

  md-sidenav  md-list {
    padding: 0px 0px 8px 0px;
  }

/* Primary content area */

#content {
  /* overflow: hidden; */
}

#content  {
  /* padding-left: 5px;
  padding-right: 5px; */
  padding-top: 5px;
}

#content .md-button.share {
  background-color: transparent;
  border: none;
  width: 48px;
  height: 48px;
  margin: 8px auto 16px 0;
  position: absolute;
  top: 10px;
  right: 25px;
}

#content md-icon.avatar {
  margin-top: 10px;
}

#content .md-button.share > md-icon {
  fill:black;
  width:36px;
  height:36px;
}

.infoButton{
  font-size: 24px;
  height: 24px;
  width: 24px;
  margin-right: 20px;
  margin-top: 20px; 
  cursor:pointer;
}

md-button.menuBtn > md-icon {
  fill:white;
  width:24px;
  height:24px;
}

#content .md-button.share:active > md-icon {
  background-color: #dadada;
  border-radius: 75%;
  padding:4px;
  transition: all 100ms ease-out 30ms;
}

#content img {
  display: block;
  height: auto;
  max-width: 500px;
}

.dayCard{
  display: inline-block !important; 
  cursor: pointer !important; 
  text-align: center;
  overflow: hidden;
  width: 150px;
  margin: 10px;
  padding: 5px;
  font-size: 18px;
}

.dayPictureCard{
  display: inline-block; 
  cursor: pointer; 
  text-align: center; 
  overflow: hidden; 
  width: 110px;
  height: 110px;
  margin: 5px;
  padding: 5px; 
  font-size: 18px;
}

.cardTitle{
  padding:2px 5px 5px 5px;
}

.dayCardTitle{
  padding:2px 5px 0 5px;
}

.cardContent{
  height:45px;
  padding:10px 0 0 0;
}

.entertainmentText{
  font-size: 14px;
}

.cardIcon{
  font-size: 40px !important;
  height: 40px;
  width: 40px;
  color: black;
}

.fill-space {
  /* This fills the remaining space, by using flexbox.
  Every toolbar row uses a flexbox row layout. */
  flex: 1 1 auto;
}

.cardHeadline{
  font-size: 18px;
  line-height: 18px;
}

.dayCardContent{
  font-size: 16px;
}

.md-headline{
  font-weight: bold;
}

.dayCardHeadline{
  font-size: 16px;
}

.newTabButton{
  background-color: lightgrey;
}

.dialog-picture {
  max-height: 95%;
  max-width: 95%;
}

.dialog-picture img {
  display: block;
  max-width: 100%;
  height: auto; 
}

/* Utils */

.content-wrapper {
  position: relative;
}

/* Typography support coming in 0.8.0 */

md-toolbar h1 {
  font-size: 1.250em;
  font-weight: 400;
}

.avatar {
  position: relative;
  width: 128px;
  height: 128px;
  border: 1px solid #ddd;
  border-radius: 50%;
  display: inline-block;
  overflow: hidden;
  margin: 0px;
  vertical-align: middle;
  zoom:0.70;
  transform: translateZ(0);
  -webkit-transform: scale(0.70);
  -moz-transform:scale(0.70);
}


md-bottom-sheet  md-icon {
  margin-right:20px;
}

span.name {
  font-weight: bold;
  font-size:1.1em;
  padding-left:5px;
}

.fullWidthAlignRight{
  width: 100%;
  text-align: right;
}

.floatRight {
  float: right;
}

.myCard{
  /* background-color:lightgray; */
  
}

.bottomSheetText{
  padding-top: 10px;
}

@media (max-width: 456px) {
  md-sidenav {
    width: calc(100% - 100px);
    min-width: calc(100% - 100px);
    max-width: calc(100% - 100px);
    } }



/*Fonts*/
/* roboto-300 - latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  src: url('../assets/fonts/roboto-v18-latin-300.eot'); /* IE9 Compat Modes */
  src: local('Roboto Light'), local('Roboto-Light'),
       url('../assets/fonts/roboto-v18-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../assets/fonts/roboto-v18-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
       url('../assets/fonts/roboto-v18-latin-300.woff') format('woff'), /* Modern Browsers */
       url('../assets/fonts/roboto-v18-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../assets/fonts/roboto-v18-latin-300.svg#Roboto') format('svg'); /* Legacy iOS */
}

/* roboto-300italic - latin */
@font-face {
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 300;
  src: url('../assets/fonts/roboto-v18-latin-300italic.eot'); /* IE9 Compat Modes */
  src: local('Roboto Light Italic'), local('Roboto-LightItalic'),
       url('../assets/fonts/roboto-v18-latin-300italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../assets/fonts/roboto-v18-latin-300italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('../assets/fonts/roboto-v18-latin-300italic.woff') format('woff'), /* Modern Browsers */
       url('../assets/fonts/roboto-v18-latin-300italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../assets/fonts/roboto-v18-latin-300italic.svg#Roboto') format('svg'); /* Legacy iOS */
}

/* roboto-regular - latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: url('../assets/fonts/roboto-v18-latin-regular.eot'); /* IE9 Compat Modes */
  src: local('Roboto'), local('Roboto-Regular'),
       url('../assets/fonts/roboto-v18-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../assets/fonts/roboto-v18-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../assets/fonts/roboto-v18-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../assets/fonts/roboto-v18-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../assets/fonts/roboto-v18-latin-regular.svg#Roboto') format('svg'); /* Legacy iOS */
}

/* roboto-500 - latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  src: url('../assets/fonts/roboto-v18-latin-500.eot'); /* IE9 Compat Modes */
  src: local('Roboto Medium'), local('Roboto-Medium'),
       url('../assets/fonts/roboto-v18-latin-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../assets/fonts/roboto-v18-latin-500.woff2') format('woff2'), /* Super Modern Browsers */
       url('../assets/fonts/roboto-v18-latin-500.woff') format('woff'), /* Modern Browsers */
       url('../assets/fonts/roboto-v18-latin-500.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../assets/fonts/roboto-v18-latin-500.svg#Roboto') format('svg'); /* Legacy iOS */
}

/* roboto-700 - latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  src: url('../assets/fonts/roboto-v18-latin-700.eot'); /* IE9 Compat Modes */
  src: local('Roboto Bold'), local('Roboto-Bold'),
       url('../assets/fonts/roboto-v18-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../assets/fonts/roboto-v18-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
       url('../assets/fonts/roboto-v18-latin-700.woff') format('woff'), /* Modern Browsers */
       url('../assets/fonts/roboto-v18-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../assets/fonts/roboto-v18-latin-700.svg#Roboto') format('svg'); /* Legacy iOS */
}


/*Material Icons*/


@font-face {
  font-family: 'Material Icons';
  font-style: normal;
  font-weight: 400;
  src: url('../../node_modules/material-design-icons/iconfont/MaterialIcons-Regular.eot'); /* For IE6-8 */
  src: local('Material Icons'),
       local('MaterialIcons-Regular'),
       url('../../node_modules/material-design-icons/iconfont/MaterialIcons-Regular.woff2') format('woff2'),
       url('../..//node_modules/material-design-icons/iconfont/MaterialIcons-Regular.woff') format('woff'),
       url('../..//node_modules/material-design-icons/iconfont/MaterialIcons-Regular.ttf') format('truetype');
}

.material-icons {
 font-family: 'Material Icons';
 font-weight: normal;
 font-style: normal;
 font-size: 24px;  /* Preferred icon size */
 display: inline-block;
 line-height: 1;
 text-transform: none;
 letter-spacing: normal;
 word-wrap: normal;
 white-space: nowrap;
 direction: ltr;

 /* Support for all WebKit browsers. */
 -webkit-font-smoothing: antialiased;
 /* Support for Safari and Chrome. */
 text-rendering: optimizeLegibility;

 /* Support for Firefox. */
 -moz-osx-font-smoothing: grayscale;

 /* Support for IE. */
 font-feature-settings: 'liga';
}

/* Footer */

.footer {
	position: fixed;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 90px;
	background-color: #000000;
}