/*
  Running Squiz Matrix
  Developed by Squiz - http://www.squiz.net
  Squiz, Squiz Matrix, MySource, MySource Matrix and Squiz.net are registered Trademarks of Squiz Pty Ltd
  Page generated: 20 August 2013 11:03:16
*/


/* 
 *  responsive.css | StyleSheet for mobile devices
 *  @Autor: Gwidon Walinski (Squiz)
 *
 */
 @media screen and (max-width: 1024px) {

   /* Fluid grid system */
   .grid { width: 98%; margin-left: 1%; margin-right: 1%; }
   .one, .two, .three, .four, .five, .six, .seven, .eight, .nine, .ten, .eleven, .twelve, .designers-three, .designers-six ,.designers-nine, .designers-twelve { margin-left: 1%; margin-right: 1%; }
   .grid .one { width:6.333%; }
   .grid .two { width:14.667%; }
   .grid .three { width:23.0%; }
   .grid .four { width:31.333%; }
   .grid .five { width:39.667%; }
   .grid .six { width:48.0%; }
   .grid .seven { width:56.333%; }
   .grid .eight { width:64.667%; }
   .grid .nine { width:73.0%; }
   .grid .ten { width:81.333%; }
   .grid .eleven { width:89.667%; }
   .grid .twelve { width:98.0%; }
   .grid .designers-three { width:18.400%; }
   .grid .designers-six { width:57.200%; }
   .grid .designers-nine { width:77.600%; }
   .grid .designers-twelve { width:98.0%; }
   
   .header .logo { width:98%; }
   .header .header-links { width:98%; text-align:center; }
   .header .header-links a { display:inline-block; }
   .header .search { width:98%; }
   .header .logo { text-align:center; }
   .header .logo a { display:inline-block; float:none; }
   
   .menu { margin-top:20px; }
   
   .menu ul li a span.arrow { bottom: -6px; z-index:9001; }
   .menu > ul > li a { z-index:auto; }
   .menu ul li div.main-nav-level2-container { top:100%; }
   
   .cookie-policy { position:relative; }
   .cookie-policy .detail { margin-right:40px; }
   .cookie-policy a.close { bottom:3px; height:auto; margin:0; padding:0 1%; position:absolute; right:0; top:3px; }
    
    /* Specific for this design */
   .slider { margin-bottom:0; }
   .slider .nav { width:100%; }
   .slider .our-collections { padding-top:20px; bottom:auto; position:static; overflow:hidden; right:auto; width:100%; }
   .slider .our-collections .arrow { bottom:0px; }
   
   .important-notice { margin-top:5px; }
   
   .whats-on .calendar { display:none; }
   .whats-on .latest-events { float:none; height:auto; margin-top:0; width:auto; }
   
   .related-links { background:url('http://www.bodleian.ox.ac.uk/__data/assets/image/0006/119544/rhs-box-bottom-gradient-mobile.png?v=0.1.1') no-repeat 50% 100% #eff0f2; padding-bottom:5px; }
   
      /* Responsive for landing page */
  .images-inline .image {margin-left:6%;}
  .images-inline-three .image {margin-left:4%;}
  .grid .landing-page .designers-three { width:23.8%; }
  .grid .landing-page .designers-six { width:72.2% }
  .grid .designers-nine .designers-nine { width:98% }
  
  /* END Responsive for landing page */
   .az-catalogue .social-media span {vertical-align:top; margin-bottom:3px;}
   .share-for-mobile span {vertical-align:top; margin-bottom:3px;}

   /* grids widths adjusted to parent container */
   .grid .content .one, .grid .content .two, .grid .content .three, .grid .content .four, .grid .content .five, .grid .content .six, .grid .content .seven, .grid .content .eight, .grid .content .nine, .grid .content .ten, .grid .content .eleven { padding:1%; }
   /* parent width: 12 */;
   .grid .designers-twelve .content .one { width:6.333%; }
   .grid .designers-twelve .content .two { width:14.666%; }
   .grid .designers-twelve .content .three { width:23.0%; }
   .grid .designers-twelve .content .four { width:31.333%; }
   .grid .designers-twelve .content .five { width:39.666%; }
   .grid .designers-twelve .content .six { width:48.0%; }
   .grid .designers-twelve .content .seven { width:56.333%; }
   .grid .designers-twelve .content .eight { width:64.666%; }
   .grid .designers-twelve .content .nine { width:73.0%; }
   .grid .designers-twelve .content .ten { width:81.333%; }
   .grid .designers-twelve .content .eleven { width:89.666%; }
   .grid .designers-twelve .content .twelve { width:100.0%; padding:0px; }

   /* parent width: 9 */;
   .grid .designers-nine .content .one { width:9.111%; }
   .grid .designers-nine .content .two { width:20.222%; }
   .grid .designers-nine .content .three { width:31.333%; }
   .grid .designers-nine .content .four { width:42.444%; }
   .grid .designers-nine .content .five { width:53.555%; }
   .grid .designers-nine .content .six { width:64.666%; }
   .grid .designers-nine .content .seven { width:75.777%; }
   .grid .designers-nine .content .eight { width:86.888%; }
   .grid .designers-nine .content .nine { width:100.0%; padding:0; }
   .grid .designers-nine .content .ten { width:100.0%; padding:0; }
   .grid .designers-nine .content .eleven { width:100.0%; padding:0; }
   .grid .designers-nine .content .twelve { width:100.0%; padding:0; }

   /* parent width: 6 */;
   .grid .designers-six .content .one { width:14.666%; }
   .grid .designers-six .content .two { width:33.333%; }
   .grid .designers-six .content .three { width:48.0%; }
   .grid .designers-six .content .four { width:66.666%; }
   .grid .designers-six .content .five { width:81.333%; }
   .grid .designers-six .content .six { width:100.0%; padding:0; }
   .grid .designers-six .content .seven { width:100.0%; padding:0; }
   .grid .designers-six .content .eight { width:100.0%; padding:0; }
   .grid .designers-six .content .nine { width:100.0%; padding:0; }
   .grid .designers-six .content .ten { width:100.0%; padding:0; }
   .grid .designers-six .content .eleven { width:100.0%; padding:0; }
   .grid .designers-six .content .twelve { width:100.0%; padding:0; }

 }

 /* 7. STYLES FOR MOBILE */
 @media screen and (max-width: 768px) {

   /* Fluid grid system */
   .grid .one,
   .grid .two,
   .grid .three,
   .grid .four,
   .grid .five,
   .grid .six,
   .grid .seven,
   .grid .eight,
   .grid .nine,
   .grid .ten,
   .grid .eleven,
   .grid .twelve,
   .grid .designers-three,
   .grid .designers-six,
   .grid .designers-nine { width:98%; }
   .grid .designers-twelve { width:98%; }

   /* Styles especially for manualy added grid layout divs */
   .grid .designers-twelve .content .one, .grid .designers-twelve .content .two, .grid .designers-twelve .content .three, .grid .designers-twelve .content .four, .grid .designers-twelve .content .five, .grid .designers-twelve .content .six, .grid .designers-twelve .content .seven, .grid .designers-twelve .content .eight, .grid .designers-twelve .content .nine, .grid .designers-twelve .content .ten, .grid .designers-twelve .content .eleven, .grid .designers-twelve .content .twelve { width:98%; padding:5px; }
   .grid .designers-nine .content .one, .grid .designers-nine .content .two, .grid .designers-nine .content .three, .grid .designers-nine .content .four, .grid .designers-nine .content .five, .grid .designers-nine .content .six, .grid .designers-nine .content .seven, .grid .designers-nine .content .eight, .grid .designers-nine .content .nine, .grid .designers-nine .content .ten, .grid .designers-nine .content .eleven, .grid .designers-nine .content .twelve { width:98%; padding:5px; }
   .grid .designers-six .content .one, .grid .designers-six .content .two, .grid .designers-six .content .three, .grid .designers-six .content .four, .grid .designers-six .content .five, .grid .designers-six .content .six, .grid .designers-six .content .seven, .grid .designers-six .content .eight, .grid .designers-six .content .nine, .grid .designers-six .content .ten, .grid .designers-six .content .eleven, .grid .designers-six .content .twelve { width:98%; padding:5px; }
   /* **************************************************** */
   
   /* Shared */
   .visible-on-mobile { display:block; }
   .hidden-on-mobile { display:none; }
   
   .cookie-policy .detail.for-desktop { display:none; }
   .cookie-policy .detail.for-mobile { display:block; }
   
   .header .logo { text-align:center; }
   .header .logo a { display:inline-block; float:none; }
   .header .header-links { text-align:center; }
   .header .header-links a { display:inline-block; }
   .header-links .visible-on-mobile  { display:inline-block; }
   
   .submenu { display:none; }
   .submenu-for-mobile { display:block; }
   
   .footer-links .map { width:100%; }
   .footer-links .map img { margin:0 auto; max-width:400px; width:100%; }
   .footer-links .address { float:right; margin-top:40px; width:100px; }
   .footer-links .address div { display:none; }
   .footer-links .further-reading { display:none; }
   .footer-links .within-bodleian { width:auto; }
   .footer-links .info ul { display:none }
   .footer-links .map { padding:0 0 10px; width:98%; }
   
   
   body.floating-footer { padding-bottom:0; }
   body.floating-footer .footer-contact-us { bottom:auto; left:auto; position:static; }
   
   /* Responsive for search results page */
   .filter-nav form fieldset { float:left; width:50%; }
   .search-legend ul li { float:left; }
   .search-results .search-content { max-width:100%; width:100%; }
   /* END Responsive for search results page */
   
   /* Responsive for landing page */
   .landing-page .promo div { width:100%; }
   .landing-page .promo div h2 { padding:5px 10px 1px; }
   .landing-page .promo div p { padding:0 10px 8px; }
   
   .grid .landing-page .designers-three,.grid .landing-page .designers-six { width:98%; }
   
   /* END Responsive for landing page */
   
   /* Specific for this design */
   .latest-news ul li .thumbnail { display:none; }
   .latest-news ul li div { margin-left:0; }
   .latest-news ul li { padding-bottom:30px; }
   
   .whats-on .share-tools { float:none; margin-top:0; padding-bottom:20px; text-align:center; }
   
   .back-to-top { background:none transparent; }
   
   .slider .slides li .description { display:none; }
   .slider .nav li a { padding:5px 10px; }
  
   .grid-image > a { float:left; width:50%; }
   .grid-image > a img { width:100%; }
   .grid-image div { float:left; width:50%; }
  
   .promo-box { margin-bottom:20px; }
   .promo-box a { bottom:0; width:auto; }
   .promo-box img { width:100%; }
   
   .az-catalogue .social-media span {vertical-align:top; margin-bottom:3px;}
   .share-for-mobile span {vertical-align:top; margin-bottom:3px;}
 }
 
@media screen and (max-width:480px) {
    
    /* Shared */
    .menu .show-menu { display:block; }
    .menu ul { display:none; }
    .menu ul li { float:none; }
    
    .menu .menu-button { display:block; }
    .menu .menu-visible { display:block; }
    .menu-homepage .menu-button{ display:none; }
    .menu-homepage ul { display:block; }
    .menu-homepage ul li:hover .main-nav-level2-container { display:none; }
    .menu-homepage ul li:hover a span.arrow { display:none; }
    
    .menu > ul > li { position:relative; }
    .menu ul li .nav-column { width:50%; }
    .menu ul li div.main-nav-level2-container { top:39px; }
    
    .footer-contact-us p { float:none; text-align:right; }
    
    .image img { width:100%; }
    .image.right { float:none; margin:0 auto 20px auto; width:50%; }
    .image.left { float:none; margin:0 auto 20px auto; width:50%; }
    
    /* Specific for this design */
    .grid-image > a { float:none; width:100%; }
    .grid-image > a img { width:100%; }
    .grid-image div { float:none; width:100%; }
    
    .whats-on .latest-events ul li { width:100%; }
    .slider .slider-controls { float:left; position:relative; width:100%; z-index:2000; }
    .slider .nav li { display:none; }
    .slider .nav li a { border:0; }
    .slider .nav li.flex-active { display:block; width:85%; }
    .slider .flex-direction-nav { display:block; }
    
    /* Responsive for search results page */
    .filter-nav form fieldset { float:none; width:100%; }
    /* END Responsive for search results page */
    .results li a.url { word-break:break-all; }
    .landing-page .images-inline .image {width:47%;float:left;}

    .menu ul li:hover .main-nav-level2-container,.menu ul li:hover a span.arrow { display:none;}
    
    /* JS 2013-01-29 */
    .header .mobile_header_logo_img_wrap {width:26%;}
    .header .mobile_header_logo_text_wrap {width:70%;}
    .header .logo img {width:95% !important; height:auto !important; padding-right:5%;}
    .header .logo span.page-title { font-size:1.7em; line-height:1.2em; margin-top:10%;}
    .header .logo span.division { font-size:1.0em;}
    .header .logo span.university { font-size:0.9em;}

    .footer-links .address { float:left; margin-top:20px; width:100px; }

    .share-tools span {vertical-align:top; margin-bottom:3px;}
    .share-for-mobile span {vertical-align:top; margin-bottom:3px;}

   .az-catalogue .social-media span {vertical-align:top; margin-bottom:3px;}
}