﻿@charset "utf-8";
/* CSS Document */

/* 

=========================
----Table of Contents----
=========================

I.    Default styles for MOBILE

      ii.   Skip Navigation tab
    
      iii.  Closed mobile menus
      
      iv.   Open mobile menu
      
      v.    Utility menu - .ng-menu-action-mobile (login, athletics etc).
      
      vi.   Dropdown menus
            - list items and content inside accordions
            - Feature tabs
      
      vii.  Mobile search
      
      viii.   Left Menu
    
      ix.   Footer
            -     Follow section
            -     Explore section
            -     Connect Section
            
            
            
            
II.   Styles for @media 1366px

III.  Styles for @media 1200px

IV.   Styles for @media 992px

      i.    menu styles
      ii.   footer styles

V.    Styles for @media 768px

      i.    Closed menu styles
            -     menu icon
            -     logo
            
      ii.   Action navigation
            -     cougartrack
            -     apply/request info
            
      iii.  Navigation with drop downs
            -     drop down headers (previously buttons)
            -     drop down link lists
            -     drop down tabs (ask scooter, fatv, quad, sports)
            
      iv.   Search Bar
      
      v.    Footer

VI.   Styles for @media 480px

      i.    Closed menu styles
            
      ii.   Action navigation
            
      iii.  Drop down tabs
            
      iv.   Search Bar
      
      v.    Footer

VII.  Styles for @media 320px



=============================
----End Table of Contents----
=============================

*/


/*mobile first starts here*/


/* Skip Navigation */

.ng-skip-navigation {
    display: block;
    position: absolute;
    top: 0;
    left: -200px;
	font-family: museo-sans-500, "Open Sans", Arial, sans-serif;
	transition: all .2s ease-in-out;
}

    .ng-skip-navigation:focus {
        display: block;
        position: absolute;
        top: 0;
        left: 0;
		color: #1a1a1a;
		background-color: #ffd800;
		padding: 8px 20px;
    }



/* -------Closed mobile menu------- */

h2 .ng-menu-search-icon-container {
    position: absolute;
    top: 12px;
    right: 70px;
    width: 40px;
    height: 40px;
    padding: 7px;
    border: 2px solid #fff;
    box-sizing: border-box;
}


.ng-menu {
	/*background-color: #002855; unsure if this is necessary, but causing a border effect on the logo at tablet sizes - ep 11/14*/
	margin: 0;
	padding: 0;
	top: 0;
	width: 100%;
    z-index: 99;
    position: static;
    height: auto;
}

	.ng-menu * { /* overide any default margins to 0 */
		margin: 0;
		padding: 0;
	}
	
	.ng-menu a {
		color: #1a1a1a;
	}
   
.ng-menu-header {
    background-color: #002855;
    height: 72px;
    margin: 0;
    padding: 0;
    width: 100%;
    float: left;
}

        .ng-menu-header .ng-menu-open-button {
            color: #fff;
            display: block;
            font-family: museo-sans-500, "Open Sans", Arial, sans-serif;
            height: 60px;
            line-height: 35px;
            position: absolute;
            top: 0;
            right: 10px;
            text-align: center;
            text-transform: uppercase;
            width: 50px;
            font-size: 10px;
        }

        .ng-menu-open-button:after {
                content: "\2261";
                font-size: 32px;
                position: absolute;
                top: 25px;
                left: 20%;
                width: 60%;
                
                /* scale the X */
                -webkit-transform:scale(1.2,1.5); /* Safari and Chrome */ /* Firefox */ /* IE 9+ */ /* Opera */
            
                transform : scale(1.2,1.5);
                color:#fff;
            } 

        .ng-menu-logo {
            background: url(/img/logo.svg);
            background-repeat: no-repeat;
            background-size: contain;
            display: block;
            height: 50px;
            margin: 10px 0 17px 5%;
            width: 175px;
        }
        
        .ng-menu-of-missouri .ng-menu-logo {
            background: url(/img/logo-of-missouri-stacked-white.svg);
            background-repeat: no-repeat;
            background-size: contain;
            background-position: left;
            height: 80px;
            margin-top: 5px;
        }

            .ng-menu-of-missouri .ng-menu-header {
                height: 90px;
            }

            .ng-menu-logo-alt-text {
                position: absolute;
                left: -1000px;
            }
            
            
/* -------Open mobile menu------- */       
            
/*mobile close button*/
            .ng-menu-action-mobile .ng-menu-close-button {
                background-color: #fff;
                color: #1a1a1a;
                display: block;
                font-family: museo-sans-500, "Open Sans", Arial, sans-serif;
                height: 47px;
                line-height: 20px;
                position: absolute;
                top: 10px;
                right: 10px;
                text-align: center;
                text-transform: uppercase;
                width: 45px;
                font-size: 10px;
            }
            
                .ng-menu-action-mobile .ng-menu-close-button:after {
                    content: "x";
                    color: #000;
                    display: block;
                    font-size: 28px;
                    font-family: museo-sans-100, "Open Sans", Arial, sans-serif;
                    
                    position: absolute;
                    top: 22px;
                    left: 20%;
                    
                    text-align: center;
                    width: 60%;
                    
                    /* scale the X */
                    
                    -webkit-transform:scale(1.4,1); /* Safari and Chrome */ /* Firefox */ /* IE 9+ */ /* Opera */
                    
                    transform : scale(1.4,1);
                }

/*mobile close for search*/
	.ng-menu .ng-menu-search-close-button {
	    display: none;
	    padding: 15px;
	    font-size: 30px;
	    transform: scale(1.4,1);
	    -webkit-transform: scale(1.4,1);
	    font-family: museo-sans-100;
}

