@charset "utf-8";


/* first for Internet Explorer < 9 */
@font-face {
  font-family: DINRoundWeb;
  src: url("../../../fonts/DINRoundWeb/DINRoundWeb.eot");
}

/* then for WOFF-capable browsers */
  @font-face {
  font-family: DINRoundWeb;
  src: url("../../../fonts/DINRoundWeb/DINRoundWeb.woff") format("woff");
}


@font-face {
  font-family: DINRoundWeb;
  src: url("../../../fonts/DINRoundWeb/DINRoundWeb-Bold.eot");
  font-weight: bold;
}



@font-face {
  font-family: DINRoundWeb;
  src: url("../../../fonts/DINRoundWeb/DINRoundWeb-Bold.woff") format("woff");
  font-weight: bold;
}



@font-face {
  font-family: DINRoundWebMedium;
  src: url("../../../fonts/DINRoundWeb/DINRoundWeb-Medium.woff") format("woff");
  font-weight: bold;
}
/*added for LogoTag text*/
@font-face {
	font-family: openSansBold;
	/*src: url("/images/layout/OPENSANS-BOLD.TTF");*/
	  src: url("../../../fonts/OpenSans/OpenSans-Bold-webfont.eot");	
}

@font-face {
	font-family: openSansBold;
	/*src: url("/images/layout/OPENSANS-BOLD.TTF");*/
	  src: url("../../../fonts/OpenSans/OpenSans-Bold-webfont.svg");	
}

@font-face {
	font-family: openSansBold;
	/*src: url("/images/layout/OPENSANS-BOLD.TTF");*/
	  src: url("../../../fonts/OpenSans/OpenSans-Bold-webfont.ttf");	
}

@font-face {
	font-family: openSansBold;
	/*src: url("/images/layout/OPENSANS-BOLD.TTF");*/
	  src: url("../../../fonts/OpenSans/OpenSans-Bold-webfont.woff");	
}


html { 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

body { /*test after go 3 series*/
  color: #000000;
  line-height: 1.5; /* make it percentage to fit all resolution */
  font-family: DINRoundWeb, Helvetica, Arial, sans-serif; /*"Helvetica Neue", Helvetica, Arial, Sans-serif;*/
  font-size: 1.1em;
  background:url(../images/custom1/bg_page.png) repeat;
}


h1,h2,h3 {
  font-family: DINRoundWeb, Helvetica, Arial, sans-serif;
}

h4,h5,h6 {
  font-family: Helvetica, Arial, Sans-serif;
}


/* ----------------   format heading, sub-heading, classes --------------------- */



/* Large desktop */
@media (min-width: 1200px) {


  h1 {
    font-size: 3em;
    line-height: 1.05em;
    font-weight: bold;
  }

  h2 {
    font-size: 2.25em;
    line-height: 1.25em;
    
  }

  h3 {
    font-size: 1.75em;
    line-height: 1.25em;
  }

  h4 {
    font-size: 1.125em;
    line-height: 1.22222222em;
    font-weight: bold;
    margin-top: 0px;
  }
  
  h5, h6 {
  line-height: 20px;
  font-weight: bold;

  }

  h5 {
  font-size: 0.875em;
  }

  h6 {
  font-size: 0.744em;
  }
  
}
 
/* Portrait tablet to landscape and desktop */
@media (min-width: 768px) and (max-width: 979px) { 
  h1 {
    font-size: 2.5em;
    line-height: 1.125em;
  }

  h2 {
    font-size: 2em;
    line-height: 1.25em;
  }

  h3 {
    font-size: 1.5em;
    line-height: 1.25em;

  }

  h4 {
    font-size: 1.125em;
    line-height: 1.222222em;
    font-weight: bold;
  }
  
    p {
   margin: 0 0 1.25em;
	}
  
  li {
   padding: 5px 0 8px 0;
	}
	
}
 
/* Landscape phone to portrait tablet */
@media (max-width: 767px) { 


  h1 {
    font-size: 2em;
    line-height: 1.25em;
  }

  h2 {
    font-size: 1.625em;
    line-height: 1.15384615em;
    /*margin-top: 30px;*/
  }

  h3 {
    font-size: 1.375em;
    line-height: 1.13636364em;
   /* margin-top: 20px;*/
  }

  h4 {
    font-size: 1.125em;
    line-height: 1.111111em;
    font-weight: bold;
    /*margin-top: 20px;*/
  }
  
    p {
   margin: 0 0 1.25em;
	}
  
  li {
   padding: 5px 0 8px 0;
	}
	
}
 


/* -------- for footer section - if this code goes to bottom, it won't work --------*/

#footer {  
  background-color: #5e5e5e;
  margin-top: 15px;
}

.footer {
  border-top: 10px solid #a6cf39;
}

#footer ul {
  font-family: DINRoundWeb, Helvetica, Arial, sans-serif;
  font-size: 14px;
  line-height: 20px;
  color: #dcdcdc;
  list-style: none;
  margin-bottom: 10px; /*added*/
}

/* ----- added to footer ----*/

#footer ul li {
  display: inline;
  padding-right: 5px;
}

#footer p {
  color: #999999;
  font-size: .75em;
}

#footer .row {
  background-color: #5e5e5e;
}

/* make social media on footer are align right */
.socialmediabottom {
	text-align: right;
}


/* make social media on footer are align left on Landscape phones and down */
@media (max-width: 640px) { 
.socialmediabottom {
	text-align: left;
   }
.socialmediabottom ul{
	margin-left: 0px;
   }


}


#secondaryfooter {
	background-color: #a6cf39; 
	padding: 15px; 
	margin-bottom: -15px; 
	overflow: auto; 
	/*width: 100%;*/
}


#secondaryfooter-left {
	width: 40%; 
	float: left; 
	/*padding-left: 2%; 
	padding-right: 2%;*/
}

#secondaryfooter-middle {
	width: 25%; 
	float: left; 
	/*padding-left: 2%; 
	padding-right: 2%;*/
}

#secondaryfooter-right {
	width: 30%; 
	float: left; 
	/*padding-left: 2%; 
	padding-right: 2%;*/
}

/* make secondary footer responsive */
@media (max-width: 640px) { 
#secondaryfooter-left, #secondaryfooter-middle, #secondaryfooter-right {
	width: 100%;
   }

#secondaryfooter-left {
	margin-bottom: 15px;

}

}


/* ------- for toolbar to collapse - if this code goes to bottom, it won't work -------*/

