/*
Theme Name: NUPIP theme
Theme URI: http://html5reset.org
Description: A style-free theme to get you started on an HTML5-based WordPress theme of your own.
Author: Monkey Do! + @ckhicks
Author URI: http://monkeydo.biz
Version: 2.0
License: BSD 2-Clause
License URI: http://opensource.org/licenses/bsd-license.php
*/

/* Ok, this is where the fun starts.
-------------------------------------------------------------------------------*/

/* A Linux- and Windows-friendly sans-serif font stack: http://prospects.mhurrell.co.uk/post/updating-the-helvetica-font-stack */
body {}

/* Using local fonts? Check out Font Squirrel's webfont generator: http://www.fontsquirrel.com/tools/webfont-generator */

/* We like off-black for text. */
body, select, input, textarea {color: #333;}

a {color: #03f;}
a:hover {color: #4e2a84;}

/* Custom text-selection colors (remove any text shadows: http://twitter.com/miketaylr/status/12228805301) */
::-moz-selection{background: #fcd700; color: #fff; text-shadow: none;}
::selection {background: #fcd700; color: #fff; text-shadow: none;}

/*	j.mp/webkit-tap-highlight-color */
a:link {-webkit-tap-highlight-color: #fcd700;}

ins {background-color: #fcd700; color: #000; text-decoration: none;}
mark {background-color: #fcd700; color: #000; font-style: italic; font-weight: bold;}

/* Mozilla dosen't style place holders by default */
input:-moz-placeholder { color:#a9a9a9; }
textarea:-moz-placeholder { color:#a9a9a9; }


/* And here begins the WordPress fun.
-------------------------------------------------------------------------------*/

#wrapper {width: 960px; margin: 20px auto;}

html,body,h1,h2,h3,h4,h5, ul, ol, li, a  {font-family: "Roboto", sans-serif; color: #555; margin:0px; padding:0px;}

    a:hover {
      text-decoration:underline;
    }

    p {
      line-height:1.75;
      margin-top:0;
      margin-bottom:1rem;
    }

    h3 {
      margin-bottom:.5rem;
      font-weight:bold;
      color:#4e2a84;
      font-size:1.5rem;
     
    }

    li {
      padding-left:.25rem;
      margin-left: 2rem;
      margin-bottom:.5rem;
      line-height:1.75;
    }

    #preHeader {
      background-color:#401f68;
      height:70px;
      width:100%;
      margin-bottom:0rem;
      border-bottom: solid .05rem #999;
    }

    #preHeader a {
      text-decoration:none;
      color:inherit;
    }

    #preHeader a:hover {
      text-decoration:none;
      color:inherit;
    }

    #logo-nu {
      width:412px;
      padding-top:.8rem;
      float:left;
    }

    .menu-menu-2-container {
      float:right;
      text-align:right;
      padding-top:1.85rem;
      font-size:.75rem;
    }

    .menu-menu-2-container li {
      list-style:none;
      color:#fff;
      display:inline;
      margin-left:1rem;
      text-transform:uppercase;
    }

    .menu-menu-2-container li:first-child {
      margin-left:0;
    }

    #pageWrapper {
    }

    header {
      padding-bottom:0;
      padding-top:1.5rem;
      text-align:left;
      background-color:#fff;
    }

    header a {
      text-decoration:none;
    }

    header a:hover {
      text-decoration:none;
    }



    #logo {
      margin:0px auto 0px auto;
      

    }

    #wordmark {
      font-family:'Sorts Mill Goudy', Georgia, serif;
      font-size:5.19rem;
      font-weight:500;
      letter-spacing:-.3rem;
      padding-left:1.5rem;
      padding-top:1.75rem;
    }


    .contain-1120 {
      width:1120px;
      margin: 0 auto;
    }

    .col {float:left; width:100%; box-sizing:border-box;}

    .col.c1{width:8.33333%}
    .col.c2{width:16.66666%}
    .col.c3{width:24.99999%}
    .col.c4{width:33.33333%}
    .col.c5{width:41.66666%}
    .col.c6{width:49.99999%}
    .col.c7{width:58.33333%}
    .col.c8{width:66.66666%}
    .col.c9{width:74.99999%}
    .col.c10{width:83.33333%}
    .col.c11{width:91.66666%}
    .col.c12{width:100%;}

    
      .button {
      padding:1rem;
      width:8rem;
      font-family:'Roboto', sans-serif;
      border: none 1px #666;
      border-radius: 5px;
      color:#fff;
      background-color:#4e2a84;
      font-weight:bold;
      text-align:center;
    }

    .button a {
      text-decoration:none;
    }

    
    #splash-home {
      padding-left: 2.75rem;
    }


    .custom-logo {
      width:150px;
      height:auto;
    }

    
    .menu-menu-1-container {
      text-align:right; 
      width:100%; 
      border-bottom:solid 1px #eee; 
      margin-bottom:2rem;
    }

    #menu-menu-1 .menu-item-has-children a:hover {
      cursor:default;
    }

    #menu-menu-1 li {
      display: inline-block;
      text-transform:uppercase;
      font-weight:700;
      font-size:.9rem;
      letter-spacing:.04rem;
      padding-bottom:.5rem; 
      padding-top:.5rem;
      padding-left: .5rem;
      padding-right: .5rem; 
      margin-left: 1rem;
      position:relative;
      color: #777;
      margin-bottom:0;
      line-height:1;
    }

    #menu-menu-1 li a {
      color: #777;
    }

    #menu-menu-1 li:hover a {
      color: #4e2a84;
    }

    #menu-menu-1 .current-menu-item {
      background-color: #fff; 
      color: #4e2a84;
    }

    #menu-menu-1 .current-menu-item a {
      color: #4e2a84;
    }

    #menu-menu-1 .current-menu-item a:hover {
      color: #4e2a84;
    }

    .sub-menu {
      position:absolute;
      top:1.75rem;
      left:0;
      background-color: rgba(64, 31, 104, .85);
      z-index:1;
      color:#fff;
      width:10rem;
      display:none;
      border: solid .05rem #fff;
      /* box-shadow: 2px 2px 2px #666; */
    }

    
    /*
    .menu-item:last-child .sub-menu {
      right:0;
      left:auto;
    }
    */

    .sub-menu li {
      display:block !important;
      text-align: left;
      padding-left: .7rem !important;
      padding-right: 0 !important;
      margin-left: 0 !important;
      text-transform:none !important;
      color:#fff;

    }

    .sub-menu li a {
      color: #fff !important;
      font-weight:normal; 
      opacity:1;
    }

    .sub-menu li a:hover { 
      opacity:1;
      cursor: pointer !important;
    }

    .sub-menu .current-menu-item {
      color: #fff !important;
      background-color: rgba(64, 31, 104, .85) !important;
    }

    .menu-item-has-children:hover .sub-menu {
      display:block;
    }

   
   #sidebar {
    background-color:#E4E0EE;
    padding:1.5rem;
   }

   #sidebar h2 {
    font-size:1.5rem;
    margin-bottom:.35rem; 
    padding-top:0;
    margin-top:0;
   }

   #sidebar .post {
    margin-bottom:1.5rem;
    border-top:solid .1rem #ccc;
    padding-top:1.25rem;
   }

   #sidebar .post:first-child {
    border-top:none .1rem #ccc;
    padding-top:0;
   }

  .lede {
    font-size:1.25rem;
  }

    h2 {
      color:#4e2a84;
    }

    section {
      padding-top:2rem;
    }

    section h2 {
      font-size:2rem;
      font-weight:bold;
    }

    #intro h2 {
      font-weight:normal;
      font-size:1.6rem;
    }

    .article-image {
      width:100%;
      height:16rem;
      background-color:#ccc;
      margin-bottom:1rem;
    }

    article h1 {
      font-family:'Sorts Mill Goudy', Serif;
      font-size:2rem;
      line-height:1;
      margin-bottom:.25rem;

    }

     article h2 {
      font-family:'Roboto', sans-serif;
      font-size:1rem;
      font-weight:300;
      line-height:1.5;
      color:#999;

    }

    .program-image {
      height:8.5rem;
      background-color:#ccc;
      margin-left:.25rem;
      margin-right:.25rem;
      margin-bottom:.5rem;
    }

    .dropdown-left .kicker {
      font-family:'Roboto', sans-serif;
      font-size:.85rem;
      letter-spacing:.1rem;
      font-weight:300;
      margin-bottom:1.25rem;
    }

    .margins {
      width:75%; margin-left: auto; margin-right:auto; 
    }


    footer {
      font-family:'Akkurat Pro Regular', Arial, sans-serif;
      color:#fff;
      font-size:.75rem;
      font-weight:normal;
      -webkit-font-smoothing: antialiased;
      clear:both; 
      background-color:#4e2a84; 
      overflow:auto;
    }

    footer li {
      color:#fff;
      font-family:'Akkurat Pro Regular', Arial, sans-serif;
      color:#fff;
      font-size:.75rem;
      font-weight:normal;
      -webkit-font-smoothing: antialiased;
      list-style:none;
      margin-left:0;
      line-height:1.5;
      margin-bottom:0;
    }

    footer a {
      color:#fff;
      font-family:'Akkurat Pro Regular', Arial, sans-serif;
      color:#fff;
      font-size:.75rem;
      font-weight:normal;
      -webkit-font-smoothing: antialiased;

    }

    footer a:hover {
      color: inherit;
    }

    #intro a {
      text-decoration:none;
    }

    #intro a:hover {
      text-decoration:none;
    }

    main ul {
      list-style: disc;
    }

    
    #mainContent {
      padding-right: 2rem;
    }

    #mainContent h2 {
      margin-bottom: 1rem;
      margin-top: 1rem;
    }

    #mainContent p {
      line-height: 1.75;
    }

    .formWrapper {
      padding:1.25rem;
      border: solid .125rem #4e2a84;
      background-color:#fff;
      border-radius:3px;
    }

    .alert {
      border: solid 1px #CC3D3D;
      padding: .75rem;
      text-align:center;
      color:#fff;
      border-radius:5px;
      background-color:#CC3D3D;
      font-weight:bold;
      font-size:1.25rem;
      margin-bottom:1rem;
    }

    .mc-field-group {
      margin-bottom: 1rem;
    }

    #emailSignup {
      padding-top:1rem;
      padding-right:0;
    }

    #mc_embed_signup {
      background-color:#eee;
      padding:1.5rem;
      border-radius:3px;
      border:solid .01rem #ccc;
    }

    .caption {
      font-size:.9rem;
      color:#666;
      text-align:left;
      line-height:1.2;
      padding-top:.4rem;
    }

    .slides {
      position:absolute;
      opacity:0;
      -webkit-transition: opacity 2s; /* Safari */
      transition: opacity 2s;
      width:100%;
      height:89%;
    }

    .slides img {
      width:100%;
      height:100%;
      object-fit:cover;
    }

    #slidesWrapper {
      position:relative;
      width:100%;
      height:25rem;
    }