/* --------Utility bar (cougartrack, apply, request info)-------- */
    
        .ng-menu-action-mobile {
            display: none;
            /*height: 130px;*/
            position: static;
            width: 100%;
        }
      
        .ng-mobile-open .ng-menu-action-mobile {
            display: block;
        }
        
            .ng-menu-action-mobile .ng-menu-list {
                position: static;
 
                width: 100%;
                background: #fff;
                display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */         /* OLD - Firefox 19- (buggy but mostly works) */
                display: -ms-flexbox;      /* TWEENER - IE 10 */     /* NEW - Chrome */
                display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
                -ms-flex-wrap: wrap;
                    flex-wrap: wrap;
                padding: 15px;
            box-sizing: border-box;
            }

                .ng-menu-action-mobile .ng-menu-list li {
                     /* line-height: 1em;*/
                       text-align: center;  
                       color: #1a1a1a;
                       margin: 0; 
                  }

                .ng-menu-action-mobile .ng-menu-list li a {
                    font-size: 1.4rem; 
                    line-height: 1.8rem;
                    margin-top: 0;
                    width: 100%;
                    /*height: 100%; causing syllabus page to mess up - eg 5/29/18*/
                    display: -webkit-box;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-align: center;
                        -ms-flex-align: center;
                            align-items: center;
                    -webkit-box-pack: center;
                        -ms-flex-pack: center;
                            justify-content: center;
                    padding: 5px;
                  }
                  
                  .ng-menu-action-mobile .ng-menu-list li.ng-action-secondary {
                    width: calc(33.333% - 10px);
                      /*text-decoration: underline;*/
                      text-align: center;
                      border: 3px solid #e5e5e5;
                      /*padding: 5px;*/
                      box-sizing:  border-box;
                      margin: 10px 10px 0 0;
                      
                  } 

		.ng-menu-list li.ng-action-primary, .ng-menu-list li.ng-action-primary:visited {
			color: #1a1a1a;
/*            text-transform: uppercase;*/
/*            height: 50px;*/
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
                -ms-flex-align: center;
                    align-items: center;
            -webkit-box-pack: center;
                -ms-flex-pack: center;
                    justify-content: center;
            font-family: museo-sans-700, "Open Sans", Arial, sans-serif;
            background: #ffd800;
            /*width: 100%;*/
            border-right: 2px solid #fff;
            /*padding: 5px;*/
            margin: 10px 10px 0 0;
            width: calc(33.333% - 10px);
            min-width: 110px;
            box-sizing: border-box;
            min-height: 35px;
            transition: all .2s cubic-bezier(0.4, 0, 0.6, 1);
		}

                .ng-menu-list li.ng-action-primary:not(.ng-locations):hover, .ng-menu-list li.ng-action-primary:not(.ng-locations):focus {
                    background: #ffe86e;   
                }

            .ng-action-primary:last-child {
                  margin-right: 0;
            }

            .ng-action-primary a, .ng-action-primary a:visited {
                font-size: 1.6rem;
                line-height: 1.7rem;
            }

        .ng-menu li:last-child .ng-action-primary {
            border: none;   
        }

        .ng-menu-list li.ng-locations {
            background: transparent;
            border: 3px solid #e5e5e5;
         }
             .ng-menu-list li.ng-locations span {
                 width: 20px; 
                 height: 22px;
                 /*overflow: hidden;*/
                 margin-right: 5px;
             }



/* ------Menu navigation mobile (academics, admissions etc)------ */

.ng-menu-navigation-mobile {
   background-color: #002855;
   clear: both;
   display: none;
   padding: 0;
   position: static;
   width: 100%;
}
 	.ng-menu-list {
		clear: right;
		font-family: museo-sans-100, "Open Sans", Arial, sans-serif;
		list-style-type: none;
		/*overflow: hidden; causing menu to be cut off around tablet sizes - ep 11/15*/
	} 	
    
        .ng-menu-navigation li {
            display: list-item;
        }
        
        /*plus signs on accordions*/
            .ng-menu-drop-down-button {
                display: inline;
                padding: 1px 4px;
            }
        
	
	nav .ng-menu-navigation {
        background-color: #002855;
        display: block;
        float: none;
        height: auto;
        width: 100%; 
	}

        .ng-menu-navigation .ng-menu-navigation-header-highlighted {
            background: inherit;
        }
        
           .ng-menu-navigation-header-title {
                text-decoration: underline;
                font-family: museo-sans-500, 'Open sans', Arial, sans-serif;
            }
            