/* Bootstrap Nav-Collapse Override */
@media(max-width:1200px) {
    body {
        padding-top: 0;
    }

    .navbar-fixed-top-custom {
        position: static;
    }

    .navbar-fixed-top-custom {
        margin-bottom: 20px;
    }

    .navbar-fixed-top-custom .navbar-inner {
        padding: 5px;
    }

    .navbar-custom .container {
        padding: 0;
    }

    .navbar-custom .brand {
        padding-right: 10px;
        padding-left: 10px;
        margin: 0 0 0 -5px;
    }

    .nav-collapse2 {
        clear: both;
    }

    .nav-collapse2 .nav {
        float: none;
        margin: 0 0 10px;
    }

    .nav-collapse2 .nav>li {
        float: none;
    }

    .nav-collapse2 .nav>li>a {
        margin-bottom: 2px;
    }





    .nav-collapse2 .nav>.divider-vertical {
        display: none;
    }

    .nav-collapse2 .nav .nav-header {
        color: #777;
        text-shadow: none;
    }

    .nav-collapse2 .nav>li>a,.nav-collapse2 .dropdown-menu a {
        
        padding: 9px 15px;
        font-weight: bold;
        color: #777;
        -webkit-border-radius: 3px;
        -moz-border-radius: 3px;
        border-radius: 3px;
    }

    .nav-collapse2 .btn {
        padding: 4px 10px 4px;
        font-weight: normal;
        -webkit-border-radius: 4px;
        -moz-border-radius: 4px;
        border-radius: 4px;
    }

    .nav-collapse2 .dropdown-menu li+li a {
        margin-bottom: 2px;
    }

    .nav-collapse2 .nav>li>a:hover,.nav-collapse2 .nav>li>a:focus,.nav-collapse2 .dropdown-menu a:hover,.nav-collapse2 .dropdown-menu a:focus {
        background-color: #f2f2f2;
    }

    .navbar-inverse .nav-collapse2 .nav>li>a,.navbar-inverse .nav-collapse2 .dropdown-menu a {
        color: #999;
        display: inline; /* make audience links display one line */

    }


    .navbar-inverse .nav-collapse2 .nav>li>a:hover,.navbar-inverse .nav-collapse2 .nav>li>a:focus,.navbar-inverse .nav-collapse2 .dropdown-menu a:hover,.navbar-inverse .nav-collapse2 .dropdown-menu a:focus {
/*         background-color: #111; */

    }



    .nav-collapse2.in .btn-group {
        padding: 0;
        margin-top: 5px;
    }

    .nav-collapse2 .dropdown-menu {
        position: static;
        top: auto;
        left: auto;
        display: none;
        float: none;
        max-width: none;
        padding: 0;
        margin: 0 15px;
        background-color: transparent;
        border: 0;
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        border-radius: 0;
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
        box-shadow: none;
    }

    .nav-collapse2 .open>.dropdown-menu {
        display: block;
    }

    .nav-collapse2 .dropdown-menu:before,.nav-collapse2 .dropdown-menu:after {
        display: none;
    }

    .nav-collapse2 .dropdown-menu .divider {
        display: none;
    }

    .nav-collapse2 .nav>li>.dropdown-menu:before,.nav-collapse2 .nav>li>.dropdown-menu:after {
        display: none;
    }

    .nav-collapse2 .navbar-form,.nav-collapse2 .navbar-search {
        float: none;
        padding: 10px 15px;
        margin: 10px 0;
       /* border-top: 1px solid #f2f2f2;
        border-bottom: 1px solid #f2f2f2;*/
        border-top: none;
        border-bottom: none;
        -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,0.1),0 1px 0 rgba(255,255,255,0.1);
        -moz-box-shadow: inset 0 1px 0 rgba(255,255,255,0.1),0 1px 0 rgba(255,255,255,0.1);
        box-shadow: inset 0 1px 0 rgba(255,255,255,0.1),0 1px 0 rgba(255,255,255,0.1);
    }

    .navbar-inverse .nav-collapse2 .navbar-form,.navbar-inverse .nav-collapse2 .navbar-search {
        /*border-top-color: #111;
        border-bottom-color: #111;*/
        border-top: none;
        border-bottom: none;
    }

    .navbar-custom .nav-collapse2 .nav.pull-right {
        float: none;
        margin-left: 0;
    }

    .nav-collapse2,.nav-collapse2.collapse {
        height: 0;
        overflow: hidden;
    }

    .navbar-custom .btn-navbar {
        display: block;
    }

    .navbar-static .navbar-inner {
        padding-right: 10px;
        padding-left: 10px;
    };
    


}

@media(min-width:1201px) {
    .nav-collapse2.collapse {
        height: auto!important;
        overflow: visible!important;
    };
}




/* container section */
/* ------------ add side (left-right) margin and make content area (container) to be white  width = 940 ---------- *//* Smartphones (portrait and landscape) ----------- */

.container .wrapper-menu .container {
  padding: 0px;
}

/* Smartphones (portrait ) ----------- */
@media only screen 
and (min-device-width : 320px) {
  .img-polaroid {
    padding: 2px;
    background-color: #fff;
    border: 1px solid #ccc;
    border: 1px solid rgba(0,0,0,0.2);
    -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.1);
    -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.1);
    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
  }
}

/* iPads (portrait and landscape) ----------- @media (min-width: 768px) and (max-width: 979px){ */
@media (min-width: 768px) and (max-width: 979px) {
  .container,
  .navbar-fixed-top .container,
  .navbar-fixed-bottom .container {
    width: 724px;
    padding-left: 10px;
    padding-right: 10px;
  }  
  
 .row-fluid .span4 {
   width:31%;
   *width:31%
 }
}

/* iPads (landscape) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) {
 .row-fluid .span4{
 width:31.2%;
 *width:31.2%
 }
}

/* ---------------- end container section ---------------- */

/* ---------------- responsive youtube video ---------------- */
.flex-video {
  position: relative;
  padding-top: 9px; /*..changed from 25px to 9px 7/15 J.James*/
  padding-bottom: 67.5%;
  height: 0;
  margin-bottom: 16px;
  overflow: hidden;
}
 
.flex-video.widescreen { padding-bottom: 57.25%; }
.flex-video.vimeo { padding-top: 0; }
 
.flex-video iframe,
.flex-video object,
.flex-video embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

@media only screen and (max-device-width: 800px), only screen and (device-width: 1024px) and (device-height: 600px), only screen and (width: 1280px) and (orientation: landscape), only screen and (device-width: 800px), only screen and (max-width: 767px) {
  .flex-video { padding-top: 0; }
}

/* ---------------- end responsive youtube video ---------------- */
/* ------------------ class for hr ----------------- */

.borderbottom3 {
  border-bottom: 3px solid #000;
  font-size: 1.969em;
}

.thinhr {
  border-bottom: 1px solid #aaaaaa;
  font-size: 1.969em;
}

.space{
  height: 15px;
  clear: both;
}

.clear{
  clear: both;
}

.footnotedevided {
  border-top: 1px solid #aaaaaa;
  border-bottom: 1px solid #aaaaaa;
  font-size: .85em; 
  color: #aaaaaa;
  padding-top: 10px;
  padding-bottom: 10px;
  margin-top: 30px;
}

/* ------------------ class for link ----------------- */
/* links in general */
a.bluelink {
  text-decoration: none;
}
  
a.bluelink:link,  a.bluelink:active {
  text-decoration: none;
  color: #0077d8;
}

a.bluelink:visited {
  text-decoration: underline;
  color: #005397;
}
  
a.bluelink:hover {
  text-decoration: underline;
  color: #0077d8;
}

a.blacklink {
  text-decoration: none;
  font-size: .9em;
}

a.blacklink:link, a.blacklink:active {
  text-decoration: none;
  color: #000000;
}

a.blacklink:visited {
  text-decoration: underline;
  color: #6c6c6c;
}

a.blacklink:hover {
  text-decoration: underline;
  color: #cf264d;
}


/* links for 4 audience boxes on welcome module on homepage */
a.whitelink {
  text-decoration: none;
}
  
a.whitelink:link,  a.whitelink:active {
  text-decoration: none;
  color: #ffffff;
}

