/*
CSS for Responsive Design
02/04/2015 - KSH / NO
12/04/2017 - KSH Homepage customisations and full width styles moved to main screen.css
23/01/2018 - KSH MyAccount link and image in secondary nav

===================================================== */

/* 1024 Width
===================================================== */

@media screen and (max-width: 1024px) {

ul.list-item-row-3, ol.list-item-row-3 { display:inherit; }

}/* ENDS 1024 ======================================== */

@media screen and (max-width: 990px) {

	div#navigation_sec { font-size:0.95em; }
	div#navigation_sec li {	
		background: url("/media/derbycitycouncil/styleassets/images/site/navigation_li_bg.png") no-repeat left 20px !important;
	}
	ul#navigation_sec_sub1 { 
		width:70%;
	}
	ul#navigation_sec_sub1 li, ul#navigation_sec_sub2 li { font-size:0.88em; } 
        
	div#navigation_sec ul#navigation_sec_sub1 li a	{ 
		padding:20px 8px 18px 30px !important; 
		height:auto !important;
		background-position: 12px 22px !important;		
	}	
	div#navigation_sec ul#navigation_sec_sub1 li a:first-child	{ padding-left:10px; }
	div#navigation_sec ul#navigation_sec_sub2 li a	{ 
		height:auto !important;
		padding:10px !important; 
	}

	
} /* ENDS 990 ======================================== */


/* 924 Width
===================================================== */

@media screen and (max-width: 924px) {

	body.l1landing div#content_pri .col3 { width:27%; }
	body .header h1 { font-size:2.4em; }
	body.whid_home div#content_pri div.col2_row h3 a { font-size:80%; }	

	
}/* ENDS 924 ======================================== */


/* 880 Width
===================================================== */

@media screen and (max-width: 880px) {

		div#rate_page { width:36%; }
		div.landing-links { width: 29.5%; }

}/* ENDS 880 ======================================== */


/* 800 Width
===================================================== */

@media screen and (max-width: 800px) {

	div#counciladvertising-leaderboard { display: none; }
		
	div#navigation_sec ul#navigation_sec_sub1 li#ns-myaccount a,
	div#navigation_sec ul#navigation_sec_sub1 li#ns-apply-for-it a,
	div#navigation_sec ul#navigation_sec_sub1 li#ns-book-it a, 
	div#navigation_sec ul#navigation_sec_sub1 li#ns-pay-it a, 
	div#navigation_sec ul#navigation_sec_sub1 li#ns-report-it a 
		{ background-image: none; padding: 18px 10px 20px 10px!important; }
	
	ul#navigation_sec_sub1 { width:66%; }        
        
	div.slideshow div.slides div.info h3 { font-size: 1.2em; }
	#network ul { display:inline-block; }
	body.whid_home div#content_pri h1 { font-size:2em; }
   	form#site_search input[type="text"] { width:178px !important; }
	
	div#network ul li { border-right:none; width:100%;border-bottom:1px #ccc dotted; border-left: 4px solid ;}
	div#network ul li:first-child { border-left: 4px solid ;}
	
	#network ul li a { float:left; }
	#network ul li div { float:left; }
	#network ul { display: none; }
	
	nav { border-bottom: 0; }
	nav ul { display: none;	height: auto; }
	nav a#pull { display: block; background-color: #283744; position: relative;	}
	div#network a:focus { color:#fff; }
	div#network a:hover { color:#fff; }
	div#network a#pull:hover { color:#fff; }

}/* ENDS 800 ======================================== */


/* 768 Width
===================================================== */