/* ------Content inside accordions------ */
         .ng-menu-drop-down {
            background: #FAFAFA;
            color: #fff;
            display: none;
            height: auto;
            padding: 8px 0 0 0;
            position: static;
            width: 100%;
            box-shadow: inset 0 0 10px 0 #949494;
            box-sizing: border-box;
        }
        
        .ng-menu-navigation h3 {
			margin: 0;
            text-align: left;
            color: #179b90;  
            text-transform: uppercase;
            width: auto; 
		}
        
        .ng-menu-navigation h3 span {
            display: inline-block;
            padding: 0 5%;
            font-family: museo-sans-700, "Open Sans", Arial, sans-serif;
            font-size: 1.6rem;
			line-height: 1em; 
        }

        .ng-menu-navigation a {
            display: inline-block;
            width:100%; /*adding to make whole bar clickable - ep 10/2*/
            margin: 15px 0;
            color: #fff;
            padding: 0 5%;
            box-sizing: border-box;
            font-family:  museo-sans-300, 'Open sans', Arial, sans-serif;
        }
            .ng-menu-navigation a:hover, .ng-menu-navigation a:active, .ng-menu-navigation a:focus { 
                text-decoration: none;
            }

			.ng-menu-drop-down a {
				color: #1a1a1a;
			}
			
			.ng-menu-drop-down-links {
				float: none;
                padding: 10px 0 0 0;
                width: 100%;
			}

				.ng-menu-drop-down-links ul {
					margin: 0 0 20px 0;
				}

    /*feature tabs - added class to HTML of .ng-feature-tab - can get rid of each specific set of classes*/
        
        a.ng-feature-tab {
            width: 100%; 
            background: #e5e5e5;
            padding: 10px 0 10px 5%;
            display: block;
            position: relative;
            margin: 0;
        }

        a.ng-feature-tab div:not(.cg-action-button) {
            width: 100%; 
        }
        
        a.ng-feature-tab .cg-action-button {
            background: #e92f32;
            background: linear-gradient(100deg, #4b2a4a 0%, #b92e39 40%, #e92f32 80%); 
            position: absolute;  
            right: 10px;
            bottom: 5px;
            width: 25px;
            height: 25px;
        }
        
         a.ng-feature-tab .cg-action-button img {
            margin-bottom: 8px;
            width: 7px;
         }


/* -----------search bar - still in progress on mobile----------- */
	
	.ng-search {
        border-bottom: 1px solid #767676;
        background-color:#1a1a1a;
		height: 25px;
		display: none;
		position: absolute;
		left: 0;
		top: 72px;
        width:calc(100% - 30px);
        z-index:10;
        padding: 15px;
	}
		
		.ng-search-container {
			top: 0;
		}

		
		.ng-search-input {
			border: none;
			background-color: #fff!important;
			font-size: 20px;
			height: 25px;
            background: #1a1a1a;
            width: calc(100% - 50px);
            padding: 0 15px; /* changed from padding: 15px; causing problems with firefox trying height rule instead - ep 11/7 */
            height: 30px;
            font-family:museo-sans-100, "Open Sans", Arial, sans-serif;
		}
		
    .ng-search-button {
            background: #179b90;
			position: absolute;
			height: 55%;
			width: auto;
			padding: 6px 16px;
			margin-left: 0;
			box-sizing: border-box;
		}

/*768 and up? - nope, mobile - I think this is the search icon*/
		.ng-menu-navigation .ng-menu-search-icon-container {
/*			position: absolute;
            top: 0;*/
            display: none;
		}



 /* --------------Left Menu (mobile)-------------- */

/* Left menu */

.ng-left-menu {
    width: 100%;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    background: #f0f0f0;
}

    .ng-left-menu-related-topics {
        background: #179b90;
        color: #fff;
        cursor: pointer;
        cursor: hand;
/*
        display: inline-block;
        float: left;
*/
        height: 40px;
        line-height: 19.5px;
        padding: 5px 0;
/*        text-align: center;*/
        width: 24%;
        min-width: 100px;
    }
    .ng-left-menu-display {
         box-shadow: 0 0 5px #e5e5e5; 
         width: 100%;
    }

        .ng-left-menu-display .ng-left-menu-related-topics {
            /*width: 130px;*/
            margin: 0;
        }
    
        .ng-left-menu-related-arrow {
            line-height: 0;
            position: relative;
            font-size: 36px;
            top: 0;
        }
        
        .ng-left-menu-display .ng-left-menu-related-arrow {
            font-size: 36px;
            top: 0;
        }
    
        .ng-left-menu-related-topics div {
            display: inline-block;
            vertical-align: middle;
            padding-left: 5px;
        }
        
        .ng-left-menu-related-topics-text {
            text-align: left;
            font-size: 1.4rem;
            line-height: 1.8rem;
        }

            .ng-left-menu-related-topics-text br {
                        line-height: 0;
                    }
 
    .ng-left-menu .ng-left-menu-campus { /*removed .ng-left-menu h3 - causing alignment issues - ep 11/13*/
        /*font-size: 14px;*/
        line-height: 30px;
        margin: 0;
        width: 60%;
        float: right;
        text-align: right;
        padding: 0;
        box-sizing: border-box;
        transition: all .35s ease-in-out;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        height: 50px;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;

    }


        .ng-left-menu-campus a, .ng-left-menu h3 a, h2.ng-left-menu-campus {
            font-family: museo-sans-300, "Open Sans", Arial, sans-serif;
            font-size: 19px;
             color: #1a1a1a;
             display: block;
             width: 100%;
             box-sizing: border-box;
            text-decoration: underline;
             padding: 5px 20px 5px 5px;
        }


    .ng-left-menu .ng-left-menu-links {
        display: none;
        margin: 0;
        list-style-type: none;
    }
    
        .ng-left-menu .ng-left-menu-links h3 {
            font-size: 18px;
        }
    
        .ng-left-menu h3 span {
            display: inline;
            margin-left: 0.5em;
        }
    
        .ng-left-menu .ng-left-menu-links div {
            margin: 0;
        }
        
        
        
        .ng-left-menu .ng-left-menu-links a {
            color: #1a1a1a;
            text-decoration: none;
            font-family: museo-sans-300, 'Open sans', Arial, sans-serif;
            display:block; /*added so the links are clickable all the way across - could potentially cause problems - ep 11/3*/
        }
        
        .ng-left-menu .ng-left-menu-links .ng-left-menu-current-page {
                color: #179b90;
            }
            
            .ng-left-menu .ng-left-menu-links li {
                /*line-height: 1em;*/
                background: #fff;
                font-family: museo-sans-100, "Open Sans", Arial, sans-serif;
                margin: 0;
                padding: 10px 0 10px 5%;
                box-sizing: border-box;
        }    
        
            .ng-left-menu-links .ng-left-menu-links-list {
                display: none;
            }
            
            
        
            .ng-left-menu-links .ng-left-menu-links-list a:first-child li {
                margin: 0;
            }
        
            .ng-left-menu-links .ng-left-menu-links-list a:last-child li {
                margin: 1px 0;
            }
        
            .ng-left-menu nav h3, .ng-left-menu aside h3{
                /*background: #e5e5e5;*/
                border: none;
                color: #1a1a1a;
                cursor: pointer;
                cursor: hand;
                display: none;
                margin: 0;
                padding: 10px 0 10px 5%;
                box-sizing: border-box;
                font-size: 1.8rem;
/*                width: 95%;*/
                cursor:default; /* was switching to hand on hover - ep 11/3*/
            }
#innermenu h3 {
    border: none;
    cursor: pointer;
    cursor: hand;
    margin: 1em 0 0.3em 12%;
    box-sizing: border-box;
    font-size: 1.8rem;
    cursor:default; /* was switching to hand on hover - ep 11/3*/   
}
            
            .ng-left-menu-links h3 span {
                font-size: 16px;
                padding: 0 4px;
            }