a.whitelink:visited {
  text-decoration: none;
  color: #ffffff;
}
  
a.whitelink:hover {
  text-decoration: none;
  color: #ffffff;
}



/* ------------------ Custom Module Class Suffix ----------------- */

/* for well looking, but have bg color to be #eeeeee */
.wellMagLab{
  min-height:5px;
  padding:3px;
  margin-bottom:0px;
  background-color: #eeeeee;
  padding: 10px;
  border: 1px solid #cccccc;
  -webkit-border-radius:4px;
  -moz-border-radius:4px;
  border-radius:4px;
  -webkit-box-shadow:inset 0 0px 0px rgba(0,0,0,0);
  -moz-box-shadow:inset 0 0px 0px rgba(0,0,0,0);
  box-shadow:inset 0 0px 0px rgba(0,0,0,0)
}




.thumbnailsMagLab > li {
  display: inline-block;
  /*display:inline; /* ie7 fix */
  float: none; /* this is the part that makes it work */
}




.infoboxright {  
  display:block;
  padding:10px;
  margin:20px;
  line-height:20px;
  background-color: #eeeeee;
  border:1px solid #cccccc;
  -webkit-border-radius:4px;
  -moz-border-radius:4px;
  border-radius:4px;  
  float: right;
  width: 35%;
}

.infoboxcenter {  
  display:block;
  padding:10px;
  margin:20px;
  line-height:20px;
  background-color: #eeeeee;
  border:1px solid #cccccc;
  -webkit-border-radius:4px;
  -moz-border-radius:4px;
  border-radius:4px;  
}



@media (max-width: 480px) {

.infoboxright, .infoboxcenter {  
  width: 90%;
 margin-left: auto;
 margin-right: auto;

} 
}



.subsection {  
  display:block;
  padding:5px;
  margin-left:30px;
}


.btn {
  display: inline-block;
  padding: 4px 14px;
  margin-bottom: 0;
  font-size: 14px;
  line-height: 20px;
  color: #ffffff;
  text-align: center;
  text-shadow: 0 0px 0px rgba(255,255,255,0.75);
  vertical-align: middle;
  cursor: pointer;
  background-color: #0077d8;
  background-image: none;
  /*
  background-color: #0077d8;
  background-image: -webkit-gradient(linear,0 0,0 100%,from(#0077d8),to(#0077d8));
  background-image: -webkit-linear-gradient(top,#0077d8,#0077d8);
  background-image: -o-linear-gradient(top,#0077d8,#0077d8);
  background-image: linear-gradient(to bottom,#0077d8,#0077d8);
  background-image: -moz-linear-gradient(top,#0077d8,#0077d8);*/
  background-repeat: repeat-x;
  border: 0px solid #bbb;
  border-color: rgba(0,0,0,0) rgba(0,0,0,0) rgba(0,0,0,0);
  border-color: none;
  border-bottom-color: none;
  -webkit-border-radius: 0px;
  -moz-border-radius: 0px;
  border-radius: 5px;
  filter: progid:dximagetransform.microsoft.gradient(startColorstr='#ff0077d8',endColorstr='#ff0077d8',GradientType=0);
  filter: progid:dximagetransform.microsoft.gradient(enabled=false);
  -webkit-box-shadow: inset 0 0px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
  -moz-box-shadow: inset 0 0px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
  box-shadow: inset 0 0px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
}


.btn:hover,.btn:active,.btn.active,.btn.disabled,.btn[disabled] {
  color:#ffffff;
  background-color:#5e5e5e;
  *background-color:#5e5e5e
}

/* make space below read more button */
p.readmore {
  margin-bottom: 40px;
  padding: 0;
  clear: both;
}


.pagination  {
  display: table;
  text-align: center;
  font-size: 12px;
  margin: 10px auto 20px auto;
  /*margin: 10px auto 20px auto;*/
  border-radius: 5px;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  -khtml-border-radius: 5px;
}


/* Lead - introduction  */
.lead {
  font-size: 1.413em; 
  line-height: 26px;
  text-align: left;
}

/* Lead - on article but feed to category blog  */
.leadcatblog {
  font-size: 1.313em; 
  line-height: 30px;
  margin-bottom: 0px;
  font-weight: 200;
} 
 
 /* small gray text */ 
.graytext {
  font-size: .85em; 
  color: #aaaaaa;
  padding-top: 10px; 
}
 
 /* center the text */
.centertext {
  text-align: center;
}
 
 
 .graytexttitle {
 color: #636363;
 }
 
 
 
/*Image Captions*/
.graycap {
  color: gray !important;
  font-size: 15px;
  line-height: 1.5;
  font-family: 'Open Sans', sans-serif;
}

.centercap {
  text-align: center;
  line-height: 1.5 !important;
  font-size: small !important;
}

.leftcap {
  text-align: left;
}

.rightcap {
  text-align: right;
}



/* hide and show answer using css */
a.answerlink
	{
	text-decoration: none;
	font-weight: bold;
	}

a.answerlink:link, a.answerlink:visited, a.answerlink:active
	{
	position: absolute;
	width: 55px;
	height:	16px;
	text-decoration: none;	
	color: #0c4481;
	overflow: hidden;
	}

a.answerlink:hover
	{
	position: absolute;
	width: 535px;
	height:	16px;
	text-decoration: none;
	color: #990000;
	background-color: #ffffff;
	overflow: visible;
	}
	
/* --------------- toolbar (search box and nav pills) and container -------------- */

/* make both side of toolbar display bg graphic */
.wrapper-toolbar #toolbar .navbar.navbar-fixed-top.navbar-inverse .navbar-inner{
  background:url(../images/custom1/bg_page.png) repeat;
}



/* -----------  add new module position for top bar (search box and top nav) -----------  */


#header {
 position: inherit;
 margin-bottom: 15px;
}


/* to append search form and magnifier */
.input-append button.add-on {
    height: inherit !important;
}

/* make label-info to have our blue background */
/* this is for search box */
.label-info,
.badge-info {
  background-color: #0077d8;
  padding: 8px;
}

.label-info:hover,
.badge-info:hover {
  background-color: #5e5e5e;
}

.label-info a:hover,
.badge-info a:hover {
  text-decoration: none;
}



/* ---------- for primary nav bar -----------*/

/* for regular size  min 1200 px */

/* dark gray bar */
.navbar-inner {
  background-color: #5E5E5E;
  background-image: none !important;
  background-repeat: repeat-x;
  border: 0px solid #D4D4D4;
  border-radius: 0px 0px 0px 0px;
  box-shadow: 0 0px 0px rgba(0, 0, 0, 0.067);
  min-height: 36px;
  padding-left: 0px;
  padding-right: 0px;
   /*filter: progid:dximagetransform.microsoft.gradient(startColorstr='#ff5E5E5E',endColorstr='#ff5E5E5E',GradientType=0);*/
   filter: none;
}

/* solid white line on the right */
#menu .navbar ul.nav li {
  margin-bottom: 0;
  line-height: inherit;
  border-left: solid 3px #017ad6; /*was border-right changed 7/16 J.James*/

}

/* no blue border on first menu */
#menu .navbar ul.nav li:first-child {

  border-left: none;

}

#menu .navbar .nav ul.dropdown-menu li {
  border:none !important;
}

