/* OVERWRITES core-layout.css and brand-identity-fixed-header.css  */

@import url("https://fonts.googleapis.com/css?family=Open+Sans:300,400,700|Open+Sans+Condensed:300,700");
/*
Site grays
  #000000
  #313131
  #5c5c5c
  #777777
  #989898
  #cccccc
  #e7e7e7
  #fafafa
*/

.align-center {text-align: center;}

div.margin-left {margin-left: 33%;}
hr {width: 70%; margin-left: 15%; margin-right: 15%; margin-bottom: 20px;}

.cover {text-align: center;}

::-moz-selection {

    background: #bfe8f6;
    color: #000 !important;

}


#headerwrapper {

    background: none; width:98%;
}


#fixed-header {

    background:transparent url('/projects/national-security-education-center/seaborg/_assets/images-new/header-background.png') no-repeat 320px 0;

}

.feature-ad {width: 100%;float: left;
    height: 400px;  

}

.feature-ad1 {width: 60%; float: left; margin-top: 20px;
    height: 400px;  text-align: left!important;

}

.feature-ad1 p{color: #fff!important;
    font-size:140%;
    line-height:150%;
    width:73%; 
    margin-left: 7%;
    text-align: left!important;
}

.feature-ad2 {width: 40%;
float: left;
 
}

.feature-ad2 img{
width:100%;  height: 100%; 
 
}

 
.feature-ad1 h1{
    color:#fff!important;
    font-size:210%!important;
    font-weight:700;
     text-align: left!important;
    letter-spacing: 0.04em;
    width:100%; 
    margin-top: 40px; 
    margin-left: 4%;
}


.feature-ad1 h2{
    color:#fff!important;
    font-size: 140%!important;
    font-weight:normal!important;
    background-color: transparent; 
    padding: 20px 20px 10px 20px; 
     text-align: left!important; 
     width: 33%; 
     margin-left: 30%; 
     margin-right: 34%;
}

.feature-ad1 h2 a{ 
    color:#fff!important;
    font-size:140%!important;
    font-weight:normal!important;
    text-align:left; 
    background-color: #ed8907;
    padding: 10px 20px 10px 20px; text-decoration: none!important;
}

.feature-ad1 h2 a:hover{
    color:#777!important;
    font-size:140%!important;
    font-weight:normal!important;
    text-align:left; 
    background-color: #fff;
    padding: 10px 20px 10px 20px; text-decoration: none!important;
}

#fixed-header {

    position: fixed;
    width: 100%;
    height: 180px;
    background: url('/projects/national-security-education-center/seaborg/_assets/images-new/sensor-nexus-nav-bg.png') repeat-x 0 -37px;
    z-index: 300;
    top: 0;

}

body, h1, h2, h3, h4, p, ul, li, ol {font-family: "Open Sans",Helvetica,Arial,sans-serif!important;}

#contentwrapper{font-family: "Open Sans",Helvetica,Arial,sans-serif!important;
    background:transparent url('/projects/national-security-education-center/seaborg/_assets/images-new/homepage-top.jpg') repeat-x -250px 115px!important;
    }

.columns-wide,.columns{width:100%;}

#mainwrapper{font-family: "Open Sans", Helvetica,Arial,sans-serif!important;
    background:transparent url('/projects/national-security-education-center/seaborg/_assets/images-new/body-icon-background.png') no-repeat 22% 1000px;
}





/* PAGE SPECIFIC STYLES */
/* TASK BAR PORTAL */
#task-bar{margin:0px auto 15px auto; max-width:980px;height:320px; clear:both;}
/*#task-bar h1{background:#eee;padding:5px;margin:10px 0 5px 15px;color:#fff;width:21%;-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;}*/
#task-bar .item {width:30%;float:left;background-position: 30px 0; height:320px;}
#task-bar .item img {
    border: 5px solid #ed8907;
    border-radius: 85px;
    height: 148px;
    margin: 10px;
    width: 148px;
}
#task-bar .item img:hover {
    border: 5px solid #ed8907;
    border-radius: 85px;
    height: 148px;
    margin:10px;
    width: 148px;
}

