/* --------------------------------------------- 
* moazed.hms.harvard.edu
*-----------------------------------------------*/

@media only screen and (max-width: 880px){
  
    .main-header{
        padding: 0;
    }
 
    .brand.logo {
        max-width: 340px;
        margin-bottom: 18px;
    }
    .site-name{
        vertical-align: top;
    }
    .site-name a {
        font-size: 1.5rem;
    }

    .site-branding__slogan{
        font-size: 11px;
        text-transform: uppercase;
        letter-spacing: 0;
    }
  
    
    
    #block-frontpagebanner,
    #block-frontpagebanner-2{
    height: 200px;
   }
   
   #block-frontpagebanner,
   #block-frontpagebanner-2{
    height: 110px;
    background-image: url(/sites/moazed.hms.harvard.edu/files/images/front-page-banner-1700px.jpg);

   }


#block-frontpagebanner .front-page-banner-text,
#block-frontpagebanner-2 .front-page-banner-text{
    position: relative;
    margin-left: auto;
    margin-right: auto;
    padding-top: 5px;
    padding-left: 10px;
    padding-right: 10px;
}

#block-frontpagebanner .front-page-banner-text h1,
#block-frontpagebanner-2 .front-page-banner-text h1{
    font-size: 1.6rem;
    margin-top: 0;
    margin-bottom: 0;

}

#block-frontpagebanner .front-page-banner-text h4,
#block-frontpagebanner-2 .front-page-banner-text h4{
    font-size: 1.1rem;
    margin-top: 0;

}

.main-menuwrap .container{
  padding-left: 30px;
  padding-right: 30px;
}

}


@media only screen and (min-width: 1100px){
    header.main-header .container{
        background: url('../images/moazed-header-bg-5.jpg');
        background-repeat: no-repeat;
        background-position-x: right;
      }
      
}

@media only screen and (max-width: 670px){


}

@media only screen and (min-width: 540px){
 
 
  .brand.logo {
    padding-right: 20px;
    border-right: 2px solid black;
    margin-right: 14px;
  }

}


@media only screen and (max-width: 540px){
 header.main-header{
     text-align: center;
 }

     .brand.logo {
       padding-bottom: 10px;
       border-bottom: 2px solid black;
       margin-bottom: 10px;
       padding-right: 20px;
   }


}

@media (min-width: 767px){
  .region-primary-menu {
    border-radius: 0;
  }
  .container{
    max-width: 100%;
}
}

@media (min-width: 880px){
    .site-name a{
        font-size: 32px;
    }

    .site-branding__slogan{
        font-size: 12px;
        text-transform: uppercase;
        letter-spacing: 1.2px;
    }
     
     #block-frontpagebanner,
     #block-frontpagebanner-2{
         height: 450px;
         background-image: url(/sites/moazed.hms.harvard.edu/files/images/chromatin_comp03-mirror-2048x460px.jpg);

}


  #block-frontpagebanner .front-page-banner-text,
  #block-frontpagebanner-2 .front-page-banner-text{
      padding-top: 60px;
      position: relative;
      margin-left: auto;
      margin-right: auto;
      padding-right: 20px;
      padding-left: 20px;
      max-width: 980px;
      padding-left: 20px;
      padding-right: 20px;
}

  #block-frontpagebanner .front-page-banner-text h1,
  #block-frontpagebanner-2 .front-page-banner-text h1{
      font-size: 3.5rem;
}


}

  @media (min-width: 1200px){
    .region-header .site-branding {
      width: 1170px;
      margin-right: auto;
      margin-left: auto;
    }
}
/***************************************/

@font-face {
    font-family: Oswald;
    src: url(/sites/moazed.hms.harvard.edu/files/fonts/Oswald-VariableFont_wght.ttf);
  }

html{
    font-size: revert;
}

body{
    font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
    font-size: 1rem;
}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
    margin-bottom: 20px;
    font-family: "Oswald",sans-serif;
    font-weight: 400;
    line-height: 1.5;
}