/* --------------Footer-------------- */
  
    .ng-footer-content {
        background-color: #444444;
        /*padding: 3em 5% 2em 5%;*/
        
        background-image: none;
    }
    
        .ng-footer-content h3 {
            color: #bfbfbf;
        }



        
.ng-footer {
    color: #fff;
    font-family: museo-sans-500, "Open Sans", Arial, sans-serif;
    clear: both;
}

    .ng-footer a {
        color: #fff;
        text-decoration: none;
    }
    
    .ng-footer a:hover {
        text-decoration: underline;
    }

    .ng-footer div {
        display: inline-block;
        margin: 1em 0;
        vertical-align: top;
        width: 100%;
    }
        .ng-footer-content div.ng-footer-link-group:first-child {
            margin-top: 0;
        }

        .ng-footer-content div.ng-footer-link-group {
                min-width: 260px;
                min-width: 280px;
                width: 49%;
                padding: 0 5%;
                box-sizing: border-box;
        }
    

            .ng-footer .ng-footer-social-icons img {
                border-radius: 5px;
                /* transition */
                transition: all .2s ease-in-out;
                width: 40px;
                margin-right: 10px;
            }
        
            .ng-footer .ng-footer-social-icons a:hover > img {
                text-decoration: none;
                box-shadow:         3px 3px 1px #767676;
                  
                -webkit-transform: translate(-3px, -3px);
                  
                        transform: translate(-3px, -3px);
            }
        
            .ng-footer-helper {
                display: inline-block;
                height: 100%;
                vertical-align: middle;
            }
            
    
    .ng-footer-contact {
        background-color: #002855;
        padding: 5rem 5% 8rem 5%;
        text-align: center;
    }

        
    .ng-footer ul {
        list-style-type: none;
        margin: 0;
    }
    
        .ng-footer li {
            margin: 2rem 0 0 0;
        }

        a.ng-link-standalone {
            text-transform: uppercase;
            text-decoration: underline;
            color: #ffd800;
            display: block;
            margin: 20px 0 0 0;
        }

        a.ng-giving {
             color: #fff;   
        }

        .ng-footer address{
            margin: 0;
        }

            .ng-footer address li {
                 margin: 0 0 10px 0;               
            }


    
    .ng-footer-content .ng-mobile-more {
        margin: 0;
        padding: 15px 5%;
        box-sizing: border-box;
        position: relative;
		cursor: pointer;
    }
        
.ng-mobile-more:after {
    content:'+';
    width: 25px;
    height: 25px;
    border-radius: 50%;
    color: #1a1a1a;
    background: #e5e5e5;
    position: absolute;
    right: 5%;
    top: 15px;
    text-align: center;
    font-family: museo-sans-700, 'Open sans', Arial, sans-serif;
}
   
	label[for="ng-footer-more-info"] {
		display: block;
	}

	.ng-footer div.ng-mobile-footer-collapsed-wrap {
		margin: 0;
		padding: 0;
		line-height: 0;
		display: block;
		overflow: hidden;
	}

    .ng-footer div.ng-mobile-footer-collapsed {
        max-height: 0px;
		transition: max-height 0.8s;
		margin: 0;
    }

	#ng-footer-more-info:checked + label + div .ng-mobile-footer-collapsed {
		max-height: 1000px;
	}

	#ng-footer-more-info:checked + .ng-mobile-more:after {
		content: '-';
	}



      

