Difference between revisions of "Team:Bilkent-UNAMBG"

Line 1: Line 1:
−
{{Bilkent-UNAMBG}}
+
{{Bilkent-UNAMBG/Style}}
−
<html>
+
  
−
<script>
+
<html lang="en">
  
−
// This is the jquery part of your template. 
+
<head>
−
// Try not modify any of this code too much since it makes your menu work.
+
  
−
$(document).ready(function() {
+
    <style>
  
−
$("#HQ_page").attr('id','');
 
  
−
// call the functions that control the menu
+
        /***************************************************** DEFAULT WIKI SETTINGS  ****************************************************/
−
menu_functionality();
+
−
hide_show_menu();
+
  
 +
        /* Clear the default wiki settings */
  
 +
        #home_logo, #sideMenu {
 +
            display: none;
 +
        }
  
−
//this function controls the expand and collapse buttons of the menu and changes the +/- symbols
+
        #sideMenu, #top_title, .patrollink {
−
function menu_functionality() {
+
            display: none;
 +
        }
  
−
//when clicking on a "menu_button", it will change the "+/-" accordingly and it will show/hide the corresponding submenu
+
        #content {
−
$(".menu_button").click(function(){
+
            width: 100%;
 +
            padding: 0px;
 +
            margin-top: 0px;
 +
            margin-left: 0px;
 +
        }
  
−
// add or remove the class "open" , this class holds the "-"
+
        body {
−
$(this).children().toggleClass("open");
+
            background-color: #FAFAFA;
−
// show or hide the submenu
+
        !important;
−
$(this).next('.submenu_wrapper').fadeToggle(400);
+
        }
−
});
+
  
−
// when the screen size is smaller than 800px, the display_menu_control button appears and will show/hide the whole menu
+
        #bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 {
−
$("#display_menu_control").click(function(){
+
            margin-bottom: 0px;
−
$('#menu_content').fadeToggle(400);
+
        }
−
});
+
  
−
// call the current page highlight function
+
    </style>
−
highlight_current_page();
+
−
}
+
  
 +
    <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
 +
    <script type="text/javascript" src="https://2017.igem.org/Template:Peking/mdl/materialminjs?
 +
action=raw&ctype=text/javascript"></script>
 +
    <link href="https://2017.igem.org/Template:Peking/mdl/component?action=raw&ctype=text/css" rel="stylesheet">
 +
    <script type="text/javascript"
 +
            src="https://2017.igem.org/Template:Peking/mdl/componentjs?action=raw&ctype=text/javascript"></script>
  
−
// call the highlight current page function to show it on the menu with a different background color
+
    <link rel="stylesheet" type="text/css"
−
function highlight_current_page() {
+
          href="https://2017.igem.org/Template:Peking/mdl/MDLnew?action=raw&ctype=text/css">
  
−
// select a page from the menu based on the id assigned to it and the current page name and add the class "current page" to make it change background color
+
    <link rel="stylesheet" type="text/css"
−
$("#"+  wgPageName.substring(wgPageName.lastIndexOf("/")+1, wgPageName.length ) + "_page").addClass("current_page");
+
          href="https://2017.igem.org/Template:Peking/mdl/main?action=raw&ctype=text/css">
−
 
+
    <!-- Fonts -->
−
// now that the current_page class has been added to a menu item, make the submenu fade in
+
    <link rel="stylesheet" type="text/css"
−
$(".current_page").parents(".submenu_wrapper").fadeIn(400);
+
          href="https://2017.igem.org/Template:Peking/mdl/fonts?action=raw&ctype=text/css">
−
// change the +/- symbol of the corresponding menu button
+
    <link rel="stylesheet" type="text/css"
−
$(".current_page").parents(".submenu_wrapper").prev().children().toggleClass("open");
+
          href="https://2017.igem.org/Template:Peking/mdl/icon?action=raw&ctype=text/css">
−
+
−
}
+
−
 
+
−
 
+
−
 
+
−
// allow button on the black menu bar to show/hide the side menu
+
−
function hide_show_menu() {
+
−
+
−
// in case you preview mode is selected, the menu is hidden for better visibility
+
−
if (window.location.href.indexOf("submit") >= 0) {
+
−
$(".igem_2017_menu_wrapper").hide();
+
−
}
+
−
 
+
−
// if the black menu bar has been loaded
+
−
  if (document.getElementById('bars_item')) {
+
−
 
+
−
// when the "bars_item" has been clicked
+
−
$("#bars_item").click(function() {
+
−
$("#sideMenu").hide();
+
−
 
+
−
// show/hide the menu wrapper
+
−
$(".igem_2017_menu_wrapper").fadeToggle("100");
+
−
});
+
−
  }
+
−
 
+
−
// because the black menu bars loads at a different time than the rest of the page, this function is set on a time out so it can run again in case it has not been loaded yet
+
−
else {
+
−
    setTimeout(hide_show_menu, 15);
+
−
}
+
−
}
+
−
 
+
−
 
+
−
});
+
−
 
+
−
 
+
−
</script>
+
−
 
+
−
 
+
−
 
+
−
 
+
−
 
+
−
<style>
+
−
 
+
−
 
+
−
 
+
−
/***************************************************** DEFAULT WIKI SETTINGS  ****************************************************/
+
−
+
−
/* Clear the default wiki settings */
+
−
+
−
#home_logo, #sideMenu { display:none; }
+
−
#sideMenu, #top_title, .patrollink  {display:none;}
+
−
#content { width:100%; padding:0px;  margin-top:-7px; margin-left:0px;}
+
−
body {background-color:white; }
+
−
#bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin-bottom: 0px; }
+
−
 
+
−
+
−
+
−
+
−
/**************************************************************** MENU ***************************************************************/
+
−
/* Wrapper for the menu */
+
−
.igem_2017_menu_wrapper {
+
−
width: 15%;
+
−
height:100vh;
+
−
position:fixed;
+
−
right:0%;
+
−
padding:0px;
+
−
float:right;
+
−
border-left: 1px solid #d3d3d3;
+
−
background-color:#dddddd;
+
−
text-align:left;
+
−
font-family:Tahoma, Geneva, sans-serif;
+
−
overflow-y: auto;
+
−
overflow-x: hidden;
+
−
}
+
−
 
+
−
/* this hides the scrollbar to keep view consistency */
+
−
.igem_2017_menu_wrappe::-webkit-scrollbar {
+
−
display: none;
+
−
}
+
−
+
−
+
−
/* styling for links in the menu, removes the line under text */
+
−
.igem_2017_menu_wrapper a { 
+
−
text-decoration: none;
+
−
}
+
−
 
+
−
 
+
−
/* styling for the images in the menu */
+
−
.igem_2017_menu_wrapper img {
+
−
width: 100%;
+
−
}
+
−
 
+
−
/* styling for the menu buttons */
+
−
.igem_2017_menu_wrapper .menu_button {
+
−
width: 100%;
+
−
padding: 10px 0px 10px 15px;
+
−
float:left;
+
−
border-bottom: 1px solid #d3d3d3;
+
−
font-size: 12px;
+
−
font-weight: bold;
+
−
color: #5e5f5f;
+
−
cursor: pointer;
+
−
}
+
−
 
+
−
 
+
−
.igem_2017_menu_wrapper .menu_bottom_padding {
+
−
width: 100%;
+
−
height: 30px;
+
−
float:left;
+
−
}
+
−
 
+
−
.menu_button.direct_to_page {
+
−
padding-left: 36px;
+
−
}
+
−
 
+
−
 
+
−
.igem_2017_menu_wrapper .menu_button .expand_collapse_icon {
+
−
width:10%;
+
−
float:left;
+
−
}
+
−
 
+
−
.igem_2017_menu_wrapper .menu_button .expand_collapse_icon::before {
+
−
content: "+"; 
+
−
}
+
−
+
−
.open::before {
+
−
content: "-" !important; 
+
−
}
+
−
+
−
+
−
+
−
/* styling for the menu buttons on hover */
+
−
.igem_2017_menu_wrapper .menu_button:hover, .igem_2017_menu_wrapper .submenu_button:hover ,  .submenu_button.current_page:hover {
+
−
background-color: #3399ff;
+
−
text-decoration: none;
+
−
color:#ffffff;
+
−
}
+
−
 
+
−
/* styling for the menu button when it is the current page */
+
−
.current_page {
+
−
background-color:#7fc1f7  !important;
+
−
color:#5e5f5f !important;
+
−
}
+
−
 
+
−
 
+
−
/* styling for the submenu buttons */
+
−
.igem_2017_menu_wrapper .submenu_button {
+
−
width: 100%;
+
−
padding: 10px 0px 10px 34px;
+
−
float:left;
+
−
background-color:#f2f2f2;
+
−
border-bottom: 1px solid #d3d3d3;
+
−
font-size: 12px;
+
−
color: #5e5f5f;
+
−
cursor: pointer;
+
−
}
+
−
 
+
−
/* wrapper for the submenu items, they are hidden by default*/
+
−
.igem_2017_menu_wrapper .submenu_wrapper {
+
−
display:none;
+
−
}
+
−
 
+
−
/* when the page size is bigger than 800px, this show/hide control is hidden by default */
+
−
.igem_2017_menu_wrapper #display_menu_control {
+
−
display:none;
+
−
text-align:center;
+
−
}
+
−
+
−
 
+
−
/***************************************************** CONTENT OF THE PAGE ****************************************************/
+
−
 
+
−
/* Wrapper for the content */
+
−
.igem_2017_content_wrapper {
+
−
width: 81%;
+
−
margin: 2%;
+
−
display:block;
+
−
float:left;
+
−
background-color:white;
+
−
font-family:Tahoma, Geneva, sans-serif;
+
−
}
+
−
 
+
−
 
+
−
/********************************* HTML STYLING  *********************************/
+
−
 
+
−
/* styling for the titles h1 h2 */
+
−
.igem_2017_content_wrapper h1, .igem_2017_content_wrapper h2 {
+
−
padding:5px 15px;
+
−
border-bottom: 0px;
+
−
color: #3399ff;
+
−
}
+
−
 
+
−
 
+
−
/* styling for the titles  h3 h4 h5 h6*/
+
−
.igem_2017_content_wrapper h3, .igem_2017_content_wrapper h4, .igem_2017_content_wrapper h5, .igem_2017_content_wrapper h6 {
+
−
padding:5px 15px;
+
−
border-bottom:0px;
+
−
color: #000000; 
+
−
}
+
−
 
+
−
 
+
−
/* font and text */
+
−
.igem_2017_content_wrapper p {
+
−
padding: 0px 15px;
+
−
font-size: 13px;
+
−
}
+
−
 
+
−
/* Links */
+
−
.igem_2017_content_wrapper a {
+
−
font-weight: bold;
+
−
text-decoration: underline;
+
−
text-decoration-color: #3399ff;
+
−
color:  #3399ff;
+
−
-webkit-transition: all 0.4s ease;
+
−
-moz-transition: all 0.4s ease;
+
−
-ms-transition: all 0.4s ease;
+
−
-o-transition: all 0.4s ease;
+
−
transition: all 0.4s ease;
+
−
}
+
−
 
+
−
/* hover for the links */
+
−
.igem_2017_content_wrapper a:hover {
+
−
text-decoration:none;
+
−
color:#000000;
+
−
}
+
−
 
+
−
/* non numbered lists */
+
−
.igem_2017_content_wrapper ul {
+
−
padding:0px 20px;
+
−
font-size: 13px;
+
−
font-family:Tahoma, Geneva, sans-serif;
+
−
}
+
−
 
+
−
/* numbered lists */
+
−
.igem_2017_content_wrapper ol {
+
−
padding:0px;
+
−
font-size: 13px;
+
−
font-family:Tahoma, Geneva, sans-serif;
+
−
}
+
−
 
+
−
/* Table */
+
−
.igem_2017_content_wrapper table {
+
−
width: 97%;
+
−
margin:15px 10px;
+
−
border: 1px solid #d3d3d3;
+
−
border-collapse: collapse;
+
−
}
+
−
 
+
−
/* table cells */
+
−
.igem_2017_content_wrapper  td {
+
−
padding: 10px;
+
−
vertical-align: text-top;
+
−
border: 1px solid #d3d3d3;
+
−
border-collapse: collapse;
+
−
}
+
−
 
+
−
/* table headers */
+
−
.igem_2017_content_wrapper th {
+
−
padding: 10px;
+
−
vertical-align: text-top;
+
−
border: 1px solid #d3d3d3;
+
−
border-collapse: collapse;
+
−
background-color:#f2f2f2;
+
−
}
+
−
 
+
−
 
+
−
/**********************************LAYOUT CLASSES **********************************/
+
−
 
+
−
/* general class for column divs */
+
−
.igem_2017_content_wrapper .column  {
+
−
padding: 10px 0px;
+
−
float:left;
+
−
}
+
−
 
+
−
/* class for a full width column */
+
−
.column .full_size {
+
−
width:100%;
+
−
}
+
−
 
+
−
/* styling for images in a full width column*/
+
−
.column.full_size img {
+
−
width:97%;
+
−
padding: 10px 15px;
+
−
}
+
−
 
+
−
/* class for a half width column */
+
−
.column.half_size {
+
−
width: 50%;
+
−
}
+
−
/* styling for images in a half width column*/
+
−
.column.half_size img {
+
−
width: 94.5%;
+
−
padding: 10px 15px;
+
−
}
+
−
 
+
−
 
+
−
 
+
−
 
+
−
/********************************* SUPPORT CLASSES ********************************/
+
−
 
+
−
/* class that clears content below*/
+
−
.igem_2017_content_wrapper .clear {
+
−
clear:both;
+
−
}
+
−
+
−
+
−
/* adds extra spacing when clearing content */
+
−
.igem_2017_content_wrapper  .clear.extra_space {
+
−
height: 30px;
+
−
}
+
−
 
+
−
 
+
−
/* highlight class, makes content slightly smaller */
+
−
.igem_2017_content_wrapper .highlight {
+
−
margin: 0px 15px;
+
−
padding: 15px 0px;
+
−
}
+
−
 
+
−
 
+
−
/* highlight class, adds a gray background */
+
−
.igem_2017_content_wrapper .highlight.gray {
+
−
background-color: #f2f2f2;
+
−
}
+
−
 
+
−
/* highlight with decoration blue line on top */
+
−
.igem_2017_content_wrapper .highlight.blue_top {
+
−
    border-top: 4px solid #3399ff;
+
−
}
+
−
 
+
−
/* highlight with a full blue border decoration */
+
−
.igem_2017_content_wrapper .highlight.blue_border {
+
−
    border: 4px solid  #3399ff;
+
−
}
+
−
 
+
−
 
+
−
/* button class */
+
−
.igem_2017_content_wrapper .button{
+
−
max-width: 35%;
+
−
margin: 30px auto;
+
−
padding: 12px 10px;
+
−
    background-color: #3399ff;
+
−
    text-align: center;
+
−
  color: #ffffff;
+
−
-webkit-transition: all 0.4s ease;
+
−
-moz-transition: all 0.4s ease;
+
−
-ms-transition: all 0.4s ease;
+
−
-o-transition: all 0.4s ease; transition: all 0.4s ease; 
+
−
}
+
−
 
+
−
/* styling for button on hover */
+
−
.igem_2017_content_wrapper .button:hover{
+
−
background-color: #3399ff;
+
−
    color: #000000;
+
−
}
+
−
 
+
−
 
+
−
 
+
−
 
+
−
/***************************************************** RESPONSIVE STYLING ****************************************************/
+
−
 
+
−
/* IF THE SCREEN IS LESS THAN 1200PX */
+
−
@media only screen and (max-width: 1200px) {
+
−
 
+
−
#content {width:100%; }
+
−
.igem_2017_menu_wrapper {width:15%; right:0;}
+
−
.highlight {padding:10px 0px;}
+
−
.igem_2017_menu_wrapper #display_menu_control { display:none; }
+
−
#menu_content { display:block;}
+
−
.menu_button.direct_to_page {padding-left: 17px;}
+
−
+
−
}
+
−
 
+
−
/* IF THE SCREEN IS LESS THAN 800PX */
+
−
@media only screen and (max-width: 800px) {
+
−
 
+
−
.igem_2017_menu_wrapper { width:100%; height: 15%; position:relative; left:0%;}
+
−
.igem_2017_content_wrapper {width:100%; margin-left:0px;}
+
−
.column.half_size  {width:100%; }
+
−
.column.full_size img, .column.half_size img {  width: 100%; padding: 10px 0px;}
+
−
.highlight {padding:15px 5px;}
+
−
.igem_2017_menu_wrapper #display_menu_control { display:block; }
+
−
#menu_content { display:none;}
+
−
.igem_2017_menu_wrapper .menu_button .expand_collapse_icon { width: 5%; }
+
−
.menu_bottom_padding {display:none;}
+
−
.menu_button.direct_to_page { padding-left: 36px; }
+
−
}
+
−
 
+
−
 
+
−
+
−
+
−
/* special class that the system uses to make sure the team wants a page to be evaluated */
+
−
.judges-will-not-evaluate {
+
−
    width: 96.6%;
+
−
  margin: 5px 15px;
+
−
  display: block;
+
−
border: 4px solid #3399ff;
+
−
    font-weight: bold;
+
−
}
+
−
+
−
</style>
+
−
 
+
−
 
+
−
<!--- THIS IS WHERE THE HTML BEGINS --->
+
−
 
+
−
 
+
−
 
+
−
<head>
+
−
 
+
−
<!-- This tells the browser that your page is responsive -->
+
−
<meta name="viewport" content="width=device-width, initial-scale=1">  
+
  
 
</head>
 
</head>
  
 +
<body>
  
  
−
<div class="igem_2017_menu_wrapper" >
+
<!-- Always shows a header, even in smaller screens. -->
 +
<div class="mdl-layout mdl-js-layout mdl-layout--fixed-header">
 +
    <header class="mdl-layout__header" style="position:fixed; margin-top: -9px; !important;">
 +
        <div class="mdl-layout__header-row">
 +
            <!-- Title -->
 +
            <a href="https://2018.igem.org/Team:Bilkent-UNAMBG"><img
 +
                    src="https://static.igem.org/mediawiki/2018/d/de/T--Bilkent-UNAMBG--logo.png" height="140"></a>
  
 +
            <a class="mdl-navigation__link" href="https://2017.igem.org/Team:Bilkent-UNAMBG"
 +
              style="color: #000000; font-size: x-large"></a>
 +
            <!-- Add spacer, to align navigation to the right -->
 +
            <div class="mdl-layout-spacer"></div>
 +
            <!-- Navigation. We hide it in small screens. -->
 +
            <nav class="mdl-navigation mdl-layout--large-screen-only">
 +
                <style>
 +
                    a:link {
 +
                        text-decoration: none;
 +
                    }
  
 +
                    a:visited {
 +
                        text-decoration: none;
 +
                    }
  
−
<a href="https://2017.igem.org/Team:Example2">
+
                    a:active {
−
<img src="https://static.igem.org/mediawiki/2018/8/8b/HQ_page_logo.jpg">
+
                        text-decoration: none;
−
</a>
+
                    }
  
 +
                    a:hover {
 +
                    }
 +
                </style>
 +
                <a class="mdl-navigation__link" href="https://2018.igem.org/Team:Bilkent-UNAMBG" style="color: #000; font-weight: 500;">Home</a>
 +
                <a class="mdl-navigation__link" href="https://2018.igem.org/Team:Bilkent-UNAMBG/Team">Team</a>
 +
                <a class="mdl-navigation__link" href="https://2018.igem.org/Team:Bilkent-UNAMBG/Project#Introduction">Project</a>
 +
                  <a class="mdl-navigation__link" href="https://2018.igem.org/Team:Bilkent-UNAMBG/Parts#Overview">Parts</a>
 +
                <a class="mdl-navigation__link" href="https://2018.igem.org/Team:Bilkent-UNAMBG/Safety#Overview">Safety</a>
 +
                <a class="mdl-navigation__link" href="https://2018.igem.org/Team:Bilkent-UNAMBG/Results">Results</a>
 +
                <a class="mdl-navigation__link" href="https://2018.igem.org/Team:Bilkent-UNAMBG/HP">Human Practices</a>
 +
             
 +
               
 +
            </nav>
 +
        </div>
 +
    </header>
  
−
<!-- this div is hidden by default and will only be displayed if the screen size is too small -->
+
</div>
−
<div class="menu_button" id="display_menu_control">
+
−
MENU 
+
−
</div>  
+
  
−
<div id="menu_content">
+
<style>
−
+
  
 +
        a:link {
 +
            text-decoration: none;
 +
        }
  
 +
        a:visited {
 +
            text-decoration: none;
 +
        }
  
−
<a href="https://2017.igem.org/Team:Example2">
+
        a:active {
−
<div class="menu_button direct_to_page">
+
            text-decoration: none;
−
HOME
+
        }
−
</div>
+
−
</a>
+
  
 +
        a:hover {
 +
            text-decoration: none;
 +
        }
  
 +
        .demo-card-wide.mdl-card {
 +
            margin-left: 50px;
 +
            margin-right: 50px;
 +
            margin-top: 120px;
 +
            margin-bottom: 100px;
 +
            width: auto;
 +
            height: 500px;
 +
        }
  
−
<div class="menu_button">
+
        .demo-card-wide > .mdl-card__title {
−
<div class="expand_collapse_icon">  </div> TEAM
+
            padding-left: 50px;
−
</div>
+
            color: #fff;
 +
            height: 300px;
 +
        }
  
−
<div class="submenu_wrapper" id="team_submenu">
+
        .demo-card-wide > .mdl-card__menu {
−
+
            color: #fff;
−
<a href="https://2017.igem.org/Team:Example2/Team">
+
        }
−
<div class="submenu_button" id="Team_page">
+
−
Team
+
−
</div>
+
−
</a>
+
  
−
<a href="https://2017.igem.org/Team:Example2/Collaborations">
+
    </style>
−
<div class="submenu_button"  id="Collaborations_page">
+
−
Collaborations
+
−
</div>
+
−
</a>
+
−
+
−
+
−
</div>
+
  
 +
<div class="demo-card-wide mdl-card mdl-shadow--2dp" style="margin-bottom: 30px">
 +
        <div class="mdl-card__title"
 +
            style="background: url('https://static.igem.org/mediawiki/2018/1/17/T--Bilkent-UNAMBG--banner.jpg') center / cover; height : 100%; width: 100%" >
  
−
+
        </div>
−
+
    </div>
  
−
<div class="menu_button">
 
−
<div class="expand_collapse_icon">  </div> PROJECT
 
−
</div>
 
  
−
<!-- project submenu -->
 
−
<div class="submenu_wrapper">
 
−
 
−
<a href="https://2017.igem.org/Team:Example2/Description">
 