/*#menu .navbar .nav li:first-child {
  border-left: none; 
}*/

.navbar .nav > li > a {
  color: #ffffff;
  float: none;
  padding: 10px;
  text-decoration: none;
  text-shadow: 0 0px 0 #FFFFFF;
  font-family: DINRoundWeb, Helvetica, Arial, serif; 
  font-size: 16px;  
  text-transform: uppercase;  
}

.navbar .nav > li > a:hover {
  color: #ffffff;
  /*background-color: #0077d8;*/
}

.dropdown-menu .sub-menu {
  left: 100%;
  position: absolute;
  top: 0;
  visibility: hidden;
  margin-top: -1px;
}

/* make the caret on the nav bar to be white */
.navbar .nav li.dropdown .dropdown-toggle .caret,
.navbar .nav li.dropdown.open .caret {
  border-top-color: white;
  border-bottom-color: white;
}

/* make the caret on the nav bar to be white on active page*/
.navbar .nav li.dropdown.open > .dropdown-toggle .caret,
.navbar .nav li.dropdown.active > .dropdown-toggle .caret,
.navbar .nav li.dropdown.open.active > .dropdown-toggle .caret {
  border-top-color: white;
  border-bottom-color: white;
}

/* make the caret on the nav bar to be white when mouse hover - default is dark color */
.navbar .nav li.dropdown > a:hover .caret, .navbar .nav li.dropdown > a:focus .caret {
  border-top-color: white;
  border-bottom-color: white;
}

/* make caret disappear for small device */
@media (max-width: 980px) {

  .caret {
    display: none !important;
  }
  
}
/* change background color to blue when on active page - this is for menu that has sub menu */
.navbar .nav li.dropdown.open > .dropdown-toggle,
.navbar .nav li.dropdown.active > .dropdown-toggle,
.navbar .nav li.dropdown.open.active > .dropdown-toggle {
  color:white;
  background-color:#0077d8;
}

/* change background color to blue when on active page - this is for menu that does not has sub menu */
div#nav-menu ul.nav > li.active > a, 
div#nav-menu ul.nav > li.active > a:hover, 
div#nav-menu ul.nav > li.active > a:focus {
  color: #a6cf39;
  text-decoration: none;
  background-color: #5e5e5e;
  box-shadow: 0px 0px 0px rgba(0, 0, 0, 0.125) inset;
  border-color: #a6cf39;
}

.dropdown-menu li > span:hover, .dropdown-menu .active > span {
  background-color: #0077d8;
  background-image: -moz-linear-gradient(center top , #0077d8, #0077d8);
  background-repeat: repeat-x;
  color: #FFFFFF;
  outline: 0 none;
  text-decoration: none;
}

.dropdown-menu a, .dropdown-menu span.separator {
  clear: both;
  display: block;
  font-weight: normal;
  line-height: 18px;
  padding: 3px 15px;
  white-space: nowrap;
}

/* make drop down display */
.dropdown-menu li:hover > .sub-menu {
  visibility: visible;
  z-index: 99;
}

/* base for sub menu */
.dropdown:hover > .dropdown-menu {
  display: block;
  background-color: #dcdcdc;
  border-top: 8px solid rgb(0, 119, 216);
  border-left: 0px;
  border-right: 0px;
  border-bottom: 0px;
  border-radius: 0px 0px 0px 0px;
  box-shadow: 0 0px 0px rgba(0, 0, 0, 0.2); 

}

/* NO white border on the right for sub menu */
.dropdown .dropdown-menu li {
  border-right: none;
  font-family: DINRoundWebMedium, Helvetica, Arial, serif;
  font-size: 16px;  
}

/* make text color on drop down sub menu to #5e5e5e */
.dropdown .dropdown-menu li a {
  color: #5e5e5e;

}

/* when mouse over, change text color on drop down sub menu to #0077d8 */
.dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus, .dropdown-submenu:hover > a, .dropdown-submenu:focus > a {
  color: #0077d8;
  text-decoration: none;
  background-color: transparent;
    /* make no background color when mouse hover on IE 9*/
  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false); 
  background-image: none;
  background-repeat: no-repeat;
}

.nav-tabs .dropdown-menu, .nav-pills .dropdown-menu, .navbar .dropdown-menu {
  margin-top: 0;
}

.navbar .sub-menu:before {
  border-bottom: 7px solid transparent;
  border-left: none;
  border-right: 7px solid rgba(0, 0, 0, 0.2);
  border-top: 7px solid transparent;
  left: -7px;
  top: 10px;
}
.navbar .sub-menu:after {
  border-top: 6px solid transparent;
  border-left: none;
  border-right: 6px solid #fff;
  border-bottom: 6px solid transparent;
  left: 10px;
  top: 11px;
  left: -6px;
}

.navbar a.dropdown-toggle i {
  height: 100%;
  line-height: 100%;
  vertical-align: baseline;
}

.nav > li > span.separator {
  display: block;
  cursor: default;
}

.navbar .nav > li > span.separator {
  color: #555555;
  float: none;
  padding: 10px 15px;
  text-decoration: none;
  text-shadow: 0 1px 0 #FFFFFF;
}

.navbar .nav > .active > span.separator, .navbar .nav > .active > span.separator:hover, .navbar .nav > .active > span.separator:focus {
  background-color: #E5E5E5;
  box-shadow: 0 3px 8px rgba(0, 0, 0, 0.125) inset;
  color: #555555;
  text-decoration: none;
}

.dropdown-menu .active > a, .dropdown-menu .active > a:hover {
  color: white;
}

@media (max-width: 980px)  {


/* when collapse, display only parent of menu item, no drop down menu display*/
.navbar .nav-collapse .dropdown-menu li {
  display: none;
}

/* base for sub menu - no blue thick border on the top */
.dropdown:hover > .dropdown-menu {
	display: none;
    
}

}




}
/* ---------- end primary nav bar -----------*/

/* ------------------ for K2 filter and search module ----------------- */


/* make drop dow menu fit in a narrow area */
/* iPads (portrait) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) {

.k2filter-table select{
width: 95%;

}


}


/* M added this after update to 1.5.4 version */
.modulewhiteBG{
  background-color: #ffffff;
	padding: 20px;
	margin-top: 0px;
  border-width: 10px 0 10px 0;
  border-style: solid;
  border-color: #4C4184;  
}

.modulesearchMA{
  background-color: #ffffff;
	padding: 10px;
	margin-top: 20px;
  border-width: 10px 0 10px 0;
  border-style: solid;
  border-color: #4C4184;  
}

.modulesearchMA h3{
  color: #4C4184;  
  padding-left: 10px;
}

.K2FilterBlock {
    margin-top: 0px;
    border: none;
}

/* change font size from 16 to 21 px */
.K2FilterBlock h3 {
    font-size: 1.2em !important;
    color: #000000;
}