@media screen and (min-width: 769px) {

 h2 .ng-menu-search-icon-container {
display: none;
}  
    

/*Mobile header, opened and closed*/
/*hiding mobile only elements - showing desktop only elements*/
.ng-menu-header .ng-menu-open-button, .ng-menu-action-mobile .ng-menu-close-button, .ng-menu-drop-down-button {
    display: none;
    }
.ng-menu-navigation-mobile, .ng-menu-action-mobile, .ng-menu-navigation .ng-menu-search-icon-container {
      display: block;
} 

/*Utility menu - (login, athletics etc.) - added additional HTML classes for these*/
.ng-menu a {
		font-size: 1.6rem;
	}
    
    .ng-menu-navigation-mobile .ng-menu-list {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
}
     .ng-menu-action-mobile .ng-menu-list {
       -webkit-box-pack: end;
           -ms-flex-pack: end;
               justify-content: flex-end;
       -webkit-box-align: center;
           -ms-flex-align: center;
               align-items: center;
         flex-wrap:wrap;
       /*padding: 20px 10px 20px 300px;*/
       max-width:520px;
         float:right;
    }
    .ng-menu-action-mobile .ng-menu-list li{
       margin: 15px 0 0 10px;
       padding: 0 5px;
    }
        .ng-menu-action-mobile .ng-menu-list li a {
             font-size: 1.5rem; 
            padding: 0;
         }
    .ng-menu-action-mobile .ng-menu-list li.ng-action-secondary {
       margin: 0;
       text-align: center;
        border: none;
        border-right: 1px solid #767676; 
        min-width: 100px; /*changed from 25% because of safari issues - ep 11/14*/
        width: auto;
        padding: 0;
    }


     .ng-menu-action-mobile .ng-menu-list li.ng-giving {
     border: none;   
    }
    /*is this being used at all?*/
    .ng-menu .ng-action-primary, .ng-menu .ng-action-primary:visited {
            height: 40px;
            font-size: 1.7rem;
            text-decoration: none;
            text-transform: none;
            /*padding: 0 30px;*/  
            
		}
        
        .ng-menu .ng-action-primary a {
            font-family: museo-sans-700, 'Open sans', Arial, sans-serif;   
        }
        /*.ng-menu-action-mobile .ng-menu-list { 
            flex-wrap:nowrap;
        }*/
  /*Main menu links - (academics, admissions, etc.)*/    
    .ng-menu-navigation a {
        border: none;  
        margin: 0;
        padding: 0; 
        text-align: center;
        /*height: 100%;*/
        width: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
    }  
    
    .ng-menu-navigation-mobile {
        height: 55px;
        padding: 0;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: end;
            -ms-flex-pack: end;
                justify-content: flex-end;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
    }
    
    .ng-menu-navigation-mobile ul.ng-menu-list{
        width: 100%;
        height: 100%;
        right: 0;
        box-sizing: border-box;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }
    
    .ng-menu-navigation-mobile ul li  {
        -webkit-box-flex: 1;
            -ms-flex: 1;
                flex: 1;
        text-transform: uppercase;
        border-right: 1px solid #fff;
        transition: all .2s cubic-bezier(0.4, 0, 0.6, 1);
    }
    .ng-menu-navigation-mobile ul li:first-child {
        border-left: 1px solid #fff;
    }
    .ng-menu-navigation-header-title {
        text-decoration: none;
        font-size: 1.6rem;
        line-height: 1.6rem;
        padding: 10px;
        box-sizing: border-box; 
        font-family: museo-sans-700, 'Open sans', Arial, sans-serif;
    }   
    
     .ng-menu-navigation .ng-menu-search-icon-container {
         display: -webkit-box;
         display: -ms-flexbox;
         display: flex;
         -webkit-box-flex: .5;
             -ms-flex: .5;
                 flex: .5;
         position: static;
     }
     
      .ng-menu-navigation .ng-menu-search-icon-container img {
        height: 25px;
        width: auto;
     }
    
    .ng-menu-navigation-header-highlighted, .ng-menu-navigation-header, .ng-menu-search-icon {
        height: 55px!important; /* adding for safari - ep 11/14*/
    }
    .ng-menu-list .ng-menu-navigation-header-highlighted {
        background: #637087;
        height: 100%;
        width: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
    }
    
    .ng-menu-navigation-mobile ul li:hover, .ng-menu-search-icon-container:hover {
        background: #0f417a;   
    }
 
 /*drop down links and h3 lists*/   
        .ng-menu-navigation h3, .ng-menu-navigation h3 span {
			color: #179b90;
            text-transform: none;
		}
        
     .ng-menu-navigation-mobile ul ul li, .ng-menu-navigation-mobile ul ul li a, .ng-menu-navigation-mobile ul ul li:hover  {
        -webkit-box-flex: 0;
            -ms-flex: none;
                flex: none;
        text-align: left;
        text-transform: none;
        display: block;
        background: #fff;
    }
    
     .ng-menu-navigation-mobile ul ul li a{
            margin: 0;
            padding: 0;
        } 
    
    
    /*color and style changes*/
     .ng-menu-action-mobile {
       background: #fff; 
         height: 115px;
    }

    .ng-menu-header {
        width: 250px;
        height: auto;
        padding: 0 0 5px 20px;
        position: absolute;
        top: 55px;
        left: 10px;
        z-index: 1;
        background-color: #fff;
    }
    
    .ng-menu-logo {
         background: url(/img/logo-blue.svg);
            background-repeat: no-repeat;
            background-size: contain;
            margin: 0;
        height: 70px;
        width: auto;
        margin-top: -20px;
    }  
    
    .ng-menu-of-missouri .ng-menu-header {
        padding: 5px 15px 0 13px;
        width: 150px;
        height: auto;
    }

    .ng-menu-of-missouri .ng-menu-logo {
            background: url(/img/logo-of-missouri-stacked.svg);
        background-size: contain;
        background-repeat: no-repeat;
            background-position: center;
            height: 100px;
            margin-top: -50px;
        }
    
    .ng-menu-navigation h3, .ng-menu-navigation h3 span{
        padding: 0;
        font-size: 1.8rem;  
        margin-bottom: 10px; 
    }
    
 
 /* ---------Drop Down Menus--------- */
	
		.ng-menu-drop-down {
			background: #fff;
            box-shadow: 0 2px 2px #cccccc;
			color: black;
			display: none;
	
			position: absolute;
			left: 0;
			top: 195px; /*110 once the menu bounces back*//*changed from 168 for tablet sizes - ep 11/14*/
			width: 100%;
            z-index: 1;
            padding: 0;
      /* csslint ignore:start */
            /*display: -webkit-box;
            display: -ms-flexbox;
            display: flex; */
            
       /* csslint ignore:end */
		}

    
        .ng-scroll .ng-menu-drop-down {
            top: 55px; /*was 50 - ep 11/13*/
        }

			.ng-menu-drop-down-links {
				padding: 40px 60px 40px 60px;
                -webkit-box-flex: 1.5;
                    -ms-flex: 1.5;
                        flex: 1.5;
                min-width: 500px;
                position: relative;
			}
    .ie .ng-menu {
        height: 60px;
    }
    .ie .ng-menu-action-mobile .ng-menu-list {
        flex-wrap:wrap;
    }
    .ie .ng-footer-helper {
        height: auto;
    }
			
				.ng-menu-drop-down-links div {
					vertical-align: top;
					width: 30%;
                    margin-right: 2%;
                    display: inline-block;
				}
			
				.ng-menu-drop-down-links ul {
					margin: 0 0 30px 0;
				}
                    
                    .ng-menu-drop-down-list li {
                        font-family: museo-sans-500, "Open Sans", Arial, sans-serif;
                        list-style-position: inside;
                        list-style-type: none;
                        margin: 0 0 15px 0;
                        padding: 0;
                    }
                        .ng-menu-drop-down-list li a {
                            width: auto;
                        }
                            .ng-menu-drop-down-list li a:hover {
                                text-decoration: underline;
                            }
			
			.ng-menu-drop-down-image {
				display: -webkit-box;
				display: -ms-flexbox;
				display: flex;
				/*background-size: 606px 450px;*/
				background-repeat: no-repeat;
				background-position: center 10%;
				min-height: 0;
				margin: 0;
				padding: 0;
                -webkit-box-flex: 1;
                    -ms-flex: 1;
                        flex: 1;
                background-size: cover;
                box-sizing: border-box;

			}
            
            /* featured images on drop down tabs */
            
            .ng-menu-drop-down-academics .ng-menu-drop-down-image {            
                background-image: url(../img/online-menu.jpg);
            }
            .ng-menu-drop-down-admissions .ng-menu-drop-down-image {            
                background-image: url(../img/admission.jpg);
            }
            .ng-menu-drop-down-tuition .ng-menu-drop-down-image {            
                background-image: url(../img/tuition.jpg);
            }
            .ng-menu-drop-down-life .ng-menu-drop-down-image {            
                background-image: url(../img/athletics.jpg);
            }
            .ng-menu-drop-down-about .ng-menu-drop-down-image {            
                background-image: url(../img/8.25.15_AthleticCheering_IMG_0577.jpg);
            }
			
			

        /* ----Feature tabs---- */
         a.ng-feature-tab {
            /*width: calc(100% + 120px);  */
            position: absolute;
            bottom: 0;
            left: 0;
            height: 40px;
            text-transform: none;
             width: 100%;
         }  
         
         /*added paragraph tag in HTML for content within feature tab*/
         a.ng-feature-tab p {
            font-family: museo-sans-500, 'Open sans', Arial, sans-serif;
            color: #179b90;
            text-decoration: underline;
            float: right;
            width: auto; 
            padding-right: 50px; 
            box-sizing: border-box;
         }  

                
                
 /* -----------search bar----------- */
	
	.ng-search {
		background-color: #1a1a1a!important;
		height: 90px;
		display: none;
		position: absolute;
		left: 0;
		top: 195px; /* changed with MM updates - ep 11/14*/ 
		width: calc(100% - 25px);
        z-index: 10;
	}
    
    .ng-scroll .ng-search {
        top: 50px;
    }
		
		.ng-search-container {
			position: relative;
			top: 25px;
            width: 60%;
            margin: 0 auto;
		}
	
		.ng-search-form {
			color: white;
		}
		
		.ng-search-input {
			background-color: #fff;
			border: none;
			color: #000;
			font-family: museo-sans-100, "Open Sans", Arial, sans-serif;
			font-size: 22px;
			height: 40px;
			width: 100%;
            padding: 0px 15px;
            box-sizing: border-box;
		}
			
			.ng-search-input::-webkit-search-cancel-button {
				-webkit-appearance: none;
			}
			
			/*.ng-search-input:focus {
				outline: none;
			}*/
		
		.ng-search-button {
            background: #179b90;
            position: absolute;
            top: 0;
            right: 0;
            height: 100%;
            width: auto;
            /*padding: 10px 20px; pretty sure I've removed this before.... making the search icon tiny in safari. ep 11/14 */
            box-sizing: border-box;
		}
 

/*Scroll - should be 768 and up*/
        
.ng-menu {
    position: fixed;
    height: auto;
    background-color: #fff;
}     
.ng-scroll.ng-menu {
    height: 55px;
    position: fixed;
}

.ng-scroll .ng-menu-header {
    display: none;
    }

.ng-menu-header-scroll {
    float: left;
    font-size: 16px;
	height: 50px;
	margin: 0 0 0 5%;
	padding: 0;
	width: 100px;
}
  
.ng-scroll .ng-menu-action-mobile {
        display: none;
    }

.ng-scroll .ng-menu-navigation {
            line-height: 50px;
        } 
 
 
 
 /* Left menu */
.ng-left-menu {
    width: 39.5%;
    display: inline-block;
    margin: 0 0 24px 0;
    padding: 0 0 32px 0;
    vertical-align: top;
    background: #fff;
}

.ng-left-menu-related-topics {
        display: none;
    }

    .ng-left-menu .ng-left-menu-campus, .ng-left-menu h3 {
        /*font-size: 24px;*/
        width: 80%;
        float: none;
        text-align: left;
        padding: 5px 10px 5px 5%;
        margin-left: 5%;
        border: 3px solid #e5e5e5;
        transition: all .35s ease-in-out;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        height: auto;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
    }
        .ng-left-menu-campus:hover {
            border: 3px solid #179b90;
        }

    
        
        .ng-left-menu-campus a:hover {
            text-decoration: underline;
        }
    
    .ng-left-menu nav h3 {
            background: transparent;
            margin: 1em 0 0.3em 12%;
            padding: 0;
            width: 70%;
            display: block; 
        
            font-family: museo-sans-700, 'Open sans', Arial, sans-serif;
            font-size: 1.8rem;
            line-height: 2.4rem;
            border: none;
            color: #444444;
        }   
    
    
  /*used to exclude .menuhead with   .ng-left-menu nav h3:not(.menuhead):before {   */ 
    .ng-left-menu nav h3:before {
            content: url(../img/green-boxes.png);
            margin-right: 5px;
        }       
    
    
    .ng-left-menu .ng-left-menu-links {
        margin: 0 0 1.3em 12%;
        display: block;
    }
    
    .ng-left-menu .ng-left-menu-links li {
            font-family: museo-sans-300, "Open Sans", Arial, sans-serif;
            padding: 0;
            background: transparent;
        font-size: 1.7rem;
    }
    
    .ng-left-menu h3 span {
        display: none;
    }
    
        .ng-left-menu .ng-left-menu-links div {
            margin: 0 0 1.3em 0;
        }
        
            .ng-left-menu .ng-left-menu-links a:hover {
                text-decoration: underline;
            }
      
    .ng-left-menu .ng-left-menu-links li {
            
            
            margin: 0.8em 0 0 0;
            width: 75%;
    }


/* footer */
 
    .ng-footer {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }
    
    .ng-footer-content, .ng-footer-contact {
        -webkit-box-flex: 1;
            -ms-flex: 1;
                flex: 1;
    }  
    
    .ng-footer-content{
        padding: 20px 20px 30px 20px;
    }
    
    .ng-footer div.ng-mobile-footer-collapsed {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
		max-height: inherit;
    }
    .ng-footer-content div.ng-footer-link-group{
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        width: calc(50% - 20px);
        min-width: 0;
        margin: 0;
        box-sizing: border-box;
        text-align: left;
        /*align-items: center;*/
    }
        .ng-footer ul {
            padding-bottom: 20px;       
        }

    
    .ng-footer-content div.ng-footer-link-group:nth-child(2){
        -webkit-box-ordinal-group: 4;
            -ms-flex-order: 3;
                order: 3;
    }
    .ng-footer-content div.ng-footer-link-group:nth-child(3){
        margin-top: 0;
    }
    .ng-footer-content div.ng-footer-link-group:last-child{
        -webkit-box-ordinal-group: 5;
            -ms-flex-order: 4;
                order: 4;
    }
    
    .ng-footer-contact{
        padding: 0;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
    }
    
    a.ng-link-standalone {
        text-decoration: none;
    }

    .ng-footer .ng-mobile-more {
        display: none;
    }


  
}
    