−
<div class="submenu_button"  id="Description_page">
 
−
Description
 
−
</div>
 
−
</a>
 
  
−
<a href="https://2017.igem.org/Team:Example2/Design">
 
−
<div class="submenu_button"  id="Design_page">
 
−
Design
 
−
</div>
 
−
</a>
 
  
−
<a href="https://2017.igem.org/Team:Example2/Experiments">
 
−
<div class="submenu_button"  id="Experiments_page">
 
−
Experiments
 
−
</div>
 
−
</a>
 
  
  
−
<a href="https://2017.igem.org/Team:Example2/Notebook">
 
−
<div class="submenu_button"  id="Notebook_page">
 
−
Notebook
 
−
</div>
 
−
</a>
 
  
−
<a href="https://2017.igem.org/Team:Example2/InterLab">
 
−
<div class="submenu_button"  id="InterLab_page">
 
−
InterLab
 
−
</div>
 
−
</a>
 
  
−
<a href="https://2017.igem.org/Team:Example2/Contribution">
 
−
<div class="submenu_button"  id="Contribution_page">
 
−
Contribution
 
−
</div>
 
−
</a>
 
  
−
<a href="https://2017.igem.org/Team:Example2/Model">
+
    <section class="docs-text-styling download mdl-color--grey-800" style="height: 1px"></section>
−
<div class="submenu_button" id="Model_page">
+
    <footer class="mdl-mega-footer" style="height: 260px; margin-bottom: 0px;">
−
Model
+
        <div class="mdl-mega-footer__middle-section">
−
</div>
+
−
</a>
+
  
−
<a href="https://2017.igem.org/Team:Example2/Results">
+
            <div class="mdl-mega-footer__drop-down-section">
−
<div class="submenu_button" id="Results_page">
+
                <input class="mdl-mega-footer__heading-checkbox" type="checkbox" checked>
−
Results
+
                <h1 class="mdl-mega-footer__heading">Acknowledgement</h1>
−
</div>
+
                <ul class="mdl-mega-footer__link-list" style="margin-left: 0px;>
−
</a>
+
                    <li><a href="http://w3.bilkent.edu.tr/www/"> </li>
 +
                <li><a href="http://w3.bilkent.edu.tr/www/"><img
 +
                        src="https://static.igem.org/mediawiki/2018/6/65/T--Bilkent-UNAMBG--bilkentlogo.png" height="50px"/> Bilkent University</a>
 +
                </li>
 +
                <br/>
 +
                <li><a href="http://unam.bilkent.edu.tr"> <img
 +
                        src="https://static.igem.org/mediawiki/2018/2/2f/T--Bilkent-UNAMBG--unamlogo.png" height="50px"/> UNAM </a>
 +
                </li>
  
 +
                </ul>
 +
            </div>
  
−
<a href="https://2017.igem.org/Team:Example2/Demonstrate">
+
            <div class="mdl-mega-footer__drop-down-section">
−
<div class="submenu_button" id="Demonstrate_page">
+
                <input class="mdl-mega-footer__heading-checkbox" type="checkbox" checked>
−
Demonstrate
+
                <h1 class="mdl-mega-footer__heading">Connection</h1>
−
</div>
+
                <ul class="mdl-mega-footer__link-list" style="margin-left: 0px;>
−
</a>
+
                    <li><a href=" https:
 +
                //www.facebook.com/bilkentunambg"></a></li>
 +
                <li><a href="https://www.facebook.com/bilkentunambg">Facebook</a></li>
 +
                <li><a href="https://twitter.com/bilkentunambg">Twitter</a></li>
 +
                <li><a href="https://instagram.com/bilkentunambg">Instagram</a></li>
 +
                </ul>
 +
            </div>
  
−
<a href="https://2017.igem.org/Team:Example2/Improve">
+
            <div class="mdl-mega-footer__drop-down-section">
−
<div class="submenu_button" id="Improve_page">
+
                <input class="mdl-mega-footer__heading-checkbox" type="checkbox" checked>
−
Improve
+
                <h1 class="mdl-mega-footer__heading">Contact</h1>
−
</div>
+
                <ul class="mdl-mega-footer__link-list" style="margin-left: 0px;>
−
</a>
+
                <li><a href="mailto:unambgigem@gmail.com">unambgigem@gmail.com</a></li>
 +
                </ul>
 +
            </div>
  
−
<a href="https://2017.igem.org/Team:Example2/Attributions">
+
            <div class="mdl-mega-footer__drop-down-section">
−
<div class="submenu_button" id="Attributions_page">
+
                <input class="mdl-mega-footer__heading-checkbox" type="checkbox" checked>
−
Attributions
+
                <h2 style="color: white; "><strong>Bilkent-UNAMBG iGEM</strong> 2018</h2>
−
</div>
+
                <ul class="mdl-mega-footer__link-list" style="margin-left: 0px;">
−
</a>
+
                    <li style="color: white; line-height: 1.88em;">Bilkent University<br> UNAM, Bilkent, Ankara, Turkey <br>06800
 +
                    </li>
 +
                </ul>
 +
            </div>
  
−
</div>
+
        </div>
  
−
 
−
 
−
 
−
 
  
−
<div class="menu_button">
+
    </footer>
−
<div class="expand_collapse_icon">  </div> PARTS
+
−
</div>
+
−
+
−
<!-- parts submenu -->
+
−
<div class="submenu_wrapper">
+
−
+
−
<a href="https://2017.igem.org/Team:Example2/Parts">
+
−
<div class="submenu_button"  id="Parts_page">
+
−
Parts
+
−
</div>
+
−
</a>
+
−
 
+
−
<a href="https://2017.igem.org/Team:Example2/Basic_Part">
+
−
<div class="submenu_button"  id="Basic_Part_page">
+
−
Basic Parts
+
−
</div>
+
−
</a>
+
−
 
+
−
<a href="https://2017.igem.org/Team:Example2/Composite_Part">
+
−
<div class="submenu_button"  id="Composite_Part_page">
+
−
Composite Parts
+
−
</div>
+
−
</a>
+
−
 
+
−
<a href="https://2017.igem.org/Team:Example2/Part_Collection">
+
−
<div class="submenu_button"  id="Part_Collection_page">
+
−
Part Collection
+
−
</div>
+
−
</a>
+
−
</div>
+
−
 
+
−
+
−
+
−
+
−
+
−
 
+
−
<a href="https://2017.igem.org/Team:Example2/Safety">
+
−
<div class="menu_button direct_to_page">
+
−
SAFETY
+
−
</div>
+
−
</a>
+
−
 
+
−
 
+
−
 
+
−
 
+
−
 
+
−
 
+
−
 
+
−
<div class="menu_button" >
+
−
<div class="expand_collapse_icon">  </div> HUMAN PRACTICES
+
−
</div>
+
−
 
+
−
<!-- human practices submenu -->
+
−
<div class="submenu_wrapper">
+
−
 
+
−
<a href="https://2017.igem.org/Team:Example2/HP/Silver">
+
−
<div class="submenu_button"  id="Silver_page">
+
−
Silver HP
+
−
</div>
+
−
</a>
+
−
 
+
−
<a href="https://2017.igem.org/Team:Example2/HP/Gold_Integrated">
+
−
<div class="submenu_button" id="Gold_Integrated_page">
+
−
Integrated and Gold
+
−
</div>
+
−
</a>
+
−
 
+
−
 
+
−
<a href="https://2017.igem.org/Team:Example2/Engagement">
+
−
<div class="submenu_button"  id="Engagement_page">
+
−
Public Engagement
+
−
</div>
+
−
</a>
+
−
 
+
−
</div>
+
−
 
+
−
 
+
−
<div class="menu_button">
+
−
<div class="expand_collapse_icon">  </div> AWARDS
+
−
</div>
+
−
 
+
−
<!-- awards submenu -->
+
−
<div class="submenu_wrapper">
+
−
 
+
−
<a href="https://2017.igem.org/Team:Example2/Applied_Design">
+
−
<div class="submenu_button"  id="Applied_Design_page">
+
−
Applied Design
+
−
</div>
+
−
</a>
+
−
 
+
−
<a href="https://2017.igem.org/Team:Example2/Entrepreneurship">
+
−
<div class="submenu_button"  id="Entrepreneurship_page">
+
−
Entrepreneurship
+
−
</div>
+
−
</a>
+
−
 
+
−
<a href="https://2017.igem.org/Team:Example2/Hardware">
+
−
<div class="submenu_button"  id="Hardware_page">
+
−
Hardware
+
−
</div>
+
−
</a>
+
−
 
+
−
<a href="https://2017.igem.org/Team:Example2/Measurement">
+
−
<div class="submenu_button"  id="Measurement_page">
+
−
Measurement
+
−
</div>
+
−
</a>
+
−
 
+
−
<a href="https://2017.igem.org/Team:Example2/Model">
+
−
<div class="submenu_button"  id="Model_page">
+
−
Model
+
−
</div>
+
−
</a>
+
−
 
+
−
<a href="https://2017.igem.org/Team:Example2/Plant">
+
−
<div class="submenu_button"  id="Plant_page">
+
−
Plant
+
−
</div>
+
−
</a>
+
−
 
+
−
 
+
−
<a href="https://2017.igem.org/Team:Example2/Software">
+
−
<div class="submenu_button"  id="Software_page">
+
−
Software
+
−
</div>
+
−
</a>
+
−
 
+
−
</div>
+
−
 
+
−
<a href="https://igem.org/2017_Judging_Form?team=Example2">
+
−
<div class="menu_button direct_to_page">
+
−
JUDGING FORM
+
−
</div>
+
−
</a>
+
−
 
+
−
 
+
−
+
−
<div class="menu_bottom_padding" >
+
−
</div>
+
−
+
−
</div>
+
−
 
+
−
 
+
−
 
+
−
 
+
−
</div>
+
  
 +
</main>
  
  
−
<!-- start of content -->
+
</body>
−
<div class="igem_2017_content_wrapper">
+
</html>
−
<h1>Bilkent-UNAMBG</h1>
+
−
<p style="margin: 0cm 0cm 0.0001pt; line-height: 22px; font-size: 11pt; font-family: Calibri, sans-serif; caret-color: #000000; color: #000000; font-variant-caps: normal; letter-spacing: normal; orphans: auto; text-indent: 0px; text-transform: none; white-space: normal; widows: auto; word-spacing: 0px; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px; text-decoration: none; text-align: center; background-color: white; background-position: initial initial; background-repeat: initial initial;"><span style="font-family: calibri, sans-serif;"><strong><span style="font-size: 14pt; line-height: 28px;">PROJECT DESCRIPTION</span></strong></span></p>
+
−
<p style="margin: 0cm 0cm 0.0001pt; line-height: 22px; font-size: 11pt; font-family: Calibri, sans-serif; caret-color: #000000; color: #000000; font-variant-caps: normal; letter-spacing: normal; orphans: auto; text-indent: 0px; text-transform: none; white-space: normal; widows: auto; word-spacing: 0px; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px; text-decoration: none; text-align: center; background-color: white; background-position: initial initial; background-repeat: initial initial;">&nbsp;</p>
+
−
<p style="margin: 0cm 0cm 0.0001pt; line-height: 22px; font-size: 11pt; font-family: Calibri, sans-serif; caret-color: #000000; color: #000000; font-variant-caps: normal; letter-spacing: normal; orphans: auto; text-indent: 0px; text-transform: none; white-space: normal; widows: auto; word-spacing: 0px; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px; text-decoration: none; text-align: center; background-color: white; background-position: initial initial; background-repeat: initial initial;"><span style="font-family: calibri, sans-serif;"><strong><span style="font-size: 14pt; line-height: 28px;">Penicillin Bioremediation</span></strong></span></p>
+
−
<p style="margin: 0cm 0cm 0.0001pt; line-height: 22px; font-size: 11pt; font-family: Calibri, sans-serif; caret-color: #000000; color: #000000; font-variant-caps: normal; letter-spacing: normal; orphans: auto; text-indent: 0px; text-transform: none; white-space: normal; widows: auto; word-spacing: 0px; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px; text-decoration: none; text-align: center; background-color: white; background-position: initial initial; background-repeat: initial initial;"><span style="font-family: calibri, sans-serif;"><strong><span style="font-size: 14pt; line-height: 28px;">Engineering Bacteria That Can Capture Penicillin in Waste Water</span></strong></span></p>
+
−
<p style="margin: 0cm 0cm 0.0001pt; line-height: 22px; font-size: 11pt; font-family: Calibri, sans-serif; caret-color: #000000; color: #000000; font-variant-caps: normal; letter-spacing: normal; orphans: auto; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: auto; word-spacing: 0px; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px; text-decoration: none; background-color: white; background-position: initial initial; background-repeat: initial initial;"><span style="font-family: calibri, sans-serif;"><strong><span style="font-size: 16pt; line-height: 32px;">&nbsp;</span></strong></span></p>
+
−
<p style="margin: 0cm 0cm 0.0001pt; line-height: 22px; font-size: 11pt; font-family: Calibri, sans-serif; caret-color: #000000; color: #000000; font-variant-caps: normal; letter-spacing: normal; orphans: auto; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: auto; word-spacing: 0px; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px; text-decoration: none; background-color: white; background-position: initial initial; background-repeat: initial initial;"><span style="font-family: calibri, sans-serif;"><strong><span style="font-size: 12pt; line-height: 24px;">Existing problem and significance of the project</span></strong></span></p>
+
−
<p style="margin: 0cm 0cm 10pt; line-height: 22px; font-size: 11pt; font-family: Calibri, sans-serif; caret-color: #000000; color: #000000; font-variant-caps: normal; letter-spacing: normal; orphans: auto; text-align: start; text-transform: none; white-space: normal; widows: auto; word-spacing: 0px; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px; text-decoration: none; text-indent: 36pt;"><span style="font-family: calibri, sans-serif;">Nowadays antibiotics have become indispensable drugs for treatment of bacterial infections. Owing to this popularity, it comes as no surprise that most city waste water is contaminated with antibiotics. This is caused by several factors including antibiotic presence in human waste due to insufficient metabolism, as well as unnecessary usage of these drugs (Malay, 2015).&nbsp; It is approximated that developing countries spend up to 35% of their budget to antibiotics (Isturiz, 2000; Saltoğlu, 2005). Moreover, it is especially in these countries where antibiotics are used incorrectly and unnecessarily (Hart, 1998).&nbsp; In some countries it is actually legal to sell un-prescribed antibiotics in drug stores and even in supermarkets (Saltoğlu, 2005). </span></p>
+
−
<p style="margin: 0cm 0cm 10pt; line-height: 22px; font-size: 11pt; font-family: Calibri, sans-serif; caret-color: #000000; color: #000000; font-variant-caps: normal; letter-spacing: normal; orphans: auto; text-align: start; text-transform: none; white-space: normal; widows: auto; word-spacing: 0px; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px; text-decoration: none; text-indent: 36pt;"><span style="font-family: calibri, sans-serif;">Considering that antibiotics cannot be purified by conventional aerobic sludge systems, they are detected in the water even after exposure to wastewater treatment, and as a result received to the surrounding environment. High antibiotic concentrations cause toxicity in organisms, damage the ecosystem and as an outcome dispersal of antibiotic resistance is observed. Antibiotics primarily mix with city waste water by getting carried via hospital water waste, resulting to significant damage of human population and microorganisms around the contamination site. Arguably, most detrimental damage caused by such contamination is emergence of super bugs in the ecosystem. Small but constant dose of antibiotics is perfect for such selection. Emergence of super bugs is a global problem and one day may cause most simple infections to become deadly. Taking into account what is aforementioned it is evident that before recycling use, waste water should be free of antibiotics. That is why detecting and degrading antibiotics in waste water is in upmost importance (Topal, 2013). </span></p>
+
−
<p style="margin: 0cm 0cm 10pt; line-height: 22px; font-size: 11pt; font-family: Calibri, sans-serif; caret-color: #000000; color: #000000; font-variant-caps: normal; letter-spacing: normal; orphans: auto; text-align: start; text-transform: none; white-space: normal; widows: auto; word-spacing: 0px; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px; text-decoration: none; text-indent: 36pt;"><span style="font-family: calibri, sans-serif;">In medicine beta-lactam antibiotics are found to be the most commonly used ones. The oldest and most utilized one is penicillin (Topal, 2013; Yaşar, 2013). Seemingly, aiming for penicillin bioremediation is the most logical and efficient way to come with a solution to this problem.</span></p>
+
−
<img src="https://static.igem.org/mediawiki/2018/2/2b/T--Bilkent-UNAMBG--Picture1.png"/>
+
−
<p><span style="font-family: calibri, sans-serif;"><strong><span style="font-size: 11pt; line-height: 22px;">Figure 1.</span></strong><span style="font-size: 11pt; line-height: 22px;"> Molecular structures of some antibiotics characterized by the presence </span><span style="font-size: 11pt; line-height: 22px;">of the beta-lactam ring</span></span></p>
+
−
<p style="margin: 0cm 0cm 10pt; line-height: 22px; font-size: 11pt; font-family: Calibri, sans-serif; caret-color: #000000; color: #000000; fon-variant-caps: normal; letter-spacing: normal; orphans: auto; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: auto; word-spacing: 0px; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px; text-decoration: none;"><span style="font-family: calibri, sans-serif;">&nbsp;</span></p>
+
−
<p style="margin: 0cm 0cm 10pt; line-height: 22px; font-size: 11pt; font-family: Calibri, sans-serif; caret-color: #000000; color: #000000; font-variant-caps: normal; letter-spacing: normal; orphans: auto; text-indent: 0px; text-transform: none; white-space: normal; widows: auto; word-spacing: 0px; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px; text-decoration: none; text-align: justify;"><span style="font-family: calibri, sans-serif;"><strong><span style="font-size: 12pt; line-height: 24px;">Description of the project</span></strong></span></p>
+
−
<p style="margin: 0cm 0cm 10pt; line-height: 22px; font-size: 11pt; font-family: Calibri, sans-serif; caret-color: #000000; color: #000000; font-variant-caps: normal; letter-spacing: normal; orphans: auto; text-align: start; text-transform: none; white-space: normal; widows: auto; word-spacing: 0px; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px; text-decoration: none; text-indent: 36pt;"><span style="line-height: 22px; font-family: calibri, sans-serif;">Our project aims to firstly express a penicillin binding peptide on biofilms in order to capture the penicillin on the bacteria cell&rsquo;s surface, secondly to express proteins that can trap iron ions so that bacteria gains magnetic properties and finally filter bacteria with captured penicillin by means of a magnetic field. This would present a cheap and easy way to filter penicillin from waste water. Bacteria strain that is going to be used in our project (Escherichia coli) has no side effect on the environment. In addition to that, the proteins possessing magnetic properties are not going to be released in the water after being synthesized in the bacteria. Thus the resulting filtered water will be free of magnetic compounds.</span></p>
+
−
<img src="https://static.igem.org/mediawiki/2018/c/c0/T--Bilkent-UNAMBG--Picture2.png" />
+
−
<p style="margin: 0cm 0cm 10pt; line-height: 22px; font-size: 11pt; font-family: Calibri, sans-serif; caret-color: #000000; color: #000000; font-variant-caps: normal; letter-spacing: normal; orphans: auto; text-align: start; text-transform: none; white-space: normal; widows: auto; word-spacing: 0px; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px; text-decoration: none; text-indent: 36pt;"><span style="line-height: 22px; font-family: calibri, sans-serif;">&nbsp;</span></p>
+
−
<p style="margin: 0cm 0cm 10pt; line-height: 22px; font-size: 11pt; font-family: Calibri, sans-serif; caret-color: #000000; color: #000000; font-variant-caps: normal; letter-spacing: normal; orphans: auto; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: auto; word-spacing: 0px; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px; text-decoration: none;"><span style="font-family: calibri, sans-serif;"><strong><span style="line-height: 22px;">Figure 2.</span></strong><span style="line-height: 22px;">An illustrative representation of the idea behind the project&rsquo;s aim</span></span></p>
+
−
<p style="margin: 0cm 0cm 10pt; line-height: 22px; font-size: 11pt; font-family: Calibri, sans-serif; caret-color: #000000; color: #000000; font-variant-caps: normal; letter-spacing: normal; orphans: auto; text-align: start; text-transform: none; white-space: normal; widows: auto; word-spacing: 0px; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px; text-decoration: none; text-indent: 36pt;"><span style="line-height: 22px; font-family: calibri, sans-serif;">&nbsp;</span></p>
+
−
<p style="margin: 0cm 0cm 10pt; line-height: 22px; font-size: 11pt; font-family: Calibri, sans-serif; caret-color: #000000; color: #000000; font-variant-caps: normal; letter-spacing: normal; orphans: auto; text-align: start; text-transform: none; white-space: normal; widows: auto; word-spacing: 0px; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px; text-decoration: none; text-indent: 36pt;"><span style="line-height: 22px; font-family: calibri, sans-serif;">&nbsp;</span></p>
+
−
<p style="margin: 0cm 0cm 10pt; line-height: 22px; font-size: 11pt; font-family: Calibri, sans-serif; caret-color: #000000; color: #000000; font-variant-caps: normal; letter-spacing: normal; orphans: auto; text-align: start; text-transform: none; white-space: normal; widows: auto; word-spacing: 0px; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px; text-decoration: none; text-indent: 36pt;"><span style="line-height: 22px; font-family: calibri, sans-serif;">&nbsp;Furthermore, we aim to extend the scope of our project by capturing other types of antibiotics as well as other contaminants such as pesticides, insecticides and heavy metals from waste water. Our purpose is to develop this system such that it can be used in water refining facilities cost-effectively, with speed and ease.</span></p>
+
−
<p style="margin: 0cm 0cm 10pt; line-height: 22px; font-size: 11pt; font-family: Calibri, sans-serif; caret-color: #000000; color: #000000; font-variant-caps: normal; letter-spacing: normal; orphans: auto; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: auto; word-spacing: 0px; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px; text-decoration: none;"><span style="font-family: calibri, sans-serif;"><em><span style="font-size: 12pt; line-height: 24px;">&nbsp;</span></em></span></p>
+
−
<p style="margin: 0cm 0cm 10pt; line-height: 22px; font-size: 11pt; font-family: Calibri, sans-serif; caret-color: #000000; color: #000000; font-variant-caps: normal; letter-spacing: normal; orphans: auto; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: auto; word-spacing: 0px; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px; text-decoration: none;"><span style="font-family: calibri, sans-serif;"><em><span style="font-size: 12pt; line-height: 24px;">&nbsp;</span></em></span></p>
+

Revision as of 11:37, 7 October 2018

@charset "UTF-8";


/* SHADOW */ .mdl-shadow--2dp { 

   box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12); }

