/* ==========================================================================
   Author's custom styles
   ========================================================================== */
/*
  Legend COLOR INDEX:-------------------------------;
  Purdue Color:  #d6a729;
  Theme Color :#d6a729;
  a:link    {color:#2A2A2A;}
  a:hover   {color:#000;}
  a:visited {color:#9A9A9A;}
  Body Background Page Color: #f0f0f0;
        */

body {background-color: #f0f0f0;
background-image: url(../img/bg_stripes-52.png), url(../img/bg_grains-37.png), url(../img/bg_artifacts-27.jpg);
background-position: left 0px bottom 13px,  left 0px bottom 0px, left 0px bottom 0px;
background-repeat: repeat-y repeat-x, no-repeat, repeat-y;
background-size:  auto, auto, auto;
                padding:0;margin:0;
}

/* ----HEADER----*/
#pnw_logo {   display:inline-block; position:relative; top:-20px; right:-242px;}

/*Jumbotron*/
.jumbotron {  margin:0px;
              box-shadow:0px 1px 1px 1px white;
                  border-bottom: 2px solid transparent;
                  -webkit-border-image: url(../img/strp.jpg) 3; /* Safari 3.1-5 */
                  -o-border-image: url(../img/strp.jpg) 3; /* Opera 11-12.1 */
                  border-image: url(../img/strp.jpg) 3;
              padding:00px 0px 00px 0px; 
              background-image: url('../img/banner.jpg'); 
              /*box-shadow:0px 2px 5px 1px rgba(0,0,0,.5), inset 0px -1px 0px #d6a729;*/
} 
.jumbotron .container h1 {display:inline-block;
                          font-weight: bold; 
                          color:white; 
                          text-align:center; 
                          position:relative; 
                          top:30px;
						              text-shadow:3px 3px 10px rgba(0,0,0,.95);
}

/*NAVIGATION*/
.navbar-static-top {z-index:50 !important;}
.navbar-wrapper .container>.navbar-inverse{ background-color:#333;
                                            border-radius: 0px 0px 12px 12px;
                                            border-bottom:2px black solid;
                                            box-shadow:inset 0px 3px 7px 1px rgba(0,0,0, .3);}
.navbar-inverse .navbar-nav>.active>a:link,
 .navbar-inverse .navbar-nav>.active>a:focus,
  .navbar-inverse .navbar-nav>.active>a:hover {border-radius:6px 6px 0px 0px;}

