/*** OVERALL STYLES ***/

/*stretch icon navigation*/
.grid {
  width: 100%;
}

.grid h2,
.grid h3 {
  color: #222;
  font-weight: normal;
}
.grid h2 {
  margin: 0 0 10px 0;
  font-size: 24px;
}
.grid h3 {
  margin: 24px 0 16px 0;
  font-size: 18px;
  line-height: 1.1;
}
.grid h5 {
  color: #222;
  margin-top: 0;
}

.grid ul {
  margin: 10px 0 0 15px;
}
.grid ul li {
  line-height: 20px;
}

/*advanced search links and button switches*/
.grid .advSearch {
  font-size: 14px;
}

/*primarily used to center search buttons*/
.grid .center {
  text-align: center;
}


/*** ABOVE SEARCH NAVIGATION BAR ***/

/*set selected state for main nav*/
#ubc7-unit-menu #search-nav > .btn-group > a,
#ubc7-unit-menu #search-nav > .btn-group,
#ubc7-unit-menu #search-nav > .btn-group .btn {
  background-color: transparent;
}
#ubc7-unit-menu #search-nav > .btn-group > a,
#ubc7-unit-menu #search-nav > .btn-group {
  background-color: #D7E0E7;
  box-shadow: 0 3px 8px rgba(0, 0, 0, 0.125) inset;
}
#ubc7-unit-menu #search-nav:hover > .btn-group > a,
#ubc7-unit-menu #search-nav:hover > .btn-group,
#ubc7-unit-menu #search-nav:hover > .btn-group .btn {
  background-color: #002145;
}

/*title h1 tag (contains title img)*/
#search-header {
  height: 60px;
  margin: 10px 0;
}
#search-header img {
  max-width: 100%;
}


/*** SEARCH NAVIGATION BAR ***/

/*full ul containing navigation elements (for larger screens)*/
#search-portal {
  width: 100%;
  height: 143px;
  margin: 0 0 40px -15px;
  padding: 0 30px 0 0;
  list-style: none;
  background: url("../images/diag-bg.gif") #93B5C6;
}
  
  /*each choice contained in li*/
  #search-portal li {
    float: left;
    cursor: pointer;
    width: 100px;
    height: 178px;
    background: url("../images/arrow.gif") bottom right transparent no-repeat;
    overflow: hidden;
  }
  #search-portal li:hover {
    background-color: #B7CED9;
  }
    
    /*a tag wraps span (icon) and p (desc)*/
    #search-portal a,
    #search-portal a:hover {
      color: #000;
      text-decoration: none;
    }
    
      /*icons*/
    	#search-portal li span {
        display: block;
        float: left;
        width: 98px;
        height: 143px;
        opacity: .90;
        filter: alpha(opacity=90);
        border-left: 1px solid #D9E4EC;
        border-right: 1px solid #777;
        background: url("../images/sprites.gif") transparent no-repeat;
      }
      #search-portal li span:hover {
        opacity: 1;
        filter: alpha(opacity=100);
      }
      
      /*position sprite*/
			#search-portal #general-tab span {
        background-position: 0 6px;
      }
			#search-portal #catalogue-tab span {
        background-position: -100px 6px;
      }
			#search-portal #journals-tab span {
        background-position: -200px 6px;
      }
			#search-portal #databases-tab span {
        background-position: -300px 6px;
      }
			#search-portal #guides-tab span {
        background-position: -800px 6px;
      }
			#search-portal #reserves-tab span {
        background-position: -400px 6px;
      }
			#search-portal #research-tab span {
        background-position: -500px 6px;
      }
			#search-portal #digital-tab span {
        background-position: -600px 6px;
      }
      
      /*desc*/
    	#search-portal li p {
        position: relative;
        width: 153px;
        height: 183px;
        margin: 5px 0 0 97px;
        padding: 5px 0 5px 10px;
        font-size: 12.5px;
        line-height: 145%;
      }
      
      /*current expanded tab icon*/
    	#search-portal li.openTab span {
        opacity: 1;
        filter: alpha(opacity=100);
      }
  
    /*current selected tab*/
	  #search-portal li.selectedTab {
      background-position: bottom left;
      background-color: #D9E4EC;
    }
    #search-portal li.selectedTab:hover {
      background-color: #D9E4EC;
    }

/*select containing navigation elements (for smaller screens)*/
#search-small {
  width: 100%;
  height: auto;
  font-size: 18px;
  background-color: #D9E4EC;
}


/*** BELOW SEARCH NAVIGATION BAR ***/