.K2FilterBlock input.button {
   border: none;
     display: inline-block;
  padding: 4px 14px;
  margin-bottom: 0;
  font-size: 14px;
  line-height: 20px;
  color: #ffffff;
  text-align: center;
  text-shadow: 0 0px 0px rgba(255,255,255,0.75);
  vertical-align: middle;
  cursor: pointer;
  background-color: #4C4184;
  background-image: none;
  /*
  background-color: #0077d8;
  background-image: -webkit-gradient(linear,0 0,0 100%,from(#0077d8),to(#0077d8));
  background-image: -webkit-linear-gradient(top,#0077d8,#0077d8);
  background-image: -o-linear-gradient(top,#0077d8,#0077d8);
  background-image: linear-gradient(to bottom,#0077d8,#0077d8);
  background-image: -moz-linear-gradient(top,#0077d8,#0077d8);*/
  background-repeat: repeat-x;
  border: 0px solid #bbb;
  border-color: rgba(0,0,0,0) rgba(0,0,0,0) rgba(0,0,0,0);
  border-color: none;
  border-bottom-color: none;
  -webkit-border-radius: 0px;
  -moz-border-radius: 0px;
  border-radius: 0px;
  filter: progid:dximagetransform.microsoft.gradient(startColorstr='#ff4C4184',endColorstr='#ff4C4184',GradientType=0);
  filter: progid:dximagetransform.microsoft.gradient(enabled=false);
  -webkit-box-shadow: inset 0 0px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
  -moz-box-shadow: inset 0 0px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
  box-shadow: inset 0 0px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
}


.K2FilterBlock input.button:hover,.K2FilterBlock input.button:active,.K2FilterBlock input.button.active,.K2FilterBlock input.button.disabled,.K2FilterBlock input.button[disabled]{
  color:#ffffff;
  background-color:#a6cf39;
  *background-color:#a6cf39
}




/* ------------------ for Noo Timeline ----------------- */

/* make font that displays year, next to minus and plus sign bigger */
.noo-tl-item .noo-tl-time {
	font-size: 16px;
}

/* make padding between text and gray background smaller */
.noo-tl-info {

	padding: 15px 30px;

}

/* make title smaller */
h2.noo-tl-title {
	margin-top: 10px;
	font-size: 1.5em;
	line-height: 1em;
	font-weight: normal;

}

/* make title font color to white */ 
.noo-tl-item h2 a {
	color: #ffffff;
}

/* make content text to black with white background and round border */
.noo-tl-item .noo-tl-desc {
	display: none;
	overflow: hidden;
	color: #000000;
	background-color: #ffffff;
	padding: 15px;
	border-radius: 8px 8px 8px 8px;
}

/* ---------- for IMG ----------- */

img { 
  outline: 0; 
  max-width: 100%; 
  height: auto; 
}

img.floatright { 
  float: right; 
  margin-left: 15px;   
}

img.floatleft { 
  float: left; 
  margin-left: 0px; 
  margin-right: 10px;   
}

img.waysTolearn { 
    padding: 8px;  
}

/* to center image */
img.displayed {
    display: block;
    margin-left: auto;
    margin-right: auto 
}

img.galleryborder {
  border: 1px solid #cccccc;
  padding: 2px;
}

div.figureright {
  float: right;
  border: thin #eeeeee solid;
  margin: 0.5em;
  padding: 0.5em;
}

div.figureright p {
  text-align: center;
  font-style: italic;
  font-size: smaller;
  text-indent: 0;
  background-color: #eeeeee;
}

/* to center image */
.centerdisplayed {
  width: 100%;  
  display: inline-block;
  text-align: center;
}

.centerdisplayed img{
  display: block;
  margin: 0 auto;
  vertical-align: middle;
}

.img_caption {
padding: 15px;
}



/* --------------- Interactive Tutorials -------------- */

.tut-container {
  margin-bottom: 10px;
  text-align: center;
}

.tut-container iframe {
  max-width: none;
  
  /*transform-origin*/
  -webkit-transform-origin:0 0;
     -moz-transform-origin:0 0;
      -ms-transform-origin:0 0;
       -o-transform-origin:0 0;
          transform-origin:0 0;
}

/*hamburger btn*/
#mainNavBtn {
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
  background: transparent;
  margin-top: -2px;
}


/* ------------------  for Search Result page ------------------  

.modulesearchBG{
  background-color: #ffffff;
	padding: 0px 20px;
}

form#searchForm {
  background: #E5F1FD;
  padding: 10px;
}

#searchForm #search_searchword {
  border: 2px #0C3A6D solid;
  color: #0C3A6D
}

#searchForm table td {
  padding: 5px
}



dl.search-results dt.result-title {
  margin: 15px 0 5px 0;
  padding: 5px 0;
  border-top: 1px #ddd solid;
}
 
dl.search-results dd.result-created {
  font-size: 11px;
}
*/

/* ------------------  for 404 error page ------------------  */

/* this box is for 404 error page */
.errorboxwrapper{
	background-color: #ffffff;
	padding: 20px ;
	margin-bottom: 20px;
}

.errorboxwrapper ul li {
	list-style: square;
	color: #000000;
		border-bottom: dotted 1px #878787;
	padding: 5px;
}

.errorboxwrapper ul li:hover {
	color: #0b4a79;
}

/* ------------  for 2 columns big left and small small - use this instead of span 4 --------------  */
.twobigleftcol {
	width: 60%;
	float: left;
	padding-right: 2%;
	border-right: dotted 1px #878787;
	background-color: #ffffff;
}

.twosmallrightcol {
	width: 33%;
	float: left;
	padding-left: 2%;
	padding-right: 2%;
	background-color: #ffffff;
}

/* for less than 1200px  */
@media (max-width: 767px)  {
  .twobigleftcol {
  	width: 90%;
  	padding-left: 5%;
  	padding-right: 5%;
  	border-right: none;
  	float: left;
  	background-color: #ffffff;
  }

  .twosmallrightcol {
  	width: 90%;
  	padding-left: 5%;
  	padding-right: 5%;	
  	float: left;
  	background-color: #ffffff;
  	border-top: dotted 1px #878787;
  }
}





/* ---------- colorful button for colorful module box ---------- */

/* purple button for purple bar */
.purplebtn {
  display: inline-block;
  padding: 4px 14px;
  margin-bottom: 0;
  font-size: 14px;
  line-height: 20px;
  color: #ffffff;
  text-align: center;
  text-shadow: 0 0px 0px rgba(255,255,255,0.75);
  vertical-align: middle;
  cursor: pointer;
  background-color: #4C4184;
  background-image: none;
  /*
  background-color: #0077d8;
  background-image: -webkit-gradient(linear,0 0,0 100%,from(#0077d8),to(#0077d8));
  background-image: -webkit-linear-gradient(top,#0077d8,#0077d8);
  background-image: -o-linear-gradient(top,#0077d8,#0077d8);
  background-image: linear-gradient(to bottom,#0077d8,#0077d8);
  background-image: -moz-linear-gradient(top,#0077d8,#0077d8);*/
  background-repeat: repeat-x;
  border: 0px solid #bbb;
  border-color: rgba(0,0,0,0) rgba(0,0,0,0) rgba(0,0,0,0);
  border-color: none;
  border-bottom-color: none;
  -webkit-border-radius: 0px;
  -moz-border-radius: 0px;
  border-radius: 0px;
  filter: progid:dximagetransform.microsoft.gradient(startColorstr='#ff4C4184',endColorstr='#ff4C4184',GradientType=0);
  filter: progid:dximagetransform.microsoft.gradient(enabled=false);
  -webkit-box-shadow: inset 0 0px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
  -moz-box-shadow: inset 0 0px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
  box-shadow: inset 0 0px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
}