@font-face {
    font-family: "Akkurat Pro Light";
    src: url("//common.northwestern.edu/v8/css/fonts/AkkuratProLight.woff") format("woff");
    font-weight: normal;
    font-style: normal;    
}

@font-face {
    font-family: "Akkurat Pro Light Italic";
    src: url("//common.northwestern.edu/v8/css/fonts/AkkuratProLightItalic.woff") format("woff");
    font-weight: normal;
    font-style: normal;        
}

@font-face {
    font-family: "Akkurat Pro Regular";
    src: url("//common.northwestern.edu/v8/css/fonts/AkkuratProRegular.woff") format("woff");
    font-weight: normal;
    font-style: normal;        
}

@font-face {
    font-family: "Akkurat Pro Italic";
    src: url("//common.northwestern.edu/v8/css/fonts/AkkuratProItalic.woff") format("woff");
    font-weight: normal;
    font-style: normal;        
}


/* Print styles!
-------------------------------------------------------------------------------*/
@media print {

}


/* Media queries!
-------------------------------------------------------------------------------*/

/* Always do mobile-first, and consider using em units: http://blog.cloudfour.com/the-ems-have-it-proportional-media-queries-ftw

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

} */

/* FOR TABLETS */
@media only screen and (max-width:1120px){
  .contain-1120 {
      width:95%;
      margin: 0 auto;
      padding-left:0;
      padding-right:0;
    }

    .col {float:left; width:100%; box-sizing:border-box;}

    .col.c1{width:8.33333%}
    .col.c2{width:16.66666%}
    .col.c3{width:24.99999%}
    .col.c4{width:33.33333%}
    .col.c5{width:41.66666%}
    .col.c6{width:49.99999%}
    .col.c7{width:58.33333%}
    .col.c8{width:66.66666%}
    .col.c9{width:74.99999%}
    .col.c10{width:83.33333%}
    .col.c11{width:91.66666%}
    .col.c12{width:100%;}

    #subMenu {

    }

    #splashContainer {
      
    }

    .button h2 {
      font-size:1.25rem !important;
    }

    .tool {
      height:22rem !important;
    }

    .tool .button {
      width: 80% !important;
    }



  

  }