h3, .h3{
    font-size: 1.6em;
}

h4, .h4{
  font-size: 1.4em;
}

ol, ul {
    padding-left: 40px;
}





a{
  color: #900;
}
a:hover{
    color: red;
}

.region-content{
	   padding: 0 15px 40px 15px;
}

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

h1, .h1{
    font-size: 32px;
}

.main-header{
    background: white;
}

.main-header .region-header{
	display: inherit;
}

.region-header .site-branding{
  padding: 22px 10px;
}

.site-branding__name{
    margin-top: 0;
    margin-bottom: 0;
}

.region-content,
.sidebar{
  *font-size: 110%;
}

.region-sidebar-first h2,
.region-sidebar-second h2{
  color:#FFFFFF;
  margin-top: 0;
  background: #72AC93;
  padding: 12px 15px;
  letter-spacing: 1px;

}

.region-sidebar-first .node h2,
.region-sidebar-second .node h2{

  background: none;
  padding: 0;
  font-size: 18px;
}


/*** intranet ***/
body.path-plasmids #wrapper .container,
body.path-pombe-strains #wrapper .container,
body.path-cerevisiae-strains #wrapper .container,
body.path-japonicus-strains #wrapper .container,
body.page-node-type-cell-line-box #wrapper .container,
body.path-cell-line-details #wrapper .container{
    width: 95%;
    max-width: 100%;
}




.view-filters fieldset{
    border: 2px solid #fff;
    padding: 0 0 5px 5px;
}
.view-filters legend{
    margin-bottom: 5px;
    font-size: 1rem;
    font-weight: 700;
    border-bottom: none;
    float: left; /* moves legend inside the fieldset */
}
.view-filters .fieldset-wrapper .form-item,
.view-filters .fieldset-wrapper .form-actions{
    margin-top: 0;
    margin-bottom: 0;
}

.view-filters .form-item.form-wrapper{
    margin-bottom: .3rem;
}

/*****************************/
#page-title{
  padding-top: 30px;
}
#page-title,
#wrapper{
    background: #F5F6EE;
}

#wrapper .container{
    padding: 0; 
}


.description1{
    text-align: center;
    padding: 20px;
    font-size: 20px;
    color: #34558D;
}

.description2 ul{
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}

.description2 ul li{
    display: block;
    float: left;
    padding: 10px 20px;
}

.main-header{
    padding: 0;
}

.main-header .container{
  width: 100%;
	padding: 0;
}

.main-header .col-md-3{
  width: 100%;
}



.site-name a{
  text-transform: uppercase;
  letter-spacing: 1px;
  font-weight: bold;
  color: #900;
}

.site-name a:hover{
    color: black;
    text-decoration: none;
}



/*** search ***/


#search-block-form{
  width: 200px;
}

/*** search END ***/

/*** highlighted ***/

.container.highlighted{
    width: 100%;
    padding: 0;
}
#block-homepageimage,
#block-frontpagebanner-2,
#block-frontpagebanner,
#block-headerstripe,
#block-headerstripe-2{
    margin: 0;
}
.region-highlighted p{
    margin: 0;
}


#block-headerstripe,
#block-headerstripe-2{
    height: 20px;
    background-image: url(/sites/moazed.hms.harvard.edu/files/images/header-stripe-850x20-a.jpg);
}





#block-frontpagebanner-2 .front-page-banner-text h1,
#block-frontpagebanner-2 .front-page-banner-text h2,
#block-frontpagebanner-2 .front-page-banner-text h3,
#block-frontpagebanner-2 .front-page-banner-text h4,
#block-frontpagebanner-2 .front-page-banner-text h5,
#block-frontpagebanner .front-page-banner-text h1,
#block-frontpagebanner .front-page-banner-text h2,
#block-frontpagebanner .front-page-banner-text h3,
#block-frontpagebanner .front-page-banner-text h4,
#block-frontpagebanner .front-page-banner-text h5{
    color: white;
    text-shadow: 1px 1px 5px #000000;
}

/*********************************/



