/* We're only using one mobile breakpoint for this site, the below breakpoints can be amended to what you feel is best
====================================================================================================== */

@media only screen and (min-width : 300px) and (max-width : 650px) {
    
    /* SOME 960.CSS Overrides for mobile, this may or may not be of use for this project.
    
    /* 960 OVERRIDES ===================================================================================== */
    body, body.parkside, body.beacon-centre, body.art-for-life { min-width:100%; max-width:640px; background:none; }
	
	.container_12 { width:96% !important; max-width:940px !important; padding:0 2% !important; position:relative; }
    
    .contentBlock_1, .contentBlock_2, .contentBlock_3, .contentBlock_4, .contentBlock_5, .contentBlock_6, 
    .contentBlock_7, .contentBlock_8, .contentBlock_9, .contentBlock_10, .contentBlock_11, .contentBlock_12 {
      width:100% !important; float:none !important;
    }
    
    .grid_1, .grid_2, .grid_3, .grid_4, .grid_4Half, .grid_5, .grid_6, .grid_7, .grid_8, .grid_9, .grid_10, .grid_11, .grid_12 {
       width:100% !important; margin-bottom:2%; margin-left:0px; margin-right:0px; display:block; float:none !important;
    }
    
    .push_1, .push_2, .push_3, .push_4, .push_5, .push_6, .push_7, .push_8, .push_9, .push_10, .push_11, .push_12 {
       left:0px !important;
    }
    
    .alpha, .omega { margin-left:0; margin-right:0; }

    a.link-blue {margin-top:0;}
    .bodyHeading div {margin:0;}
    h1, div.mainHeading {font-size:1.8em; font-weight:700;} 
    h2 {font-size:1.5em;}
    h3 {font-size:1.2em;}
    /* =================================================================================================== */
	/*  HEADER  */	
	
	.searchBlockMobile { display:block; height:40px; background:#e5e5e5; padding:6px; }
	.searchBlockMobile .grid_12 { margin-bottom:0; }
    .searchBlockMobile .searchMob { float: right; width: 50%; overflow: hidden; position: relative; }
    .front-end .searchBlockMobile .searchFieldMobile { width:60%; height:22px; float: right; }

    .searchBlockMobile .translateLink { float: left; position: relative; width: 50%; }
    .searchBlockMobile .translateLink a { padding: 11px; display: block; background: #16a0ce; color:white; border-radius: 5px; cursor: pointer; text-align: center; }
    .searchBlockMobile .translateLink a.opentoggle { background: #b5b5b5; }
    /*.searchBlockMobile .translateLink a:checked ~ .google-translate { top: 0; }
    .searchBlockMobile .translateLink a:checked ~ .searchBlockMobile { margin-top: 250px; }*/

    .accessibility .google-translate { display:none; }

    header .siteLogo { margin-bottom: 20px; }                   
    	
	#pull {height:40px; line-height:40px; display:block; background:#16a0ce; font-weight:700; font-family:'Ubuntu'; font-size:1.2rem; }
	#pull:after { content: url(../images/mobile-white-menu-arrow.png); position:absolute; right:17px; display:inline-block; letter-spacing:-5px;
		-webkit-transition: all 0.5s ease-in-out;
		-moz-transition: all 0.5s ease-in-out;
		-ms-transition: all 0.5s ease-in-out;
		-o-transition: all 0.5s ease-in-out;
		transition: all 0.5s ease-in-out;
	}
	#pull.menu-down:after { 
		-moz-transform: rotate(-180deg);
		-webkit-transform: rotate(-180deg);
		-o-transform: rotate(-180deg);
		-ms-transform: rotate(-180deg);
		transform: rotate(-180deg); 
	}
	
	.main-nav { background:#16A0CE; }
	nav.main-nav a { width:96%; padding:0 2% !important; background:#16a0ce; }
    nav.main-nav li .sub { display:none !important; }
	.main-nav-bg, .parkside .main-nav-bg { background:#fff; }
	.main-nav ul { width:100%; padding:0; background: #E5E5E5; position:absolute; z-index:200; top:40px; display:none; }
 	nav.main-nav ul a { margin:0; background: none; color:#16A0CE; width:100%; padding:0 !important; font-weight:700; }
	nav.main-nav ul a.selected { background:none !important; }
	nav.main-nav li { float: left; width:96%; }
    nav.main-nav li a {padding:0 2% !important;border-bottom: 1px #16A0CE solid; }
	nav.main-nav li:hover a { background:none !important; }

    .front-end .searchBlockMobile #search_button { bottom:10px; right:5%; top:auto; }

	header > div > div > div.grid_3 { margin:0; }
	
    /* SUBNAV */
    #show-side {display: block; border-top:16px double; border-bottom:5px solid; text-indent:-9999px; height:6px; width:30px;}
    .subnav > ul {width:215px; position:absolute; top:50px; left:-255px; background:#16A0CE; color:#fff; z-index:5; }
    .subnav > ul.hidden { display:none; }
    .subnav h4 {display:none}
    .grey-bg {background:none; padding-bottom:20px; border-bottom:1px solid #e5e5e5; margin-bottom:20px;}

    .subnav ul li a {color:#fff; background:none; padding:0;}
    .subnav ul li.selected li a {color:#fff;}
	/*------------------------------------------------------------------------------------------------------------------*/
	/* SLIDER */

    .homeSlider { width:307px; margin:0 auto; padding:2% 0;}
	.homeSlider .slides li img { width:100%; float:right; }
	.homeSlider .slides li .slider-box { width:62%; }
    .homeSlider .slides li .slider-box h2 { font-size: 1.8em; line-height: 1.4rem; }
    .homeSlider .slides li .slider-box { margin-top:10px; }
    .homeSlider .slides li .slider-box a { font-size:1em; }
    .homeSlider ol.flex-control-nav { right:initial; top:11.9em; }
    .homeSlider .slides li .slider-box p + a { font-size:0.9em;padding:6px 16px;display: block;width: 92px;}
    .homeSlider .slides li {min-height:150px;}
    .homeSlider ol.flex-control-nav {top:135px; left:0;}

    .contentSlider {display:none;}
    .flexslider .slides li .slider-image { top:10px; right:10px; width:40%;}
    /* FEATURE BOXES ==============================================================================================*/

    .grey-content-bg .feature-box, .feature-box {min-height:initial !important;}
    .feature-box h3 {margin-top:0;}
    .grey-content-bg {padding:7px 0 !important; margin:0 0 20px 0;}

    .feature-box h3, .feature-box p, .feature-box ul {padding:10px;}

    .colour-box { float:left; width:48%; margin:2% 0; }
    .colour-box a {font-size:1em; background:none;}
    .colour-box.patient {margin-right:4%;}
    .contentBlock_3.colourboxesCentre { }
    /* ------------------------------------------------------------------------------------------------------------ */
    /* QUICK LINKS */

    .mobile-quick-links { display:block; width:310px; margin:0 auto; }
    .mobile-quick-links ul { margin:10px 0; float:left; }
    .mobile-quick-links ul li { width:44px; float:left; margin-left:13px; list-style:none; }
    .mobile-quick-links ul li:first-child { width:90px; margin-left:0; }
    .mobile-quick-links ul li:nth-child(3n+3) { width:90px; }
    .mobile-quick-links ul li img { max-width:44px; display:block; margin:0 auto; }
    .mobile-quick-links ul li span { text-align:center; margin-top:5px; color:#666666; font-family:'Ubuntu'; display:block; font-size:0.88em; }
    .mobile-quick-links ul li:first-child { background:url(../images/phone-number-bg.png)  7% 17% #ededed no-repeat; display:block; width:90px; height:44px; position:relative; }
    .mobile-quick-links ul li:first-child span {padding:44px 0 0 0;}
    .mobile-quick-links ul li span.phone-number { position:absolute; bottom:2px; left:4px; font-family:'Ubuntu'; font-weight:700; color:#16A0CE; font-size:0.9em; }
    /*=================*/
    /* BREADCRUMB ================================================================================================*/

    nav.breadcrumbs {display:none;}

    /*=============================================================================================================*/

    /* HOME CONTENT */


    /* ------------------------------------------------------------------------------------------------------------ */
	/* HOT TOPICS TEXT */
    .hot-topics {background:#E5E5E5; padding:10px; margin-bottom:20px; margin-right:0;}
    .hot-topics-text {margin-left:0;}

    /*=============================================================================================================*/
    /* NEWS FEED */

    .news-feed { border-top:1px solid #e5e5e5; margin-top:20px; padding-top:20px; }
    .container_12 > .contentBlock_3 > .news-feed {display:none;}
    .news-list li {width:100%;margin: 0 0 20px 0;padding: 0 0 20px 0;border-bottom: 1px solid #E5E5E5;}
    .news-list li:last-child {border-bottom:none;margin-bottom:0; padding-bottom:0;}
    /*------------------------------------------------------------------------------------------------------*/
    /* SOCIAL API */

    .api { border-top:1px solid #E5E5E5; margin-top:20px; padding-top:20px; margin-bottom:20px; }
    .api nav {top:20px;}
    /*========================================================================================================*/    
    /* FOOTER */
    footer {padding: 10px 0 0 0;}
    footer .contentBlock_12 { height:80px; }
    footer .mentor-link { bottom:3px; right:5px; }
	.top-image { display:none; }
	.Home footer { border:none;padding:10px 0; }
    .footer-address { float:left; font-size:1.2em; width:66%; }
    footer nav { display:none; }
    .footer-phone a { color:#fff; }
	/* --------------------------------------------------------------------------------------------------------- */
    /* STUFF NOT DISPLAYED */
    .searchBlock, .slider-bg .light-blue h3, .top-header .container_12 .grid_6 .accessibility .sf-menu, .top-header .container_12 .grid_6 .top-bar-nav, .slider-bg .light-blue, .homeSlider .slides li .slider-box p, .feature-box img, .hot-topics img { display:none; }
    .showImg {display:block !important; width: 100% !important; }
    /* ATOZ TABLES ===============================================================================================*/

    table.doc-table {float:left;}
    .atoz a:first-child {margin-left:2px;}
    .atoz a {margin-bottom:5px;}

    /* TABLES */

    table {width:100% !important;}

    table.indent tr {margin-left:0;}

    /*============================================================================================================*/
    /* REMOVE RIGHT COLUMN */
    .Home .container_12 > .contentBlock_3 > div {display:block;}
    .container_12 > .contentBlock_3 > div, 
    .Home.parkside .container_12 > .contentBlock_3 > div,
    .Home.beacon-centre .container_12 > .contentBlock_3 > div {display:none;}
    .container_12 > .contentBlock_3 > div:first-of-type,
    .Home.beacon-centre .container_12 > .contentBlock_3 > div 
    .Home.parkside .container_12 > .contentBlock_3 > div:first-of-type {display:block;}

    /*LOGOS ======================================================================================================== */
    .microSiteLogo, .parkside .siteLogo, 
    .art-for-life .siteLogo  {width:122px !important;}
    .microSiteLogo {float:left;}
    .parkside .siteLogo, 
    .art-for-life .siteLogo, 
    .beacon-centre .siteLogo {margin: 20px 0 0 20%; height:44px;}
    .art-for-life .microSiteLogo {width:38px !important; margin: 4%; height: 60px!important;float: left; background:url("../images/art-for-life-logo-mobile.png") no-repeat !important;background-size: 100% !important; }
    /*==============================================================================================================*/
    /*NEWS LANDING*/
    .newsCategories {position:initial; width:100%}
    #newsCat, #itemsPerPage {float:left; margin-bottom:20px; padding:6px;width:98%;}    
    #itemsPerPage {margin-top:20px;}
    .news-list img {display:none;}
    .news-list .summary, .news-list .summary:first-child {width:100%; margin:0;}
    .news-list {border-bottom:1px solid #e5e5e5; padding-bottom:20px; margin-bottom:20px; }
    .news-list .summary + a {margin-top:10px;}
    .next-prev .prev {left:0;}
    /*=============================================================================================================*/
    /* EVENTS */
    .events-calendar li .summary {width:80%; margin:0;}
    .events-calendar li {border-bottom:1px solid #e5e5e5;}
    .events-calendar li:last-child {border:none;}
    .events-calendar li a.link-blue {margin-left:60px; margin-top:20px;}
    /* EVENT PAGE */
    .eventHeading .text-date {display:block; margin-bottom:10px;}
    .eventHeading .date {float:left; margin-right:20px;}
    .eventHeading h1 {}

    .row span { float:none; margin:0; }
    .row span.heading {margin:5px 0;}
    /*===========================================================================================================*/
    /* FORMS */
    .contour {margin-left:0;margin-right:0;}
    .contourField label {font-size:smaller;}
    /*===========================================================================================================*/
    /* COLOURS */
    /* ART-FOR-LIFE */
    .art-for-life #pull  {background:#8EAF69;}
    .art-for-life nav.main-nav ul a {color:#8EAF69; border-bottom: 1px #8EAF69 solid;}
    .art-for-life #show-side {color:#8EAF69 !important;}
    .art-for-life .subnav > ul {background:#B2DADE;}
    /*-------------------------------------------------------------------------------------------------------------*/
    /* PARKSIDE */
    .parkside #pull  {background:#1B4495;}
    .parkside nav.main-nav ul a {color:#1B4495; border-bottom: 1px #1B4495 solid;}
    .parkside #show-side {color:#1B4495 !important;}
    .parkside .subnav > ul {background:#40AE49;}
     /*-------------------------------------------------------------------------------------------------------------*/
     /* BEACON */
    .beacon-centre #pull  {background:#00A9A5;}
    .beacon-centre nav.main-nav ul a {color:#00A9A5; border-bottom: 1px #00A9A5 solid;}
    .beacon-centre #show-side {color:#00A9A5 !important;}
    .beacon-centre .subnav > ul {background:#66CCC5;}
    /*==============================================================================================================*/
    /* MOBILE IMAGES */
    .pageWysiwygBlock img, .blockImage img {width:100% !important; height:auto !important; margin:0 0 20px 0 !important; } 
     
    /*==============================================================================================================*/
    /* SEARCH PAGE */
    #mobileSelectSearch { width:100%; margin:0; padding:5px; border:1px solid #ececec; font-size:1.4em; display:block;
            background: #ffffff; /* Old browsers */
            /* IE9 SVG, needs conditional override of 'filter' to 'none' */
            background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNlNWU1ZTUiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
            background: -moz-linear-gradient(top,  #ffffff 0%, #e5e5e5 100%); /* FF3.6+ */
            background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#e5e5e5)); /* Chrome,Safari4+ */
            background: -webkit-linear-gradient(top,  #ffffff 0%,#e5e5e5 100%); /* Chrome10+,Safari5.1+ */
            background: -o-linear-gradient(top,  #ffffff 0%,#e5e5e5 100%); /* Opera 11.10+ */
            background: -ms-linear-gradient(top,  #ffffff 0%,#e5e5e5 100%); /* IE10+ */
            background: linear-gradient(to bottom,  #ffffff 0%,#e5e5e5 100%); /* W3C */
            filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e5e5e5',GradientType=0 ); /* IE6-8 */
            -webkit-border-radius: 5px;
            -moz-border-radius: 5px;
            border-radius: 5px;
    }
    .sideSearch, .searchFilters {display:none;}
    .ng-scope .contentBlock_9 {float:left !important;} 
    /*===============================================================================================================*/
    /* VIDEO BLOCKS */

    .mVideoPopOutPlayer img {width:100%;}
    .mVideoPopOutPlayer span { top:45%; left:40%;}
    /*=================================================================================================================*/
    /* RELATED LINKS */

    .relatedLinksBlock a.link-blue {margin-top:16px;}

    /*=================================================================================================================*/

    /* GALLERY */
    .exhibitionItemDetailsBlock div img {width:100%; height:auto;}
    .exhibitionItemDetailsBlock div h4 span {font-size:1em;}
    .exhibitionItemDetailsBlock div h4 {margin-bottom:20px;}
    /*================================================================================================================*/
    /* FORUM */
    .forumButtons {margin:0 !important;float:none !important;width:initial !important;}
    input.forumButton[type='button'] {padding:8px !important; margin: 0 5px 0 0 !important;}
    .forumTable th {display:none;}
    .forumTable td {display:block;}
    .forumPost p {width:100% !important; word-wrap:break-word;}
    .forumTable table, .forumTable tbody, .forumTable tr {display:block;}

    /*===========================================================================================================*/
}

/* EDITOR PROPERTIES - PLEASE DON'T DELETE THIS LINE TO AVOID DUPLICATE PROPERTIES */