/*Links Light Regions*/
a:link 		{color:#2A2A2A; text-decoration:none; font-weight:300;}
a:hover 	{color:#000; text-decoration:none;}
a:visited	{color:#9A9A9A; text-decoration:none;}

/*Links Dark Regions*/
.nav>li>a:link, footer li a:link 		     {color:#d6a729 !important;}
.nav>li>a:hover, footer li a:hover 		   {color:#FFF !important;}
.nav>li>a:visited, footer li a:visited	 {color:#d6a729 !important;}


/*TEXT*/
h1,
h2, 
h3 {font-family: 'Roboto', sans-serif; font-weight: 300;}
.container>p {font-family:'Roboto', sans-serif; font-size: 2.2em; font-weight: 300;}
.justify {text-align: justify;}

hr {border-color: #999;}


.page-heading{	font-family: 'Roboto', sans-serif; 
                font-weight:200; font-size:1.25em;
				        text-shadow:2px 2px 2px rgba(102,102,102,.41);
}
.headingMark {display:inline-block; 
  width:25px; height:24px; 
  position:relative; top:3px;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#a37314+11,d6a729+12,d6a729+100&1+60,0+61,0+66,1+67,1+67,1+82,0+83,0+87,0+87,1+88 */
background: -moz-linear-gradient(left,  rgba(163,115,20,1) 11%, rgba(214,167,41,1) 12%, rgba(214,167,41,1) 60%, rgba(214,167,41,0) 61%, rgba(214,167,41,0) 66%, rgba(214,167,41,1) 67%, rgba(214,167,41,1) 82%, rgba(214,167,41,0) 83%, rgba(214,167,41,0) 87%, rgba(214,167,41,1) 88%, rgba(214,167,41,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  rgba(163,115,20,1) 11%,rgba(214,167,41,1) 12%,rgba(214,167,41,1) 60%,rgba(214,167,41,0) 61%,rgba(214,167,41,0) 66%,rgba(214,167,41,1) 67%,rgba(214,167,41,1) 82%,rgba(214,167,41,0) 83%,rgba(214,167,41,0) 87%,rgba(214,167,41,1) 88%,rgba(214,167,41,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  rgba(163,115,20,1) 11%,rgba(214,167,41,1) 12%,rgba(214,167,41,1) 60%,rgba(214,167,41,0) 61%,rgba(214,167,41,0) 66%,rgba(214,167,41,1) 67%,rgba(214,167,41,1) 82%,rgba(214,167,41,0) 83%,rgba(214,167,41,0) 87%,rgba(214,167,41,1) 88%,rgba(214,167,41,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a37314', endColorstr='#d6a729',GradientType=1 ); /* IE6-9 */
}

/* BTNs */
  .btn-gunmtl { float:right; position:relative; top:4px; float:right;display:inline-block;
  background: #3d3d3d;
  background-image: -webkit-linear-gradient(top, #3d3d3d, #222222);
  background-image: -moz-linear-gradient(top, #3d3d3d, #222222);
  background-image: -ms-linear-gradient(top, #3d3d3d, #222222);
  background-image: -o-linear-gradient(top, #3d3d3d, #222222);
  background-image: linear-gradient(to bottom, #3d3d3d, #222222);
    -webkit-border-radius: 8;
    -moz-border-radius: 8;
    border-radius: 8px;
  text-shadow: 1px 1px 0px #000000;
  -webkit-box-shadow: 0px 1px 0px #b3b3b3;
  -moz-box-shadow: 0px 1px 0px #b3b3b3;
  box-shadow: 0px 1px 0px #b3b3b3;
  color: #d6a729;
    font-size: 20px;
    padding: 3px 8px 3px 8px;
    text-decoration: none;
  }

  .btn-gunmtl:hover {cursor:pointer;
  background: #222222;
  background-image: -webkit-linear-gradient(top, #222222, #3d3d3d);
  background-image: -moz-linear-gradient(top, #222222, #3d3d3d);
  background-image: -ms-linear-gradient(top, #222222, #3d3d3d);
  background-image: -o-linear-gradient(top, #222222, #3d3d3d);
  background-image: linear-gradient(to bottom, #222222, #3d3d3d);
    text-decoration: none;
  }

  .btn-green {
    -webkit-border-radius: 28;
    -moz-border-radius: 28;
    border-radius: 28px;
    color: #ffffff !important;
    font-size: 20px;
    background: #0eb836;
    padding: 10px 20px 10px 20px;
    margin:10px;
    cursor:pointer;
    text-decoration: none;
    text-shadow:none;
    display: inline-block;
  }
  .btn-green:hover {
    background: #2ee659;
    background-image: -webkit-linear-gradient(top, #2ee659, #0eb836);
    background-image: -moz-linear-gradient(top, #2ee659, #0eb836);
    background-image: -ms-linear-gradient(top, #2ee659, #0eb836);
    background-image: -o-linear-gradient(top, #2ee659, #0eb836);
    background-image: linear-gradient(to bottom, #2ee659, #0eb836);
    text-decoration: none;
    text-shadow:0px -1px 0px rgba(0,0,0, .3);
    box-shadow:0px 2px 1px 1px rgba(90,90,90,.5);
  }
  .btn-yellow {
    -webkit-border-radius: 28;
    -moz-border-radius: 28;
    border-radius: 28px;
    color: #ffffff !important;
    font-size: 20px;
    background: #d6a829;
    padding: 10px 20px 10px 20px;
    margin:10px;
    cursor:pointer;
    text-decoration: none;
    text-shadow:none;
    display: inline-block;
  }
  .btn-yellow:hover {
  background: #e8b848;
  background-image: -webkit-linear-gradient(top, #e8b848, #cc9c22);
  background-image: -moz-linear-gradient(top, #e8b848, #cc9c22);
  background-image: -ms-linear-gradient(top, #e8b848, #cc9c22);
  background-image: -o-linear-gradient(top, #e8b848, #cc9c22);
  background-image: linear-gradient(to bottom, #e8b848, #cc9c22);
    text-decoration: none;
    text-shadow:0px -1px 0px rgba(0,0,0, .3);
    box-shadow:0px 2px 1px 1px rgba(90,90,90,.5);
  }



/* THE CAROUSEL ------------------------------------------------- */

/* Carousel base class */

/*/Carousel Inverse And Break point corrections */
  .carousel-control.right, .carousel-control.left {background-image: none; max-width:80px;}
  .carousel-control .icon-prev:before {color:#d6a729; content:"\2039"; font-size:3em;}
  .carousel-control .icon-next:before {color:#d6a729; content:"\203a"; font-size:3em;}
    .carousel-control .glyphicon-chevron-left, 
    .carousel-control .glyphicon-chevron-right, 
    .carousel-control .icon-next, 
    .carousel-control .icon-prev {top:43% !important;}
    .carousel .item {
      border-top:1px solid #d2d2d2;
	  border-left:1px solid #d2d2d2;
	  border-bottom:2px solid #FFF;
	  border-right:2px solid #FFF;
	  box-shadow:inset 1px 0px 4px rgba(0,0,0, .26);
      background-color: rgba(255, 255, 255, 0.79) !important;  /* CHANGE CAROUSEL BACKGROUND-COLOR PROPERTY HERE*/
      border-radius: 8px;
    }
  .carousel-caption { color:#000; 
                      top:20px; bottom: 60px; 
                      overflow:auto; 
                      padding:0px 8px 0px 0px; /* Padding of 8 pixels is added to offset the content left to allow room for auto-scroll*/
                      left:8%;
                      right:8%;
  }

  /*CAROUSEL CAPTION TEXT TYPOGRAPHY*/
  .carousel-caption p {text-align:center; font-family: 'Roboto', sans-serif; font-size:1.5em; font-weight:300; text-shadow:none;}
  
  .carousel-caption h1, 
    .carousel-caption h2,
    .carousel-caption h3,
    .carousel-caption h4 {font-family:'Roboto', sans-serif; font-weight:700; text-shadow: none;}
    .carousel-caption h1 {font-size:2.25 em;}
    .carousel-caption h2 {font-size:1.8 em;}
    .carousel-caption h3 {font-size:1.3 em;}
    .carousel-caption h4 {font-size:0.9 em;}

	
  .carousel-caption>tr,
    .carousel-caption>td,
    .carousel-caption>table {text-align: justify; font-family:'Roboto', sans-serif; font-size: 1.5em; font-weight:100; text-shadow: none;}
  
  .carousel-indicators li {border:1px solid #000;}  /*ORGANIZED LIST CAROUSEL INDICATORS OF SLIDE NUMBER AT BOTTOM OF CAPTION*/

.carousel-inner.item {background-color: none; }  /* NOT THE BG COLOR HERE.*/
.carousel {
  margin-bottom: 60px;
}


/* Since positioning the image, we need to help out the caption */
.carousel-caption {
  z-index: 1;
}

/* Declare heights because of positioning of img element */
.carousel .item {
  height:800px;
}
.carousel img {
  top: 0;
  left: 0;
}

/*Lectures*/
.carousel-inner.item img,
 .lectures img {width:128px; height:128px; padding:10px;} /*Padding within this class is to set a distance from the carousel-inner border*/
  .ctm-table { display:table; width: 95%; margin:auto;}
  .ctm-row { display:table-row; }
  .ctm-cell {padding: 0px 10px 0px 10px;}
  #data_gif {width:75%; height: inherit;}
  /*Links home carousel*/
    .ctm-cell>a:link        {color:#d6a729 !important;}
    .ctm-cell>a:hover       {color:#000 !important;}
    .ctm-cell>a:visited     {color:#d6a729 !important;}
    .ctm-cell img {filter: grayscale(90%);}
    .ctm-cell img:hover {filter: grayscale(0%);}

/*Lecture Fork*/
  .fork-table{display:table; margin:auto;}
  .fork-row{display: table-row;}
  .fork-cell{ display: table-cell; color:#d6a729; 
              font-size:1.2em; font-style: 'roboto', 
              sans-serif; font-weight:900; padding: 0px 15px 0px 15px;}

  /*POPOUT QUIZ*/
  .quizz-container {position: relative;}
  .lightbox {   background-color:white; border:5px solid black;
                position:fixed;
                    top: 5%; right: 5%; left: 5%; bottom: -5px; 
                padding:10px; width:auto; height:auto; margin:0px; 
                z-index:999;}

  #bg-lightbox {    display:none; background-color: rgba(0,0,0, .6);
                    position:fixed; width:100%; height:100%;
                        top: 0px; left: 0px; opacity:0;
                    padding:0px;margin: 0px; box-shadow:inset 0px 0px 100px black;
                    z-index:989; min-width:auto; min-height:auto;}
 

  #x {       font-family:'Roboto', sans-serif; font-weight:bold; 
             position:relative; top:0px; right:0px; 
             color:black; cursor:pointer; margin:0px;
             font-size:1.8em; padding: 4px;
             z-index:991; text-align:right;}


/* THE FOOTER ------------------------------------------------- */
footer {
  background-color: #222;
  background-image: url('../img/bg_footer.jpg'); background-repeat: no-repeat;
  box-shadow:inset 0px 6px 3px black;
      border-top: 2px solid transparent;
    -webkit-border-image: url(../img/strp.jpg) 2; /* Safari 3.1-5 */
    -o-border-image: url(../img/strp.jpg) 2; /* Opera 11-12.1 */
    border-image: url(../img/strp.jpg) 2;
}
footer,
 footer h1,
  footer h2,
   footer h3,
    footer h4,
     footer h5,
      footer h6,
       footer blockquote,
        footer em,
         footer span,
          footer p    {
            color:#cfcfcf;
            font-family:'Roboto', sans-serif;
            font-size: default;
            font-weight: default;
          }
footer hr {border-top:1px solid #1b1b1b; 
            border-bottom:1px solid #2F2F2F;
            height:0px;}

footer #copy{color:#AAA; font-size: 1em !important; font-family: 'Roboto', sans-serif; font-weight:100; padding-bottom:20px;}




/*SOCIAL MEDIA FOOTER----------------------------------------*/
  #smedia_fbook {
    width: 32px; 
    height: 32px; 
    background: url("../img/icons_ut_smedia.png") 1px 0px;
  }
  #smedia_tweet {
    width: 32px; 
    height: 32px; 
    background: url("../img/icons_ut_smedia.png") -72px 0px;
  }
  #smedia_gplus {
    width: 32px; 
    height: 32px; 
    background: url("../img/icons_ut_smedia.png") -146px 0px;
  }
  #smedia_pin {
    width: 32px; 
    height: 32px; 
    background: url("../img/icons_ut_smedia.png") -218px 0px;
  }
  #smedia_share {
    width: 32px; 
    height: 32px; 
    background: url("../img/icons_ut_smedia.png") -218px -60px;
}
/*-----  /smedia   ----------------------------------------*/

/*ERROR 404*/
.error404 {
    color: #555;
    display: table;
    font-family: 'Arial', sans-serif; font-size:1.3em;
    height: 100%;
    text-align: center;
    width: 100%;
}
.container>.error404 {border-top:1px solid #d2d2d2;
    								  border-left:1px solid #d2d2d2;
    								  border-bottom:2px solid #FFF;
    								  border-right:2px solid #FFF;
    								  box-shadow:inset 1px 0px 4px rgba(0,0,0, .26);
                      background-color: rgba(255, 255, 255, 0.79) !important;
                      border-radius: 20px; 
                      padding:80px; text-align:center;
}
.error404 h1 {color: #555;
              font-family:'Roboto', sans-serif;
              font-size: 2.3em;
              font-weight: 400;
}




/* ==========================================================================
   Per Lesson style
   ========================================================================== */
   a>#cond2_image {border:2px black solid;}
   a>#cond2_image:hover {border:2px #d6a729 solid;}

   /*Arrays*/
    #table_array {border-radius:8px; min-width:95%; margin:auto;}
    #table_array td {padding:10px; vertical-align: top; text-align: left;}
    .array_index {color:red; font-weight:500; border:2px solid red; border-radius: 8px; padding:5px;}
    td .blue {padding:0px; color:blue; font-weight:300;}







/* ==========================================================================
   MULTI-RESOLUTION COMPATIBILITY 
============================================================================= */
/* Small Screens / Zoom Enabled Screens And Smartphones (landscape) ----------- */
@media only screen and (max-width: 1200px){
   /* Hiding elements for this device * * * * * * * * * * * * * */
      #pnw_logo{
         display: none;
      }

      .jumbotron
       .container
        h1 {display:block; 
            font-weight: bold; 
            color:white; 
            text-align:center; 
            position:relative; 
            top:0px;
        }

    /*CAROUSEL resize*/
      /* Declare heights because of positioning of img element */
      .carousel .item {
        height: 800px;
      }
      .carousel-caption {
                      left:12%;
                      right:12%;
  }
    
    footer {
      background-color: #222;
      background-image: url('../img/bg_footer-sm.jpg'); background-repeat: no-repeat;
      box-shadow:inset 0px 6px 3px black;
      border-top:2px solid #d6a729;
    }
 }

/* Small Screens / Zoom Enabled Screens And Smartphones (landscape) ----------- */
@media only screen and (max-width: 767px){
  footer {
    background-color: #222;
    background-image: url('../img/bg_footer-xs.jpg'); background-repeat: no-repeat; /*load smaller footer BG optimized for smaller screens*/
    box-shadow:inset 0px 6px 3px black;
    border-top:2px solid #d6a729;
  }
  #pnw_logo{
    display: none;
  }
      .carousel-caption {
                      left:16%;
                      right:16%;
  }
    .lightbox {   background-color:white; border:none;
                position:fixed;
                    top: 0%; right: 0%; left: 0%; bottom: 0px; 
                padding:10px; width:auto; height:auto; margin:0px; 
                z-index:999;}
}

/* Small Screens / Zoom Enabled Screens And Smartphones (landscape) ----------- */
@media only screen and (max-width: 555px){
  .jumbotron, #pnw_logo {display:none;}
   .page-heading:before {content:'\a\a'; white-space: pre;}
  
  /*NAVIGATION*/
.navbar-wrapper .container>.navbar-inverse{ border-radius:0px; border-bottom:1px #d6a729 solid; 
                                            background-color:#333; position:fixed; top:0px; left:0px; width:100%;
                                            box-shadow:0px 4px 7px 3px rgba(0,0,0,.5);
                                          }
.navbar .navbar-nav li a:hover {background-color:#1a1a1a;}
.navbar .navbar-nav li a:active {background-color:#d6a729;}
  /*CAROUSEL CAPTION TEXT TYPOGRAPHY*/
  .carousel-caption p {text-align:justify; font-family: 'Roboto', sans-serif; font-size:1.3em; font-weight:300; text-shadow:none;}
    .carousel-caption {
                      left:18.5%;
                      right:18.5%;
  }
  
  .carousel-caption h1, 
    .carousel-caption h2,
    .carousel-caption h3,
    .carousel-caption h4 {font-family:'Roboto', sans-serif; font-weight:700; text-shadow: none;}
    .carousel-caption h1 {font-size:2.0em;}
    .carousel-caption h2 {font-size:1.75em;}
    .carousel-caption h3 {font-size:1.5em;}
    .carousel-caption h4 {font-size:1.4em;}
  .lightbox {   background-color:white; border:none;
                position:fixed;
                    top: 0%; right: 0%; left: 0%; bottom: 0px; 
                padding:10px; width:auto; height:auto; margin:0px; 
                z-index:999;}
}
/* ==========================================================================
   /multi-resolution compatibility
============================================================================= */



/* ==========================================================================
   GOOGLE ROBOTO FONT OFFLINE RESOURCE BACKWORDS COMPATIBLE
============================================================================= */
/* roboto-100 - latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 100;
  src: url('../fonts/roboto/roboto-v15-latin-100.eot'); /* IE9 Compat Modes */
  src: local('Roboto Thin'), local('Roboto-Thin'),
       url('../fonts/roboto/roboto-v15-latin-100.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/roboto/roboto-v15-latin-100.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/roboto/roboto-v15-latin-100.woff') format('woff'), /* Modern Browsers */
       url('../fonts/roboto/roboto-v15-latin-100.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/roboto/roboto-v15-latin-100.svg#Roboto') format('svg'); /* Legacy iOS */
}
/* roboto-100italic - latin */
@font-face {
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 100;
  src: url('../fonts/roboto/roboto-v15-latin-100italic.eot'); /* IE9 Compat Modes */
  src: local('Roboto Thin Italic'), local('Roboto-ThinItalic'),
       url('../fonts/roboto/roboto-v15-latin-100italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/roboto/roboto-v15-latin-100italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/roboto/roboto-v15-latin-100italic.woff') format('woff'), /* Modern Browsers */
       url('../fonts/roboto/roboto-v15-latin-100italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/roboto/roboto-v15-latin-100italic.svg#Roboto') format('svg'); /* Legacy iOS */
}
/* roboto-300 - latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  src: url('../fonts/roboto/roboto-v15-latin-300.eot'); /* IE9 Compat Modes */
  src: local('Roboto Light'), local('Roboto-Light'),
       url('../fonts/roboto/roboto-v15-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/roboto/roboto-v15-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/roboto/roboto-v15-latin-300.woff') format('woff'), /* Modern Browsers */
       url('../fonts/roboto/roboto-v15-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/roboto/roboto-v15-latin-300.svg#Roboto') format('svg'); /* Legacy iOS */
}
/* roboto-300italic - latin */
@font-face {
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 300;
  src: url('../fonts/roboto/roboto-v15-latin-300italic.eot'); /* IE9 Compat Modes */
  src: local('Roboto Light Italic'), local('Roboto-LightItalic'),
       url('../fonts/roboto/roboto-v15-latin-300italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/roboto/roboto-v15-latin-300italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/roboto/roboto-v15-latin-300italic.woff') format('woff'), /* Modern Browsers */
       url('../fonts/roboto/roboto-v15-latin-300italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/roboto/roboto-v15-latin-300italic.svg#Roboto') format('svg'); /* Legacy iOS */
}
/* roboto-regular - latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/roboto/roboto-v15-latin-regular.eot'); /* IE9 Compat Modes */
  src: local('Roboto'), local('Roboto-Regular'),
       url('../fonts/roboto/roboto-v15-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/roboto/roboto-v15-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/roboto/roboto-v15-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/roboto/roboto-v15-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/roboto/roboto-v15-latin-regular.svg#Roboto') format('svg'); /* Legacy iOS */
}
/* roboto-italic - latin */
@font-face {
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 400;
  src: url('../fonts/roboto/roboto-v15-latin-italic.eot'); /* IE9 Compat Modes */
  src: local('Roboto Italic'), local('Roboto-Italic'),
       url('../fonts/roboto/roboto-v15-latin-italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/roboto/roboto-v15-latin-italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/roboto/roboto-v15-latin-italic.woff') format('woff'), /* Modern Browsers */
       url('../fonts/roboto/roboto-v15-latin-italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/roboto/roboto-v15-latin-italic.svg#Roboto') format('svg'); /* Legacy iOS */
}
/* roboto-500 - latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  src: url('../fonts/roboto/roboto-v15-latin-500.eot'); /* IE9 Compat Modes */
  src: local('Roboto Medium'), local('Roboto-Medium'),
       url('../fonts/roboto/roboto-v15-latin-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/roboto/roboto-v15-latin-500.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/roboto/roboto-v15-latin-500.woff') format('woff'), /* Modern Browsers */
       url('../fonts/roboto/roboto-v15-latin-500.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/roboto/roboto-v15-latin-500.svg#Roboto') format('svg'); /* Legacy iOS */
}
/* roboto-500italic - latin */
@font-face {
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 500;
  src: url('../fonts/roboto/roboto-v15-latin-500italic.eot'); /* IE9 Compat Modes */
  src: local('Roboto Medium Italic'), local('Roboto-MediumItalic'),
       url('../fonts/roboto/roboto-v15-latin-500italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/roboto/roboto-v15-latin-500italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/roboto/roboto-v15-latin-500italic.woff') format('woff'), /* Modern Browsers */
       url('../fonts/roboto/roboto-v15-latin-500italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/roboto/roboto-v15-latin-500italic.svg#Roboto') format('svg'); /* Legacy iOS */
}
/* roboto-700 - latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/roboto/roboto-v15-latin-700.eot'); /* IE9 Compat Modes */
  src: local('Roboto Bold'), local('Roboto-Bold'),
       url('../fonts/roboto/roboto-v15-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/roboto/roboto-v15-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/roboto/roboto-v15-latin-700.woff') format('woff'), /* Modern Browsers */
       url('../fonts/roboto/roboto-v15-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/roboto/roboto-v15-latin-700.svg#Roboto') format('svg'); /* Legacy iOS */
}
/* roboto-700italic - latin */
@font-face {
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 700;
  src: url('../fonts/roboto/roboto-v15-latin-700italic.eot'); /* IE9 Compat Modes */
  src: local('Roboto Bold Italic'), local('Roboto-BoldItalic'),
       url('../fonts/roboto/roboto-v15-latin-700italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/roboto/roboto-v15-latin-700italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/roboto/roboto-v15-latin-700italic.woff') format('woff'), /* Modern Browsers */
       url('../fonts/roboto/roboto-v15-latin-700italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/roboto/roboto-v15-latin-700italic.svg#Roboto') format('svg'); /* Legacy iOS */
}
/* roboto-900 - latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 900;
  src: url('../fonts/roboto/roboto-v15-latin-900.eot'); /* IE9 Compat Modes */
  src: local('Roboto Black'), local('Roboto-Black'),
       url('../fonts/roboto/roboto-v15-latin-900.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/roboto/roboto-v15-latin-900.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/roboto/roboto-v15-latin-900.woff') format('woff'), /* Modern Browsers */
       url('../fonts/roboto/roboto-v15-latin-900.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/roboto/roboto-v15-latin-900.svg#Roboto') format('svg'); /* Legacy iOS */
}
/* roboto-900italic - latin */
@font-face {
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 900;
  src: url('../fonts/roboto/roboto-v15-latin-900italic.eot'); /* IE9 Compat Modes */
  src: local('Roboto Black Italic'), local('Roboto-BlackItalic'),
       url('../fonts/roboto/roboto-v15-latin-900italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/roboto/roboto-v15-latin-900italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/roboto/roboto-v15-latin-900italic.woff') format('woff'), /* Modern Browsers */
       url('../fonts/roboto/roboto-v15-latin-900italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/roboto/roboto-v15-latin-900italic.svg#Roboto') format('svg'); /* Legacy iOS */
}