#forms-area {
  clear: both;
  min-height: 200px;
}
  
  #forms-area h2 {
    font-size: 24px;
  }
  #forms-area p.quiet {;
    line-height: 140%;
    color: #555;
  }
  
  #forms-area div.instruction h3 {
    margin: 7px 0;
  }
  #forms-area div.instruction p {
    clear: both;
    margin-top: 10px;
    font-size: 12px;
    line-height: 140%;
    color: #555;
  }
  
  #forms-area a {
    color: #2F5D7C;
    text-decoration: none;
  }
  #forms-area a:hover {
    color: #002145;
  }
  
  #forms-area .box .button {
    margin-bottom: 7px;
  }
	
	#forms-area > div {
    padding-bottom: 30px;
    background: #fff;
    display: none;
  }
		#forms-area div.openForm {
      display: block;
    }
  
  #forms-area h3 a .button {
    color: #333 !important;
  }
  #forms-area .button.advSearch {
    font-size: 12px;
    white-space: nowrap;
    padding: 6px 9px;
  }
  
  #forms-area .advanced-catalogues,
  #forms-area .advanced-circle,
  #forms-area .advanced-abacus,
  #forms-area #optional-citation,
  #forms-area #abrr-catalogue,
  #forms-area #abrr-catalogue-adv,
  #forms-area #abrr-catalogue-browse {
    display: none;
  }
  
  #forms-area fieldset {
    width: auto;
  }
  
  @media all and (-webkit-min-device-pixel-ratio:10000), not all and (-webkit-min-device-pixel-ratio:0) {
    /*for Opera*/
    #forms-area br.visible-phone {
      display: block !important;
    }
  }
  
  #forms-area h3 a > img {
    vertical-align: top;
  }
  
  #forms-area select:focus,
  #forms-area input[type=checkbox],
  #forms-area input[type=radio] {
    cursor: default;
  }
  #forms-area input,
  #forms-area textarea {
    height: auto;
    color: black;
  }

  #forms-area .yearbox {
    max-width: 60px;
  }
  
  #forms-area #form-databases .box {
    margin-top: 15px;
  }
  
  #forms-area #subject option {
    margin-bottom: 7px;
  }

/*** IE STYLES ***/

.ie8 .grid input {
  color: #333;
}

.ie7 #search-portal a {
  cursor: pointer;
}
.ie7 #search-portal li {
  position: relative;
  height: 178px;
  background-position: -70px 143px;
}
.ie7 #search-portal li.selectedTab {
  background-position: 0 143px;
}
.ie7 #search-portal li span {
  height: 143px;
}
.ie7 #search-portal li p {
  position: absolute;
  margin-left: 0;
}
.ie7 #forms-area {
  margin-top: 50px;
}
.ie7 #main-catalogue-adv .horizontal label {
  margin-right: 10px;
}


/*** RESEARCH GUIDES STYLES ***/

#browselabel, 
#pageselform label				{ font-weight:bold; float:left; padding:3px 10px 3px 0; } 

#browse										{ float:left; width:100%; }

#browse ul								{ list-style:none !important; float:left; display:inline; margin:0; }

#browse ul li							{ float:left; margin-right:10px; }

#browse ul li a						{ display:block; color:#444; padding:3px 8px;
                            -webkit-transition:background-color 0.2s linear;
                            transition:background-color 0.2s linear;
                            -webkit-border-radius:3px 3px;
                            -moz-border-radius:3px 3px;
                            border-radius:3px 3px; }

#browse ul li a:hover			{ background-color:#e8e8e8; text-decoration:none; }												

.activechoice 						{ background-color:#f6f6f6; border:1px solid #bbb;
														-webkit-box-shadow:0 0 2px 0px rgba(0,0,0,.25); inset 0 0 4px rgba(255,255,255,.4);
														-moz-box-shadow:0 0 2px 0px rgba(0,0,0,0.25); inset 0 0 4px rgba(255,255,255,.4);
														-o-box-shadow:0 0 2px 0px rgba(0,0,0,0.25); inset 0 0 4px rgba(255,255,255,.4);
														box-shadow:0 0 2px 0px rgba(0,0,0,0.25); inset 0 0 4px rgba(255,255,255,.4); }

#pageselform							{ float:right; }

#pagesel									{ padding:5px; margin-top:-4px; }

/* General Results Styling */
#results									{ clear:both; float:left; border-top:1px solid #eee; padding:18px 0; width:100%; min-height:600px; }

#a2zresults ul,
#subjectresults ul,						
#branchresults ul,
#nameresults ul,
#coderesults ul,
#instructorresults ul,
#searchresults ul					{ list-style:none !important; margin:0 !important; }

#a2zresults ul li,
#nameresults ul li,
#coderesults ul li,
#instructorresults ul li,
#searchresults ul li			{ text-indent:-10px; margin-bottom:3px; }

#a2zresults ul li a,
#subjectresults ul li a,						
#branchresults ul li a,
#nameresults ul li a,
#coderesults ul li a,
#instructorresults ul li a,
#searchresults ul li a		    { color:#000099; display:block; padding-left:20px; -webkit-transition:background-color 0.2s linear; transition:background-color 0.3s linear; }

#a2zresults ul li a:focus,
#subjectresults ul li a:focus,						
#branchresults ul li a:focus,
#nameresults ul li a:focus,
#coderesults ul li a:focus,
#instructorresults ul li a:focus,
#searchresults ul li a:focus  { text-decoration:none; }

