@charset "utf-8";
/* #Additional - Large Screens beyond 1600px
================================================== */
@media only screen and (min-width: 1367px) and (max-width: 1600px) {

.container                                  { max-width: 1250px; }
#slider:after								{ background: linear-gradient(89deg, #001220 32.03%, rgba(0, 75, 134, 0) 72.4%); }


}



/* #Additional - Large Screens beyond 1366px
================================================== */
@media only screen and (min-width: 1280px) and (max-width: 1366px) {

.container                                  { max-width: 1250px; }

}


/* #Additional - Large Screens beyond 1366px
================================================== */
@media only screen and (min-width: 1180px) and (max-width: 1280px) {

.container                                  { max-width: 1250px; width: auto; margin: 0 15px; }

}



/* #iPad Pro - Large Screens beyond 1024px
================================================== */
@media only screen and (min-width: 992px) and (max-width: 1199px) {

.container									{ max-width: 960px; }

.page-header .top_right .top_row .phoneText { display: none; }
.page-header .top_right .bottom_row         { gap: 15px; }
.page-header .top_right .bottom_row p       { font-size: 16px; line-height: 24px; }
.page-header .top_right .rightBtn a.serviceBtn { font-size: 14px; line-height: 14px; }
.menu_box ul.menu li                        { margin-right: 10px; }
.menu_box ul.menu li a                      { padding: 7px 5px; font-size: 18px; line-height: 28px; }
.menu_box ul.menu li ul.sub-menu li a       { padding: 7px 5px; font-size: 16px; }

.page-header .rightBtn .phone				{ padding: 8px 15px 8px 40px; font-size: 18px; line-height: 28px; }
.page-header .rightBtn .phone:before		{ font-size: 20px; line-height: 20px; left: 12px; top: 13px; }	


#slider .banner								{ background-size: cover; }
#slider .caption h6							{ font-size: 20px; line-height: 30px; }
#slider .caption h1							{ font-size: 45px; line-height: 50px; }	
#slider .caption p							{ padding: 0 200px 0 0; font-size: 16px; }
#slider .caption .caption_button .quote_btn	{ font-size: 18px; line-height: 28px; }
#slider .caption .caption_button .call_btn	{ font-size: 18px; line-height: 28px; }

.feature_section .features					{ gap: 20px 20px; }
.feature_section .features .item			{ gap: 10px; }
.feature_section .features .item .icon		{ max-width: 40px; height: fit-content; }
.feature_section .features .item .content h6 { padding: 0 10px 0 0; font-size: 22px; line-height: 28px; }
.feature_section .features .item .content p	{ font-size: 12px; line-height: 16px; }


.dumpsters_section h2						{ font-size: 35px; }
.dumpsters_section .item					{ height: 100%; }
.dumpsters_section .item .cont-col h6		{ font-size: 22px; line-height: 32px; }
.dumpsters_section .item .cont-col p		{ font-size: 16px; }	

.choose_section .choose_item .cont-col h2	{ font-size: 35px; }
.choose_section .choose_item .cont-col h2::before	{ width: 185px; }
.choose_section .choose_item .cont-col ul li { padding: 0 0 0 35px; font-size: 16px; line-height: 40px; }	
.choose_section .choose_item .cont-col p	{ font-size: 16px; }
.choose_section .choose_item .image-col		{ width: 45%; }

.cta_section .cont-col h3					{ font-size: 30px; line-height: 45px; }
.cta_section .cont-col .cta_button .quote_btn { font-size: 18px; line-height: 28px; }
.cta_section .cont-col .cta_button .call_btn  { font-size: 18px; line-height: 28px; }


#footer .contactInfo .info_title			{ font-size: 16px; line-height: 26px; }
#footer .contactInfo p						{ font-size: 16px; line-height: 26px; }
#footer .contactInfo a						{ font-size: 16px; line-height: 26px; }
#footer .contactInfo .ftr_social ul li a img { max-width: 90%; }	

#footer .ftr_servicearea .area_wrap .area_title	{ width: 35%; }


/*----------------- Inner Pages -----------------*/
.alignleft, .alignnone                      { max-width: 50%; margin: 0 30px 20px 0; }
.alignright                                 { max-width: 50%; margin: 0 0 20px 30px; }

#inner_banner                               { min-height: 320px; }
#inner_banner h1                            { font-size: 40px; line-height: 45px; }
#inner_banner .breadcrumb li 				{ font-size: 16px; }

.inner_section                              { padding-top: 50px; padding-bottom: 50px; }
.inner_section h2                           { font-size: 40px; line-height: 45px; }

/*----------------- About Us Page -----------------*/
.about_section h2							{ font-size: 35px; }


}