.purplebtn:hover,.purplebtn:active,.purplebtn.active,.purplebtn.disabled,.purplebtn[disabled]{
  color:#ffffff;
  background-color:#a6cf39;
  *background-color:#a6cf39
}


/* green button for green bar */
.greenbtn {
  display: inline-block;
  padding: 4px 14px;
  margin-bottom: 0;
  font-size: 14px;
  line-height: 20px;
  color: #ffffff;
  text-align: center;
  text-shadow: 0 0px 0px rgba(255,255,255,0.75);
  vertical-align: middle;
  cursor: pointer;
  background-color: #a6cf39;
  background-image: none;
  /*
  background-color: #0077d8;
  background-image: -webkit-gradient(linear,0 0,0 100%,from(#0077d8),to(#0077d8));
  background-image: -webkit-linear-gradient(top,#0077d8,#0077d8);
  background-image: -o-linear-gradient(top,#0077d8,#0077d8);
  background-image: linear-gradient(to bottom,#0077d8,#0077d8);
  background-image: -moz-linear-gradient(top,#0077d8,#0077d8);*/
  background-repeat: repeat-x;
  border: 0px solid #bbb;
  border-color: rgba(0,0,0,0) rgba(0,0,0,0) rgba(0,0,0,0);
  border-color: none;
  border-bottom-color: none;
  -webkit-border-radius: 0px;
  -moz-border-radius: 0px;
  border-radius: 0px;
  filter: progid:dximagetransform.microsoft.gradient(startColorstr='#ffa6cf39',endColorstr='#ffa6cf39',GradientType=0);
  filter: progid:dximagetransform.microsoft.gradient(enabled=false);
  -webkit-box-shadow: inset 0 0px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
  -moz-box-shadow: inset 0 0px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
  box-shadow: inset 0 0px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
}

.greenbtn:hover,.greenbtn:active,.greenbtn.active,.greenbtn.disabled,.greenbtn[disabled]{
  color:#ffffff;
  background-color:#fcb042;
  *background-color:#fcb042
}


/* orange button for orange bar */
.orangebtn {
  display: inline-block;
  padding: 4px 14px;
  margin-bottom: 0;
  font-size: 14px;
  line-height: 20px;
  color: #ffffff;
  text-align: center;
  text-shadow: 0 0px 0px rgba(255,255,255,0.75);
  vertical-align: middle;
  cursor: pointer;
  background-color: #fcb042;
  background-image: none;
  /*
  background-color: #0077d8;
  background-image: -webkit-gradient(linear,0 0,0 100%,from(#0077d8),to(#0077d8));
  background-image: -webkit-linear-gradient(top,#0077d8,#0077d8);
  background-image: -o-linear-gradient(top,#0077d8,#0077d8);
  background-image: linear-gradient(to bottom,#0077d8,#0077d8);
  background-image: -moz-linear-gradient(top,#0077d8,#0077d8);*/
  background-repeat: repeat-x;
  border: 0px solid #bbb;
  border-color: rgba(0,0,0,0) rgba(0,0,0,0) rgba(0,0,0,0);
  border-color: none;
  border-bottom-color: none;
  -webkit-border-radius: 0px;
  -moz-border-radius: 0px;
  border-radius: 0px;
  filter: progid:dximagetransform.microsoft.gradient(startColorstr='#fffcb042',endColorstr='#fffcb042',GradientType=0);
  filter: progid:dximagetransform.microsoft.gradient(enabled=false);
  -webkit-box-shadow: inset 0 0px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
  -moz-box-shadow: inset 0 0px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
  box-shadow: inset 0 0px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
}

.orangebtn:hover,.orangebtn:active,.orangebtn.active,.orangebtn.disabled,.orangebtn[disabled]{
  color:#ffffff;
  background-color:#4c4184;
  *background-color:#4c4184
}


/*--BOXES--*/
.whiteBox, .orangeBox, .greenBox, .pinkBox {
  background-color: white;
  padding: 5px 18px;
  overflow: hidden;
}

/* welcome heading */
.whiteBox h1 {
  margin-top: 15px;
  color: #0088cc;
  padding-bottom: 0;
  font-size: 48.5px;
}

.orangeBox, .greenBox, .pinkBox {
  border-width: 10px 0 10px 0;
  border-style: solid;
}

.orangeBox, .greenBox, .pinkBox h1 {
  text-align: left;
}




/*--ORANGE--*/
.orangeBox {
  border-color: #fcb042;
}


.orangeBox h1,
.orangeBox h2,
.orangeBox h3 {
  color: #fcb042;
}

/*--GREEN--*/
.greenBox {
  border-color: #a6cf39;
}

.greenBox h1,
.greenBox h2,
.greenBox h3  {
  color: #a6cf39;
}

/*--PINK - change to violet --*/
.pinkBox {
  border-color: #4C4184;
}

.pinkBox h1,
.pinkBox h2,
.pinkBox h3 {
  color: #4C4184;
} 

.whiteBox {
  margin-bottom: 30px;
}

/*--color boxes for main splash page--*/
.orangeBG,
.greenBG,
.pinkBG {
  	padding: 8px 4px;
  	text-align: center;
  	min-height: 40px;
  	/*line-height: 40px;*/
	cursor: pointer;
    color: #fff;
    font-weight: bold;
}

.orangeBG {
  background-color: #fcb042;
}

.greenBG {
  background-color: #a6cf39;
}

.pinkBG {
  background-color: #4C4184;
}

.orangeBG:hover {
  background: url(/images/layout/welcomeYellowPattern.png) repeat;
}

.greenBG:hover {
  background: url(/images/layout/welcomeGreenPattern.png) repeat;
}

.pinkBG:hover {
  background: url(/images/layout/welcomeRedPattern.png) repeat;
}


/*------------------ Ways to learn module ------------------*/
img.waysTolearn {
  padding: 11px 0 0 0;
}

.waysTolearnTable {
  border-collapse: separate;
  border-spacing: 0px;
  margin: 0 auto;
  width: 100%;
  margin-top: -18px;
}

.waysTolearnTable td {
  padding: 8px;
}

#sidebar1 div.orangeBox p.lead {
  font-size: 1.35em;
  font-weight: bolder;
}

/*------------------ featured video module ------------------*/
.ftVideo {
  padding: 3px 18px 0 18px;
	overflow: hidden;
	float: none !important;
	margin-left: 0px !important;
}

div.ftVideo h1 {
	text-align: left;
	color: #4C4184;
}

div.ftVideo p {
	margin-top: -14px;
	padding-bottom: 0px;
}

/*------------------ Welcome Module ------------------*/


/* audience boxes in welcome box - large desktop */
.welcomeBoxes {
	height: 50px;
	width: 40%;
	float: left;
 	padding: 8px; 
	margin: 8px;

}


.welcomeBoxes span {
 	color: white;
	font-family: DINRoundWeb, Helvetica, Arial, sans-serif;
	font-weight: bold; 
	font-size: 1em;
    display: table-cell; 
    vertical-align: middle; 
    text-align: center; 
}




.teacherDIV {
	background-color: #4c4184;
	display: table;
}

.teacherDIV:hover {
  background: url(/images/layout/welcomeRedPattern.png) repeat;
  cursor: pointer;
}


.studentDIV {
	background-color: #FBAF42;
	display: table;
}