#task-bar .item h2{
    font-size: 19px; 
    font-weight:bold; 
    color:#fff; 
    text-align:center; 
    margin:0 5px 0 5px; 
    padding:8px 8px 0 0;
    white-space:nowrap;
}
#task-bar .item:hover h2, #task-bar .item h2:hover{color:#f8a766;}
#task-bar .item h2 a{color:#f8a766;}
#task-bar .item:hover h2 a{color:#ed8907;}
#task-bar .item#biosurveillance h2{margin-left:-35px;}
#task-bar .item#explosives h2{margin-left:-35px;}
#task-bar .item#radiation h2{margin-left:-35px;}
#task-bar .item#chemistry h2{margin-left:-35px;}
#task-bar .item#special h2{margin-left:-35px;}
#task-bar .item#radiation p{margin-left:-20px;color:#fff!important;}
#task-bar .item p{color:#fff!important; font-size: 125%;line-height:120%;font-weight:bold;text-align:center; margin:-8px 0 0 -20px;padding:0;}
#task-bar .item p a{color:#fff!important;}
#task-bar .item p a:hover{color:#dedede!important;}
#task-bar .item#biosurveillance{width:23%;margin-top: 30px;margin-left:10px;}
#task-bar .item#chemistry{width:23%;margin-left:10px; margin-top:30px;}
#task-bar .item#explosives{width:23%;margin-left:10px;margin-top:30px;}
#task-bar .item#radiation{width:23%;margin-left:10px;margin-top:30px;}
#task-bar .item#special{width:23%;margin-left:10px;margin-top: 30px;}

/* HOMEPAGE EXPAND/COLLAPSE BAR */
.twisty{
    margin:0px 0 -10px 0;
    padding:0;
    position:relative;
    top:-30px;
    width:100%;
}
.twistyOpen, .twistyClosed {
    border-color: white #d9d9cd #d9d9cd white;
    border-radius: 0;
    border-style: solid;
    border-width: 0;
    cursor: pointer;
    font-family: "Open Sans", "Lucida Sans Unicode","Lucida Grande",Helvetica,Arial,sans-serif;
    font-size: 100%;
    font-weight: bold;
    margin-top: 3px;
    padding: 8px 8px 3px 32px;
    height:auto;
    clear:both;
}
.twistyClosed, .twistyClosed:hover,
.twistyOpen, .twistyOpen:hover {
    background: transparent;;
    text-align: center;
    color: #fff;
    border-width:0;
}
.twistyOpen h3, .twistyClosed h3{
    font-weight:normal;
    padding:3px 0 0 0;
    color:#fff;
}
.twistyPanel { font-size:120%;color: #777!important;
    line-height:170%;
    padding: 10px 10px 10px 20px;
    text-align: center;
    background-color: rgba(256,256,256,0.4);
}


#pagecontent .twistyPanel ul{font-size:100%;color: #777!important;
line-height:140%;
    width:100%;}

#pagecontent .twisty ul{ font-size:100%;color: #777!important;
line-height:175%;
    width:70%; margin-left: 30%; margin-right: 0%;}
    
 #pagecontent .twisty p{ font-size:100%;color: #777!important;
line-height:175%;
   width:70%; margin-left: 15%; margin-right: 15%;
}

#pagecontent .twisty li{
    margin:0; list-style-type: outside square !important;
    text-align: left; padding-bottom: 15px;
    width:60%;
}

#pagecontent .twisty h1{font-weight:300;
    padding:20px 0 20px 0;
    color:#F19400;
    font-size:240%; letter-spacing: 0;
    text-align: center;
}


#pagecontent .twisty h2{font-weight:300; letter-spacing: 0;
padding:0px 0 20px 0;
    color:#777;
    font-size:160%;
    text-align: center;
}


#pagecontent .twistyPanel ul.twisty-inline li{
    margin:0;
    text-align: center;
    list-style: none;
    display:inline-block;
    vertical-align:top;
    width:20%;
}
.twistyPanel ul.twisty-inline li h4{
    color:#F19400;
    font-size:240%;
}

/* FEATURE CONTENT BOX */


.feature-content {width:100%;
    background: transparent;
    color: #222;
    margin: -15px 0 20px 0;
    padding: 20px;
    height: auto;

}
.feature-content > div{
    width:100%;
    float:left;
    margin: 1% 20% 5% 20%;
    text-align:center;
}
.feature-content > div.last{
    margin:0;
}
.feature-content p{color: #777!important;
    font-size:120%;
    line-height:170%;
    width:60%; 
    margin-left: 20%;
    text-align: left;
}