/* #Tablet (Portrait)
================================================== */
/* Note: Design for a width of 768px */
@media only screen and (min-width: 768px) and (max-width: 991px) {

.container									{ max-width: 100%; padding: 0 15px; }

#header .top1								{ display: none; }
.page-header.top2							{ top: 0px !important; height: 100px; }
.page-header .top_right						{ padding: 10px 0; }
.dl-menuwrapper                             { margin: 20px 0; }

#slider										{ margin-top: 100px; } 	
#slider .banner								{ background-size: cover; min-height: 500px; }
#slider .caption							{ width: 70%; }
#slider .caption h6							{ font-size: 20px; line-height: 30px; }
#slider .caption h1							{ font-size: 40px; line-height: 50px; }	
#slider .caption p							{ padding: 0 150px 0 0; font-size: 16px; }
#slider .caption .caption_button .quote_btn	{ font-size: 18px; line-height: 28px; }
#slider .caption .caption_button .call_btn	{ font-size: 18px; line-height: 28px; }

.feature_section .features					{ gap: 20px 20px; grid-template-columns: repeat(2, 1fr); }
.feature_section .features .item			{ gap: 10px; flex-direction: row; }
.feature_section .features .item .icon		{ max-width: 40px; height: fit-content; }
.feature_section .features .item .content	{ width: calc(100% - 40px); }
.feature_section .features .item .content h6 { padding: 0 10px 0 0; font-size: 22px; line-height: 28px; }
.feature_section .features .item .content p	{ font-size: 12px; line-height: 16px; }


.dumpsters_section h2						{ font-size: 30px; }
.dumpsters_section .item					{ height: calc(100% - 30px); margin: 0 0 30px 0; }
.dumpsters_section .item .cont-col h6		{ font-size: 22px; line-height: 32px; }
.dumpsters_section .item .cont-col p		{ min-height: 75px; font-size: 16px; }	

.choose_section .choose_item .cont-col		{ width: 50%; }
.choose_section .choose_item .cont-col h2	{ font-size: 30px; }
.choose_section .choose_item .cont-col h2::before	{ width: 150px; }
.choose_section .choose_item .cont-col ul li { padding: 0 0 0 35px; font-size: 16px; line-height: 40px; }	
.choose_section .choose_item .cont-col p	{ font-size: 16px; }

.choose_section .choose_item .image-col		{ width: 50%; }


.cta_section .cont-col h3					{ font-size: 28px; line-height: 32px; }
.cta_section .cont-col .cta_button .quote_btn { font-size: 18px; line-height: 28px; }
.cta_section .cont-col .cta_button .call_btn  { font-size: 18px; line-height: 28px; }

#footer p.address, #footer a.phone, #footer a.email { font-size: 16px; line-height: 26px; padding-left: 35px; }
#footer .contactInfo                        { flex-wrap: wrap; margin-bottom: 30px; }
#footer .contactInfo .ftr_address,
#footer .contactInfo .ftr_phone,
#footer .contactInfo .ftr_social,
#footer .contactInfo .ftr_email				{ width: 47.96%; }
#footer .paymentCard                        { margin-bottom: 30px; }
#footer .copyright p                        { font-size: 16px; line-height: 26px; }
#footer .copyright .footerMenu li a         { font-size: 16px; line-height: 26px; }
#footer .contactInfo p						{ font-size: 16px; }
#footer .contactInfo a						{ font-size: 16px; }
#footer .ftr_servicearea .area_wrap .area_title	{ width: 65%; }
#footer .ftr_servicearea .area_wrap			{ gap: 50px; }


/*----------------- Inner Pages -----------------*/
.alignleft, .alignnone                      { max-width: 50%; margin: 0 20px 20px 0; }
.alignright                                 { max-width: 50%; margin: 0 0 20px 20px; }

#inner_banner                               { min-height: 270px; margin-top: 100px; }

#inner_banner .caption 						{ width: 73%; }

#inner_banner h1                            { font-size: 40px; line-height: 50px; }
#inner_banner .breadcrumb li 				{ font-size: 16px; }

.inner_section                              { padding-top: 50px; padding-bottom: 50px; }
.inner_section h2                           { font-size: 30px; }
.inner_section h3                           { font-size: 25px; line-height: 30px; }
.inner_section h4                           { font-size: 20px; line-height: 25px; }
.inner_section h5                           { font-size: 18px; line-height: 23px; }
.inner_section p                            { font-size: 16px; line-height: 26px; }
ul.service-areas							{ margin: 0 0 20px 0; }
.inner_section ul li                        { padding-left: 25px; font-size: 16px; line-height: 26px; }
.inner_section ul li::before                { width: 16px; height: 16px; top: 7px; }


/*----------------- Dumpster Sizes Page -----------------*/

.dumpsters_cont .cont-col h2				{ margin: 0 0 20px 0; font-size: 30px; }
.dumpsters_cont .cont-col p					{ font-size: 16px; }		
.dumpsters_cont .cont-col h3				{ margin: 0 0 20px 0; font-size: 28px; line-height: 32px; }

.dumpster-page .choose_section .choose_item .cont-col h2	{ line-height: 40px; }
.dumpster-page .dumpsters_section .item .cont-col p		{ min-height: auto; }

/*----------------- About Us Page -----------------*/

.about_section h2							{ margin: 0 0 30px 0; font-size: 30px; }
.about_section h2::before					{ width: 29%; }
.about_section p							{ font-size: 16px; }


/*----------------- Faqs Page -----------------*/

.faqsBox									{ margin-top: 30px; }
.faqsBox .panel .panel-heading .panel-title { font-size: 20px; line-height: 28px; }
.faqsBox .panel .panel-heading .panel-title a { padding: 10px 15px; display: flex; align-items: center; flex-direction: row-reverse; justify-content: space-between; }
.faqsBox .panel .panel-heading .panel-title .plus-toggle:before { width: 25px; height: 25px; height: 25px; font-size: 20px; }
.faqsBox .panel .panel-collapse .panel-body { padding: 10px 15px; }

/*----------------- Contact Page -----------------*/

.contact_form .form-control                 { height: 45px; font-size: 16px; padding: 10px 15px }
.contact_form .form-group .submit_btn       { padding: 10px 25px; font-size: 16px; line-height: 26px; }
.contact_detail                             { padding-left: 20px; }
.contact_detail ul li						{ padding: 0 0 0 40px; }
.contact_detail ul li::before				{ width: inherit; height: inherit; top: inherit; }

.map_sec iframe 							{ height: 400px; }


}