.mdl-shadow--3dp { 

   box-shadow: 0 3px 4px 0 rgba(0, 0, 0, 0.14), 0 3px 3px -2px rgba(0, 0, 0, 0.2), 0 1px 8px 0 rgba(0, 0, 0, 0.12); }

.mdl-shadow--4dp { 

   box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12), 0 2px 4px -1px rgba(0, 0, 0, 0.2); }

.mdl-shadow--6dp { 

   box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.14), 0 1px 18px 0 rgba(0, 0, 0, 0.12), 0 3px 5px -1px rgba(0, 0, 0, 0.2); }

.mdl-shadow--8dp { 

   box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.2); }

.mdl-shadow--16dp { 

   box-shadow: 0 16px 24px 2px rgba(0, 0, 0, 0.14), 0 6px 30px 5px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2); }

.mdl-shadow--24dp { 

   box-shadow: 0 9px 46px 8px rgba(0, 0, 0, 0.14), 0 11px 15px -7px rgba(0, 0, 0, 0.12), 0 24px 38px 3px rgba(0, 0, 0, 0.2); }

/* card */ a, .mdl-accordion, .mdl-button, .mdl-card, .mdl-checkbox, .mdl-dropdown-menu, .mdl-icon-toggle, .mdl-item, .mdl-radio, .mdl-slider, .mdl-switch, .mdl-tabs__tab { 

   -webkit-tap-highlight-color: transparent;
   -webkit-tap-highlight-color: rgba(255, 255, 255, 0); }

.mdl-card { 

   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
   -webkit-flex-direction: column;
   -ms-flex-direction: column;
   flex-direction: column;
   font-size: 16px;
   font-weight: 400;
   min-height: 200px;
   overflow: hidden;
   width: 330px;
   z-index: 1;
   position: relative;
   background: rgb(255,255,255);
   border-radius: 2px;
   box-sizing: border-box; }

.mdl-card__media { 

   background-color: rgb(255,64,129);
   background-repeat: repeat;
   background-position: 50% 50%;
   background-size: cover;
   background-origin: padding-box;
   background-attachment: scroll;
   box-sizing: border-box; }

.mdl-card__title { 

   -webkit-align-items: center;
   -ms-flex-align: center;
   align-items: center;
   color: rgb(0,0,0);
   display: block;
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
   -webkit-justify-content: stretch;
   -ms-flex-pack: stretch;
   justify-content: stretch;
   line-height: normal;
   padding: 16px 16px;
   -webkit-perspective-origin: 165px 56px;
   perspective-origin: 165px 56px;
   -webkit-transform-origin: 165px 56px;
   transform-origin: 165px 56px;
   box-sizing: border-box; }

.mdl-card__title.mdl-card--border { 

   border-bottom: 1px solid rgba(0, 0, 0, 0.1); }

.mdl-card__title-text { 

   -webkit-align-self: flex-end;
   -ms-flex-item-align: end;
   align-self: flex-end;
   color: inherit;
   display: block;
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
   font-size: 24px;
   font-weight: 300;
   line-height: normal;
   overflow: hidden;
   -webkit-transform-origin: 149px 48px;
   transform-origin: 149px 48px;
   margin: 0; }

.mdl-card__subtitle-text { 

   font-size: 14px;
   color: rgba(0,0,0, 0.54);
   margin: 0; }

.mdl-card__supporting-text { 

   color: rgba(0,0,0, 0.54);
   font-size: 1rem;
   line-height: 18px;
   overflow: hidden;
   padding: 16px 16px;
   width: 90%; }

.mdl-card__supporting-text.mdl-card--border { 

   border-bottom: 1px solid rgba(0, 0, 0, 0.1); }

.mdl-card__actions { 

   font-size: 16px;
   line-height: normal;
   width: 100%;
   background-color: transparent;
   padding: 8px;
   box-sizing: border-box; }

.mdl-card__actions.mdl-card--border { 

   border-top: 1px solid rgba(0, 0, 0, 0.1); }

.mdl-card--expand { 

   -webkit-flex-grow: 1;
   -ms-flex-positive: 1;
   flex-grow: 1; }

.mdl-card__menu { 

   position: absolute;
   right: 16px;
   top: 16px; }

/*BUTTON*/ .mdl-button .mdl-badge[data-badge]:after { 

   top: -10px;
   right: -5px; }

.mdl-button { 

   background: transparent;
   border: none;
   border-radius: 2px;
   color: rgb(0,0,0);
   position: relative;
   height: 36px;
   margin: 0;
   min-width: 64px;
   padding: 0 16px;
   display: inline-block;
   font-family: "Roboto", "Helvetica", "Arial", sans-serif;
   font-size: 14px;
   font-weight: 500;
   text-transform: uppercase;
   line-height: 1;
   letter-spacing: 0;
   overflow: hidden;
   will-change: box-shadow;
   transition: box-shadow 0.2s cubic-bezier(0.4, 0, 1, 1), background-color 0.2s cubic-bezier(0.4, 0, 0.2, 1), color 0.2s cubic-bezier(0.4, 0, 0.2, 1);
   outline: none;
   cursor: pointer;
   text-decoration: none;
   text-align: center;
   line-height: 36px;
   vertical-align: middle; }

.mdl-button::-moz-focus-inner { 

   border: 0; }

.mdl-button:hover { 

   background-color: rgba(158,158,158, 0.20); }

.mdl-button:focus:not(:active) { 

   background-color: rgba(0,0,0, 0.12); }

.mdl-button:active { 

   background-color: rgba(158,158,158, 0.40); }

.mdl-button.mdl-button--colored { 

   color: rgb(63,81,181); }

.mdl-button.mdl-button--colored:focus:not(:active) { 

   background-color: rgba(0,0,0, 0.12); }

input.mdl-button[type="submit"] { 

   -webkit-appearance: none; }

.mdl-button--raised { 

   background: rgba(158,158,158, 0.20);
   box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12); }

.mdl-button--raised:active { 

   box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12), 0 2px 4px -1px rgba(0, 0, 0, 0.2);
   background-color: rgba(158,158,158, 0.40); }

.mdl-button--raised:focus:not(:active) { 

   box-shadow: 0 0 8px rgba(0, 0, 0, 0.18), 0 8px 16px rgba(0, 0, 0, 0.36);
   background-color: rgba(158,158,158, 0.40); }

.mdl-button--raised.mdl-button--colored { 

   background: rgb(63,81,181);
   color: rgb(255,255,255); }

.mdl-button--raised.mdl-button--colored:hover { 

   background-color: rgb(63,81,181); }

.mdl-button--raised.mdl-button--colored:active { 

   background-color: rgb(63,81,181); }

.mdl-button--raised.mdl-button--colored:focus:not(:active) { 

   background-color: rgb(63,81,181); }

.mdl-button--raised.mdl-button--colored .mdl-ripple { 

   background: rgb(255,255,255); }

.mdl-button--fab { 

   border-radius: 50%;
   font-size: 24px;
   height: 56px;
   margin: auto;
   min-width: 56px;
   width: 56px;
   padding: 0;
   overflow: hidden;
   background: rgba(158,158,158, 0.20);
   box-shadow: 0 1px 1.5px 0 rgba(0, 0, 0, 0.12), 0 1px 1px 0 rgba(0, 0, 0, 0.24);
   position: relative;
   line-height: normal; }

.mdl-button--fab .material-icons { 

   position: absolute;
   top: 50%;
   left: 50%;
   -webkit-transform: translate(-12px, -12px);
   transform: translate(-12px, -12px);
   line-height: 24px;
   width: 24px; }

.mdl-button--fab.mdl-button--mini-fab { 

   height: 40px;
   min-width: 40px;
   width: 40px; }

.mdl-button--fab .mdl-button__ripple-container { 

   border-radius: 50%;
   -webkit-mask-image: -webkit-radial-gradient(circle, white, black); }

.mdl-button--fab:active { 

   box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12), 0 2px 4px -1px rgba(0, 0, 0, 0.2);
   background-color: rgba(158,158,158, 0.40); }

.mdl-button--fab:focus:not(:active) { 

   box-shadow: 0 0 8px rgba(0, 0, 0, 0.18), 0 8px 16px rgba(0, 0, 0, 0.36);
   background-color: rgba(158,158,158, 0.40); }

.mdl-button--fab.mdl-button--colored { 

   background: rgb(255,64,129);
   color: rgb(255,255,255); }

.mdl-button--fab.mdl-button--colored:hover { 

   background-color: rgb(255,64,129); }

.mdl-button--fab.mdl-button--colored:focus:not(:active) { 

   background-color: rgb(255,64,129); }

.mdl-button--fab.mdl-button--colored:active { 

   background-color: rgb(255,64,129); }

.mdl-button--fab.mdl-button--colored .mdl-ripple { 

   background: rgb(255,255,255); }

.mdl-button--icon { 

   border-radius: 50%;
   font-size: 24px;
   height: 32px;
   margin-left: 0;
   margin-right: 0;
   min-width: 32px;
   width: 32px;
   padding: 0;
   overflow: hidden;
   color: inherit;
   line-height: normal; }

.mdl-button--icon .material-icons { 

   position: absolute;
   top: 50%;
   left: 50%;
   -webkit-transform: translate(-12px, -12px);
   transform: translate(-12px, -12px);
   line-height: 24px;
   width: 24px; }

.mdl-button--icon.mdl-button--mini-icon { 

   height: 24px;
   min-width: 24px;
   width: 24px; }

.mdl-button--icon.mdl-button--mini-icon .material-icons { 

   top: 0px;
   left: 0px; }

.mdl-button--icon .mdl-button__ripple-container { 

   border-radius: 50%;
   -webkit-mask-image: -webkit-radial-gradient(circle, white, black); }

.mdl-button__ripple-container { 

   display: block;
   height: 100%;
   left: 0px;
   position: absolute;
   top: 0px;
   width: 100%;
   z-index: 0;
   overflow: hidden; }

.mdl-button[disabled] .mdl-button__ripple-container .mdl-ripple, .mdl-button.mdl-button--disabled .mdl-button__ripple-container .mdl-ripple { 

   background-color: transparent; }

.mdl-button--primary.mdl-button--primary { 

   color: rgb(63,81,181); }

.mdl-button--primary.mdl-button--primary .mdl-ripple { 

   background: rgb(255,255,255); }

.mdl-button--primary.mdl-button--primary.mdl-button--raised, .mdl-button--primary.mdl-button--primary.mdl-button--fab { 

   color: rgb(255,255,255);
   background-color: rgb(63,81,181); }

.mdl-button--accent.mdl-button--accent { 

   color: rgb(255,64,129); }

.mdl-button--accent.mdl-button--accent .mdl-ripple { 

   background: rgb(255,255,255); }

.mdl-button--accent.mdl-button--accent.mdl-button--raised, .mdl-button--accent.mdl-button--accent.mdl-button--fab { 

   color: rgb(255,255,255);
   background-color: rgb(255,64,129); }

.mdl-button[disabled][disabled], .mdl-button.mdl-button--disabled.mdl-button--disabled { 

   color: rgba(0,0,0, 0.26);
   cursor: default;
   background-color: transparent; }

.mdl-button--fab[disabled][disabled], .mdl-button--fab.mdl-button--disabled.mdl-button--disabled { 

   background-color: rgba(0,0,0, 0.12);
   color: rgba(0,0,0, 0.26); }

.mdl-button--raised[disabled][disabled], .mdl-button--raised.mdl-button--disabled.mdl-button--disabled { 

   background-color: rgba(0,0,0, 0.12);
   color: rgba(0,0,0, 0.26);
   box-shadow: none; }

.mdl-button--colored[disabled][disabled], .mdl-button--colored.mdl-button--disabled.mdl-button--disabled { 

   color: rgba(0,0,0, 0.26); }

.mdl-button .material-icons { 

   vertical-align: middle; }

.mdl-textfield--expandable .mdl-button--icon { 

   top: 16px; }


/* Layout */ .mdl-layout { 

   width: 100%;
   height: 100%;
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
   -webkit-flex-direction: column;
   -webkit-flex-direction: column;
   -ms-flex-direction: column;
   flex-direction: column;
   overflow-y: auto;
   overflow-x: hidden;
   position: relative;
   -webkit-overflow-scrolling: touch

}

.mdl-layout.is-small-screen .mdl-layout--large-screen-only { 

   display: none

}

.mdl-layout:not(.is-small-screen) .mdl-layout--small-screen-only { 

   display: none

}

.mdl-layout__container { 

   position: absolute;
   width: 100%;
   height: 100%

}

.mdl-layout__title, .mdl-layout-title { 

   display: block;
   position: relative;
   font-family: "Roboto", "Helvetica", "Arial", sans-serif;
   font-size: 20px;
   line-height: 1;
   letter-spacing: .02em;
   font-weight: normal;
   box-sizing: border-box

}

.mdl-layout-spacer { 

   -webkit-flex-grow: 1;
   -ms-flex-positive: 1;
   flex-grow: 1

}

.mdl-layout__drawer { 

   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
   -webkit-flex-direction: column;
   -ms-flex-direction: column;
   flex-direction: column;
   -webkit-flex-wrap: nowrap;
   -ms-flex-wrap: nowrap;
   flex-wrap: nowrap;
   width: 240px;
   height: 100%;
   max-height: 100%;
   position: absolute;
   top: 0;
   left: 0;
   box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .14), 0 3px 1px -2px rgba(0, 0, 0, .2), 0 1px 5px 0 rgba(0, 0, 0, .12);
   box-sizing: border-box;
   border-right: 1px solid #e0e0e0;
   background: #fafafa;
   -webkit-transform: translateX(-250px);
   transform: translateX(-250px);
   -webkit-transform-style: preserve-3d;
   transform-style: preserve-3d;
   will-change: transform;
   transition-duration: .2s;
   transition-timing-function: cubic-bezier(.4, 0, .2, 1);
   transition-property: transform;
   transition-property: transform, -webkit-transform;
   color: #424242;
   overflow: visible;
   overflow-y: auto;
   z-index: 5

}

.mdl-layout__drawer.is-visible { 

   -webkit-transform: translateX(0);
   transform: translateX(0)

}

.mdl-layout__drawer.is-visible ~ .mdl-layout__content.mdl-layout__content { 

   overflow: hidden

}

.mdl-layout__drawer > * { 

   -webkit-flex-shrink: 0;
   -ms-flex-negative: 0;
   flex-shrink: 0

}

.mdl-layout__drawer > .mdl-layout__title, .mdl-layout__drawer > .mdl-layout-title { 

   line-height: 64px;
   padding-left: 40px

}

@media screen and (max-width: 1024px) { 

   .mdl-layout__drawer > .mdl-layout__title, .mdl-layout__drawer > .mdl-layout-title {
       line-height: 56px;
       padding-left: 16px
   }

}

.mdl-layout__drawer .mdl-navigation { 

   -webkit-flex-direction: column;
   -ms-flex-direction: column;
   flex-direction: column;
   -webkit-align-items: stretch;
   -ms-flex-align: stretch;
   align-items: stretch;
   padding-top: 16px

}

.mdl-layout__drawer .mdl-navigation .mdl-navigation__link { 

   display: block;
   -webkit-flex-shrink: 0;
   -ms-flex-negative: 0;
   flex-shrink: 0;
   padding: 16px 40px;
   margin: 0;
   color: #757575

}

@media screen and (max-width: 1024px) { 

   .mdl-layout__drawer .mdl-navigation .mdl-navigation__link {
       padding: 16px
   }

}

.mdl-layout__drawer .mdl-navigation .mdl-navigation__link:hover { 

   background-color: #e0e0e0

}

.mdl-layout__drawer .mdl-navigation .mdl-navigation__link--current { 

   background-color: #e0e0e0;
   color: #000

}

@media screen and (min-width: 1025px) { 

   .mdl-layout--fixed-drawer > .mdl-layout__drawer {
       -webkit-transform: translateX(0);
       transform: translateX(0)
   }

}

.mdl-layout__drawer-button { 

   display: block;
   position: absolute;
   height: 48px;
   width: 48px;
   border: 0;
   -webkit-flex-shrink: 0;
   -ms-flex-negative: 0;
   flex-shrink: 0;
   overflow: hidden;
   text-align: center;
   cursor: pointer;
   font-size: 26px;
   line-height: 56px;
   font-family: Helvetica, Arial, sans-serif;
   margin: 8px 12px;
   top: 0;
   left: 0;
   color: #fff;
   z-index: 4

}

.mdl-layout__header .mdl-layout__drawer-button { 

   position: absolute;
   color: #fff;
   background-color: inherit

}

@media screen and (max-width: 1024px) { 

   .mdl-layout__header .mdl-layout__drawer-button {
       margin: 4px
   }

}

@media screen and (max-width: 1024px) { 

   .mdl-layout__drawer-button {
       margin: 4px;
       color: rgba(0, 0, 0, .5)
   }

}

@media screen and (min-width: 1025px) { 

   .mdl-layout__drawer-button {
       line-height: 54px
   }

   .mdl-layout--no-desktop-drawer-button .mdl-layout__drawer-button, .mdl-layout--fixed-drawer > .mdl-layout__drawer-button, .mdl-layout--no-drawer-button .mdl-layout__drawer-button {
       display: none
   }

}

.mdl-layout__header { 

   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
   -webkit-flex-direction: column;
   -ms-flex-direction: column;
   flex-direction: column;
   -webkit-flex-wrap: nowrap;
   -ms-flex-wrap: nowrap;
   flex-wrap: nowrap;
   -webkit-justify-content: flex-start;
   -ms-flex-pack: start;
   justify-content: flex-start;
   box-sizing: border-box;
   -webkit-flex-shrink: 0;
   -ms-flex-negative: 0;
   flex-shrink: 0;
   width: 100%;
   margin: 0;
   padding: 0;
   border: none;
   min-height: 64px;
   max-height: 1000px;
   z-index: 3;
   background-color: #ffffff;
   color: #717171;
   box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .14), 0 3px 1px -2px rgba(0, 0, 0, .2), 0 1px 5px 0 rgba(0, 0, 0, .12);
   transition-duration: .2s;
   transition-timing-function: cubic-bezier(.4, 0, .2, 1);
   transition-property: max-height, box-shadow

}

@media screen and (max-width: 1024px) { 

   .mdl-layout__header {
       min-height: 56px
   }

}

.mdl-layout--fixed-drawer.is-upgraded:not(.is-small-screen) > .mdl-layout__header { 

   margin-left: 240px;
   width: calc(100% - 240px)

}

@media screen and (min-width: 1025px) { 

   .mdl-layout--fixed-drawer > .mdl-layout__header .mdl-layout__header-row {
       padding-left: 40px
   }

}

.mdl-layout__header > .mdl-layout-icon { 

   position: absolute;
   left: 40px;
   top: 16px;
   height: 32px;
   width: 32px;
   overflow: hidden;
   z-index: 3;
   display: block

}

@media screen and (max-width: 1024px) { 

   .mdl-layout__header > .mdl-layout-icon {
       left: 16px;
       top: 12px
   }

}

.mdl-layout.has-drawer .mdl-layout__header > .mdl-layout-icon { 

   display: none

}

.mdl-layout__header.is-compact { 

   max-height: 64px

}

@media screen and (max-width: 1024px) { 

   .mdl-layout__header.is-compact {
       max-height: 56px
   }

}

.mdl-layout__header.is-compact.has-tabs { 

   height: 112px

}

@media screen and (max-width: 1024px) { 

   .mdl-layout__header.is-compact.has-tabs {
       min-height: 104px
   }

}

@media screen and (max-width: 1024px) { 

   .mdl-layout__header {
       display: none
   }

   .mdl-layout--fixed-header > .mdl-layout__header {
       display: -webkit-flex;
       display: -ms-flexbox;
       display: flex
   }

}

.mdl-layout__header--transparent.mdl-layout__header--transparent { 

   background-color: transparent;
   box-shadow: none

}

.mdl-layout__header--seamed, .mdl-layout__header--scroll { 

   box-shadow: none

}

.mdl-layout__header--waterfall { 

   box-shadow: none;
   overflow: hidden

}

.mdl-layout__header--waterfall.is-casting-shadow { 

   box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .14), 0 3px 1px -2px rgba(0, 0, 0, .2), 0 1px 5px 0 rgba(0, 0, 0, .12)

}

.mdl-layout__header--waterfall.mdl-layout__header--waterfall-hide-top { 

   -webkit-justify-content: flex-end;
   -ms-flex-pack: end;
   justify-content: flex-end

}

.mdl-layout__header-row { 

   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
   -webkit-flex-direction: row;
   -ms-flex-direction: row;
   flex-direction: row;
   -webkit-flex-wrap: nowrap;
   -ms-flex-wrap: nowrap;
   flex-wrap: nowrap;
   -webkit-flex-shrink: 0;
   -ms-flex-negative: 0;
   flex-shrink: 0;
   box-sizing: border-box;
   -webkit-align-self: stretch;
   -ms-flex-item-align: stretch;
   align-self: stretch;
   -webkit-align-items: center;
   -ms-flex-align: center;
   align-items: center;
   height: 64px;
   margin: 0;
   padding: 0 40px 0 80px

}

.mdl-layout--no-drawer-button .mdl-layout__header-row { 

   padding-left: 40px

}

@media screen and (min-width: 1025px) { 

   .mdl-layout--no-desktop-drawer-button .mdl-layout__header-row {
       padding-left: 40px
   }

}

@media screen and (max-width: 1024px) { 

   .mdl-layout__header-row {
       height: 56px;
       padding: 0 16px 0 72px
   }

   .mdl-layout--no-drawer-button .mdl-layout__header-row {
       padding-left: 16px
   }

}

.mdl-layout__header-row > * { 

   -webkit-flex-shrink: 0;
   -ms-flex-negative: 0;
   flex-shrink: 0

}

.mdl-layout__header--scroll .mdl-layout__header-row { 

   width: 100%

}

.mdl-layout__header-row .mdl-navigation { 

   margin: 0;
   padding: 0;
   height: 64px;
   -webkit-flex-direction: row;
   -ms-flex-direction: row;
   flex-direction: row;
   -webkit-align-items: center;
   -ms-flex-align: center;
   align-items: center

}

@media screen and (max-width: 1024px) { 

   .mdl-layout__header-row .mdl-navigation {
       height: 56px
   }

}

.mdl-layout__header-row .mdl-navigation__link { 

   display: block;
   color: #717171;
   line-height: 64px;
   padding: 0 24px;

}

.mdl-layout__header-row .mdl-navigation__link:hover { 

   display: block;
   color: #000000;
   line-height: 64px;
   padding: 0 24px;

}

@media screen and (max-width: 1024px) { 

   .mdl-layout__header-row .mdl-navigation__link {
       line-height: 56px;
       padding: 0 16px
   }

}