/*******   menu   ***************/

nav .block{
  margin-bottom: 0;
}

.navbar-header{
    padding-left: 0;
    padding-right: 0;
}

.main-menuwrap{
    text-transform: uppercase;
    background: white;
}


ul.menu-base-theme ul{ /* v.2.0.1 */ /* sub-menu border */
    border: 1px solid #888888;
}

.region-primary-menu, 
.menu-base-theme li a,
.menu-base-theme a.highlighted{
/*    background: #edeee6;*/
    font-family: "Oswald";
    background: #fff;
    color: #333;
    font-weight: 500;
    font-size: .875rem;
}


.menu-base-theme ul a:hover,
.menu-base-theme ul a:active,
.menu-base-theme ul a:focus,
.menu-base-theme > li a:hover,  
.menu-base-theme li.active a,
.menu-base-theme a:active,
.menu-base-theme li a.is-active{
 	 	background: #900;
	 	color: #FFF;

}

.navbar .menu-base-theme ul a.has-submenu, /* v.2.0.1 */
.navbar .menu-base-theme ul a.has-submenu:hover,
.navbar .menu-base-theme ul li:first-child a.has-submenu:active{
    padding: 9px 36px 9px 24px;
}

.navbar-default .navbar-toggle{ /* mobile menu toggle */
		background:#222;
		margin-right:5px;
}

.navbar .menu-base-theme > li:first-child,
.navbar .menu-base-theme > li {
    background: none;
    padding: 0;
    border-left: 1px solid #fff;
}

.navbar .menu-base-theme > li:last-child {

    border-right: 1px solid #fff;
}


.navbar ul#main-menu{
   margin: 0 auto;
   max-width: 1170px;
}

.menu-base-theme a span.sub-arrow, 
.menu-base-theme ul a span.sub-arrow {
    border-style: solid;
}

.menu-base-theme ul a span.sub-arrow{
    border-color: transparent transparent transparent #777;
}

.menu-base-theme > li a:hover span.sub-arrow,
.menu-base-theme a:active span.sub-arrow{
    border-color: #EEE transparent transparent transparent;  
}

.menu-base-theme ul a:hover span.sub-arrow,
.menu-base-theme ul a:active span.sub-arrow{
    border-color: transparent transparent transparent #EEE;
}

.navbar .menu-base-theme a span.sub-arrow{
    border-width: 5px;
}

nav h2#block-intranet-menu{
    display: block;
    background: #3C3B3B;
}
/*** menu ENDS ****************************/


/***** slideshow *****/
.slideshow{
    display: block;
}


/**************************/

/*** page title ***/

h1.page-title{
    font-size: 2rem;
    text-transform: uppercase;
}
/*** page title END ***/



/******* People *******/

.view-people .views-view-grid .views-col{
    width: 510px;
    margin-right: 30px;
}

body.path-people .views-field-field-photo{
    float: left;
    margin-right: 25px;
    margin-bottom: 60px;
}


body.path-people .view-people .views-row{
    display: block;
    overflow: auto;
    margin-bottom: 25px;
}

.view-people .views-field-title h2,
.view-people .views-field-title h3{
    margin-top: 0;
}

.view-people .views-field-title{
    font-weight: bold;
}

.views-field-field-photo a.colorbox img{
	border: 1px solid;
}

.views-field-field-photo a.colorbox img:hover{
	border: 3px solid;
}

/*** people END ***/


/*** photo album ***/

.field--name-field-photos .field__item {
    border: 1px solid #900;
    float: left;
    margin: 3px;
    padding: 1px;
}

/*********************/

/****** Equipment *****/

.view-equipment .views-row{
    display: block;
    overflow: auto;
    margin-bottom: 25px;
}

.view-equipment .views-field-field-image{
    float: left;
    margin-right: 25px;
}

.views-field-field-image a.colorbox img{
    border: 1px solid #900;
    padding: 1px;
}

.view-equipment .views-field-title h2,
.view-equipment .views-field-title h3{
    margin-top: 0;
}