.feature-content p.current-postdoc{color: #777!important;float: left;
   height: 130px!important;
    margin-left: 20%;
    text-align: left; 
    margin-top: 0!important; 
    padding-top: 10px!important; 
    margin-bottom: 20px!important;
}


 .feature-content p img.align-center {margin-left: 33%!important; }
 
  .feature-content img.float-left {float:left!important; margin-right: 20px; }
 
.feature-content h1{
    color:#333!important;
    font-size:260%!important;
    font-weight:normal!important;
    text-align:center;
    letter-spacing: 0.04em;
    width:100%;
}



.feature-content h2{
    color:#fff!important;
    font-size:135%!important;
    font-weight:normal!important;
    background-color: transparent; padding: 10px 20px 10px 20px; 
    text-align:center; width: 33%; margin-left: 31%; margin-right: 34%;
}

.feature-content h2.dark {font-size:165%!important;color: #777!important; font-weight: 700!important;width: 60%!important; margin-top: 15px; margin-bottom: 15px; margin-left: 17%!important; margin-right: 15%;}

.feature-content h2 a{ 
    color:#fff!important;
    font-size:100%!important;
    font-weight:normal!important;
    text-align:center; background-color: #ed8907;padding: 10px 20px 10px 20px; 
}

.feature-content h2 a:hover{
    color:#fff!important;
    font-size:100%!important;
    font-weight:normal!important;
    text-align:center; background-color: #333;padding: 10px 20px 10px 20px; 
}



.feature-content ul{ color: #777 !important;
    font-size: 120%!important;
    line-height: 170%!important;
    list-style-position: inside!important;
    width: 80%; margin-left: 15%; text-align: left;
}

.feature-content li {text-align: left;list-style-type: square!important; padding-left: 10px; list-style-color: #777!important;}


.feature-content ul.secondarypage{ color: #777 !important;
    font-size: 120%!important;
    line-height: 170%!important;
    list-style-position: inside!important;
    width: 50%; margin-left: 25%; text-align: left;
}

.feature-content li.secondarypage {text-align: left;list-style-type: square!important; padding-left: 10px; list-style-color: #777!important;}



.header-bar {width: 100%; height: 250px; margin: 10px 0% 40px 0%;}
.header-bar3 {width: 100%; height: 150px; margin: 40px 0% 40px 0%;}

.header-bar h2, .header-bar3 h2{color:#333;
    font-size:260%;
    font-weight:normal!important;
    text-align:center;
    letter-spacing: 0.04em; }

.feature-content2 {width: 240%;
    background:transparent; background: url('/projects/national-security-education-center/seaborg/_assets/images-new/barlett-background.png') repeat-x 0 0px;
    height: 500px;
    color: #222;
    margin-left: -70%; margin-top: 40px;
    padding: 0px;

}


.feature-content2 > div.textbox{width:22%;
    float: right;
    margin-top: 40px; margin-left: 52%; margin-right: 25%;
    text-align:left; height: 500px;
   
}


.feature-content2 > div p{color: #777!important;
    font-size:120%;
    line-height:170%;
}
.feature-content2 h1{
    color:#333;
    font-size:260%;
    font-weight:normal;
    text-align:center;
    letter-spacing: 0.04em;
}
.feature-content2 h2{
    color:#ed8907;
    font-size:195%;
    font-weight:normal;
    text-align:left; 
}

.feature-content2 ul{ color: #777 !important;
    font-size: 120%!important;
    line-height: 170%!important;
    list-style-position: inside!important;
    width: 80%; margin-left: 15%; text-align: left;
}

.feature-content2 li {text-align: left;list-style-type: square!important; padding-left: 10px; list-style-color: #777!important;}
  

.feature-content3 {width: 240%;
    background:transparent; background: url('/projects/national-security-education-center/seaborg/_assets/images-new/fernandez-background.png') repeat-x 0 0px;
    height: 500px;
    color: #222;
    margin-left: -70%; margin-top: 0px;
    padding: 0px;

}


.feature-content3 > div.textbox{
    float:right; margin: 0 52% 0% 25%; width: 23%;padding: 0px 0% 20px 0%; height: 500px;
    text-align:left;
    width:20%;

}


.feature-content3 > div p{color: #777!important;
    font-size:120%;
    line-height:170%;
}
.feature-content3 h1{
    color:#333;
    font-size:260%;
    font-weight:normal;
    text-align:center;
    letter-spacing: 0.04em;
}
.feature-content3 h2{
    color:#ed8907;
    font-size:195%;
    font-weight:normal;
    text-align:left; 
}

.feature-content3 ul{ color: #777 !important;
    font-size: 120%!important;
    line-height: 170%!important;
    list-style-position: inside!important;
    width: 80%; margin-left: 15%; text-align: left;
}

.feature-content3 li {text-align: left;list-style-type: square!important; padding-left: 10px; list-style-color: #777!important;}
  
  
  .feature-content4 {width: 240%;
    background:transparent; background: url('/projects/national-security-education-center/seaborg/_assets/images-new/arq-background.png') repeat-x 0 0px;
    height: 500px;
    color: #222;
    margin-left: -70%; margin-top: 40px;
    padding: 0px;

}


.feature-content4 > div.textbox{width:22%;
    float: right;
    margin-top: 40px; margin-left: 52%; margin-right: 25%;
    text-align:left; height: 500px;
   
}


.feature-content4 > div p{color: #777!important;
    font-size:120%;
    line-height:170%;
}
.feature-content4 h1{
    color:#333;
    font-size:260%;
    font-weight:normal;
    text-align:center;
    letter-spacing: 0.04em;
}
.feature-content4 h2{
    color:#ed8907;
    font-size:195%;
    font-weight:normal;
    text-align:left; 
}

.feature-content4 ul{ color: #777 !important;
    font-size: 120%!important;
    line-height: 170%!important;
    list-style-position: inside!important;
    width: 80%; margin-left: 15%; text-align: left;
}

.feature-content2 li {text-align: left;list-style-type: square!important; padding-left: 10px; list-style-color: #777!important;}
 
/* CONTACT BAR */
#contact-button{margin: 10px auto;}

/* === MEDIA QUERIES === */
/* iPads (portrait and landscape) 
------------------------------------------- */
@media only screen and (max-width : 1024px) {
#contentwrapper {
    background: transparent url("../images/homepage-bubble-background.png") repeat-x scroll 0 255px;
}   
#task-bar .item{
    height:250px;
}
#task-bar .item p {
    font-size: 95%;
}   
#task-bar .item img {
    border: 5px solid #f0a806;
    border-radius: 85px;
    height: 128px;
    margin: 10px;
    width: 128px;
}
#task-bar .item:hover img {
    border: 5px solid #ed8907;
    border-radius: 85px;
    height: 133px;
    margin:5px;
    width: 133px;
}
#task-bar .item h2{
    font-size:18px;
}
#search-expert {
    background: transparent;
}
}
@media only screen and (max-width: 640px) {
.ui-mobile #contentwrapper{
    padding:100px 0 15px;
}
#task-bar{
    width:45%;
    max-width:45%;
    height:auto;
}
#task-bar .item{
    width:100% !important;
    float:none;
    height:auto;
    text-align:center;
    margin:0 0 20px 0;
}
#task-bar #explosives.item, #task-bar #radiation.item, #task-bar #chemistry.item, #task-bar #special.item,{
    margin:0 0 20px 0;
    text-align:center !important;
}
#task-bar .item a{
    text-decoration:none;
}
#task-bar .item img, #task-bar .item:hover img{
    margin: 0; 
    width:83%;
    height:auto;
}
#task-bar .item h2, #task-bar .item p{
    text-align:center !important;
    margin:0;
    padding:5px 0 0 0;
}
#task-bar .item p {
    font-size: 90%;
    margin:5px 0 0 0 !important;
    padding:5px 0 0 0;
}
#task-bar .item#radiation h2, #task-bar .item#special h2{margin-left:-30px;}
#task-bar .item#biosurveillance, 
#task-bar .item#chemistry, 
#task-bar .item#explosives,
#task-bar .item#radiation,
#task-bar .item#special,
#task-bar .item#biosurveillance:hover, 
#task-bar .item#chemistry:hover, 
#task-bar .item#explosives:hover,
#task-bar .item#radiation:hover,
#task-bar .item#special:hover{
    width:100%;
    background-position: 0 70px; 
    background-repeat:no-repeat;
    background-size:contain;
    margin:0;
}

#search-expert {
    display:none;
}
.feature-content{
    width:90%;
    height:auto;
}
.feature-content > div {
    float: none !important;
    margin: 0 auto;
    width:90% !important;
}  
.feature-content h1{
    font-size:220%;
}
}