.studentDIV:hover {
  background: url(/images/layout/welcomeYellowPattern.png) repeat;
  cursor: pointer;
}


.adultDIV {
	background-color: #A5CE3A;
	display: table;

}

.adultDIV:hover {
  background: url(/images/layout/welcomeGreenPattern.png) repeat;
  cursor: pointer;
}

.teenDIV {
	background-color: #1B88CA;
	display: table;
}

.teenDIV:hover {
  background: url(/images/layout/welcomeBluePattern.png) repeat;
  cursor: pointer;
}


@media (max-width: 1200px) {

.welcomeBoxes {

	width: 85%;
	height: auto;


}

}





/*--------------- "Learn About MagLab" module ---------------*/
.right-caret {
  border-bottom: 5px solid transparent;
  border-top: 5px solid transparent;
  border-left: 5px solid #0088cc;
  display: inline-block;
  height: 0;
  vertical-align: top;
  width: 0;
  margin: 4px 0px 0px 4px;
}

.learnModule td {
  text-align: left;
  padding: 0 0 9px 0;
  color: #0088cc;
  font-weight: bold;
}

div.learnAbout p.lead1 {
  font-size: 1.413em; 
  line-height: 26px;
  text-align: left;
  color: #0088cc;
  font-weight: 600;
  margin-bottom: 15px;
}

div.learnAbout p.lead2 {
  line-height: 26px;
  text-align: left; 
  margin-top: -17px; 
  font-size:1em;
}

table.learnModule {
	border: 0;
	margin-top: -9px;
  margin-bottom: 15px;
}

/*--------------- modules in article ---------------*/
.row-fluid:before {
  height: 27px;
}

a.dropdown-toggle {
  display: none;
}

.learnAbout {
	margin-bottom: 15px;
	float: right !important;
  padding: 3px 18px 0 18px;
}

/*--------------- Toolbar - audience links and search box  ---------------*/
li#imaClick.imaFirst span {
/*   border-radius: 5px; */
}

/* green background for toolbar */
.navbar-fixed-top {
  background-color: #a6cf39;
	filter: none;
}

.custom-toolbar ul.nav-pills li {
   padding-top: 10px; 
}


.custom-toolbar ul.nav-pills li > a {
  color: #000000 !important;
  text-shadow: none !important;
  font-family: DIN, Helvetica, Arial, serif !important;
}



.custom-toolbar ul.nav-pills li > a:hover {
  color: #ffffff !important;
  background-color: #0077d8;

}

@media (max-width: 1200px) {
/* make audiences links display in one line */

.custom-toolbar {
padding-top: 10px;

}

.custom-toolbar ul.nav-pills li {
   display: inline ; 
}

.custom-toolbar ul.nav-pills li > a:hover {
  padding-top: 10px;

}

}


@media (max-width: 767px) { 

  .custom-toolbar  {
   padding-left: 20px; 
}

}


/* A link back to MagLab Home on top left of toolbar position*/

/*added from nav.php*/
h4.matitle {
  display: inline;
  float: left;
  margin-top: 20px;
  padding-right: 40px;
}


h4.matitle a {
  font-size: 0.875em;
  text-decoration: none;
  color: black;
}

h4.matitle a:hover {
  text-decoration: none;
  color: #ffffff;
}


a#magTap {
  background: none !important;
  margin-top: 3px;
}

/* bump MagLab Home to the right for tablet to phone  */
@media (max-width: 767px) { 

  h4.matitle {
     padding-left: 20px; 
  }
  

}

 
  
/* end MagLab Home */



/* Custom Toolbar */
/* for large desktop pull-right, other than that pull-left */
@media (min-width: 1025px) {
.search-container {
	float: right;
}
}

/* ----------- make toolbar search table responsive  ---------------*/
@media 
only screen and (max-width: 360px),
(min-device-width: 320px) and (max-device-width: 360px)  {

  
table.search-container, 
.search-container thead, 
.search-container tbody,
.search-container tr, 
.search-container th, 
.search-container td{
    display: block;


}


}


/* make primary nav bar stick underneath toolbar */

#menuNav.affix {
    position: fixed;
    top: 54px;
/*     width: 100%; */
    z-index: 999;

}



@media 
only screen and (max-width: 979px),
(min-device-width: 768px) and (max-device-width: 1024px) {
#menuNav.affix {
        position: static;
    }

}

/* need to fix this */
#nav-toolbar #goButton input {
  border-radius: 5px;
}




/*------------------ find my science module ---------------*/
.searchBy {
	border-top: 10px solid #a6cf39; 
	border-bottom: 10px solid #a6cf39; 
	background-color: white; 
	padding: 18px 18px 2px 18px;
	margin-bottom: 30px; /* add space between 2 boxes */
}

div.searchBy h1 {
	color: #a6cf39;
}

#sidebar1 td#goButton input {
/*   border-radius: 5px; */
}

/*------------------ banner - Logo position ------------------*/
.exploreText {
  width: 336px;
}

.academyLogo {
	width: 557px;
	margin-right: 19px;
}

.imgAndtext {
	text-align: justify;
	height: auto;
	float: left;
	width: 100%;
/*     margin: 0 auto; */
margin-top: 10px;
}

.logoTag {
	font-family: 'openSansBold';
	font-size: 1.2em;
	color: #a6cf39;

}

.logoDiv {
	float: left;
}

.exploreTag {
	margin-left: 20px;
}

.logoDiv a {
	color: #a6cf39;
	text-decoration: none;
}

.logoDiv a:hover {
	color: #ffffff;
	text-decoration: none;
}

.logoSpan {
	color: #a6cf39;
	text-decoration: none;
	cursor: default;	
}

.logoSpan:visited {
	display: none;
}

@media (max-width: 1199px) {

  .exploreText {
  	width: 263px;
  }


  .logoTag {
  	font-size: 0.9em;
  }

  .academyLogo {
  	width: 413px;
  }
}

/* @media (max-width: 979px) */
@media (max-width: 979px) { 

  .exploreText {
  	width: 216px;
  }

  .academyLogo {
	width: 321px;
  }

  .logoTag {
  	font-size: 0.7em;
  }

}


@media (max-width: 616px) {
  .exploreText {
  	display: none !important;
  }
}


/*----------- primary nav bar - jj --------*/
.navbar .nav > li {
  cursor: pointer;
}

#menuNav div#nav-menu ul.nav li > a {
  cursor: pointer;
}

#menuNav .dropdown-menu li > a:hover {
  border-left: solid 3px #0088cc;
  padding-left: 17px;
}

/* padding for primary nav bar */
#nav-menu ul.nav > li > a { 
  border-left: solid 3px #5e5e5e;
  padding: 10px 22px 10px 27px;
}

@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape){

#nav-menu ul.nav > li > a { 
  padding: 10px;
}
}


#menu .navbar .nav > li > a:hover {  
  border-left: solid 3px #a6cf39;
  color: #a6cf39;
}

#menu .dropdown-menu {
  padding: 0;
}

#menu .dropdown-menu > li > a {
  padding: 7px 20px 7px 20px;
}

/*Pill menu mobile*/
.nav-collapse .nav > li > a {
	font-weight: normal;
}


li#imaClick {
  margin: 12px 0 0 30px;
}


.navbar-fixed-top .navbar-inner {
  padding: 0px;
}