.mdl-layout__obfuscator { 

   background-color: transparent;
   position: absolute;
   top: 0;
   left: 0;
   height: 100%;
   width: 100%;
   z-index: 4;
   visibility: hidden;
   transition-property: background-color;
   transition-duration: .2s;
   transition-timing-function: cubic-bezier(.4, 0, .2, 1)

}

.mdl-layout__obfuscator.is-visible { 

   background-color: rgba(0, 0, 0, .5);
   visibility: visible

}

@supports (pointer-events:auto) { 

   .mdl-layout__obfuscator {
       background-color: rgba(0, 0, 0, .5);
       opacity: 0;
       transition-property: opacity;
       visibility: visible;
       pointer-events: none
   }

   .mdl-layout__obfuscator.is-visible {
       pointer-events: auto;
       opacity: 1
   }

}

.mdl-layout__content { 

   -ms-flex: 0 1 auto;
   position: relative;
   display: inline-block;
   overflow-y: auto;
   overflow-x: hidden;
   -webkit-flex-grow: 1;
   -ms-flex-positive: 1;
   flex-grow: 1;
   z-index: 1;
   -webkit-overflow-scrolling: touch

}

.mdl-layout--fixed-drawer > .mdl-layout__content { 

   margin-left: 240px

}

.mdl-layout__container.has-scrolling-header .mdl-layout__content { 

   overflow: visible

}

@media screen and (max-width: 1024px) { 

   .mdl-layout--fixed-drawer > .mdl-layout__content {
       margin-left: 0
   }

   .mdl-layout__container.has-scrolling-header .mdl-layout__content {
       overflow-y: auto;
       overflow-x: hidden
   }

}

.mdl-layout__tab-bar { 

   height: 96px;
   margin: 0;
   width: calc(100% - 112px);
   padding: 0 0 0 56px;
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
   background-color: #3f51b5;
   overflow-y: hidden;
   overflow-x: scroll

}

.mdl-layout__tab-bar::-webkit-scrollbar { 

   display: none

}

.mdl-layout--no-drawer-button .mdl-layout__tab-bar { 

   padding-left: 16px;
   width: calc(100% - 32px)

}

@media screen and (min-width: 1025px) { 

   .mdl-layout--no-desktop-drawer-button .mdl-layout__tab-bar {
       padding-left: 16px;
       width: calc(100% - 32px)
   }

}

@media screen and (max-width: 1024px) { 

   .mdl-layout__tab-bar {
       width: calc(100% - 60px);
       padding: 0 0 0 60px
   }

   .mdl-layout--no-drawer-button .mdl-layout__tab-bar {
       width: calc(100% - 8px);
       padding-left: 4px
   }

}

.mdl-layout--fixed-tabs .mdl-layout__tab-bar { 

   padding: 0;
   overflow: hidden;
   width: 100%

}

.mdl-layout__tab-bar-container { 

   position: relative;
   height: 48px;
   width: 100%;
   border: none;
   margin: 0;
   z-index: 2;
   -webkit-flex-grow: 0;
   -ms-flex-positive: 0;
   flex-grow: 0;
   -webkit-flex-shrink: 0;
   -ms-flex-negative: 0;
   flex-shrink: 0;
   overflow: hidden

}

.mdl-layout__container > .mdl-layout__tab-bar-container { 

   position: absolute;
   top: 0;
   left: 0

}

.mdl-layout__tab-bar-button { 

   display: inline-block;
   position: absolute;
   top: 0;
   height: 48px;
   width: 56px;
   z-index: 4;
   text-align: center;
   background-color: #3f51b5;
   color: transparent;
   cursor: pointer;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
   user-select: none

}

.mdl-layout--no-desktop-drawer-button .mdl-layout__tab-bar-button, .mdl-layout--no-drawer-button .mdl-layout__tab-bar-button { 

   width: 16px

}

.mdl-layout--no-desktop-drawer-button .mdl-layout__tab-bar-button .material-icons, .mdl-layout--no-drawer-button .mdl-layout__tab-bar-button .material-icons { 

   position: relative;
   left: -4px

}

@media screen and (max-width: 1024px) { 

   .mdl-layout__tab-bar-button {
       width: 60px
   }

}

.mdl-layout--fixed-tabs .mdl-layout__tab-bar-button { 

   display: none

}

.mdl-layout__tab-bar-button .material-icons { 

   line-height: 48px

}

.mdl-layout__tab-bar-button.is-active { 

   color: #fff

}

.mdl-layout__tab-bar-left-button { 

   left: 0

}

.mdl-layout__tab-bar-right-button { 

   right: 0

}

.mdl-layout__tab { 

   margin: 0;
   border: none;
   padding: 0 24px;
   float: left;
   position: relative;
   display: block;
   -webkit-flex-grow: 0;
   -ms-flex-positive: 0;
   flex-grow: 0;
   -webkit-flex-shrink: 0;
   -ms-flex-negative: 0;
   flex-shrink: 0;
   text-decoration: none;
   height: 48px;
   line-height: 48px;
   text-align: center;
   font-weight: 500;
   font-size: 14px;
   text-transform: uppercase;
   color: rgba(255, 255, 255, .6);
   overflow: hidden

}

@media screen and (max-width: 1024px) { 

   .mdl-layout__tab {
       padding: 0 12px
   }

}

.mdl-layout--fixed-tabs .mdl-layout__tab { 

   float: none;
   -webkit-flex-grow: 1;
   -ms-flex-positive: 1;
   flex-grow: 1;
   padding: 0

}

.mdl-layout.is-upgraded .mdl-layout__tab.is-active { 

   color: #fff

}

.mdl-layout.is-upgraded .mdl-layout__tab.is-active::after { 

   height: 2px;
   width: 100%;
   display: block;
   content: " ";
   bottom: 0;
   left: 0;
   position: absolute;
   background: #ff4081;
   -webkit-animation: border-expand .2s cubic-bezier(.4, 0, .4, 1) .01s alternate forwards;
   animation: border-expand .2s cubic-bezier(.4, 0, .4, 1) .01s alternate forwards;
   transition: all 1s cubic-bezier(.4, 0, 1, 1)

}

.mdl-layout__tab .mdl-layout__tab-ripple-container { 

   display: block;
   position: absolute;
   height: 100%;
   width: 100%;
   left: 0;
   top: 0;
   z-index: 1;
   overflow: hidden

}

.mdl-layout__tab .mdl-layout__tab-ripple-container .mdl-ripple { 

   background-color: #fff

}

.mdl-layout__tab-panel { 

   display: block

}

.mdl-layout.is-upgraded .mdl-layout__tab-panel { 

   display: none

}

.mdl-layout.is-upgraded .mdl-layout__tab-panel.is-active { 

   display: block

}

/* navigation */

.mdl-navigation { 

   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
   -webkit-flex-wrap: nowrap;
   -ms-flex-wrap: nowrap;
   flex-wrap: nowrap;
   box-sizing: border-box

}

.mdl-navigation__link { 

   color: #424242;
   text-decoration: none;
   margin: 0;
   font-size: 14px;
   font-weight: 300;
   line-height: 24px;
   letter-spacing: 0;
   opacity: .87

}


.mdl-navigation__link .material-icons { 

   vertical-align: middle

}


/* Text Field */ .mdl-textfield { 

   position: relative;
   font-size: 16px;
   display: inline-block;
   box-sizing: border-box;
   width: 300px;
   max-width: 100%;
   margin: 0;
   padding: 20px 0

}

.mdl-textfield .mdl-button { 

   position: absolute;
   bottom: 20px

}

.mdl-textfield--align-right { 

   text-align: right

}

.mdl-textfield--full-width { 

   width: 100%

}

.mdl-textfield--expandable { 

   min-width: 32px;
   width: auto;
   min-height: 32px

}

.mdl-textfield--expandable .mdl-button--icon { 

   top: 16px

}

.mdl-textfield__input { 

   border: none;
   border-bottom: 1px solid rgba(0, 0, 0, .12);
   display: block;
   font-size: 16px;
   font-family: "Helvetica", "Arial", sans-serif;
   margin: 0;
   padding: 4px 0;
   width: 100%;
   background: 0 0;
   text-align: left;
   color: inherit

}

.mdl-textfield__input[type="number"] { 

   -moz-appearance: textfield

}

.mdl-textfield__input[type="number"]::-webkit-inner-spin-button, .mdl-textfield__input[type="number"]::-webkit-outer-spin-button { 

   -webkit-appearance: none;
   margin: 0

}

.mdl-textfield.is-focused .mdl-textfield__input { 

   outline: none

}

.mdl-textfield.is-invalid .mdl-textfield__input { 

   border-color: #d50000;
   box-shadow: none

}

fieldset[disabled] .mdl-textfield .mdl-textfield__input, .mdl-textfield.is-disabled .mdl-textfield__input { 

   background-color: transparent;
   border-bottom: 1px dotted rgba(0, 0, 0, .12);
   color: rgba(0, 0, 0, .26)

}

.mdl-textfield textarea.mdl-textfield__input { 

   display: block

}

.mdl-textfield__label { 

   bottom: 0;
   color: rgba(0, 0, 0, .26);
   font-size: 16px;
   left: 0;
   right: 0;
   pointer-events: none;
   position: absolute;
   display: block;
   top: 24px;
   width: 100%;
   overflow: hidden;
   white-space: nowrap;
   text-align: left

}

.mdl-textfield.is-dirty .mdl-textfield__label, .mdl-textfield.has-placeholder .mdl-textfield__label { 

   visibility: hidden

}

.mdl-textfield--floating-label .mdl-textfield__label { 

   transition-duration: .2s;
   transition-timing-function: cubic-bezier(.4, 0, .2, 1)

}

.mdl-textfield--floating-label.has-placeholder .mdl-textfield__label { 

   transition: none

}

fieldset[disabled] .mdl-textfield .mdl-textfield__label, .mdl-textfield.is-disabled.is-disabled .mdl-textfield__label { 

   color: rgba(0, 0, 0, .26)

}

.mdl-textfield--floating-label.is-focused .mdl-textfield__label, .mdl-textfield--floating-label.is-dirty .mdl-textfield__label, .mdl-textfield--floating-label.has-placeholder .mdl-textfield__label { 

   color: #3f51b5;
   font-size: 12px;
   top: 4px;
   visibility: visible

}

.mdl-textfield--floating-label.is-focused .mdl-textfield__expandable-holder .mdl-textfield__label, .mdl-textfield--floating-label.is-dirty .mdl-textfield__expandable-holder .mdl-textfield__label, .mdl-textfield--floating-label.has-placeholder .mdl-textfield__expandable-holder .mdl-textfield__label { 

   top: -16px

}

.mdl-textfield--floating-label.is-invalid .mdl-textfield__label { 

   color: #d50000;
   font-size: 12px

}

.mdl-textfield__label:after { 

   background-color: #3f51b5;
   bottom: 20px;
   content: ;
   height: 2px;
   left: 45%;
   position: absolute;
   transition-duration: .2s;
   transition-timing-function: cubic-bezier(.4, 0, .2, 1);
   visibility: hidden;
   width: 10px

}

.mdl-textfield.is-focused .mdl-textfield__label:after { 

   left: 0;
   visibility: visible;
   width: 100%

}

.mdl-textfield.is-invalid .mdl-textfield__label:after { 

   background-color: #d50000

}

.mdl-textfield__error { 

   color: #d50000;
   position: absolute;
   font-size: 12px;
   margin-top: 3px;
   visibility: hidden;
   display: block

}

.mdl-textfield.is-invalid .mdl-textfield__error { 

   visibility: visible

}

.mdl-textfield__expandable-holder { 

   display: inline-block;
   position: relative;
   margin-left: 32px;
   transition-duration: .2s;
   transition-timing-function: cubic-bezier(.4, 0, .2, 1);
   display: inline-block;
   max-width: .1px

}

.mdl-textfield.is-focused .mdl-textfield__expandable-holder, .mdl-textfield.is-dirty .mdl-textfield__expandable-holder { 

   max-width: 600px

}

.mdl-textfield__expandable-holder .mdl-textfield__label:after { 

   bottom: 0

}


/* ripple */

.mdl-ripple { 

   background: #000;
   border-radius: 50%;
   height: 50px;
   left: 0;
   opacity: 0;
   pointer-events: none;
   position: absolute;
   top: 0;
   -webkit-transform: translate(-50%, -50%);
   transform: translate(-50%, -50%);
   width: 50px;
   overflow: hidden

}

.mdl-ripple.is-animating { 

   transition: transform .3s cubic-bezier(0, 0, .2, 1), width .3s cubic-bezier(0, 0, .2, 1), height .3s cubic-bezier(0, 0, .2, 1), opacity .6s cubic-bezier(0, 0, .2, 1);
   transition: transform .3s cubic-bezier(0, 0, .2, 1), width .3s cubic-bezier(0, 0, .2, 1), height .3s cubic-bezier(0, 0, .2, 1), opacity .6s cubic-bezier(0, 0, .2, 1), -webkit-transform .3s cubic-bezier(0, 0, .2, 1)

}

.mdl-ripple.is-visible { 

   opacity: .3

}


.mdl-button--raised.mdl-button--colored .mdl-ripple { 

   background: #fff

}


/* progress */ .mdl-progress { 

   display: block;
   position: relative;
   height: 4px;
   width: 500px;
   max-width: 100%

}

.mdl-progress > .bar { 

   display: block;
   position: absolute;
   top: 0;
   bottom: 0;
   width: 0%;
   transition: width .2s cubic-bezier(.4, 0, .2, 1)

}

.mdl-progress > .progressbar { 

   background-color: #3f51b5;
   z-index: 1;
   left: 0

}