/* Home bottom buttons break down */
@media only screen and (max-width:1000px){

  .tool {
      height:24rem !important;
    }





  }


/* HEADER BREAKS DOWN */
@media only screen and (max-width:827px){

   .tool {
      height:340px !important;
      width:49% !important;
      margin-bottom:1.5rem;
    }

    .hide-827 {
      display:none;
    }

    #logo-wrapper {
      border-right:none 0 #fff !important;
    }

    #footer-content .col.c3 {
      width: 40% !important;
    }


}


/* FOR MOBILE */
@media only screen and (max-width:601px){

  .col.c6{
    width:100%;
    padding-left: 0 !important;
    border-left:none !important;

  }

  .col.c4{width:100%;}

  .col.c8{width:100%;}

  .tool {
    width:90% !important;
    padding-right: 0 !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }

  header {
    overflow:inherit;
    padding-top:.75rem;
  }

  .button {
    max-width:350px !important;
  }

  #splashContainer {
    padding-left:0 !important;
    padding-top:2rem !important;
  }

  #logo {
    float:none !important;
    height: auto !important;
    padding-top: 0rem !important;
  }

  #logo img {
    width: 3.5rem !important;
  }

  #description {
    padding-left:0 !important;
    font-size:.85rem !important;
  }

  .hide-601 {
      display:none;
  }

  #logo-nu {
    width:160px;
  }

  #nu-logo-img {
    background-size: auto 36px !important;
    width:155px !important;
    height:36px !important;
  }

  #logo-wrapper h1 {
    font-size:2.5rem !important;
    padding-top: .1rem !important;
    padding-bottom: .2rem !important;
  }

  #footer-content .col.c3 {
      width: 100% !important;
      padding-bottom:20px;
    }

  .event {
    border-right:none !important;
  }

  #splash {
    background-size: auto 100% !important;
  }

  #form-sidebar h3 {
    margin-top:.5rem !important;
  }

  #form-sidebar-content{
    margin-bottom:1rem;
  }

  .menu-menu-1-container {
    text-align:center !important;
  }

  #menu-menu-1 li {
    padding-left:0;
    padding-right:0;
    margin-left:0;
    margin-right:0;
    display:block;
  }

  #splash-home {
    padding: 0;
  }

  .menu-item-has-children:hover .sub-menu {
      display:none;
    }


    .sub-menu {
      position:static;
      top:0;
      left:0;
      background-color: rgba(64, 31, 104, .85);
      z-index:1;
      color:#fff;
      width:100%;
      display:none;
      border: solid .05rem #fff;
      text-align:center;
      margin-top:.3rem;
      /* box-shadow: 2px 2px 2px #666; */
    }

    .sub-menu li {
      text-align:center;
      padding-left:0 !important;
      border-bottom: none .004rem #402069;
    }

    #logo { 
      border-right:none !important;
  }

  #home-left {
    border-right:none !important;
    padding-right:0 !important;
  }

  #mainContent {
    padding-right: 0 !important; 
  }










}  