@media (min-width: 980px) {
   /*navbar title - disappear - desktop*/
  #mobMenuTitle {
    display: none;
  }

  nav#menu ul.nav {
    margin-top: 0px;
  }
}

/*Top Nav Bar Media Queries*/
@media (min-width: 980px) { /*screen>= 980? then apply*/
  ul.thumbnails li.span3 {
/*     margin-left: -96px; */
  }



  ul#jsddm {
    display: none;
  }

  /*Navbar style adjustments - desktop*/
  .navbar-inner > table {
    margin-top: -2px !important;
  }

  .caret {
    margin-left: 4px !important;
  }
}





/*SMART SLIDER 2 HACKS*/

div#nextend-smart-slider-17 {
  margin: 0 0 36px !important;
  width: 100%;
}



@media (max-width: 1199px) {
  .navbar .nav > li > a {
    font-size: 14px;
  }

  .thumbnails > li#span7b {
    margin-left: 10px !important;
  }

  .navbar .nav {
    padding: 0 0px 0 0;
    margin: 0 1px 0 0;
  }





  .navbar-fixed-top .container {
    background: none;
  }


  div#nav-menu ul.nav > li > a { 
    padding: 10px 15px 10px 14px !important;
  }

}

/* @media (max-width: 979px) */
@media (max-width: 979px) { 


  ul.thumbnails li.span7 {
    display: none;
  }

  ul#jsddm {
    display: inline;
    margin-top: 14px;
  }

/* make toolbar background green on IE 9 */
  nav#toolbar {
    background-color: #a7cf3a !important;
    filter: none;
    height: inherit;
  }

  ul.thumbnails {
    padding-top: 1px !important;
  }

  ul.thumbnails .span3 {
    margin-left: ;
  }

  #jsddmb li span {
    width: 167px !important;
  }

  #jsddmb li span b {
    font-size: 16px !important;
    vertical-align: -2px;
  }

  #jsddmb li span {
    height: 23px !important;
    padding: 14px 12px !important;
  }

  #jsddmb li span img {
    height: 14px !important;
    padding-left: 85px !important;
    margin-top: 7px !important;
  }
  
  nav#menu ul.nav {
    margin-top: -2px;
  }

  .navbar .nav li {
    padding: 0 0px 0 0px;    
  }

  .navbar-inner table {
    margin-top: 7px !important;
  }

  ul#jsddmb ul {
    width: 191px;
  }


 .navbar-fixed-top .container {
    background: #a6cf39;
    filter: none;
  }



  .navbar .nav li {
    border-right: none !important;
  }



  div#nav-menu ul.nav > li > a {
    border: none;
  }

  #menu .navbar .nav li {
    border: none;
  }




  nav#toolbar div.navbar-fixed-top {
  	margin-bottom: 0px;
  }



  #menu .navbar ul.nav li {
    border: none;
  }

  #toolbar .container {
    padding-bottom: 4px;
  }
  
  
  
  
}

@media (max-width: 767px)  {
  /* no white right border when me nu collapse */
  .navbar .nav > li {
    border-right: 0px solid #ffffff;
  }

  /* when collapse, display only parent of menu item, no drop down menu display*/
  .navbar .nav-collapse .dropdown-menu li {
    display: none;
  }

  /* base for sub menu - no blue thick border on the top */
  .dropdown:hover > .dropdown-menu {
    display: none;
  }

  body {
    padding-left: 1px;
    padding-right: 1px;
    padding-top: 0px;
  }

  .container {
    margin-left: 15px;
    margin-right: 15px;
    width: auto;
  }

  #footer .container .row {
    width: auto;
    padding:10px 14px;
  }

  #jsddmb li span {
    width: 213px !important;
    height: 26px !important;
  }

  #jsddmb li span b {
    font-size: 19px !important;
  }

  #jsddmb li span img {
    padding-left: 123px !important;
    margin-top: 3px !important;
  }



  ul#jsddmb ul {
    width: 237px;
  }


  nav#toolbar div.container {
    width: 97%;
  }



  .ju-tabs-accordion-title span {
    font-size: 1.8em;
  }

  nav#toolbar div.navbar-fixed-top {
    margin-right: 0;
  }

  .navbar-inner > div.container {
    padding: 0 7px 4px 0 !important;
  }



  div#menuNav {
  	margin: 0;
  }
}

/* move down */



/*Logo adjustments*/
div#logo div.custom p {
  margin-bottom: -16px;
}

#jutabby {
  margin: 0; 
  background-color: #cae288;
}

#jutabbyTitle {
  background-color: #a6cf39; 
  height: 60px; 
  display: block; 
  margin-top: -6px;
  width: 100%;
}

#jutabbyTitle h1 {
  padding-top: 14px;
}

div.nextend-widget-bullet {
  bottom: -24px !important;
}


@media (max-width: 350px) {



  ul#jsddm li.imaFirst {
    margin: 10px 0 0 6px !important;
  }

  div#logo img:first-child {
    margin-top: -2px;
  }
  
  li#imaClick {
    margin: 10px 0 0 15px;
  } 
}

nav#menu div#nav-menu {
  background: gray;
}



ul#jsddm {
  cursor: pointer;
}

li#imaClick span b {
  font-weight: normal;
  color: white;
  font-size: 14px !important;
  font-family: Helvetica Neue, Helvetica, Arial, sans-serif !important;
  vertical-align: -2px;
  cursor: pointer;
}

li#imaClick img {
  height: 10px;
  padding-left: 37px;
  margin-top: 3px;
}

img#searchButtonA {
  margin-top: 5px;
}

nav#menu div.navbar-inner table {
  margin-top: 0px;
  width: 100%;
}


/*----------- make cryogenics for english majors table responsive ---------------*/
@media 
only screen and (max-width: 760px),
(min-device-width: 768px) and (max-device-width: 1024px)  {

  
table.cryogenics-table, 
.cryogenics-table thead, 
.cryogenics-table tbody,
.cryogenics-table tr, 
.cryogenics-table th, 
.cryogenics-table td{
    display: block;

}
  
/* Hide table headers (but not display: none;, for accessibility) */
.cryogenics-table thead tr{
  position: absolute;
  top: -9999px;
  left: -9999px;
}
  
.cryogenics-table tr { 
   border: 1px solid #ccc; 
}
	
.cryogenics-table td { 
	/* Behave  like a "row" */
   border: none;
   border-bottom: 1px solid #eee; 
   position: relative;
   padding-left: 25%; 
}
	
.cryogenics-table td:before { 
	/* Now like a table header */
	position: absolute;
	/* Top/left values mimic padding */
	top: 6px;
	left: 6px;
/* 	width: 45%;  */
	padding-right: 10px; 
	white-space: nowrap;
}
	
/* Label heading of that table */
.cryogenics-table	td:nth-of-type(1):before { content: "Location"; }
.cryogenics-table	td:nth-of-type(2):before { content: "°C"; }
.cryogenics-table	td:nth-of-type(3):before { content: "°F"; }
.cryogenics-table	td:nth-of-type(4):before { content: "K"; } 
  
}


/* ----- make margin bottom and lable text in li bigger than 14 pt for vegetable MRI ---- */
label {
    display: block;
    margin-bottom: 10px;
}



label, input, button, select, textarea {
    font-size: 1.1em;
    font-weight: normal;
    line-height: 20px;
}