/*  #Mobile (Portrait)
================================================== */
/* Note: Design for a width of 320px */
@media only screen and (max-width: 767px) {

.container									{ max-width: 100%; padding: 0 15px; }

#header .top1								{ display: none; }
.page-header .cb_logo						{ width: 170px; padding: 20px 0; }
.page-header.top2 							{ top: 0px !important; height: 90px; }
.page-header .top_cont						{ display: none; }					
/* .page-header .top_right						{ width: 20%; } */
.page-header .top_right .top_menu2			{ display: inline-block; }
.page-header .top_right + .top_right        { position: relative; display: none; width: 100%; padding: 8px 0 8px 0; text-align: center; z-index: -1; }
.page-header .top_right .top_row            { float: none; display: inline-block; width: auto; margin-bottom: 10px; }
.page-header .top_right .top_row ul li a    { margin-right: 10px; margin-left: 10px; font-size: 14px; }
.page-header .top_right .phone              { float: none; display: inline-block; width: auto; padding-top: 0; margin-left: 4px; }
.page-header .top_right .phone .call        { font-size: 14px; }
.dl-menuwrapper                             { margin: 20px 0; }
.menu_box									{ display: none; }

#slider										{ margin-top: 90px; }
#slider .banner								{ min-height: auto; padding-top: 65vw; padding-bottom: 40px; background-position: top center; background-size: 100% auto; }
#slider .caption							{ position: relative; max-width: 100%; top: auto; transform: none; }
#slider .container							{ position: relative; }
#slider .caption h6							{ font-size: 20px; line-height: 32px; }
#slider .caption h1							{ font-size: 35px; line-height: 40px; }
#slider .caption p							{ padding: 0; font-size: 16px; }
#slider .caption .caption_button			{ flex-direction: column; align-items: flex-start; }
#slider .caption .caption_button .quote_btn	{ font-size: 18px; line-height: 28px; }
#slider .caption .caption_button .call_btn	{ font-size: 18px; line-height: 28px; }
#slider:after								{ display: none; }	

.feature_section							{ padding-top: 30px; }
.feature_section .features					{ grid-template-columns: repeat(1, 1fr); gap: 25px 25px; }
.feature_section .features .item			{ gap: 10px; }
.feature_section .features .item .icon		{ max-width: 40px; height: fit-content; }
.feature_section .features .item .content h6	{ padding: 0 0 0 0; margin: 0 0 10px 0; font-size: 22px; line-height: 28px; }

.dumpsters_section							{ padding-top: 30px; padding-bottom: 0px; }
.dumpsters_section h2						{ margin: 0 0 25px 0; padding: 60px 0 0 0; font-size: 25px; }
.dumpsters_section h2::before				{ width: 100%; background: linear-gradient(to right, rgba(250, 116, 2, 0) 0%, #FA7402 40%, rgba(255, 255, 255, 0) 40%, rgba(255, 255, 255, 0) 60%, #FA7402 60%, rgba(250, 116, 2, 0) 100%); }
.dumpsters_section .item					{ padding: 15px; border-radius: 15px; margin: 0 0 30px 0; }
.dumpsters_section .item .cont-col h6		{ font-size: 20px; line-height: 32px; }	
.dumpsters_section .item .cont-col p		{ margin: 0 0 10px 0; font-size: 16px; }
.dumpsters_section .item .cont-col p:last-child { margin: 0 0 0 0;}

.choose_section								{ margin: 0 0 70px 0; }
.choose_section .choose_item				{ flex-wrap: wrap; }
.choose_section .choose_item .cont-col		{ width: 100%; }
.choose_section .choose_item .cont-col h2	{ font-size: 25px; }	
.choose_section .choose_item .cont-col ul li { padding: 0 0 0 25px; font-size: 16px; line-height: 30px; }
.choose_section .choose_item .cont-col ul li::before { width: 15px; height: 12px; }
.choose_section .choose_item .cont-col p	{ font-size: 16px; }
.choose_section .choose_item .image-col		{ position: relative; right: auto; bottom: auto; margin-top: 30px; margin-bottom: -70px; }


.cta_section								{ padding-top: 30px; padding-bottom: 30px; }
.cta_section .cont-col						{ text-align: center; }
.cta_section .cont-col h3					{ font-size: 22px; line-height: 28px; }
.cta_section .cont-col p					{ font-size: 16px; }	
.cta_section .cont-col .cta_button			{ flex-direction: column; }
.cta_section .cont-col .cta_button .quote_btn { font-size: 18px; line-height: 28px; }
.cta_section .cont-col .cta_button .call_btn  { font-size: 18px; line-height: 28px; }

#footer                                     { padding-top: 30px; padding-bottom: 30px; }
#footer .contactInfo                        { flex-direction: column; gap: 20px; margin-bottom: 30px; }
#footer p.address, #footer a.phone, #footer a.email { font-size: 16px; line-height: 26px; }
#footer .contactInfo p						{ font-size: 16px; }
#footer .contactInfo a						{ font-size: 16px; }
#footer .ftr_social ul li a img             { width: 35px; }
#footer .paymentCard                        { margin-bottom: 30px; }
#footer .copyright .footerMenu				{ flex-wrap: wrap; }
#footer .copyright p                        { font-size: 16px; line-height: 26px; }
#footer .copyright .footerMenu li a         { font-size: 16px; line-height: 26px; }
#footer p.address::before, 
#footer a.phone::before, 
#footer a.email::before                     { top: 0; }

#footer .ftr_servicearea .area_wrap			{ flex-wrap: wrap; gap: 30px; }
#footer .ftr_servicearea .area_wrap .area_title	{ width: 100%; text-align: center; }
#footer .ftr_servicearea .area_wrap .areas_list ul	{ justify-content: center; }


/*----------------- Inner Pages -----------------*/
#inner_banner                               { min-height: 270px; margin-top: 80px; }
#inner_banner .caption 						{ width: 100%; }
#inner_banner h1                            { font-size: 35px; line-height: 40px; }
#inner_banner .breadcrumb li 				{ font-size: 16px; }

.inner_section                              { padding-top: 30px; padding-bottom: 30px; }
.inner_section h2                           { font-size: 25px; }
.inner_section h3                           { font-size: 22px; line-height: 28px; }
.inner_section h4                           { font-size: 20px; line-height: 28px; }
.inner_section h5                           { font-size: 18px; line-height: 28px; }
.inner_section p                            { font-size: 16px; line-height: 26px; }
.inner_section ul li                        { padding-left: 25px; font-size: 16px; line-height: 26px; }
.inner_section ul li::before                { width: 16px; height: 16px; top: 5px; }


/*----------------- Service areas Page -----------------*/
.service-areas-page ul.service-areas		{ margin: 30px 0 30px 0; column-count: 2; column-gap: 10px; }
ul.service-areas							{ margin: 0 0 30px 0; }


/*----------------- Dumpsters Sizes Page -----------------*/

.dumpsters_cont								{ padding-top: 30px; padding-bottom: 30px; }
.dumpsters_cont .cont-col h2				{ margin: 0 0 20px 0; font-size: 25px; }
.dumpsters_cont .cont-col p					{ font-size: 16px; }		
.dumpsters_cont .cont-col h3				{ margin: 0 0 20px 0; font-size: 22px; line-height: 28px; }

.dumpster-page .choose_section .choose_item .cont-col h2	{ line-height: 40px; }


/*----------------- About Us Page -----------------*/
.about_section								{ padding-top: 30px; padding-bottom: 30px; }
.about_section h2							{ margin: 0 0 25px 0; font-size: 25px; }
.about_section p							{ margin: 0 0 15px 0; font-size: 16px; }



/*----------------- Faqs Page -----------------*/

.faqsBox									{ margin-top: 30px; }
.faqsBox .panel .panel-heading .panel-title { font-size: 20px; line-height: 28px; }
.faqsBox .panel .panel-heading .panel-title a { padding: 10px 15px; }
.faqsBox .panel .panel-heading .panel-title a { padding: 10px 15px; }
.faqsBox .panel .panel-heading .panel-title .plus-toggle:before { width: 25px; height: 25px; height: 25px; font-size: 20px; }
.faqsBox .panel .panel-collapse .panel-body { padding: 10px 15px; }

/*----------------- Contact Page -----------------*/

.contact_form								{ padding: 0 0 30px 0; }
.contact_form .form-control                 { height: 45px; font-size: 16px; padding: 10px 15px }
.contact_form .form-group .submit_btn       { padding: 10px 25px; font-size: 16px; line-height: 26px; }
.contact_detail                             { padding-left: 0; }
.contact_detail ul li						{ padding: 0 0 0 40px; }
.contact_detail ul li::before				{ width: inherit; height: inherit; top: inherit; }

.map_sec iframe 							{ height: 300px; }

}



/* #Mobile (Landscape)
================================================== */
/* Note: Design for a width of 480px */
@media only screen and (min-width: 480px) and (max-width: 767px) {

.container { /*width: 420px;*/ width: 100%; padding: 0 15px; }

}