﻿.mdl-layout__header-row {
                /*background:#c1213d !important;*/
                
                background: -moz-linear-gradient(top,  rgba(0,0,0,0.65) 0%, rgba(0,0,0,0) 100%) !important; /* FF3.6-15 */
                background: -webkit-linear-gradient(top,  rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%) !important; /* Chrome10-25,Safari5.1-6 */
                background: linear-gradient(to bottom,  rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%) !important; /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
                filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6000000', endColorstr='#00000000',GradientType=0 ) !important; /* IE6-9 */

                height:100px !important;
                padding: 0 40px !important;
            }
  
#Latest {
            background:#94192f;
            min-height:200px;
            display:block;
        }
        #Latest h1,#Latest h2 {
            color:#fff;         
        }
        #Highlights h1,#Highlights h2 {
            color:#fcc403;         
        }
        #Highlights {
            background:#282828;
            min-height:200px;
            display:flexbox;
        }
       
        section {
            width:100%;
            padding:10px 40px;
        }
        @media screen and (max-width: 480px) {
            section {
                width: 100%;
                padding: 10px 20px;
            }
        }
        
        /*article general*/
        article:hover {
            cursor:pointer;
        }
        .date-container{
            display:inline-table;
            width:60px;
            color:#fff;
            font-family:'Roboto Condensed', sans-serif !important;
            text-align:center;
            font-size:1.5em;
            line-height:1.2em;
        }
        /*News*/
        .hover-cover {
            position:absolute;
            height:0;
            width:100%;
            display:block;
            bottom:0;
            left:0;
            z-index:7;
            background:rgba(0,0,0,0);
        }
        
        .hover-cover div{
          
           
            color:rgba(255,255,255,0);
          
        }
        #News article {
            display:block;
            height:400px;
            background:#fff;
            overflow:hidden;
            margin-bottom:10px;
        }

        #News article p{
           padding:10px 10px;
           overflow:hidden;
           font-size:1em;
           max-height:104px;
           text-overflow:ellipsis;

        }
        #News article:hover {

            box-shadow: rgba(0,0,0,0.4) 0 5px 5px;

        }
        
        #News article:hover .hover-cover{
            height:36px;
            background: rgba(0,0,0,0.4);

        }
        #News article:hover .hover-cover div{
          
          
            color:rgba(255,255,255,1);
          
        }
        
        #News article .img-container{
            display:block;
            height:280px;
            width:100%;
            margin:0;
            padding:0;
            background:#000;
            overflow:hidden;
            
        }
        .NewsText {
            
        }
        .img-container img {
            height:100%;
            z-index:1;
            position:relative;
            top:0;
        }
            #News article .img-container>.darkforce {
                background: -moz-linear-gradient(top,  rgba(0,0,0,0) 0%, rgba(0,0,0,0.8) 100%); /* FF3.6-15 */
                background: -webkit-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.8) 100%); /* Chrome10-25,Safari5.1-6 */
                background: linear-gradient(to bottom,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.8) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
                filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#cc000000',GradientType=0 ); /* IE6-9 */
                height:160px;
                width:100%;
                z-index:2;
                position:absolute;
                bottom:120px;
                padding-bottom:10px;
            }
            #News article:hover .img-container>.darkforce {
                background: -moz-linear-gradient(top,  rgba(0,0,0,0) 0%, rgba(0,0,0,0.9) 100%); /* FF3.6-15 */
                background: -webkit-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.9) 100%); /* Chrome10-25,Safari5.1-6 */
                background: linear-gradient(to bottom,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.9) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
                filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#cc000000',GradientType=0 ); /* IE6-9 */
                height:280px;
              
            }
        .darkforce > .news-title {
           
            padding-left:10px;
            width:calc(100% - 72px) !important;
            height:60px;
            overflow:hidden;

        }
        .darkforce > .news-title > h5 {

            z-index:5;
            color:#fff;
           text-shadow:0px 1px 1px #000;
           width:100%;
           max-height:60px;
           text-overflow:ellipsis;

        }
        .darkforce > .date-container {
           
            border-right: solid 1px;
            z-index:5;
            color:#fff;
            width:60px;
            height:60px;
        }
        #News article .date-container span{
            display: table-cell;
            vertical-align: middle;
        }
        #News article > span{
            margin:10px;
        }
        /*Announcements*/
        #Announcements article:hover {

            box-shadow: rgba(0,0,0,0.4) 0 5px 5px;

        }
        #Calendar article:hover {

            box-shadow: rgba(0,0,0,0.4) 0 5px 5px;

        }
        #Announcements article {
            display:block;
            height:120px;
            background:#fff;
            overflow:hidden;
        }
        #Announcements .hover-cover {
            position:absolute;
            height:0;
            width:calc(100% - 60px);
            display:block;
            bottom:0;
            left:60px;
            z-index:7;
            background:rgba(0,0,0,0);
        }
        #Announcements article:hover .hover-cover{
            height:36px;
            background: rgba(0,0,0,0.4);

        }
        #Announcements article:hover .hover-cover div{
          
          
            color:rgba(255,255,255,1);
          
        }
       
        #Announcements article .date-container{
            background:#c1213d !important;
            height:120px;
            display:inline-table;
            
        }
        #Announcements article .date-container span{
            display: table-cell;
            vertical-align: middle;
        }
        #Announcements article .text-container{
           
            height:120px;
            display:inline-table;
            position: absolute;
            top: 0;
            left:70px;
            
            width: calc(100% - 80px);
        }
        #Announcements article .text-container p{
            display: table-cell;
            vertical-align: middle;
            font-size:1em;
        }
        small{
        font-size:.8em !important;
        }
        .date-container small {
            display:list-item;
            list-style:none;
        }
         #Announcements article.mit-more-ann {
            position:absolute;
            height:240px;
            
            top:10px;
            background:rgba(0,0,0,0);
        }
         /*cal*/
        #Calendar article {
            display:block;
            height:120px;
            background:#fff;
        }
        #Calendar article .date-container{
            background:#c78800 !important;
            height:120px;
            display:inline-table;
        }
       
        #Calendar article .date-container span{
            display: table-cell;
            vertical-align: middle;
        }
        #Calendar article .text-container{
           
            height:120px;
            display:inline-table;
            position: absolute;
            top: 0;
            left:70px;
            
            width: calc(100% - 80px);
        }
        #Calendar article .text-container>p{
            display: table-cell !important;
            vertical-align: middle !important;
            font-size:1em !important;
        }
        #Highlights p {
            color:#fff;
            font-family:'Roboto', sans-serif;
            font-size:1em;
        }
        .mit-icon {
            height:72px;
            width:72px;
            display:table-cell;
            
        }
        .mit-icon img{
            height:60px;
            margin:6px;
        }
        .mit-acad-text {
            padding-left:6px;
            height:72px;
            display:table-cell;
            vertical-align:middle;
        }
        .MIT-acad {
            height:72px;
            border-radius:5px;
            border:solid 1px #eee;
            text-decoration:none;
            color:#282828;
        }
        .redbutton {
           height:72px;
           border-radius:5px;
           border:solid 1px #fff;
           text-decoration:none;
           color:#282828;
           background:#c1213d !important;
           color:#fff !important;
        }
        .redbutton:hover, .redbutton:active {
           background:#c1213d;
           box-shadow:rgba(0,0,0,0.4) 0 3px 3px;
           cursor:pointer;
           border:solid 1px #94192f;
        }
        .innerredbutton {
            margin: 0 auto;
            width: -moz-fit-content;
            width: -webkit-fit-content;
            width: fit-content;
        }
        
        .MIT-acad:hover,.MIT-acad:active {
           background:#c1213d;
           box-shadow:rgba(0,0,0,0.4) 0 3px 3px;
           cursor:pointer;
           color:#fff;
           border:solid 1px #94192f;
           
        }
        
        #Banner {
            padding:0 !important;
        }
       
        #Banner .mit-banner-swiper {
            height:600px;
            width:100% !important;
        }
        #Banner .mit-banner-swiper .swiper-slide {
            display: -webkit-box;
            display: -ms-flexbox;
            display: -webkit-flex;
            display: flex;
            -webkit-box-pack: center;
            -ms-flex-pack: center;
            -webkit-justify-content: center;
            justify-content: center;
            -webkit-box-align: center;
            -ms-flex-align: center;
            -webkit-align-items: center;
            align-items: center;
            background-size:cover !important;
        }

        #ContentBody {
            position:relative;
            margin-top:-100px;
        }
         .mit-banner-extra {
           width: calc(66% - 40px);
            height: 90%;
            text-align: left;
            position: absolute;
            bottom: 0;
            left: 40px;
            background-position: bottom center;
            background-repeat: no-repeat;
            background-size: contain;
            /*padding-bottom:10px;*/
        }
        .mit-banner-desc {
            color:#fff;
            background:rgba(0,0,0,0.7);
            width:calc(33.33% - 40px);
            text-align:left;
            position:absolute;
            bottom:40px;
            right:40px;
            padding-bottom:10px;
        }
        .mit-banner-desc h3 {
            font-family:"Roboto Slab", serif !important;
            padding:0 10px;
        }
        .mit-banner-desc p {
            font-family:"Roboto Condensed",sans-serif !important;
            font-weight:300;
            padding:0 10px;
        }
        .mit-banner-desc ul {
            margin-left:10px;
        }
        .mit-link-button {
            background:#c1213d !important;
            color:#fff !important;
            position:absolute;
            bottom:-30px;
            right:10px;
        }
        .mit-big-logo-container {
            display:none;
        }

        
        /*@media screen and (max-width: 640px) {
            .mit-tab-cover {
                 width:50%;

            }
            .mit-tab-cover .mit-logo {
                margin-top:9px;
                height:120px;
                display:block;
                margin:0 auto;
            }
            .mit-tab-cover .mit-logo-text {
                display:block;
                height:70px;
                margin:0 auto;
            }
        }*/
     
             
        .end-slide {
            background:rgba(0,0,0,0) !important;
      
            border-radius:10px;
            background:#808080;       
        }
        .MIT-acad-programs{
            min-width:240px;
        }
        .MIT-acad-programs a{
            color:#282828;
            font-size:1.3em;
            display:block;
            font-weight:300;
            padding:10px;
            text-decoration:none;            
        }
        .MIT-acad-programs a:hover{
            color:#ffd800 !important;
            background:#c1213d;
            border-radius:3px 3px;
        }
        #Highlights {
            overflow:hidden;
            min-height:400px;
        }
        #Highlights h1{
                    
        }
        #Highlights p{
                 
        }
        .AIMessage {
            min-height:200px;
        }

    .date-container.facebook, .mit-getcon .facebook {
        background:#3c5b9b !important;
    }
    .date-container.twitter, .mit-getcon .twitter {
        background:#2daae2 !important;
    }
    .date-container.youtube, .mit-getcon .youtube {
        background:#e52d27 !important;
    }
    .date-container.flickr, .mit-getcon .flickr {
        background: #FC329B !important;
    }
    .mit-getcon .directory {
        background:#282828 !important;
    }
    .fa {
        font-size:32px;
    }
    .read-button {
        width:100%;
        height:100%;
        display:block;
        
    }
    .mit-getcon span {
        display:inline-block;
        height:56px;
        width:56px;
        border-radius:28px;

    }
    .mit-getcon span i {
        margin: 0 auto;
        line-height: 1.8em;
        left: 28px;
        display: block;
        text-align: center;
        color: #fff;
    }
    .mit-getcon h4 {
        display:inline-block !important;
    }
    .mit-getcon div {
        cursor:pointer;
        border-radius:5px;
    }
    
    .mit-getcon div:hover h4 {
        color:#c1213d !important;        
    }
    .big-play {
        text-decoration: none !important;
        color: #fff;
        display: block;
        margin: 0 auto;
        font-size: 100px;
        width: 100px;
        position: relative;
        top: 100px;
        opacity:0.6;
    }
        .big-play span {
            display:none;
        }
        .big-play:hover {
            opacity:1;
        }
    @media screen and (max-width:840px) {
        .big-play {
        text-decoration: none !important;
        color: #fff;
        display: block;
        margin: 0 auto;
        font-size: 50px;
        width: 140px;
        position: relative;
        top: 10px;
        opacity:0.6;
    }
        .big-play span{
        text-decoration: none !important;
        color: #fff;
        display: block;
        
        font-size: 20px;
        font-family:"Roboto Condensed", sans-serif;
        float: right;
        line-height: 50px;
        
        }
    }
    .mit-social-swiper {
        padding-bottom:10px;
    }
    #Latest h2 {
        display:inline-block;
    }
    .news-swiper-pagination, .ann-swiper-pagination, .cal-swiper-pagination, .social-swiper-pagination {
           display:inline-block !important;
           position: inherit !important;
           float:right !important;
           line-height: 100px !important;
           margin-top: 0 !important;
           width:auto !important;
           bottom:0 !important;
    }
   
    .news-swiper-pagination span, .ann-swiper-pagination span, .cal-swiper-pagination span, .social-swiper-pagination span{
          margin:0 1px !important;
    }
    .social-swiper-pagination .swiper-pagination-bullet-active {
        opacity: 1;
        background: #282828;
    }
    @media screen and (max-width:394px) {
         .ann-swiper-pagination{
           
               line-height: 10px !important;
               margin-bottom: 10px !important;
           
        }
        #Latest h2 {
            margin-bottom:5px;
        }
    }
    /*@media screen and (max-width:480px){
   
    }*/
    .news-swiper-button-next, .news-swiper-button-prev {
           display:inline-block !important;
           display:none !important;
           float:right !important;
           position: inherit !important;
           height: 100px !important;
           margin-top: 0 !important;
    }
             .more-button {
             width:auto;
             display:block;
             text-align:center;
             font-size:1.5em;
             color:#fff;
             margin:0 auto;
             border: solid 1px #94192f;
             border-radius:5px;
             float:right;
         }
         .more-button:hover {
            
            cursor: pointer;
            color:#ffd800;
            
         }
         .social-feed-element img {
             width:72px;
             height:72px;
             margin-top:10px;
             float:right;
         }

         .social-feed-element img {
             width:72px;
             height:72px;
             margin-top:10px;
             float:right;
         }
        /* tablet banner test */
         @media screen and (max-width:1024px){
             .social-feed-element img {
              display:none !important;
             }
            #ContentBody {   
                margin-top:0px;
            }
            #Banner .mit-banner-swiper {
                height:550px;
            }
            
             .mit-banner-extra {
                width: 100%;
                bottom: 0;
                left: 0;
                background-position: bottom center;
                background-repeat: no-repeat;
                background-size: contain;
                /*padding-bottom:10px;*/
            }
            .mit-link-button {
                
                bottom:calc(100% - 30px);
                right:20px;
            }
            .mit-tab-cover .mit-logo {
                margin-top:9px;
                height:120px;
                
            }
            .mit-tab-cover .mit-logo-text {
                
                height:70px;
            }
            .mit-banner-desc p {
                display:none;
            }
            .mit-banner-desc ul {
            display:none;
        }
         
        }
    @media screen and (max-width:1024px) {


        #Banner .swiper-slide {
            height:430px;
        }
        .mit-banner-swiper {
            height:550px !important;
        }
        .mit-banner-desc {
            background: #282828 !important;
            width: 100%;
           
            padding-bottom: 0;
            right:0;
            height: 120px;
            bottom: -120px;
        }
       .mit-banner-desc h3 {
            font-size:30px;
            max-height:80px;
            text-overflow: ellipsis;
            width: calc(100% - 120px);
            margin-left: 120px;
        }
        .mit-tab-cover {
            /*position: absolute;
            z-index: 999;
            left: 0;
            bottom: 100px;
            display: block;
            width: 100%;*/
            position: absolute;
            z-index: 999;
            left: 0;
            bottom: 0;
            display: block;
            width: 120px;
            background: #c1213d;
        }
        .mit-tab-cover .mit-logo {
            margin-top: 9px;
            height: 110px !important;
            width: 110px;
            margin: 5px;
        }
        .mit-tab-cover .mit-logo-text {
            display:none;
        }
        .swiper-container-horizontal>.swiper-pagination {
            bottom: 0;
            left: auto;
            right: 0 !important;
            width: 100%;
        }
     }
    /* mobile response*/
       @media screen and (max-width: 480px) {
           .swiper-container-horizontal>.swiper-pagination {
                bottom: 10px;
                left: 0;
                
                width: 100%;
            }
                #ContentBody {
                     margin-top:0px;
               }
                #Banner .mit-banner-swiper {
                    height:380px;
                }
                #Banner .mit-banner-swiper .swiper-slide {
            
                    background-size:cover !important;
                    /*height:110%;*/
                }
                .mit-banner-desc {
                    color:#fff;
                    background:rgba(0,0,0,.8);
                    width:100%;
                    /*bottom:20px;*/
                    right:0;
                    padding-bottom:0;
                    max-height:188px;
                }
                .mit-link-button {
                bottom:calc(100% - 30px);
                right:20px;
                }
                .mit-banner-desc h3 {
                    
                    padding:10px;
                    padding-top:0;
                    max-height:150px;
                    text-overflow:ellipsis;
                    font-size: 20px;
                    line-height: 24px;
                    width: 100%;
                    margin-left: 0;
                }
                .mit-tab-cover {
                 display:none;
                }
            .mit-big-logo-container {
                display:block;
                width:100%;
                background:#c1213d;
                min-height:140px;
            }
                /*.mit-big-logo-container img {
                    
                    margin:15%;
                    margin-top:2%;
                    width:70%;
                }*/
                .mit-big-logo-container img.mit-logo {
                    
                    
                    margin-top:10px;
                    width:120px;
                    height:120px !important;
                    float:left;
                    display:inline-block;
                    margin-left:10px;
                }
                .mit-big-logo-container img.mit-logo-text {
                    
                    margin:0;
                    width:calc(100% - 140px);
                    height:auto;
                    float:left;
                    display:inline-block;
                    margin-top: 30px;
                   
                }
                /*bigger banner overlay on phone*/
               
        }
       @media screen and (max-width: 480px) {
        .mdl-cell--2-col-phone .mit-icon, .MIT-acad-prog-head .mit-icon {
            height:72px;
            width:100%;
            display:block;
            
            
        }

        .mdl-cell--2-col-phone .mit-icon img, .MIT-acad-prog-head .mit-icon img{
            height:60px;
            margin:6px 0;
            width:100%;
        }
        .mdl-cell--2-col-phone .mit-acad-text {
            
            height:auto;
            display:block;
            vertical-align:middle;
            padding:0;
            margin:5%;
            width:90%;           
            text-align:center;
            font-size:.9em;
        }
        .mdl-cell--2-col-phone.MIT-acad {
            height:auto;
            border-radius:5px;
            border:solid 1px #fff;
            text-decoration:none;
            color:#282828;
        }
        }
    /* mobile banner test */
    @media screen and (max-width:480px) {


        #Banner .swiper-slide {
            height:300px;
        }
        .mit-banner-swiper {
            height:410px !important;
        }
        .mit-banner-desc {
            background: #282828 !important;
            width: 100%;
            bottom: -110px;
            padding-bottom: 0;
            height: 110px;
        }
       .mit-banner-desc h3 {
           
            max-height: 80px !important;
            text-overflow: ellipsis;
            
        }
        
     }