/***********************/





/*** news ***/


#block-views-block-news-block-1 .views-field-title,
body.path-news .views-field-title {
    font-weight: bold;
}
/*** news ENDS ***/




/*** footerwidget ****/

.footerwidget{
    background: #556981;
    color: white;
    padding: 35px 0;
}
.footerwidget .block{
    margin-bottom: 0;
}
.footerwidget h2,
.footerwidget h3,
.footerwidget h4,
.footerwidget h5{
    color: white;
}

.footerwidget img.align-left{
    margin-right: 30px;
    border-radius: 50%;
}


/**********************/



/*** footer ***/

.footer-menu{
    line-height: 2em;
    background: #F5F6EE;
}

.footer-menu .block{
    margin-bottom: 0;
    width: 50%;
}


.footer-menu .col-md-6{
  width: 100%;
}
/*
.footerwidget a,
.footer-menu a{
  color: #DDD;
}

.footerwidget a:hover,
.footer-menu a:hover{
  color: #FFF;
}
*/
.footer-menu .menu li{
  background: rgba(0, 0, 0, 0) url("../images/nav-border.png") repeat-y scroll right center;
  margin-right: 12px;
}


/*** footer END ***/

/*** copyright START ***/



.copyright p{
	margin:13px 0;
	color: #777;

}

/*** copyright ENDS ***/


/******* tooltips *****/



.tooltip {
    position: relative;
    display: inline-block;
    border-bottom: 1px dotted blue;
    opacity: 1;
    z-index: inherit; /* overwrites the bootstrap tooltip class */
    color: blue;

}

.tooltip .tooltiptext {
    visibility: hidden;
    width: 350px;
    background-color: #EEE;
    color: #000;
    text-align: left;
    border: 1px solid #AAA;
    border-radius: 2px;
    padding: 5px;


    position: absolute;
    z-index: 1;
    top: 100%;
    left: 50%;
    margin-left: -175px;
    opacity: 0;
    transition: opacity 0.3s;
}

.tooltip:hover .tooltiptext {
    visibility: visible;
        opacity: 1;
}



/**********************/

/******** paragraphs ******/

.paragraph .field--name-field-subtitle{
    font-size: 20px;
    font-weight: 700;
    margin-top: 25px;
    margin-bottom: 3px;
}

.field--name-field-components{

}

/*

body.research .field--name-field-components .field__item{
     padding: 10px;
     background: #EEE;
}

.paragraph .field--name-field-title{
    font-weight: bold;
    margin-bottom: 12px;
}

.paragraph--type--text-image-right .field--name-field-image{
    float: right;
    max-width: 380px;
    margin-left: 35px;
}
.paragraph--type--text-image-right .field--type-image img{
    border: 1px solid #EEE;
}

.field--name-field-components > .field__item,
.field--name-field-additional-text{
     margin-top: 6px;
}

.paragraph .field--name-field-description:before{
    content: "";
    display: block;
    overflow: hidden;
    width: 10em;
}
*/
/***********************/


/***** custom blocks ***/
body.lab-fun #block-views-block-photo-gallery-block-1,
body.lab-fun #block-walter-content{
     max-width: 500px; /* make sure that main content overlay doesn't cover image block */
}

#block-views-block-image-blocks-block-1{
    float: right;
    max-width: 600px;
}
/*************************/


/******* jQuery Accordion ***********/

.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default,
.ui-button,
html .ui-button.ui-state-disabled:hover,
html .ui-button.ui-state-disabled:active {
    border: 1px solid #699E87;
    background: #b1d1c2;
    color: #454545;
}



.ui-widget-content a{
    color: #900;
}

.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active,
a.ui-button:active, .ui-button:active,
.ui-button.ui-state-active:hover {
    border: 1px solid #447a62;
    background: #699E87;

}

/*************************/

.view-filters{
    background: #EEE;
    padding: 5px 20px;
}


.views-exposed-form input[type=text],
.views-exposed-form input[type=date],
.views-exposed-form select{
    display: inherit;
}

