/****** Media Queries *****/
/* for 1200px or less */
@media screen and (max-width: 1200px) {
	.container { margin:0 2%; width:auto!important}
}

/* for 1024px or less */
@media screen and (max-width: 1024px) {
	#topwrap,
	.home #topwrap { padding:15px 0}
	#topwrap { background:#4bbbf1; padding-bottom:10px}
	#topwrap::before { display:none}
	#topwrap .container { margin:0;}

	#topnav { background:#4bbbf1;
        top:0;
        text-align:center;
        margin:0 0 10px 0;
        padding:2px 0;
        float:none;
        width:100%;
        display:inline-block;
        -moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		-ms-box-sizing: border-box;
		box-sizing: border-box;
	}
	#topnav ul { float:none; display:inline-block; width:100%}
	#topnav ul li { font-size:11px; float:none; display:inline-block; vertical-align:middle; margin:0 10px}
	#topnav ul li a { display:block; margin:0; padding:0}
	#topnav ul li::after { display:none}
	#topnav ul li:hover a,
	#topnav ul li.current_page_item a { color:#fff; text-decoration:underline}


	#logo { margin-left:2%; margin-top: 0;}
	#mainnav { margin-right:2%}
	#logo img { width:200px}
	#pagenav > ul > li > a { font-size:12px; padding:5px 10px;}
	#pagenav ul li:hover > ul li a { font-size:12px; padding:5px 10px;}
	#pagenav > ul > li.widenmenus > ul > li { display:inline-block; float:none}
	#pagenav > ul > li.widenmenus > ul > li > a::before { background-size:100%!important}

    #testi-wrap .container { margin:0 22%}
    #testi-wrap .bx-prev, #testi-wrap .bx-next { display:block}
    
    #floating-widget { width:60px!important; top:55%}
	#floating-widget .floating-icon a { width:100%; display:block;}
	#floatlink1 a { width:60px!important;
		height:60px!important;
		background-size:120px!important;
		background-position:0 360px!important
	}
	#floatlink2 a { width:60px!important;
		height:60px!important;
		background-size:120px!important;
		background-position:300px 360px!important
	}
	#floatlink3 a { width:60px!important;
		height:60px!important;
		background-size:120px!important;
		background-position:120px 180px!important
	}
	#banner-area .slide-caption-entry h1 strong,
	#banner-area .slide-caption-entry h2 strong { font-size:20px}
	#banner-area .slide-caption-entry h1 em,
	#banner-area .slide-caption-entry h2 em { font-size:14px}
	#banner-area .slide-caption-entry .slide-button a.btn { font-size:13px; padding:8px 20px;}

    #proven-quality .content-column { padding:2%}

    #main-left { width:68%}
	#main-right{ width:30%}

	#frame-widget { height:auto; padding:50px 20px 20px 20px;
		-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	}
	.tints, .frames { position:relative; top:0; right:0; width:auto}
	.frames-thumb, .tints-thumb {position:relative;width:auto;left: 0;top: inherit;}
	.tints span,
	.frames span.glasstitle, 
	.tints span,
	.frames span.desc { top:0; position:relative; font-size:11px}
	.tints span, .frames span.glasstitle { top:-25px; font-size:14px}
	.tints {position:absolute;top: 76px; padding:0px 20px;}
	.thumbs { text-align:center;
		-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	}
	.frames-thumb { padding-top:20px}
	.frames-thumb h3,
	.tints-thumb h3 { text-align:center}
	.frames-thumb ul li,
	.tints-thumb ul li { display:inline-block; vertical-align:top; float:none}

	#proven-quality .content-column.one_half { padding-left:80px}
	#proven-quality .content-column.one_half.last_column { padding-left:0}

}
/* for 768px or less */
@media screen and (max-width: 768px) {
	body { -webkit-text-size-adjust: none; position:inherit;}
	#pagenav { display:none}

    .mnav-mobile-btn { margin-right:10px}

    #banner-area .slide-caption-entry { float:none;
        text-align:center;
        padding:0 80px;
       -moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		-ms-box-sizing: border-box;
		box-sizing: border-box;
    }
    #banner-area .slide-caption-entry h1 strong,
	#banner-area .slide-caption-entry h2 strong { padding:0; margin:5px 0; background:0; border:0; font-size:16px}
	#banner-area .slide-caption-entry p br { display:none}
	#banner-area .slide-caption-entry .slide-button { padding:20px 0 0 0}
	.nivo-caption { bottom:15%}

	#testi-wrap { padding:5% 0}
	#testi-wrap h2,
	#testi-wrap .entry .testi-box { text-align:center; min-height:inherit; padding-bottom:0}
	#testi-wrap .container { margin:0 12%}
	#testi-wrap .entry .testi-box .testi-thumb { margin:0 0 15px 0}
	#testi-wrap .entry .testi-box .testi-thumb,
	#testi-wrap .entry .testi-box .testi-entry { float:none; width:100%}
    #testi-wrap .entry .testi-box .testi-entry p br { display:none}
    #testimonials-slider .testi-entry strong { display:block}
    #peninsula-divisions.img-caption-lists .entry .main-title { margin:0 0 30px 0}
    
    #floating-widget { position:fixed!important; top:50px!important}

    .mob-show { display:block;}
	.mob-hide { display:none;}
	.overlaybox.step1,
	.overlaybox.step2,
	.overlaybox.step3 { background-size: cover;}
	.home #main-content { padding:0!important}
	#main-content { padding:20px 0 0 0!important}
	#main-content.innerpage { padding:20px 0!important}

	.home .entry h1,
	#proven-quality .content-column h1,
	#testi-wrap h1 {font-size: 25px;}
	.entry .main-title,
	.home .entry .main-title  { margin:0 0 15px 0;}
	.img-caption-lists .entry h1 em { font-size:16px}

	.content-column.one_half { width:auto; float:none}
	.content-column.one_fourth { width:42%; float:none; display:inline-block; vertical-align:top; margin:15px;}
	
	.img-caption-lists { text-align:center; padding:20px 0}
	.img-caption-lists .entry .wp-caption .wp-caption-text { height:inherit}

    #proven-quality { text-align:center}
    #proven-quality > br { display:none}
    #proven-quality .content-column { padding:25px}
    #proven-quality .content-column h1 { margin:0 0 15px 0}
    #proven-quality .content-column h2 { margin:0 0 15px 0; font-family: 'open_sanssemibold'; font-size:19px}

	#testi-wrap .entry .testi-box { padding:10px}
	#testimonials-slider .testi-entry strong { font-size:13px}
	#testimonials-slider .testi-entry,
	#testimonials-slider .testi-entry p { font-size:12px; -webkit-text-size-adjust: none;}
	#testimonials-slider .testi-entry p br { display:none}
	#testi-wrap .entry .testi-box .testi-entry h2 { font-size:13px; margin:0 0 5px 0}
	#testi-wrap .entry .testi-box .testi-thumb { margin:0 0 10px 0}	

    #left-info, #right-info { float:none; width:100%; margin:0 0 40px 0}    
	
	#contact-info-footer h1, #contact-info-footer h2 { font-size:25px; font-family:'open_sanssemibold'}
	#contact-info-footer h1 span, #contact-info-footer h2 span {font-size:16px; font-family:'open_sansregular'; line-height:1.4em}
	#contact-info-footer .contact-info .gform_wrapper input[type=text],
	#contact-info-footer .contact-info .gform_wrapper textarea { font-size:12px; padding:8px}
	#contact-info-footer .contact-info .gform_wrapper .gform_footer { padding:0}
	#contact-info-footer .contact-info .gform_wrapper .gform_footer input.button,
	#contact-info-footer .contact-info .gform_wrapper .gform_footer input[type=submit] { font-size:13px; padding:8px 15px}	
	#contact-info-footer .contact-info .gform_wrapper .gfield_captcha_container .gfield_captcha { height:32px}

    #contact-txts ul li { margin:0 0 15px 0; padding-left:35px}
    #contact-txts ul li::before { background:0; color:#4bbbf1; top:-4px; width:auto; height:auto}

	#copy { font-size:12px; text-align:center}

	.testibox .testicont { width:78%}
}
/* for 414px or less */
@media screen and (max-width: 414px) {
	p { text-align:left}
	.covid-notice { font-size:12px;}
	.covid-notice a {font-family:'open_sanssemibold'!important}
	#topnav {/* display:none; */}
	#topnav ul li { float:none; display:inline-block; margin:0; vertical-align:top;}
	#topnav ul li a { font-size:10px; padding:6px 5px}
	#logo a { display:block; position:relative; z-index:995}
	#logo a img {}
	.mnav-menu { top:55px}
	#banner-area .slide-caption-entry { float:none; text-align:center; padding:0 20px}
	#banner-area .slide-caption-entry h1,
	#banner-area .slide-caption-entry h2 { font-size:17px; font-family:'open_sanssemibold';}
	#banner-area .slide-caption-entry { font-size:12px}
	#banner-area .slide-caption-entry p br { display:none}
	.nivo-caption { bottom:5%}
	#floating-widget { top:100px!important}


	#floating-widget { top:150px!important;}
	.logged-in #floating-widget { top:150px!important;}

    .entry .main-title {display:inline-block; width:100%}
    .entry .main-title h1 { font-size:22px}
	.entry h2 { font-size:19px;}
	.entry .main-title .line { display:none}

    .entry .content-lists .conlistwrap .conlist-img,
    .entry .content-lists .conlistwrap .conlist-entry { float:none; width:100%; text-align:center}


	.content-column.one_fourth { width:280px;}
	.innerpage img.alignright,
	.innerpage a.alignright,
	.innerpage img.alignleft,
	.innerpage a.alignleft,
	.innerpage img.aligncenter,
	.innerpage a.aligncenter,
	.innerpage img.alignnone,
	.innerpage a.alignnone { float:none!important; display: block; margin-left: auto; margin-right: auto;}
	.entry .wp-caption { float:none!important; display: block; margin-left: auto; margin-right: auto;}
	.entry .wp-caption { margin-bottom:20px; width:100%!important}
	
	.btn-button a.btn { font-size:14px; padding:2px 15px}
	
	#contact-info-footer,
	#testi-wrap { padding:30px 0}

	/*.page-id-4137 #floating-widget { display:none}*/
	.page-id-4137 #main-content { padding:20px 0 0 0!important}
	.entry iframe { height:200px;}

	.entry h2 { font-size:19px;}
	#peninsula-divisions.img-caption-lists .entry h1 { font-size:20px}
	#peninsula-divisions.img-caption-lists .entry h1 em { display:block; margin:5px 0 0 0}
	#peninsula-divisions.img-caption-lists .entry h1 em br { display:none}

	/*.home #floating-widget { display:block}*/
	#floating-widget { display:none}

	#testi-wrap .bx-prev, #testi-wrap .bx-next { padding:5px; font-size:12px}

	#main-left, #main-right { width:auto; float:none;}
	#sidebar { width:280px; margin:0 auto; margin-top:50px; margin-bottom:30px}

	#blogposts .post { text-align:center}
	#blogposts .post .post-thumb, #blogposts .post .post-entries { float:none; width:100%; margin:0 0 10px 0}
	.post-readmore, .post-meta { float:none; width:100%; margin:0;}

    #blogposts.singlepost .post-content ul li, #blogposts.singlepost .post-content ol li { text-align:left}

    #blogposts .post .main-title { margin:0; padding:0; border:0;}
    #blogposts .post .main-title .line { display:none}
    #blogposts.singlepost .post h1{
		margin: 0 0 20px 0;
		font-family: 'open_sansbold';
		font-size: 20px;
		line-height: 1.1em;
		text-transform: capitalize;
	}
	.content-column { float:none; width:100%!important; margin:0 0 20px 0!important}
	.entry .vids .wp-caption { float:none; width:100%!important; margin:20px 0;}
	#full .faq-custompage input[type=submit] { width:20%}
	.testibox .testi-thumb,
	.testibox .testicont { float:none; width:100%;}
	.testibox .testi-thumb { margin:0 0 20px 0; text-align:center}

	#left-info, #right-info { margin-bottom:10px}
    .qlink-wrap a { font-size:16px!important; margin:5px 0 5px 0!important; display:inline-block}
    #contact-txts br { display:none}
    #contact-txts .qlink-wrap {}
     #contact-txts .qlink-wrap > br { display:none}
    #contact-txts .qlink-wrap.phone { margin:0 0 20px 0!important}
    #contact-txts .qlink-wrap a { margin:5px 0 15px 0!important; display:inline-block; float:none; font-size:16px; vertical-align:top; width:100%;}
    #contact-txts { margin:0 0 5px 0}
    #contact-info-footer { background:#333; padding:0 0 20px 0}
    #social-icons { margin-top:15px}
    #social-icons > br { display:none}

    #testi-wrap { display:none}
	#site-quote-icons { display:none}
    #floatingwidgetmob { display:block!important; font-size:0; text-align:center; margin:1px 0 10px 0}
	.home #floatingwidgetmob { margin-bottom:0}
	#floatingwidgetmob a { display:inline-block;
	    vertical-align:top;
	    width:49%;
	    text-align:center;
	    -moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		-ms-box-sizing: border-box;
		box-sizing: border-box;
	}
	#floatingwidgetmob a::before { content:'';
	    display:block;
	    margin:0 auto;
	    width:105px;
	    height:85px;

	}
	#floatingwidgetmob a#floatingwidgetmob1 { background:#1e89d1}
	#floatingwidgetmob a#floatingwidgetmob2 { background:#00bdf7}
	#floatingwidgetmob a#floatingwidgetmob1::before { background:url(../images/floatinwidgetmob1.jpg) no-repeat scroll 0 0}
    #floatingwidgetmob a#floatingwidgetmob2::before { background:url(../images/floatinwidgetmob2.jpg) no-repeat scroll 0 0}

    #banner-area.formobtrick { background: url(/wp-content/uploads/2017/05/mob-banner2.jpg); height:373px; background-size:100%;}
    .cust-trick { height: 30px;
	    overflow: hidden;
	}
}

/* for 375px or less */
@media screen and (max-width: 375px) {
	#banner-area.formobtrick { background: url(/wp-content/uploads/2017/05/mob-banner2.jpg); height:338px; background-size:100%;}
}

@media screen and (max-width: 330px) {
    #footernav ul li { width:85%; margin:2px 0}
    #social-icons ul li a { width:40px; height:40px; font-size:18px; line-height:43px!important}
    #banner-area.formobtrick { background: url(/wp-content/uploads/2017/05/mob-banner2.jpg); height:289px; background-size:100%;}
}