#a2zresults ul li a:hover,
#subjectresults ul li a:hover,						
#branchresults ul li a:hover,
#nameresults ul li a:hover,
#coderesults ul li a:hover,
#instructorresults ul li a:hover,
#searchresults ul li a:hover	{ background-color:#ddf; text-decoration:none; }

/* All Guides A-Z */
#a2z											    { margin:0 auto; text-align:center; }

#a2zcourses a.current,
#a2zcourses span.current,
#a2z span.current					    { background-color:#009; border:1px solid #003; color:#fff; padding:2px 5px; text-align:center; }

#a2zcourses	.title,
#a2zresults	.title            { background-color:#eee; border:1px solid #ddd; color:#444; padding:2px 5px; text-align:center;
                                -webkit-transition:border, background-color 0.2s linear;
                                transition: border, background-color 0.2s linear;
                                -webkit-border-radius:1px 1px;
                                -moz-border-radius:1px 1px;
                                border-radius: 1px 1px; }

#a2zcourses	.title:hover,
#a2zresults	.title:hover      { background-color:#ddf; text-decoration:none; border:1px solid #999; }

#a2zresults ul					      { float:left; width:280px; margin-right:20px; }

#a2zresults ul.courseguides   { width:90%; }

.ie #a2zresults ul li,
.ie #coderesults ul li		    { float:left; width:260px; margin: 0px 15px 0 10px; }

.ie #a2zresults ul li a,
.ie #coderesults ul li a 	    {	white-space:nowrap; width:100%;	overflow:hidden; text-overflow:ellipsis; }

/* Browse Guides By Subject / Library Branch */
#subjectresults li a,	
#branchresults li a,
#subjectresults li ul li a,	
#branchresults li ul li a	                    { padding:3px 0 3px 50px; }

#subjectresults li ul,						
#branchresults li ul			                    { margin:0.2em 0 0.2em 0; }	

#subjectresults li[id]:nth-child(odd),						
#branchresults li:nth-child(odd)	            { background-color:#eee; }									

#subjectresults li[id] a:before								{ content:url('../images/expand.gif'); vertical-align:middle; margin-right:3px;  }						

#subjectresults li[id] a.expanded:before			{ content:url('../images/collapse.gif'); vertical-align:middle; margin-right:3px; }						

#subjectresults li[id] ul li a:before					{ content:""; }							

#subjectresults li[id] ul li a.selected,
#branchresults ul .branch.selected						{ font-weight:bold; text-decoration:none; background-color:#ddf; }

#branchresults ul li a.selected:after,
#subjectresults li[id] ul li a.selected:after	{ content:url('../images/arrow-right.gif'); vertical-align:top; float:right; }						
/* Misc and Overides */
#LTKbody #LibraryContent                      { background-color:#fff; padding:1.5em; }


table thead tr                                { border-bottom:1px #999 solid; }

table thead th, #UbcContent thead th          { background-color:#ffffff; color:#333333; }

table thead th.headerSortDown:after           { content:' ?'; }

table thead th.headerSortUp:after             { content:' ?'; }

table#printreserves                           { width:100%; }

.altrow                                       { background-color:#eeeeee; }

#courseresultstable td,
#coursesubjects td, #printreserves td         { padding:3px; }


/*** MEDIA QUERIES ***/

@media (max-width: 61.18em) { /* 979 / 16 */
  
  #forms-area .box {
    margin-top: 20px;
  }
  
  #forms-area .modifier label {
    font-size: 13px;
  }
  
  #forms-area .pagination a {
    display: inline-block;
    margin: 6px 3px;
    padding: 8px;
    line-height: 14px;
  }
  
  #form-databases .box .advSearch {
    float: none;
    display: block;
    margin-top: 8px;
    text-align: right;
  }
  
  #form-databases ul li {
    font-size: 16px;
    margin-bottom: 8px;
  }
  
  .advanced-circle .horizontal label {
    white-space: nowrap;
  }
  
  #form-digital .center {
    margin-top: 26px;
  }
  
}/*end 61.18em*/

@media (max-width: 47.95em) { /* 767 / 16 */
  
  #form-catalogue .horizontal,
  #main-catalogue-adv fieldset,
  #abrr-catalogue-adv fieldset,
  .advanced-circle fieldset {
    margin-bottom: 26px;
  }
  
  #main-catalogue-adv .horizontal,
  #abrr-catalogue-adv .horizontal {
    margin-bottom: 0;
  }
  
}/*end 47.95em*/

@media (max-width: 29.375em) { /* 470 / 16 */
  
  .grid .advSearch {
    margin: 12px 0;
  }
  
}/*end 29.375em*/

@media (max-width: 22.5em) { /* 360 / 16 */
  
  #main-catalogue-adv .horizontal label,
  #abrr-catalogue-adv .horizontal label,
  #main-catalogue-adv .modifier label,
  #abrr-catalogue-adv .modifier label,
  #form-digital .modifier label {
    margin-bottom: 6px;
  }
  
}/*end 29.375em*/