@media screen and (min-width: 992px) {
    .ng-menu-action-mobile .ng-menu-list {
        padding: 20px 10px 20px 500px; 
    }
    .ng-menu-action-mobile .ng-menu-list {
        flex-wrap:nowrap;
        max-width:none;
    }

     .ng-left-menu {
        width: 25%;
    }
    .ng-menu-drop-down, .ng-search {
        top: 170px;
    }
    


}
    
    
    
 /*new media queries*/
@media screen and (min-width: 1200px) {
          
     .ng-menu-header {
        left: 50px;  
        padding: 5px 0 5px 20px; 
     } 

        .ng-menu-of-missouri .ng-menu-header {
            padding: 5px 15px 5px 13px;
        }


    .ng-menu-list li.ng-locations {
        background: transparent;
        border: none;
        border-left: 2px solid #f0f0f0;
    }
    .ng-menu-action-mobile {
        height: auto;
    }
     .ng-menu-action-mobile .ng-menu-list {
        padding: 0;
    }

    .ng-menu-action-mobile .ng-menu-list li, .ng-menu-action-mobile .ng-menu-list li.ng-action-secondary {
        min-width: 0;
        /*padding: 0 20px;*/
        margin: 0;
    }

    .ng-menu-action-mobile .ng-menu-list li a {
        padding: 0 20px;
    }

    .ng-menu-list li.ng-action-primary, .ng-menu-list li.ng-action-primary:visited {
        height: 60px;  
        width: auto;
    }  


     .ng-menu-navigation-mobile ul.ng-menu-list {
        padding-left: 320px;
    }   

    .ng-menu-drop-down {
        top: 115px;
    }   

    .ng-search {
        top: 116px;
    }        
   
}
    
    