.view-header .btn,
.views-exposed-form input.button,
.views-form input.button{
    color: #900;
    border: 1px solid #900;
    border-radius: 4px;
}

.view-content {
	overflow-x: auto;
}

.view-content table{
   width: 100%;
}

.view-content table tr:nth-child(even) { /* adds "zebra stripes" to table rows */
  background-color: #f2f2f2
}

.view-content table tr th{
    background: #dedede;
    border: 1px solid white;
}
.region-content th,
.region-content td{
    padding: 3px 5px;
    border: 1px solid #ddd;    
}

.urgent {
    color: red;
}

.views-field-field-cumulative-field{
    color: green;
    font-weight: 800;
}

.views-exposed-form .form-item-field-box-number-value select{
	height: 90px;
}

/******* Cell Line Box *******/

body.page-node-type-cell-line-box .field--name-field-tank,
body.page-node-type-cell-line-box .field--name-field-tower,
body.page-node-type-cell-line-box .field--name-field-row{
  font-weight: bold;
  color: black;
}

body.page-node-type-cell-line-box .field--name-field-tank .field__label,
body.page-node-type-cell-line-box .field--name-field-tower .field__label,
body.page-node-type-cell-line-box .field--name-field-row .field__label{
  color: #777;
  font-weight: normal;
}

body.page-node-type-cell-line-box .field--name-field-tank{
  float: left;
  margin-right: 7px;
  width: 70px;
}
body.page-node-type-cell-line-box .field--name-field-tower{
  float: left;
  margin-right: 7px;
  width: 85px;
}

body.page-node-type-cell-line-box .field--name-field-box{
  margin-top: 20px;
}
body.page-node-type-cell-line-box .field--name-field-box table{
  width: 100%;
  font-size: 12px;
}
body.page-node-type-cell-line-box .field--name-field-box table td,
body.path-cell-lines table.tablefield td{
  width: 10%;
  border: 1px solid #BBB;
  color: black;
}
body.page-node-type-cell-line-box .field--name-field-box table td.row_0,
body.page-node-type-cell-line-box .field--name-field-box table td.col_0{
  width: 20px;
  padding:5px;
  color: #999;
}
body.page-node-type-cell-line-box .field--name-field-box table caption{
  display: none;
}

body.page-node-type-cell-line-box .field--name-field-box tr:nth-child(even) {
  background-color: #f2f2f2
}

/************************/

/*** Cell Line Details Node *****/
.field--name-field-cell-line-lab-id-serial .field__label{
	padding-right: 0;
}
.field--name-field-cell-line-lab-id-serial .field__label::after{
	content: ': DM';
	font-weight: normal;
}
/*******************************/

/*** Cell Line Box - fields (NOT BEING USED) ***/

.cell-line-box-row{
  display: inline-block;
  width: 100%;
}

.cell-line-box-row .field{
  width: 10%;
  float: left;
  word-break: break-all;
  padding: 8px;
  font-size: 12px;
  color: black;
  border-left: 1px solid #777;
  border-bottom: 1px solid #777;
  line-height: normal;
  min-height: 75px;
}

.cell-line-box-row.top-row{
  margin-top: 20px;
  border-top: 1px solid #777;
}

.cell-line-box-row div:nth-child(10){
  border-right: 1px solid #777;
  
}

.cell-line-box-row .field__label{
  color: #999;
  font-weight: normal;
}

h2.my-cell-line-box{
  margin-bottom: 0;
}



/******** OpenID Connect login button *********/

.region-footer-menu{
	display: flex;
}

.footer-menu .openid-connect-login-form{
	margin: 0;
	text-align: right;
}

.footer-menu input#edit-openid-connect-client-harvardkey-login{
	color: #888;
	font-weight: normal;
	font-size: 85%;
	border: none;
	background: none;
	padding: 16px 20px;
}

.footer-menu input#edit-openid-connect-client-harvardkey-login:hover{
	color: red;
	text-decoration: underline;
}
/********************************************/