@media screen and (max-width: 768px) {

	div#counciladvertising-leaderboard { display: none; }
	div#content_wrapper { padding-top:15px;}
	ol#breadcrumbs { margin-bottom:10px;}

	div#owl-demo { text-align:center; margin:0 auto;}

	div.header { margin-bottom:20px; }
	body .header h1 { font-size:2.4em; }
	
	div#content_pri { width:100% !important; }
	div#content_sec { width:100% !important; }

	body.layout2 div#content_sec { display:none; }
	body.layout2 div#content_pri .col3 { width:100%;	}
	body.layout2 #content_pri  { width:100% !important;	}
	body.whid_home div#content_pri { width:100%; }
	body.listing_detail div#content_sec .boxout ul { display:block;	}
	body.layout4 div#user_message h1 { font-size:2.4em;	}

	div#footer_pri div#contact_details { width:95% !important; }

	/*dl#social_networks { width:210px !important; }*/	
	.YLYC_banner_title p { margin:5px 8px 0 8px; }	
	
	div#navigation_sec { display:none; }	

	div.slideshow div.slides div.info h3 { font-size: 1.1em; }
	div.slideshow div.slides div.info { padding:6px; }

	body.home #content_sec, body.home div.controls, body.l1landing #content_sec { display: none; }

	li.show-responsive-menu-item { display:block !important; }
	li.hide-responsive-menu-item { display:none !important; }

	div#contact_in_writing { padding-right:0; }
	div#rate_page { width:38%; }

	#footer_sec dl dt {
		font-size: 120%;
		font-weight:normal;
		padding-bottom:8px;
	}
	
	div#footer_sec ul li {	
		padding-bottom:12px;
		font-size:112%;
	}
    div#footer_sec ul li:first-child {
		border-left: none;
        padding-left:0;
	}

	ul.a_z_listing li.cur {
		padding-bottom: 0px;
		background: none;
	}
	
	dl#az_services a { font-size:1.8em; height:48px; width:42px; font-weight:bold; line-height:1.4em; }
	dl#az_services dd { line-height:3.2em; padding-bottom:5px;}
	dl#az_services dt { font-size:1.25em; }
	
	.popular-section {
		width: 100%;
		margin-bottom: 12px;
		min-height: 40px;
		padding-top: 15px;
	}
	.popular-button {
		min-height: 40px;
		padding-top:0px;
	}

}/* ENDS 768 ======================================== */


/* 680 Width
===================================================== */

@media screen and (max-width: 680px) {

	div#footer_sec ul li {	
		width:90%;
		border:none !important;
	}
    div#footer_sec ul li {
		border-left: none;
        padding-left:0;
	}
	div#footer_sec ul#social_networks li { width: 30px;}

}/* ENDS 680 ======================================== */


/* 640 Width
===================================================== */

@media screen and (max-width: 640px) {


	ol#breadcrumbs li.first, ol#breadcrumbs li:last-child { display:none }
	/* ol#breadcrumbs li:nth-last-child(2) { display:none } */
	
	.four04 #user_message { margin-top:10px; }
	.four04 #user_message h1 { font-size:1.8em; }
	.YLYC_l2_row_box  { 
		width:44%
	}

	div#header #branding img { max-width:80%;height:auto; }
	div#header #branding {
		height: auto !important;
	}
	div#header #branding {
		padding: 16px 0 0 0 !important;
	}

	form#site_search input[type="text"] { width:160px !important; }
	form#site_search label { display:none !important; }

	div#contact_by_telephone { width:95%; }	
    
	div.landing-links { width: 44.5%; }

}/* ENDS 640 ======================================== */


/* 480 Width
===================================================== */