.mdl-progress > .bufferbar { 

   background-image: linear-gradient(to right, rgba(255, 255, 255, .7), rgba(255, 255, 255, .7)), linear-gradient(to right, #3f51b5, #3f51b5);
   z-index: 0;
   left: 0

}

.mdl-progress > .auxbar { 

   right: 0

}

@supports (-webkit-appearance:none) { 

   .mdl-progress:not(.mdl-progress--indeterminate):not(.mdl-progress--indeterminate) > .auxbar, .mdl-progress:not(.mdl-progress__indeterminate):not(.mdl-progress__indeterminate) > .auxbar {
       background-image: linear-gradient(to right, rgba(255, 255, 255, .7), rgba(255, 255, 255, .7)), linear-gradient(to right, #3f51b5, #3f51b5);
       -webkit-mask: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIj8+Cjxzdmcgd2lkdGg9IjEyIiBoZWlnaHQ9IjQiIHZpZXdQb3J0PSIwIDAgMTIgNCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogIDxlbGxpcHNlIGN4PSIyIiBjeT0iMiIgcng9IjIiIHJ5PSIyIj4KICAgIDxhbmltYXRlIGF0dHJpYnV0ZU5hbWU9ImN4IiBmcm9tPSIyIiB0bz0iLTEwIiBkdXI9IjAuNnMiIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiAvPgogIDwvZWxsaXBzZT4KICA8ZWxsaXBzZSBjeD0iMTQiIGN5PSIyIiByeD0iMiIgcnk9IjIiIGNsYXNzPSJsb2FkZXIiPgogICAgPGFuaW1hdGUgYXR0cmlidXRlTmFtZT0iY3giIGZyb209IjE0IiB0bz0iMiIgZHVyPSIwLjZzIiByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIgLz4KICA8L2VsbGlwc2U+Cjwvc3ZnPgo=");
       mask: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIj8+Cjxzdmcgd2lkdGg9IjEyIiBoZWlnaHQ9IjQiIHZpZXdQb3J0PSIwIDAgMTIgNCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogIDxlbGxpcHNlIGN4PSIyIiBjeT0iMiIgcng9IjIiIHJ5PSIyIj4KICAgIDxhbmltYXRlIGF0dHJpYnV0ZU5hbWU9ImN4IiBmcm9tPSIyIiB0bz0iLTEwIiBkdXI9IjAuNnMiIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiAvPgogIDwvZWxsaXBzZT4KICA8ZWxsaXBzZSBjeD0iMTQiIGN5PSIyIiByeD0iMiIgcnk9IjIiIGNsYXNzPSJsb2FkZXIiPgogICAgPGFuaW1hdGUgYXR0cmlidXRlTmFtZT0iY3giIGZyb209IjE0IiB0bz0iMiIgZHVyPSIwLjZzIiByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIgLz4KICA8L2VsbGlwc2U+Cjwvc3ZnPgo=")
   }

}

.mdl-progress:not(.mdl-progress--indeterminate) > .auxbar, .mdl-progress:not(.mdl-progress__indeterminate) > .auxbar { 

   background-image: linear-gradient(to right, rgba(255, 255, 255, .9), rgba(255, 255, 255, .9)), linear-gradient(to right, #3f51b5, #3f51b5)

}

.mdl-progress.mdl-progress--indeterminate > .bar1, .mdl-progress.mdl-progress__indeterminate > .bar1 { 

   -webkit-animation-name: indeterminate1;
   animation-name: indeterminate1

}

.mdl-progress.mdl-progress--indeterminate > .bar1, .mdl-progress.mdl-progress__indeterminate > .bar1, .mdl-progress.mdl-progress--indeterminate > .bar3, .mdl-progress.mdl-progress__indeterminate > .bar3 { 

   background-color: #3f51b5;
   -webkit-animation-duration: 2s;
   animation-duration: 2s;
   -webkit-animation-iteration-count: infinite;
   animation-iteration-count: infinite;
   -webkit-animation-timing-function: linear;
   animation-timing-function: linear

}

.mdl-progress.mdl-progress--indeterminate > .bar3, .mdl-progress.mdl-progress__indeterminate > .bar3 { 

   background-image: none;
   -webkit-animation-name: indeterminate2;
   animation-name: indeterminate2

}


/*Grid & Cell*/

.mdl-grid { 

   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
   -webkit-flex-flow: row wrap;
   -ms-flex-flow: row wrap;
   flex-flow: row wrap;
   margin: 0 auto;
   -webkit-align-items: stretch;
   -ms-flex-align: stretch;
   align-items: stretch

}

.mdl-grid.mdl-grid--no-spacing { 

   padding: 0

}

.mdl-cell { 

   box-sizing: border-box

}

.mdl-cell--top { 

   -webkit-align-self: flex-start;
   -ms-flex-item-align: start;
   align-self: flex-start

}

.mdl-cell--middle { 

   -webkit-align-self: center;
   -ms-flex-item-align: center;
   -ms-grid-row-align: center;
   align-self: center

}

.mdl-cell--bottom { 

   -webkit-align-self: flex-end;
   -ms-flex-item-align: end;
   align-self: flex-end

}

.mdl-cell--stretch { 

   -webkit-align-self: stretch;
   -ms-flex-item-align: stretch;
   -ms-grid-row-align: stretch;
   align-self: stretch

}

.mdl-grid.mdl-grid--no-spacing > .mdl-cell { 

   margin: 0

}

.mdl-cell--order-1 { 

   -webkit-order: 1;
   -ms-flex-order: 1;
   order: 1

}

.mdl-cell--order-2 { 

   -webkit-order: 2;
   -ms-flex-order: 2;
   order: 2

}

.mdl-cell--order-3 { 

   -webkit-order: 3;
   -ms-flex-order: 3;
   order: 3

}

.mdl-cell--order-4 { 

   -webkit-order: 4;
   -ms-flex-order: 4;
   order: 4

}

.mdl-cell--order-5 { 

   -webkit-order: 5;
   -ms-flex-order: 5;
   order: 5

}

.mdl-cell--order-6 { 

   -webkit-order: 6;
   -ms-flex-order: 6;
   order: 6

}

.mdl-cell--order-7 { 

   -webkit-order: 7;
   -ms-flex-order: 7;
   order: 7

}

.mdl-cell--order-8 { 

   -webkit-order: 8;
   -ms-flex-order: 8;
   order: 8

}

.mdl-cell--order-9 { 

   -webkit-order: 9;
   -ms-flex-order: 9;
   order: 9

}

.mdl-cell--order-10 { 

   -webkit-order: 10;
   -ms-flex-order: 10;
   order: 10

}

.mdl-cell--order-11 { 

   -webkit-order: 11;
   -ms-flex-order: 11;
   order: 11

}

.mdl-cell--order-12 { 

   -webkit-order: 12;
   -ms-flex-order: 12;
   order: 12

}

@media (max-width: 479px) { 

   .mdl-grid {
       padding: 8px
   }

   .mdl-cell {
       margin: 8px;
       width: calc(100% - 16px)
   }

   .mdl-grid--no-spacing > .mdl-cell {
       width: 100%
   }

   .mdl-cell--hide-phone {
       display: none !important
   }

   .mdl-cell--order-1-phone.mdl-cell--order-1-phone {
       -webkit-order: 1;
       -ms-flex-order: 1;
       order: 1
   }

   .mdl-cell--order-2-phone.mdl-cell--order-2-phone {
       -webkit-order: 2;
       -ms-flex-order: 2;
       order: 2
   }

   .mdl-cell--order-3-phone.mdl-cell--order-3-phone {
       -webkit-order: 3;
       -ms-flex-order: 3;
       order: 3
   }

   .mdl-cell--order-4-phone.mdl-cell--order-4-phone {
       -webkit-order: 4;
       -ms-flex-order: 4;
       order: 4
   }

   .mdl-cell--order-5-phone.mdl-cell--order-5-phone {
       -webkit-order: 5;
       -ms-flex-order: 5;
       order: 5
   }

   .mdl-cell--order-6-phone.mdl-cell--order-6-phone {
       -webkit-order: 6;
       -ms-flex-order: 6;
       order: 6
   }

   .mdl-cell--order-7-phone.mdl-cell--order-7-phone {
       -webkit-order: 7;
       -ms-flex-order: 7;
       order: 7
   }

   .mdl-cell--order-8-phone.mdl-cell--order-8-phone {
       -webkit-order: 8;
       -ms-flex-order: 8;
       order: 8
   }

   .mdl-cell--order-9-phone.mdl-cell--order-9-phone {
       -webkit-order: 9;
       -ms-flex-order: 9;
       order: 9
   }

   .mdl-cell--order-10-phone.mdl-cell--order-10-phone {
       -webkit-order: 10;
       -ms-flex-order: 10;
       order: 10
   }

   .mdl-cell--order-11-phone.mdl-cell--order-11-phone {
       -webkit-order: 11;
       -ms-flex-order: 11;
       order: 11
   }

   .mdl-cell--order-12-phone.mdl-cell--order-12-phone {
       -webkit-order: 12;
       -ms-flex-order: 12;
       order: 12
   }

   .mdl-cell--1-col, .mdl-cell--1-col-phone.mdl-cell--1-col-phone {
       width: calc(25% - 16px)
   }

   .mdl-grid--no-spacing > .mdl-cell--1-col, .mdl-grid--no-spacing > .mdl-cell--1-col-phone.mdl-cell--1-col-phone {
       width: 25%
   }

   .mdl-cell--2-col, .mdl-cell--2-col-phone.mdl-cell--2-col-phone {
       width: calc(50% - 16px)
   }

   .mdl-grid--no-spacing > .mdl-cell--2-col, .mdl-grid--no-spacing > .mdl-cell--2-col-phone.mdl-cell--2-col-phone {
       width: 50%
   }

   .mdl-cell--3-col, .mdl-cell--3-col-phone.mdl-cell--3-col-phone {
       width: calc(75% - 16px)
   }

   .mdl-grid--no-spacing > .mdl-cell--3-col, .mdl-grid--no-spacing > .mdl-cell--3-col-phone.mdl-cell--3-col-phone {
       width: 75%
   }

   .mdl-cell--4-col, .mdl-cell--4-col-phone.mdl-cell--4-col-phone {
       width: calc(100% - 16px)
   }

   .mdl-grid--no-spacing > .mdl-cell--4-col, .mdl-grid--no-spacing > .mdl-cell--4-col-phone.mdl-cell--4-col-phone {
       width: 100%
   }

   .mdl-cell--5-col, .mdl-cell--5-col-phone.mdl-cell--5-col-phone {
       width: calc(100% - 16px)
   }

   .mdl-grid--no-spacing > .mdl-cell--5-col, .mdl-grid--no-spacing > .mdl-cell--5-col-phone.mdl-cell--5-col-phone {
       width: 100%
   }

   .mdl-cell--6-col, .mdl-cell--6-col-phone.mdl-cell--6-col-phone {
       width: calc(100% - 16px)
   }

   .mdl-grid--no-spacing > .mdl-cell--6-col, .mdl-grid--no-spacing > .mdl-cell--6-col-phone.mdl-cell--6-col-phone {
       width: 100%
   }

   .mdl-cell--7-col, .mdl-cell--7-col-phone.mdl-cell--7-col-phone {
       width: calc(100% - 16px)
   }

   .mdl-grid--no-spacing > .mdl-cell--7-col, .mdl-grid--no-spacing > .mdl-cell--7-col-phone.mdl-cell--7-col-phone {
       width: 100%
   }

   .mdl-cell--8-col, .mdl-cell--8-col-phone.mdl-cell--8-col-phone {
       width: calc(100% - 16px)
   }

   .mdl-grid--no-spacing > .mdl-cell--8-col, .mdl-grid--no-spacing > .mdl-cell--8-col-phone.mdl-cell--8-col-phone {
       width: 100%
   }

   .mdl-cell--9-col, .mdl-cell--9-col-phone.mdl-cell--9-col-phone {
       width: calc(100% - 16px)
   }

   .mdl-grid--no-spacing > .mdl-cell--9-col, .mdl-grid--no-spacing > .mdl-cell--9-col-phone.mdl-cell--9-col-phone {
       width: 100%
   }

   .mdl-cell--10-col, .mdl-cell--10-col-phone.mdl-cell--10-col-phone {
       width: calc(100% - 16px)
   }

   .mdl-grid--no-spacing > .mdl-cell--10-col, .mdl-grid--no-spacing > .mdl-cell--10-col-phone.mdl-cell--10-col-phone {
       width: 100%
   }

   .mdl-cell--11-col, .mdl-cell--11-col-phone.mdl-cell--11-col-phone {
       width: calc(100% - 16px)
   }

   .mdl-grid--no-spacing > .mdl-cell--11-col, .mdl-grid--no-spacing > .mdl-cell--11-col-phone.mdl-cell--11-col-phone {
       width: 100%
   }

   .mdl-cell--12-col, .mdl-cell--12-col-phone.mdl-cell--12-col-phone {
       width: calc(100% - 16px)
   }

   .mdl-grid--no-spacing > .mdl-cell--12-col, .mdl-grid--no-spacing > .mdl-cell--12-col-phone.mdl-cell--12-col-phone {
       width: 100%
   }

   .mdl-cell--1-offset, .mdl-cell--1-offset-phone.mdl-cell--1-offset-phone {
       margin-left: calc(25% + 8px)
   }

   .mdl-grid.mdl-grid--no-spacing > .mdl-cell--1-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--1-offset-phone.mdl-cell--1-offset-phone {
       margin-left: 25%
   }

   .mdl-cell--2-offset, .mdl-cell--2-offset-phone.mdl-cell--2-offset-phone {
       margin-left: calc(50% + 8px)
   }

   .mdl-grid.mdl-grid--no-spacing > .mdl-cell--2-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--2-offset-phone.mdl-cell--2-offset-phone {
       margin-left: 50%
   }

   .mdl-cell--3-offset, .mdl-cell--3-offset-phone.mdl-cell--3-offset-phone {
       margin-left: calc(75% + 8px)
   }

   .mdl-grid.mdl-grid--no-spacing > .mdl-cell--3-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--3-offset-phone.mdl-cell--3-offset-phone {
       margin-left: 75%
   }

}

@media (min-width: 480px) and (max-width: 839px) { 

   .mdl-grid {
       padding: 8px
   }

   .mdl-cell {
       margin: 8px;
       width: calc(50% - 16px)
   }

   .mdl-grid--no-spacing > .mdl-cell {
       width: 50%
   }

   .mdl-cell--hide-tablet {
       display: none !important
   }

   .mdl-cell--order-1-tablet.mdl-cell--order-1-tablet {
       -webkit-order: 1;
       -ms-flex-order: 1;
       order: 1
   }

   .mdl-cell--order-2-tablet.mdl-cell--order-2-tablet {
       -webkit-order: 2;
       -ms-flex-order: 2;
       order: 2
   }

   .mdl-cell--order-3-tablet.mdl-cell--order-3-tablet {
       -webkit-order: 3;
       -ms-flex-order: 3;
       order: 3
   }

   .mdl-cell--order-4-tablet.mdl-cell--order-4-tablet {
       -webkit-order: 4;
       -ms-flex-order: 4;
       order: 4
   }

   .mdl-cell--order-5-tablet.mdl-cell--order-5-tablet {
       -webkit-order: 5;
       -ms-flex-order: 5;
       order: 5
   }

   .mdl-cell--order-6-tablet.mdl-cell--order-6-tablet {
       -webkit-order: 6;
       -ms-flex-order: 6;
       order: 6
   }

   .mdl-cell--order-7-tablet.mdl-cell--order-7-tablet {
       -webkit-order: 7;
       -ms-flex-order: 7;
       order: 7
   }

   .mdl-cell--order-8-tablet.mdl-cell--order-8-tablet {
       -webkit-order: 8;
       -ms-flex-order: 8;
       order: 8
   }

   .mdl-cell--order-9-tablet.mdl-cell--order-9-tablet {
       -webkit-order: 9;
       -ms-flex-order: 9;
       order: 9
   }

   .mdl-cell--order-10-tablet.mdl-cell--order-10-tablet {
       -webkit-order: 10;
       -ms-flex-order: 10;
       order: 10
   }

   .mdl-cell--order-11-tablet.mdl-cell--order-11-tablet {
       -webkit-order: 11;
       -ms-flex-order: 11;
       order: 11
   }

   .mdl-cell--order-12-tablet.mdl-cell--order-12-tablet {
       -webkit-order: 12;
       -ms-flex-order: 12;
       order: 12
   }

   .mdl-cell--1-col, .mdl-cell--1-col-tablet.mdl-cell--1-col-tablet {
       width: calc(12.5% - 16px)
   }

   .mdl-grid--no-spacing > .mdl-cell--1-col, .mdl-grid--no-spacing > .mdl-cell--1-col-tablet.mdl-cell--1-col-tablet {
       width: 12.5%
   }

   .mdl-cell--2-col, .mdl-cell--2-col-tablet.mdl-cell--2-col-tablet {
       width: calc(25% - 16px)
   }

   .mdl-grid--no-spacing > .mdl-cell--2-col, .mdl-grid--no-spacing > .mdl-cell--2-col-tablet.mdl-cell--2-col-tablet {
       width: 25%
   }

   .mdl-cell--3-col, .mdl-cell--3-col-tablet.mdl-cell--3-col-tablet {
       width: calc(37.5% - 16px)
   }

   .mdl-grid--no-spacing > .mdl-cell--3-col, .mdl-grid--no-spacing > .mdl-cell--3-col-tablet.mdl-cell--3-col-tablet {
       width: 37.5%
   }

   .mdl-cell--4-col, .mdl-cell--4-col-tablet.mdl-cell--4-col-tablet {
       width: calc(50% - 16px)
   }

   .mdl-grid--no-spacing > .mdl-cell--4-col, .mdl-grid--no-spacing > .mdl-cell--4-col-tablet.mdl-cell--4-col-tablet {
       width: 50%
   }

   .mdl-cell--5-col, .mdl-cell--5-col-tablet.mdl-cell--5-col-tablet {
       width: calc(62.5% - 16px)
   }

   .mdl-grid--no-spacing > .mdl-cell--5-col, .mdl-grid--no-spacing > .mdl-cell--5-col-tablet.mdl-cell--5-col-tablet {
       width: 62.5%
   }

   .mdl-cell--6-col, .mdl-cell--6-col-tablet.mdl-cell--6-col-tablet {
       width: calc(75% - 16px)
   }

   .mdl-grid--no-spacing > .mdl-cell--6-col, .mdl-grid--no-spacing > .mdl-cell--6-col-tablet.mdl-cell--6-col-tablet {
       width: 75%
   }

   .mdl-cell--7-col, .mdl-cell--7-col-tablet.mdl-cell--7-col-tablet {
       width: calc(87.5% - 16px)
   }

   .mdl-grid--no-spacing > .mdl-cell--7-col, .mdl-grid--no-spacing > .mdl-cell--7-col-tablet.mdl-cell--7-col-tablet {
       width: 87.5%
   }

   .mdl-cell--8-col, .mdl-cell--8-col-tablet.mdl-cell--8-col-tablet {
       width: calc(100% - 16px)
   }

   .mdl-grid--no-spacing > .mdl-cell--8-col, .mdl-grid--no-spacing > .mdl-cell--8-col-tablet.mdl-cell--8-col-tablet {
       width: 100%
   }

   .mdl-cell--9-col, .mdl-cell--9-col-tablet.mdl-cell--9-col-tablet {
       width: calc(100% - 16px)
   }

   .mdl-grid--no-spacing > .mdl-cell--9-col, .mdl-grid--no-spacing > .mdl-cell--9-col-tablet.mdl-cell--9-col-tablet {
       width: 100%
   }

   .mdl-cell--10-col, .mdl-cell--10-col-tablet.mdl-cell--10-col-tablet {
       width: calc(100% - 16px)
   }

   .mdl-grid--no-spacing > .mdl-cell--10-col, .mdl-grid--no-spacing > .mdl-cell--10-col-tablet.mdl-cell--10-col-tablet {
       width: 100%
   }

   .mdl-cell--11-col, .mdl-cell--11-col-tablet.mdl-cell--11-col-tablet {
       width: calc(100% - 16px)
   }

   .mdl-grid--no-spacing > .mdl-cell--11-col, .mdl-grid--no-spacing > .mdl-cell--11-col-tablet.mdl-cell--11-col-tablet {
       width: 100%
   }

   .mdl-cell--12-col, .mdl-cell--12-col-tablet.mdl-cell--12-col-tablet {
       width: calc(100% - 16px)
   }

   .mdl-grid--no-spacing > .mdl-cell--12-col, .mdl-grid--no-spacing > .mdl-cell--12-col-tablet.mdl-cell--12-col-tablet {
       width: 100%
   }

   .mdl-cell--1-offset, .mdl-cell--1-offset-tablet.mdl-cell--1-offset-tablet {
       margin-left: calc(12.5% + 8px)
   }

   .mdl-grid.mdl-grid--no-spacing > .mdl-cell--1-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--1-offset-tablet.mdl-cell--1-offset-tablet {
       margin-left: 12.5%
   }

   .mdl-cell--2-offset, .mdl-cell--2-offset-tablet.mdl-cell--2-offset-tablet {
       margin-left: calc(25% + 8px)
   }

   .mdl-grid.mdl-grid--no-spacing > .mdl-cell--2-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--2-offset-tablet.mdl-cell--2-offset-tablet {
       margin-left: 25%
   }

   .mdl-cell--3-offset, .mdl-cell--3-offset-tablet.mdl-cell--3-offset-tablet {
       margin-left: calc(37.5% + 8px)
   }

   .mdl-grid.mdl-grid--no-spacing > .mdl-cell--3-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--3-offset-tablet.mdl-cell--3-offset-tablet {
       margin-left: 37.5%
   }

   .mdl-cell--4-offset, .mdl-cell--4-offset-tablet.mdl-cell--4-offset-tablet {
       margin-left: calc(50% + 8px)
   }

   .mdl-grid.mdl-grid--no-spacing > .mdl-cell--4-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--4-offset-tablet.mdl-cell--4-offset-tablet {
       margin-left: 50%
   }

   .mdl-cell--5-offset, .mdl-cell--5-offset-tablet.mdl-cell--5-offset-tablet {
       margin-left: calc(62.5% + 8px)
   }

   .mdl-grid.mdl-grid--no-spacing > .mdl-cell--5-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--5-offset-tablet.mdl-cell--5-offset-tablet {
       margin-left: 62.5%
   }

   .mdl-cell--6-offset, .mdl-cell--6-offset-tablet.mdl-cell--6-offset-tablet {
       margin-left: calc(75% + 8px)
   }

   .mdl-grid.mdl-grid--no-spacing > .mdl-cell--6-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--6-offset-tablet.mdl-cell--6-offset-tablet {
       margin-left: 75%
   }

   .mdl-cell--7-offset, .mdl-cell--7-offset-tablet.mdl-cell--7-offset-tablet {
       margin-left: calc(87.5% + 8px)
   }

   .mdl-grid.mdl-grid--no-spacing > .mdl-cell--7-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--7-offset-tablet.mdl-cell--7-offset-tablet {
       margin-left: 87.5%
   }

}

@media (min-width: 840px) { 

   .mdl-grid {
       padding: 8px
   }

   .mdl-cell {
       margin: 8px;
       width: calc(33.3333333333% - 16px)
   }

   .mdl-grid--no-spacing > .mdl-cell {
       width: 33.3333333333%
   }

   .mdl-cell--hide-desktop {
       display: none !important
   }

   .mdl-cell--order-1-desktop.mdl-cell--order-1-desktop {
       -webkit-order: 1;
       -ms-flex-order: 1;
       order: 1
   }

   .mdl-cell--order-2-desktop.mdl-cell--order-2-desktop {
       -webkit-order: 2;
       -ms-flex-order: 2;
       order: 2
   }

   .mdl-cell--order-3-desktop.mdl-cell--order-3-desktop {
       -webkit-order: 3;
       -ms-flex-order: 3;
       order: 3
   }

   .mdl-cell--order-4-desktop.mdl-cell--order-4-desktop {
       -webkit-order: 4;
       -ms-flex-order: 4;
       order: 4
   }

   .mdl-cell--order-5-desktop.mdl-cell--order-5-desktop {
       -webkit-order: 5;
       -ms-flex-order: 5;
       order: 5
   }

   .mdl-cell--order-6-desktop.mdl-cell--order-6-desktop {
       -webkit-order: 6;
       -ms-flex-order: 6;
       order: 6
   }

   .mdl-cell--order-7-desktop.mdl-cell--order-7-desktop {
       -webkit-order: 7;
       -ms-flex-order: 7;
       order: 7
   }

   .mdl-cell--order-8-desktop.mdl-cell--order-8-desktop {
       -webkit-order: 8;
       -ms-flex-order: 8;
       order: 8
   }

   .mdl-cell--order-9-desktop.mdl-cell--order-9-desktop {
       -webkit-order: 9;
       -ms-flex-order: 9;
       order: 9
   }

   .mdl-cell--order-10-desktop.mdl-cell--order-10-desktop {
       -webkit-order: 10;
       -ms-flex-order: 10;
       order: 10
   }

   .mdl-cell--order-11-desktop.mdl-cell--order-11-desktop {
       -webkit-order: 11;
       -ms-flex-order: 11;
       order: 11
   }

   .mdl-cell--order-12-desktop.mdl-cell--order-12-desktop {
       -webkit-order: 12;
       -ms-flex-order: 12;
       order: 12
   }

   .mdl-cell--1-col, .mdl-cell--1-col-desktop.mdl-cell--1-col-desktop {
       width: calc(8.3333333333% - 16px)
   }

   .mdl-grid--no-spacing > .mdl-cell--1-col, .mdl-grid--no-spacing > .mdl-cell--1-col-desktop.mdl-cell--1-col-desktop {
       width: 8.3333333333%
   }

   .mdl-cell--2-col, .mdl-cell--2-col-desktop.mdl-cell--2-col-desktop {
       width: calc(16.6666666667% - 16px)
   }

   .mdl-grid--no-spacing > .mdl-cell--2-col, .mdl-grid--no-spacing > .mdl-cell--2-col-desktop.mdl-cell--2-col-desktop {
       width: 16.6666666667%
   }

   .mdl-cell--3-col, .mdl-cell--3-col-desktop.mdl-cell--3-col-desktop {
       width: calc(25% - 16px)
   }

   .mdl-grid--no-spacing > .mdl-cell--3-col, .mdl-grid--no-spacing > .mdl-cell--3-col-desktop.mdl-cell--3-col-desktop {
       width: 25%
   }

   .mdl-cell--4-col, .mdl-cell--4-col-desktop.mdl-cell--4-col-desktop {
       width: calc(33.3333333333% - 16px)
   }

   .mdl-grid--no-spacing > .mdl-cell--4-col, .mdl-grid--no-spacing > .mdl-cell--4-col-desktop.mdl-cell--4-col-desktop {
       width: 33.3333333333%
   }

   .mdl-cell--5-col, .mdl-cell--5-col-desktop.mdl-cell--5-col-desktop {
       width: calc(41.6666666667% - 16px)
   }

   .mdl-grid--no-spacing > .mdl-cell--5-col, .mdl-grid--no-spacing > .mdl-cell--5-col-desktop.mdl-cell--5-col-desktop {
       width: 41.6666666667%
   }

   .mdl-cell--6-col, .mdl-cell--6-col-desktop.mdl-cell--6-col-desktop {
       width: calc(50% - 16px)
   }

   .mdl-grid--no-spacing > .mdl-cell--6-col, .mdl-grid--no-spacing > .mdl-cell--6-col-desktop.mdl-cell--6-col-desktop {
       width: 50%
   }

   .mdl-cell--7-col, .mdl-cell--7-col-desktop.mdl-cell--7-col-desktop {
       width: calc(58.3333333333% - 16px)
   }

   .mdl-grid--no-spacing > .mdl-cell--7-col, .mdl-grid--no-spacing > .mdl-cell--7-col-desktop.mdl-cell--7-col-desktop {
       width: 58.3333333333%
   }

   .mdl-cell--8-col, .mdl-cell--8-col-desktop.mdl-cell--8-col-desktop {
       width: calc(66.6666666667% - 16px)
   }

   .mdl-grid--no-spacing > .mdl-cell--8-col, .mdl-grid--no-spacing > .mdl-cell--8-col-desktop.mdl-cell--8-col-desktop {
       width: 66.6666666667%
   }

   .mdl-cell--9-col, .mdl-cell--9-col-desktop.mdl-cell--9-col-desktop {
       width: calc(75% - 16px)
   }

   .mdl-grid--no-spacing > .mdl-cell--9-col, .mdl-grid--no-spacing > .mdl-cell--9-col-desktop.mdl-cell--9-col-desktop {
       width: 75%
   }

   .mdl-cell--10-col, .mdl-cell--10-col-desktop.mdl-cell--10-col-desktop {
       width: calc(83.3333333333% - 16px)
   }

   .mdl-grid--no-spacing > .mdl-cell--10-col, .mdl-grid--no-spacing > .mdl-cell--10-col-desktop.mdl-cell--10-col-desktop {
       width: 83.3333333333%
   }

   .mdl-cell--11-col, .mdl-cell--11-col-desktop.mdl-cell--11-col-desktop {
       width: calc(91.6666666667% - 16px)
   }

   .mdl-grid--no-spacing > .mdl-cell--11-col, .mdl-grid--no-spacing > .mdl-cell--11-col-desktop.mdl-cell--11-col-desktop {
       width: 91.6666666667%
   }

   .mdl-cell--12-col, .mdl-cell--12-col-desktop.mdl-cell--12-col-desktop {
       width: calc(100% - 16px)
   }

   .mdl-grid--no-spacing > .mdl-cell--12-col, .mdl-grid--no-spacing > .mdl-cell--12-col-desktop.mdl-cell--12-col-desktop {
       width: 100%
   }

   .mdl-cell--1-offset, .mdl-cell--1-offset-desktop.mdl-cell--1-offset-desktop {
       margin-left: calc(8.3333333333% + 8px)
   }

   .mdl-grid.mdl-grid--no-spacing > .mdl-cell--1-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--1-offset-desktop.mdl-cell--1-offset-desktop {
       margin-left: 8.3333333333%
   }

   .mdl-cell--2-offset, .mdl-cell--2-offset-desktop.mdl-cell--2-offset-desktop {
       margin-left: calc(16.6666666667% + 8px)
   }

   .mdl-grid.mdl-grid--no-spacing > .mdl-cell--2-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--2-offset-desktop.mdl-cell--2-offset-desktop {
       margin-left: 16.6666666667%
   }

   .mdl-cell--3-offset, .mdl-cell--3-offset-desktop.mdl-cell--3-offset-desktop {
       margin-left: calc(25% + 8px)
   }

   .mdl-grid.mdl-grid--no-spacing > .mdl-cell--3-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--3-offset-desktop.mdl-cell--3-offset-desktop {
       margin-left: 25%
   }

   .mdl-cell--4-offset, .mdl-cell--4-offset-desktop.mdl-cell--4-offset-desktop {
       margin-left: calc(33.3333333333% + 8px)
   }

   .mdl-grid.mdl-grid--no-spacing > .mdl-cell--4-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--4-offset-desktop.mdl-cell--4-offset-desktop {
       margin-left: 33.3333333333%
   }

   .mdl-cell--5-offset, .mdl-cell--5-offset-desktop.mdl-cell--5-offset-desktop {
       margin-left: calc(41.6666666667% + 8px)
   }

   .mdl-grid.mdl-grid--no-spacing > .mdl-cell--5-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--5-offset-desktop.mdl-cell--5-offset-desktop {
       margin-left: 41.6666666667%
   }

   .mdl-cell--6-offset, .mdl-cell--6-offset-desktop.mdl-cell--6-offset-desktop {
       margin-left: calc(50% + 8px)
   }

   .mdl-grid.mdl-grid--no-spacing > .mdl-cell--6-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--6-offset-desktop.mdl-cell--6-offset-desktop {
       margin-left: 50%
   }

   .mdl-cell--7-offset, .mdl-cell--7-offset-desktop.mdl-cell--7-offset-desktop {
       margin-left: calc(58.3333333333% + 8px)
   }

   .mdl-grid.mdl-grid--no-spacing > .mdl-cell--7-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--7-offset-desktop.mdl-cell--7-offset-desktop {
       margin-left: 58.3333333333%
   }

   .mdl-cell--8-offset, .mdl-cell--8-offset-desktop.mdl-cell--8-offset-desktop {
       margin-left: calc(66.6666666667% + 8px)
   }

   .mdl-grid.mdl-grid--no-spacing > .mdl-cell--8-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--8-offset-desktop.mdl-cell--8-offset-desktop {
       margin-left: 66.6666666667%
   }

   .mdl-cell--9-offset, .mdl-cell--9-offset-desktop.mdl-cell--9-offset-desktop {
       margin-left: calc(75% + 8px)
   }

   .mdl-grid.mdl-grid--no-spacing > .mdl-cell--9-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--9-offset-desktop.mdl-cell--9-offset-desktop {
       margin-left: 75%
   }

   .mdl-cell--10-offset, .mdl-cell--10-offset-desktop.mdl-cell--10-offset-desktop {
       margin-left: calc(83.3333333333% + 8px)
   }

   .mdl-grid.mdl-grid--no-spacing > .mdl-cell--10-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--10-offset-desktop.mdl-cell--10-offset-desktop {
       margin-left: 83.3333333333%
   }

   .mdl-cell--11-offset, .mdl-cell--11-offset-desktop.mdl-cell--11-offset-desktop {
       margin-left: calc(91.6666666667% + 8px)
   }

   .mdl-grid.mdl-grid--no-spacing > .mdl-cell--11-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--11-offset-desktop.mdl-cell--11-offset-desktop {
       margin-left: 91.6666666667%
   }

}

/*Footer*/ .mdl-mega-footer { 

   padding: 16px 40px;
   color: #9e9e9e;
   background-color: #424242

}

.mdl-mega-footer--top-section:after, .mdl-mega-footer--middle-section:after, .mdl-mega-footer--bottom-section:after, .mdl-mega-footer__top-section:after, .mdl-mega-footer__middle-section:after, .mdl-mega-footer__bottom-section:after { 

   content: ;
   display: block;
   clear: both

}

.mdl-mega-footer--left-section, .mdl-mega-footer__left-section, .mdl-mega-footer--right-section, .mdl-mega-footer__right-section { 

   margin-bottom: 16px

}

.mdl-mega-footer--right-section a, .mdl-mega-footer__right-section a { 

   display: block;
   margin-bottom: 16px;
   color: inherit;
   text-decoration: none

}

@media screen and (min-width: 760px) { 

   .mdl-mega-footer--left-section, .mdl-mega-footer__left-section {
       float: left
   }

   .mdl-mega-footer--right-section, .mdl-mega-footer__right-section {
       float: right
   }

   .mdl-mega-footer--right-section a, .mdl-mega-footer__right-section a {
       display: inline-block;
       margin-left: 16px;
       line-height: 36px;
       vertical-align: middle
   }

}

.mdl-mega-footer--social-btn, .mdl-mega-footer__social-btn { 

   width: 36px;
   height: 36px;
   padding: 0;
   margin: 0;
   background-color: #9e9e9e;
   border: none

}

.mdl-mega-footer--drop-down-section, .mdl-mega-footer__drop-down-section { 

   display: block;
   position: relative

}

@media screen and (min-width: 760px) { 

   .mdl-mega-footer--drop-down-section, .mdl-mega-footer__drop-down-section {
       width: 33%
   }

   .mdl-mega-footer--drop-down-section:nth-child(1), .mdl-mega-footer--drop-down-section:nth-child(2), .mdl-mega-footer__drop-down-section:nth-child(1), .mdl-mega-footer__drop-down-section:nth-child(2) {
       float: left
   }

   .mdl-mega-footer--drop-down-section:nth-child(3), .mdl-mega-footer__drop-down-section:nth-child(3) {
       float: right
   }

   .mdl-mega-footer--drop-down-section:nth-child(3):after, .mdl-mega-footer__drop-down-section:nth-child(3):after {
       clear: right
   }

   .mdl-mega-footer--drop-down-section:nth-child(4), .mdl-mega-footer__drop-down-section:nth-child(4) {
       clear: right;
       float: right
   }

   .mdl-mega-footer--middle-section:after, .mdl-mega-footer__middle-section:after {
       content: ;
       display: block;
       clear: both
   }

   .mdl-mega-footer--bottom-section, .mdl-mega-footer__bottom-section {
       padding-top: 0
   }

}

@media screen and (min-width: 1024px) { 

   .mdl-mega-footer--drop-down-section, .mdl-mega-footer--drop-down-section:nth-child(3), .mdl-mega-footer--drop-down-section:nth-child(4), .mdl-mega-footer__drop-down-section, .mdl-mega-footer__drop-down-section:nth-child(3), .mdl-mega-footer__drop-down-section:nth-child(4) {
       width: 24%;
       float: left
   }

}

.mdl-mega-footer--heading-checkbox, .mdl-mega-footer__heading-checkbox { 

   position: absolute;
   width: 100%;
   height: 55.8px;
   padding: 32px;
   margin: -16px 0 0;
   cursor: pointer;
   z-index: 1;
   opacity: 0

}

.mdl-mega-footer--heading-checkbox + .mdl-mega-footer--heading:after, .mdl-mega-footer--heading-checkbox + .mdl-mega-footer__heading:after, .mdl-mega-footer__heading-checkbox + .mdl-mega-footer--heading:after, .mdl-mega-footer__heading-checkbox + .mdl-mega-footer__heading:after { 

   font-family: 'Material Icons';
   content: '\E5CE'

}

.mdl-mega-footer--heading-checkbox:checked ~ .mdl-mega-footer--link-list, .mdl-mega-footer--heading-checkbox:checked ~ .mdl-mega-footer__link-list, .mdl-mega-footer--heading-checkbox:checked + .mdl-mega-footer--heading + .mdl-mega-footer--link-list, .mdl-mega-footer--heading-checkbox:checked + .mdl-mega-footer__heading + .mdl-mega-footer__link-list, .mdl-mega-footer__heading-checkbox:checked ~ .mdl-mega-footer--link-list, .mdl-mega-footer__heading-checkbox:checked ~ .mdl-mega-footer__link-list, .mdl-mega-footer__heading-checkbox:checked + .mdl-mega-footer--heading + .mdl-mega-footer--link-list, .mdl-mega-footer__heading-checkbox:checked + .mdl-mega-footer__heading + .mdl-mega-footer__link-list { 

   display: none

}

.mdl-mega-footer--heading-checkbox:checked + .mdl-mega-footer--heading:after, .mdl-mega-footer--heading-checkbox:checked + .mdl-mega-footer__heading:after, .mdl-mega-footer__heading-checkbox:checked + .mdl-mega-footer--heading:after, .mdl-mega-footer__heading-checkbox:checked + .mdl-mega-footer__heading:after { 

   font-family: 'Material Icons';
   content: '\E5CF'

}

.mdl-mega-footer--heading, .mdl-mega-footer__heading { 

   position: relative;
   width: 100%;
   padding-right: 39.8px;
   margin-bottom: 16px;
   box-sizing: border-box;
   font-size: 14px;
   line-height: 23.8px;
   font-weight: 500;
   white-space: nowrap;
   text-overflow: ellipsis;
   overflow: hidden;
   color: #e0e0e0

}

.mdl-mega-footer--heading:after, .mdl-mega-footer__heading:after { 

   content: ;
   position: absolute;
   top: 0;
   right: 0;
   display: block;
   width: 23.8px;
   height: 23.8px;
   background-size: cover

}

.mdl-mega-footer--link-list, .mdl-mega-footer__link-list { 

   list-style: none;
   padding: 0;
   margin: 0 0 32px;

!important; }

.mdl-mega-footer--link-list:after, .mdl-mega-footer__link-list:after { 

   clear: both;
   display: block;
   content: ;

!important; }

.mdl-mega-footer--link-list li, .mdl-mega-footer__link-list li { 

   font-size: 14px;
   font-weight: 400;
   letter-spacing: 0;
   line-height: 20px;

!important; }

.mdl-mega-footer--link-list a, .mdl-mega-footer__link-list a { 

   color: inherit;
   text-decoration: none;
   white-space: nowrap;

!important; }

@media screen and (min-width: 760px) { 

   .mdl-mega-footer--heading-checkbox, .mdl-mega-footer__heading-checkbox {
       display: none
   }

   .mdl-mega-footer--heading-checkbox + .mdl-mega-footer--heading:after, .mdl-mega-footer--heading-checkbox + .mdl-mega-footer__heading:after, .mdl-mega-footer__heading-checkbox + .mdl-mega-footer--heading:after, .mdl-mega-footer__heading-checkbox + .mdl-mega-footer__heading:after {
       content: 
   }

   .mdl-mega-footer--heading-checkbox:checked ~ .mdl-mega-footer--link-list, .mdl-mega-footer--heading-checkbox:checked ~ .mdl-mega-footer__link-list, .mdl-mega-footer--heading-checkbox:checked + .mdl-mega-footer__heading + .mdl-mega-footer__link-list, .mdl-mega-footer--heading-checkbox:checked + .mdl-mega-footer--heading + .mdl-mega-footer--link-list, .mdl-mega-footer__heading-checkbox:checked ~ .mdl-mega-footer--link-list, .mdl-mega-footer__heading-checkbox:checked ~ .mdl-mega-footer__link-list, .mdl-mega-footer__heading-checkbox:checked + .mdl-mega-footer__heading + .mdl-mega-footer__link-list, .mdl-mega-footer__heading-checkbox:checked + .mdl-mega-footer--heading + .mdl-mega-footer--link-list {
       display: block
   }

   .mdl-mega-footer--heading-checkbox:checked + .mdl-mega-footer--heading:after, .mdl-mega-footer--heading-checkbox:checked + .mdl-mega-footer__heading:after, .mdl-mega-footer__heading-checkbox:checked + .mdl-mega-footer--heading:after, .mdl-mega-footer__heading-checkbox:checked + .mdl-mega-footer__heading:after {
       content: 
   }

}

.mdl-mega-footer--bottom-section, .mdl-mega-footer__bottom-section { 

   padding-top: 16px;
   margin-bottom: 16px

}

.mdl-logo { 

   margin-bottom: 16px;
   color: #fff

}

.mdl-mega-footer--bottom-section .mdl-mega-footer--link-list li, .mdl-mega-footer__bottom-section .mdl-mega-footer__link-list li { 

   float: left;
   margin-bottom: 0;
   margin-right: 16px

}

@media screen and (min-width: 760px) { 

   .mdl-logo {
       float: left;
       margin-bottom: 0;
       margin-right: 16px
   }

}

.mdl-mini-footer { 

   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
   -webkit-flex-flow: row wrap;
   -ms-flex-flow: row wrap;
   flex-flow: row wrap;
   -webkit-justify-content: space-between;
   -ms-flex-pack: justify;
   justify-content: space-between;
   padding: 32px 16px;
   color: #9e9e9e;
   background-color: #424242

}

.mdl-mini-footer:after { 

   content: ;
   display: block

}

.mdl-mini-footer .mdl-logo { 

   line-height: 36px

}

.mdl-mini-footer--link-list, .mdl-mini-footer__link-list { 

   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
   -webkit-flex-flow: row nowrap;
   -ms-flex-flow: row nowrap;
   flex-flow: row nowrap;
   list-style: none;
   margin: 0;
   padding: 0

}

.mdl-mini-footer--link-list li, .mdl-mini-footer__link-list li { 

   margin-bottom: 0;
   margin-right: 16px

}

@media screen and (min-width: 760px) { 

   .mdl-mini-footer--link-list li, .mdl-mini-footer__link-list li {
       line-height: 36px
   }

}

.mdl-mini-footer--link-list a, .mdl-mini-footer__link-list a { 

   color: inherit;
   text-decoration: none;
   white-space: nowrap

}

.mdl-mini-footer--left-section, .mdl-mini-footer__left-section { 

   display: inline-block;
   -webkit-order: 0;
   -ms-flex-order: 0;
   order: 0

}

.mdl-mini-footer--right-section, .mdl-mini-footer__right-section { 

   display: inline-block;
   -webkit-order: 1;
   -ms-flex-order: 1;
   order: 1

}

.mdl-mini-footer--social-btn, .mdl-mini-footer__social-btn { 

   width: 36px;
   height: 36px;
   padding: 0;
   margin: 0;
   background-color: #9e9e9e;
   border: none

}

/*Color*/

.mdl-color-text--red { 

   color: #f44336 !important

}

.mdl-color--red { 

   background-color: #f44336 !important

}

.mdl-color-text--red-50 { 

   color: #ffebee !important

}

.mdl-color--red-50 { 

   background-color: #ffebee !important

}

.mdl-color-text--red-100 { 

   color: #ffcdd2 !important

}

.mdl-color--red-100 { 

   background-color: #ffcdd2 !important

}

.mdl-color-text--red-200 { 

   color: #ef9a9a !important

}

.mdl-color--red-200 { 

   background-color: #ef9a9a !important

}

.mdl-color-text--red-300 { 

   color: #e57373 !important

}

.mdl-color--red-300 { 

   background-color: #e57373 !important

}

.mdl-color-text--red-400 { 

   color: #ef5350 !important

}

.mdl-color--red-400 { 

   background-color: #ef5350 !important

}

.mdl-color-text--red-500 { 

   color: #f44336 !important

}

.mdl-color--red-500 { 

   background-color: #f44336 !important

}

.mdl-color-text--red-600 { 

   color: #e53935 !important

}

.mdl-color--red-600 { 

   background-color: #e53935 !important

}

.mdl-color-text--red-700 { 

   color: #d32f2f !important

}

.mdl-color--red-700 { 

   background-color: #d32f2f !important

}

.mdl-color-text--red-800 { 

   color: #c62828 !important

}

.mdl-color--red-800 { 

   background-color: #c62828 !important

}

.mdl-color-text--red-900 { 

   color: #b71c1c !important

}

.mdl-color--red-900 { 

   background-color: #b71c1c !important

}

.mdl-color-text--red-A100 { 

   color: #ff8a80 !important

}

.mdl-color--red-A100 { 

   background-color: #ff8a80 !important

}

.mdl-color-text--red-A200 { 

   color: #ff5252 !important

}

.mdl-color--red-A200 { 

   background-color: #ff5252 !important

}

.mdl-color-text--red-A400 { 

   color: #ff1744 !important

}

.mdl-color--red-A400 { 

   background-color: #ff1744 !important

}

.mdl-color-text--red-A700 { 

   color: #d50000 !important

}

.mdl-color--red-A700 { 

   background-color: #d50000 !important

}

.mdl-color-text--pink { 

   color: #e91e63 !important

}

.mdl-color--pink { 

   background-color: #e91e63 !important

}

.mdl-color-text--pink-50 { 

   color: #fce4ec !important

}

.mdl-color--pink-50 { 

   background-color: #fce4ec !important

}

.mdl-color-text--pink-100 { 

   color: #f8bbd0 !important

}

.mdl-color--pink-100 { 

   background-color: #f8bbd0 !important

}

.mdl-color-text--pink-200 { 

   color: #f48fb1 !important

}

.mdl-color--pink-200 { 

   background-color: #f48fb1 !important

}

.mdl-color-text--pink-300 { 

   color: #f06292 !important

}

.mdl-color--pink-300 { 

   background-color: #f06292 !important

}

.mdl-color-text--pink-400 { 

   color: #ec407a !important

}

.mdl-color--pink-400 { 

   background-color: #ec407a !important

}

.mdl-color-text--pink-500 { 

   color: #e91e63 !important

}

.mdl-color--pink-500 { 

   background-color: #e91e63 !important

}

.mdl-color-text--pink-600 { 

   color: #d81b60 !important

}

.mdl-color--pink-600 { 

   background-color: #d81b60 !important

}

.mdl-color-text--pink-700 { 

   color: #c2185b !important

}

.mdl-color--pink-700 { 

   background-color: #c2185b !important

}

.mdl-color-text--pink-800 { 

   color: #ad1457 !important

}

.mdl-color--pink-800 { 

   background-color: #ad1457 !important

}

.mdl-color-text--pink-900 { 

   color: #880e4f !important

}

.mdl-color--pink-900 { 

   background-color: #880e4f !important

}

.mdl-color-text--pink-A100 { 

   color: #ff80ab !important

}

.mdl-color--pink-A100 { 

   background-color: #ff80ab !important

}

.mdl-color-text--pink-A200 { 

   color: #ff4081 !important

}

.mdl-color--pink-A200 { 

   background-color: #ff4081 !important

}

.mdl-color-text--pink-A400 { 

   color: #f50057 !important

}

.mdl-color--pink-A400 { 

   background-color: #f50057 !important

}

.mdl-color-text--pink-A700 { 

   color: #c51162 !important

}

.mdl-color--pink-A700 { 

   background-color: #c51162 !important

}

.mdl-color-text--purple { 

   color: #9c27b0 !important

}

.mdl-color--purple { 

   background-color: #9c27b0 !important

}

.mdl-color-text--purple-50 { 

   color: #f3e5f5 !important

}

.mdl-color--purple-50 { 

   background-color: #f3e5f5 !important

}

.mdl-color-text--purple-100 { 

   color: #e1bee7 !important

}

.mdl-color--purple-100 { 

   background-color: #e1bee7 !important

}

.mdl-color-text--purple-200 { 

   color: #ce93d8 !important

}

.mdl-color--purple-200 { 

   background-color: #ce93d8 !important

}

.mdl-color-text--purple-300 { 

   color: #ba68c8 !important

}

.mdl-color--purple-300 { 

   background-color: #ba68c8 !important

}

.mdl-color-text--purple-400 { 

   color: #ab47bc !important

}

.mdl-color--purple-400 { 

   background-color: #ab47bc !important

}

.mdl-color-text--purple-500 { 

   color: #9c27b0 !important

}

.mdl-color--purple-500 { 

   background-color: #9c27b0 !important

}

.mdl-color-text--purple-600 { 

   color: #8e24aa !important

}

.mdl-color--purple-600 { 

   background-color: #8e24aa !important

}

.mdl-color-text--purple-700 { 

   color: #7b1fa2 !important

}

.mdl-color--purple-700 { 

   background-color: #7b1fa2 !important

}

.mdl-color-text--purple-800 { 

   color: #6a1b9a !important

}

.mdl-color--purple-800 { 

   background-color: #6a1b9a !important

}

.mdl-color-text--purple-900 { 

   color: #4a148c !important

}

.mdl-color--purple-900 { 

   background-color: #4a148c !important

}

.mdl-color-text--purple-A100 { 

   color: #ea80fc !important

}

.mdl-color--purple-A100 { 

   background-color: #ea80fc !important

}

.mdl-color-text--purple-A200 { 

   color: #e040fb !important

}

.mdl-color--purple-A200 { 

   background-color: #e040fb !important

}

.mdl-color-text--purple-A400 { 

   color: #d500f9 !important

}

.mdl-color--purple-A400 { 

   background-color: #d500f9 !important

}

.mdl-color-text--purple-A700 { 

   color: #a0f !important

}

.mdl-color--purple-A700 { 

   background-color: #a0f !important

}

.mdl-color-text--deep-purple { 

   color: #673ab7 !important

}

.mdl-color--deep-purple { 

   background-color: #673ab7 !important

}

.mdl-color-text--deep-purple-50 { 

   color: #ede7f6 !important

}

.mdl-color--deep-purple-50 { 

   background-color: #ede7f6 !important

}

.mdl-color-text--deep-purple-100 { 

   color: #d1c4e9 !important

}

.mdl-color--deep-purple-100 { 

   background-color: #d1c4e9 !important

}

.mdl-color-text--deep-purple-200 { 

   color: #b39ddb !important

}

.mdl-color--deep-purple-200 { 

   background-color: #b39ddb !important

}

.mdl-color-text--deep-purple-300 { 

   color: #9575cd !important

}

.mdl-color--deep-purple-300 { 

   background-color: #9575cd !important

}

.mdl-color-text--deep-purple-400 { 

   color: #7e57c2 !important

}

.mdl-color--deep-purple-400 { 

   background-color: #7e57c2 !important

}

.mdl-color-text--deep-purple-500 { 

   color: #673ab7 !important

}

.mdl-color--deep-purple-500 { 

   background-color: #673ab7 !important

}

.mdl-color-text--deep-purple-600 { 

   color: #5e35b1 !important

}

.mdl-color--deep-purple-600 { 

   background-color: #5e35b1 !important

}

.mdl-color-text--deep-purple-700 { 

   color: #512da8 !important

}

.mdl-color--deep-purple-700 { 

   background-color: #512da8 !important

}

.mdl-color-text--deep-purple-800 { 

   color: #4527a0 !important

}

.mdl-color--deep-purple-800 { 

   background-color: #4527a0 !important

}

.mdl-color-text--deep-purple-900 { 

   color: #311b92 !important

}

.mdl-color--deep-purple-900 { 

   background-color: #311b92 !important

}

.mdl-color-text--deep-purple-A100 { 

   color: #b388ff !important

}

.mdl-color--deep-purple-A100 { 

   background-color: #b388ff !important

}

.mdl-color-text--deep-purple-A200 { 

   color: #7c4dff !important

}

.mdl-color--deep-purple-A200 { 

   background-color: #7c4dff !important

}

.mdl-color-text--deep-purple-A400 { 

   color: #651fff !important

}

.mdl-color--deep-purple-A400 { 

   background-color: #651fff !important

}

.mdl-color-text--deep-purple-A700 { 

   color: #6200ea !important

}

.mdl-color--deep-purple-A700 { 

   background-color: #6200ea !important

}

.mdl-color-text--indigo { 

   color: #3f51b5 !important

}

.mdl-color--indigo { 

   background-color: #3f51b5 !important

}

.mdl-color-text--indigo-50 { 

   color: #e8eaf6 !important

}

.mdl-color--indigo-50 { 

   background-color: #e8eaf6 !important

}

.mdl-color-text--indigo-100 { 

   color: #c5cae9 !important

}

.mdl-color--indigo-100 { 

   background-color: #c5cae9 !important

}

.mdl-color-text--indigo-200 { 

   color: #9fa8da !important

}

.mdl-color--indigo-200 { 

   background-color: #9fa8da !important

}

.mdl-color-text--indigo-300 { 

   color: #7986cb !important

}

.mdl-color--indigo-300 { 

   background-color: #7986cb !important

}

.mdl-color-text--indigo-400 { 

   color: #5c6bc0 !important

}

.mdl-color--indigo-400 { 

   background-color: #5c6bc0 !important

}

.mdl-color-text--indigo-500 { 

   color: #3f51b5 !important

}

.mdl-color--indigo-500 { 

   background-color: #3f51b5 !important

}

.mdl-color-text--indigo-600 { 

   color: #3949ab !important

}

.mdl-color--indigo-600 { 

   background-color: #3949ab !important

}

.mdl-color-text--indigo-700 { 

   color: #303f9f !important

}

.mdl-color--indigo-700 { 

   background-color: #303f9f !important

}

.mdl-color-text--indigo-800 { 

   color: #283593 !important

}

.mdl-color--indigo-800 { 

   background-color: #283593 !important

}

.mdl-color-text--indigo-900 { 

   color: #1a237e !important

}

.mdl-color--indigo-900 { 

   background-color: #1a237e !important

}

.mdl-color-text--indigo-A100 { 

   color: #8c9eff !important

}

.mdl-color--indigo-A100 { 

   background-color: #8c9eff !important

}

.mdl-color-text--indigo-A200 { 

   color: #536dfe !important

}

.mdl-color--indigo-A200 { 

   background-color: #536dfe !important

}

.mdl-color-text--indigo-A400 { 

   color: #3d5afe !important

}

.mdl-color--indigo-A400 { 

   background-color: #3d5afe !important

}

.mdl-color-text--indigo-A700 { 

   color: #304ffe !important

}

.mdl-color--indigo-A700 { 

   background-color: #304ffe !important

}

.mdl-color-text--blue { 

   color: #2196f3 !important

}

.mdl-color--blue { 

   background-color: #2196f3 !important

}

.mdl-color-text--blue-50 { 

   color: #e3f2fd !important

}

.mdl-color--blue-50 { 

   background-color: #e3f2fd !important

}

.mdl-color-text--blue-100 { 

   color: #bbdefb !important

}

.mdl-color--blue-100 { 

   background-color: #bbdefb !important

}

.mdl-color-text--blue-200 { 

   color: #90caf9 !important

}

.mdl-color--blue-200 { 

   background-color: #90caf9 !important

}

.mdl-color-text--blue-300 { 

   color: #64b5f6 !important

}

.mdl-color--blue-300 { 

   background-color: #64b5f6 !important

}

.mdl-color-text--blue-400 { 

   color: #42a5f5 !important

}

.mdl-color--blue-400 { 

   background-color: #42a5f5 !important

}

.mdl-color-text--blue-500 { 

   color: #2196f3 !important

}

.mdl-color--blue-500 { 

   background-color: #2196f3 !important

}

.mdl-color-text--blue-600 { 

   color: #1e88e5 !important

}

.mdl-color--blue-600 { 

   background-color: #1e88e5 !important

}

.mdl-color-text--blue-700 { 

   color: #1976d2 !important

}

.mdl-color--blue-700 { 

   background-color: #1976d2 !important

}

.mdl-color-text--blue-800 { 

   color: #1565c0 !important

}

.mdl-color--blue-800 { 

   background-color: #1565c0 !important

}

.mdl-color-text--blue-900 { 

   color: #0d47a1 !important

}

.mdl-color--blue-900 { 

   background-color: #0d47a1 !important

}

.mdl-color-text--blue-A100 { 

   color: #82b1ff !important

}

.mdl-color--blue-A100 { 

   background-color: #82b1ff !important

}

.mdl-color-text--blue-A200 { 

   color: #448aff !important

}

.mdl-color--blue-A200 { 

   background-color: #448aff !important

}

.mdl-color-text--blue-A400 { 

   color: #2979ff !important

}

.mdl-color--blue-A400 { 

   background-color: #2979ff !important

}

.mdl-color-text--blue-A700 { 

   color: #2962ff !important

}

.mdl-color--blue-A700 { 

   background-color: #2962ff !important

}

.mdl-color-text--light-blue { 

   color: #03a9f4 !important

}

.mdl-color--light-blue { 

   background-color: #03a9f4 !important

}

.mdl-color-text--light-blue-50 { 

   color: #e1f5fe !important

}

.mdl-color--light-blue-50 { 

   background-color: #e1f5fe !important

}

.mdl-color-text--light-blue-100 { 

   color: #b3e5fc !important

}

.mdl-color--light-blue-100 { 

   background-color: #b3e5fc !important

}

.mdl-color-text--light-blue-200 { 

   color: #81d4fa !important

}

.mdl-color--light-blue-200 { 

   background-color: #81d4fa !important

}

.mdl-color-text--light-blue-300 { 

   color: #4fc3f7 !important

}

.mdl-color--light-blue-300 { 

   background-color: #4fc3f7 !important

}

.mdl-color-text--light-blue-400 { 

   color: #29b6f6 !important

}

.mdl-color--light-blue-400 { 

   background-color: #29b6f6 !important

}

.mdl-color-text--light-blue-500 { 

   color: #03a9f4 !important

}

.mdl-color--light-blue-500 { 

   background-color: #03a9f4 !important

}

.mdl-color-text--light-blue-600 { 

   color: #039be5 !important

}

.mdl-color--light-blue-600 { 

   background-color: #039be5 !important

}

.mdl-color-text--light-blue-700 { 

   color: #0288d1 !important

}

.mdl-color--light-blue-700 { 

   background-color: #0288d1 !important

}

.mdl-color-text--light-blue-800 { 

   color: #0277bd !important

}

.mdl-color--light-blue-800 { 

   background-color: #0277bd !important

}

.mdl-color-text--light-blue-900 { 

   color: #01579b !important

}

.mdl-color--light-blue-900 { 

   background-color: #01579b !important

}

.mdl-color-text--light-blue-A100 { 

   color: #80d8ff !important

}

.mdl-color--light-blue-A100 { 

   background-color: #80d8ff !important

}

.mdl-color-text--light-blue-A200 { 

   color: #40c4ff !important

}

.mdl-color--light-blue-A200 { 

   background-color: #40c4ff !important

}

.mdl-color-text--light-blue-A400 { 

   color: #00b0ff !important

}

.mdl-color--light-blue-A400 { 

   background-color: #00b0ff !important

}

.mdl-color-text--light-blue-A700 { 

   color: #0091ea !important

}

.mdl-color--light-blue-A700 { 

   background-color: #0091ea !important

}

.mdl-color-text--cyan { 

   color: #00bcd4 !important

}

.mdl-color--cyan { 

   background-color: #00bcd4 !important

}

.mdl-color-text--cyan-50 { 

   color: #e0f7fa !important

}

.mdl-color--cyan-50 { 

   background-color: #e0f7fa !important

}

.mdl-color-text--cyan-100 { 

   color: #b2ebf2 !important

}

.mdl-color--cyan-100 { 

   background-color: #b2ebf2 !important

}

.mdl-color-text--cyan-200 { 

   color: #80deea !important

}

.mdl-color--cyan-200 { 

   background-color: #80deea !important

}

.mdl-color-text--cyan-300 { 

   color: #4dd0e1 !important

}

.mdl-color--cyan-300 { 

   background-color: #4dd0e1 !important

}

.mdl-color-text--cyan-400 { 

   color: #26c6da !important

}

.mdl-color--cyan-400 { 

   background-color: #26c6da !important

}

.mdl-color-text--cyan-500 { 

   color: #00bcd4 !important

}

.mdl-color--cyan-500 { 

   background-color: #00bcd4 !important

}

.mdl-color-text--cyan-600 { 

   color: #00acc1 !important

}

.mdl-color--cyan-600 { 

   background-color: #00acc1 !important

}

.mdl-color-text--cyan-700 { 

   color: #0097a7 !important

}

.mdl-color--cyan-700 { 

   background-color: #0097a7 !important

}

.mdl-color-text--cyan-800 { 

   color: #00838f !important

}

.mdl-color--cyan-800 { 

   background-color: #00838f !important

}

.mdl-color-text--cyan-900 { 

   color: #006064 !important

}

.mdl-color--cyan-900 { 

   background-color: #006064 !important

}

.mdl-color-text--cyan-A100 { 

   color: #84ffff !important

}

.mdl-color--cyan-A100 { 

   background-color: #84ffff !important

}

.mdl-color-text--cyan-A200 { 

   color: #18ffff !important

}

.mdl-color--cyan-A200 { 

   background-color: #18ffff !important

}

.mdl-color-text--cyan-A400 { 

   color: #00e5ff !important

}

.mdl-color--cyan-A400 { 

   background-color: #00e5ff !important

}

.mdl-color-text--cyan-A700 { 

   color: #00b8d4 !important

}

.mdl-color--cyan-A700 { 

   background-color: #00b8d4 !important

}

.mdl-color-text--teal { 

   color: #009688 !important

}

.mdl-color--teal { 

   background-color: #009688 !important

}

.mdl-color-text--teal-50 { 

   color: #e0f2f1 !important

}

.mdl-color--teal-50 { 

   background-color: #e0f2f1 !important

}

.mdl-color-text--teal-100 { 

   color: #b2dfdb !important

}

.mdl-color--teal-100 { 

   background-color: #b2dfdb !important

}

.mdl-color-text--teal-200 { 

   color: #80cbc4 !important

}

.mdl-color--teal-200 { 

   background-color: #80cbc4 !important

}

.mdl-color-text--teal-300 { 

   color: #4db6ac !important

}

.mdl-color--teal-300 { 

   background-color: #4db6ac !important

}

.mdl-color-text--teal-400 { 

   color: #26a69a !important

}

.mdl-color--teal-400 { 

   background-color: #26a69a !important

}

.mdl-color-text--teal-500 { 

   color: #009688 !important

}

.mdl-color--teal-500 { 

   background-color: #009688 !important

}

.mdl-color-text--teal-600 { 

   color: #00897b !important

}

.mdl-color--teal-600 { 

   background-color: #00897b !important

}

.mdl-color-text--teal-700 { 

   color: #00796b !important

}

.mdl-color--teal-700 { 

   background-color: #00796b !important

}

.mdl-color-text--teal-800 { 

   color: #00695c !important

}

.mdl-color--teal-800 { 

   background-color: #00695c !important

}

.mdl-color-text--teal-900 { 

   color: #004d40 !important

}

.mdl-color--teal-900 { 

   background-color: #004d40 !important

}

.mdl-color-text--teal-A100 { 

   color: #a7ffeb !important

}

.mdl-color--teal-A100 { 

   background-color: #a7ffeb !important

}

.mdl-color-text--teal-A200 { 

   color: #64ffda !important

}

.mdl-color--teal-A200 { 

   background-color: #64ffda !important

}

.mdl-color-text--teal-A400 { 

   color: #1de9b6 !important

}

.mdl-color--teal-A400 { 

   background-color: #1de9b6 !important

}

.mdl-color-text--teal-A700 { 

   color: #00bfa5 !important

}

.mdl-color--teal-A700 { 

   background-color: #00bfa5 !important

}

.mdl-color-text--green { 

   color: #4caf50 !important

}

.mdl-color--green { 

   background-color: #4caf50 !important

}

.mdl-color-text--green-50 { 

   color: #e8f5e9 !important

}

.mdl-color--green-50 { 

   background-color: #e8f5e9 !important

}

.mdl-color-text--green-100 { 

   color: #c8e6c9 !important

}

.mdl-color--green-100 { 

   background-color: #c8e6c9 !important

}

.mdl-color-text--green-200 { 

   color: #a5d6a7 !important

}

.mdl-color--green-200 { 

   background-color: #a5d6a7 !important

}

.mdl-color-text--green-300 { 

   color: #81c784 !important

}

.mdl-color--green-300 { 

   background-color: #81c784 !important

}

.mdl-color-text--green-400 { 

   color: #66bb6a !important

}

.mdl-color--green-400 { 

   background-color: #66bb6a !important

}

.mdl-color-text--green-500 { 

   color: #4caf50 !important

}

.mdl-color--green-500 { 

   background-color: #4caf50 !important

}

.mdl-color-text--green-600 { 

   color: #43a047 !important

}

.mdl-color--green-600 { 

   background-color: #43a047 !important

}

.mdl-color-text--green-700 { 

   color: #388e3c !important

}

.mdl-color--green-700 { 

   background-color: #388e3c !important

}

.mdl-color-text--green-800 { 

   color: #2e7d32 !important

}

.mdl-color--green-800 { 

   background-color: #2e7d32 !important

}

.mdl-color-text--green-900 { 

   color: #1b5e20 !important

}

.mdl-color--green-900 { 

   background-color: #1b5e20 !important

}

.mdl-color-text--green-A100 { 

   color: #b9f6ca !important

}

.mdl-color--green-A100 { 

   background-color: #b9f6ca !important

}

.mdl-color-text--green-A200 { 

   color: #69f0ae !important

}

.mdl-color--green-A200 { 

   background-color: #69f0ae !important

}

.mdl-color-text--green-A400 { 

   color: #00e676 !important

}

.mdl-color--green-A400 { 

   background-color: #00e676 !important

}

.mdl-color-text--green-A700 { 

   color: #00c853 !important

}

.mdl-color--green-A700 { 

   background-color: #00c853 !important

}

.mdl-color-text--light-green { 

   color: #8bc34a !important

}

.mdl-color--light-green { 

   background-color: #8bc34a !important

}

.mdl-color-text--light-green-50 { 

   color: #f1f8e9 !important

}

.mdl-color--light-green-50 { 

   background-color: #f1f8e9 !important

}

.mdl-color-text--light-green-100 { 

   color: #dcedc8 !important

}

.mdl-color--light-green-100 { 

   background-color: #dcedc8 !important

}

.mdl-color-text--light-green-200 { 

   color: #c5e1a5 !important

}

.mdl-color--light-green-200 { 

   background-color: #c5e1a5 !important

}

.mdl-color-text--light-green-300 { 

   color: #aed581 !important

}

.mdl-color--light-green-300 { 

   background-color: #aed581 !important

}

.mdl-color-text--light-green-400 { 

   color: #9ccc65 !important

}

.mdl-color--light-green-400 { 

   background-color: #9ccc65 !important

}

.mdl-color-text--light-green-500 { 

   color: #8bc34a !important

}

.mdl-color--light-green-500 { 

   background-color: #8bc34a !important

}

.mdl-color-text--light-green-600 { 

   color: #7cb342 !important

}

.mdl-color--light-green-600 { 

   background-color: #7cb342 !important

}

.mdl-color-text--light-green-700 { 

   color: #689f38 !important

}

.mdl-color--light-green-700 { 

   background-color: #689f38 !important

}

.mdl-color-text--light-green-800 { 

   color: #558b2f !important

}

.mdl-color--light-green-800 { 

   background-color: #558b2f !important

}

.mdl-color-text--light-green-900 { 

   color: #33691e !important

}

.mdl-color--light-green-900 { 

   background-color: #33691e !important

}

.mdl-color-text--light-green-A100 { 

   color: #ccff90 !important

}

.mdl-color--light-green-A100 { 

   background-color: #ccff90 !important

}

.mdl-color-text--light-green-A200 { 

   color: #b2ff59 !important

}

.mdl-color--light-green-A200 { 

   background-color: #b2ff59 !important

}

.mdl-color-text--light-green-A400 { 

   color: #76ff03 !important

}

.mdl-color--light-green-A400 { 

   background-color: #76ff03 !important

}

.mdl-color-text--light-green-A700 { 

   color: #64dd17 !important

}

.mdl-color--light-green-A700 { 

   background-color: #64dd17 !important

}

.mdl-color-text--lime { 

   color: #cddc39 !important

}

.mdl-color--lime { 

   background-color: #cddc39 !important

}

.mdl-color-text--lime-50 { 

   color: #f9fbe7 !important

}

.mdl-color--lime-50 { 

   background-color: #f9fbe7 !important

}

.mdl-color-text--lime-100 { 

   color: #f0f4c3 !important

}

.mdl-color--lime-100 { 

   background-color: #f0f4c3 !important

}

.mdl-color-text--lime-200 { 

   color: #e6ee9c !important

}

.mdl-color--lime-200 { 

   background-color: #e6ee9c !important

}

.mdl-color-text--lime-300 { 

   color: #dce775 !important

}

.mdl-color--lime-300 { 

   background-color: #dce775 !important

}

.mdl-color-text--lime-400 { 

   color: #d4e157 !important

}

.mdl-color--lime-400 { 

   background-color: #d4e157 !important

}

.mdl-color-text--lime-500 { 

   color: #cddc39 !important

}

.mdl-color--lime-500 { 

   background-color: #cddc39 !important

}

.mdl-color-text--lime-600 { 

   color: #c0ca33 !important

}

.mdl-color--lime-600 { 

   background-color: #c0ca33 !important

}

.mdl-color-text--lime-700 { 

   color: #afb42b !important

}

.mdl-color--lime-700 { 

   background-color: #afb42b !important

}

.mdl-color-text--lime-800 { 

   color: #9e9d24 !important

}

.mdl-color--lime-800 { 

   background-color: #9e9d24 !important

}

.mdl-color-text--lime-900 { 

   color: #827717 !important

}

.mdl-color--lime-900 { 

   background-color: #827717 !important

}

.mdl-color-text--lime-A100 { 

   color: #f4ff81 !important

}

.mdl-color--lime-A100 { 

   background-color: #f4ff81 !important

}

.mdl-color-text--lime-A200 { 

   color: #eeff41 !important

}

.mdl-color--lime-A200 { 

   background-color: #eeff41 !important

}

.mdl-color-text--lime-A400 { 

   color: #c6ff00 !important

}

.mdl-color--lime-A400 { 

   background-color: #c6ff00 !important

}

.mdl-color-text--lime-A700 { 

   color: #aeea00 !important

}

.mdl-color--lime-A700 { 

   background-color: #aeea00 !important

}

.mdl-color-text--yellow { 

   color: #ffeb3b !important

}

.mdl-color--yellow { 

   background-color: #ffeb3b !important

}

.mdl-color-text--yellow-50 { 

   color: #fffde7 !important

}

.mdl-color--yellow-50 { 

   background-color: #fffde7 !important

}

.mdl-color-text--yellow-100 { 

   color: #fff9c4 !important

}

.mdl-color--yellow-100 { 

   background-color: #fff9c4 !important

}

.mdl-color-text--yellow-200 { 

   color: #fff59d !important

}

.mdl-color--yellow-200 { 

   background-color: #fff59d !important

}

.mdl-color-text--yellow-300 { 

   color: #fff176 !important

}

.mdl-color--yellow-300 { 

   background-color: #fff176 !important

}

.mdl-color-text--yellow-400 { 

   color: #ffee58 !important

}

.mdl-color--yellow-400 { 

   background-color: #ffee58 !important

}

.mdl-color-text--yellow-500 { 

   color: #ffeb3b !important

}

.mdl-color--yellow-500 { 

   background-color: #ffeb3b !important

}

.mdl-color-text--yellow-600 { 

   color: #fdd835 !important

}

.mdl-color--yellow-600 { 

   background-color: #fdd835 !important

}

.mdl-color-text--yellow-700 { 

   color: #fbc02d !important

}

.mdl-color--yellow-700 { 

   background-color: #fbc02d !important

}

.mdl-color-text--yellow-800 { 

   color: #f9a825 !important

}

.mdl-color--yellow-800 { 

   background-color: #f9a825 !important

}

.mdl-color-text--yellow-900 { 

   color: #f57f17 !important

}

.mdl-color--yellow-900 { 

   background-color: #f57f17 !important

}

.mdl-color-text--yellow-A100 { 

   color: #ffff8d !important

}

.mdl-color--yellow-A100 { 

   background-color: #ffff8d !important

}

.mdl-color-text--yellow-A200 { 

   color: #ff0 !important

}

.mdl-color--yellow-A200 { 

   background-color: #ff0 !important

}

.mdl-color-text--yellow-A400 { 

   color: #ffea00 !important

}

.mdl-color--yellow-A400 { 

   background-color: #ffea00 !important

}

.mdl-color-text--yellow-A700 { 

   color: #ffd600 !important

}

.mdl-color--yellow-A700 { 

   background-color: #ffd600 !important

}

.mdl-color-text--amber { 

   color: #ffc107 !important

}

.mdl-color--amber { 

   background-color: #ffc107 !important

}

.mdl-color-text--amber-50 { 

   color: #fff8e1 !important

}

.mdl-color--amber-50 { 

   background-color: #fff8e1 !important

}

.mdl-color-text--amber-100 { 

   color: #ffecb3 !important

}

.mdl-color--amber-100 { 

   background-color: #ffecb3 !important

}

.mdl-color-text--amber-200 { 

   color: #ffe082 !important

}

.mdl-color--amber-200 { 

   background-color: #ffe082 !important

}

.mdl-color-text--amber-300 { 

   color: #ffd54f !important

}

.mdl-color--amber-300 { 

   background-color: #ffd54f !important

}

.mdl-color-text--amber-400 { 

   color: #ffca28 !important

}

.mdl-color--amber-400 { 

   background-color: #ffca28 !important

}

.mdl-color-text--amber-500 { 

   color: #ffc107 !important

}

.mdl-color--amber-500 { 

   background-color: #ffc107 !important

}

.mdl-color-text--amber-600 { 

   color: #ffb300 !important

}

.mdl-color--amber-600 { 

   background-color: #ffb300 !important

}

.mdl-color-text--amber-700 { 

   color: #ffa000 !important

}

.mdl-color--amber-700 { 

   background-color: #ffa000 !important

}

.mdl-color-text--amber-800 { 

   color: #ff8f00 !important

}

.mdl-color--amber-800 { 

   background-color: #ff8f00 !important

}

.mdl-color-text--amber-900 { 

   color: #ff6f00 !important

}

.mdl-color--amber-900 { 

   background-color: #ff6f00 !important

}

.mdl-color-text--amber-A100 { 

   color: #ffe57f !important

}

.mdl-color--amber-A100 { 

   background-color: #ffe57f !important

}

.mdl-color-text--amber-A200 { 

   color: #ffd740 !important

}

.mdl-color--amber-A200 { 

   background-color: #ffd740 !important

}

.mdl-color-text--amber-A400 { 

   color: #ffc400 !important

}

.mdl-color--amber-A400 { 

   background-color: #ffc400 !important

}

.mdl-color-text--amber-A700 { 

   color: #ffab00 !important

}

.mdl-color--amber-A700 { 

   background-color: #ffab00 !important

}

.mdl-color-text--orange { 

   color: #ff9800 !important

}

.mdl-color--orange { 

   background-color: #ff9800 !important

}

.mdl-color-text--orange-50 { 

   color: #fff3e0 !important

}

.mdl-color--orange-50 { 

   background-color: #fff3e0 !important

}

.mdl-color-text--orange-100 { 

   color: #ffe0b2 !important

}

.mdl-color--orange-100 { 

   background-color: #ffe0b2 !important

}

.mdl-color-text--orange-200 { 

   color: #ffcc80 !important

}

.mdl-color--orange-200 { 

   background-color: #ffcc80 !important

}

.mdl-color-text--orange-300 { 

   color: #ffb74d !important

}

.mdl-color--orange-300 { 

   background-color: #ffb74d !important

}

.mdl-color-text--orange-400 { 

   color: #ffa726 !important

}

.mdl-color--orange-400 { 

   background-color: #ffa726 !important

}

.mdl-color-text--orange-500 { 

   color: #ff9800 !important

}

.mdl-color--orange-500 { 

   background-color: #ff9800 !important

}

.mdl-color-text--orange-600 { 

   color: #fb8c00 !important

}

.mdl-color--orange-600 { 

   background-color: #fb8c00 !important

}

.mdl-color-text--orange-700 { 

   color: #f57c00 !important

}

.mdl-color--orange-700 { 

   background-color: #f57c00 !important

}

.mdl-color-text--orange-800 { 

   color: #ef6c00 !important

}

.mdl-color--orange-800 { 

   background-color: #ef6c00 !important

}

.mdl-color-text--orange-900 { 

   color: #e65100 !important

}

.mdl-color--orange-900 { 

   background-color: #e65100 !important

}

.mdl-color-text--orange-A100 { 

   color: #ffd180 !important

}

.mdl-color--orange-A100 { 

   background-color: #ffd180 !important

}

.mdl-color-text--orange-A200 { 

   color: #ffab40 !important

}

.mdl-color--orange-A200 { 

   background-color: #ffab40 !important

}

.mdl-color-text--orange-A400 { 

   color: #ff9100 !important

}

.mdl-color--orange-A400 { 

   background-color: #ff9100 !important

}

.mdl-color-text--orange-A700 { 

   color: #ff6d00 !important

}

.mdl-color--orange-A700 { 

   background-color: #ff6d00 !important

}

.mdl-color-text--deep-orange { 

   color: #ff5722 !important

}

.mdl-color--deep-orange { 

   background-color: #ff5722 !important

}

.mdl-color-text--deep-orange-50 { 

   color: #fbe9e7 !important

}

.mdl-color--deep-orange-50 { 

   background-color: #fbe9e7 !important

}

.mdl-color-text--deep-orange-100 { 

   color: #ffccbc !important

}

.mdl-color--deep-orange-100 { 

   background-color: #ffccbc !important

}

.mdl-color-text--deep-orange-200 { 

   color: #ffab91 !important

}

.mdl-color--deep-orange-200 { 

   background-color: #ffab91 !important

}

.mdl-color-text--deep-orange-300 { 

   color: #ff8a65 !important

}

.mdl-color--deep-orange-300 { 

   background-color: #ff8a65 !important

}

.mdl-color-text--deep-orange-400 { 

   color: #ff7043 !important

}

.mdl-color--deep-orange-400 { 

   background-color: #ff7043 !important

}

.mdl-color-text--deep-orange-500 { 

   color: #ff5722 !important

}

.mdl-color--deep-orange-500 { 

   background-color: #ff5722 !important

}

.mdl-color-text--deep-orange-600 { 

   color: #f4511e !important

}

.mdl-color--deep-orange-600 { 

   background-color: #f4511e !important

}

.mdl-color-text--deep-orange-700 { 

   color: #e64a19 !important

}

.mdl-color--deep-orange-700 { 

   background-color: #e64a19 !important

}

.mdl-color-text--deep-orange-800 { 

   color: #d84315 !important

}

.mdl-color--deep-orange-800 { 

   background-color: #d84315 !important

}

.mdl-color-text--deep-orange-900 { 

   color: #bf360c !important

}

.mdl-color--deep-orange-900 { 

   background-color: #bf360c !important

}

.mdl-color-text--deep-orange-A100 { 

   color: #ff9e80 !important

}

.mdl-color--deep-orange-A100 { 

   background-color: #ff9e80 !important

}

.mdl-color-text--deep-orange-A200 { 

   color: #ff6e40 !important

}

.mdl-color--deep-orange-A200 { 

   background-color: #ff6e40 !important

}

.mdl-color-text--deep-orange-A400 { 

   color: #ff3d00 !important

}

.mdl-color--deep-orange-A400 { 

   background-color: #ff3d00 !important

}

.mdl-color-text--deep-orange-A700 { 

   color: #dd2c00 !important

}

.mdl-color--deep-orange-A700 { 

   background-color: #dd2c00 !important

}

.mdl-color-text--brown { 

   color: #795548 !important

}

.mdl-color--brown { 

   background-color: #795548 !important

}

.mdl-color-text--brown-50 { 

   color: #efebe9 !important

}

.mdl-color--brown-50 { 

   background-color: #efebe9 !important

}

.mdl-color-text--brown-100 { 

   color: #d7ccc8 !important

}

.mdl-color--brown-100 { 

   background-color: #d7ccc8 !important

}

.mdl-color-text--brown-200 { 

   color: #bcaaa4 !important

}

.mdl-color--brown-200 { 

   background-color: #bcaaa4 !important

}

.mdl-color-text--brown-300 { 

   color: #a1887f !important

}

.mdl-color--brown-300 { 

   background-color: #a1887f !important

}

.mdl-color-text--brown-400 { 

   color: #8d6e63 !important

}

.mdl-color--brown-400 { 

   background-color: #8d6e63 !important

}

.mdl-color-text--brown-500 { 

   color: #795548 !important

}

.mdl-color--brown-500 { 

   background-color: #795548 !important

}

.mdl-color-text--brown-600 { 

   color: #6d4c41 !important

}

.mdl-color--brown-600 { 

   background-color: #6d4c41 !important

}

.mdl-color-text--brown-700 { 

   color: #5d4037 !important

}

.mdl-color--brown-700 { 

   background-color: #5d4037 !important

}

.mdl-color-text--brown-800 { 

   color: #4e342e !important

}

.mdl-color--brown-800 { 

   background-color: #4e342e !important

}

.mdl-color-text--brown-900 { 

   color: #3e2723 !important

}

.mdl-color--brown-900 { 

   background-color: #3e2723 !important

}

.mdl-color-text--grey { 

   color: #9e9e9e !important

}

.mdl-color--grey { 

   background-color: #9e9e9e !important

}

.mdl-color-text--grey-50 { 

   color: #fafafa !important

}

.mdl-color--grey-50 { 

   background-color: #fafafa !important

}

.mdl-color-text--grey-100 { 

   color: #f5f5f5 !important

}

.mdl-color--grey-100 { 

   background-color: #f5f5f5 !important

}

.mdl-color-text--grey-200 { 

   color: #eee !important

}

.mdl-color--grey-200 { 

   background-color: #eee !important

}

.mdl-color-text--grey-300 { 

   color: #e0e0e0 !important

}

.mdl-color--grey-300 { 

   background-color: #e0e0e0 !important

}

.mdl-color-text--grey-400 { 

   color: #bdbdbd !important

}

.mdl-color--grey-400 { 

   background-color: #bdbdbd !important

}

.mdl-color-text--grey-500 { 

   color: #9e9e9e !important

}

.mdl-color--grey-500 { 

   background-color: #9e9e9e !important

}

.mdl-color-text--grey-600 { 

   color: #757575 !important

}

.mdl-color--grey-600 { 

   background-color: #757575 !important

}

.mdl-color-text--grey-700 { 

   color: #616161 !important

}

.mdl-color--grey-700 { 

   background-color: #616161 !important

}

.mdl-color-text--grey-800 { 

   color: #424242 !important

}

.mdl-color--grey-800 { 

   background-color: #424242 !important

}

.mdl-color-text--grey-900 { 

   color: #212121 !important

}

.mdl-color--grey-900 { 

   background-color: #212121 !important

}

.mdl-color-text--blue-grey { 

   color: #607d8b !important

}

.mdl-color--blue-grey { 

   background-color: #607d8b !important

}

.mdl-color-text--blue-grey-50 { 

   color: #eceff1 !important

}

.mdl-color--blue-grey-50 { 

   background-color: #eceff1 !important

}

.mdl-color-text--blue-grey-100 { 

   color: #cfd8dc !important

}

.mdl-color--blue-grey-100 { 

   background-color: #cfd8dc !important

}

.mdl-color-text--blue-grey-200 { 

   color: #b0bec5 !important

}

.mdl-color--blue-grey-200 { 

   background-color: #b0bec5 !important

}

.mdl-color-text--blue-grey-300 { 

   color: #90a4ae !important

}

.mdl-color--blue-grey-300 { 

   background-color: #90a4ae !important

}

.mdl-color-text--blue-grey-400 { 

   color: #78909c !important

}

.mdl-color--blue-grey-400 { 

   background-color: #78909c !important

}

.mdl-color-text--blue-grey-500 { 

   color: #607d8b !important

}

.mdl-color--blue-grey-500 { 

   background-color: #607d8b !important

}

.mdl-color-text--blue-grey-600 { 

   color: #546e7a !important

}

.mdl-color--blue-grey-600 { 

   background-color: #546e7a !important

}

.mdl-color-text--blue-grey-700 { 

   color: #455a64 !important

}

.mdl-color--blue-grey-700 { 

   background-color: #455a64 !important

}

.mdl-color-text--blue-grey-800 { 

   color: #37474f !important

}

.mdl-color--blue-grey-800 { 

   background-color: #37474f !important

}

.mdl-color-text--blue-grey-900 { 

   color: #263238 !important

}

.mdl-color--blue-grey-900 { 

   background-color: #263238 !important

}

.mdl-color--black { 

   background-color: #000 !important

}

.mdl-color-text--black { 

   color: #000 !important

}

.mdl-color--white { 

   background-color: #fff !important

}

.mdl-color-text--white { 

   color: #fff !important

}

.mdl-color--primary { 

   background-color: #3f51b5 !important

}

.mdl-color--primary-contrast { 

   background-color: #fff !important

}

.mdl-color--primary-dark { 

   background-color: #303f9f !important

}

.mdl-color--accent { 

   background-color: #ff4081 !important

}

.mdl-color--accent-contrast { 

   background-color: #fff !important

}

.mdl-color-text--primary { 

   color: #3f51b5 !important

}

.mdl-color-text--primary-contrast { 

   color: #fff !important

}

.mdl-color-text--primary-dark { 

   color: #303f9f !important

}

.mdl-color-text--accent { 

   color: #ff4081 !important

}

.mdl-color-text--accent-contrast { 

   color: #fff !important

}

.mdl-color-text--light-grey-233 { 

   color: #F6F6F6 !important

}

/*Chip*/ .mdl-chip { 

   height: 32px;
   font-family: "Roboto", "Helvetica", "Arial", sans-serif;
   line-height: 32px;
   padding: 0 12px;
   border: 0;
   border-radius: 16px;
   background-color: #dedede;
   display: inline-block;
   color: rgba(0, 0, 0, .87);
   margin: 2px 0;
   font-size: 0;
   white-space: nowrap

}

.mdl-chip__text { 

   font-size: 13px;
   vertical-align: middle;
   display: inline-block

}

.mdl-chip__action { 

   height: 24px;
   width: 24px;
   background: 0 0;
   opacity: .54;
   cursor: pointer;
   padding: 0;
   margin: 0 0 0 4px;
   font-size: 13px;
   text-decoration: none;
   color: rgba(0, 0, 0, .87);
   border: none;
   outline: none

}

.mdl-chip__action, .mdl-chip__contact { 

   display: inline-block;
   vertical-align: middle;
   overflow: hidden;
   text-align: center

}

.mdl-chip__contact { 

   height: 32px;
   width: 32px;
   border-radius: 16px;
   margin-right: 8px;
   font-size: 18px;
   line-height: 32px

}

.mdl-chip:focus { 

   outline: 0;
   box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .14), 0 3px 1px -2px rgba(0, 0, 0, .2), 0 1px 5px 0 rgba(0, 0, 0, .12)

}

.mdl-chip:active { 

   background-color: #d6d6d6

}

.mdl-chip--deletable { 

   padding-right: 4px

}

.mdl-chip--contact { 

   padding-left: 0

}


/*Menu*/

.mdl-menu__container { 

   display: block;
   margin: 0;
   padding: 0;
   border: none;
   position: absolute;
   overflow: visible;
   height: 0;
   width: 0;
   visibility: hidden;
   z-index: -1

}

.mdl-menu__container.is-visible, .mdl-menu__container.is-animating { 

   z-index: 999;
   visibility: visible

}

.mdl-menu__outline { 

   display: block;
   background: #fff;
   margin: 0;
   padding: 0;
   border: none;
   border-radius: 2px;
   position: absolute;
   top: 0;
   left: 0;
   overflow: hidden;
   opacity: 0;
   -webkit-transform: scale(0);
   transform: scale(0);
   -webkit-transform-origin: 0 0;
   transform-origin: 0 0;
   box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .14), 0 3px 1px -2px rgba(0, 0, 0, .2), 0 1px 5px 0 rgba(0, 0, 0, .12);
   will-change: transform;
   transition: transform .3s cubic-bezier(.4, 0, .2, 1), opacity .2s cubic-bezier(.4, 0, .2, 1);
   transition: transform .3s cubic-bezier(.4, 0, .2, 1), opacity .2s cubic-bezier(.4, 0, .2, 1), -webkit-transform .3s cubic-bezier(.4, 0, .2, 1);
   z-index: -1

}

.mdl-menu__container.is-visible .mdl-menu__outline { 

   opacity: 1;
   -webkit-transform: scale(1);
   transform: scale(1);
   z-index: 999

}

.mdl-menu__outline.mdl-menu--bottom-right { 

   -webkit-transform-origin: 100% 0;
   transform-origin: 100% 0

}

.mdl-menu__outline.mdl-menu--top-left { 

   -webkit-transform-origin: 0 100%;
   transform-origin: 0 100%

}

.mdl-menu__outline.mdl-menu--top-right { 

   -webkit-transform-origin: 100% 100%;
   transform-origin: 100% 100%

}

.mdl-menu { 

   position: absolute;
   list-style: none;
   top: 0;
   left: 0;
   height: auto;
   width: auto;
   min-width: 124px;
   padding: 8px 0;
   margin: 0;
   opacity: 0;
   clip: rect(0 0 0 0);
   z-index: -1

}

.mdl-menu__container.is-visible .mdl-menu { 

   opacity: 1;
   z-index: 999

}

.mdl-menu.is-animating { 

   transition: opacity .2s cubic-bezier(.4, 0, .2, 1), clip .3s cubic-bezier(.4, 0, .2, 1)

}

.mdl-menu.mdl-menu--bottom-right { 

   left: auto;
   right: 0

}

.mdl-menu.mdl-menu--top-left { 

   top: auto;
   bottom: 0

}

.mdl-menu.mdl-menu--top-right { 

   top: auto;
   left: auto;
   bottom: 0;
   right: 0

}

.mdl-menu.mdl-menu--unaligned { 

   top: auto;
   left: auto

}

.mdl-menu__item { 

   display: block;
   border: none;
   color: rgba(0, 0, 0, .87);
   background-color: transparent;
   text-align: left;
   margin: 0;
   padding: 0 16px;
   outline-color: #bdbdbd;
   position: relative;
   overflow: hidden;
   font-size: 14px;
   font-weight: 400;
   letter-spacing: 0;
   text-decoration: none;
   cursor: pointer;
   height: 48px;
   line-height: 48px;
   white-space: nowrap;
   opacity: 0;
   transition: opacity .2s cubic-bezier(.4, 0, .2, 1);
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
   user-select: none

}

.mdl-menu__container.is-visible .mdl-menu__item { 

   opacity: 1

}

.mdl-menu__item::-moz-focus-inner { 

   border: 0

}

.mdl-menu__item--full-bleed-divider { 

   border-bottom: 1px solid rgba(0, 0, 0, .12)

}

.mdl-menu__item[disabled], .mdl-menu__item[data-mdl-disabled] { 

   color: #bdbdbd;
   background-color: transparent;
   cursor: auto

}

.mdl-menu__item[disabled]:hover, .mdl-menu__item[data-mdl-disabled]:hover { 

   background-color: transparent

}

.mdl-menu__item[disabled]:focus, .mdl-menu__item[data-mdl-disabled]:focus { 

   background-color: transparent

}

.mdl-menu__item[disabled] .mdl-ripple, .mdl-menu__item[data-mdl-disabled] .mdl-ripple { 

   background: 0 0

}

.mdl-menu__item:hover { 

   background-color: #eee

}

.mdl-menu__item:focus { 

   outline: none;
   background-color: #eee

}

.mdl-menu__item:active { 

   background-color: #e0e0e0

}

.mdl-menu__item--ripple-container { 

   display: block;
   height: 100%;
   left: 0;
   position: absolute;
   top: 0;
   width: 100%;
   z-index: 0;
   overflow: hidden

}

/*table*/

.mdl-data-table { 

   position: relative;
   border: 1px solid rgba(0, 0, 0, .12);
   border-collapse: collapse;
   white-space: nowrap;
   font-size: 13px;
   background-color: #fff

}

.mdl-data-table thead { 

   padding-bottom: 3px

}

.mdl-data-table thead .mdl-data-table__select { 

   margin-top: 0

}

.mdl-data-table tbody tr { 

   position: relative;
   height: 48px;
   transition-duration: .28s;
   transition-timing-function: cubic-bezier(.4, 0, .2, 1);
   transition-property: background-color

}

.mdl-data-table tbody tr.is-selected { 

   background-color: #e0e0e0

}

.mdl-data-table tbody tr:hover { 

   background-color: #eee

}

.mdl-data-table td { 

   text-align: right

}

.mdl-data-table th { 

   padding: 0 18px 12px 18px;
   text-align: right

}

.mdl-data-table td:first-of-type, .mdl-data-table th:first-of-type { 

   padding-left: 24px

}

.mdl-data-table td:last-of-type, .mdl-data-table th:last-of-type { 

   padding-right: 24px

}

.mdl-data-table td { 

   position: relative;
   height: 48px;
   border-top: 1px solid rgba(0, 0, 0, .12);
   border-bottom: 1px solid rgba(0, 0, 0, .12);
   padding: 12px 18px;
   box-sizing: border-box

}

.mdl-data-table td, .mdl-data-table td .mdl-data-table__select { 

   vertical-align: middle

}

.mdl-data-table th { 

   position: relative;
   vertical-align: bottom;
   text-overflow: ellipsis;
   font-weight: 700;
   line-height: 24px;
   letter-spacing: 0;
   height: 48px;
   font-size: 12px;
   color: rgba(0, 0, 0, .54);
   padding-bottom: 8px;
   box-sizing: border-box

}

.mdl-data-table th.mdl-data-table__header--sorted-ascending, .mdl-data-table th.mdl-data-table__header--sorted-descending { 

   color: rgba(0, 0, 0, .87)

}

.mdl-data-table th.mdl-data-table__header--sorted-ascending:before, .mdl-data-table th.mdl-data-table__header--sorted-descending:before { 

   font-family: 'Material Icons';
   font-weight: 400;
   font-style: normal;
   line-height: 1;
   letter-spacing: normal;
   text-transform: none;
   display: inline-block;
   word-wrap: normal;
   -moz-font-feature-settings: 'liga';
   font-feature-settings: 'liga';
   -webkit-font-feature-settings: 'liga';
   -webkit-font-smoothing: antialiased;
   font-size: 16px;
   content: "\e5d8";
   margin-right: 5px;
   vertical-align: sub

}

.mdl-data-table th.mdl-data-table__header--sorted-ascending:hover, .mdl-data-table th.mdl-data-table__header--sorted-descending:hover { 

   cursor: pointer

}

.mdl-data-table th.mdl-data-table__header--sorted-ascending:hover:before, .mdl-data-table th.mdl-data-table__header--sorted-descending:hover:before { 

   color: rgba(0, 0, 0, .26)

}

.mdl-data-table th.mdl-data-table__header--sorted-descending:before { 

   content: "\e5db"

}

.mdl-data-table__select { 

   width: 16px

}

.mdl-data-table__cell--non-numeric.mdl-data-table__cell--non-numeric { 

   text-align: left

}


.mdl-tabs { 

 display: block;
 width: 100%; }

.mdl-tabs__tab-bar { 

 display: -webkit-flex;
 display: -ms-flexbox;
 display: flex;
 -webkit-flex-direction: row;
     -ms-flex-direction: row;
         flex-direction: row;
 -webkit-justify-content: center;
     -ms-flex-pack: center;
         justify-content: center;
 -webkit-align-content: space-between;
     -ms-flex-line-pack: justify;
         align-content: space-between;
 -webkit-align-items: flex-start;
     -ms-flex-align: start;
         align-items: flex-start;
 height: 48px;
 padding: 0 0 0 0;
 margin: 0;
 border-bottom: 1px solid rgb(224,224,224); }

.mdl-tabs__tab { 

 margin: 0;
 border: none;
 padding: 0 24px 0 24px;
 float: left;
 position: relative;
 display: block;
 text-decoration: none;
 height: 48px;
 line-height: 48px;
 text-align: center;
 font-weight: 500;
 font-size: 14px;
 text-transform: uppercase;
 color: rgba(0,0,0, 0.54);
 overflow: hidden; }
 .mdl-tabs.is-upgraded .mdl-tabs__tab.is-active {
   color: rgba(0,0,0, 0.87); }
 .mdl-tabs.is-upgraded .mdl-tabs__tab.is-active:after {
   height: 2px;
   width: 100%;
   display: block;
   content: " ";
   bottom: 0px;
   left: 0px;
   position: absolute;
   background: rgb(63,81,181);
   -webkit-animation: border-expand 0.2s cubic-bezier(0.4, 0, 0.4, 1) 0.01s alternate forwards;
           animation: border-expand 0.2s cubic-bezier(0.4, 0, 0.4, 1) 0.01s alternate forwards;
   transition: all 1s cubic-bezier(0.4, 0, 1, 1); }
 .mdl-tabs__tab .mdl-tabs__ripple-container {
   display: block;
   position: absolute;
   height: 100%;
   width: 100%;
   left: 0px;
   top: 0px;
   z-index: 1;
   overflow: hidden; }
   .mdl-tabs__tab .mdl-tabs__ripple-container .mdl-ripple {
     background: rgb(63,81,181); }

.mdl-tabs__panel { 

 display: block; }
 .mdl-tabs.is-upgraded .mdl-tabs__panel {
   display: none; }
 .mdl-tabs.is-upgraded .mdl-tabs__panel.is-active {
   display: block; }