/* -------Simple menu/footer------- */
.ng-menu-simple .ng-menu-header .ng-menu-open-button, .ng-menu-simple .ng-menu-action-mobile .ng-menu-close-button {
    display: none;
}

.ng-menu-simple .ng-menu-action-mobile {
    display: block;
    width: auto;
    background: transparent;
    position: absolute;
    top: 20px;
    right: 20px;
}

.ng-menu-simple .ng-menu-action-mobile .ng-menu-list {
    padding: 0;
}

.ng-menu-simple .ng-menu-list li.ng-action-primary, .ng-menu-simple .ng-menu-list li.ng-action-primary:visited {
    margin: 0;
    border:  none;
    min-width: 100px;
}


/*library-specific styles for after reskin go-live*/
.ng-library .ng-action-primary {
    max-width: 220px;
    float:right;
    position:absolute;
    right:20px;
    top:20px;
}
.ng-menu.ng-library {
    margin-top:-110px;
}

.ng-footer.ng-library {
    margin-bottom:-50px;
}
.ng-library .ng-footer-contact * {
    text-align: center;
}
.ng-library .ng-footer-contact a img {
    vertical-align: top;
}
    

@media screen and (min-width: 769px) {
    
/* -------Simple menu/footer------- */
 .cg-main-wrapper-simplified {
    padding-top: 80px;
}   
    .ng-menu-simple.ng-menu {
        height: 80px;
        background: #fff;
        box-shadow: 0 0 5px #e5e5e5;
      /*  border-bottom: 5px solid #002855;*/
    }
    
    .ng-menu-simple .ng-menu-header {
        background: transparent;
        top: 0;
        padding: 7px 1px 7px 20px;

    }
    
    .ng-menu-simple .ng-menu-logo {
        margin: 0;
        height: 65px;
    }
    
    
    .ng-menu-simple .ng-menu-action-mobile .ng-menu-list {
        width: auto;
        height: auto;
        padding: 0;
        background: transparent;
        float: right; 
    }
    
   .ng-menu-simple .ng-menu-list li.ng-action-primary, .ng-menu-simple .ng-menu-list li.ng-action-primary:visited {
       min-width: 150px;
       height: 40px; 
       right: 0;
    }
    
    .ng-menu-simple.ng-scroll .ng-menu-header, .ng-menu-simple.ng-scroll .ng-menu-action-mobile {
     display: block;   
    }
    
    .ng-menu-simple.ng-menu.ng-scroll{
        background: #002855;
        box-shadow: none;
        transition: .3s ease-in-out;
    }
    
    .ng-menu-simple.ng-scroll .ng-menu-logo {
    background: url(/img/logo.svg);
    background-repeat: no-repeat;
    background-size: contain;
}
    
    .ng-menu-simple.ng-menu.ng-scroll:hover {
        opacity: 1;
    }
    
    .ng-footer-simple .ng-footer-contact {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: reverse;
            -ms-flex-direction: row-reverse;
                flex-direction: row-reverse;
    }
    
    .ng-footer-simple div {
        margin: 20px 0 0 0;
    }
    
    /*landing pages with simple header/footer */
    .ng-menu-simple + .cg-main-wrapper {
        margin-top: -90px;
    }
    
    /*library specific styles for after reskin go-live - ep 11/16 */
    .ng-menu.ng-library {
        margin-top:0;
    }
    .ng-library .ng-footer-address ul li {
        text-align: center;
    }
    .ng-menu.ng-menu-simple.ng-menu-mobile-no-button.ng-library li.ng-action-primary,  .ng-menu.ng-menu-simple.ng-menu-mobile-no-button.ng-library li.ng-action-primary:visited {
        right: 20px;
    }
    .ng-menu.ng-menu-simple.ng-menu-mobile-no-button.ng-library li.ng-action-primary a {
        width: 100%;
        text-align: center;
        height: 100%;
        padding-top: 10px;
    }
    
    
    @media screen and (min-width: 1200px) {
        .ng-menu-simple + .cg-main-wrapper {
            margin-top: -40px;
        }
    }
    
}








	@media screen and (max-width: 768px) {
		.ng-menu-search-close {
			background-color: #fff;
			color: #1a1a1a;
			display: block;
			font-family: museo-sans-500, "Open Sans", Arial, sans-serif;
			height: 47px;
			line-height: 20px;
			position: absolute;
			top: 10px;
			right: 10px;
			text-align: center;
			text-transform: uppercase;
			width: 45px;
			font-size: 10px;
		}

	/*mobile search close button*/
        .ng-menu .ng-search-close-button {
            background-color: #fff;
            color: #1a1a1a;
            display: none;
            font-family: museo-sans-500, "Open Sans", Arial, sans-serif;
            height: 47px;
            line-height: 20px;
            position: absolute;
            top: 10px;
            right: 65px;
            text-align: center;
            text-transform: uppercase;
            width: 45px;
            font-size: 10px;
        }  

            .ng-menu .ng-search-close-button:after {
                content: "x";
                color: #000;
                display: block;
                font-size: 28px;
                font-family: museo-sans-100, "Open Sans", Arial, sans-serif;
                    
                position: absolute;
                top: 22px;
                left: 20%;
                    
                text-align: center;
                width: 60%;
                    
                /* scale the X */
                    
                -webkit-transform:scale(1.4,1); /* Safari and Chrome */ /* Firefox */ /* IE 9+ */ /* Opera */           
                transform : scale(1.4,1);
            }

	}
	/* disabled on desktop screen sizes */
	.ng-search-close-button {
		display:none;
	}
		
	.ng-menu .ng-menu-search-close-button {
			display: none;
			padding: 15px;
			font-size: 30px;
		}