@media screen and (max-width: 480px) {
	
     #footer-links li { width:100%; display:block; }
     div#footer_sec ul li:first-child { border-left: none; padding: 0 8px 12px 8px; }
	.four04 input[type="text"] { max-width:135px; }
    .four04 form label { display:none; }

	.owl-carousel h2 { font:normal 1.2em 'Open Sans', verdana, helvetica, arial, "sans serif" !important; }

	div#owl-demo { display:block !important;}

	.YLYC_l2_row_box  { max-width:98% }
	
	body .header h1 { font-size:2.0em; }

	#slideshow_1, ul.news_items div.thumb { display:none; }
  
	div#header #branding img { display:inline; max-width:38%; height:auto; }
	div#rate_page { width:95%; }

	div#header form { text-align:center; }
	
	div#header form, div#header #branding {
		width:100% !important; 
		display:block !important; 
		margin:0 auto !important; 
		position:relative !important;	
	
	}
	div#header #branding  { 
		text-align:center !important; 
		padding: 8px 0 0 0 !important;
	}
	form#site_search input[type="text"] {
		width:160px!important;
	}
	form#site_search { top:auto !important; }
	form#site_search fieldset { display:inline-block; text-align:center;margin:0 auto;}

	div#content_pri .col2 {
	width:100% !important;
	}

	div#content_pri .col3 {
		width:100% !important;
        margin-bottom:4px;		
  
	}

	.thumb img { max-width:80%; }

	.crop_154x84 { width:100%; }

	body.whid_home div#content_pri .col2 {
	width:100% !important;	
	}

   	body.listing_detail div#content_pri div#content_pri_sub1 #cta-buttons3 img { width:100%; height:auto; }
    .dd-links-container div.expander img.expander { max-width: 100%; width:100% !important; }

	body.whid_home div#content_pri .ss_whid { display:none;	}

	body.layout4 div#content_pri input#expanded_search_keywords { width:160px; }
	
	.YLYC_l2_row_box  { width:98% }
		
	div#footer_pri h2 {    	
		font-size: 1.3em;
		padding-top: 6px;
	}
   	div#contact_details_block { font-size:80%; }
    
    .cta-button {
	width:100% !important;
	margin-bottom:4px !important;
	}
    
    div.landing-links { width:100%; }
    

	
}/* ENDS 480 ======================================== */


/* 320 Width
===================================================== */


@media screen and (max-width: 320px) {

	div#owl-demo { display:none !important; }
	.YLYC_l2_row_box  { width:98% }
	.responsive-hide { display:none; }
	body.layout4 div#content_pri input#expanded_search_keywords { width:95px; }
	div#contact_details_block { font-size:70%; }
	dl#social_networks { width:100% !important; }	

}/* ENDS 320 ======================================== */


@media screen and (max-width: 600px) {

	#homepage-popular h2, #homepage-service-directory h2 { margin:10px 0; font-size: 1.1em; }
	#homepage-popular div.link { width: 50% }
	#homepage-service-directory div.service-block { width: 50% }
	#homepage-service-directory div.service-block:last-child, #homepage-service-directory div.service-block:nth-last-child(2) { border-bottom:none;}
	#contact-us-map, #contact-us-col1, #contact-us-col2  { display: block; width: 100%; margin-right: 0; }
	#contact-us-map, #contact-us-map iframe { margin-bottom:20px; }
	.related_action_button a { font-size:1em; }

}/* ENDS 600 ======================================== */

@media screen and (max-width: 420px) {

	#contact-us-map, #contact-us-map iframe { display:none; }
	#homepage-popular h2, #homepage-service-directory h2 { margin:10px 0; font-size: 1.1em; }
	#homepage-popular div.link { width: 100%; margin-bottom:0px; }
	#homepage-popular div.link a { font-size: 1.05em; height:44px}
	#homepage-service-directory div.service-block { width: 100% }
	ul#rssfeed { -webkit-column-count: 1; -moz-column-count: 1; column-count: 1; }
	.related_action_button a { font-size:0.9em; }


}/* ENDS 420 ======================================== */

.crop_154x84  { width: 210px; height: auto; }
.crop_154x84  img { margin-top:0; margin-left:0; }

/* social media links */

@media screen and (max-width: 470px) {

	dl#social_networks dt {
		width:100% !important;
	}

	dl#social_networks dd a:first-child{
		margin-left:-10px !important;
	}
    
    dl#social_networks dd{
		padding-bottom:10px;
	}
	
}

@media screen and (max-width: 1048px) {

	dl#social_networks{
		float:left;
		width:100%;
	}
}

/* end social media links */