(1970,1,'2020-09-08 03:02:10','2020-09-08 10:02:10','<h1>Quote Demo:</h1>\r\n\r\n<style>\r\n\r\n  body{\r\n		font-family:Arial;\r\n	}\r\n\r\n	.Frame_Tool_Img{\r\n		cursor:pointer;\r\n		margin:20px;\r\n		border:2px solid transparent;\r\n		transition:border-color 0.1s linear;\r\n	}\r\n		.Frame_Tool_Img:hover{\r\n			border-color:#79c6e8;\r\n		}\r\n	input{\r\n		text-align:center;\r\n	}\r\n	\r\n	#content_container{\r\n		position:relative;\r\n			left:25vw;\r\n		width:50vw;\r\n			height:100%;\r\n	}\r\n	\r\n	#d{display:none;}\r\n	#tupperware_0{\r\n		grid-area:1 / 1;\r\n		height:100%;\r\n			width:100%;\r\n		display:grid;\r\n			grid-auto-flow:dense;\r\n			grid-template-columns: repeat(7, 1fr);\r\n			grid-template-rows: 500px 500px 500px;\r\n	}\r\n	#tupperware_1{\r\n		grid-area:1 / 1;\r\n		display:none;\r\n	}\r\n	\r\n	#tupperware_2{display:none;}\r\n	/*\r\n	.coolframebutte{\r\n		width:225px;\r\n		height:auto;\r\n	}\r\n	\r\n\r\n	#disable_1{\r\n		\r\n	}\r\n	#disable_2,#disable_3,#disable_4{\r\n		opacity:0;\r\n		transition:opacity .25s ease-in-out;\r\n	}\r\n	#disable_4{\r\n		height:7vh;\r\n			width:12vw;\r\n		font-size:2vh;\r\n		top:45vh;\r\n			left:44vw;\r\n	}\r\n\r\n	.fancy{\r\n		width:20vw;\r\n			height:50vh;\r\n			border-radius:10px;\r\n		position:absolute;\r\n			left:25%;\r\n			top:25vh;\r\n		background-color:#eee;\r\n		display:grid;\r\n			grid-auto-columns:100%;\r\n			grid-template-rows:85% 15%;\r\n	}\r\n		#f1{\r\n			backround-color:#fff;\r\n			text-align:center;\r\n		}\r\n		#f2{\r\n			background-color:#bbb;\r\n		}\r\n			#f2_2{\r\n				width:25%;\r\n					height:6%;\r\n				position:absolute;\r\n					left:15%;\r\n					top:90%;\r\n			}\r\n			#f2_1,#f2_1_final{\r\n				width:25%;\r\n					height:6%;\r\n				position:absolute;\r\n					right:15%;\r\n					top:90%;\r\n			}\r\n				.buTy_0{\r\n					height:5%;\r\n						width:65%;\r\n				}\r\n				.buTy_1{\r\n					height:5%;\r\n						width:65%;\r\n				}\r\n				.buTy_2{\r\n					position:absolute;\r\n						width:45%;\r\n						height:23%;\r\n						bottom:18%;\r\n					font-size:80%;\r\n					text-align:left;\r\n					background-color:#fff;\r\n						border:solid #767676 1px;\r\n						border-radius:2px;\r\n				}\r\n					#1_opt_text{\r\n						height:1000%;\r\n					}\r\n					\r\n				#project_type{\r\n					position:relative;\r\n						width:65%;\r\n						height:5%;\r\n						left:17.5%;\r\n					font-size:80%;\r\n					background-color:#fff;\r\n						border:solid #767676 1px;\r\n						border-radius:2px;\r\n				}\r\n		\r\n		#cart_area{\r\n			height:65%;\r\n			display:grid;\r\n				grid-template-columns:33% 33% 33%;\r\n				grid-auto-rows:40%;\r\n		}\r\n			.frame_frame_frame{\r\n				\r\n			}\r\n				#frame_add{\r\n					height:24%;\r\n					margin-top:35%;\r\n				}\r\n				.add_frame{\r\n					height:30%;\r\n						width:30%;\r\n					margin-top:25%;\r\n				}\r\n			#_addnotes{\r\n				position:relative;\r\n					width:90%;\r\n					height:10%;\r\n			}\r\n	\r\n	#the_void{\r\n		position:absolute;\r\n			top:0;\r\n			left:0;\r\n			z-index:999;\r\n		background-color:rgba(0,0,0,0.6);\r\n		height:100%;\r\n			width:100%;\r\n		display:none;\r\n			grid-template-rows:5% 5% 85% 5%;\r\n			grid-template-columns:5% 90% 5%;\r\n			grid-template-areas:\'. . .\'\r\n								\'. a_fr a_x\'\r\n								\'. a_fr .\'\r\n								\'. . .\';\r\n		opacity:0;\r\n		transition:opacity 0.3s ease-in-out;\r\n	}\r\n		#all_of_the_frames_you_can_select_from{\r\n			grid-area:a_fr;\r\n		}\r\n			#personalize_frame_frame{\r\n				grid-area:a_fr;\r\n				visibility:hidden;\r\n				opacity:0;\r\n				transition:opacity 0.3s ease-in-out;\r\n			}\r\n		#the_little_x_in_the_top_right{\r\n			grid-area:a_x;\r\n				color:#fff;\r\n				font-size:2.4vmax;\r\n				cursor:pointer;\r\n			transition:color .1s linear;\r\n		}\r\n				#the_little_x_in_the_top_right:hover{\r\n					color:#79c6e8;\r\n				}\r\n			#customizations{\r\n				position:absolute;\r\n					top:20%;\r\n					height:50%;\r\n					weight:50%;\r\n					left:30%;\r\n				padding:20px;\r\n				border-radius:5px;\r\n				text-align:center;\r\n				background-color:rgba(0,0,0,0.2);\r\n			}\r\n				#bottomofframeoptions{\r\n					position:relative;\r\n						width:100%;\r\n						left:-20px;\r\n						bottom:-20px;\r\n					padding:20px;\r\n					background-color:#bbb;\r\n				}\r\n				#joist_space,#opening_size,#unit_weight{\r\n					height:2.5vh;\r\n					border:none;\r\n					border-left:5px solid transparent;\r\n					transition:border-left 0.2s linear;\r\n				}\r\n				#unit_type{\r\n					color:#fff;\r\n					text-align:left;\r\n				}\r\n			#save_unit{\r\n				width:50%;\r\n					height:2.5vh;\r\n			}\r\n			\r\n	#quickgridthing{\r\n		display:grid;\r\n			grid-template-columns:100%;\r\n			grid-template-areas:100%;\r\n	}\r\n		#grandprize__hori,#grandprize__vert{\r\n			animation:flickercolorselect 1s infinite;\r\n			visibility:hidden;\r\n		}\r\n		.blinking_arrow{\r\n			position:absolute;\r\n				left:10px;\r\n			font-size:1.6vh;\r\n			color:red;\r\n			visibility:hidden;\r\n			animation:flickercolorselect 1s infinite;\r\n		}\r\n	@keyframes flickercolorselect{\r\n		0%{opacity:0;}\r\n		50%{opacity:1;}\r\n		100%{opacity:0;}\r\n	}\r\n	\r\n	\r\n	.container_around_selected_frames_in_the_cart_screen{\r\n		\r\n	}\r\n		#rmv_q1{\r\n			color:red;\r\n			border:none;\r\n			background-color:transparent;\r\n			cursor:pointer;\r\n		}\r\n			#rmv_q1:hover{\r\n				text-decoration:underline;\r\n			}\r\n\r\n*/\r\n\r\n</style>\r\n<script>\r\n		var input_last_selected= false;\r\n	function selectoneofthetwoinputspluscolouring(a){\r\n		if(a==\'joist\'){\r\n			if(input_last_selected==\'opening\'){\r\n				//document.getElementById(\'opening_size\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_opening\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__vert\').style.visibility= \'hidden\';\r\n			}\r\n			input_last_selected= \'joist\';\r\n			//document.getElementById(\'joist_space\').style.borderLeftColor= \'red\';\r\n			document.getElementById(\'arrow_for_joist\').style.visibility= \'visible\';\r\n			document.getElementById(\'grandprize__hori\').style.visibility= \'visible\';\r\n		} else if(a==\'opening\'){\r\n			if(input_last_selected==\'joist\'){\r\n				//document.getElementById(\'joist_space\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_joist\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__hori\').style.visibility= \'hidden\';\r\n			}\r\n			input_last_selected= \'opening\';\r\n			//document.getElementById(\'opening_size\').style.borderLeftColor= \'red\';\r\n			document.getElementById(\'arrow_for_opening\').style.visibility= \'visible\';\r\n			document.getElementById(\'grandprize__vert\').style.visibility= \'visible\';\r\n		} else if(!a){\r\n			if(input_last_selected==\'joist\'){\r\n				//document.getElementById(\'joist_space\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_joist\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__hori\').style.visibility= \'hidden\';\r\n			} else if(input_last_selected==\'opening\'){\r\n				//document.getElementById(\'opening_size\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_opening\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__vert\').style.visibility= \'hidden\';\r\n			}\r\n		}\r\n	}\r\n	\r\n		var chosen_frame;\r\n	function choose(a){\r\n			let a6=a.src.length-6,a7=a.src.length-7;\r\n		chosen_frame= parseInt(a.src[a7]!=\'(\'?(a.src[a7]+a.src[a6]):a.src[a6])+1;\r\n		\r\n		//document.getElementById(\'tupperware_0\').style.visibility= \'hidden\';\r\n			//document.getElementById(\'tupperware_1\').style.display= \'block\';\r\n		\r\n		document.getElementById(\'grandprize\').src= \'./frames/dry (\'+(chosen_frame-1)+\').png\';\r\n			setTimeout(function(){document.getElementById(\'grandprize\').style.width= \'375px\';},50);\r\n		\r\n		\r\n		document.getElementById(\'all_of_the_frames_you_can_select_from\').style.visibility= \'hidden\';\r\n		document.getElementById(\'personalize_frame_frame\').style.visibility= \'visible\';\r\n				document.getElementById(\'grandprize__hori\').src= \'./frames/hori (\'+(chosen_frame-1)+\').png\';\r\n				document.getElementById(\'grandprize__vert\').src= \'./frames/vert (\'+(chosen_frame-1)+\').png\';\r\n					setTimeout(function(){\r\n								document.getElementById(\'grandprize__hori\').style.width= \'375px\';\r\n								document.getElementById(\'grandprize__vert\').style.width= \'375px\';\r\n							},50);\r\n			document.getElementById(\'personalize_frame_frame\').style.opacity= \'1\';\r\n		\r\n		if(chosen_frame==3 || chosen_frame==10){\r\n			document.getElementById(\'grandprize__vert\').hidden= true;\r\n			document.getElementById(\'opening_size\').hidden= true;\r\n			document.getElementById(\'arrow_for_opening\').hidden= true;\r\n		} else{\r\n			document.getElementById(\'grandprize__vert\').hidden= false;\r\n			document.getElementById(\'opening_size\').hidden= false;\r\n			document.getElementById(\'arrow_for_opening\').hidden= false;\r\n		}\r\n		\r\n		document.getElementById(\'joist_space\').focus();\r\n		\r\n		\r\n		/*	\r\n		let vHeight= document.getElementById(\'grandprize\').height,\r\n			vWidth= document.getElementById(\'grandprize\').width;\r\n			\r\n		document.getElementById(\'ch_width\').style.left= ((vWidth - document.getElementById(\'ch_width\').style.width)/2)+\'px\';\r\n		*/\r\n	}\r\n	\r\n	function removeitemfromcard(a){\r\n		//add stuff here to remove set image\r\n		document.getElementById(\'frame_\'+a).style.display= \'none\';\r\n	}\r\n	\r\n	\r\n/*\r\n\r\nSUBMIT\r\n- include \'additional notes\' section\r\n- links to plans (URL)\r\n	- OR -\r\n- file upload\r\n- CAPTCHA\r\n\r\n*/\r\n</script>\r\n<!--\r\n		<div id=the_void >\r\n			<div id=personalize_frame_frame >\r\n				<div id=quickgridthing >\r\n					<img class=\'Frame_Tool_Img\' id=grandprize__hori src=\'./blue2.png\' style=\'grid-area:1 / 1;\'>\r\n					<img class=\'Frame_Tool_Img\' id=grandprize__vert src=\'./blue1.png\' style=\'grid-area:1 / 1;\'>\r\n					<img class=\'Frame_Tool_Img\' id=grandprize src=\'\' style=\'grid-area:1 / 1;\'>\r\n				</div>\r\n				<div id=customizations >\r\n				\r\n				<div id=arrow_for_joist class=blinking_arrow >►</div>\r\n				<input id=joist_space type=text placeholder=\'Joist Spacing (in.)\' onfocus=\'selectoneofthetwoinputspluscolouring(\"joist\")\'/>\r\n					\r\n				<br><br>\r\n					<div id=arrow_for_opening class=blinking_arrow >►</div>\r\n				<input id=opening_size type=text placeholder=\'Opening Size (in.)\' onfocus=\'selectoneofthetwoinputspluscolouring(\"opening\")\'/>\r\n					\r\n				<br><br><div id=unit_type onclick=\'selectoneofthetwoinputspluscolouring(false)\'>\r\n						<p style=\'text-align:center;\'>Unit Type:</p>\r\n						<div style=\'\r\n						background-color:#fff;\r\n							border:solid #767676 1px;\r\n							border-radius:2px;\r\n							color:#000;\r\n							font-size:80%;\r\n							padding:5px;\' >\r\n							<input type=radio name=\'d\' id=\'u_opt_1\' value=\'opt1\' onfocus=\'selectoneofthetwoinputspluscolouring(false)\'/><label for=\'u_opt_1\'>RTU/AHU/MAU</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_2\' value=\'opt2\'/><label for=\'u_opt_2\'>EVAP Coolers</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_3\' value=\'opt3\'/><label for=\'u_opt_3\'>Exhaust Fans</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_4\' value=\'opt4\'/><label for=\'u_opt_4\'>Powered Vents</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_5\' value=\'opt5\'/><label for=\'u_opt_5\'>Gravity Vents</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_6\' value=\'opt6\'/><label for=\'u_opt_6\'>Skylights</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_7\' value=\'opt7\'/><label for=\'u_opt_7\'>Roof Drains</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_8\' value=\'opt8\'/><label for=\'u_opt_8\'>Roof Hatch</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_9\' value=\'opt9\'/><label for=\'u_opt_9\'>Floor Openings</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_text\' value=\'opt10\'/><input id=\'u_opt_text\' style=\'width:65%\' type=text placeholder=\'Other\'/>\r\n						</div>\r\n					</div>\r\n					\r\n			<br><br><input id=unit_weight type=text placeholder=\'Unit Weight (lbs.)\' onfocus=\'selectoneofthetwoinputspluscolouring(false)\'/>\r\n					\r\n	<br><br><div id=bottomofframeoptions >\r\n				<input id=save_unit type=button value=\'Add to Cart\' onclick=\'saveframe()\' onfocus=\'selectoneofthetwoinputspluscolouring(false)\'/>\r\n			</div>\r\n				</div>\r\n			</div>\r\n			<div id=all_of_the_frames_you_can_select_from >\r\n				\r\n				<div id=fr_double >\r\n					<img src=\'./frames/frame (0).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (1).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (2).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (5).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (6).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (9).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n				</div>\r\n				<div id=fr_triple >\r\n					<img src=\'./frames/frame (3).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (4).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (7).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (8).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (11).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n				</div>\r\n				<div id=fr_quad >\r\n					<img src=\'./frames/frame (10).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (12).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n				</div>\r\n				\r\n			</div>\r\n			<div id=the_little_x_in_the_top_right onclick=\'closetheframeselectwindow()\'>X</div>\r\n		</div>\r\n	<div id=content_container >\r\n		<div id=fanciest >\r\n			<div class=fancy id=disable_5 >\r\n				<p style=\'text-align:center;\'>Thank you for submitting!</p>\r\n				<input style=\'height:2.5vh;width:5vw;margin-top:32%;margin-left:3.5vw;\' type=button value=\'Return\' onclick=\'location.reload()\' />\r\n			</div>\r\n			<div class=fancy id=disable_4 >\r\n				<div id=f1 >\r\n					<input type=text id=_addnotes placeholder=\'Additional Notes\'>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_2 type=button value=\'Back\' onclick=\'back(2)\'>\r\n					<input id=f2_1_final type=button value=\'Skip\' onclick=\'next(2)\'>\r\n				</div>\r\n			</div>\r\n			<div class=fancy id=disable_3 >\r\n				<div id=f1 >\r\n					<h1>Cart:</h1>\r\n					<div id=cart_area >\r\n						<div class=container_around_selected_frames_in_the_cart_screen id=frame_1 style=\'display:none;\'>\r\n							<img id=saved_frame_1 src=\'\'>\r\n							<div>Qty: \r\n							<select id=quant_1 >\r\n								<option value=\'1\'>1</option>\r\n								<option value=\'2\'>2</option>\r\n								<option value=\'3\'>3</option>\r\n								<option value=\'4\'>4</option>\r\n								<option value=\'5\'>5</option>\r\n								<option value=\'6\'>6</option>\r\n								<option value=\'7\'>7</option>\r\n								<option value=\'8\'>8</option>\r\n								<option value=\'9\'>9</option>\r\n								<option value=\'10\'>10+</option>\r\n							</select></div>\r\n						<br>\r\n							<input id=rmv_q1 type=button value=\'Delete\' onclick=\'removeitemfromcard(1)\'/>\r\n						</div>\r\n						<div><input id=frame_add type=button value=\'Add Frame\' onclick=\'dotheframething()\'/></div>\r\n					</div>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_2 type=button value=\'Back\' onclick=\'back(2)\'>\r\n					<input id=f2_1_final type=button value=\'Skip\' onclick=\'next(2)\'/>\r\n				</div>\r\n			</div>\r\n			<div class=fancy id=disable_2 >\r\n				<div id=f1 >\r\n					<h1>Project Info:</h1>\r\n			<br>	<input class=buTy_0 id=\'_projname\' type=text placeholder=\'project name\'/>\r\n			<br><br><input class=buTy_0 id=\'_postal\' type=postalcode placeholder=\'zip/postal code\'/>\r\n			<br><br><input class=buTy_0 id=\'_neededby\' type=text placeholder=\'frames needed by  (e.g. 01/01/2021)\'/>\r\n			<br><br><form id=project_type >\r\n						<input type=radio name=\'a\' id=\'newmodel\' value=\'NewModel\'/><label for=\'newmodel\'>New Build</label>\r\n						<input type=radio name=\'a\' id=\'TI\' value=\'Newbuild/TI\'/><label for=\'TI\'>Remodel/T.I.</label>\r\n					</form>\r\n						<p style=\'position:relative;left:-25%;top:6%;\'>Roof Material:</p>\r\n					<div class=buTy_2 style=\'left:2%\'>\r\n						<input type=radio name=\'b\' id=\'1_opt_1\' value=\'opt1\'/><label for=\'1_opt_1\'>Steel Deck</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_2\' value=\'opt2\'/><label for=\'1_opt_2\'>Panelized Wood</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_3\' value=\'opt3\'/><label for=\'1_opt_3\'>Concrete</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_4\' value=\'opt4\'/><label for=\'1_opt_4\'>Gypcrete</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_5\' value=\'opt5\'/><input id=\'1_opt_text\' style=\'width:65%\' type=text placeholder=\'Other\'/>\r\n					</div>\r\n						<p style=\'position:relative;right:-25%;top:-2%;\'>Roof Structure:</p>\r\n					<div class=buTy_2 style=\'right:2%;\'>\r\n						<input type=radio name=\'c\' id=\'2_opt_1\' value=\'opt1\'/><label for=\'2_opt_1\'>Steel Joists/Beams</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_2\' value=\'opt2\'/><label for=\'2_opt_2\'>PEMB Purlins</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_3\' value=\'opt3\'/><label for=\'2_opt_3\'>Hybrid</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_4\' value=\'opt4\'/><label for=\'2_opt_4\'>Wood Trusses</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_5\' value=\'opt5\'/><input id=\'2_opt_text\' style=\'width:65%\' type=text placeholder=\'Other\'/>\r\n					</div>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_2 type=button value=\'Back\' onclick=\'back(1)\'>\r\n					<input id=f2_1 type=button value=\'Next\' onclick=\'next(1)\'/>\r\n				</div>\r\n			</div>\r\n			<div class=fancy id=disable_1 >\r\n				<div id=f1 >\r\n					<h1>Customer Info:</h1>\r\n			<br><br><input class=buTy_0 id=_fname type=text required placeholder=\'first name\'/>\r\n			<br><br><input class=buTy_0 id=_lname type=text required placeholder=\'last name\'/>\r\n			<br><br><input class=buTy_0 id=_email type=email required placeholder=\'email\'/>\r\n			<br><br><input class=buTy_0 id=_tel type=tel required placeholder=\'### ###-####\'/>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_1 type=button value=\'Next\' onclick=\'next(0)\'/>\r\n				</div>\r\n			</div>\r\n		</div>\r\n	</div>\r\n-->\r\n\r\n<script>\r\n	var vault={\r\n		fname:\'\',\r\n		lname:\'\',\r\n		email:\'\',\r\n		tel:\'\',\r\n		\r\n		projname:\'\',\r\n		postal:\'\',\r\n		date:\'\',\r\n		TI:\'\',\r\n		OPT1:\'\',\r\n		OPT2:\'\',\r\n		\r\n		jspace:\'\',\r\n		opsize:\'\',\r\n		uweight:\'\',\r\n		utype:\'\',\r\n		\r\n		notes:\'\'\r\n	},\r\n	istherecurrentlyaframebeingconsidered= false;\r\ntry{\r\n	function closetheframeselectwindow(){\r\n		document.getElementById(\'personalize_frame_frame\').style.opacity= \'0\';\r\n		document.getElementById(\'personalize_frame_frame\').style.visibility= \'hidden\';\r\n		\r\n		document.getElementById(\'fanciest\').style.visibility= \'visible\';\r\n		document.getElementById(\'the_void\').style.opacity= \'0\';\r\n		setTimeout(function(){\r\n			//document.getElementById(\'the_void\').style.visibility= \'hidden\';\r\n			document.getElementById(\'all_of_the_frames_you_can_select_from\').style.visibility= \'visible\';\r\n			document.getElementById(\'the_void\').style.display= \'none\';\r\n		},300);\r\n	}\r\n			function opentheframeselectwindow(){\r\n				//document.getElementById(\'the_void\').style.visibility= \'visible\';\r\n				document.getElementById(\'fanciest\').style.visibility= \'hidden\';\r\n				document.getElementById(\'the_void\').style.display= \'grid\';\r\n				document.getElementById(\'the_void\').style.opacity= \'1\';\r\n			}\r\n	\r\n	function dotheframething(){\r\n		opentheframeselectwindow();\r\n		if(!istherecurrentlyaframebeingconsidered){\r\n			istherecurrentlyaframebeingconsidered= true;\r\n			document.getElementById(\'f2_1_final\').value= \'Submit\';\r\n		} else{\r\n			\r\n		}\r\n	}\r\n	function saveframe(){\r\n		vault.jspace= document.getElementById(\'joist_space\').value;\r\n			vault.opsize= document.getElementById(\'opening_size\').value;\r\n			vault.uweight= document.getElementById(\'unit_weight\').value;\r\n			vault.utype= document.querySelector(\'input[name=\"d\"]:checked\').id;\r\n		\r\n		closetheframeselectwindow();\r\n		document.getElementById(\'frame_1\').style.display= \'block\';\r\n			document.getElementById(\'saved_frame_1\').src= \'./frames/frame (\'+(chosen_frame-1)+\').png\';\r\n			document.getElementById(\'saved_frame_1\').style.width= \'62px\';\r\n	}\r\n	\r\n	function back(a){\r\n		if(a==1){\r\n			document.getElementById(\'disable_1\').style.display= \'grid\';\r\n			document.getElementById(\'disable_1\').style.opacity= \'1\';\r\n			document.getElementById(\'disable_2\').style.opacity= \'0\';\r\n			document.getElementById(\'display_2\').style.display= \'none\'\r\n		}else if(a==2){\r\n			document.getElementById(\'disable_2\').style.display= \'grid\';\r\n			document.getElementById(\'disable_2\').style.opacity= \'1\';\r\n			document.getElementById(\'disable_3\').style.opacity= \'0\';\r\n			document.getElementById(\'display_3\').style.display= \'none\'\r\n		}\r\n	}\r\n	function next(a){\r\n		if(a==0){\r\n			vault.fname= document.getElementById(\'_fname\').value;\r\n			vault.lname= document.getElementById(\'_lname\').value;\r\n			vault.email= document.getElementById(\'_email\').value;\r\n			vault.tel= document.getElementById(\'_tel\').value;\r\n			\r\n			document.getElementById(\'disable_1\').style.display= \'none\';\r\n			document.getElementById(\'disable_2\').style.opacity= \'1\';\r\n		}else if(a==1){\r\n			vault.projname= document.getElementById(\'_projname\').value;\r\n			vault.postal= document.getElementById(\'_postal\').value;\r\n			vault.date= document.getElementById(\'_neededby\').value;\r\n			vault.TI= document.querySelector(\'input[name=\"a\"]:checked\').id;\r\n			vault.OPT1= document.querySelector(\'input[name=\"b\"]:checked\').id;\r\n			vault.OPT2= document.querySelector(\'input[name=\"c\"]:checked\').id;\r\n			\r\n			document.getElementById(\'disable_2\').style.display= \'none\';\r\n			document.getElementById(\'disable_3\').style.opacity= \'1\';\r\n			\r\n			console.log(vault);\r\n		}else if(a==2){\r\n			document.getElementById(\'disable_3\').style.display= \'none\';\r\n			document.getElementById(\'disable_4\').style.opacity= \'1\';\r\n		}\r\n	}\r\n} catch(err){console.log(err);}\r\n	\r\n</script>\r\n\r\n\r\n\r\n\r\n<!--<h1>Let QuickFrames do the take-offs and eliminate your need to detail.</h1>\r\n[contact-form-7 id=\"1936\" title=\"New QuickFrames Quote Form\"]\r\n\r\n\r\nFrom: https://wplearninglab.com/contact-form-7-get-value-from-url/\r\n\r\n<script type=\"text/javascript\">\r\nvar getUrlParameter = function getUrlParameter(sParam) {\r\n    var sPageURL = decodeURIComponent(window.location.search.substring(1)),\r\n        sURLVariables = sPageURL.split(\'&\'),\r\n        sParameterName,\r\n        i;\r\n    for (i = 0; i < sURLVariables.length; i++) {\r\n        sParameterName = sURLVariables[i].split(\'=\');\r\n        if (sParameterName[0] === sParam) {\r\n            return sParameterName[1] === undefined ? true : sParameterName[1];\r\n        }\r\n    }\r\n};\r\n\r\nvar VARIABLE = getUrlParameter(\'PARAMETER\');\r\n\r\nif (VARIABLE != null) {\r\n     document.getElementById(\'INPUT-FIELD-ID\').value = VARIABLE;\r\n}\r\n\r\n</script>\r\n\r\n\r\n<a name=\"quote-a-few-frames\"></a>\r\n\r\n[two_fifth]\r\n<h3>Need Just A Few Frames Quoted?</h3>\r\nIf you are working on a project requiring only a few frames and you know the basic requirements for how they will be used, just fill out the form to the right. We\'ll get a quote back to you within 24 hours or less!\r\n\r\nFor each framed opening, using the <a href=\"#frame-types\"> frame type examples </a> shown below, select the frame type number that most closely matches where the opening will be located relative to the joists/beams and enter that into the <strong>Type</strong> column. While RTUs are shown in these images, they apply to all types of roof top equipment. If none of the images match your configuration, enter (0).\r\n\r\n[responsive] <img class=\"alignright\" src=\"/wp-content/uploads/quote-frame-outline.jpg\" alt=\"Frame Outline Image\" width=\"320\" /> [/responsive]\r\n\r\nIf the framing will <strong>only</strong> support the duct openings and not the curbing, enter the letter (<strong><span style=\"color: #37ade1;\">Y</span></strong>) in the <strong>Duct Only</strong> column. If the framing will support the curbing and equipment, enter the letter (<strong><span style=\"color: #37ade1;\">N</span></strong>).\r\n\r\nSpecify the center-to-center joist/beam spacing as shown by (<strong><span style=\"color: #37ade1;\">A</spacing></strong>) in the image to the right.\r\n\r\nWhen specifying the frame opening size (<strong><span style=\"color: #37ade1;\">B</span></strong>), use the length of the opening running <strong>parallel</strong> to (running with) the joists or beams.\r\n\r\n[responsive] <img class=\"alignright\" src=\"/wp-content/uploads/home-install-after-roof.jpg\" alt=\"Install After Roof Image\" width=\"400\"/> [/responsive]\r\n\r\n[/two_fifth]\r\n\r\n[three_fifth_last]\r\n[contact-form-7 id=\"1036\" title=\"Expanded Quote Request Small\"]\r\n[/three_fifth_last]\r\n\r\n<a name=\"frame-types\"></a>\r\n<h2>Frame Type Examples</h2>\r\n[responsive] <img class=\"alignright\" src=\"/wp-content/uploads/quote-frame-configurations.png\" alt=\"Roof Framing Configurations\" /> [/responsive]\r\n\r\n<a name=\"quote-a-lot-of-frames\"></a>\r\n[divider type=\"space\" margintop=\"0\" marginbottom=\"20\"]\r\n\r\n<h2>Have A Large Or Complex Project? Let Us Do The Take-offs For You!</h2>\r\n[divider type=\"space\" margintop=\"0\" marginbottom=\"10\"]\r\n\r\n[one_third]\r\n[responsive] <img src=\"/wp-content/uploads/drawing-image.jpg\" alt=\"Drawing Image\" /> [/responsive]\r\n[/one_third]\r\n\r\n[two_third_last]\r\nThe simplest way for us to provide you with a customized QuickFrames quotation is for you to allow us to do the take-offs directly from the engineering drawing set.\r\n\r\nWe have developed an extensive database of roof top equipment information, such as sizes, weights, opening dimensions, and structural requirements that allows us to select the optimal roof frames for your applications. All you need to do is to provide us with access to your drawing set and then let us go to work for you. You can also have complete confidence that we treat all drawing sets as proprietary information and we respect the importance of confidentiality for anything you share with us.\r\n\r\nThe easiest way for us to access your files is for you to provide us with an FTP address, login and password. Or, if the file set is small enough, you can also email it to us.\r\n\r\n[contact-form-7 id=\"401\" title=\"Quote Request\"]\r\n\r\n[/two_third_last]-->\r\n','Testing Page','','inherit','closed','closed','','777-revision-v1','','','2020-09-08 03:02:10','2020-09-08 10:02:10','',777,'http://quickframes.miritin.com/777-revision-v1/',0,'revision','',0),(1971,1,'2020-09-08 03:02:42','2020-09-08 10:02:42','<h1>Quote Demo:</h1>\r\n\r\n<style>\r\n\r\n  body{\r\n		font-family:Arial;\r\n	}\r\n\r\n	.Frame_Tool_Img{\r\n		cursor:pointer;\r\n		margin:20px;\r\n		border:2px solid transparent;\r\n		transition:border-color 0.1s linear;\r\n	}\r\n		.Frame_Tool_Img:hover{\r\n			border-color:#79c6e8;\r\n		}\r\n	input{\r\n		text-align:center;\r\n	}\r\n	\r\n	#content_container{\r\n		position:relative;\r\n			left:25vw;\r\n		width:50vw;\r\n			height:100%;\r\n	}\r\n	\r\n	#d{display:none;}\r\n	#tupperware_0{\r\n		grid-area:1 / 1;\r\n		height:100%;\r\n			width:100%;\r\n		display:grid;\r\n			grid-auto-flow:dense;\r\n			grid-template-columns: repeat(7, 1fr);\r\n			grid-template-rows: 500px 500px 500px;\r\n	}\r\n	#tupperware_1{\r\n		grid-area:1 / 1;\r\n		display:none;\r\n	}\r\n	\r\n	#tupperware_2{display:none;}\r\n	\r\n	.coolframebutte{\r\n		width:225px;\r\n		height:auto;\r\n	}\r\n	\r\n  /*	----------------	*/\r\n\r\n	#disable_1{\r\n		\r\n	}\r\n	#disable_2,#disable_3,#disable_4{\r\n		opacity:0;\r\n		transition:opacity .25s ease-in-out;\r\n	}\r\n	#disable_4{\r\n		height:7vh;\r\n			width:12vw;\r\n		font-size:2vh;\r\n		top:45vh;\r\n			left:44vw;\r\n	}\r\n/*\r\n	.fancy{\r\n		width:20vw;\r\n			height:50vh;\r\n			border-radius:10px;\r\n		position:absolute;\r\n			left:25%;\r\n			top:25vh;\r\n		background-color:#eee;\r\n		display:grid;\r\n			grid-auto-columns:100%;\r\n			grid-template-rows:85% 15%;\r\n	}\r\n		#f1{\r\n			backround-color:#fff;\r\n			text-align:center;\r\n		}\r\n		#f2{\r\n			background-color:#bbb;\r\n		}\r\n			#f2_2{\r\n				width:25%;\r\n					height:6%;\r\n				position:absolute;\r\n					left:15%;\r\n					top:90%;\r\n			}\r\n			#f2_1,#f2_1_final{\r\n				width:25%;\r\n					height:6%;\r\n				position:absolute;\r\n					right:15%;\r\n					top:90%;\r\n			}\r\n				.buTy_0{\r\n					height:5%;\r\n						width:65%;\r\n				}\r\n				.buTy_1{\r\n					height:5%;\r\n						width:65%;\r\n				}\r\n				.buTy_2{\r\n					position:absolute;\r\n						width:45%;\r\n						height:23%;\r\n						bottom:18%;\r\n					font-size:80%;\r\n					text-align:left;\r\n					background-color:#fff;\r\n						border:solid #767676 1px;\r\n						border-radius:2px;\r\n				}\r\n					#1_opt_text{\r\n						height:1000%;\r\n					}\r\n					\r\n				#project_type{\r\n					position:relative;\r\n						width:65%;\r\n						height:5%;\r\n						left:17.5%;\r\n					font-size:80%;\r\n					background-color:#fff;\r\n						border:solid #767676 1px;\r\n						border-radius:2px;\r\n				}\r\n		\r\n		#cart_area{\r\n			height:65%;\r\n			display:grid;\r\n				grid-template-columns:33% 33% 33%;\r\n				grid-auto-rows:40%;\r\n		}\r\n			.frame_frame_frame{\r\n				\r\n			}\r\n				#frame_add{\r\n					height:24%;\r\n					margin-top:35%;\r\n				}\r\n				.add_frame{\r\n					height:30%;\r\n						width:30%;\r\n					margin-top:25%;\r\n				}\r\n			#_addnotes{\r\n				position:relative;\r\n					width:90%;\r\n					height:10%;\r\n			}\r\n	\r\n	#the_void{\r\n		position:absolute;\r\n			top:0;\r\n			left:0;\r\n			z-index:999;\r\n		background-color:rgba(0,0,0,0.6);\r\n		height:100%;\r\n			width:100%;\r\n		display:none;\r\n			grid-template-rows:5% 5% 85% 5%;\r\n			grid-template-columns:5% 90% 5%;\r\n			grid-template-areas:\'. . .\'\r\n								\'. a_fr a_x\'\r\n								\'. a_fr .\'\r\n								\'. . .\';\r\n		opacity:0;\r\n		transition:opacity 0.3s ease-in-out;\r\n	}\r\n		#all_of_the_frames_you_can_select_from{\r\n			grid-area:a_fr;\r\n		}\r\n			#personalize_frame_frame{\r\n				grid-area:a_fr;\r\n				visibility:hidden;\r\n				opacity:0;\r\n				transition:opacity 0.3s ease-in-out;\r\n			}\r\n		#the_little_x_in_the_top_right{\r\n			grid-area:a_x;\r\n				color:#fff;\r\n				font-size:2.4vmax;\r\n				cursor:pointer;\r\n			transition:color .1s linear;\r\n		}\r\n				#the_little_x_in_the_top_right:hover{\r\n					color:#79c6e8;\r\n				}\r\n			#customizations{\r\n				position:absolute;\r\n					top:20%;\r\n					height:50%;\r\n					weight:50%;\r\n					left:30%;\r\n				padding:20px;\r\n				border-radius:5px;\r\n				text-align:center;\r\n				background-color:rgba(0,0,0,0.2);\r\n			}\r\n				#bottomofframeoptions{\r\n					position:relative;\r\n						width:100%;\r\n						left:-20px;\r\n						bottom:-20px;\r\n					padding:20px;\r\n					background-color:#bbb;\r\n				}\r\n				#joist_space,#opening_size,#unit_weight{\r\n					height:2.5vh;\r\n					border:none;\r\n					border-left:5px solid transparent;\r\n					transition:border-left 0.2s linear;\r\n				}\r\n				#unit_type{\r\n					color:#fff;\r\n					text-align:left;\r\n				}\r\n			#save_unit{\r\n				width:50%;\r\n					height:2.5vh;\r\n			}\r\n			\r\n	#quickgridthing{\r\n		display:grid;\r\n			grid-template-columns:100%;\r\n			grid-template-areas:100%;\r\n	}\r\n		#grandprize__hori,#grandprize__vert{\r\n			animation:flickercolorselect 1s infinite;\r\n			visibility:hidden;\r\n		}\r\n		.blinking_arrow{\r\n			position:absolute;\r\n				left:10px;\r\n			font-size:1.6vh;\r\n			color:red;\r\n			visibility:hidden;\r\n			animation:flickercolorselect 1s infinite;\r\n		}\r\n	@keyframes flickercolorselect{\r\n		0%{opacity:0;}\r\n		50%{opacity:1;}\r\n		100%{opacity:0;}\r\n	}\r\n	\r\n	\r\n	.container_around_selected_frames_in_the_cart_screen{\r\n		\r\n	}\r\n		#rmv_q1{\r\n			color:red;\r\n			border:none;\r\n			background-color:transparent;\r\n			cursor:pointer;\r\n		}\r\n			#rmv_q1:hover{\r\n				text-decoration:underline;\r\n			}\r\n\r\n*/\r\n\r\n</style>\r\n<script>\r\n		var input_last_selected= false;\r\n	function selectoneofthetwoinputspluscolouring(a){\r\n		if(a==\'joist\'){\r\n			if(input_last_selected==\'opening\'){\r\n				//document.getElementById(\'opening_size\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_opening\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__vert\').style.visibility= \'hidden\';\r\n			}\r\n			input_last_selected= \'joist\';\r\n			//document.getElementById(\'joist_space\').style.borderLeftColor= \'red\';\r\n			document.getElementById(\'arrow_for_joist\').style.visibility= \'visible\';\r\n			document.getElementById(\'grandprize__hori\').style.visibility= \'visible\';\r\n		} else if(a==\'opening\'){\r\n			if(input_last_selected==\'joist\'){\r\n				//document.getElementById(\'joist_space\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_joist\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__hori\').style.visibility= \'hidden\';\r\n			}\r\n			input_last_selected= \'opening\';\r\n			//document.getElementById(\'opening_size\').style.borderLeftColor= \'red\';\r\n			document.getElementById(\'arrow_for_opening\').style.visibility= \'visible\';\r\n			document.getElementById(\'grandprize__vert\').style.visibility= \'visible\';\r\n		} else if(!a){\r\n			if(input_last_selected==\'joist\'){\r\n				//document.getElementById(\'joist_space\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_joist\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__hori\').style.visibility= \'hidden\';\r\n			} else if(input_last_selected==\'opening\'){\r\n				//document.getElementById(\'opening_size\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_opening\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__vert\').style.visibility= \'hidden\';\r\n			}\r\n		}\r\n	}\r\n	\r\n		var chosen_frame;\r\n	function choose(a){\r\n			let a6=a.src.length-6,a7=a.src.length-7;\r\n		chosen_frame= parseInt(a.src[a7]!=\'(\'?(a.src[a7]+a.src[a6]):a.src[a6])+1;\r\n		\r\n		//document.getElementById(\'tupperware_0\').style.visibility= \'hidden\';\r\n			//document.getElementById(\'tupperware_1\').style.display= \'block\';\r\n		\r\n		document.getElementById(\'grandprize\').src= \'./frames/dry (\'+(chosen_frame-1)+\').png\';\r\n			setTimeout(function(){document.getElementById(\'grandprize\').style.width= \'375px\';},50);\r\n		\r\n		\r\n		document.getElementById(\'all_of_the_frames_you_can_select_from\').style.visibility= \'hidden\';\r\n		document.getElementById(\'personalize_frame_frame\').style.visibility= \'visible\';\r\n				document.getElementById(\'grandprize__hori\').src= \'./frames/hori (\'+(chosen_frame-1)+\').png\';\r\n				document.getElementById(\'grandprize__vert\').src= \'./frames/vert (\'+(chosen_frame-1)+\').png\';\r\n					setTimeout(function(){\r\n								document.getElementById(\'grandprize__hori\').style.width= \'375px\';\r\n								document.getElementById(\'grandprize__vert\').style.width= \'375px\';\r\n							},50);\r\n			document.getElementById(\'personalize_frame_frame\').style.opacity= \'1\';\r\n		\r\n		if(chosen_frame==3 || chosen_frame==10){\r\n			document.getElementById(\'grandprize__vert\').hidden= true;\r\n			document.getElementById(\'opening_size\').hidden= true;\r\n			document.getElementById(\'arrow_for_opening\').hidden= true;\r\n		} else{\r\n			document.getElementById(\'grandprize__vert\').hidden= false;\r\n			document.getElementById(\'opening_size\').hidden= false;\r\n			document.getElementById(\'arrow_for_opening\').hidden= false;\r\n		}\r\n		\r\n		document.getElementById(\'joist_space\').focus();\r\n		\r\n		\r\n		/*	\r\n		let vHeight= document.getElementById(\'grandprize\').height,\r\n			vWidth= document.getElementById(\'grandprize\').width;\r\n			\r\n		document.getElementById(\'ch_width\').style.left= ((vWidth - document.getElementById(\'ch_width\').style.width)/2)+\'px\';\r\n		*/\r\n	}\r\n	\r\n	function removeitemfromcard(a){\r\n		//add stuff here to remove set image\r\n		document.getElementById(\'frame_\'+a).style.display= \'none\';\r\n	}\r\n	\r\n	\r\n/*\r\n\r\nSUBMIT\r\n- include \'additional notes\' section\r\n- links to plans (URL)\r\n	- OR -\r\n- file upload\r\n- CAPTCHA\r\n\r\n*/\r\n</script>\r\n<!--\r\n		<div id=the_void >\r\n			<div id=personalize_frame_frame >\r\n				<div id=quickgridthing >\r\n					<img class=\'Frame_Tool_Img\' id=grandprize__hori src=\'./blue2.png\' style=\'grid-area:1 / 1;\'>\r\n					<img class=\'Frame_Tool_Img\' id=grandprize__vert src=\'./blue1.png\' style=\'grid-area:1 / 1;\'>\r\n					<img class=\'Frame_Tool_Img\' id=grandprize src=\'\' style=\'grid-area:1 / 1;\'>\r\n				</div>\r\n				<div id=customizations >\r\n				\r\n				<div id=arrow_for_joist class=blinking_arrow >►</div>\r\n				<input id=joist_space type=text placeholder=\'Joist Spacing (in.)\' onfocus=\'selectoneofthetwoinputspluscolouring(\"joist\")\'/>\r\n					\r\n				<br><br>\r\n					<div id=arrow_for_opening class=blinking_arrow >►</div>\r\n				<input id=opening_size type=text placeholder=\'Opening Size (in.)\' onfocus=\'selectoneofthetwoinputspluscolouring(\"opening\")\'/>\r\n					\r\n				<br><br><div id=unit_type onclick=\'selectoneofthetwoinputspluscolouring(false)\'>\r\n						<p style=\'text-align:center;\'>Unit Type:</p>\r\n						<div style=\'\r\n						background-color:#fff;\r\n							border:solid #767676 1px;\r\n							border-radius:2px;\r\n							color:#000;\r\n							font-size:80%;\r\n							padding:5px;\' >\r\n							<input type=radio name=\'d\' id=\'u_opt_1\' value=\'opt1\' onfocus=\'selectoneofthetwoinputspluscolouring(false)\'/><label for=\'u_opt_1\'>RTU/AHU/MAU</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_2\' value=\'opt2\'/><label for=\'u_opt_2\'>EVAP Coolers</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_3\' value=\'opt3\'/><label for=\'u_opt_3\'>Exhaust Fans</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_4\' value=\'opt4\'/><label for=\'u_opt_4\'>Powered Vents</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_5\' value=\'opt5\'/><label for=\'u_opt_5\'>Gravity Vents</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_6\' value=\'opt6\'/><label for=\'u_opt_6\'>Skylights</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_7\' value=\'opt7\'/><label for=\'u_opt_7\'>Roof Drains</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_8\' value=\'opt8\'/><label for=\'u_opt_8\'>Roof Hatch</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_9\' value=\'opt9\'/><label for=\'u_opt_9\'>Floor Openings</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_text\' value=\'opt10\'/><input id=\'u_opt_text\' style=\'width:65%\' type=text placeholder=\'Other\'/>\r\n						</div>\r\n					</div>\r\n					\r\n			<br><br><input id=unit_weight type=text placeholder=\'Unit Weight (lbs.)\' onfocus=\'selectoneofthetwoinputspluscolouring(false)\'/>\r\n					\r\n	<br><br><div id=bottomofframeoptions >\r\n				<input id=save_unit type=button value=\'Add to Cart\' onclick=\'saveframe()\' onfocus=\'selectoneofthetwoinputspluscolouring(false)\'/>\r\n			</div>\r\n				</div>\r\n			</div>\r\n			<div id=all_of_the_frames_you_can_select_from >\r\n				\r\n				<div id=fr_double >\r\n					<img src=\'./frames/frame (0).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (1).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (2).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (5).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (6).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (9).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n				</div>\r\n				<div id=fr_triple >\r\n					<img src=\'./frames/frame (3).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (4).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (7).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (8).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (11).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n				</div>\r\n				<div id=fr_quad >\r\n					<img src=\'./frames/frame (10).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (12).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n				</div>\r\n				\r\n			</div>\r\n			<div id=the_little_x_in_the_top_right onclick=\'closetheframeselectwindow()\'>X</div>\r\n		</div>\r\n	<div id=content_container >\r\n		<div id=fanciest >\r\n			<div class=fancy id=disable_5 >\r\n				<p style=\'text-align:center;\'>Thank you for submitting!</p>\r\n				<input style=\'height:2.5vh;width:5vw;margin-top:32%;margin-left:3.5vw;\' type=button value=\'Return\' onclick=\'location.reload()\' />\r\n			</div>\r\n			<div class=fancy id=disable_4 >\r\n				<div id=f1 >\r\n					<input type=text id=_addnotes placeholder=\'Additional Notes\'>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_2 type=button value=\'Back\' onclick=\'back(2)\'>\r\n					<input id=f2_1_final type=button value=\'Skip\' onclick=\'next(2)\'>\r\n				</div>\r\n			</div>\r\n			<div class=fancy id=disable_3 >\r\n				<div id=f1 >\r\n					<h1>Cart:</h1>\r\n					<div id=cart_area >\r\n						<div class=container_around_selected_frames_in_the_cart_screen id=frame_1 style=\'display:none;\'>\r\n							<img id=saved_frame_1 src=\'\'>\r\n							<div>Qty: \r\n							<select id=quant_1 >\r\n								<option value=\'1\'>1</option>\r\n								<option value=\'2\'>2</option>\r\n								<option value=\'3\'>3</option>\r\n								<option value=\'4\'>4</option>\r\n								<option value=\'5\'>5</option>\r\n								<option value=\'6\'>6</option>\r\n								<option value=\'7\'>7</option>\r\n								<option value=\'8\'>8</option>\r\n								<option value=\'9\'>9</option>\r\n								<option value=\'10\'>10+</option>\r\n							</select></div>\r\n						<br>\r\n							<input id=rmv_q1 type=button value=\'Delete\' onclick=\'removeitemfromcard(1)\'/>\r\n						</div>\r\n						<div><input id=frame_add type=button value=\'Add Frame\' onclick=\'dotheframething()\'/></div>\r\n					</div>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_2 type=button value=\'Back\' onclick=\'back(2)\'>\r\n					<input id=f2_1_final type=button value=\'Skip\' onclick=\'next(2)\'/>\r\n				</div>\r\n			</div>\r\n			<div class=fancy id=disable_2 >\r\n				<div id=f1 >\r\n					<h1>Project Info:</h1>\r\n			<br>	<input class=buTy_0 id=\'_projname\' type=text placeholder=\'project name\'/>\r\n			<br><br><input class=buTy_0 id=\'_postal\' type=postalcode placeholder=\'zip/postal code\'/>\r\n			<br><br><input class=buTy_0 id=\'_neededby\' type=text placeholder=\'frames needed by  (e.g. 01/01/2021)\'/>\r\n			<br><br><form id=project_type >\r\n						<input type=radio name=\'a\' id=\'newmodel\' value=\'NewModel\'/><label for=\'newmodel\'>New Build</label>\r\n						<input type=radio name=\'a\' id=\'TI\' value=\'Newbuild/TI\'/><label for=\'TI\'>Remodel/T.I.</label>\r\n					</form>\r\n						<p style=\'position:relative;left:-25%;top:6%;\'>Roof Material:</p>\r\n					<div class=buTy_2 style=\'left:2%\'>\r\n						<input type=radio name=\'b\' id=\'1_opt_1\' value=\'opt1\'/><label for=\'1_opt_1\'>Steel Deck</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_2\' value=\'opt2\'/><label for=\'1_opt_2\'>Panelized Wood</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_3\' value=\'opt3\'/><label for=\'1_opt_3\'>Concrete</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_4\' value=\'opt4\'/><label for=\'1_opt_4\'>Gypcrete</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_5\' value=\'opt5\'/><input id=\'1_opt_text\' style=\'width:65%\' type=text placeholder=\'Other\'/>\r\n					</div>\r\n						<p style=\'position:relative;right:-25%;top:-2%;\'>Roof Structure:</p>\r\n					<div class=buTy_2 style=\'right:2%;\'>\r\n						<input type=radio name=\'c\' id=\'2_opt_1\' value=\'opt1\'/><label for=\'2_opt_1\'>Steel Joists/Beams</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_2\' value=\'opt2\'/><label for=\'2_opt_2\'>PEMB Purlins</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_3\' value=\'opt3\'/><label for=\'2_opt_3\'>Hybrid</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_4\' value=\'opt4\'/><label for=\'2_opt_4\'>Wood Trusses</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_5\' value=\'opt5\'/><input id=\'2_opt_text\' style=\'width:65%\' type=text placeholder=\'Other\'/>\r\n					</div>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_2 type=button value=\'Back\' onclick=\'back(1)\'>\r\n					<input id=f2_1 type=button value=\'Next\' onclick=\'next(1)\'/>\r\n				</div>\r\n			</div>\r\n			<div class=fancy id=disable_1 >\r\n				<div id=f1 >\r\n					<h1>Customer Info:</h1>\r\n			<br><br><input class=buTy_0 id=_fname type=text required placeholder=\'first name\'/>\r\n			<br><br><input class=buTy_0 id=_lname type=text required placeholder=\'last name\'/>\r\n			<br><br><input class=buTy_0 id=_email type=email required placeholder=\'email\'/>\r\n			<br><br><input class=buTy_0 id=_tel type=tel required placeholder=\'### ###-####\'/>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_1 type=button value=\'Next\' onclick=\'next(0)\'/>\r\n				</div>\r\n			</div>\r\n		</div>\r\n	</div>\r\n-->\r\n\r\n<script>\r\n	var vault={\r\n		fname:\'\',\r\n		lname:\'\',\r\n		email:\'\',\r\n		tel:\'\',\r\n		\r\n		projname:\'\',\r\n		postal:\'\',\r\n		date:\'\',\r\n		TI:\'\',\r\n		OPT1:\'\',\r\n		OPT2:\'\',\r\n		\r\n		jspace:\'\',\r\n		opsize:\'\',\r\n		uweight:\'\',\r\n		utype:\'\',\r\n		\r\n		notes:\'\'\r\n	},\r\n	istherecurrentlyaframebeingconsidered= false;\r\ntry{\r\n	function closetheframeselectwindow(){\r\n		document.getElementById(\'personalize_frame_frame\').style.opacity= \'0\';\r\n		document.getElementById(\'personalize_frame_frame\').style.visibility= \'hidden\';\r\n		\r\n		document.getElementById(\'fanciest\').style.visibility= \'visible\';\r\n		document.getElementById(\'the_void\').style.opacity= \'0\';\r\n		setTimeout(function(){\r\n			//document.getElementById(\'the_void\').style.visibility= \'hidden\';\r\n			document.getElementById(\'all_of_the_frames_you_can_select_from\').style.visibility= \'visible\';\r\n			document.getElementById(\'the_void\').style.display= \'none\';\r\n		},300);\r\n	}\r\n			function opentheframeselectwindow(){\r\n				//document.getElementById(\'the_void\').style.visibility= \'visible\';\r\n				document.getElementById(\'fanciest\').style.visibility= \'hidden\';\r\n				document.getElementById(\'the_void\').style.display= \'grid\';\r\n				document.getElementById(\'the_void\').style.opacity= \'1\';\r\n			}\r\n	\r\n	function dotheframething(){\r\n		opentheframeselectwindow();\r\n		if(!istherecurrentlyaframebeingconsidered){\r\n			istherecurrentlyaframebeingconsidered= true;\r\n			document.getElementById(\'f2_1_final\').value= \'Submit\';\r\n		} else{\r\n			\r\n		}\r\n	}\r\n	function saveframe(){\r\n		vault.jspace= document.getElementById(\'joist_space\').value;\r\n			vault.opsize= document.getElementById(\'opening_size\').value;\r\n			vault.uweight= document.getElementById(\'unit_weight\').value;\r\n			vault.utype= document.querySelector(\'input[name=\"d\"]:checked\').id;\r\n		\r\n		closetheframeselectwindow();\r\n		document.getElementById(\'frame_1\').style.display= \'block\';\r\n			document.getElementById(\'saved_frame_1\').src= \'./frames/frame (\'+(chosen_frame-1)+\').png\';\r\n			document.getElementById(\'saved_frame_1\').style.width= \'62px\';\r\n	}\r\n	\r\n	function back(a){\r\n		if(a==1){\r\n			document.getElementById(\'disable_1\').style.display= \'grid\';\r\n			document.getElementById(\'disable_1\').style.opacity= \'1\';\r\n			document.getElementById(\'disable_2\').style.opacity= \'0\';\r\n			document.getElementById(\'display_2\').style.display= \'none\'\r\n		}else if(a==2){\r\n			document.getElementById(\'disable_2\').style.display= \'grid\';\r\n			document.getElementById(\'disable_2\').style.opacity= \'1\';\r\n			document.getElementById(\'disable_3\').style.opacity= \'0\';\r\n			document.getElementById(\'display_3\').style.display= \'none\'\r\n		}\r\n	}\r\n	function next(a){\r\n		if(a==0){\r\n			vault.fname= document.getElementById(\'_fname\').value;\r\n			vault.lname= document.getElementById(\'_lname\').value;\r\n			vault.email= document.getElementById(\'_email\').value;\r\n			vault.tel= document.getElementById(\'_tel\').value;\r\n			\r\n			document.getElementById(\'disable_1\').style.display= \'none\';\r\n			document.getElementById(\'disable_2\').style.opacity= \'1\';\r\n		}else if(a==1){\r\n			vault.projname= document.getElementById(\'_projname\').value;\r\n			vault.postal= document.getElementById(\'_postal\').value;\r\n			vault.date= document.getElementById(\'_neededby\').value;\r\n			vault.TI= document.querySelector(\'input[name=\"a\"]:checked\').id;\r\n			vault.OPT1= document.querySelector(\'input[name=\"b\"]:checked\').id;\r\n			vault.OPT2= document.querySelector(\'input[name=\"c\"]:checked\').id;\r\n			\r\n			document.getElementById(\'disable_2\').style.display= \'none\';\r\n			document.getElementById(\'disable_3\').style.opacity= \'1\';\r\n			\r\n			console.log(vault);\r\n		}else if(a==2){\r\n			document.getElementById(\'disable_3\').style.display= \'none\';\r\n			document.getElementById(\'disable_4\').style.opacity= \'1\';\r\n		}\r\n	}\r\n} catch(err){console.log(err);}\r\n	\r\n</script>\r\n\r\n\r\n\r\n\r\n<!--<h1>Let QuickFrames do the take-offs and eliminate your need to detail.</h1>\r\n[contact-form-7 id=\"1936\" title=\"New QuickFrames Quote Form\"]\r\n\r\n\r\nFrom: https://wplearninglab.com/contact-form-7-get-value-from-url/\r\n\r\n<script type=\"text/javascript\">\r\nvar getUrlParameter = function getUrlParameter(sParam) {\r\n    var sPageURL = decodeURIComponent(window.location.search.substring(1)),\r\n        sURLVariables = sPageURL.split(\'&\'),\r\n        sParameterName,\r\n        i;\r\n    for (i = 0; i < sURLVariables.length; i++) {\r\n        sParameterName = sURLVariables[i].split(\'=\');\r\n        if (sParameterName[0] === sParam) {\r\n            return sParameterName[1] === undefined ? true : sParameterName[1];\r\n        }\r\n    }\r\n};\r\n\r\nvar VARIABLE = getUrlParameter(\'PARAMETER\');\r\n\r\nif (VARIABLE != null) {\r\n     document.getElementById(\'INPUT-FIELD-ID\').value = VARIABLE;\r\n}\r\n\r\n</script>\r\n\r\n\r\n<a name=\"quote-a-few-frames\"></a>\r\n\r\n[two_fifth]\r\n<h3>Need Just A Few Frames Quoted?</h3>\r\nIf you are working on a project requiring only a few frames and you know the basic requirements for how they will be used, just fill out the form to the right. We\'ll get a quote back to you within 24 hours or less!\r\n\r\nFor each framed opening, using the <a href=\"#frame-types\"> frame type examples </a> shown below, select the frame type number that most closely matches where the opening will be located relative to the joists/beams and enter that into the <strong>Type</strong> column. While RTUs are shown in these images, they apply to all types of roof top equipment. If none of the images match your configuration, enter (0).\r\n\r\n[responsive] <img class=\"alignright\" src=\"/wp-content/uploads/quote-frame-outline.jpg\" alt=\"Frame Outline Image\" width=\"320\" /> [/responsive]\r\n\r\nIf the framing will <strong>only</strong> support the duct openings and not the curbing, enter the letter (<strong><span style=\"color: #37ade1;\">Y</span></strong>) in the <strong>Duct Only</strong> column. If the framing will support the curbing and equipment, enter the letter (<strong><span style=\"color: #37ade1;\">N</span></strong>).\r\n\r\nSpecify the center-to-center joist/beam spacing as shown by (<strong><span style=\"color: #37ade1;\">A</spacing></strong>) in the image to the right.\r\n\r\nWhen specifying the frame opening size (<strong><span style=\"color: #37ade1;\">B</span></strong>), use the length of the opening running <strong>parallel</strong> to (running with) the joists or beams.\r\n\r\n[responsive] <img class=\"alignright\" src=\"/wp-content/uploads/home-install-after-roof.jpg\" alt=\"Install After Roof Image\" width=\"400\"/> [/responsive]\r\n\r\n[/two_fifth]\r\n\r\n[three_fifth_last]\r\n[contact-form-7 id=\"1036\" title=\"Expanded Quote Request Small\"]\r\n[/three_fifth_last]\r\n\r\n<a name=\"frame-types\"></a>\r\n<h2>Frame Type Examples</h2>\r\n[responsive] <img class=\"alignright\" src=\"/wp-content/uploads/quote-frame-configurations.png\" alt=\"Roof Framing Configurations\" /> [/responsive]\r\n\r\n<a name=\"quote-a-lot-of-frames\"></a>\r\n[divider type=\"space\" margintop=\"0\" marginbottom=\"20\"]\r\n\r\n<h2>Have A Large Or Complex Project? Let Us Do The Take-offs For You!</h2>\r\n[divider type=\"space\" margintop=\"0\" marginbottom=\"10\"]\r\n\r\n[one_third]\r\n[responsive] <img src=\"/wp-content/uploads/drawing-image.jpg\" alt=\"Drawing Image\" /> [/responsive]\r\n[/one_third]\r\n\r\n[two_third_last]\r\nThe simplest way for us to provide you with a customized QuickFrames quotation is for you to allow us to do the take-offs directly from the engineering drawing set.\r\n\r\nWe have developed an extensive database of roof top equipment information, such as sizes, weights, opening dimensions, and structural requirements that allows us to select the optimal roof frames for your applications. All you need to do is to provide us with access to your drawing set and then let us go to work for you. You can also have complete confidence that we treat all drawing sets as proprietary information and we respect the importance of confidentiality for anything you share with us.\r\n\r\nThe easiest way for us to access your files is for you to provide us with an FTP address, login and password. Or, if the file set is small enough, you can also email it to us.\r\n\r\n[contact-form-7 id=\"401\" title=\"Quote Request\"]\r\n\r\n[/two_third_last]-->\r\n','Testing Page','','inherit','closed','closed','','777-revision-v1','','','2020-09-08 03:02:42','2020-09-08 10:02:42','',777,'http://quickframes.miritin.com/777-revision-v1/',0,'revision','',0),(1972,1,'2020-09-08 03:03:17','2020-09-08 10:03:17','<h1>Quote Demo:</h1>\r\n\r\n<style>\r\n\r\n  body{\r\n		font-family:Arial;\r\n	}\r\n\r\n	.Frame_Tool_Img{\r\n		cursor:pointer;\r\n		margin:20px;\r\n		border:2px solid transparent;\r\n		transition:border-color 0.1s linear;\r\n	}\r\n		.Frame_Tool_Img:hover{\r\n			border-color:#79c6e8;\r\n		}\r\n	input{\r\n		text-align:center;\r\n	}\r\n	\r\n	#content_container{\r\n		position:relative;\r\n			left:25vw;\r\n		width:50vw;\r\n			height:100%;\r\n	}\r\n	\r\n	#d{display:none;}\r\n	#tupperware_0{\r\n		grid-area:1 / 1;\r\n		height:100%;\r\n			width:100%;\r\n		display:grid;\r\n			grid-auto-flow:dense;\r\n			grid-template-columns: repeat(7, 1fr);\r\n			grid-template-rows: 500px 500px 500px;\r\n	}\r\n	#tupperware_1{\r\n		grid-area:1 / 1;\r\n		display:none;\r\n	}\r\n	\r\n	#tupperware_2{display:none;}\r\n	\r\n	.coolframebutte{\r\n		width:225px;\r\n		height:auto;\r\n	}\r\n	\r\n\r\n\r\n	#disable_1{\r\n		\r\n	}\r\n	#disable_2,#disable_3,#disable_4{\r\n		opacity:0;\r\n		transition:opacity .25s ease-in-out;\r\n	}\r\n	#disable_4{\r\n		height:7vh;\r\n			width:12vw;\r\n		font-size:2vh;\r\n		top:45vh;\r\n			left:44vw;\r\n	}\r\n  /*	----------------	*/\r\n	.fancy{\r\n		width:20vw;\r\n			height:50vh;\r\n			border-radius:10px;\r\n		position:absolute;\r\n			left:25%;\r\n			top:25vh;\r\n		background-color:#eee;\r\n		display:grid;\r\n			grid-auto-columns:100%;\r\n			grid-template-rows:85% 15%;\r\n	}\r\n		#f1{\r\n			backround-color:#fff;\r\n			text-align:center;\r\n		}\r\n		#f2{\r\n			background-color:#bbb;\r\n		}\r\n			#f2_2{\r\n				width:25%;\r\n					height:6%;\r\n				position:absolute;\r\n					left:15%;\r\n					top:90%;\r\n			}\r\n			#f2_1,#f2_1_final{\r\n				width:25%;\r\n					height:6%;\r\n				position:absolute;\r\n					right:15%;\r\n					top:90%;\r\n			}\r\n				.buTy_0{\r\n					height:5%;\r\n						width:65%;\r\n				}\r\n				.buTy_1{\r\n					height:5%;\r\n						width:65%;\r\n				}\r\n				.buTy_2{\r\n					position:absolute;\r\n						width:45%;\r\n						height:23%;\r\n						bottom:18%;\r\n					font-size:80%;\r\n					text-align:left;\r\n					background-color:#fff;\r\n						border:solid #767676 1px;\r\n						border-radius:2px;\r\n				}\r\n					#1_opt_text{\r\n						height:1000%;\r\n					}\r\n					\r\n				#project_type{\r\n					position:relative;\r\n						width:65%;\r\n						height:5%;\r\n						left:17.5%;\r\n					font-size:80%;\r\n					background-color:#fff;\r\n						border:solid #767676 1px;\r\n						border-radius:2px;\r\n				}\r\n		/*\r\n		#cart_area{\r\n			height:65%;\r\n			display:grid;\r\n				grid-template-columns:33% 33% 33%;\r\n				grid-auto-rows:40%;\r\n		}\r\n			.frame_frame_frame{\r\n				\r\n			}\r\n				#frame_add{\r\n					height:24%;\r\n					margin-top:35%;\r\n				}\r\n				.add_frame{\r\n					height:30%;\r\n						width:30%;\r\n					margin-top:25%;\r\n				}\r\n			#_addnotes{\r\n				position:relative;\r\n					width:90%;\r\n					height:10%;\r\n			}\r\n	\r\n	#the_void{\r\n		position:absolute;\r\n			top:0;\r\n			left:0;\r\n			z-index:999;\r\n		background-color:rgba(0,0,0,0.6);\r\n		height:100%;\r\n			width:100%;\r\n		display:none;\r\n			grid-template-rows:5% 5% 85% 5%;\r\n			grid-template-columns:5% 90% 5%;\r\n			grid-template-areas:\'. . .\'\r\n								\'. a_fr a_x\'\r\n								\'. a_fr .\'\r\n								\'. . .\';\r\n		opacity:0;\r\n		transition:opacity 0.3s ease-in-out;\r\n	}\r\n		#all_of_the_frames_you_can_select_from{\r\n			grid-area:a_fr;\r\n		}\r\n			#personalize_frame_frame{\r\n				grid-area:a_fr;\r\n				visibility:hidden;\r\n				opacity:0;\r\n				transition:opacity 0.3s ease-in-out;\r\n			}\r\n		#the_little_x_in_the_top_right{\r\n			grid-area:a_x;\r\n				color:#fff;\r\n				font-size:2.4vmax;\r\n				cursor:pointer;\r\n			transition:color .1s linear;\r\n		}\r\n				#the_little_x_in_the_top_right:hover{\r\n					color:#79c6e8;\r\n				}\r\n			#customizations{\r\n				position:absolute;\r\n					top:20%;\r\n					height:50%;\r\n					weight:50%;\r\n					left:30%;\r\n				padding:20px;\r\n				border-radius:5px;\r\n				text-align:center;\r\n				background-color:rgba(0,0,0,0.2);\r\n			}\r\n				#bottomofframeoptions{\r\n					position:relative;\r\n						width:100%;\r\n						left:-20px;\r\n						bottom:-20px;\r\n					padding:20px;\r\n					background-color:#bbb;\r\n				}\r\n				#joist_space,#opening_size,#unit_weight{\r\n					height:2.5vh;\r\n					border:none;\r\n					border-left:5px solid transparent;\r\n					transition:border-left 0.2s linear;\r\n				}\r\n				#unit_type{\r\n					color:#fff;\r\n					text-align:left;\r\n				}\r\n			#save_unit{\r\n				width:50%;\r\n					height:2.5vh;\r\n			}\r\n			\r\n	#quickgridthing{\r\n		display:grid;\r\n			grid-template-columns:100%;\r\n			grid-template-areas:100%;\r\n	}\r\n		#grandprize__hori,#grandprize__vert{\r\n			animation:flickercolorselect 1s infinite;\r\n			visibility:hidden;\r\n		}\r\n		.blinking_arrow{\r\n			position:absolute;\r\n				left:10px;\r\n			font-size:1.6vh;\r\n			color:red;\r\n			visibility:hidden;\r\n			animation:flickercolorselect 1s infinite;\r\n		}\r\n	@keyframes flickercolorselect{\r\n		0%{opacity:0;}\r\n		50%{opacity:1;}\r\n		100%{opacity:0;}\r\n	}\r\n	\r\n	\r\n	.container_around_selected_frames_in_the_cart_screen{\r\n		\r\n	}\r\n		#rmv_q1{\r\n			color:red;\r\n			border:none;\r\n			background-color:transparent;\r\n			cursor:pointer;\r\n		}\r\n			#rmv_q1:hover{\r\n				text-decoration:underline;\r\n			}\r\n\r\n*/\r\n\r\n</style>\r\n<script>\r\n		var input_last_selected= false;\r\n	function selectoneofthetwoinputspluscolouring(a){\r\n		if(a==\'joist\'){\r\n			if(input_last_selected==\'opening\'){\r\n				//document.getElementById(\'opening_size\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_opening\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__vert\').style.visibility= \'hidden\';\r\n			}\r\n			input_last_selected= \'joist\';\r\n			//document.getElementById(\'joist_space\').style.borderLeftColor= \'red\';\r\n			document.getElementById(\'arrow_for_joist\').style.visibility= \'visible\';\r\n			document.getElementById(\'grandprize__hori\').style.visibility= \'visible\';\r\n		} else if(a==\'opening\'){\r\n			if(input_last_selected==\'joist\'){\r\n				//document.getElementById(\'joist_space\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_joist\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__hori\').style.visibility= \'hidden\';\r\n			}\r\n			input_last_selected= \'opening\';\r\n			//document.getElementById(\'opening_size\').style.borderLeftColor= \'red\';\r\n			document.getElementById(\'arrow_for_opening\').style.visibility= \'visible\';\r\n			document.getElementById(\'grandprize__vert\').style.visibility= \'visible\';\r\n		} else if(!a){\r\n			if(input_last_selected==\'joist\'){\r\n				//document.getElementById(\'joist_space\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_joist\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__hori\').style.visibility= \'hidden\';\r\n			} else if(input_last_selected==\'opening\'){\r\n				//document.getElementById(\'opening_size\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_opening\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__vert\').style.visibility= \'hidden\';\r\n			}\r\n		}\r\n	}\r\n	\r\n		var chosen_frame;\r\n	function choose(a){\r\n			let a6=a.src.length-6,a7=a.src.length-7;\r\n		chosen_frame= parseInt(a.src[a7]!=\'(\'?(a.src[a7]+a.src[a6]):a.src[a6])+1;\r\n		\r\n		//document.getElementById(\'tupperware_0\').style.visibility= \'hidden\';\r\n			//document.getElementById(\'tupperware_1\').style.display= \'block\';\r\n		\r\n		document.getElementById(\'grandprize\').src= \'./frames/dry (\'+(chosen_frame-1)+\').png\';\r\n			setTimeout(function(){document.getElementById(\'grandprize\').style.width= \'375px\';},50);\r\n		\r\n		\r\n		document.getElementById(\'all_of_the_frames_you_can_select_from\').style.visibility= \'hidden\';\r\n		document.getElementById(\'personalize_frame_frame\').style.visibility= \'visible\';\r\n				document.getElementById(\'grandprize__hori\').src= \'./frames/hori (\'+(chosen_frame-1)+\').png\';\r\n				document.getElementById(\'grandprize__vert\').src= \'./frames/vert (\'+(chosen_frame-1)+\').png\';\r\n					setTimeout(function(){\r\n								document.getElementById(\'grandprize__hori\').style.width= \'375px\';\r\n								document.getElementById(\'grandprize__vert\').style.width= \'375px\';\r\n							},50);\r\n			document.getElementById(\'personalize_frame_frame\').style.opacity= \'1\';\r\n		\r\n		if(chosen_frame==3 || chosen_frame==10){\r\n			document.getElementById(\'grandprize__vert\').hidden= true;\r\n			document.getElementById(\'opening_size\').hidden= true;\r\n			document.getElementById(\'arrow_for_opening\').hidden= true;\r\n		} else{\r\n			document.getElementById(\'grandprize__vert\').hidden= false;\r\n			document.getElementById(\'opening_size\').hidden= false;\r\n			document.getElementById(\'arrow_for_opening\').hidden= false;\r\n		}\r\n		\r\n		document.getElementById(\'joist_space\').focus();\r\n		\r\n		\r\n		/*	\r\n		let vHeight= document.getElementById(\'grandprize\').height,\r\n			vWidth= document.getElementById(\'grandprize\').width;\r\n			\r\n		document.getElementById(\'ch_width\').style.left= ((vWidth - document.getElementById(\'ch_width\').style.width)/2)+\'px\';\r\n		*/\r\n	}\r\n	\r\n	function removeitemfromcard(a){\r\n		//add stuff here to remove set image\r\n		document.getElementById(\'frame_\'+a).style.display= \'none\';\r\n	}\r\n	\r\n	\r\n/*\r\n\r\nSUBMIT\r\n- include \'additional notes\' section\r\n- links to plans (URL)\r\n	- OR -\r\n- file upload\r\n- CAPTCHA\r\n\r\n*/\r\n</script>\r\n<!--\r\n		<div id=the_void >\r\n			<div id=personalize_frame_frame >\r\n				<div id=quickgridthing >\r\n					<img class=\'Frame_Tool_Img\' id=grandprize__hori src=\'./blue2.png\' style=\'grid-area:1 / 1;\'>\r\n					<img class=\'Frame_Tool_Img\' id=grandprize__vert src=\'./blue1.png\' style=\'grid-area:1 / 1;\'>\r\n					<img class=\'Frame_Tool_Img\' id=grandprize src=\'\' style=\'grid-area:1 / 1;\'>\r\n				</div>\r\n				<div id=customizations >\r\n				\r\n				<div id=arrow_for_joist class=blinking_arrow >►</div>\r\n				<input id=joist_space type=text placeholder=\'Joist Spacing (in.)\' onfocus=\'selectoneofthetwoinputspluscolouring(\"joist\")\'/>\r\n					\r\n				<br><br>\r\n					<div id=arrow_for_opening class=blinking_arrow >►</div>\r\n				<input id=opening_size type=text placeholder=\'Opening Size (in.)\' onfocus=\'selectoneofthetwoinputspluscolouring(\"opening\")\'/>\r\n					\r\n				<br><br><div id=unit_type onclick=\'selectoneofthetwoinputspluscolouring(false)\'>\r\n						<p style=\'text-align:center;\'>Unit Type:</p>\r\n						<div style=\'\r\n						background-color:#fff;\r\n							border:solid #767676 1px;\r\n							border-radius:2px;\r\n							color:#000;\r\n							font-size:80%;\r\n							padding:5px;\' >\r\n							<input type=radio name=\'d\' id=\'u_opt_1\' value=\'opt1\' onfocus=\'selectoneofthetwoinputspluscolouring(false)\'/><label for=\'u_opt_1\'>RTU/AHU/MAU</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_2\' value=\'opt2\'/><label for=\'u_opt_2\'>EVAP Coolers</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_3\' value=\'opt3\'/><label for=\'u_opt_3\'>Exhaust Fans</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_4\' value=\'opt4\'/><label for=\'u_opt_4\'>Powered Vents</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_5\' value=\'opt5\'/><label for=\'u_opt_5\'>Gravity Vents</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_6\' value=\'opt6\'/><label for=\'u_opt_6\'>Skylights</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_7\' value=\'opt7\'/><label for=\'u_opt_7\'>Roof Drains</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_8\' value=\'opt8\'/><label for=\'u_opt_8\'>Roof Hatch</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_9\' value=\'opt9\'/><label for=\'u_opt_9\'>Floor Openings</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_text\' value=\'opt10\'/><input id=\'u_opt_text\' style=\'width:65%\' type=text placeholder=\'Other\'/>\r\n						</div>\r\n					</div>\r\n					\r\n			<br><br><input id=unit_weight type=text placeholder=\'Unit Weight (lbs.)\' onfocus=\'selectoneofthetwoinputspluscolouring(false)\'/>\r\n					\r\n	<br><br><div id=bottomofframeoptions >\r\n				<input id=save_unit type=button value=\'Add to Cart\' onclick=\'saveframe()\' onfocus=\'selectoneofthetwoinputspluscolouring(false)\'/>\r\n			</div>\r\n				</div>\r\n			</div>\r\n			<div id=all_of_the_frames_you_can_select_from >\r\n				\r\n				<div id=fr_double >\r\n					<img src=\'./frames/frame (0).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (1).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (2).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (5).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (6).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (9).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n				</div>\r\n				<div id=fr_triple >\r\n					<img src=\'./frames/frame (3).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (4).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (7).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (8).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (11).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n				</div>\r\n				<div id=fr_quad >\r\n					<img src=\'./frames/frame (10).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (12).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n				</div>\r\n				\r\n			</div>\r\n			<div id=the_little_x_in_the_top_right onclick=\'closetheframeselectwindow()\'>X</div>\r\n		</div>\r\n	<div id=content_container >\r\n		<div id=fanciest >\r\n			<div class=fancy id=disable_5 >\r\n				<p style=\'text-align:center;\'>Thank you for submitting!</p>\r\n				<input style=\'height:2.5vh;width:5vw;margin-top:32%;margin-left:3.5vw;\' type=button value=\'Return\' onclick=\'location.reload()\' />\r\n			</div>\r\n			<div class=fancy id=disable_4 >\r\n				<div id=f1 >\r\n					<input type=text id=_addnotes placeholder=\'Additional Notes\'>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_2 type=button value=\'Back\' onclick=\'back(2)\'>\r\n					<input id=f2_1_final type=button value=\'Skip\' onclick=\'next(2)\'>\r\n				</div>\r\n			</div>\r\n			<div class=fancy id=disable_3 >\r\n				<div id=f1 >\r\n					<h1>Cart:</h1>\r\n					<div id=cart_area >\r\n						<div class=container_around_selected_frames_in_the_cart_screen id=frame_1 style=\'display:none;\'>\r\n							<img id=saved_frame_1 src=\'\'>\r\n							<div>Qty: \r\n							<select id=quant_1 >\r\n								<option value=\'1\'>1</option>\r\n								<option value=\'2\'>2</option>\r\n								<option value=\'3\'>3</option>\r\n								<option value=\'4\'>4</option>\r\n								<option value=\'5\'>5</option>\r\n								<option value=\'6\'>6</option>\r\n								<option value=\'7\'>7</option>\r\n								<option value=\'8\'>8</option>\r\n								<option value=\'9\'>9</option>\r\n								<option value=\'10\'>10+</option>\r\n							</select></div>\r\n						<br>\r\n							<input id=rmv_q1 type=button value=\'Delete\' onclick=\'removeitemfromcard(1)\'/>\r\n						</div>\r\n						<div><input id=frame_add type=button value=\'Add Frame\' onclick=\'dotheframething()\'/></div>\r\n					</div>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_2 type=button value=\'Back\' onclick=\'back(2)\'>\r\n					<input id=f2_1_final type=button value=\'Skip\' onclick=\'next(2)\'/>\r\n				</div>\r\n			</div>\r\n			<div class=fancy id=disable_2 >\r\n				<div id=f1 >\r\n					<h1>Project Info:</h1>\r\n			<br>	<input class=buTy_0 id=\'_projname\' type=text placeholder=\'project name\'/>\r\n			<br><br><input class=buTy_0 id=\'_postal\' type=postalcode placeholder=\'zip/postal code\'/>\r\n			<br><br><input class=buTy_0 id=\'_neededby\' type=text placeholder=\'frames needed by  (e.g. 01/01/2021)\'/>\r\n			<br><br><form id=project_type >\r\n						<input type=radio name=\'a\' id=\'newmodel\' value=\'NewModel\'/><label for=\'newmodel\'>New Build</label>\r\n						<input type=radio name=\'a\' id=\'TI\' value=\'Newbuild/TI\'/><label for=\'TI\'>Remodel/T.I.</label>\r\n					</form>\r\n						<p style=\'position:relative;left:-25%;top:6%;\'>Roof Material:</p>\r\n					<div class=buTy_2 style=\'left:2%\'>\r\n						<input type=radio name=\'b\' id=\'1_opt_1\' value=\'opt1\'/><label for=\'1_opt_1\'>Steel Deck</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_2\' value=\'opt2\'/><label for=\'1_opt_2\'>Panelized Wood</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_3\' value=\'opt3\'/><label for=\'1_opt_3\'>Concrete</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_4\' value=\'opt4\'/><label for=\'1_opt_4\'>Gypcrete</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_5\' value=\'opt5\'/><input id=\'1_opt_text\' style=\'width:65%\' type=text placeholder=\'Other\'/>\r\n					</div>\r\n						<p style=\'position:relative;right:-25%;top:-2%;\'>Roof Structure:</p>\r\n					<div class=buTy_2 style=\'right:2%;\'>\r\n						<input type=radio name=\'c\' id=\'2_opt_1\' value=\'opt1\'/><label for=\'2_opt_1\'>Steel Joists/Beams</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_2\' value=\'opt2\'/><label for=\'2_opt_2\'>PEMB Purlins</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_3\' value=\'opt3\'/><label for=\'2_opt_3\'>Hybrid</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_4\' value=\'opt4\'/><label for=\'2_opt_4\'>Wood Trusses</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_5\' value=\'opt5\'/><input id=\'2_opt_text\' style=\'width:65%\' type=text placeholder=\'Other\'/>\r\n					</div>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_2 type=button value=\'Back\' onclick=\'back(1)\'>\r\n					<input id=f2_1 type=button value=\'Next\' onclick=\'next(1)\'/>\r\n				</div>\r\n			</div>\r\n			<div class=fancy id=disable_1 >\r\n				<div id=f1 >\r\n					<h1>Customer Info:</h1>\r\n			<br><br><input class=buTy_0 id=_fname type=text required placeholder=\'first name\'/>\r\n			<br><br><input class=buTy_0 id=_lname type=text required placeholder=\'last name\'/>\r\n			<br><br><input class=buTy_0 id=_email type=email required placeholder=\'email\'/>\r\n			<br><br><input class=buTy_0 id=_tel type=tel required placeholder=\'### ###-####\'/>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_1 type=button value=\'Next\' onclick=\'next(0)\'/>\r\n				</div>\r\n			</div>\r\n		</div>\r\n	</div>\r\n-->\r\n\r\n<script>\r\n	var vault={\r\n		fname:\'\',\r\n		lname:\'\',\r\n		email:\'\',\r\n		tel:\'\',\r\n		\r\n		projname:\'\',\r\n		postal:\'\',\r\n		date:\'\',\r\n		TI:\'\',\r\n		OPT1:\'\',\r\n		OPT2:\'\',\r\n		\r\n		jspace:\'\',\r\n		opsize:\'\',\r\n		uweight:\'\',\r\n		utype:\'\',\r\n		\r\n		notes:\'\'\r\n	},\r\n	istherecurrentlyaframebeingconsidered= false;\r\ntry{\r\n	function closetheframeselectwindow(){\r\n		document.getElementById(\'personalize_frame_frame\').style.opacity= \'0\';\r\n		document.getElementById(\'personalize_frame_frame\').style.visibility= \'hidden\';\r\n		\r\n		document.getElementById(\'fanciest\').style.visibility= \'visible\';\r\n		document.getElementById(\'the_void\').style.opacity= \'0\';\r\n		setTimeout(function(){\r\n			//document.getElementById(\'the_void\').style.visibility= \'hidden\';\r\n			document.getElementById(\'all_of_the_frames_you_can_select_from\').style.visibility= \'visible\';\r\n			document.getElementById(\'the_void\').style.display= \'none\';\r\n		},300);\r\n	}\r\n			function opentheframeselectwindow(){\r\n				//document.getElementById(\'the_void\').style.visibility= \'visible\';\r\n				document.getElementById(\'fanciest\').style.visibility= \'hidden\';\r\n				document.getElementById(\'the_void\').style.display= \'grid\';\r\n				document.getElementById(\'the_void\').style.opacity= \'1\';\r\n			}\r\n	\r\n	function dotheframething(){\r\n		opentheframeselectwindow();\r\n		if(!istherecurrentlyaframebeingconsidered){\r\n			istherecurrentlyaframebeingconsidered= true;\r\n			document.getElementById(\'f2_1_final\').value= \'Submit\';\r\n		} else{\r\n			\r\n		}\r\n	}\r\n	function saveframe(){\r\n		vault.jspace= document.getElementById(\'joist_space\').value;\r\n			vault.opsize= document.getElementById(\'opening_size\').value;\r\n			vault.uweight= document.getElementById(\'unit_weight\').value;\r\n			vault.utype= document.querySelector(\'input[name=\"d\"]:checked\').id;\r\n		\r\n		closetheframeselectwindow();\r\n		document.getElementById(\'frame_1\').style.display= \'block\';\r\n			document.getElementById(\'saved_frame_1\').src= \'./frames/frame (\'+(chosen_frame-1)+\').png\';\r\n			document.getElementById(\'saved_frame_1\').style.width= \'62px\';\r\n	}\r\n	\r\n	function back(a){\r\n		if(a==1){\r\n			document.getElementById(\'disable_1\').style.display= \'grid\';\r\n			document.getElementById(\'disable_1\').style.opacity= \'1\';\r\n			document.getElementById(\'disable_2\').style.opacity= \'0\';\r\n			document.getElementById(\'display_2\').style.display= \'none\'\r\n		}else if(a==2){\r\n			document.getElementById(\'disable_2\').style.display= \'grid\';\r\n			document.getElementById(\'disable_2\').style.opacity= \'1\';\r\n			document.getElementById(\'disable_3\').style.opacity= \'0\';\r\n			document.getElementById(\'display_3\').style.display= \'none\'\r\n		}\r\n	}\r\n	function next(a){\r\n		if(a==0){\r\n			vault.fname= document.getElementById(\'_fname\').value;\r\n			vault.lname= document.getElementById(\'_lname\').value;\r\n			vault.email= document.getElementById(\'_email\').value;\r\n			vault.tel= document.getElementById(\'_tel\').value;\r\n			\r\n			document.getElementById(\'disable_1\').style.display= \'none\';\r\n			document.getElementById(\'disable_2\').style.opacity= \'1\';\r\n		}else if(a==1){\r\n			vault.projname= document.getElementById(\'_projname\').value;\r\n			vault.postal= document.getElementById(\'_postal\').value;\r\n			vault.date= document.getElementById(\'_neededby\').value;\r\n			vault.TI= document.querySelector(\'input[name=\"a\"]:checked\').id;\r\n			vault.OPT1= document.querySelector(\'input[name=\"b\"]:checked\').id;\r\n			vault.OPT2= document.querySelector(\'input[name=\"c\"]:checked\').id;\r\n			\r\n			document.getElementById(\'disable_2\').style.display= \'none\';\r\n			document.getElementById(\'disable_3\').style.opacity= \'1\';\r\n			\r\n			console.log(vault);\r\n		}else if(a==2){\r\n			document.getElementById(\'disable_3\').style.display= \'none\';\r\n			document.getElementById(\'disable_4\').style.opacity= \'1\';\r\n		}\r\n	}\r\n} catch(err){console.log(err);}\r\n	\r\n</script>\r\n\r\n\r\n\r\n\r\n<!--<h1>Let QuickFrames do the take-offs and eliminate your need to detail.</h1>\r\n[contact-form-7 id=\"1936\" title=\"New QuickFrames Quote Form\"]\r\n\r\n\r\nFrom: https://wplearninglab.com/contact-form-7-get-value-from-url/\r\n\r\n<script type=\"text/javascript\">\r\nvar getUrlParameter = function getUrlParameter(sParam) {\r\n    var sPageURL = decodeURIComponent(window.location.search.substring(1)),\r\n        sURLVariables = sPageURL.split(\'&\'),\r\n        sParameterName,\r\n        i;\r\n    for (i = 0; i < sURLVariables.length; i++) {\r\n        sParameterName = sURLVariables[i].split(\'=\');\r\n        if (sParameterName[0] === sParam) {\r\n            return sParameterName[1] === undefined ? true : sParameterName[1];\r\n        }\r\n    }\r\n};\r\n\r\nvar VARIABLE = getUrlParameter(\'PARAMETER\');\r\n\r\nif (VARIABLE != null) {\r\n     document.getElementById(\'INPUT-FIELD-ID\').value = VARIABLE;\r\n}\r\n\r\n</script>\r\n\r\n\r\n<a name=\"quote-a-few-frames\"></a>\r\n\r\n[two_fifth]\r\n<h3>Need Just A Few Frames Quoted?</h3>\r\nIf you are working on a project requiring only a few frames and you know the basic requirements for how they will be used, just fill out the form to the right. We\'ll get a quote back to you within 24 hours or less!\r\n\r\nFor each framed opening, using the <a href=\"#frame-types\"> frame type examples </a> shown below, select the frame type number that most closely matches where the opening will be located relative to the joists/beams and enter that into the <strong>Type</strong> column. While RTUs are shown in these images, they apply to all types of roof top equipment. If none of the images match your configuration, enter (0).\r\n\r\n[responsive] <img class=\"alignright\" src=\"/wp-content/uploads/quote-frame-outline.jpg\" alt=\"Frame Outline Image\" width=\"320\" /> [/responsive]\r\n\r\nIf the framing will <strong>only</strong> support the duct openings and not the curbing, enter the letter (<strong><span style=\"color: #37ade1;\">Y</span></strong>) in the <strong>Duct Only</strong> column. If the framing will support the curbing and equipment, enter the letter (<strong><span style=\"color: #37ade1;\">N</span></strong>).\r\n\r\nSpecify the center-to-center joist/beam spacing as shown by (<strong><span style=\"color: #37ade1;\">A</spacing></strong>) in the image to the right.\r\n\r\nWhen specifying the frame opening size (<strong><span style=\"color: #37ade1;\">B</span></strong>), use the length of the opening running <strong>parallel</strong> to (running with) the joists or beams.\r\n\r\n[responsive] <img class=\"alignright\" src=\"/wp-content/uploads/home-install-after-roof.jpg\" alt=\"Install After Roof Image\" width=\"400\"/> [/responsive]\r\n\r\n[/two_fifth]\r\n\r\n[three_fifth_last]\r\n[contact-form-7 id=\"1036\" title=\"Expanded Quote Request Small\"]\r\n[/three_fifth_last]\r\n\r\n<a name=\"frame-types\"></a>\r\n<h2>Frame Type Examples</h2>\r\n[responsive] <img class=\"alignright\" src=\"/wp-content/uploads/quote-frame-configurations.png\" alt=\"Roof Framing Configurations\" /> [/responsive]\r\n\r\n<a name=\"quote-a-lot-of-frames\"></a>\r\n[divider type=\"space\" margintop=\"0\" marginbottom=\"20\"]\r\n\r\n<h2>Have A Large Or Complex Project? Let Us Do The Take-offs For You!</h2>\r\n[divider type=\"space\" margintop=\"0\" marginbottom=\"10\"]\r\n\r\n[one_third]\r\n[responsive] <img src=\"/wp-content/uploads/drawing-image.jpg\" alt=\"Drawing Image\" /> [/responsive]\r\n[/one_third]\r\n\r\n[two_third_last]\r\nThe simplest way for us to provide you with a customized QuickFrames quotation is for you to allow us to do the take-offs directly from the engineering drawing set.\r\n\r\nWe have developed an extensive database of roof top equipment information, such as sizes, weights, opening dimensions, and structural requirements that allows us to select the optimal roof frames for your applications. All you need to do is to provide us with access to your drawing set and then let us go to work for you. You can also have complete confidence that we treat all drawing sets as proprietary information and we respect the importance of confidentiality for anything you share with us.\r\n\r\nThe easiest way for us to access your files is for you to provide us with an FTP address, login and password. Or, if the file set is small enough, you can also email it to us.\r\n\r\n[contact-form-7 id=\"401\" title=\"Quote Request\"]\r\n\r\n[/two_third_last]-->\r\n','Testing Page','','inherit','closed','closed','','777-revision-v1','','','2020-09-08 03:03:17','2020-09-08 10:03:17','',777,'http://quickframes.miritin.com/777-revision-v1/',0,'revision','',0),(1973,1,'2020-09-08 03:03:45','2020-09-08 10:03:45','<h1>Quote Demo:</h1>\r\n\r\n<style>\r\n\r\n  body{\r\n		font-family:Arial;\r\n	}\r\n\r\n	.Frame_Tool_Img{\r\n		cursor:pointer;\r\n		margin:20px;\r\n		border:2px solid transparent;\r\n		transition:border-color 0.1s linear;\r\n	}\r\n		.Frame_Tool_Img:hover{\r\n			border-color:#79c6e8;\r\n		}\r\n	input{\r\n		text-align:center;\r\n	}\r\n	\r\n	#content_container{\r\n		position:relative;\r\n			left:25vw;\r\n		width:50vw;\r\n			height:100%;\r\n	}\r\n	\r\n	#d{display:none;}\r\n	#tupperware_0{\r\n		grid-area:1 / 1;\r\n		height:100%;\r\n			width:100%;\r\n		display:grid;\r\n			grid-auto-flow:dense;\r\n			grid-template-columns: repeat(7, 1fr);\r\n			grid-template-rows: 500px 500px 500px;\r\n	}\r\n	#tupperware_1{\r\n		grid-area:1 / 1;\r\n		display:none;\r\n	}\r\n	\r\n	#tupperware_2{display:none;}\r\n	\r\n	.coolframebutte{\r\n		width:225px;\r\n		height:auto;\r\n	}\r\n	\r\n\r\n\r\n	#disable_1{\r\n		\r\n	}\r\n	#disable_2,#disable_3,#disable_4{\r\n		opacity:0;\r\n		transition:opacity .25s ease-in-out;\r\n	}\r\n	#disable_4{\r\n		height:7vh;\r\n			width:12vw;\r\n		font-size:2vh;\r\n		top:45vh;\r\n			left:44vw;\r\n	}\r\n\r\n	.fancy{\r\n		width:20vw;\r\n			height:50vh;\r\n			border-radius:10px;\r\n		position:absolute;\r\n			left:25%;\r\n			top:25vh;\r\n		background-color:#eee;\r\n		display:grid;\r\n			grid-auto-columns:100%;\r\n			grid-template-rows:85% 15%;\r\n	}\r\n		#f1{\r\n			backround-color:#fff;\r\n			text-align:center;\r\n		}\r\n		#f2{\r\n			background-color:#bbb;\r\n		}\r\n			#f2_2{\r\n				width:25%;\r\n					height:6%;\r\n				position:absolute;\r\n					left:15%;\r\n					top:90%;\r\n			}\r\n			#f2_1,#f2_1_final{\r\n				width:25%;\r\n					height:6%;\r\n				position:absolute;\r\n					right:15%;\r\n					top:90%;\r\n			}\r\n				.buTy_0{\r\n					height:5%;\r\n						width:65%;\r\n				}\r\n				.buTy_1{\r\n					height:5%;\r\n						width:65%;\r\n				}\r\n				.buTy_2{\r\n					position:absolute;\r\n						width:45%;\r\n						height:23%;\r\n						bottom:18%;\r\n					font-size:80%;\r\n					text-align:left;\r\n					background-color:#fff;\r\n						border:solid #767676 1px;\r\n						border-radius:2px;\r\n				}\r\n					#1_opt_text{\r\n						height:1000%;\r\n					}\r\n					\r\n				#project_type{\r\n					position:relative;\r\n						width:65%;\r\n						height:5%;\r\n						left:17.5%;\r\n					font-size:80%;\r\n					background-color:#fff;\r\n						border:solid #767676 1px;\r\n						border-radius:2px;\r\n				}\r\n  /*	----------------	*/\r\n		#cart_area{\r\n			height:65%;\r\n			display:grid;\r\n				grid-template-columns:33% 33% 33%;\r\n				grid-auto-rows:40%;\r\n		}\r\n			.frame_frame_frame{\r\n				\r\n			}\r\n				#frame_add{\r\n					height:24%;\r\n					margin-top:35%;\r\n				}\r\n				.add_frame{\r\n					height:30%;\r\n						width:30%;\r\n					margin-top:25%;\r\n				}\r\n			#_addnotes{\r\n				position:relative;\r\n					width:90%;\r\n					height:10%;\r\n			}\r\n	/*\r\n	#the_void{\r\n		position:absolute;\r\n			top:0;\r\n			left:0;\r\n			z-index:999;\r\n		background-color:rgba(0,0,0,0.6);\r\n		height:100%;\r\n			width:100%;\r\n		display:none;\r\n			grid-template-rows:5% 5% 85% 5%;\r\n			grid-template-columns:5% 90% 5%;\r\n			grid-template-areas:\'. . .\'\r\n								\'. a_fr a_x\'\r\n								\'. a_fr .\'\r\n								\'. . .\';\r\n		opacity:0;\r\n		transition:opacity 0.3s ease-in-out;\r\n	}\r\n		#all_of_the_frames_you_can_select_from{\r\n			grid-area:a_fr;\r\n		}\r\n			#personalize_frame_frame{\r\n				grid-area:a_fr;\r\n				visibility:hidden;\r\n				opacity:0;\r\n				transition:opacity 0.3s ease-in-out;\r\n			}\r\n		#the_little_x_in_the_top_right{\r\n			grid-area:a_x;\r\n				color:#fff;\r\n				font-size:2.4vmax;\r\n				cursor:pointer;\r\n			transition:color .1s linear;\r\n		}\r\n				#the_little_x_in_the_top_right:hover{\r\n					color:#79c6e8;\r\n				}\r\n			#customizations{\r\n				position:absolute;\r\n					top:20%;\r\n					height:50%;\r\n					weight:50%;\r\n					left:30%;\r\n				padding:20px;\r\n				border-radius:5px;\r\n				text-align:center;\r\n				background-color:rgba(0,0,0,0.2);\r\n			}\r\n				#bottomofframeoptions{\r\n					position:relative;\r\n						width:100%;\r\n						left:-20px;\r\n						bottom:-20px;\r\n					padding:20px;\r\n					background-color:#bbb;\r\n				}\r\n				#joist_space,#opening_size,#unit_weight{\r\n					height:2.5vh;\r\n					border:none;\r\n					border-left:5px solid transparent;\r\n					transition:border-left 0.2s linear;\r\n				}\r\n				#unit_type{\r\n					color:#fff;\r\n					text-align:left;\r\n				}\r\n			#save_unit{\r\n				width:50%;\r\n					height:2.5vh;\r\n			}\r\n			\r\n	#quickgridthing{\r\n		display:grid;\r\n			grid-template-columns:100%;\r\n			grid-template-areas:100%;\r\n	}\r\n		#grandprize__hori,#grandprize__vert{\r\n			animation:flickercolorselect 1s infinite;\r\n			visibility:hidden;\r\n		}\r\n		.blinking_arrow{\r\n			position:absolute;\r\n				left:10px;\r\n			font-size:1.6vh;\r\n			color:red;\r\n			visibility:hidden;\r\n			animation:flickercolorselect 1s infinite;\r\n		}\r\n	@keyframes flickercolorselect{\r\n		0%{opacity:0;}\r\n		50%{opacity:1;}\r\n		100%{opacity:0;}\r\n	}\r\n	\r\n	\r\n	.container_around_selected_frames_in_the_cart_screen{\r\n		\r\n	}\r\n		#rmv_q1{\r\n			color:red;\r\n			border:none;\r\n			background-color:transparent;\r\n			cursor:pointer;\r\n		}\r\n			#rmv_q1:hover{\r\n				text-decoration:underline;\r\n			}\r\n\r\n*/\r\n\r\n</style>\r\n<script>\r\n		var input_last_selected= false;\r\n	function selectoneofthetwoinputspluscolouring(a){\r\n		if(a==\'joist\'){\r\n			if(input_last_selected==\'opening\'){\r\n				//document.getElementById(\'opening_size\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_opening\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__vert\').style.visibility= \'hidden\';\r\n			}\r\n			input_last_selected= \'joist\';\r\n			//document.getElementById(\'joist_space\').style.borderLeftColor= \'red\';\r\n			document.getElementById(\'arrow_for_joist\').style.visibility= \'visible\';\r\n			document.getElementById(\'grandprize__hori\').style.visibility= \'visible\';\r\n		} else if(a==\'opening\'){\r\n			if(input_last_selected==\'joist\'){\r\n				//document.getElementById(\'joist_space\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_joist\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__hori\').style.visibility= \'hidden\';\r\n			}\r\n			input_last_selected= \'opening\';\r\n			//document.getElementById(\'opening_size\').style.borderLeftColor= \'red\';\r\n			document.getElementById(\'arrow_for_opening\').style.visibility= \'visible\';\r\n			document.getElementById(\'grandprize__vert\').style.visibility= \'visible\';\r\n		} else if(!a){\r\n			if(input_last_selected==\'joist\'){\r\n				//document.getElementById(\'joist_space\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_joist\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__hori\').style.visibility= \'hidden\';\r\n			} else if(input_last_selected==\'opening\'){\r\n				//document.getElementById(\'opening_size\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_opening\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__vert\').style.visibility= \'hidden\';\r\n			}\r\n		}\r\n	}\r\n	\r\n		var chosen_frame;\r\n	function choose(a){\r\n			let a6=a.src.length-6,a7=a.src.length-7;\r\n		chosen_frame= parseInt(a.src[a7]!=\'(\'?(a.src[a7]+a.src[a6]):a.src[a6])+1;\r\n		\r\n		//document.getElementById(\'tupperware_0\').style.visibility= \'hidden\';\r\n			//document.getElementById(\'tupperware_1\').style.display= \'block\';\r\n		\r\n		document.getElementById(\'grandprize\').src= \'./frames/dry (\'+(chosen_frame-1)+\').png\';\r\n			setTimeout(function(){document.getElementById(\'grandprize\').style.width= \'375px\';},50);\r\n		\r\n		\r\n		document.getElementById(\'all_of_the_frames_you_can_select_from\').style.visibility= \'hidden\';\r\n		document.getElementById(\'personalize_frame_frame\').style.visibility= \'visible\';\r\n				document.getElementById(\'grandprize__hori\').src= \'./frames/hori (\'+(chosen_frame-1)+\').png\';\r\n				document.getElementById(\'grandprize__vert\').src= \'./frames/vert (\'+(chosen_frame-1)+\').png\';\r\n					setTimeout(function(){\r\n								document.getElementById(\'grandprize__hori\').style.width= \'375px\';\r\n								document.getElementById(\'grandprize__vert\').style.width= \'375px\';\r\n							},50);\r\n			document.getElementById(\'personalize_frame_frame\').style.opacity= \'1\';\r\n		\r\n		if(chosen_frame==3 || chosen_frame==10){\r\n			document.getElementById(\'grandprize__vert\').hidden= true;\r\n			document.getElementById(\'opening_size\').hidden= true;\r\n			document.getElementById(\'arrow_for_opening\').hidden= true;\r\n		} else{\r\n			document.getElementById(\'grandprize__vert\').hidden= false;\r\n			document.getElementById(\'opening_size\').hidden= false;\r\n			document.getElementById(\'arrow_for_opening\').hidden= false;\r\n		}\r\n		\r\n		document.getElementById(\'joist_space\').focus();\r\n		\r\n		\r\n		/*	\r\n		let vHeight= document.getElementById(\'grandprize\').height,\r\n			vWidth= document.getElementById(\'grandprize\').width;\r\n			\r\n		document.getElementById(\'ch_width\').style.left= ((vWidth - document.getElementById(\'ch_width\').style.width)/2)+\'px\';\r\n		*/\r\n	}\r\n	\r\n	function removeitemfromcard(a){\r\n		//add stuff here to remove set image\r\n		document.getElementById(\'frame_\'+a).style.display= \'none\';\r\n	}\r\n	\r\n	\r\n/*\r\n\r\nSUBMIT\r\n- include \'additional notes\' section\r\n- links to plans (URL)\r\n	- OR -\r\n- file upload\r\n- CAPTCHA\r\n\r\n*/\r\n</script>\r\n<!--\r\n		<div id=the_void >\r\n			<div id=personalize_frame_frame >\r\n				<div id=quickgridthing >\r\n					<img class=\'Frame_Tool_Img\' id=grandprize__hori src=\'./blue2.png\' style=\'grid-area:1 / 1;\'>\r\n					<img class=\'Frame_Tool_Img\' id=grandprize__vert src=\'./blue1.png\' style=\'grid-area:1 / 1;\'>\r\n					<img class=\'Frame_Tool_Img\' id=grandprize src=\'\' style=\'grid-area:1 / 1;\'>\r\n				</div>\r\n				<div id=customizations >\r\n				\r\n				<div id=arrow_for_joist class=blinking_arrow >►</div>\r\n				<input id=joist_space type=text placeholder=\'Joist Spacing (in.)\' onfocus=\'selectoneofthetwoinputspluscolouring(\"joist\")\'/>\r\n					\r\n				<br><br>\r\n					<div id=arrow_for_opening class=blinking_arrow >►</div>\r\n				<input id=opening_size type=text placeholder=\'Opening Size (in.)\' onfocus=\'selectoneofthetwoinputspluscolouring(\"opening\")\'/>\r\n					\r\n				<br><br><div id=unit_type onclick=\'selectoneofthetwoinputspluscolouring(false)\'>\r\n						<p style=\'text-align:center;\'>Unit Type:</p>\r\n						<div style=\'\r\n						background-color:#fff;\r\n							border:solid #767676 1px;\r\n							border-radius:2px;\r\n							color:#000;\r\n							font-size:80%;\r\n							padding:5px;\' >\r\n							<input type=radio name=\'d\' id=\'u_opt_1\' value=\'opt1\' onfocus=\'selectoneofthetwoinputspluscolouring(false)\'/><label for=\'u_opt_1\'>RTU/AHU/MAU</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_2\' value=\'opt2\'/><label for=\'u_opt_2\'>EVAP Coolers</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_3\' value=\'opt3\'/><label for=\'u_opt_3\'>Exhaust Fans</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_4\' value=\'opt4\'/><label for=\'u_opt_4\'>Powered Vents</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_5\' value=\'opt5\'/><label for=\'u_opt_5\'>Gravity Vents</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_6\' value=\'opt6\'/><label for=\'u_opt_6\'>Skylights</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_7\' value=\'opt7\'/><label for=\'u_opt_7\'>Roof Drains</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_8\' value=\'opt8\'/><label for=\'u_opt_8\'>Roof Hatch</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_9\' value=\'opt9\'/><label for=\'u_opt_9\'>Floor Openings</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_text\' value=\'opt10\'/><input id=\'u_opt_text\' style=\'width:65%\' type=text placeholder=\'Other\'/>\r\n						</div>\r\n					</div>\r\n					\r\n			<br><br><input id=unit_weight type=text placeholder=\'Unit Weight (lbs.)\' onfocus=\'selectoneofthetwoinputspluscolouring(false)\'/>\r\n					\r\n	<br><br><div id=bottomofframeoptions >\r\n				<input id=save_unit type=button value=\'Add to Cart\' onclick=\'saveframe()\' onfocus=\'selectoneofthetwoinputspluscolouring(false)\'/>\r\n			</div>\r\n				</div>\r\n			</div>\r\n			<div id=all_of_the_frames_you_can_select_from >\r\n				\r\n				<div id=fr_double >\r\n					<img src=\'./frames/frame (0).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (1).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (2).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (5).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (6).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (9).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n				</div>\r\n				<div id=fr_triple >\r\n					<img src=\'./frames/frame (3).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (4).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (7).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (8).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (11).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n				</div>\r\n				<div id=fr_quad >\r\n					<img src=\'./frames/frame (10).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (12).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n				</div>\r\n				\r\n			</div>\r\n			<div id=the_little_x_in_the_top_right onclick=\'closetheframeselectwindow()\'>X</div>\r\n		</div>\r\n	<div id=content_container >\r\n		<div id=fanciest >\r\n			<div class=fancy id=disable_5 >\r\n				<p style=\'text-align:center;\'>Thank you for submitting!</p>\r\n				<input style=\'height:2.5vh;width:5vw;margin-top:32%;margin-left:3.5vw;\' type=button value=\'Return\' onclick=\'location.reload()\' />\r\n			</div>\r\n			<div class=fancy id=disable_4 >\r\n				<div id=f1 >\r\n					<input type=text id=_addnotes placeholder=\'Additional Notes\'>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_2 type=button value=\'Back\' onclick=\'back(2)\'>\r\n					<input id=f2_1_final type=button value=\'Skip\' onclick=\'next(2)\'>\r\n				</div>\r\n			</div>\r\n			<div class=fancy id=disable_3 >\r\n				<div id=f1 >\r\n					<h1>Cart:</h1>\r\n					<div id=cart_area >\r\n						<div class=container_around_selected_frames_in_the_cart_screen id=frame_1 style=\'display:none;\'>\r\n							<img id=saved_frame_1 src=\'\'>\r\n							<div>Qty: \r\n							<select id=quant_1 >\r\n								<option value=\'1\'>1</option>\r\n								<option value=\'2\'>2</option>\r\n								<option value=\'3\'>3</option>\r\n								<option value=\'4\'>4</option>\r\n								<option value=\'5\'>5</option>\r\n								<option value=\'6\'>6</option>\r\n								<option value=\'7\'>7</option>\r\n								<option value=\'8\'>8</option>\r\n								<option value=\'9\'>9</option>\r\n								<option value=\'10\'>10+</option>\r\n							</select></div>\r\n						<br>\r\n							<input id=rmv_q1 type=button value=\'Delete\' onclick=\'removeitemfromcard(1)\'/>\r\n						</div>\r\n						<div><input id=frame_add type=button value=\'Add Frame\' onclick=\'dotheframething()\'/></div>\r\n					</div>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_2 type=button value=\'Back\' onclick=\'back(2)\'>\r\n					<input id=f2_1_final type=button value=\'Skip\' onclick=\'next(2)\'/>\r\n				</div>\r\n			</div>\r\n			<div class=fancy id=disable_2 >\r\n				<div id=f1 >\r\n					<h1>Project Info:</h1>\r\n			<br>	<input class=buTy_0 id=\'_projname\' type=text placeholder=\'project name\'/>\r\n			<br><br><input class=buTy_0 id=\'_postal\' type=postalcode placeholder=\'zip/postal code\'/>\r\n			<br><br><input class=buTy_0 id=\'_neededby\' type=text placeholder=\'frames needed by  (e.g. 01/01/2021)\'/>\r\n			<br><br><form id=project_type >\r\n						<input type=radio name=\'a\' id=\'newmodel\' value=\'NewModel\'/><label for=\'newmodel\'>New Build</label>\r\n						<input type=radio name=\'a\' id=\'TI\' value=\'Newbuild/TI\'/><label for=\'TI\'>Remodel/T.I.</label>\r\n					</form>\r\n						<p style=\'position:relative;left:-25%;top:6%;\'>Roof Material:</p>\r\n					<div class=buTy_2 style=\'left:2%\'>\r\n						<input type=radio name=\'b\' id=\'1_opt_1\' value=\'opt1\'/><label for=\'1_opt_1\'>Steel Deck</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_2\' value=\'opt2\'/><label for=\'1_opt_2\'>Panelized Wood</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_3\' value=\'opt3\'/><label for=\'1_opt_3\'>Concrete</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_4\' value=\'opt4\'/><label for=\'1_opt_4\'>Gypcrete</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_5\' value=\'opt5\'/><input id=\'1_opt_text\' style=\'width:65%\' type=text placeholder=\'Other\'/>\r\n					</div>\r\n						<p style=\'position:relative;right:-25%;top:-2%;\'>Roof Structure:</p>\r\n					<div class=buTy_2 style=\'right:2%;\'>\r\n						<input type=radio name=\'c\' id=\'2_opt_1\' value=\'opt1\'/><label for=\'2_opt_1\'>Steel Joists/Beams</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_2\' value=\'opt2\'/><label for=\'2_opt_2\'>PEMB Purlins</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_3\' value=\'opt3\'/><label for=\'2_opt_3\'>Hybrid</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_4\' value=\'opt4\'/><label for=\'2_opt_4\'>Wood Trusses</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_5\' value=\'opt5\'/><input id=\'2_opt_text\' style=\'width:65%\' type=text placeholder=\'Other\'/>\r\n					</div>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_2 type=button value=\'Back\' onclick=\'back(1)\'>\r\n					<input id=f2_1 type=button value=\'Next\' onclick=\'next(1)\'/>\r\n				</div>\r\n			</div>\r\n			<div class=fancy id=disable_1 >\r\n				<div id=f1 >\r\n					<h1>Customer Info:</h1>\r\n			<br><br><input class=buTy_0 id=_fname type=text required placeholder=\'first name\'/>\r\n			<br><br><input class=buTy_0 id=_lname type=text required placeholder=\'last name\'/>\r\n			<br><br><input class=buTy_0 id=_email type=email required placeholder=\'email\'/>\r\n			<br><br><input class=buTy_0 id=_tel type=tel required placeholder=\'### ###-####\'/>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_1 type=button value=\'Next\' onclick=\'next(0)\'/>\r\n				</div>\r\n			</div>\r\n		</div>\r\n	</div>\r\n-->\r\n\r\n<script>\r\n	var vault={\r\n		fname:\'\',\r\n		lname:\'\',\r\n		email:\'\',\r\n		tel:\'\',\r\n		\r\n		projname:\'\',\r\n		postal:\'\',\r\n		date:\'\',\r\n		TI:\'\',\r\n		OPT1:\'\',\r\n		OPT2:\'\',\r\n		\r\n		jspace:\'\',\r\n		opsize:\'\',\r\n		uweight:\'\',\r\n		utype:\'\',\r\n		\r\n		notes:\'\'\r\n	},\r\n	istherecurrentlyaframebeingconsidered= false;\r\ntry{\r\n	function closetheframeselectwindow(){\r\n		document.getElementById(\'personalize_frame_frame\').style.opacity= \'0\';\r\n		document.getElementById(\'personalize_frame_frame\').style.visibility= \'hidden\';\r\n		\r\n		document.getElementById(\'fanciest\').style.visibility= \'visible\';\r\n		document.getElementById(\'the_void\').style.opacity= \'0\';\r\n		setTimeout(function(){\r\n			//document.getElementById(\'the_void\').style.visibility= \'hidden\';\r\n			document.getElementById(\'all_of_the_frames_you_can_select_from\').style.visibility= \'visible\';\r\n			document.getElementById(\'the_void\').style.display= \'none\';\r\n		},300);\r\n	}\r\n			function opentheframeselectwindow(){\r\n				//document.getElementById(\'the_void\').style.visibility= \'visible\';\r\n				document.getElementById(\'fanciest\').style.visibility= \'hidden\';\r\n				document.getElementById(\'the_void\').style.display= \'grid\';\r\n				document.getElementById(\'the_void\').style.opacity= \'1\';\r\n			}\r\n	\r\n	function dotheframething(){\r\n		opentheframeselectwindow();\r\n		if(!istherecurrentlyaframebeingconsidered){\r\n			istherecurrentlyaframebeingconsidered= true;\r\n			document.getElementById(\'f2_1_final\').value= \'Submit\';\r\n		} else{\r\n			\r\n		}\r\n	}\r\n	function saveframe(){\r\n		vault.jspace= document.getElementById(\'joist_space\').value;\r\n			vault.opsize= document.getElementById(\'opening_size\').value;\r\n			vault.uweight= document.getElementById(\'unit_weight\').value;\r\n			vault.utype= document.querySelector(\'input[name=\"d\"]:checked\').id;\r\n		\r\n		closetheframeselectwindow();\r\n		document.getElementById(\'frame_1\').style.display= \'block\';\r\n			document.getElementById(\'saved_frame_1\').src= \'./frames/frame (\'+(chosen_frame-1)+\').png\';\r\n			document.getElementById(\'saved_frame_1\').style.width= \'62px\';\r\n	}\r\n	\r\n	function back(a){\r\n		if(a==1){\r\n			document.getElementById(\'disable_1\').style.display= \'grid\';\r\n			document.getElementById(\'disable_1\').style.opacity= \'1\';\r\n			document.getElementById(\'disable_2\').style.opacity= \'0\';\r\n			document.getElementById(\'display_2\').style.display= \'none\'\r\n		}else if(a==2){\r\n			document.getElementById(\'disable_2\').style.display= \'grid\';\r\n			document.getElementById(\'disable_2\').style.opacity= \'1\';\r\n			document.getElementById(\'disable_3\').style.opacity= \'0\';\r\n			document.getElementById(\'display_3\').style.display= \'none\'\r\n		}\r\n	}\r\n	function next(a){\r\n		if(a==0){\r\n			vault.fname= document.getElementById(\'_fname\').value;\r\n			vault.lname= document.getElementById(\'_lname\').value;\r\n			vault.email= document.getElementById(\'_email\').value;\r\n			vault.tel= document.getElementById(\'_tel\').value;\r\n			\r\n			document.getElementById(\'disable_1\').style.display= \'none\';\r\n			document.getElementById(\'disable_2\').style.opacity= \'1\';\r\n		}else if(a==1){\r\n			vault.projname= document.getElementById(\'_projname\').value;\r\n			vault.postal= document.getElementById(\'_postal\').value;\r\n			vault.date= document.getElementById(\'_neededby\').value;\r\n			vault.TI= document.querySelector(\'input[name=\"a\"]:checked\').id;\r\n			vault.OPT1= document.querySelector(\'input[name=\"b\"]:checked\').id;\r\n			vault.OPT2= document.querySelector(\'input[name=\"c\"]:checked\').id;\r\n			\r\n			document.getElementById(\'disable_2\').style.display= \'none\';\r\n			document.getElementById(\'disable_3\').style.opacity= \'1\';\r\n			\r\n			console.log(vault);\r\n		}else if(a==2){\r\n			document.getElementById(\'disable_3\').style.display= \'none\';\r\n			document.getElementById(\'disable_4\').style.opacity= \'1\';\r\n		}\r\n	}\r\n} catch(err){console.log(err);}\r\n	\r\n</script>\r\n\r\n\r\n\r\n\r\n<!--<h1>Let QuickFrames do the take-offs and eliminate your need to detail.</h1>\r\n[contact-form-7 id=\"1936\" title=\"New QuickFrames Quote Form\"]\r\n\r\n\r\nFrom: https://wplearninglab.com/contact-form-7-get-value-from-url/\r\n\r\n<script type=\"text/javascript\">\r\nvar getUrlParameter = function getUrlParameter(sParam) {\r\n    var sPageURL = decodeURIComponent(window.location.search.substring(1)),\r\n        sURLVariables = sPageURL.split(\'&\'),\r\n        sParameterName,\r\n        i;\r\n    for (i = 0; i < sURLVariables.length; i++) {\r\n        sParameterName = sURLVariables[i].split(\'=\');\r\n        if (sParameterName[0] === sParam) {\r\n            return sParameterName[1] === undefined ? true : sParameterName[1];\r\n        }\r\n    }\r\n};\r\n\r\nvar VARIABLE = getUrlParameter(\'PARAMETER\');\r\n\r\nif (VARIABLE != null) {\r\n     document.getElementById(\'INPUT-FIELD-ID\').value = VARIABLE;\r\n}\r\n\r\n</script>\r\n\r\n\r\n<a name=\"quote-a-few-frames\"></a>\r\n\r\n[two_fifth]\r\n<h3>Need Just A Few Frames Quoted?</h3>\r\nIf you are working on a project requiring only a few frames and you know the basic requirements for how they will be used, just fill out the form to the right. We\'ll get a quote back to you within 24 hours or less!\r\n\r\nFor each framed opening, using the <a href=\"#frame-types\"> frame type examples </a> shown below, select the frame type number that most closely matches where the opening will be located relative to the joists/beams and enter that into the <strong>Type</strong> column. While RTUs are shown in these images, they apply to all types of roof top equipment. If none of the images match your configuration, enter (0).\r\n\r\n[responsive] <img class=\"alignright\" src=\"/wp-content/uploads/quote-frame-outline.jpg\" alt=\"Frame Outline Image\" width=\"320\" /> [/responsive]\r\n\r\nIf the framing will <strong>only</strong> support the duct openings and not the curbing, enter the letter (<strong><span style=\"color: #37ade1;\">Y</span></strong>) in the <strong>Duct Only</strong> column. If the framing will support the curbing and equipment, enter the letter (<strong><span style=\"color: #37ade1;\">N</span></strong>).\r\n\r\nSpecify the center-to-center joist/beam spacing as shown by (<strong><span style=\"color: #37ade1;\">A</spacing></strong>) in the image to the right.\r\n\r\nWhen specifying the frame opening size (<strong><span style=\"color: #37ade1;\">B</span></strong>), use the length of the opening running <strong>parallel</strong> to (running with) the joists or beams.\r\n\r\n[responsive] <img class=\"alignright\" src=\"/wp-content/uploads/home-install-after-roof.jpg\" alt=\"Install After Roof Image\" width=\"400\"/> [/responsive]\r\n\r\n[/two_fifth]\r\n\r\n[three_fifth_last]\r\n[contact-form-7 id=\"1036\" title=\"Expanded Quote Request Small\"]\r\n[/three_fifth_last]\r\n\r\n<a name=\"frame-types\"></a>\r\n<h2>Frame Type Examples</h2>\r\n[responsive] <img class=\"alignright\" src=\"/wp-content/uploads/quote-frame-configurations.png\" alt=\"Roof Framing Configurations\" /> [/responsive]\r\n\r\n<a name=\"quote-a-lot-of-frames\"></a>\r\n[divider type=\"space\" margintop=\"0\" marginbottom=\"20\"]\r\n\r\n<h2>Have A Large Or Complex Project? Let Us Do The Take-offs For You!</h2>\r\n[divider type=\"space\" margintop=\"0\" marginbottom=\"10\"]\r\n\r\n[one_third]\r\n[responsive] <img src=\"/wp-content/uploads/drawing-image.jpg\" alt=\"Drawing Image\" /> [/responsive]\r\n[/one_third]\r\n\r\n[two_third_last]\r\nThe simplest way for us to provide you with a customized QuickFrames quotation is for you to allow us to do the take-offs directly from the engineering drawing set.\r\n\r\nWe have developed an extensive database of roof top equipment information, such as sizes, weights, opening dimensions, and structural requirements that allows us to select the optimal roof frames for your applications. All you need to do is to provide us with access to your drawing set and then let us go to work for you. You can also have complete confidence that we treat all drawing sets as proprietary information and we respect the importance of confidentiality for anything you share with us.\r\n\r\nThe easiest way for us to access your files is for you to provide us with an FTP address, login and password. Or, if the file set is small enough, you can also email it to us.\r\n\r\n[contact-form-7 id=\"401\" title=\"Quote Request\"]\r\n\r\n[/two_third_last]-->\r\n','Testing Page','','inherit','closed','closed','','777-revision-v1','','','2020-09-08 03:03:45','2020-09-08 10:03:45','',777,'http://quickframes.miritin.com/777-revision-v1/',0,'revision','',0),(1974,1,'2020-09-08 03:04:13','2020-09-08 10:04:13','<h1>Quote Demo:</h1>\r\n\r\n<style>\r\n\r\n  body{\r\n		font-family:Arial;\r\n	}\r\n\r\n	.Frame_Tool_Img{\r\n		cursor:pointer;\r\n		margin:20px;\r\n		border:2px solid transparent;\r\n		transition:border-color 0.1s linear;\r\n	}\r\n		.Frame_Tool_Img:hover{\r\n			border-color:#79c6e8;\r\n		}\r\n	input{\r\n		text-align:center;\r\n	}\r\n	\r\n	#content_container{\r\n		position:relative;\r\n			left:25vw;\r\n		width:50vw;\r\n			height:100%;\r\n	}\r\n	\r\n	#d{display:none;}\r\n	#tupperware_0{\r\n		grid-area:1 / 1;\r\n		height:100%;\r\n			width:100%;\r\n		display:grid;\r\n			grid-auto-flow:dense;\r\n			grid-template-columns: repeat(7, 1fr);\r\n			grid-template-rows: 500px 500px 500px;\r\n	}\r\n	#tupperware_1{\r\n		grid-area:1 / 1;\r\n		display:none;\r\n	}\r\n	\r\n	#tupperware_2{display:none;}\r\n	\r\n	.coolframebutte{\r\n		width:225px;\r\n		height:auto;\r\n	}\r\n	\r\n\r\n\r\n	#disable_1{\r\n		\r\n	}\r\n	#disable_2,#disable_3,#disable_4{\r\n		opacity:0;\r\n		transition:opacity .25s ease-in-out;\r\n	}\r\n	#disable_4{\r\n		height:7vh;\r\n			width:12vw;\r\n		font-size:2vh;\r\n		top:45vh;\r\n			left:44vw;\r\n	}\r\n\r\n	.fancy{\r\n		width:20vw;\r\n			height:50vh;\r\n			border-radius:10px;\r\n		position:absolute;\r\n			left:25%;\r\n			top:25vh;\r\n		background-color:#eee;\r\n		display:grid;\r\n			grid-auto-columns:100%;\r\n			grid-template-rows:85% 15%;\r\n	}\r\n		#f1{\r\n			backround-color:#fff;\r\n			text-align:center;\r\n		}\r\n		#f2{\r\n			background-color:#bbb;\r\n		}\r\n			#f2_2{\r\n				width:25%;\r\n					height:6%;\r\n				position:absolute;\r\n					left:15%;\r\n					top:90%;\r\n			}\r\n			#f2_1,#f2_1_final{\r\n				width:25%;\r\n					height:6%;\r\n				position:absolute;\r\n					right:15%;\r\n					top:90%;\r\n			}\r\n				.buTy_0{\r\n					height:5%;\r\n						width:65%;\r\n				}\r\n				.buTy_1{\r\n					height:5%;\r\n						width:65%;\r\n				}\r\n				.buTy_2{\r\n					position:absolute;\r\n						width:45%;\r\n						height:23%;\r\n						bottom:18%;\r\n					font-size:80%;\r\n					text-align:left;\r\n					background-color:#fff;\r\n						border:solid #767676 1px;\r\n						border-radius:2px;\r\n				}\r\n					#1_opt_text{\r\n						height:1000%;\r\n					}\r\n					\r\n				#project_type{\r\n					position:relative;\r\n						width:65%;\r\n						height:5%;\r\n						left:17.5%;\r\n					font-size:80%;\r\n					background-color:#fff;\r\n						border:solid #767676 1px;\r\n						border-radius:2px;\r\n				}\r\n\r\n		#cart_area{\r\n			height:65%;\r\n			display:grid;\r\n				grid-template-columns:33% 33% 33%;\r\n				grid-auto-rows:40%;\r\n		}\r\n			.frame_frame_frame{\r\n				\r\n			}\r\n				#frame_add{\r\n					height:24%;\r\n					margin-top:35%;\r\n				}\r\n				.add_frame{\r\n					height:30%;\r\n						width:30%;\r\n					margin-top:25%;\r\n				}\r\n			#_addnotes{\r\n				position:relative;\r\n					width:90%;\r\n					height:10%;\r\n			}\r\n  /*	----------------	*/	\r\n	#the_void{\r\n		position:absolute;\r\n			top:0;\r\n			left:0;\r\n			z-index:999;\r\n		background-color:rgba(0,0,0,0.6);\r\n		height:100%;\r\n			width:100%;\r\n		display:none;\r\n			grid-template-rows:5% 5% 85% 5%;\r\n			grid-template-columns:5% 90% 5%;\r\n			grid-template-areas:\'. . .\'\r\n								\'. a_fr a_x\'\r\n								\'. a_fr .\'\r\n								\'. . .\';\r\n		opacity:0;\r\n		transition:opacity 0.3s ease-in-out;\r\n	}\r\n		#all_of_the_frames_you_can_select_from{\r\n			grid-area:a_fr;\r\n		}\r\n			#personalize_frame_frame{\r\n				grid-area:a_fr;\r\n				visibility:hidden;\r\n				opacity:0;\r\n				transition:opacity 0.3s ease-in-out;\r\n			}\r\n		#the_little_x_in_the_top_right{\r\n			grid-area:a_x;\r\n				color:#fff;\r\n				font-size:2.4vmax;\r\n				cursor:pointer;\r\n			transition:color .1s linear;\r\n		}\r\n				#the_little_x_in_the_top_right:hover{\r\n					color:#79c6e8;\r\n				}/*\r\n			#customizations{\r\n				position:absolute;\r\n					top:20%;\r\n					height:50%;\r\n					weight:50%;\r\n					left:30%;\r\n				padding:20px;\r\n				border-radius:5px;\r\n				text-align:center;\r\n				background-color:rgba(0,0,0,0.2);\r\n			}\r\n				#bottomofframeoptions{\r\n					position:relative;\r\n						width:100%;\r\n						left:-20px;\r\n						bottom:-20px;\r\n					padding:20px;\r\n					background-color:#bbb;\r\n				}\r\n				#joist_space,#opening_size,#unit_weight{\r\n					height:2.5vh;\r\n					border:none;\r\n					border-left:5px solid transparent;\r\n					transition:border-left 0.2s linear;\r\n				}\r\n				#unit_type{\r\n					color:#fff;\r\n					text-align:left;\r\n				}\r\n			#save_unit{\r\n				width:50%;\r\n					height:2.5vh;\r\n			}\r\n			\r\n	#quickgridthing{\r\n		display:grid;\r\n			grid-template-columns:100%;\r\n			grid-template-areas:100%;\r\n	}\r\n		#grandprize__hori,#grandprize__vert{\r\n			animation:flickercolorselect 1s infinite;\r\n			visibility:hidden;\r\n		}\r\n		.blinking_arrow{\r\n			position:absolute;\r\n				left:10px;\r\n			font-size:1.6vh;\r\n			color:red;\r\n			visibility:hidden;\r\n			animation:flickercolorselect 1s infinite;\r\n		}\r\n	@keyframes flickercolorselect{\r\n		0%{opacity:0;}\r\n		50%{opacity:1;}\r\n		100%{opacity:0;}\r\n	}\r\n	\r\n	\r\n	.container_around_selected_frames_in_the_cart_screen{\r\n		\r\n	}\r\n		#rmv_q1{\r\n			color:red;\r\n			border:none;\r\n			background-color:transparent;\r\n			cursor:pointer;\r\n		}\r\n			#rmv_q1:hover{\r\n				text-decoration:underline;\r\n			}\r\n\r\n*/\r\n\r\n</style>\r\n<script>\r\n		var input_last_selected= false;\r\n	function selectoneofthetwoinputspluscolouring(a){\r\n		if(a==\'joist\'){\r\n			if(input_last_selected==\'opening\'){\r\n				//document.getElementById(\'opening_size\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_opening\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__vert\').style.visibility= \'hidden\';\r\n			}\r\n			input_last_selected= \'joist\';\r\n			//document.getElementById(\'joist_space\').style.borderLeftColor= \'red\';\r\n			document.getElementById(\'arrow_for_joist\').style.visibility= \'visible\';\r\n			document.getElementById(\'grandprize__hori\').style.visibility= \'visible\';\r\n		} else if(a==\'opening\'){\r\n			if(input_last_selected==\'joist\'){\r\n				//document.getElementById(\'joist_space\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_joist\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__hori\').style.visibility= \'hidden\';\r\n			}\r\n			input_last_selected= \'opening\';\r\n			//document.getElementById(\'opening_size\').style.borderLeftColor= \'red\';\r\n			document.getElementById(\'arrow_for_opening\').style.visibility= \'visible\';\r\n			document.getElementById(\'grandprize__vert\').style.visibility= \'visible\';\r\n		} else if(!a){\r\n			if(input_last_selected==\'joist\'){\r\n				//document.getElementById(\'joist_space\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_joist\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__hori\').style.visibility= \'hidden\';\r\n			} else if(input_last_selected==\'opening\'){\r\n				//document.getElementById(\'opening_size\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_opening\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__vert\').style.visibility= \'hidden\';\r\n			}\r\n		}\r\n	}\r\n	\r\n		var chosen_frame;\r\n	function choose(a){\r\n			let a6=a.src.length-6,a7=a.src.length-7;\r\n		chosen_frame= parseInt(a.src[a7]!=\'(\'?(a.src[a7]+a.src[a6]):a.src[a6])+1;\r\n		\r\n		//document.getElementById(\'tupperware_0\').style.visibility= \'hidden\';\r\n			//document.getElementById(\'tupperware_1\').style.display= \'block\';\r\n		\r\n		document.getElementById(\'grandprize\').src= \'./frames/dry (\'+(chosen_frame-1)+\').png\';\r\n			setTimeout(function(){document.getElementById(\'grandprize\').style.width= \'375px\';},50);\r\n		\r\n		\r\n		document.getElementById(\'all_of_the_frames_you_can_select_from\').style.visibility= \'hidden\';\r\n		document.getElementById(\'personalize_frame_frame\').style.visibility= \'visible\';\r\n				document.getElementById(\'grandprize__hori\').src= \'./frames/hori (\'+(chosen_frame-1)+\').png\';\r\n				document.getElementById(\'grandprize__vert\').src= \'./frames/vert (\'+(chosen_frame-1)+\').png\';\r\n					setTimeout(function(){\r\n								document.getElementById(\'grandprize__hori\').style.width= \'375px\';\r\n								document.getElementById(\'grandprize__vert\').style.width= \'375px\';\r\n							},50);\r\n			document.getElementById(\'personalize_frame_frame\').style.opacity= \'1\';\r\n		\r\n		if(chosen_frame==3 || chosen_frame==10){\r\n			document.getElementById(\'grandprize__vert\').hidden= true;\r\n			document.getElementById(\'opening_size\').hidden= true;\r\n			document.getElementById(\'arrow_for_opening\').hidden= true;\r\n		} else{\r\n			document.getElementById(\'grandprize__vert\').hidden= false;\r\n			document.getElementById(\'opening_size\').hidden= false;\r\n			document.getElementById(\'arrow_for_opening\').hidden= false;\r\n		}\r\n		\r\n		document.getElementById(\'joist_space\').focus();\r\n		\r\n		\r\n		/*	\r\n		let vHeight= document.getElementById(\'grandprize\').height,\r\n			vWidth= document.getElementById(\'grandprize\').width;\r\n			\r\n		document.getElementById(\'ch_width\').style.left= ((vWidth - document.getElementById(\'ch_width\').style.width)/2)+\'px\';\r\n		*/\r\n	}\r\n	\r\n	function removeitemfromcard(a){\r\n		//add stuff here to remove set image\r\n		document.getElementById(\'frame_\'+a).style.display= \'none\';\r\n	}\r\n	\r\n	\r\n/*\r\n\r\nSUBMIT\r\n- include \'additional notes\' section\r\n- links to plans (URL)\r\n	- OR -\r\n- file upload\r\n- CAPTCHA\r\n\r\n*/\r\n</script>\r\n<!--\r\n		<div id=the_void >\r\n			<div id=personalize_frame_frame >\r\n				<div id=quickgridthing >\r\n					<img class=\'Frame_Tool_Img\' id=grandprize__hori src=\'./blue2.png\' style=\'grid-area:1 / 1;\'>\r\n					<img class=\'Frame_Tool_Img\' id=grandprize__vert src=\'./blue1.png\' style=\'grid-area:1 / 1;\'>\r\n					<img class=\'Frame_Tool_Img\' id=grandprize src=\'\' style=\'grid-area:1 / 1;\'>\r\n				</div>\r\n				<div id=customizations >\r\n				\r\n				<div id=arrow_for_joist class=blinking_arrow >►</div>\r\n				<input id=joist_space type=text placeholder=\'Joist Spacing (in.)\' onfocus=\'selectoneofthetwoinputspluscolouring(\"joist\")\'/>\r\n					\r\n				<br><br>\r\n					<div id=arrow_for_opening class=blinking_arrow >►</div>\r\n				<input id=opening_size type=text placeholder=\'Opening Size (in.)\' onfocus=\'selectoneofthetwoinputspluscolouring(\"opening\")\'/>\r\n					\r\n				<br><br><div id=unit_type onclick=\'selectoneofthetwoinputspluscolouring(false)\'>\r\n						<p style=\'text-align:center;\'>Unit Type:</p>\r\n						<div style=\'\r\n						background-color:#fff;\r\n							border:solid #767676 1px;\r\n							border-radius:2px;\r\n							color:#000;\r\n							font-size:80%;\r\n							padding:5px;\' >\r\n							<input type=radio name=\'d\' id=\'u_opt_1\' value=\'opt1\' onfocus=\'selectoneofthetwoinputspluscolouring(false)\'/><label for=\'u_opt_1\'>RTU/AHU/MAU</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_2\' value=\'opt2\'/><label for=\'u_opt_2\'>EVAP Coolers</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_3\' value=\'opt3\'/><label for=\'u_opt_3\'>Exhaust Fans</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_4\' value=\'opt4\'/><label for=\'u_opt_4\'>Powered Vents</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_5\' value=\'opt5\'/><label for=\'u_opt_5\'>Gravity Vents</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_6\' value=\'opt6\'/><label for=\'u_opt_6\'>Skylights</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_7\' value=\'opt7\'/><label for=\'u_opt_7\'>Roof Drains</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_8\' value=\'opt8\'/><label for=\'u_opt_8\'>Roof Hatch</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_9\' value=\'opt9\'/><label for=\'u_opt_9\'>Floor Openings</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_text\' value=\'opt10\'/><input id=\'u_opt_text\' style=\'width:65%\' type=text placeholder=\'Other\'/>\r\n						</div>\r\n					</div>\r\n					\r\n			<br><br><input id=unit_weight type=text placeholder=\'Unit Weight (lbs.)\' onfocus=\'selectoneofthetwoinputspluscolouring(false)\'/>\r\n					\r\n	<br><br><div id=bottomofframeoptions >\r\n				<input id=save_unit type=button value=\'Add to Cart\' onclick=\'saveframe()\' onfocus=\'selectoneofthetwoinputspluscolouring(false)\'/>\r\n			</div>\r\n				</div>\r\n			</div>\r\n			<div id=all_of_the_frames_you_can_select_from >\r\n				\r\n				<div id=fr_double >\r\n					<img src=\'./frames/frame (0).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (1).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (2).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (5).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (6).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (9).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n				</div>\r\n				<div id=fr_triple >\r\n					<img src=\'./frames/frame (3).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (4).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (7).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (8).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (11).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n				</div>\r\n				<div id=fr_quad >\r\n					<img src=\'./frames/frame (10).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (12).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n				</div>\r\n				\r\n			</div>\r\n			<div id=the_little_x_in_the_top_right onclick=\'closetheframeselectwindow()\'>X</div>\r\n		</div>\r\n	<div id=content_container >\r\n		<div id=fanciest >\r\n			<div class=fancy id=disable_5 >\r\n				<p style=\'text-align:center;\'>Thank you for submitting!</p>\r\n				<input style=\'height:2.5vh;width:5vw;margin-top:32%;margin-left:3.5vw;\' type=button value=\'Return\' onclick=\'location.reload()\' />\r\n			</div>\r\n			<div class=fancy id=disable_4 >\r\n				<div id=f1 >\r\n					<input type=text id=_addnotes placeholder=\'Additional Notes\'>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_2 type=button value=\'Back\' onclick=\'back(2)\'>\r\n					<input id=f2_1_final type=button value=\'Skip\' onclick=\'next(2)\'>\r\n				</div>\r\n			</div>\r\n			<div class=fancy id=disable_3 >\r\n				<div id=f1 >\r\n					<h1>Cart:</h1>\r\n					<div id=cart_area >\r\n						<div class=container_around_selected_frames_in_the_cart_screen id=frame_1 style=\'display:none;\'>\r\n							<img id=saved_frame_1 src=\'\'>\r\n							<div>Qty: \r\n							<select id=quant_1 >\r\n								<option value=\'1\'>1</option>\r\n								<option value=\'2\'>2</option>\r\n								<option value=\'3\'>3</option>\r\n								<option value=\'4\'>4</option>\r\n								<option value=\'5\'>5</option>\r\n								<option value=\'6\'>6</option>\r\n								<option value=\'7\'>7</option>\r\n								<option value=\'8\'>8</option>\r\n								<option value=\'9\'>9</option>\r\n								<option value=\'10\'>10+</option>\r\n							</select></div>\r\n						<br>\r\n							<input id=rmv_q1 type=button value=\'Delete\' onclick=\'removeitemfromcard(1)\'/>\r\n						</div>\r\n						<div><input id=frame_add type=button value=\'Add Frame\' onclick=\'dotheframething()\'/></div>\r\n					</div>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_2 type=button value=\'Back\' onclick=\'back(2)\'>\r\n					<input id=f2_1_final type=button value=\'Skip\' onclick=\'next(2)\'/>\r\n				</div>\r\n			</div>\r\n			<div class=fancy id=disable_2 >\r\n				<div id=f1 >\r\n					<h1>Project Info:</h1>\r\n			<br>	<input class=buTy_0 id=\'_projname\' type=text placeholder=\'project name\'/>\r\n			<br><br><input class=buTy_0 id=\'_postal\' type=postalcode placeholder=\'zip/postal code\'/>\r\n			<br><br><input class=buTy_0 id=\'_neededby\' type=text placeholder=\'frames needed by  (e.g. 01/01/2021)\'/>\r\n			<br><br><form id=project_type >\r\n						<input type=radio name=\'a\' id=\'newmodel\' value=\'NewModel\'/><label for=\'newmodel\'>New Build</label>\r\n						<input type=radio name=\'a\' id=\'TI\' value=\'Newbuild/TI\'/><label for=\'TI\'>Remodel/T.I.</label>\r\n					</form>\r\n						<p style=\'position:relative;left:-25%;top:6%;\'>Roof Material:</p>\r\n					<div class=buTy_2 style=\'left:2%\'>\r\n						<input type=radio name=\'b\' id=\'1_opt_1\' value=\'opt1\'/><label for=\'1_opt_1\'>Steel Deck</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_2\' value=\'opt2\'/><label for=\'1_opt_2\'>Panelized Wood</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_3\' value=\'opt3\'/><label for=\'1_opt_3\'>Concrete</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_4\' value=\'opt4\'/><label for=\'1_opt_4\'>Gypcrete</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_5\' value=\'opt5\'/><input id=\'1_opt_text\' style=\'width:65%\' type=text placeholder=\'Other\'/>\r\n					</div>\r\n						<p style=\'position:relative;right:-25%;top:-2%;\'>Roof Structure:</p>\r\n					<div class=buTy_2 style=\'right:2%;\'>\r\n						<input type=radio name=\'c\' id=\'2_opt_1\' value=\'opt1\'/><label for=\'2_opt_1\'>Steel Joists/Beams</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_2\' value=\'opt2\'/><label for=\'2_opt_2\'>PEMB Purlins</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_3\' value=\'opt3\'/><label for=\'2_opt_3\'>Hybrid</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_4\' value=\'opt4\'/><label for=\'2_opt_4\'>Wood Trusses</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_5\' value=\'opt5\'/><input id=\'2_opt_text\' style=\'width:65%\' type=text placeholder=\'Other\'/>\r\n					</div>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_2 type=button value=\'Back\' onclick=\'back(1)\'>\r\n					<input id=f2_1 type=button value=\'Next\' onclick=\'next(1)\'/>\r\n				</div>\r\n			</div>\r\n			<div class=fancy id=disable_1 >\r\n				<div id=f1 >\r\n					<h1>Customer Info:</h1>\r\n			<br><br><input class=buTy_0 id=_fname type=text required placeholder=\'first name\'/>\r\n			<br><br><input class=buTy_0 id=_lname type=text required placeholder=\'last name\'/>\r\n			<br><br><input class=buTy_0 id=_email type=email required placeholder=\'email\'/>\r\n			<br><br><input class=buTy_0 id=_tel type=tel required placeholder=\'### ###-####\'/>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_1 type=button value=\'Next\' onclick=\'next(0)\'/>\r\n				</div>\r\n			</div>\r\n		</div>\r\n	</div>\r\n-->\r\n\r\n<script>\r\n	var vault={\r\n		fname:\'\',\r\n		lname:\'\',\r\n		email:\'\',\r\n		tel:\'\',\r\n		\r\n		projname:\'\',\r\n		postal:\'\',\r\n		date:\'\',\r\n		TI:\'\',\r\n		OPT1:\'\',\r\n		OPT2:\'\',\r\n		\r\n		jspace:\'\',\r\n		opsize:\'\',\r\n		uweight:\'\',\r\n		utype:\'\',\r\n		\r\n		notes:\'\'\r\n	},\r\n	istherecurrentlyaframebeingconsidered= false;\r\ntry{\r\n	function closetheframeselectwindow(){\r\n		document.getElementById(\'personalize_frame_frame\').style.opacity= \'0\';\r\n		document.getElementById(\'personalize_frame_frame\').style.visibility= \'hidden\';\r\n		\r\n		document.getElementById(\'fanciest\').style.visibility= \'visible\';\r\n		document.getElementById(\'the_void\').style.opacity= \'0\';\r\n		setTimeout(function(){\r\n			//document.getElementById(\'the_void\').style.visibility= \'hidden\';\r\n			document.getElementById(\'all_of_the_frames_you_can_select_from\').style.visibility= \'visible\';\r\n			document.getElementById(\'the_void\').style.display= \'none\';\r\n		},300);\r\n	}\r\n			function opentheframeselectwindow(){\r\n				//document.getElementById(\'the_void\').style.visibility= \'visible\';\r\n				document.getElementById(\'fanciest\').style.visibility= \'hidden\';\r\n				document.getElementById(\'the_void\').style.display= \'grid\';\r\n				document.getElementById(\'the_void\').style.opacity= \'1\';\r\n			}\r\n	\r\n	function dotheframething(){\r\n		opentheframeselectwindow();\r\n		if(!istherecurrentlyaframebeingconsidered){\r\n			istherecurrentlyaframebeingconsidered= true;\r\n			document.getElementById(\'f2_1_final\').value= \'Submit\';\r\n		} else{\r\n			\r\n		}\r\n	}\r\n	function saveframe(){\r\n		vault.jspace= document.getElementById(\'joist_space\').value;\r\n			vault.opsize= document.getElementById(\'opening_size\').value;\r\n			vault.uweight= document.getElementById(\'unit_weight\').value;\r\n			vault.utype= document.querySelector(\'input[name=\"d\"]:checked\').id;\r\n		\r\n		closetheframeselectwindow();\r\n		document.getElementById(\'frame_1\').style.display= \'block\';\r\n			document.getElementById(\'saved_frame_1\').src= \'./frames/frame (\'+(chosen_frame-1)+\').png\';\r\n			document.getElementById(\'saved_frame_1\').style.width= \'62px\';\r\n	}\r\n	\r\n	function back(a){\r\n		if(a==1){\r\n			document.getElementById(\'disable_1\').style.display= \'grid\';\r\n			document.getElementById(\'disable_1\').style.opacity= \'1\';\r\n			document.getElementById(\'disable_2\').style.opacity= \'0\';\r\n			document.getElementById(\'display_2\').style.display= \'none\'\r\n		}else if(a==2){\r\n			document.getElementById(\'disable_2\').style.display= \'grid\';\r\n			document.getElementById(\'disable_2\').style.opacity= \'1\';\r\n			document.getElementById(\'disable_3\').style.opacity= \'0\';\r\n			document.getElementById(\'display_3\').style.display= \'none\'\r\n		}\r\n	}\r\n	function next(a){\r\n		if(a==0){\r\n			vault.fname= document.getElementById(\'_fname\').value;\r\n			vault.lname= document.getElementById(\'_lname\').value;\r\n			vault.email= document.getElementById(\'_email\').value;\r\n			vault.tel= document.getElementById(\'_tel\').value;\r\n			\r\n			document.getElementById(\'disable_1\').style.display= \'none\';\r\n			document.getElementById(\'disable_2\').style.opacity= \'1\';\r\n		}else if(a==1){\r\n			vault.projname= document.getElementById(\'_projname\').value;\r\n			vault.postal= document.getElementById(\'_postal\').value;\r\n			vault.date= document.getElementById(\'_neededby\').value;\r\n			vault.TI= document.querySelector(\'input[name=\"a\"]:checked\').id;\r\n			vault.OPT1= document.querySelector(\'input[name=\"b\"]:checked\').id;\r\n			vault.OPT2= document.querySelector(\'input[name=\"c\"]:checked\').id;\r\n			\r\n			document.getElementById(\'disable_2\').style.display= \'none\';\r\n			document.getElementById(\'disable_3\').style.opacity= \'1\';\r\n			\r\n			console.log(vault);\r\n		}else if(a==2){\r\n			document.getElementById(\'disable_3\').style.display= \'none\';\r\n			document.getElementById(\'disable_4\').style.opacity= \'1\';\r\n		}\r\n	}\r\n} catch(err){console.log(err);}\r\n	\r\n</script>\r\n\r\n\r\n\r\n\r\n<!--<h1>Let QuickFrames do the take-offs and eliminate your need to detail.</h1>\r\n[contact-form-7 id=\"1936\" title=\"New QuickFrames Quote Form\"]\r\n\r\n\r\nFrom: https://wplearninglab.com/contact-form-7-get-value-from-url/\r\n\r\n<script type=\"text/javascript\">\r\nvar getUrlParameter = function getUrlParameter(sParam) {\r\n    var sPageURL = decodeURIComponent(window.location.search.substring(1)),\r\n        sURLVariables = sPageURL.split(\'&\'),\r\n        sParameterName,\r\n        i;\r\n    for (i = 0; i < sURLVariables.length; i++) {\r\n        sParameterName = sURLVariables[i].split(\'=\');\r\n        if (sParameterName[0] === sParam) {\r\n            return sParameterName[1] === undefined ? true : sParameterName[1];\r\n        }\r\n    }\r\n};\r\n\r\nvar VARIABLE = getUrlParameter(\'PARAMETER\');\r\n\r\nif (VARIABLE != null) {\r\n     document.getElementById(\'INPUT-FIELD-ID\').value = VARIABLE;\r\n}\r\n\r\n</script>\r\n\r\n\r\n<a name=\"quote-a-few-frames\"></a>\r\n\r\n[two_fifth]\r\n<h3>Need Just A Few Frames Quoted?</h3>\r\nIf you are working on a project requiring only a few frames and you know the basic requirements for how they will be used, just fill out the form to the right. We\'ll get a quote back to you within 24 hours or less!\r\n\r\nFor each framed opening, using the <a href=\"#frame-types\"> frame type examples </a> shown below, select the frame type number that most closely matches where the opening will be located relative to the joists/beams and enter that into the <strong>Type</strong> column. While RTUs are shown in these images, they apply to all types of roof top equipment. If none of the images match your configuration, enter (0).\r\n\r\n[responsive] <img class=\"alignright\" src=\"/wp-content/uploads/quote-frame-outline.jpg\" alt=\"Frame Outline Image\" width=\"320\" /> [/responsive]\r\n\r\nIf the framing will <strong>only</strong> support the duct openings and not the curbing, enter the letter (<strong><span style=\"color: #37ade1;\">Y</span></strong>) in the <strong>Duct Only</strong> column. If the framing will support the curbing and equipment, enter the letter (<strong><span style=\"color: #37ade1;\">N</span></strong>).\r\n\r\nSpecify the center-to-center joist/beam spacing as shown by (<strong><span style=\"color: #37ade1;\">A</spacing></strong>) in the image to the right.\r\n\r\nWhen specifying the frame opening size (<strong><span style=\"color: #37ade1;\">B</span></strong>), use the length of the opening running <strong>parallel</strong> to (running with) the joists or beams.\r\n\r\n[responsive] <img class=\"alignright\" src=\"/wp-content/uploads/home-install-after-roof.jpg\" alt=\"Install After Roof Image\" width=\"400\"/> [/responsive]\r\n\r\n[/two_fifth]\r\n\r\n[three_fifth_last]\r\n[contact-form-7 id=\"1036\" title=\"Expanded Quote Request Small\"]\r\n[/three_fifth_last]\r\n\r\n<a name=\"frame-types\"></a>\r\n<h2>Frame Type Examples</h2>\r\n[responsive] <img class=\"alignright\" src=\"/wp-content/uploads/quote-frame-configurations.png\" alt=\"Roof Framing Configurations\" /> [/responsive]\r\n\r\n<a name=\"quote-a-lot-of-frames\"></a>\r\n[divider type=\"space\" margintop=\"0\" marginbottom=\"20\"]\r\n\r\n<h2>Have A Large Or Complex Project? Let Us Do The Take-offs For You!</h2>\r\n[divider type=\"space\" margintop=\"0\" marginbottom=\"10\"]\r\n\r\n[one_third]\r\n[responsive] <img src=\"/wp-content/uploads/drawing-image.jpg\" alt=\"Drawing Image\" /> [/responsive]\r\n[/one_third]\r\n\r\n[two_third_last]\r\nThe simplest way for us to provide you with a customized QuickFrames quotation is for you to allow us to do the take-offs directly from the engineering drawing set.\r\n\r\nWe have developed an extensive database of roof top equipment information, such as sizes, weights, opening dimensions, and structural requirements that allows us to select the optimal roof frames for your applications. All you need to do is to provide us with access to your drawing set and then let us go to work for you. You can also have complete confidence that we treat all drawing sets as proprietary information and we respect the importance of confidentiality for anything you share with us.\r\n\r\nThe easiest way for us to access your files is for you to provide us with an FTP address, login and password. Or, if the file set is small enough, you can also email it to us.\r\n\r\n[contact-form-7 id=\"401\" title=\"Quote Request\"]\r\n\r\n[/two_third_last]-->\r\n','Testing Page','','inherit','closed','closed','','777-revision-v1','','','2020-09-08 03:04:13','2020-09-08 10:04:13','',777,'http://quickframes.miritin.com/777-revision-v1/',0,'revision','',0),(1975,1,'2020-09-08 03:04:35','2020-09-08 10:04:35','<h1>Quote Demo:</h1>\r\n\r\n<style>\r\n\r\n  body{\r\n		font-family:Arial;\r\n	}\r\n\r\n	.Frame_Tool_Img{\r\n		cursor:pointer;\r\n		margin:20px;\r\n		border:2px solid transparent;\r\n		transition:border-color 0.1s linear;\r\n	}\r\n		.Frame_Tool_Img:hover{\r\n			border-color:#79c6e8;\r\n		}\r\n	input{\r\n		text-align:center;\r\n	}\r\n	\r\n	#content_container{\r\n		position:relative;\r\n			left:25vw;\r\n		width:50vw;\r\n			height:100%;\r\n	}\r\n	\r\n	#d{display:none;}\r\n	#tupperware_0{\r\n		grid-area:1 / 1;\r\n		height:100%;\r\n			width:100%;\r\n		display:grid;\r\n			grid-auto-flow:dense;\r\n			grid-template-columns: repeat(7, 1fr);\r\n			grid-template-rows: 500px 500px 500px;\r\n	}\r\n	#tupperware_1{\r\n		grid-area:1 / 1;\r\n		display:none;\r\n	}\r\n	\r\n	#tupperware_2{display:none;}\r\n	\r\n	.coolframebutte{\r\n		width:225px;\r\n		height:auto;\r\n	}\r\n	\r\n\r\n\r\n	#disable_1{\r\n		\r\n	}\r\n	#disable_2,#disable_3,#disable_4{\r\n		opacity:0;\r\n		transition:opacity .25s ease-in-out;\r\n	}\r\n	#disable_4{\r\n		height:7vh;\r\n			width:12vw;\r\n		font-size:2vh;\r\n		top:45vh;\r\n			left:44vw;\r\n	}\r\n\r\n	.fancy{\r\n		width:20vw;\r\n			height:50vh;\r\n			border-radius:10px;\r\n		position:absolute;\r\n			left:25%;\r\n			top:25vh;\r\n		background-color:#eee;\r\n		display:grid;\r\n			grid-auto-columns:100%;\r\n			grid-template-rows:85% 15%;\r\n	}\r\n		#f1{\r\n			backround-color:#fff;\r\n			text-align:center;\r\n		}\r\n		#f2{\r\n			background-color:#bbb;\r\n		}\r\n			#f2_2{\r\n				width:25%;\r\n					height:6%;\r\n				position:absolute;\r\n					left:15%;\r\n					top:90%;\r\n			}\r\n			#f2_1,#f2_1_final{\r\n				width:25%;\r\n					height:6%;\r\n				position:absolute;\r\n					right:15%;\r\n					top:90%;\r\n			}\r\n				.buTy_0{\r\n					height:5%;\r\n						width:65%;\r\n				}\r\n				.buTy_1{\r\n					height:5%;\r\n						width:65%;\r\n				}\r\n				.buTy_2{\r\n					position:absolute;\r\n						width:45%;\r\n						height:23%;\r\n						bottom:18%;\r\n					font-size:80%;\r\n					text-align:left;\r\n					background-color:#fff;\r\n						border:solid #767676 1px;\r\n						border-radius:2px;\r\n				}\r\n					#1_opt_text{\r\n						height:1000%;\r\n					}\r\n					\r\n				#project_type{\r\n					position:relative;\r\n						width:65%;\r\n						height:5%;\r\n						left:17.5%;\r\n					font-size:80%;\r\n					background-color:#fff;\r\n						border:solid #767676 1px;\r\n						border-radius:2px;\r\n				}\r\n\r\n		#cart_area{\r\n			height:65%;\r\n			display:grid;\r\n				grid-template-columns:33% 33% 33%;\r\n				grid-auto-rows:40%;\r\n		}\r\n			.frame_frame_frame{\r\n				\r\n			}\r\n				#frame_add{\r\n					height:24%;\r\n					margin-top:35%;\r\n				}\r\n				.add_frame{\r\n					height:30%;\r\n						width:30%;\r\n					margin-top:25%;\r\n				}\r\n			#_addnotes{\r\n				position:relative;\r\n					width:90%;\r\n					height:10%;\r\n			}\r\n\r\n	#the_void{\r\n		position:absolute;\r\n			top:0;\r\n			left:0;\r\n			z-index:999;\r\n		background-color:rgba(0,0,0,0.6);\r\n		height:100%;\r\n			width:100%;\r\n		display:none;\r\n			grid-template-rows:5% 5% 85% 5%;\r\n			grid-template-columns:5% 90% 5%;\r\n			grid-template-areas:\'. . .\'\r\n								\'. a_fr a_x\'\r\n								\'. a_fr .\'\r\n								\'. . .\';\r\n		opacity:0;\r\n		transition:opacity 0.3s ease-in-out;\r\n	}\r\n		#all_of_the_frames_you_can_select_from{\r\n			grid-area:a_fr;\r\n		}\r\n			#personalize_frame_frame{\r\n				grid-area:a_fr;\r\n				visibility:hidden;\r\n				opacity:0;\r\n				transition:opacity 0.3s ease-in-out;\r\n			}\r\n		#the_little_x_in_the_top_right{\r\n			grid-area:a_x;\r\n				color:#fff;\r\n				font-size:2.4vmax;\r\n				cursor:pointer;\r\n			transition:color .1s linear;\r\n		}\r\n				#the_little_x_in_the_top_right:hover{\r\n					color:#79c6e8;\r\n				}  /*	----------------	*/	\r\n			#customizations{\r\n				position:absolute;\r\n					top:20%;\r\n					height:50%;\r\n					weight:50%;\r\n					left:30%;\r\n				padding:20px;\r\n				border-radius:5px;\r\n				text-align:center;\r\n				background-color:rgba(0,0,0,0.2);\r\n			}\r\n				#bottomofframeoptions{\r\n					position:relative;\r\n						width:100%;\r\n						left:-20px;\r\n						bottom:-20px;\r\n					padding:20px;\r\n					background-color:#bbb;\r\n				}\r\n				#joist_space,#opening_size,#unit_weight{\r\n					height:2.5vh;\r\n					border:none;\r\n					border-left:5px solid transparent;\r\n					transition:border-left 0.2s linear;\r\n				}\r\n				#unit_type{\r\n					color:#fff;\r\n					text-align:left;\r\n				}\r\n			#save_unit{\r\n				width:50%;\r\n					height:2.5vh;\r\n			}\r\n			/*\r\n	#quickgridthing{\r\n		display:grid;\r\n			grid-template-columns:100%;\r\n			grid-template-areas:100%;\r\n	}\r\n		#grandprize__hori,#grandprize__vert{\r\n			animation:flickercolorselect 1s infinite;\r\n			visibility:hidden;\r\n		}\r\n		.blinking_arrow{\r\n			position:absolute;\r\n				left:10px;\r\n			font-size:1.6vh;\r\n			color:red;\r\n			visibility:hidden;\r\n			animation:flickercolorselect 1s infinite;\r\n		}\r\n	@keyframes flickercolorselect{\r\n		0%{opacity:0;}\r\n		50%{opacity:1;}\r\n		100%{opacity:0;}\r\n	}\r\n	\r\n	\r\n	.container_around_selected_frames_in_the_cart_screen{\r\n		\r\n	}\r\n		#rmv_q1{\r\n			color:red;\r\n			border:none;\r\n			background-color:transparent;\r\n			cursor:pointer;\r\n		}\r\n			#rmv_q1:hover{\r\n				text-decoration:underline;\r\n			}\r\n\r\n*/\r\n\r\n</style>\r\n<script>\r\n		var input_last_selected= false;\r\n	function selectoneofthetwoinputspluscolouring(a){\r\n		if(a==\'joist\'){\r\n			if(input_last_selected==\'opening\'){\r\n				//document.getElementById(\'opening_size\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_opening\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__vert\').style.visibility= \'hidden\';\r\n			}\r\n			input_last_selected= \'joist\';\r\n			//document.getElementById(\'joist_space\').style.borderLeftColor= \'red\';\r\n			document.getElementById(\'arrow_for_joist\').style.visibility= \'visible\';\r\n			document.getElementById(\'grandprize__hori\').style.visibility= \'visible\';\r\n		} else if(a==\'opening\'){\r\n			if(input_last_selected==\'joist\'){\r\n				//document.getElementById(\'joist_space\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_joist\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__hori\').style.visibility= \'hidden\';\r\n			}\r\n			input_last_selected= \'opening\';\r\n			//document.getElementById(\'opening_size\').style.borderLeftColor= \'red\';\r\n			document.getElementById(\'arrow_for_opening\').style.visibility= \'visible\';\r\n			document.getElementById(\'grandprize__vert\').style.visibility= \'visible\';\r\n		} else if(!a){\r\n			if(input_last_selected==\'joist\'){\r\n				//document.getElementById(\'joist_space\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_joist\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__hori\').style.visibility= \'hidden\';\r\n			} else if(input_last_selected==\'opening\'){\r\n				//document.getElementById(\'opening_size\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_opening\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__vert\').style.visibility= \'hidden\';\r\n			}\r\n		}\r\n	}\r\n	\r\n		var chosen_frame;\r\n	function choose(a){\r\n			let a6=a.src.length-6,a7=a.src.length-7;\r\n		chosen_frame= parseInt(a.src[a7]!=\'(\'?(a.src[a7]+a.src[a6]):a.src[a6])+1;\r\n		\r\n		//document.getElementById(\'tupperware_0\').style.visibility= \'hidden\';\r\n			//document.getElementById(\'tupperware_1\').style.display= \'block\';\r\n		\r\n		document.getElementById(\'grandprize\').src= \'./frames/dry (\'+(chosen_frame-1)+\').png\';\r\n			setTimeout(function(){document.getElementById(\'grandprize\').style.width= \'375px\';},50);\r\n		\r\n		\r\n		document.getElementById(\'all_of_the_frames_you_can_select_from\').style.visibility= \'hidden\';\r\n		document.getElementById(\'personalize_frame_frame\').style.visibility= \'visible\';\r\n				document.getElementById(\'grandprize__hori\').src= \'./frames/hori (\'+(chosen_frame-1)+\').png\';\r\n				document.getElementById(\'grandprize__vert\').src= \'./frames/vert (\'+(chosen_frame-1)+\').png\';\r\n					setTimeout(function(){\r\n								document.getElementById(\'grandprize__hori\').style.width= \'375px\';\r\n								document.getElementById(\'grandprize__vert\').style.width= \'375px\';\r\n							},50);\r\n			document.getElementById(\'personalize_frame_frame\').style.opacity= \'1\';\r\n		\r\n		if(chosen_frame==3 || chosen_frame==10){\r\n			document.getElementById(\'grandprize__vert\').hidden= true;\r\n			document.getElementById(\'opening_size\').hidden= true;\r\n			document.getElementById(\'arrow_for_opening\').hidden= true;\r\n		} else{\r\n			document.getElementById(\'grandprize__vert\').hidden= false;\r\n			document.getElementById(\'opening_size\').hidden= false;\r\n			document.getElementById(\'arrow_for_opening\').hidden= false;\r\n		}\r\n		\r\n		document.getElementById(\'joist_space\').focus();\r\n		\r\n		\r\n		/*	\r\n		let vHeight= document.getElementById(\'grandprize\').height,\r\n			vWidth= document.getElementById(\'grandprize\').width;\r\n			\r\n		document.getElementById(\'ch_width\').style.left= ((vWidth - document.getElementById(\'ch_width\').style.width)/2)+\'px\';\r\n		*/\r\n	}\r\n	\r\n	function removeitemfromcard(a){\r\n		//add stuff here to remove set image\r\n		document.getElementById(\'frame_\'+a).style.display= \'none\';\r\n	}\r\n	\r\n	\r\n/*\r\n\r\nSUBMIT\r\n- include \'additional notes\' section\r\n- links to plans (URL)\r\n	- OR -\r\n- file upload\r\n- CAPTCHA\r\n\r\n*/\r\n</script>\r\n<!--\r\n		<div id=the_void >\r\n			<div id=personalize_frame_frame >\r\n				<div id=quickgridthing >\r\n					<img class=\'Frame_Tool_Img\' id=grandprize__hori src=\'./blue2.png\' style=\'grid-area:1 / 1;\'>\r\n					<img class=\'Frame_Tool_Img\' id=grandprize__vert src=\'./blue1.png\' style=\'grid-area:1 / 1;\'>\r\n					<img class=\'Frame_Tool_Img\' id=grandprize src=\'\' style=\'grid-area:1 / 1;\'>\r\n				</div>\r\n				<div id=customizations >\r\n				\r\n				<div id=arrow_for_joist class=blinking_arrow >►</div>\r\n				<input id=joist_space type=text placeholder=\'Joist Spacing (in.)\' onfocus=\'selectoneofthetwoinputspluscolouring(\"joist\")\'/>\r\n					\r\n				<br><br>\r\n					<div id=arrow_for_opening class=blinking_arrow >►</div>\r\n				<input id=opening_size type=text placeholder=\'Opening Size (in.)\' onfocus=\'selectoneofthetwoinputspluscolouring(\"opening\")\'/>\r\n					\r\n				<br><br><div id=unit_type onclick=\'selectoneofthetwoinputspluscolouring(false)\'>\r\n						<p style=\'text-align:center;\'>Unit Type:</p>\r\n						<div style=\'\r\n						background-color:#fff;\r\n							border:solid #767676 1px;\r\n							border-radius:2px;\r\n							color:#000;\r\n							font-size:80%;\r\n							padding:5px;\' >\r\n							<input type=radio name=\'d\' id=\'u_opt_1\' value=\'opt1\' onfocus=\'selectoneofthetwoinputspluscolouring(false)\'/><label for=\'u_opt_1\'>RTU/AHU/MAU</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_2\' value=\'opt2\'/><label for=\'u_opt_2\'>EVAP Coolers</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_3\' value=\'opt3\'/><label for=\'u_opt_3\'>Exhaust Fans</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_4\' value=\'opt4\'/><label for=\'u_opt_4\'>Powered Vents</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_5\' value=\'opt5\'/><label for=\'u_opt_5\'>Gravity Vents</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_6\' value=\'opt6\'/><label for=\'u_opt_6\'>Skylights</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_7\' value=\'opt7\'/><label for=\'u_opt_7\'>Roof Drains</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_8\' value=\'opt8\'/><label for=\'u_opt_8\'>Roof Hatch</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_9\' value=\'opt9\'/><label for=\'u_opt_9\'>Floor Openings</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_text\' value=\'opt10\'/><input id=\'u_opt_text\' style=\'width:65%\' type=text placeholder=\'Other\'/>\r\n						</div>\r\n					</div>\r\n					\r\n			<br><br><input id=unit_weight type=text placeholder=\'Unit Weight (lbs.)\' onfocus=\'selectoneofthetwoinputspluscolouring(false)\'/>\r\n					\r\n	<br><br><div id=bottomofframeoptions >\r\n				<input id=save_unit type=button value=\'Add to Cart\' onclick=\'saveframe()\' onfocus=\'selectoneofthetwoinputspluscolouring(false)\'/>\r\n			</div>\r\n				</div>\r\n			</div>\r\n			<div id=all_of_the_frames_you_can_select_from >\r\n				\r\n				<div id=fr_double >\r\n					<img src=\'./frames/frame (0).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (1).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (2).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (5).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (6).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (9).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n				</div>\r\n				<div id=fr_triple >\r\n					<img src=\'./frames/frame (3).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (4).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (7).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (8).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (11).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n				</div>\r\n				<div id=fr_quad >\r\n					<img src=\'./frames/frame (10).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (12).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n				</div>\r\n				\r\n			</div>\r\n			<div id=the_little_x_in_the_top_right onclick=\'closetheframeselectwindow()\'>X</div>\r\n		</div>\r\n	<div id=content_container >\r\n		<div id=fanciest >\r\n			<div class=fancy id=disable_5 >\r\n				<p style=\'text-align:center;\'>Thank you for submitting!</p>\r\n				<input style=\'height:2.5vh;width:5vw;margin-top:32%;margin-left:3.5vw;\' type=button value=\'Return\' onclick=\'location.reload()\' />\r\n			</div>\r\n			<div class=fancy id=disable_4 >\r\n				<div id=f1 >\r\n					<input type=text id=_addnotes placeholder=\'Additional Notes\'>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_2 type=button value=\'Back\' onclick=\'back(2)\'>\r\n					<input id=f2_1_final type=button value=\'Skip\' onclick=\'next(2)\'>\r\n				</div>\r\n			</div>\r\n			<div class=fancy id=disable_3 >\r\n				<div id=f1 >\r\n					<h1>Cart:</h1>\r\n					<div id=cart_area >\r\n						<div class=container_around_selected_frames_in_the_cart_screen id=frame_1 style=\'display:none;\'>\r\n							<img id=saved_frame_1 src=\'\'>\r\n							<div>Qty: \r\n							<select id=quant_1 >\r\n								<option value=\'1\'>1</option>\r\n								<option value=\'2\'>2</option>\r\n								<option value=\'3\'>3</option>\r\n								<option value=\'4\'>4</option>\r\n								<option value=\'5\'>5</option>\r\n								<option value=\'6\'>6</option>\r\n								<option value=\'7\'>7</option>\r\n								<option value=\'8\'>8</option>\r\n								<option value=\'9\'>9</option>\r\n								<option value=\'10\'>10+</option>\r\n							</select></div>\r\n						<br>\r\n							<input id=rmv_q1 type=button value=\'Delete\' onclick=\'removeitemfromcard(1)\'/>\r\n						</div>\r\n						<div><input id=frame_add type=button value=\'Add Frame\' onclick=\'dotheframething()\'/></div>\r\n					</div>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_2 type=button value=\'Back\' onclick=\'back(2)\'>\r\n					<input id=f2_1_final type=button value=\'Skip\' onclick=\'next(2)\'/>\r\n				</div>\r\n			</div>\r\n			<div class=fancy id=disable_2 >\r\n				<div id=f1 >\r\n					<h1>Project Info:</h1>\r\n			<br>	<input class=buTy_0 id=\'_projname\' type=text placeholder=\'project name\'/>\r\n			<br><br><input class=buTy_0 id=\'_postal\' type=postalcode placeholder=\'zip/postal code\'/>\r\n			<br><br><input class=buTy_0 id=\'_neededby\' type=text placeholder=\'frames needed by  (e.g. 01/01/2021)\'/>\r\n			<br><br><form id=project_type >\r\n						<input type=radio name=\'a\' id=\'newmodel\' value=\'NewModel\'/><label for=\'newmodel\'>New Build</label>\r\n						<input type=radio name=\'a\' id=\'TI\' value=\'Newbuild/TI\'/><label for=\'TI\'>Remodel/T.I.</label>\r\n					</form>\r\n						<p style=\'position:relative;left:-25%;top:6%;\'>Roof Material:</p>\r\n					<div class=buTy_2 style=\'left:2%\'>\r\n						<input type=radio name=\'b\' id=\'1_opt_1\' value=\'opt1\'/><label for=\'1_opt_1\'>Steel Deck</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_2\' value=\'opt2\'/><label for=\'1_opt_2\'>Panelized Wood</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_3\' value=\'opt3\'/><label for=\'1_opt_3\'>Concrete</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_4\' value=\'opt4\'/><label for=\'1_opt_4\'>Gypcrete</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_5\' value=\'opt5\'/><input id=\'1_opt_text\' style=\'width:65%\' type=text placeholder=\'Other\'/>\r\n					</div>\r\n						<p style=\'position:relative;right:-25%;top:-2%;\'>Roof Structure:</p>\r\n					<div class=buTy_2 style=\'right:2%;\'>\r\n						<input type=radio name=\'c\' id=\'2_opt_1\' value=\'opt1\'/><label for=\'2_opt_1\'>Steel Joists/Beams</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_2\' value=\'opt2\'/><label for=\'2_opt_2\'>PEMB Purlins</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_3\' value=\'opt3\'/><label for=\'2_opt_3\'>Hybrid</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_4\' value=\'opt4\'/><label for=\'2_opt_4\'>Wood Trusses</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_5\' value=\'opt5\'/><input id=\'2_opt_text\' style=\'width:65%\' type=text placeholder=\'Other\'/>\r\n					</div>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_2 type=button value=\'Back\' onclick=\'back(1)\'>\r\n					<input id=f2_1 type=button value=\'Next\' onclick=\'next(1)\'/>\r\n				</div>\r\n			</div>\r\n			<div class=fancy id=disable_1 >\r\n				<div id=f1 >\r\n					<h1>Customer Info:</h1>\r\n			<br><br><input class=buTy_0 id=_fname type=text required placeholder=\'first name\'/>\r\n			<br><br><input class=buTy_0 id=_lname type=text required placeholder=\'last name\'/>\r\n			<br><br><input class=buTy_0 id=_email type=email required placeholder=\'email\'/>\r\n			<br><br><input class=buTy_0 id=_tel type=tel required placeholder=\'### ###-####\'/>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_1 type=button value=\'Next\' onclick=\'next(0)\'/>\r\n				</div>\r\n			</div>\r\n		</div>\r\n	</div>\r\n-->\r\n\r\n<script>\r\n	var vault={\r\n		fname:\'\',\r\n		lname:\'\',\r\n		email:\'\',\r\n		tel:\'\',\r\n		\r\n		projname:\'\',\r\n		postal:\'\',\r\n		date:\'\',\r\n		TI:\'\',\r\n		OPT1:\'\',\r\n		OPT2:\'\',\r\n		\r\n		jspace:\'\',\r\n		opsize:\'\',\r\n		uweight:\'\',\r\n		utype:\'\',\r\n		\r\n		notes:\'\'\r\n	},\r\n	istherecurrentlyaframebeingconsidered= false;\r\ntry{\r\n	function closetheframeselectwindow(){\r\n		document.getElementById(\'personalize_frame_frame\').style.opacity= \'0\';\r\n		document.getElementById(\'personalize_frame_frame\').style.visibility= \'hidden\';\r\n		\r\n		document.getElementById(\'fanciest\').style.visibility= \'visible\';\r\n		document.getElementById(\'the_void\').style.opacity= \'0\';\r\n		setTimeout(function(){\r\n			//document.getElementById(\'the_void\').style.visibility= \'hidden\';\r\n			document.getElementById(\'all_of_the_frames_you_can_select_from\').style.visibility= \'visible\';\r\n			document.getElementById(\'the_void\').style.display= \'none\';\r\n		},300);\r\n	}\r\n			function opentheframeselectwindow(){\r\n				//document.getElementById(\'the_void\').style.visibility= \'visible\';\r\n				document.getElementById(\'fanciest\').style.visibility= \'hidden\';\r\n				document.getElementById(\'the_void\').style.display= \'grid\';\r\n				document.getElementById(\'the_void\').style.opacity= \'1\';\r\n			}\r\n	\r\n	function dotheframething(){\r\n		opentheframeselectwindow();\r\n		if(!istherecurrentlyaframebeingconsidered){\r\n			istherecurrentlyaframebeingconsidered= true;\r\n			document.getElementById(\'f2_1_final\').value= \'Submit\';\r\n		} else{\r\n			\r\n		}\r\n	}\r\n	function saveframe(){\r\n		vault.jspace= document.getElementById(\'joist_space\').value;\r\n			vault.opsize= document.getElementById(\'opening_size\').value;\r\n			vault.uweight= document.getElementById(\'unit_weight\').value;\r\n			vault.utype= document.querySelector(\'input[name=\"d\"]:checked\').id;\r\n		\r\n		closetheframeselectwindow();\r\n		document.getElementById(\'frame_1\').style.display= \'block\';\r\n			document.getElementById(\'saved_frame_1\').src= \'./frames/frame (\'+(chosen_frame-1)+\').png\';\r\n			document.getElementById(\'saved_frame_1\').style.width= \'62px\';\r\n	}\r\n	\r\n	function back(a){\r\n		if(a==1){\r\n			document.getElementById(\'disable_1\').style.display= \'grid\';\r\n			document.getElementById(\'disable_1\').style.opacity= \'1\';\r\n			document.getElementById(\'disable_2\').style.opacity= \'0\';\r\n			document.getElementById(\'display_2\').style.display= \'none\'\r\n		}else if(a==2){\r\n			document.getElementById(\'disable_2\').style.display= \'grid\';\r\n			document.getElementById(\'disable_2\').style.opacity= \'1\';\r\n			document.getElementById(\'disable_3\').style.opacity= \'0\';\r\n			document.getElementById(\'display_3\').style.display= \'none\'\r\n		}\r\n	}\r\n	function next(a){\r\n		if(a==0){\r\n			vault.fname= document.getElementById(\'_fname\').value;\r\n			vault.lname= document.getElementById(\'_lname\').value;\r\n			vault.email= document.getElementById(\'_email\').value;\r\n			vault.tel= document.getElementById(\'_tel\').value;\r\n			\r\n			document.getElementById(\'disable_1\').style.display= \'none\';\r\n			document.getElementById(\'disable_2\').style.opacity= \'1\';\r\n		}else if(a==1){\r\n			vault.projname= document.getElementById(\'_projname\').value;\r\n			vault.postal= document.getElementById(\'_postal\').value;\r\n			vault.date= document.getElementById(\'_neededby\').value;\r\n			vault.TI= document.querySelector(\'input[name=\"a\"]:checked\').id;\r\n			vault.OPT1= document.querySelector(\'input[name=\"b\"]:checked\').id;\r\n			vault.OPT2= document.querySelector(\'input[name=\"c\"]:checked\').id;\r\n			\r\n			document.getElementById(\'disable_2\').style.display= \'none\';\r\n			document.getElementById(\'disable_3\').style.opacity= \'1\';\r\n			\r\n			console.log(vault);\r\n		}else if(a==2){\r\n			document.getElementById(\'disable_3\').style.display= \'none\';\r\n			document.getElementById(\'disable_4\').style.opacity= \'1\';\r\n		}\r\n	}\r\n} catch(err){console.log(err);}\r\n	\r\n</script>\r\n\r\n\r\n\r\n\r\n<!--<h1>Let QuickFrames do the take-offs and eliminate your need to detail.</h1>\r\n[contact-form-7 id=\"1936\" title=\"New QuickFrames Quote Form\"]\r\n\r\n\r\nFrom: https://wplearninglab.com/contact-form-7-get-value-from-url/\r\n\r\n<script type=\"text/javascript\">\r\nvar getUrlParameter = function getUrlParameter(sParam) {\r\n    var sPageURL = decodeURIComponent(window.location.search.substring(1)),\r\n        sURLVariables = sPageURL.split(\'&\'),\r\n        sParameterName,\r\n        i;\r\n    for (i = 0; i < sURLVariables.length; i++) {\r\n        sParameterName = sURLVariables[i].split(\'=\');\r\n        if (sParameterName[0] === sParam) {\r\n            return sParameterName[1] === undefined ? true : sParameterName[1];\r\n        }\r\n    }\r\n};\r\n\r\nvar VARIABLE = getUrlParameter(\'PARAMETER\');\r\n\r\nif (VARIABLE != null) {\r\n     document.getElementById(\'INPUT-FIELD-ID\').value = VARIABLE;\r\n}\r\n\r\n</script>\r\n\r\n\r\n<a name=\"quote-a-few-frames\"></a>\r\n\r\n[two_fifth]\r\n<h3>Need Just A Few Frames Quoted?</h3>\r\nIf you are working on a project requiring only a few frames and you know the basic requirements for how they will be used, just fill out the form to the right. We\'ll get a quote back to you within 24 hours or less!\r\n\r\nFor each framed opening, using the <a href=\"#frame-types\"> frame type examples </a> shown below, select the frame type number that most closely matches where the opening will be located relative to the joists/beams and enter that into the <strong>Type</strong> column. While RTUs are shown in these images, they apply to all types of roof top equipment. If none of the images match your configuration, enter (0).\r\n\r\n[responsive] <img class=\"alignright\" src=\"/wp-content/uploads/quote-frame-outline.jpg\" alt=\"Frame Outline Image\" width=\"320\" /> [/responsive]\r\n\r\nIf the framing will <strong>only</strong> support the duct openings and not the curbing, enter the letter (<strong><span style=\"color: #37ade1;\">Y</span></strong>) in the <strong>Duct Only</strong> column. If the framing will support the curbing and equipment, enter the letter (<strong><span style=\"color: #37ade1;\">N</span></strong>).\r\n\r\nSpecify the center-to-center joist/beam spacing as shown by (<strong><span style=\"color: #37ade1;\">A</spacing></strong>) in the image to the right.\r\n\r\nWhen specifying the frame opening size (<strong><span style=\"color: #37ade1;\">B</span></strong>), use the length of the opening running <strong>parallel</strong> to (running with) the joists or beams.\r\n\r\n[responsive] <img class=\"alignright\" src=\"/wp-content/uploads/home-install-after-roof.jpg\" alt=\"Install After Roof Image\" width=\"400\"/> [/responsive]\r\n\r\n[/two_fifth]\r\n\r\n[three_fifth_last]\r\n[contact-form-7 id=\"1036\" title=\"Expanded Quote Request Small\"]\r\n[/three_fifth_last]\r\n\r\n<a name=\"frame-types\"></a>\r\n<h2>Frame Type Examples</h2>\r\n[responsive] <img class=\"alignright\" src=\"/wp-content/uploads/quote-frame-configurations.png\" alt=\"Roof Framing Configurations\" /> [/responsive]\r\n\r\n<a name=\"quote-a-lot-of-frames\"></a>\r\n[divider type=\"space\" margintop=\"0\" marginbottom=\"20\"]\r\n\r\n<h2>Have A Large Or Complex Project? Let Us Do The Take-offs For You!</h2>\r\n[divider type=\"space\" margintop=\"0\" marginbottom=\"10\"]\r\n\r\n[one_third]\r\n[responsive] <img src=\"/wp-content/uploads/drawing-image.jpg\" alt=\"Drawing Image\" /> [/responsive]\r\n[/one_third]\r\n\r\n[two_third_last]\r\nThe simplest way for us to provide you with a customized QuickFrames quotation is for you to allow us to do the take-offs directly from the engineering drawing set.\r\n\r\nWe have developed an extensive database of roof top equipment information, such as sizes, weights, opening dimensions, and structural requirements that allows us to select the optimal roof frames for your applications. All you need to do is to provide us with access to your drawing set and then let us go to work for you. You can also have complete confidence that we treat all drawing sets as proprietary information and we respect the importance of confidentiality for anything you share with us.\r\n\r\nThe easiest way for us to access your files is for you to provide us with an FTP address, login and password. Or, if the file set is small enough, you can also email it to us.\r\n\r\n[contact-form-7 id=\"401\" title=\"Quote Request\"]\r\n\r\n[/two_third_last]-->\r\n','Testing Page','','inherit','closed','closed','','777-revision-v1','','','2020-09-08 03:04:35','2020-09-08 10:04:35','',777,'http://quickframes.miritin.com/777-revision-v1/',0,'revision','',0),(1976,1,'2020-09-08 03:04:59','2020-09-08 10:04:59','<h1>Quote Demo:</h1>\r\n\r\n<style>\r\n\r\n  body{\r\n		font-family:Arial;\r\n	}\r\n\r\n	.Frame_Tool_Img{\r\n		cursor:pointer;\r\n		margin:20px;\r\n		border:2px solid transparent;\r\n		transition:border-color 0.1s linear;\r\n	}\r\n		.Frame_Tool_Img:hover{\r\n			border-color:#79c6e8;\r\n		}\r\n	input{\r\n		text-align:center;\r\n	}\r\n	\r\n	#content_container{\r\n		position:relative;\r\n			left:25vw;\r\n		width:50vw;\r\n			height:100%;\r\n	}\r\n	\r\n	#d{display:none;}\r\n	#tupperware_0{\r\n		grid-area:1 / 1;\r\n		height:100%;\r\n			width:100%;\r\n		display:grid;\r\n			grid-auto-flow:dense;\r\n			grid-template-columns: repeat(7, 1fr);\r\n			grid-template-rows: 500px 500px 500px;\r\n	}\r\n	#tupperware_1{\r\n		grid-area:1 / 1;\r\n		display:none;\r\n	}\r\n	\r\n	#tupperware_2{display:none;}\r\n	\r\n	.coolframebutte{\r\n		width:225px;\r\n		height:auto;\r\n	}\r\n	\r\n\r\n\r\n	#disable_1{\r\n		\r\n	}\r\n	#disable_2,#disable_3,#disable_4{\r\n		opacity:0;\r\n		transition:opacity .25s ease-in-out;\r\n	}\r\n	#disable_4{\r\n		height:7vh;\r\n			width:12vw;\r\n		font-size:2vh;\r\n		top:45vh;\r\n			left:44vw;\r\n	}\r\n\r\n	.fancy{\r\n		width:20vw;\r\n			height:50vh;\r\n			border-radius:10px;\r\n		position:absolute;\r\n			left:25%;\r\n			top:25vh;\r\n		background-color:#eee;\r\n		display:grid;\r\n			grid-auto-columns:100%;\r\n			grid-template-rows:85% 15%;\r\n	}\r\n		#f1{\r\n			backround-color:#fff;\r\n			text-align:center;\r\n		}\r\n		#f2{\r\n			background-color:#bbb;\r\n		}\r\n			#f2_2{\r\n				width:25%;\r\n					height:6%;\r\n				position:absolute;\r\n					left:15%;\r\n					top:90%;\r\n			}\r\n			#f2_1,#f2_1_final{\r\n				width:25%;\r\n					height:6%;\r\n				position:absolute;\r\n					right:15%;\r\n					top:90%;\r\n			}\r\n				.buTy_0{\r\n					height:5%;\r\n						width:65%;\r\n				}\r\n				.buTy_1{\r\n					height:5%;\r\n						width:65%;\r\n				}\r\n				.buTy_2{\r\n					position:absolute;\r\n						width:45%;\r\n						height:23%;\r\n						bottom:18%;\r\n					font-size:80%;\r\n					text-align:left;\r\n					background-color:#fff;\r\n						border:solid #767676 1px;\r\n						border-radius:2px;\r\n				}\r\n					#1_opt_text{\r\n						height:1000%;\r\n					}\r\n					\r\n				#project_type{\r\n					position:relative;\r\n						width:65%;\r\n						height:5%;\r\n						left:17.5%;\r\n					font-size:80%;\r\n					background-color:#fff;\r\n						border:solid #767676 1px;\r\n						border-radius:2px;\r\n				}\r\n\r\n		#cart_area{\r\n			height:65%;\r\n			display:grid;\r\n				grid-template-columns:33% 33% 33%;\r\n				grid-auto-rows:40%;\r\n		}\r\n			.frame_frame_frame{\r\n				\r\n			}\r\n				#frame_add{\r\n					height:24%;\r\n					margin-top:35%;\r\n				}\r\n				.add_frame{\r\n					height:30%;\r\n						width:30%;\r\n					margin-top:25%;\r\n				}\r\n			#_addnotes{\r\n				position:relative;\r\n					width:90%;\r\n					height:10%;\r\n			}\r\n\r\n	#the_void{\r\n		position:absolute;\r\n			top:0;\r\n			left:0;\r\n			z-index:999;\r\n		background-color:rgba(0,0,0,0.6);\r\n		height:100%;\r\n			width:100%;\r\n		display:none;\r\n			grid-template-rows:5% 5% 85% 5%;\r\n			grid-template-columns:5% 90% 5%;\r\n			grid-template-areas:\'. . .\'\r\n								\'. a_fr a_x\'\r\n								\'. a_fr .\'\r\n								\'. . .\';\r\n		opacity:0;\r\n		transition:opacity 0.3s ease-in-out;\r\n	}\r\n		#all_of_the_frames_you_can_select_from{\r\n			grid-area:a_fr;\r\n		}\r\n			#personalize_frame_frame{\r\n				grid-area:a_fr;\r\n				visibility:hidden;\r\n				opacity:0;\r\n				transition:opacity 0.3s ease-in-out;\r\n			}\r\n		#the_little_x_in_the_top_right{\r\n			grid-area:a_x;\r\n				color:#fff;\r\n				font-size:2.4vmax;\r\n				cursor:pointer;\r\n			transition:color .1s linear;\r\n		}\r\n				#the_little_x_in_the_top_right:hover{\r\n					color:#79c6e8;\r\n				}  	\r\n			#customizations{\r\n				position:absolute;\r\n					top:20%;\r\n					height:50%;\r\n					weight:50%;\r\n					left:30%;\r\n				padding:20px;\r\n				border-radius:5px;\r\n				text-align:center;\r\n				background-color:rgba(0,0,0,0.2);\r\n			}\r\n				#bottomofframeoptions{\r\n					position:relative;\r\n						width:100%;\r\n						left:-20px;\r\n						bottom:-20px;\r\n					padding:20px;\r\n					background-color:#bbb;\r\n				}\r\n				#joist_space,#opening_size,#unit_weight{\r\n					height:2.5vh;\r\n					border:none;\r\n					border-left:5px solid transparent;\r\n					transition:border-left 0.2s linear;\r\n				}\r\n				#unit_type{\r\n					color:#fff;\r\n					text-align:left;\r\n				}\r\n			#save_unit{\r\n				width:50%;\r\n					height:2.5vh;\r\n			}\r\n			/*	----------------	*/\r\n	#quickgridthing{\r\n		display:grid;\r\n			grid-template-columns:100%;\r\n			grid-template-areas:100%;\r\n	}\r\n		#grandprize__hori,#grandprize__vert{\r\n			animation:flickercolorselect 1s infinite;\r\n			visibility:hidden;\r\n		}\r\n		.blinking_arrow{\r\n			position:absolute;\r\n				left:10px;\r\n			font-size:1.6vh;\r\n			color:red;\r\n			visibility:hidden;\r\n			animation:flickercolorselect 1s infinite;\r\n		}\r\n	@keyframes flickercolorselect{\r\n		0%{opacity:0;}\r\n		50%{opacity:1;}\r\n		100%{opacity:0;}\r\n	}\r\n	/*\r\n	\r\n	.container_around_selected_frames_in_the_cart_screen{\r\n		\r\n	}\r\n		#rmv_q1{\r\n			color:red;\r\n			border:none;\r\n			background-color:transparent;\r\n			cursor:pointer;\r\n		}\r\n			#rmv_q1:hover{\r\n				text-decoration:underline;\r\n			}\r\n\r\n*/\r\n\r\n</style>\r\n<script>\r\n		var input_last_selected= false;\r\n	function selectoneofthetwoinputspluscolouring(a){\r\n		if(a==\'joist\'){\r\n			if(input_last_selected==\'opening\'){\r\n				//document.getElementById(\'opening_size\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_opening\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__vert\').style.visibility= \'hidden\';\r\n			}\r\n			input_last_selected= \'joist\';\r\n			//document.getElementById(\'joist_space\').style.borderLeftColor= \'red\';\r\n			document.getElementById(\'arrow_for_joist\').style.visibility= \'visible\';\r\n			document.getElementById(\'grandprize__hori\').style.visibility= \'visible\';\r\n		} else if(a==\'opening\'){\r\n			if(input_last_selected==\'joist\'){\r\n				//document.getElementById(\'joist_space\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_joist\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__hori\').style.visibility= \'hidden\';\r\n			}\r\n			input_last_selected= \'opening\';\r\n			//document.getElementById(\'opening_size\').style.borderLeftColor= \'red\';\r\n			document.getElementById(\'arrow_for_opening\').style.visibility= \'visible\';\r\n			document.getElementById(\'grandprize__vert\').style.visibility= \'visible\';\r\n		} else if(!a){\r\n			if(input_last_selected==\'joist\'){\r\n				//document.getElementById(\'joist_space\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_joist\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__hori\').style.visibility= \'hidden\';\r\n			} else if(input_last_selected==\'opening\'){\r\n				//document.getElementById(\'opening_size\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_opening\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__vert\').style.visibility= \'hidden\';\r\n			}\r\n		}\r\n	}\r\n	\r\n		var chosen_frame;\r\n	function choose(a){\r\n			let a6=a.src.length-6,a7=a.src.length-7;\r\n		chosen_frame= parseInt(a.src[a7]!=\'(\'?(a.src[a7]+a.src[a6]):a.src[a6])+1;\r\n		\r\n		//document.getElementById(\'tupperware_0\').style.visibility= \'hidden\';\r\n			//document.getElementById(\'tupperware_1\').style.display= \'block\';\r\n		\r\n		document.getElementById(\'grandprize\').src= \'./frames/dry (\'+(chosen_frame-1)+\').png\';\r\n			setTimeout(function(){document.getElementById(\'grandprize\').style.width= \'375px\';},50);\r\n		\r\n		\r\n		document.getElementById(\'all_of_the_frames_you_can_select_from\').style.visibility= \'hidden\';\r\n		document.getElementById(\'personalize_frame_frame\').style.visibility= \'visible\';\r\n				document.getElementById(\'grandprize__hori\').src= \'./frames/hori (\'+(chosen_frame-1)+\').png\';\r\n				document.getElementById(\'grandprize__vert\').src= \'./frames/vert (\'+(chosen_frame-1)+\').png\';\r\n					setTimeout(function(){\r\n								document.getElementById(\'grandprize__hori\').style.width= \'375px\';\r\n								document.getElementById(\'grandprize__vert\').style.width= \'375px\';\r\n							},50);\r\n			document.getElementById(\'personalize_frame_frame\').style.opacity= \'1\';\r\n		\r\n		if(chosen_frame==3 || chosen_frame==10){\r\n			document.getElementById(\'grandprize__vert\').hidden= true;\r\n			document.getElementById(\'opening_size\').hidden= true;\r\n			document.getElementById(\'arrow_for_opening\').hidden= true;\r\n		} else{\r\n			document.getElementById(\'grandprize__vert\').hidden= false;\r\n			document.getElementById(\'opening_size\').hidden= false;\r\n			document.getElementById(\'arrow_for_opening\').hidden= false;\r\n		}\r\n		\r\n		document.getElementById(\'joist_space\').focus();\r\n		\r\n		\r\n		/*	\r\n		let vHeight= document.getElementById(\'grandprize\').height,\r\n			vWidth= document.getElementById(\'grandprize\').width;\r\n			\r\n		document.getElementById(\'ch_width\').style.left= ((vWidth - document.getElementById(\'ch_width\').style.width)/2)+\'px\';\r\n		*/\r\n	}\r\n	\r\n	function removeitemfromcard(a){\r\n		//add stuff here to remove set image\r\n		document.getElementById(\'frame_\'+a).style.display= \'none\';\r\n	}\r\n	\r\n	\r\n/*\r\n\r\nSUBMIT\r\n- include \'additional notes\' section\r\n- links to plans (URL)\r\n	- OR -\r\n- file upload\r\n- CAPTCHA\r\n\r\n*/\r\n</script>\r\n<!--\r\n		<div id=the_void >\r\n			<div id=personalize_frame_frame >\r\n				<div id=quickgridthing >\r\n					<img class=\'Frame_Tool_Img\' id=grandprize__hori src=\'./blue2.png\' style=\'grid-area:1 / 1;\'>\r\n					<img class=\'Frame_Tool_Img\' id=grandprize__vert src=\'./blue1.png\' style=\'grid-area:1 / 1;\'>\r\n					<img class=\'Frame_Tool_Img\' id=grandprize src=\'\' style=\'grid-area:1 / 1;\'>\r\n				</div>\r\n				<div id=customizations >\r\n				\r\n				<div id=arrow_for_joist class=blinking_arrow >►</div>\r\n				<input id=joist_space type=text placeholder=\'Joist Spacing (in.)\' onfocus=\'selectoneofthetwoinputspluscolouring(\"joist\")\'/>\r\n					\r\n				<br><br>\r\n					<div id=arrow_for_opening class=blinking_arrow >►</div>\r\n				<input id=opening_size type=text placeholder=\'Opening Size (in.)\' onfocus=\'selectoneofthetwoinputspluscolouring(\"opening\")\'/>\r\n					\r\n				<br><br><div id=unit_type onclick=\'selectoneofthetwoinputspluscolouring(false)\'>\r\n						<p style=\'text-align:center;\'>Unit Type:</p>\r\n						<div style=\'\r\n						background-color:#fff;\r\n							border:solid #767676 1px;\r\n							border-radius:2px;\r\n							color:#000;\r\n							font-size:80%;\r\n							padding:5px;\' >\r\n							<input type=radio name=\'d\' id=\'u_opt_1\' value=\'opt1\' onfocus=\'selectoneofthetwoinputspluscolouring(false)\'/><label for=\'u_opt_1\'>RTU/AHU/MAU</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_2\' value=\'opt2\'/><label for=\'u_opt_2\'>EVAP Coolers</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_3\' value=\'opt3\'/><label for=\'u_opt_3\'>Exhaust Fans</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_4\' value=\'opt4\'/><label for=\'u_opt_4\'>Powered Vents</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_5\' value=\'opt5\'/><label for=\'u_opt_5\'>Gravity Vents</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_6\' value=\'opt6\'/><label for=\'u_opt_6\'>Skylights</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_7\' value=\'opt7\'/><label for=\'u_opt_7\'>Roof Drains</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_8\' value=\'opt8\'/><label for=\'u_opt_8\'>Roof Hatch</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_9\' value=\'opt9\'/><label for=\'u_opt_9\'>Floor Openings</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_text\' value=\'opt10\'/><input id=\'u_opt_text\' style=\'width:65%\' type=text placeholder=\'Other\'/>\r\n						</div>\r\n					</div>\r\n					\r\n			<br><br><input id=unit_weight type=text placeholder=\'Unit Weight (lbs.)\' onfocus=\'selectoneofthetwoinputspluscolouring(false)\'/>\r\n					\r\n	<br><br><div id=bottomofframeoptions >\r\n				<input id=save_unit type=button value=\'Add to Cart\' onclick=\'saveframe()\' onfocus=\'selectoneofthetwoinputspluscolouring(false)\'/>\r\n			</div>\r\n				</div>\r\n			</div>\r\n			<div id=all_of_the_frames_you_can_select_from >\r\n				\r\n				<div id=fr_double >\r\n					<img src=\'./frames/frame (0).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (1).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (2).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (5).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (6).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (9).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n				</div>\r\n				<div id=fr_triple >\r\n					<img src=\'./frames/frame (3).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (4).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (7).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (8).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (11).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n				</div>\r\n				<div id=fr_quad >\r\n					<img src=\'./frames/frame (10).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (12).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n				</div>\r\n				\r\n			</div>\r\n			<div id=the_little_x_in_the_top_right onclick=\'closetheframeselectwindow()\'>X</div>\r\n		</div>\r\n	<div id=content_container >\r\n		<div id=fanciest >\r\n			<div class=fancy id=disable_5 >\r\n				<p style=\'text-align:center;\'>Thank you for submitting!</p>\r\n				<input style=\'height:2.5vh;width:5vw;margin-top:32%;margin-left:3.5vw;\' type=button value=\'Return\' onclick=\'location.reload()\' />\r\n			</div>\r\n			<div class=fancy id=disable_4 >\r\n				<div id=f1 >\r\n					<input type=text id=_addnotes placeholder=\'Additional Notes\'>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_2 type=button value=\'Back\' onclick=\'back(2)\'>\r\n					<input id=f2_1_final type=button value=\'Skip\' onclick=\'next(2)\'>\r\n				</div>\r\n			</div>\r\n			<div class=fancy id=disable_3 >\r\n				<div id=f1 >\r\n					<h1>Cart:</h1>\r\n					<div id=cart_area >\r\n						<div class=container_around_selected_frames_in_the_cart_screen id=frame_1 style=\'display:none;\'>\r\n							<img id=saved_frame_1 src=\'\'>\r\n							<div>Qty: \r\n							<select id=quant_1 >\r\n								<option value=\'1\'>1</option>\r\n								<option value=\'2\'>2</option>\r\n								<option value=\'3\'>3</option>\r\n								<option value=\'4\'>4</option>\r\n								<option value=\'5\'>5</option>\r\n								<option value=\'6\'>6</option>\r\n								<option value=\'7\'>7</option>\r\n								<option value=\'8\'>8</option>\r\n								<option value=\'9\'>9</option>\r\n								<option value=\'10\'>10+</option>\r\n							</select></div>\r\n						<br>\r\n							<input id=rmv_q1 type=button value=\'Delete\' onclick=\'removeitemfromcard(1)\'/>\r\n						</div>\r\n						<div><input id=frame_add type=button value=\'Add Frame\' onclick=\'dotheframething()\'/></div>\r\n					</div>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_2 type=button value=\'Back\' onclick=\'back(2)\'>\r\n					<input id=f2_1_final type=button value=\'Skip\' onclick=\'next(2)\'/>\r\n				</div>\r\n			</div>\r\n			<div class=fancy id=disable_2 >\r\n				<div id=f1 >\r\n					<h1>Project Info:</h1>\r\n			<br>	<input class=buTy_0 id=\'_projname\' type=text placeholder=\'project name\'/>\r\n			<br><br><input class=buTy_0 id=\'_postal\' type=postalcode placeholder=\'zip/postal code\'/>\r\n			<br><br><input class=buTy_0 id=\'_neededby\' type=text placeholder=\'frames needed by  (e.g. 01/01/2021)\'/>\r\n			<br><br><form id=project_type >\r\n						<input type=radio name=\'a\' id=\'newmodel\' value=\'NewModel\'/><label for=\'newmodel\'>New Build</label>\r\n						<input type=radio name=\'a\' id=\'TI\' value=\'Newbuild/TI\'/><label for=\'TI\'>Remodel/T.I.</label>\r\n					</form>\r\n						<p style=\'position:relative;left:-25%;top:6%;\'>Roof Material:</p>\r\n					<div class=buTy_2 style=\'left:2%\'>\r\n						<input type=radio name=\'b\' id=\'1_opt_1\' value=\'opt1\'/><label for=\'1_opt_1\'>Steel Deck</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_2\' value=\'opt2\'/><label for=\'1_opt_2\'>Panelized Wood</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_3\' value=\'opt3\'/><label for=\'1_opt_3\'>Concrete</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_4\' value=\'opt4\'/><label for=\'1_opt_4\'>Gypcrete</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_5\' value=\'opt5\'/><input id=\'1_opt_text\' style=\'width:65%\' type=text placeholder=\'Other\'/>\r\n					</div>\r\n						<p style=\'position:relative;right:-25%;top:-2%;\'>Roof Structure:</p>\r\n					<div class=buTy_2 style=\'right:2%;\'>\r\n						<input type=radio name=\'c\' id=\'2_opt_1\' value=\'opt1\'/><label for=\'2_opt_1\'>Steel Joists/Beams</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_2\' value=\'opt2\'/><label for=\'2_opt_2\'>PEMB Purlins</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_3\' value=\'opt3\'/><label for=\'2_opt_3\'>Hybrid</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_4\' value=\'opt4\'/><label for=\'2_opt_4\'>Wood Trusses</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_5\' value=\'opt5\'/><input id=\'2_opt_text\' style=\'width:65%\' type=text placeholder=\'Other\'/>\r\n					</div>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_2 type=button value=\'Back\' onclick=\'back(1)\'>\r\n					<input id=f2_1 type=button value=\'Next\' onclick=\'next(1)\'/>\r\n				</div>\r\n			</div>\r\n			<div class=fancy id=disable_1 >\r\n				<div id=f1 >\r\n					<h1>Customer Info:</h1>\r\n			<br><br><input class=buTy_0 id=_fname type=text required placeholder=\'first name\'/>\r\n			<br><br><input class=buTy_0 id=_lname type=text required placeholder=\'last name\'/>\r\n			<br><br><input class=buTy_0 id=_email type=email required placeholder=\'email\'/>\r\n			<br><br><input class=buTy_0 id=_tel type=tel required placeholder=\'### ###-####\'/>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_1 type=button value=\'Next\' onclick=\'next(0)\'/>\r\n				</div>\r\n			</div>\r\n		</div>\r\n	</div>\r\n-->\r\n\r\n<script>\r\n	var vault={\r\n		fname:\'\',\r\n		lname:\'\',\r\n		email:\'\',\r\n		tel:\'\',\r\n		\r\n		projname:\'\',\r\n		postal:\'\',\r\n		date:\'\',\r\n		TI:\'\',\r\n		OPT1:\'\',\r\n		OPT2:\'\',\r\n		\r\n		jspace:\'\',\r\n		opsize:\'\',\r\n		uweight:\'\',\r\n		utype:\'\',\r\n		\r\n		notes:\'\'\r\n	},\r\n	istherecurrentlyaframebeingconsidered= false;\r\ntry{\r\n	function closetheframeselectwindow(){\r\n		document.getElementById(\'personalize_frame_frame\').style.opacity= \'0\';\r\n		document.getElementById(\'personalize_frame_frame\').style.visibility= \'hidden\';\r\n		\r\n		document.getElementById(\'fanciest\').style.visibility= \'visible\';\r\n		document.getElementById(\'the_void\').style.opacity= \'0\';\r\n		setTimeout(function(){\r\n			//document.getElementById(\'the_void\').style.visibility= \'hidden\';\r\n			document.getElementById(\'all_of_the_frames_you_can_select_from\').style.visibility= \'visible\';\r\n			document.getElementById(\'the_void\').style.display= \'none\';\r\n		},300);\r\n	}\r\n			function opentheframeselectwindow(){\r\n				//document.getElementById(\'the_void\').style.visibility= \'visible\';\r\n				document.getElementById(\'fanciest\').style.visibility= \'hidden\';\r\n				document.getElementById(\'the_void\').style.display= \'grid\';\r\n				document.getElementById(\'the_void\').style.opacity= \'1\';\r\n			}\r\n	\r\n	function dotheframething(){\r\n		opentheframeselectwindow();\r\n		if(!istherecurrentlyaframebeingconsidered){\r\n			istherecurrentlyaframebeingconsidered= true;\r\n			document.getElementById(\'f2_1_final\').value= \'Submit\';\r\n		} else{\r\n			\r\n		}\r\n	}\r\n	function saveframe(){\r\n		vault.jspace= document.getElementById(\'joist_space\').value;\r\n			vault.opsize= document.getElementById(\'opening_size\').value;\r\n			vault.uweight= document.getElementById(\'unit_weight\').value;\r\n			vault.utype= document.querySelector(\'input[name=\"d\"]:checked\').id;\r\n		\r\n		closetheframeselectwindow();\r\n		document.getElementById(\'frame_1\').style.display= \'block\';\r\n			document.getElementById(\'saved_frame_1\').src= \'./frames/frame (\'+(chosen_frame-1)+\').png\';\r\n			document.getElementById(\'saved_frame_1\').style.width= \'62px\';\r\n	}\r\n	\r\n	function back(a){\r\n		if(a==1){\r\n			document.getElementById(\'disable_1\').style.display= \'grid\';\r\n			document.getElementById(\'disable_1\').style.opacity= \'1\';\r\n			document.getElementById(\'disable_2\').style.opacity= \'0\';\r\n			document.getElementById(\'display_2\').style.display= \'none\'\r\n		}else if(a==2){\r\n			document.getElementById(\'disable_2\').style.display= \'grid\';\r\n			document.getElementById(\'disable_2\').style.opacity= \'1\';\r\n			document.getElementById(\'disable_3\').style.opacity= \'0\';\r\n			document.getElementById(\'display_3\').style.display= \'none\'\r\n		}\r\n	}\r\n	function next(a){\r\n		if(a==0){\r\n			vault.fname= document.getElementById(\'_fname\').value;\r\n			vault.lname= document.getElementById(\'_lname\').value;\r\n			vault.email= document.getElementById(\'_email\').value;\r\n			vault.tel= document.getElementById(\'_tel\').value;\r\n			\r\n			document.getElementById(\'disable_1\').style.display= \'none\';\r\n			document.getElementById(\'disable_2\').style.opacity= \'1\';\r\n		}else if(a==1){\r\n			vault.projname= document.getElementById(\'_projname\').value;\r\n			vault.postal= document.getElementById(\'_postal\').value;\r\n			vault.date= document.getElementById(\'_neededby\').value;\r\n			vault.TI= document.querySelector(\'input[name=\"a\"]:checked\').id;\r\n			vault.OPT1= document.querySelector(\'input[name=\"b\"]:checked\').id;\r\n			vault.OPT2= document.querySelector(\'input[name=\"c\"]:checked\').id;\r\n			\r\n			document.getElementById(\'disable_2\').style.display= \'none\';\r\n			document.getElementById(\'disable_3\').style.opacity= \'1\';\r\n			\r\n			console.log(vault);\r\n		}else if(a==2){\r\n			document.getElementById(\'disable_3\').style.display= \'none\';\r\n			document.getElementById(\'disable_4\').style.opacity= \'1\';\r\n		}\r\n	}\r\n} catch(err){console.log(err);}\r\n	\r\n</script>\r\n\r\n\r\n\r\n\r\n<!--<h1>Let QuickFrames do the take-offs and eliminate your need to detail.</h1>\r\n[contact-form-7 id=\"1936\" title=\"New QuickFrames Quote Form\"]\r\n\r\n\r\nFrom: https://wplearninglab.com/contact-form-7-get-value-from-url/\r\n\r\n<script type=\"text/javascript\">\r\nvar getUrlParameter = function getUrlParameter(sParam) {\r\n    var sPageURL = decodeURIComponent(window.location.search.substring(1)),\r\n        sURLVariables = sPageURL.split(\'&\'),\r\n        sParameterName,\r\n        i;\r\n    for (i = 0; i < sURLVariables.length; i++) {\r\n        sParameterName = sURLVariables[i].split(\'=\');\r\n        if (sParameterName[0] === sParam) {\r\n            return sParameterName[1] === undefined ? true : sParameterName[1];\r\n        }\r\n    }\r\n};\r\n\r\nvar VARIABLE = getUrlParameter(\'PARAMETER\');\r\n\r\nif (VARIABLE != null) {\r\n     document.getElementById(\'INPUT-FIELD-ID\').value = VARIABLE;\r\n}\r\n\r\n</script>\r\n\r\n\r\n<a name=\"quote-a-few-frames\"></a>\r\n\r\n[two_fifth]\r\n<h3>Need Just A Few Frames Quoted?</h3>\r\nIf you are working on a project requiring only a few frames and you know the basic requirements for how they will be used, just fill out the form to the right. We\'ll get a quote back to you within 24 hours or less!\r\n\r\nFor each framed opening, using the <a href=\"#frame-types\"> frame type examples </a> shown below, select the frame type number that most closely matches where the opening will be located relative to the joists/beams and enter that into the <strong>Type</strong> column. While RTUs are shown in these images, they apply to all types of roof top equipment. If none of the images match your configuration, enter (0).\r\n\r\n[responsive] <img class=\"alignright\" src=\"/wp-content/uploads/quote-frame-outline.jpg\" alt=\"Frame Outline Image\" width=\"320\" /> [/responsive]\r\n\r\nIf the framing will <strong>only</strong> support the duct openings and not the curbing, enter the letter (<strong><span style=\"color: #37ade1;\">Y</span></strong>) in the <strong>Duct Only</strong> column. If the framing will support the curbing and equipment, enter the letter (<strong><span style=\"color: #37ade1;\">N</span></strong>).\r\n\r\nSpecify the center-to-center joist/beam spacing as shown by (<strong><span style=\"color: #37ade1;\">A</spacing></strong>) in the image to the right.\r\n\r\nWhen specifying the frame opening size (<strong><span style=\"color: #37ade1;\">B</span></strong>), use the length of the opening running <strong>parallel</strong> to (running with) the joists or beams.\r\n\r\n[responsive] <img class=\"alignright\" src=\"/wp-content/uploads/home-install-after-roof.jpg\" alt=\"Install After Roof Image\" width=\"400\"/> [/responsive]\r\n\r\n[/two_fifth]\r\n\r\n[three_fifth_last]\r\n[contact-form-7 id=\"1036\" title=\"Expanded Quote Request Small\"]\r\n[/three_fifth_last]\r\n\r\n<a name=\"frame-types\"></a>\r\n<h2>Frame Type Examples</h2>\r\n[responsive] <img class=\"alignright\" src=\"/wp-content/uploads/quote-frame-configurations.png\" alt=\"Roof Framing Configurations\" /> [/responsive]\r\n\r\n<a name=\"quote-a-lot-of-frames\"></a>\r\n[divider type=\"space\" margintop=\"0\" marginbottom=\"20\"]\r\n\r\n<h2>Have A Large Or Complex Project? Let Us Do The Take-offs For You!</h2>\r\n[divider type=\"space\" margintop=\"0\" marginbottom=\"10\"]\r\n\r\n[one_third]\r\n[responsive] <img src=\"/wp-content/uploads/drawing-image.jpg\" alt=\"Drawing Image\" /> [/responsive]\r\n[/one_third]\r\n\r\n[two_third_last]\r\nThe simplest way for us to provide you with a customized QuickFrames quotation is for you to allow us to do the take-offs directly from the engineering drawing set.\r\n\r\nWe have developed an extensive database of roof top equipment information, such as sizes, weights, opening dimensions, and structural requirements that allows us to select the optimal roof frames for your applications. All you need to do is to provide us with access to your drawing set and then let us go to work for you. You can also have complete confidence that we treat all drawing sets as proprietary information and we respect the importance of confidentiality for anything you share with us.\r\n\r\nThe easiest way for us to access your files is for you to provide us with an FTP address, login and password. Or, if the file set is small enough, you can also email it to us.\r\n\r\n[contact-form-7 id=\"401\" title=\"Quote Request\"]\r\n\r\n[/two_third_last]-->\r\n','Testing Page','','inherit','closed','closed','','777-revision-v1','','','2020-09-08 03:04:59','2020-09-08 10:04:59','',777,'http://quickframes.miritin.com/777-revision-v1/',0,'revision','',0),(1977,1,'2020-09-08 03:05:19','2020-09-08 10:05:19','<h1>Quote Demo:</h1>\r\n\r\n<style>\r\n\r\n  body{\r\n		font-family:Arial;\r\n	}\r\n\r\n	.Frame_Tool_Img{\r\n		cursor:pointer;\r\n		margin:20px;\r\n		border:2px solid transparent;\r\n		transition:border-color 0.1s linear;\r\n	}\r\n		.Frame_Tool_Img:hover{\r\n			border-color:#79c6e8;\r\n		}\r\n	input{\r\n		text-align:center;\r\n	}\r\n	\r\n	#content_container{\r\n		position:relative;\r\n			left:25vw;\r\n		width:50vw;\r\n			height:100%;\r\n	}\r\n	\r\n	#d{display:none;}\r\n	#tupperware_0{\r\n		grid-area:1 / 1;\r\n		height:100%;\r\n			width:100%;\r\n		display:grid;\r\n			grid-auto-flow:dense;\r\n			grid-template-columns: repeat(7, 1fr);\r\n			grid-template-rows: 500px 500px 500px;\r\n	}\r\n	#tupperware_1{\r\n		grid-area:1 / 1;\r\n		display:none;\r\n	}\r\n	\r\n	#tupperware_2{display:none;}\r\n	\r\n	.coolframebutte{\r\n		width:225px;\r\n		height:auto;\r\n	}\r\n	\r\n\r\n\r\n	#disable_1{\r\n		\r\n	}\r\n	#disable_2,#disable_3,#disable_4{\r\n		opacity:0;\r\n		transition:opacity .25s ease-in-out;\r\n	}\r\n	#disable_4{\r\n		height:7vh;\r\n			width:12vw;\r\n		font-size:2vh;\r\n		top:45vh;\r\n			left:44vw;\r\n	}\r\n\r\n	.fancy{\r\n		width:20vw;\r\n			height:50vh;\r\n			border-radius:10px;\r\n		position:absolute;\r\n			left:25%;\r\n			top:25vh;\r\n		background-color:#eee;\r\n		display:grid;\r\n			grid-auto-columns:100%;\r\n			grid-template-rows:85% 15%;\r\n	}\r\n		#f1{\r\n			backround-color:#fff;\r\n			text-align:center;\r\n		}\r\n		#f2{\r\n			background-color:#bbb;\r\n		}\r\n			#f2_2{\r\n				width:25%;\r\n					height:6%;\r\n				position:absolute;\r\n					left:15%;\r\n					top:90%;\r\n			}\r\n			#f2_1,#f2_1_final{\r\n				width:25%;\r\n					height:6%;\r\n				position:absolute;\r\n					right:15%;\r\n					top:90%;\r\n			}\r\n				.buTy_0{\r\n					height:5%;\r\n						width:65%;\r\n				}\r\n				.buTy_1{\r\n					height:5%;\r\n						width:65%;\r\n				}\r\n				.buTy_2{\r\n					position:absolute;\r\n						width:45%;\r\n						height:23%;\r\n						bottom:18%;\r\n					font-size:80%;\r\n					text-align:left;\r\n					background-color:#fff;\r\n						border:solid #767676 1px;\r\n						border-radius:2px;\r\n				}\r\n					#1_opt_text{\r\n						height:1000%;\r\n					}\r\n					\r\n				#project_type{\r\n					position:relative;\r\n						width:65%;\r\n						height:5%;\r\n						left:17.5%;\r\n					font-size:80%;\r\n					background-color:#fff;\r\n						border:solid #767676 1px;\r\n						border-radius:2px;\r\n				}\r\n\r\n		#cart_area{\r\n			height:65%;\r\n			display:grid;\r\n				grid-template-columns:33% 33% 33%;\r\n				grid-auto-rows:40%;\r\n		}\r\n			.frame_frame_frame{\r\n				\r\n			}\r\n				#frame_add{\r\n					height:24%;\r\n					margin-top:35%;\r\n				}\r\n				.add_frame{\r\n					height:30%;\r\n						width:30%;\r\n					margin-top:25%;\r\n				}\r\n			#_addnotes{\r\n				position:relative;\r\n					width:90%;\r\n					height:10%;\r\n			}\r\n\r\n	#the_void{\r\n		position:absolute;\r\n			top:0;\r\n			left:0;\r\n			z-index:999;\r\n		background-color:rgba(0,0,0,0.6);\r\n		height:100%;\r\n			width:100%;\r\n		display:none;\r\n			grid-template-rows:5% 5% 85% 5%;\r\n			grid-template-columns:5% 90% 5%;\r\n			grid-template-areas:\'. . .\'\r\n								\'. a_fr a_x\'\r\n								\'. a_fr .\'\r\n								\'. . .\';\r\n		opacity:0;\r\n		transition:opacity 0.3s ease-in-out;\r\n	}\r\n		#all_of_the_frames_you_can_select_from{\r\n			grid-area:a_fr;\r\n		}\r\n			#personalize_frame_frame{\r\n				grid-area:a_fr;\r\n				visibility:hidden;\r\n				opacity:0;\r\n				transition:opacity 0.3s ease-in-out;\r\n			}\r\n		#the_little_x_in_the_top_right{\r\n			grid-area:a_x;\r\n				color:#fff;\r\n				font-size:2.4vmax;\r\n				cursor:pointer;\r\n			transition:color .1s linear;\r\n		}\r\n				#the_little_x_in_the_top_right:hover{\r\n					color:#79c6e8;\r\n				}  	\r\n			#customizations{\r\n				position:absolute;\r\n					top:20%;\r\n					height:50%;\r\n					weight:50%;\r\n					left:30%;\r\n				padding:20px;\r\n				border-radius:5px;\r\n				text-align:center;\r\n				background-color:rgba(0,0,0,0.2);\r\n			}\r\n				#bottomofframeoptions{\r\n					position:relative;\r\n						width:100%;\r\n						left:-20px;\r\n						bottom:-20px;\r\n					padding:20px;\r\n					background-color:#bbb;\r\n				}\r\n				#joist_space,#opening_size,#unit_weight{\r\n					height:2.5vh;\r\n					border:none;\r\n					border-left:5px solid transparent;\r\n					transition:border-left 0.2s linear;\r\n				}\r\n				#unit_type{\r\n					color:#fff;\r\n					text-align:left;\r\n				}\r\n			#save_unit{\r\n				width:50%;\r\n					height:2.5vh;\r\n			}\r\n			\r\n	#quickgridthing{\r\n		display:grid;\r\n			grid-template-columns:100%;\r\n			grid-template-areas:100%;\r\n	}\r\n		#grandprize__hori,#grandprize__vert{\r\n			animation:flickercolorselect 1s infinite;\r\n			visibility:hidden;\r\n		}\r\n		.blinking_arrow{\r\n			position:absolute;\r\n				left:10px;\r\n			font-size:1.6vh;\r\n			color:red;\r\n			visibility:hidden;\r\n			animation:flickercolorselect 1s infinite;\r\n		}\r\n	@keyframes flickercolorselect{\r\n		0%{opacity:0;}\r\n		50%{opacity:1;}\r\n		100%{opacity:0;}\r\n	}\r\n	/*	----------------	*/\r\n	\r\n	.container_around_selected_frames_in_the_cart_screen{\r\n		\r\n	}\r\n		#rmv_q1{\r\n			color:red;\r\n			border:none;\r\n			background-color:transparent;\r\n			cursor:pointer;\r\n		}\r\n			#rmv_q1:hover{\r\n				text-decoration:underline;\r\n			}\r\n/*\r\n*/\r\n\r\n</style>\r\n<script>\r\n		var input_last_selected= false;\r\n	function selectoneofthetwoinputspluscolouring(a){\r\n		if(a==\'joist\'){\r\n			if(input_last_selected==\'opening\'){\r\n				//document.getElementById(\'opening_size\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_opening\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__vert\').style.visibility= \'hidden\';\r\n			}\r\n			input_last_selected= \'joist\';\r\n			//document.getElementById(\'joist_space\').style.borderLeftColor= \'red\';\r\n			document.getElementById(\'arrow_for_joist\').style.visibility= \'visible\';\r\n			document.getElementById(\'grandprize__hori\').style.visibility= \'visible\';\r\n		} else if(a==\'opening\'){\r\n			if(input_last_selected==\'joist\'){\r\n				//document.getElementById(\'joist_space\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_joist\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__hori\').style.visibility= \'hidden\';\r\n			}\r\n			input_last_selected= \'opening\';\r\n			//document.getElementById(\'opening_size\').style.borderLeftColor= \'red\';\r\n			document.getElementById(\'arrow_for_opening\').style.visibility= \'visible\';\r\n			document.getElementById(\'grandprize__vert\').style.visibility= \'visible\';\r\n		} else if(!a){\r\n			if(input_last_selected==\'joist\'){\r\n				//document.getElementById(\'joist_space\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_joist\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__hori\').style.visibility= \'hidden\';\r\n			} else if(input_last_selected==\'opening\'){\r\n				//document.getElementById(\'opening_size\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_opening\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__vert\').style.visibility= \'hidden\';\r\n			}\r\n		}\r\n	}\r\n	\r\n		var chosen_frame;\r\n	function choose(a){\r\n			let a6=a.src.length-6,a7=a.src.length-7;\r\n		chosen_frame= parseInt(a.src[a7]!=\'(\'?(a.src[a7]+a.src[a6]):a.src[a6])+1;\r\n		\r\n		//document.getElementById(\'tupperware_0\').style.visibility= \'hidden\';\r\n			//document.getElementById(\'tupperware_1\').style.display= \'block\';\r\n		\r\n		document.getElementById(\'grandprize\').src= \'./frames/dry (\'+(chosen_frame-1)+\').png\';\r\n			setTimeout(function(){document.getElementById(\'grandprize\').style.width= \'375px\';},50);\r\n		\r\n		\r\n		document.getElementById(\'all_of_the_frames_you_can_select_from\').style.visibility= \'hidden\';\r\n		document.getElementById(\'personalize_frame_frame\').style.visibility= \'visible\';\r\n				document.getElementById(\'grandprize__hori\').src= \'./frames/hori (\'+(chosen_frame-1)+\').png\';\r\n				document.getElementById(\'grandprize__vert\').src= \'./frames/vert (\'+(chosen_frame-1)+\').png\';\r\n					setTimeout(function(){\r\n								document.getElementById(\'grandprize__hori\').style.width= \'375px\';\r\n								document.getElementById(\'grandprize__vert\').style.width= \'375px\';\r\n							},50);\r\n			document.getElementById(\'personalize_frame_frame\').style.opacity= \'1\';\r\n		\r\n		if(chosen_frame==3 || chosen_frame==10){\r\n			document.getElementById(\'grandprize__vert\').hidden= true;\r\n			document.getElementById(\'opening_size\').hidden= true;\r\n			document.getElementById(\'arrow_for_opening\').hidden= true;\r\n		} else{\r\n			document.getElementById(\'grandprize__vert\').hidden= false;\r\n			document.getElementById(\'opening_size\').hidden= false;\r\n			document.getElementById(\'arrow_for_opening\').hidden= false;\r\n		}\r\n		\r\n		document.getElementById(\'joist_space\').focus();\r\n		\r\n		\r\n		/*	\r\n		let vHeight= document.getElementById(\'grandprize\').height,\r\n			vWidth= document.getElementById(\'grandprize\').width;\r\n			\r\n		document.getElementById(\'ch_width\').style.left= ((vWidth - document.getElementById(\'ch_width\').style.width)/2)+\'px\';\r\n		*/\r\n	}\r\n	\r\n	function removeitemfromcard(a){\r\n		//add stuff here to remove set image\r\n		document.getElementById(\'frame_\'+a).style.display= \'none\';\r\n	}\r\n	\r\n	\r\n/*\r\n\r\nSUBMIT\r\n- include \'additional notes\' section\r\n- links to plans (URL)\r\n	- OR -\r\n- file upload\r\n- CAPTCHA\r\n\r\n*/\r\n</script>\r\n<!--\r\n		<div id=the_void >\r\n			<div id=personalize_frame_frame >\r\n				<div id=quickgridthing >\r\n					<img class=\'Frame_Tool_Img\' id=grandprize__hori src=\'./blue2.png\' style=\'grid-area:1 / 1;\'>\r\n					<img class=\'Frame_Tool_Img\' id=grandprize__vert src=\'./blue1.png\' style=\'grid-area:1 / 1;\'>\r\n					<img class=\'Frame_Tool_Img\' id=grandprize src=\'\' style=\'grid-area:1 / 1;\'>\r\n				</div>\r\n				<div id=customizations >\r\n				\r\n				<div id=arrow_for_joist class=blinking_arrow >►</div>\r\n				<input id=joist_space type=text placeholder=\'Joist Spacing (in.)\' onfocus=\'selectoneofthetwoinputspluscolouring(\"joist\")\'/>\r\n					\r\n				<br><br>\r\n					<div id=arrow_for_opening class=blinking_arrow >►</div>\r\n				<input id=opening_size type=text placeholder=\'Opening Size (in.)\' onfocus=\'selectoneofthetwoinputspluscolouring(\"opening\")\'/>\r\n					\r\n				<br><br><div id=unit_type onclick=\'selectoneofthetwoinputspluscolouring(false)\'>\r\n						<p style=\'text-align:center;\'>Unit Type:</p>\r\n						<div style=\'\r\n						background-color:#fff;\r\n							border:solid #767676 1px;\r\n							border-radius:2px;\r\n							color:#000;\r\n							font-size:80%;\r\n							padding:5px;\' >\r\n							<input type=radio name=\'d\' id=\'u_opt_1\' value=\'opt1\' onfocus=\'selectoneofthetwoinputspluscolouring(false)\'/><label for=\'u_opt_1\'>RTU/AHU/MAU</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_2\' value=\'opt2\'/><label for=\'u_opt_2\'>EVAP Coolers</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_3\' value=\'opt3\'/><label for=\'u_opt_3\'>Exhaust Fans</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_4\' value=\'opt4\'/><label for=\'u_opt_4\'>Powered Vents</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_5\' value=\'opt5\'/><label for=\'u_opt_5\'>Gravity Vents</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_6\' value=\'opt6\'/><label for=\'u_opt_6\'>Skylights</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_7\' value=\'opt7\'/><label for=\'u_opt_7\'>Roof Drains</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_8\' value=\'opt8\'/><label for=\'u_opt_8\'>Roof Hatch</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_9\' value=\'opt9\'/><label for=\'u_opt_9\'>Floor Openings</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_text\' value=\'opt10\'/><input id=\'u_opt_text\' style=\'width:65%\' type=text placeholder=\'Other\'/>\r\n						</div>\r\n					</div>\r\n					\r\n			<br><br><input id=unit_weight type=text placeholder=\'Unit Weight (lbs.)\' onfocus=\'selectoneofthetwoinputspluscolouring(false)\'/>\r\n					\r\n	<br><br><div id=bottomofframeoptions >\r\n				<input id=save_unit type=button value=\'Add to Cart\' onclick=\'saveframe()\' onfocus=\'selectoneofthetwoinputspluscolouring(false)\'/>\r\n			</div>\r\n				</div>\r\n			</div>\r\n			<div id=all_of_the_frames_you_can_select_from >\r\n				\r\n				<div id=fr_double >\r\n					<img src=\'./frames/frame (0).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (1).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (2).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (5).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (6).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (9).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n				</div>\r\n				<div id=fr_triple >\r\n					<img src=\'./frames/frame (3).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (4).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (7).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (8).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (11).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n				</div>\r\n				<div id=fr_quad >\r\n					<img src=\'./frames/frame (10).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (12).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n				</div>\r\n				\r\n			</div>\r\n			<div id=the_little_x_in_the_top_right onclick=\'closetheframeselectwindow()\'>X</div>\r\n		</div>\r\n	<div id=content_container >\r\n		<div id=fanciest >\r\n			<div class=fancy id=disable_5 >\r\n				<p style=\'text-align:center;\'>Thank you for submitting!</p>\r\n				<input style=\'height:2.5vh;width:5vw;margin-top:32%;margin-left:3.5vw;\' type=button value=\'Return\' onclick=\'location.reload()\' />\r\n			</div>\r\n			<div class=fancy id=disable_4 >\r\n				<div id=f1 >\r\n					<input type=text id=_addnotes placeholder=\'Additional Notes\'>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_2 type=button value=\'Back\' onclick=\'back(2)\'>\r\n					<input id=f2_1_final type=button value=\'Skip\' onclick=\'next(2)\'>\r\n				</div>\r\n			</div>\r\n			<div class=fancy id=disable_3 >\r\n				<div id=f1 >\r\n					<h1>Cart:</h1>\r\n					<div id=cart_area >\r\n						<div class=container_around_selected_frames_in_the_cart_screen id=frame_1 style=\'display:none;\'>\r\n							<img id=saved_frame_1 src=\'\'>\r\n							<div>Qty: \r\n							<select id=quant_1 >\r\n								<option value=\'1\'>1</option>\r\n								<option value=\'2\'>2</option>\r\n								<option value=\'3\'>3</option>\r\n								<option value=\'4\'>4</option>\r\n								<option value=\'5\'>5</option>\r\n								<option value=\'6\'>6</option>\r\n								<option value=\'7\'>7</option>\r\n								<option value=\'8\'>8</option>\r\n								<option value=\'9\'>9</option>\r\n								<option value=\'10\'>10+</option>\r\n							</select></div>\r\n						<br>\r\n							<input id=rmv_q1 type=button value=\'Delete\' onclick=\'removeitemfromcard(1)\'/>\r\n						</div>\r\n						<div><input id=frame_add type=button value=\'Add Frame\' onclick=\'dotheframething()\'/></div>\r\n					</div>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_2 type=button value=\'Back\' onclick=\'back(2)\'>\r\n					<input id=f2_1_final type=button value=\'Skip\' onclick=\'next(2)\'/>\r\n				</div>\r\n			</div>\r\n			<div class=fancy id=disable_2 >\r\n				<div id=f1 >\r\n					<h1>Project Info:</h1>\r\n			<br>	<input class=buTy_0 id=\'_projname\' type=text placeholder=\'project name\'/>\r\n			<br><br><input class=buTy_0 id=\'_postal\' type=postalcode placeholder=\'zip/postal code\'/>\r\n			<br><br><input class=buTy_0 id=\'_neededby\' type=text placeholder=\'frames needed by  (e.g. 01/01/2021)\'/>\r\n			<br><br><form id=project_type >\r\n						<input type=radio name=\'a\' id=\'newmodel\' value=\'NewModel\'/><label for=\'newmodel\'>New Build</label>\r\n						<input type=radio name=\'a\' id=\'TI\' value=\'Newbuild/TI\'/><label for=\'TI\'>Remodel/T.I.</label>\r\n					</form>\r\n						<p style=\'position:relative;left:-25%;top:6%;\'>Roof Material:</p>\r\n					<div class=buTy_2 style=\'left:2%\'>\r\n						<input type=radio name=\'b\' id=\'1_opt_1\' value=\'opt1\'/><label for=\'1_opt_1\'>Steel Deck</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_2\' value=\'opt2\'/><label for=\'1_opt_2\'>Panelized Wood</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_3\' value=\'opt3\'/><label for=\'1_opt_3\'>Concrete</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_4\' value=\'opt4\'/><label for=\'1_opt_4\'>Gypcrete</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_5\' value=\'opt5\'/><input id=\'1_opt_text\' style=\'width:65%\' type=text placeholder=\'Other\'/>\r\n					</div>\r\n						<p style=\'position:relative;right:-25%;top:-2%;\'>Roof Structure:</p>\r\n					<div class=buTy_2 style=\'right:2%;\'>\r\n						<input type=radio name=\'c\' id=\'2_opt_1\' value=\'opt1\'/><label for=\'2_opt_1\'>Steel Joists/Beams</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_2\' value=\'opt2\'/><label for=\'2_opt_2\'>PEMB Purlins</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_3\' value=\'opt3\'/><label for=\'2_opt_3\'>Hybrid</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_4\' value=\'opt4\'/><label for=\'2_opt_4\'>Wood Trusses</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_5\' value=\'opt5\'/><input id=\'2_opt_text\' style=\'width:65%\' type=text placeholder=\'Other\'/>\r\n					</div>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_2 type=button value=\'Back\' onclick=\'back(1)\'>\r\n					<input id=f2_1 type=button value=\'Next\' onclick=\'next(1)\'/>\r\n				</div>\r\n			</div>\r\n			<div class=fancy id=disable_1 >\r\n				<div id=f1 >\r\n					<h1>Customer Info:</h1>\r\n			<br><br><input class=buTy_0 id=_fname type=text required placeholder=\'first name\'/>\r\n			<br><br><input class=buTy_0 id=_lname type=text required placeholder=\'last name\'/>\r\n			<br><br><input class=buTy_0 id=_email type=email required placeholder=\'email\'/>\r\n			<br><br><input class=buTy_0 id=_tel type=tel required placeholder=\'### ###-####\'/>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_1 type=button value=\'Next\' onclick=\'next(0)\'/>\r\n				</div>\r\n			</div>\r\n		</div>\r\n	</div>\r\n-->\r\n\r\n<script>\r\n	var vault={\r\n		fname:\'\',\r\n		lname:\'\',\r\n		email:\'\',\r\n		tel:\'\',\r\n		\r\n		projname:\'\',\r\n		postal:\'\',\r\n		date:\'\',\r\n		TI:\'\',\r\n		OPT1:\'\',\r\n		OPT2:\'\',\r\n		\r\n		jspace:\'\',\r\n		opsize:\'\',\r\n		uweight:\'\',\r\n		utype:\'\',\r\n		\r\n		notes:\'\'\r\n	},\r\n	istherecurrentlyaframebeingconsidered= false;\r\ntry{\r\n	function closetheframeselectwindow(){\r\n		document.getElementById(\'personalize_frame_frame\').style.opacity= \'0\';\r\n		document.getElementById(\'personalize_frame_frame\').style.visibility= \'hidden\';\r\n		\r\n		document.getElementById(\'fanciest\').style.visibility= \'visible\';\r\n		document.getElementById(\'the_void\').style.opacity= \'0\';\r\n		setTimeout(function(){\r\n			//document.getElementById(\'the_void\').style.visibility= \'hidden\';\r\n			document.getElementById(\'all_of_the_frames_you_can_select_from\').style.visibility= \'visible\';\r\n			document.getElementById(\'the_void\').style.display= \'none\';\r\n		},300);\r\n	}\r\n			function opentheframeselectwindow(){\r\n				//document.getElementById(\'the_void\').style.visibility= \'visible\';\r\n				document.getElementById(\'fanciest\').style.visibility= \'hidden\';\r\n				document.getElementById(\'the_void\').style.display= \'grid\';\r\n				document.getElementById(\'the_void\').style.opacity= \'1\';\r\n			}\r\n	\r\n	function dotheframething(){\r\n		opentheframeselectwindow();\r\n		if(!istherecurrentlyaframebeingconsidered){\r\n			istherecurrentlyaframebeingconsidered= true;\r\n			document.getElementById(\'f2_1_final\').value= \'Submit\';\r\n		} else{\r\n			\r\n		}\r\n	}\r\n	function saveframe(){\r\n		vault.jspace= document.getElementById(\'joist_space\').value;\r\n			vault.opsize= document.getElementById(\'opening_size\').value;\r\n			vault.uweight= document.getElementById(\'unit_weight\').value;\r\n			vault.utype= document.querySelector(\'input[name=\"d\"]:checked\').id;\r\n		\r\n		closetheframeselectwindow();\r\n		document.getElementById(\'frame_1\').style.display= \'block\';\r\n			document.getElementById(\'saved_frame_1\').src= \'./frames/frame (\'+(chosen_frame-1)+\').png\';\r\n			document.getElementById(\'saved_frame_1\').style.width= \'62px\';\r\n	}\r\n	\r\n	function back(a){\r\n		if(a==1){\r\n			document.getElementById(\'disable_1\').style.display= \'grid\';\r\n			document.getElementById(\'disable_1\').style.opacity= \'1\';\r\n			document.getElementById(\'disable_2\').style.opacity= \'0\';\r\n			document.getElementById(\'display_2\').style.display= \'none\'\r\n		}else if(a==2){\r\n			document.getElementById(\'disable_2\').style.display= \'grid\';\r\n			document.getElementById(\'disable_2\').style.opacity= \'1\';\r\n			document.getElementById(\'disable_3\').style.opacity= \'0\';\r\n			document.getElementById(\'display_3\').style.display= \'none\'\r\n		}\r\n	}\r\n	function next(a){\r\n		if(a==0){\r\n			vault.fname= document.getElementById(\'_fname\').value;\r\n			vault.lname= document.getElementById(\'_lname\').value;\r\n			vault.email= document.getElementById(\'_email\').value;\r\n			vault.tel= document.getElementById(\'_tel\').value;\r\n			\r\n			document.getElementById(\'disable_1\').style.display= \'none\';\r\n			document.getElementById(\'disable_2\').style.opacity= \'1\';\r\n		}else if(a==1){\r\n			vault.projname= document.getElementById(\'_projname\').value;\r\n			vault.postal= document.getElementById(\'_postal\').value;\r\n			vault.date= document.getElementById(\'_neededby\').value;\r\n			vault.TI= document.querySelector(\'input[name=\"a\"]:checked\').id;\r\n			vault.OPT1= document.querySelector(\'input[name=\"b\"]:checked\').id;\r\n			vault.OPT2= document.querySelector(\'input[name=\"c\"]:checked\').id;\r\n			\r\n			document.getElementById(\'disable_2\').style.display= \'none\';\r\n			document.getElementById(\'disable_3\').style.opacity= \'1\';\r\n			\r\n			console.log(vault);\r\n		}else if(a==2){\r\n			document.getElementById(\'disable_3\').style.display= \'none\';\r\n			document.getElementById(\'disable_4\').style.opacity= \'1\';\r\n		}\r\n	}\r\n} catch(err){console.log(err);}\r\n	\r\n</script>\r\n\r\n\r\n\r\n\r\n<!--<h1>Let QuickFrames do the take-offs and eliminate your need to detail.</h1>\r\n[contact-form-7 id=\"1936\" title=\"New QuickFrames Quote Form\"]\r\n\r\n\r\nFrom: https://wplearninglab.com/contact-form-7-get-value-from-url/\r\n\r\n<script type=\"text/javascript\">\r\nvar getUrlParameter = function getUrlParameter(sParam) {\r\n    var sPageURL = decodeURIComponent(window.location.search.substring(1)),\r\n        sURLVariables = sPageURL.split(\'&\'),\r\n        sParameterName,\r\n        i;\r\n    for (i = 0; i < sURLVariables.length; i++) {\r\n        sParameterName = sURLVariables[i].split(\'=\');\r\n        if (sParameterName[0] === sParam) {\r\n            return sParameterName[1] === undefined ? true : sParameterName[1];\r\n        }\r\n    }\r\n};\r\n\r\nvar VARIABLE = getUrlParameter(\'PARAMETER\');\r\n\r\nif (VARIABLE != null) {\r\n     document.getElementById(\'INPUT-FIELD-ID\').value = VARIABLE;\r\n}\r\n\r\n</script>\r\n\r\n\r\n<a name=\"quote-a-few-frames\"></a>\r\n\r\n[two_fifth]\r\n<h3>Need Just A Few Frames Quoted?</h3>\r\nIf you are working on a project requiring only a few frames and you know the basic requirements for how they will be used, just fill out the form to the right. We\'ll get a quote back to you within 24 hours or less!\r\n\r\nFor each framed opening, using the <a href=\"#frame-types\"> frame type examples </a> shown below, select the frame type number that most closely matches where the opening will be located relative to the joists/beams and enter that into the <strong>Type</strong> column. While RTUs are shown in these images, they apply to all types of roof top equipment. If none of the images match your configuration, enter (0).\r\n\r\n[responsive] <img class=\"alignright\" src=\"/wp-content/uploads/quote-frame-outline.jpg\" alt=\"Frame Outline Image\" width=\"320\" /> [/responsive]\r\n\r\nIf the framing will <strong>only</strong> support the duct openings and not the curbing, enter the letter (<strong><span style=\"color: #37ade1;\">Y</span></strong>) in the <strong>Duct Only</strong> column. If the framing will support the curbing and equipment, enter the letter (<strong><span style=\"color: #37ade1;\">N</span></strong>).\r\n\r\nSpecify the center-to-center joist/beam spacing as shown by (<strong><span style=\"color: #37ade1;\">A</spacing></strong>) in the image to the right.\r\n\r\nWhen specifying the frame opening size (<strong><span style=\"color: #37ade1;\">B</span></strong>), use the length of the opening running <strong>parallel</strong> to (running with) the joists or beams.\r\n\r\n[responsive] <img class=\"alignright\" src=\"/wp-content/uploads/home-install-after-roof.jpg\" alt=\"Install After Roof Image\" width=\"400\"/> [/responsive]\r\n\r\n[/two_fifth]\r\n\r\n[three_fifth_last]\r\n[contact-form-7 id=\"1036\" title=\"Expanded Quote Request Small\"]\r\n[/three_fifth_last]\r\n\r\n<a name=\"frame-types\"></a>\r\n<h2>Frame Type Examples</h2>\r\n[responsive] <img class=\"alignright\" src=\"/wp-content/uploads/quote-frame-configurations.png\" alt=\"Roof Framing Configurations\" /> [/responsive]\r\n\r\n<a name=\"quote-a-lot-of-frames\"></a>\r\n[divider type=\"space\" margintop=\"0\" marginbottom=\"20\"]\r\n\r\n<h2>Have A Large Or Complex Project? Let Us Do The Take-offs For You!</h2>\r\n[divider type=\"space\" margintop=\"0\" marginbottom=\"10\"]\r\n\r\n[one_third]\r\n[responsive] <img src=\"/wp-content/uploads/drawing-image.jpg\" alt=\"Drawing Image\" /> [/responsive]\r\n[/one_third]\r\n\r\n[two_third_last]\r\nThe simplest way for us to provide you with a customized QuickFrames quotation is for you to allow us to do the take-offs directly from the engineering drawing set.\r\n\r\nWe have developed an extensive database of roof top equipment information, such as sizes, weights, opening dimensions, and structural requirements that allows us to select the optimal roof frames for your applications. All you need to do is to provide us with access to your drawing set and then let us go to work for you. You can also have complete confidence that we treat all drawing sets as proprietary information and we respect the importance of confidentiality for anything you share with us.\r\n\r\nThe easiest way for us to access your files is for you to provide us with an FTP address, login and password. Or, if the file set is small enough, you can also email it to us.\r\n\r\n[contact-form-7 id=\"401\" title=\"Quote Request\"]\r\n\r\n[/two_third_last]-->\r\n','Testing Page','','inherit','closed','closed','','777-revision-v1','','','2020-09-08 03:05:19','2020-09-08 10:05:19','',777,'http://quickframes.miritin.com/777-revision-v1/',0,'revision','',0),(1978,1,'2020-09-08 03:05:53','2020-09-08 10:05:53','<h1>Quote Demo:</h1>\r\n\r\n<style>\r\n\r\n  body{\r\n		font-family:Arial;\r\n	}\r\n\r\n	.Frame_Tool_Img{\r\n		cursor:pointer;\r\n		margin:20px;\r\n		border:2px solid transparent;\r\n		transition:border-color 0.1s linear;\r\n	}\r\n		.Frame_Tool_Img:hover{\r\n			border-color:#79c6e8;\r\n		}\r\n	input{\r\n		text-align:center;\r\n	}\r\n	\r\n	#content_container{\r\n		position:relative;\r\n			left:25vw;\r\n		width:50vw;\r\n			height:100%;\r\n	}\r\n	\r\n	#d{display:none;}\r\n	#tupperware_0{\r\n		grid-area:1 / 1;\r\n		height:100%;\r\n			width:100%;\r\n		display:grid;\r\n			grid-auto-flow:dense;\r\n			grid-template-columns: repeat(7, 1fr);\r\n			grid-template-rows: 500px 500px 500px;\r\n	}\r\n	#tupperware_1{\r\n		grid-area:1 / 1;\r\n		display:none;\r\n	}\r\n	\r\n	#tupperware_2{display:none;}\r\n	\r\n	.coolframebutte{\r\n		width:225px;\r\n		height:auto;\r\n	}\r\n	\r\n\r\n\r\n	#disable_1{\r\n		\r\n	}\r\n	#disable_2,#disable_3,#disable_4{\r\n		opacity:0;\r\n		transition:opacity .25s ease-in-out;\r\n	}\r\n	#disable_4{\r\n		height:7vh;\r\n			width:12vw;\r\n		font-size:2vh;\r\n		top:45vh;\r\n			left:44vw;\r\n	}\r\n\r\n	.fancy{\r\n		width:20vw;\r\n			height:50vh;\r\n			border-radius:10px;\r\n		position:absolute;\r\n			left:25%;\r\n			top:25vh;\r\n		background-color:#eee;\r\n		display:grid;\r\n			grid-auto-columns:100%;\r\n			grid-template-rows:85% 15%;\r\n	}\r\n		#f1{\r\n			backround-color:#fff;\r\n			text-align:center;\r\n		}\r\n		#f2{\r\n			background-color:#bbb;\r\n		}\r\n			#f2_2{\r\n				width:25%;\r\n					height:6%;\r\n				position:absolute;\r\n					left:15%;\r\n					top:90%;\r\n			}\r\n			#f2_1,#f2_1_final{\r\n				width:25%;\r\n					height:6%;\r\n				position:absolute;\r\n					right:15%;\r\n					top:90%;\r\n			}\r\n				.buTy_0{\r\n					height:5%;\r\n						width:65%;\r\n				}\r\n				.buTy_1{\r\n					height:5%;\r\n						width:65%;\r\n				}\r\n				.buTy_2{\r\n					position:absolute;\r\n						width:45%;\r\n						height:23%;\r\n						bottom:18%;\r\n					font-size:80%;\r\n					text-align:left;\r\n					background-color:#fff;\r\n						border:solid #767676 1px;\r\n						border-radius:2px;\r\n				}\r\n					#1_opt_text{\r\n						height:1000%;\r\n					}\r\n					\r\n				#project_type{\r\n					position:relative;\r\n						width:65%;\r\n						height:5%;\r\n						left:17.5%;\r\n					font-size:80%;\r\n					background-color:#fff;\r\n						border:solid #767676 1px;\r\n						border-radius:2px;\r\n				}\r\n\r\n		#cart_area{\r\n			height:65%;\r\n			display:grid;\r\n				grid-template-columns:33% 33% 33%;\r\n				grid-auto-rows:40%;\r\n		}\r\n			.frame_frame_frame{\r\n				\r\n			}\r\n				#frame_add{\r\n					height:24%;\r\n					margin-top:35%;\r\n				}\r\n				.add_frame{\r\n					height:30%;\r\n						width:30%;\r\n					margin-top:25%;\r\n				}\r\n			#_addnotes{\r\n				position:relative;\r\n					width:90%;\r\n					height:10%;\r\n			}\r\n\r\n	#the_void{\r\n		position:absolute;\r\n			top:0;\r\n			left:0;\r\n			z-index:999;\r\n		background-color:rgba(0,0,0,0.6);\r\n		height:100%;\r\n			width:100%;\r\n		display:none;\r\n			grid-template-rows:5% 5% 85% 5%;\r\n			grid-template-columns:5% 90% 5%;\r\n			grid-template-areas:\'. . .\'\r\n								\'. a_fr a_x\'\r\n								\'. a_fr .\'\r\n								\'. . .\';\r\n		opacity:0;\r\n		transition:opacity 0.3s ease-in-out;\r\n	}\r\n		#all_of_the_frames_you_can_select_from{\r\n			grid-area:a_fr;\r\n		}\r\n			#personalize_frame_frame{\r\n				grid-area:a_fr;\r\n				visibility:hidden;\r\n				opacity:0;\r\n				transition:opacity 0.3s ease-in-out;\r\n			}\r\n		#the_little_x_in_the_top_right{\r\n			grid-area:a_x;\r\n				color:#fff;\r\n				font-size:2.4vmax;\r\n				cursor:pointer;\r\n			transition:color .1s linear;\r\n		}\r\n				#the_little_x_in_the_top_right:hover{\r\n					color:#79c6e8;\r\n				}  	\r\n			#customizations{\r\n				position:absolute;\r\n					top:20%;\r\n					height:50%;\r\n					weight:50%;\r\n					left:30%;\r\n				padding:20px;\r\n				border-radius:5px;\r\n				text-align:center;\r\n				background-color:rgba(0,0,0,0.2);\r\n			}\r\n				#bottomofframeoptions{\r\n					position:relative;\r\n						width:100%;\r\n						left:-20px;\r\n						bottom:-20px;\r\n					padding:20px;\r\n					background-color:#bbb;\r\n				}\r\n				#joist_space,#opening_size,#unit_weight{\r\n					height:2.5vh;\r\n					border:none;\r\n					border-left:5px solid transparent;\r\n					transition:border-left 0.2s linear;\r\n				}\r\n				#unit_type{\r\n					color:#fff;\r\n					text-align:left;\r\n				}\r\n			#save_unit{\r\n				width:50%;\r\n					height:2.5vh;\r\n			}\r\n			\r\n	#quickgridthing{\r\n		display:grid;\r\n			grid-template-columns:100%;\r\n			grid-template-areas:100%;\r\n	}\r\n		#grandprize__hori,#grandprize__vert{\r\n			animation:flickercolorselect 1s infinite;\r\n			visibility:hidden;\r\n		}\r\n		.blinking_arrow{\r\n			position:absolute;\r\n				left:10px;\r\n			font-size:1.6vh;\r\n			color:red;\r\n			visibility:hidden;\r\n			animation:flickercolorselect 1s infinite;\r\n		}\r\n	@keyframes flickercolorselect{\r\n		0%{opacity:0;}\r\n		50%{opacity:1;}\r\n		100%{opacity:0;}\r\n	}\r\n\r\n	\r\n	.container_around_selected_frames_in_the_cart_screen{\r\n		\r\n	}\r\n		#rmv_q1{\r\n			color:red;\r\n			border:none;\r\n			background-color:transparent;\r\n			cursor:pointer;\r\n		}\r\n			#rmv_q1:hover{\r\n				text-decoration:underline;\r\n			}\r\n\r\n</style>\r\n<script>\r\n		var input_last_selected= false;\r\n	function selectoneofthetwoinputspluscolouring(a){\r\n		if(a==\'joist\'){\r\n			if(input_last_selected==\'opening\'){\r\n				//document.getElementById(\'opening_size\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_opening\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__vert\').style.visibility= \'hidden\';\r\n			}\r\n			input_last_selected= \'joist\';\r\n			//document.getElementById(\'joist_space\').style.borderLeftColor= \'red\';\r\n			document.getElementById(\'arrow_for_joist\').style.visibility= \'visible\';\r\n			document.getElementById(\'grandprize__hori\').style.visibility= \'visible\';\r\n		} else if(a==\'opening\'){\r\n			if(input_last_selected==\'joist\'){\r\n				//document.getElementById(\'joist_space\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_joist\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__hori\').style.visibility= \'hidden\';\r\n			}\r\n			input_last_selected= \'opening\';\r\n			//document.getElementById(\'opening_size\').style.borderLeftColor= \'red\';\r\n			document.getElementById(\'arrow_for_opening\').style.visibility= \'visible\';\r\n			document.getElementById(\'grandprize__vert\').style.visibility= \'visible\';\r\n		} else if(!a){\r\n			if(input_last_selected==\'joist\'){\r\n				//document.getElementById(\'joist_space\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_joist\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__hori\').style.visibility= \'hidden\';\r\n			} else if(input_last_selected==\'opening\'){\r\n				//document.getElementById(\'opening_size\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_opening\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__vert\').style.visibility= \'hidden\';\r\n			}\r\n		}\r\n	}\r\n	\r\n		var chosen_frame;\r\n	function choose(a){\r\n			let a6=a.src.length-6,a7=a.src.length-7;\r\n		chosen_frame= parseInt(a.src[a7]!=\'(\'?(a.src[a7]+a.src[a6]):a.src[a6])+1;\r\n		\r\n		//document.getElementById(\'tupperware_0\').style.visibility= \'hidden\';\r\n			//document.getElementById(\'tupperware_1\').style.display= \'block\';\r\n		\r\n		document.getElementById(\'grandprize\').src= \'./frames/dry (\'+(chosen_frame-1)+\').png\';\r\n			setTimeout(function(){document.getElementById(\'grandprize\').style.width= \'375px\';},50);\r\n		\r\n		\r\n		document.getElementById(\'all_of_the_frames_you_can_select_from\').style.visibility= \'hidden\';\r\n		document.getElementById(\'personalize_frame_frame\').style.visibility= \'visible\';\r\n				document.getElementById(\'grandprize__hori\').src= \'./frames/hori (\'+(chosen_frame-1)+\').png\';\r\n				document.getElementById(\'grandprize__vert\').src= \'./frames/vert (\'+(chosen_frame-1)+\').png\';\r\n					setTimeout(function(){\r\n								document.getElementById(\'grandprize__hori\').style.width= \'375px\';\r\n								document.getElementById(\'grandprize__vert\').style.width= \'375px\';\r\n							},50);\r\n			document.getElementById(\'personalize_frame_frame\').style.opacity= \'1\';\r\n		\r\n		if(chosen_frame==3 || chosen_frame==10){\r\n			document.getElementById(\'grandprize__vert\').hidden= true;\r\n			document.getElementById(\'opening_size\').hidden= true;\r\n			document.getElementById(\'arrow_for_opening\').hidden= true;\r\n		} else{\r\n			document.getElementById(\'grandprize__vert\').hidden= false;\r\n			document.getElementById(\'opening_size\').hidden= false;\r\n			document.getElementById(\'arrow_for_opening\').hidden= false;\r\n		}\r\n		\r\n		document.getElementById(\'joist_space\').focus();\r\n		\r\n		\r\n		/*	\r\n		let vHeight= document.getElementById(\'grandprize\').height,\r\n			vWidth= document.getElementById(\'grandprize\').width;\r\n			\r\n		document.getElementById(\'ch_width\').style.left= ((vWidth - document.getElementById(\'ch_width\').style.width)/2)+\'px\';\r\n		*/\r\n	}\r\n	\r\n	function removeitemfromcard(a){\r\n		//add stuff here to remove set image\r\n		document.getElementById(\'frame_\'+a).style.display= \'none\';\r\n	}\r\n	\r\n	\r\n/*\r\n\r\nSUBMIT\r\n- include \'additional notes\' section\r\n- links to plans (URL)\r\n	- OR -\r\n- file upload\r\n- CAPTCHA\r\n\r\n*/\r\n</script>\r\n<!--\r\n		<div id=the_void >\r\n			<div id=personalize_frame_frame >\r\n				<div id=quickgridthing >\r\n					<img class=\'Frame_Tool_Img\' id=grandprize__hori src=\'./blue2.png\' style=\'grid-area:1 / 1;\'>\r\n					<img class=\'Frame_Tool_Img\' id=grandprize__vert src=\'./blue1.png\' style=\'grid-area:1 / 1;\'>\r\n					<img class=\'Frame_Tool_Img\' id=grandprize src=\'\' style=\'grid-area:1 / 1;\'>\r\n				</div>\r\n				<div id=customizations >\r\n				\r\n				<div id=arrow_for_joist class=blinking_arrow >►</div>\r\n				<input id=joist_space type=text placeholder=\'Joist Spacing (in.)\' onfocus=\'selectoneofthetwoinputspluscolouring(\"joist\")\'/>\r\n					\r\n				<br><br>\r\n					<div id=arrow_for_opening class=blinking_arrow >►</div>\r\n				<input id=opening_size type=text placeholder=\'Opening Size (in.)\' onfocus=\'selectoneofthetwoinputspluscolouring(\"opening\")\'/>\r\n					\r\n				<br><br><div id=unit_type onclick=\'selectoneofthetwoinputspluscolouring(false)\'>\r\n						<p style=\'text-align:center;\'>Unit Type:</p>\r\n						<div style=\'\r\n						background-color:#fff;\r\n							border:solid #767676 1px;\r\n							border-radius:2px;\r\n							color:#000;\r\n							font-size:80%;\r\n							padding:5px;\' >\r\n							<input type=radio name=\'d\' id=\'u_opt_1\' value=\'opt1\' onfocus=\'selectoneofthetwoinputspluscolouring(false)\'/><label for=\'u_opt_1\'>RTU/AHU/MAU</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_2\' value=\'opt2\'/><label for=\'u_opt_2\'>EVAP Coolers</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_3\' value=\'opt3\'/><label for=\'u_opt_3\'>Exhaust Fans</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_4\' value=\'opt4\'/><label for=\'u_opt_4\'>Powered Vents</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_5\' value=\'opt5\'/><label for=\'u_opt_5\'>Gravity Vents</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_6\' value=\'opt6\'/><label for=\'u_opt_6\'>Skylights</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_7\' value=\'opt7\'/><label for=\'u_opt_7\'>Roof Drains</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_8\' value=\'opt8\'/><label for=\'u_opt_8\'>Roof Hatch</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_9\' value=\'opt9\'/><label for=\'u_opt_9\'>Floor Openings</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_text\' value=\'opt10\'/><input id=\'u_opt_text\' style=\'width:65%\' type=text placeholder=\'Other\'/>\r\n						</div>\r\n					</div>\r\n					\r\n			<br><br><input id=unit_weight type=text placeholder=\'Unit Weight (lbs.)\' onfocus=\'selectoneofthetwoinputspluscolouring(false)\'/>\r\n					\r\n	<br><br><div id=bottomofframeoptions >\r\n				<input id=save_unit type=button value=\'Add to Cart\' onclick=\'saveframe()\' onfocus=\'selectoneofthetwoinputspluscolouring(false)\'/>\r\n			</div>\r\n				</div>\r\n			</div>\r\n			<div id=all_of_the_frames_you_can_select_from >\r\n				\r\n				<div id=fr_double >\r\n					<img src=\'./frames/frame (0).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (1).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (2).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (5).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (6).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (9).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n				</div>\r\n				<div id=fr_triple >\r\n					<img src=\'./frames/frame (3).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (4).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (7).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (8).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (11).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n				</div>\r\n				<div id=fr_quad >\r\n					<img src=\'./frames/frame (10).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (12).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n				</div>\r\n				\r\n			</div>\r\n			<div id=the_little_x_in_the_top_right onclick=\'closetheframeselectwindow()\'>X</div>\r\n		</div>\r\n	<div id=content_container >\r\n		<div id=fanciest >\r\n			<div class=fancy id=disable_5 >\r\n				<p style=\'text-align:center;\'>Thank you for submitting!</p>\r\n				<input style=\'height:2.5vh;width:5vw;margin-top:32%;margin-left:3.5vw;\' type=button value=\'Return\' onclick=\'location.reload()\' />\r\n			</div>\r\n			<div class=fancy id=disable_4 >\r\n				<div id=f1 >\r\n					<input type=text id=_addnotes placeholder=\'Additional Notes\'>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_2 type=button value=\'Back\' onclick=\'back(2)\'>\r\n					<input id=f2_1_final type=button value=\'Skip\' onclick=\'next(2)\'>\r\n				</div>\r\n			</div>\r\n			<div class=fancy id=disable_3 >\r\n				<div id=f1 >\r\n					<h1>Cart:</h1>\r\n					<div id=cart_area >\r\n						<div class=container_around_selected_frames_in_the_cart_screen id=frame_1 style=\'display:none;\'>\r\n							<img id=saved_frame_1 src=\'\'>\r\n							<div>Qty: \r\n							<select id=quant_1 >\r\n								<option value=\'1\'>1</option>\r\n								<option value=\'2\'>2</option>\r\n								<option value=\'3\'>3</option>\r\n								<option value=\'4\'>4</option>\r\n								<option value=\'5\'>5</option>\r\n								<option value=\'6\'>6</option>\r\n								<option value=\'7\'>7</option>\r\n								<option value=\'8\'>8</option>\r\n								<option value=\'9\'>9</option>\r\n								<option value=\'10\'>10+</option>\r\n							</select></div>\r\n						<br>\r\n							<input id=rmv_q1 type=button value=\'Delete\' onclick=\'removeitemfromcard(1)\'/>\r\n						</div>\r\n						<div><input id=frame_add type=button value=\'Add Frame\' onclick=\'dotheframething()\'/></div>\r\n					</div>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_2 type=button value=\'Back\' onclick=\'back(2)\'>\r\n					<input id=f2_1_final type=button value=\'Skip\' onclick=\'next(2)\'/>\r\n				</div>\r\n			</div>\r\n			<div class=fancy id=disable_2 >\r\n				<div id=f1 >\r\n					<h1>Project Info:</h1>\r\n			<br>	<input class=buTy_0 id=\'_projname\' type=text placeholder=\'project name\'/>\r\n			<br><br><input class=buTy_0 id=\'_postal\' type=postalcode placeholder=\'zip/postal code\'/>\r\n			<br><br><input class=buTy_0 id=\'_neededby\' type=text placeholder=\'frames needed by  (e.g. 01/01/2021)\'/>\r\n			<br><br><form id=project_type >\r\n						<input type=radio name=\'a\' id=\'newmodel\' value=\'NewModel\'/><label for=\'newmodel\'>New Build</label>\r\n						<input type=radio name=\'a\' id=\'TI\' value=\'Newbuild/TI\'/><label for=\'TI\'>Remodel/T.I.</label>\r\n					</form>\r\n						<p style=\'position:relative;left:-25%;top:6%;\'>Roof Material:</p>\r\n					<div class=buTy_2 style=\'left:2%\'>\r\n						<input type=radio name=\'b\' id=\'1_opt_1\' value=\'opt1\'/><label for=\'1_opt_1\'>Steel Deck</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_2\' value=\'opt2\'/><label for=\'1_opt_2\'>Panelized Wood</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_3\' value=\'opt3\'/><label for=\'1_opt_3\'>Concrete</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_4\' value=\'opt4\'/><label for=\'1_opt_4\'>Gypcrete</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_5\' value=\'opt5\'/><input id=\'1_opt_text\' style=\'width:65%\' type=text placeholder=\'Other\'/>\r\n					</div>\r\n						<p style=\'position:relative;right:-25%;top:-2%;\'>Roof Structure:</p>\r\n					<div class=buTy_2 style=\'right:2%;\'>\r\n						<input type=radio name=\'c\' id=\'2_opt_1\' value=\'opt1\'/><label for=\'2_opt_1\'>Steel Joists/Beams</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_2\' value=\'opt2\'/><label for=\'2_opt_2\'>PEMB Purlins</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_3\' value=\'opt3\'/><label for=\'2_opt_3\'>Hybrid</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_4\' value=\'opt4\'/><label for=\'2_opt_4\'>Wood Trusses</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_5\' value=\'opt5\'/><input id=\'2_opt_text\' style=\'width:65%\' type=text placeholder=\'Other\'/>\r\n					</div>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_2 type=button value=\'Back\' onclick=\'back(1)\'>\r\n					<input id=f2_1 type=button value=\'Next\' onclick=\'next(1)\'/>\r\n				</div>\r\n			</div>\r\n			<div class=fancy id=disable_1 >\r\n				<div id=f1 >\r\n					<h1>Customer Info:</h1>\r\n			<br><br><input class=buTy_0 id=_fname type=text required placeholder=\'first name\'/>\r\n			<br><br><input class=buTy_0 id=_lname type=text required placeholder=\'last name\'/>\r\n			<br><br><input class=buTy_0 id=_email type=email required placeholder=\'email\'/>\r\n			<br><br><input class=buTy_0 id=_tel type=tel required placeholder=\'### ###-####\'/>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_1 type=button value=\'Next\' onclick=\'next(0)\'/>\r\n				</div>\r\n			</div>\r\n		</div>\r\n	</div>\r\n-->\r\n\r\n<script>\r\n	var vault={\r\n		fname:\'\',\r\n		lname:\'\',\r\n		email:\'\',\r\n		tel:\'\',\r\n		\r\n		projname:\'\',\r\n		postal:\'\',\r\n		date:\'\',\r\n		TI:\'\',\r\n		OPT1:\'\',\r\n		OPT2:\'\',\r\n		\r\n		jspace:\'\',\r\n		opsize:\'\',\r\n		uweight:\'\',\r\n		utype:\'\',\r\n		\r\n		notes:\'\'\r\n	},\r\n	istherecurrentlyaframebeingconsidered= false;\r\ntry{\r\n	function closetheframeselectwindow(){\r\n		document.getElementById(\'personalize_frame_frame\').style.opacity= \'0\';\r\n		document.getElementById(\'personalize_frame_frame\').style.visibility= \'hidden\';\r\n		\r\n		document.getElementById(\'fanciest\').style.visibility= \'visible\';\r\n		document.getElementById(\'the_void\').style.opacity= \'0\';\r\n		setTimeout(function(){\r\n			//document.getElementById(\'the_void\').style.visibility= \'hidden\';\r\n			document.getElementById(\'all_of_the_frames_you_can_select_from\').style.visibility= \'visible\';\r\n			document.getElementById(\'the_void\').style.display= \'none\';\r\n		},300);\r\n	}\r\n			function opentheframeselectwindow(){\r\n				//document.getElementById(\'the_void\').style.visibility= \'visible\';\r\n				document.getElementById(\'fanciest\').style.visibility= \'hidden\';\r\n				document.getElementById(\'the_void\').style.display= \'grid\';\r\n				document.getElementById(\'the_void\').style.opacity= \'1\';\r\n			}\r\n	\r\n	function dotheframething(){\r\n		opentheframeselectwindow();\r\n		if(!istherecurrentlyaframebeingconsidered){\r\n			istherecurrentlyaframebeingconsidered= true;\r\n			document.getElementById(\'f2_1_final\').value= \'Submit\';\r\n		} else{\r\n			\r\n		}\r\n	}\r\n	function saveframe(){\r\n		vault.jspace= document.getElementById(\'joist_space\').value;\r\n			vault.opsize= document.getElementById(\'opening_size\').value;\r\n			vault.uweight= document.getElementById(\'unit_weight\').value;\r\n			vault.utype= document.querySelector(\'input[name=\"d\"]:checked\').id;\r\n		\r\n		closetheframeselectwindow();\r\n		document.getElementById(\'frame_1\').style.display= \'block\';\r\n			document.getElementById(\'saved_frame_1\').src= \'./frames/frame (\'+(chosen_frame-1)+\').png\';\r\n			document.getElementById(\'saved_frame_1\').style.width= \'62px\';\r\n	}\r\n	\r\n	function back(a){\r\n		if(a==1){\r\n			document.getElementById(\'disable_1\').style.display= \'grid\';\r\n			document.getElementById(\'disable_1\').style.opacity= \'1\';\r\n			document.getElementById(\'disable_2\').style.opacity= \'0\';\r\n			document.getElementById(\'display_2\').style.display= \'none\'\r\n		}else if(a==2){\r\n			document.getElementById(\'disable_2\').style.display= \'grid\';\r\n			document.getElementById(\'disable_2\').style.opacity= \'1\';\r\n			document.getElementById(\'disable_3\').style.opacity= \'0\';\r\n			document.getElementById(\'display_3\').style.display= \'none\'\r\n		}\r\n	}\r\n	function next(a){\r\n		if(a==0){\r\n			vault.fname= document.getElementById(\'_fname\').value;\r\n			vault.lname= document.getElementById(\'_lname\').value;\r\n			vault.email= document.getElementById(\'_email\').value;\r\n			vault.tel= document.getElementById(\'_tel\').value;\r\n			\r\n			document.getElementById(\'disable_1\').style.display= \'none\';\r\n			document.getElementById(\'disable_2\').style.opacity= \'1\';\r\n		}else if(a==1){\r\n			vault.projname= document.getElementById(\'_projname\').value;\r\n			vault.postal= document.getElementById(\'_postal\').value;\r\n			vault.date= document.getElementById(\'_neededby\').value;\r\n			vault.TI= document.querySelector(\'input[name=\"a\"]:checked\').id;\r\n			vault.OPT1= document.querySelector(\'input[name=\"b\"]:checked\').id;\r\n			vault.OPT2= document.querySelector(\'input[name=\"c\"]:checked\').id;\r\n			\r\n			document.getElementById(\'disable_2\').style.display= \'none\';\r\n			document.getElementById(\'disable_3\').style.opacity= \'1\';\r\n			\r\n			console.log(vault);\r\n		}else if(a==2){\r\n			document.getElementById(\'disable_3\').style.display= \'none\';\r\n			document.getElementById(\'disable_4\').style.opacity= \'1\';\r\n		}\r\n	}\r\n} catch(err){console.log(err);}\r\n	\r\n</script>\r\n\r\n\r\n\r\n\r\n<!--<h1>Let QuickFrames do the take-offs and eliminate your need to detail.</h1>\r\n[contact-form-7 id=\"1936\" title=\"New QuickFrames Quote Form\"]\r\n\r\n\r\nFrom: https://wplearninglab.com/contact-form-7-get-value-from-url/\r\n\r\n<script type=\"text/javascript\">\r\nvar getUrlParameter = function getUrlParameter(sParam) {\r\n    var sPageURL = decodeURIComponent(window.location.search.substring(1)),\r\n        sURLVariables = sPageURL.split(\'&\'),\r\n        sParameterName,\r\n        i;\r\n    for (i = 0; i < sURLVariables.length; i++) {\r\n        sParameterName = sURLVariables[i].split(\'=\');\r\n        if (sParameterName[0] === sParam) {\r\n            return sParameterName[1] === undefined ? true : sParameterName[1];\r\n        }\r\n    }\r\n};\r\n\r\nvar VARIABLE = getUrlParameter(\'PARAMETER\');\r\n\r\nif (VARIABLE != null) {\r\n     document.getElementById(\'INPUT-FIELD-ID\').value = VARIABLE;\r\n}\r\n\r\n</script>\r\n\r\n\r\n<a name=\"quote-a-few-frames\"></a>\r\n\r\n[two_fifth]\r\n<h3>Need Just A Few Frames Quoted?</h3>\r\nIf you are working on a project requiring only a few frames and you know the basic requirements for how they will be used, just fill out the form to the right. We\'ll get a quote back to you within 24 hours or less!\r\n\r\nFor each framed opening, using the <a href=\"#frame-types\"> frame type examples </a> shown below, select the frame type number that most closely matches where the opening will be located relative to the joists/beams and enter that into the <strong>Type</strong> column. While RTUs are shown in these images, they apply to all types of roof top equipment. If none of the images match your configuration, enter (0).\r\n\r\n[responsive] <img class=\"alignright\" src=\"/wp-content/uploads/quote-frame-outline.jpg\" alt=\"Frame Outline Image\" width=\"320\" /> [/responsive]\r\n\r\nIf the framing will <strong>only</strong> support the duct openings and not the curbing, enter the letter (<strong><span style=\"color: #37ade1;\">Y</span></strong>) in the <strong>Duct Only</strong> column. If the framing will support the curbing and equipment, enter the letter (<strong><span style=\"color: #37ade1;\">N</span></strong>).\r\n\r\nSpecify the center-to-center joist/beam spacing as shown by (<strong><span style=\"color: #37ade1;\">A</spacing></strong>) in the image to the right.\r\n\r\nWhen specifying the frame opening size (<strong><span style=\"color: #37ade1;\">B</span></strong>), use the length of the opening running <strong>parallel</strong> to (running with) the joists or beams.\r\n\r\n[responsive] <img class=\"alignright\" src=\"/wp-content/uploads/home-install-after-roof.jpg\" alt=\"Install After Roof Image\" width=\"400\"/> [/responsive]\r\n\r\n[/two_fifth]\r\n\r\n[three_fifth_last]\r\n[contact-form-7 id=\"1036\" title=\"Expanded Quote Request Small\"]\r\n[/three_fifth_last]\r\n\r\n<a name=\"frame-types\"></a>\r\n<h2>Frame Type Examples</h2>\r\n[responsive] <img class=\"alignright\" src=\"/wp-content/uploads/quote-frame-configurations.png\" alt=\"Roof Framing Configurations\" /> [/responsive]\r\n\r\n<a name=\"quote-a-lot-of-frames\"></a>\r\n[divider type=\"space\" margintop=\"0\" marginbottom=\"20\"]\r\n\r\n<h2>Have A Large Or Complex Project? Let Us Do The Take-offs For You!</h2>\r\n[divider type=\"space\" margintop=\"0\" marginbottom=\"10\"]\r\n\r\n[one_third]\r\n[responsive] <img src=\"/wp-content/uploads/drawing-image.jpg\" alt=\"Drawing Image\" /> [/responsive]\r\n[/one_third]\r\n\r\n[two_third_last]\r\nThe simplest way for us to provide you with a customized QuickFrames quotation is for you to allow us to do the take-offs directly from the engineering drawing set.\r\n\r\nWe have developed an extensive database of roof top equipment information, such as sizes, weights, opening dimensions, and structural requirements that allows us to select the optimal roof frames for your applications. All you need to do is to provide us with access to your drawing set and then let us go to work for you. You can also have complete confidence that we treat all drawing sets as proprietary information and we respect the importance of confidentiality for anything you share with us.\r\n\r\nThe easiest way for us to access your files is for you to provide us with an FTP address, login and password. Or, if the file set is small enough, you can also email it to us.\r\n\r\n[contact-form-7 id=\"401\" title=\"Quote Request\"]\r\n\r\n[/two_third_last]-->\r\n','Testing Page','','inherit','closed','closed','','777-revision-v1','','','2020-09-08 03:05:53','2020-09-08 10:05:53','',777,'http://quickframes.miritin.com/777-revision-v1/',0,'revision','',0),(1979,1,'2020-09-08 03:06:46','2020-09-08 10:06:46','<h1>Quote Demo:</h1>\r\n\r\n<style>\r\n\r\n  body{\r\n		font-family:Arial;\r\n	}\r\n\r\n	.Frame_Tool_Img{\r\n		cursor:pointer;\r\n		margin:20px;\r\n		border:2px solid transparent;\r\n		transition:border-color 0.1s linear;\r\n	}\r\n		.Frame_Tool_Img:hover{\r\n			border-color:#79c6e8;\r\n		}\r\n	input{\r\n		text-align:center;\r\n	}\r\n	\r\n	#content_container{\r\n		position:relative;\r\n			left:25vw;\r\n		width:50vw;\r\n			height:100%;\r\n	}\r\n	\r\n	#d{display:none;}\r\n	#tupperware_0{\r\n		grid-area:1 / 1;\r\n		height:100%;\r\n			width:100%;\r\n		display:grid;\r\n			grid-auto-flow:dense;\r\n			grid-template-columns: repeat(7, 1fr);\r\n			grid-template-rows: 500px 500px 500px;\r\n	}\r\n	#tupperware_1{\r\n		grid-area:1 / 1;\r\n		display:none;\r\n	}\r\n	\r\n	#tupperware_2{display:none;}\r\n	\r\n	.coolframebutte{\r\n		width:225px;\r\n		height:auto;\r\n	}\r\n	\r\n\r\n\r\n	#disable_1{\r\n		\r\n	}\r\n	#disable_2,#disable_3,#disable_4{\r\n		opacity:0;\r\n		transition:opacity .25s ease-in-out;\r\n	}\r\n	#disable_4{\r\n		height:7vh;\r\n			width:12vw;\r\n		font-size:2vh;\r\n		top:45vh;\r\n			left:44vw;\r\n	}\r\n\r\n	.fancy{\r\n		width:20vw;\r\n			height:50vh;\r\n			border-radius:10px;\r\n		position:absolute;\r\n			left:25%;\r\n			top:25vh;\r\n		background-color:#eee;\r\n		display:grid;\r\n			grid-auto-columns:100%;\r\n			grid-template-rows:85% 15%;\r\n	}\r\n		#f1{\r\n			backround-color:#fff;\r\n			text-align:center;\r\n		}\r\n		#f2{\r\n			background-color:#bbb;\r\n		}\r\n			#f2_2{\r\n				width:25%;\r\n					height:6%;\r\n				position:absolute;\r\n					left:15%;\r\n					top:90%;\r\n			}\r\n			#f2_1,#f2_1_final{\r\n				width:25%;\r\n					height:6%;\r\n				position:absolute;\r\n					right:15%;\r\n					top:90%;\r\n			}\r\n				.buTy_0{\r\n					height:5%;\r\n						width:65%;\r\n				}\r\n				.buTy_1{\r\n					height:5%;\r\n						width:65%;\r\n				}\r\n				.buTy_2{\r\n					position:absolute;\r\n						width:45%;\r\n						height:23%;\r\n						bottom:18%;\r\n					font-size:80%;\r\n					text-align:left;\r\n					background-color:#fff;\r\n						border:solid #767676 1px;\r\n						border-radius:2px;\r\n				}\r\n					#1_opt_text{\r\n						height:1000%;\r\n					}\r\n					\r\n				#project_type{\r\n					position:relative;\r\n						width:65%;\r\n						height:5%;\r\n						left:17.5%;\r\n					font-size:80%;\r\n					background-color:#fff;\r\n						border:solid #767676 1px;\r\n						border-radius:2px;\r\n				}\r\n\r\n		#cart_area{\r\n			height:65%;\r\n			display:grid;\r\n				grid-template-columns:33% 33% 33%;\r\n				grid-auto-rows:40%;\r\n		}\r\n			.frame_frame_frame{\r\n				\r\n			}\r\n				#frame_add{\r\n					height:24%;\r\n					margin-top:35%;\r\n				}\r\n				.add_frame{\r\n					height:30%;\r\n						width:30%;\r\n					margin-top:25%;\r\n				}\r\n			#_addnotes{\r\n				position:relative;\r\n					width:90%;\r\n					height:10%;\r\n			}\r\n\r\n	#the_void{\r\n		position:absolute;\r\n			top:0;\r\n			left:0;\r\n			z-index:999;\r\n		background-color:rgba(0,0,0,0.6);\r\n		height:100%;\r\n			width:100%;\r\n		display:none;\r\n			grid-template-rows:5% 5% 85% 5%;\r\n			grid-template-columns:5% 90% 5%;\r\n			grid-template-areas:\'. . .\'\r\n								\'. a_fr a_x\'\r\n								\'. a_fr .\'\r\n								\'. . .\';\r\n		opacity:0;\r\n		transition:opacity 0.3s ease-in-out;\r\n	}\r\n		#all_of_the_frames_you_can_select_from{\r\n			grid-area:a_fr;\r\n		}\r\n			#personalize_frame_frame{\r\n				grid-area:a_fr;\r\n				visibility:hidden;\r\n				opacity:0;\r\n				transition:opacity 0.3s ease-in-out;\r\n			}\r\n		#the_little_x_in_the_top_right{\r\n			grid-area:a_x;\r\n				color:#fff;\r\n				font-size:2.4vmax;\r\n				cursor:pointer;\r\n			transition:color .1s linear;\r\n		}\r\n				#the_little_x_in_the_top_right:hover{\r\n					color:#79c6e8;\r\n				}  	\r\n			#customizations{\r\n				position:absolute;\r\n					top:20%;\r\n					height:50%;\r\n					weight:50%;\r\n					left:30%;\r\n				padding:20px;\r\n				border-radius:5px;\r\n				text-align:center;\r\n				background-color:rgba(0,0,0,0.2);\r\n			}\r\n				#bottomofframeoptions{\r\n					position:relative;\r\n						width:100%;\r\n						left:-20px;\r\n						bottom:-20px;\r\n					padding:20px;\r\n					background-color:#bbb;\r\n				}\r\n				#joist_space,#opening_size,#unit_weight{\r\n					height:2.5vh;\r\n					border:none;\r\n					border-left:5px solid transparent;\r\n					transition:border-left 0.2s linear;\r\n				}\r\n				#unit_type{\r\n					color:#fff;\r\n					text-align:left;\r\n				}\r\n			#save_unit{\r\n				width:50%;\r\n					height:2.5vh;\r\n			}\r\n			\r\n	#quickgridthing{\r\n		display:grid;\r\n			grid-template-columns:100%;\r\n			grid-template-areas:100%;\r\n	}\r\n		#grandprize__hori,#grandprize__vert{\r\n			animation:flickercolorselect 1s infinite;\r\n			visibility:hidden;\r\n		}\r\n		.blinking_arrow{\r\n			position:absolute;\r\n				left:10px;\r\n			font-size:1.6vh;\r\n			color:red;\r\n			visibility:hidden;\r\n			animation:flickercolorselect 1s infinite;\r\n		}\r\n	@keyframes flickercolorselect{\r\n		0%{opacity:0;}\r\n		50%{opacity:1;}\r\n		100%{opacity:0;}\r\n	}\r\n\r\n	\r\n	.container_around_selected_frames_in_the_cart_screen{\r\n		\r\n	}\r\n		#rmv_q1{\r\n			color:red;\r\n			border:none;\r\n			background-color:transparent;\r\n			cursor:pointer;\r\n		}\r\n			#rmv_q1:hover{\r\n				text-decoration:underline;\r\n			}\r\n\r\n</style>\r\n<script>\r\n		var input_last_selected= false;\r\n	function selectoneofthetwoinputspluscolouring(a){\r\n		if(a==\'joist\'){\r\n			if(input_last_selected==\'opening\'){\r\n				//document.getElementById(\'opening_size\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_opening\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__vert\').style.visibility= \'hidden\';\r\n			}\r\n			input_last_selected= \'joist\';\r\n			//document.getElementById(\'joist_space\').style.borderLeftColor= \'red\';\r\n			document.getElementById(\'arrow_for_joist\').style.visibility= \'visible\';\r\n			document.getElementById(\'grandprize__hori\').style.visibility= \'visible\';\r\n		} else if(a==\'opening\'){\r\n			if(input_last_selected==\'joist\'){\r\n				//document.getElementById(\'joist_space\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_joist\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__hori\').style.visibility= \'hidden\';\r\n			}\r\n			input_last_selected= \'opening\';\r\n			//document.getElementById(\'opening_size\').style.borderLeftColor= \'red\';\r\n			document.getElementById(\'arrow_for_opening\').style.visibility= \'visible\';\r\n			document.getElementById(\'grandprize__vert\').style.visibility= \'visible\';\r\n		} else if(!a){\r\n			if(input_last_selected==\'joist\'){\r\n				//document.getElementById(\'joist_space\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_joist\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__hori\').style.visibility= \'hidden\';\r\n			} else if(input_last_selected==\'opening\'){\r\n				//document.getElementById(\'opening_size\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_opening\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__vert\').style.visibility= \'hidden\';\r\n			}\r\n		}\r\n	}\r\n	\r\n		var chosen_frame;\r\n	function choose(a){\r\n			let a6=a.src.length-6,a7=a.src.length-7;\r\n		chosen_frame= parseInt(a.src[a7]!=\'(\'?(a.src[a7]+a.src[a6]):a.src[a6])+1;\r\n		\r\n		//document.getElementById(\'tupperware_0\').style.visibility= \'hidden\';\r\n			//document.getElementById(\'tupperware_1\').style.display= \'block\';\r\n		\r\n		document.getElementById(\'grandprize\').src= \'./frames/dry (\'+(chosen_frame-1)+\').png\';\r\n			setTimeout(function(){document.getElementById(\'grandprize\').style.width= \'375px\';},50);\r\n		\r\n		\r\n		document.getElementById(\'all_of_the_frames_you_can_select_from\').style.visibility= \'hidden\';\r\n		document.getElementById(\'personalize_frame_frame\').style.visibility= \'visible\';\r\n				document.getElementById(\'grandprize__hori\').src= \'./frames/hori (\'+(chosen_frame-1)+\').png\';\r\n				document.getElementById(\'grandprize__vert\').src= \'./frames/vert (\'+(chosen_frame-1)+\').png\';\r\n					setTimeout(function(){\r\n								document.getElementById(\'grandprize__hori\').style.width= \'375px\';\r\n								document.getElementById(\'grandprize__vert\').style.width= \'375px\';\r\n							},50);\r\n			document.getElementById(\'personalize_frame_frame\').style.opacity= \'1\';\r\n		\r\n		if(chosen_frame==3 || chosen_frame==10){\r\n			document.getElementById(\'grandprize__vert\').hidden= true;\r\n			document.getElementById(\'opening_size\').hidden= true;\r\n			document.getElementById(\'arrow_for_opening\').hidden= true;\r\n		} else{\r\n			document.getElementById(\'grandprize__vert\').hidden= false;\r\n			document.getElementById(\'opening_size\').hidden= false;\r\n			document.getElementById(\'arrow_for_opening\').hidden= false;\r\n		}\r\n		\r\n		document.getElementById(\'joist_space\').focus();\r\n		\r\n		\r\n		/*	\r\n		let vHeight= document.getElementById(\'grandprize\').height,\r\n			vWidth= document.getElementById(\'grandprize\').width;\r\n			\r\n		document.getElementById(\'ch_width\').style.left= ((vWidth - document.getElementById(\'ch_width\').style.width)/2)+\'px\';\r\n		*/\r\n	}\r\n	\r\n	function removeitemfromcard(a){\r\n		//add stuff here to remove set image\r\n		document.getElementById(\'frame_\'+a).style.display= \'none\';\r\n	}\r\n	\r\n	\r\n/*\r\n\r\nSUBMIT\r\n- include \'additional notes\' section\r\n- links to plans (URL)\r\n	- OR -\r\n- file upload\r\n- CAPTCHA\r\n\r\n*/\r\n</script>\r\n<!--	-->\r\n		<div id=the_void >\r\n			<div id=personalize_frame_frame >\r\n				<div id=quickgridthing >\r\n					<img class=\'Frame_Tool_Img\' id=grandprize__hori src=\'./blue2.png\' style=\'grid-area:1 / 1;\'>\r\n					<img class=\'Frame_Tool_Img\' id=grandprize__vert src=\'./blue1.png\' style=\'grid-area:1 / 1;\'>\r\n					<img class=\'Frame_Tool_Img\' id=grandprize src=\'\' style=\'grid-area:1 / 1;\'>\r\n				</div>\r\n				<div id=customizations >\r\n				\r\n				<div id=arrow_for_joist class=blinking_arrow >►</div>\r\n				<input id=joist_space type=text placeholder=\'Joist Spacing (in.)\' onfocus=\'selectoneofthetwoinputspluscolouring(\"joist\")\'/>\r\n					\r\n				<br><br>\r\n					<div id=arrow_for_opening class=blinking_arrow >►</div>\r\n				<input id=opening_size type=text placeholder=\'Opening Size (in.)\' onfocus=\'selectoneofthetwoinputspluscolouring(\"opening\")\'/>\r\n					\r\n				<br><br><div id=unit_type onclick=\'selectoneofthetwoinputspluscolouring(false)\'>\r\n						<p style=\'text-align:center;\'>Unit Type:</p>\r\n						<div style=\'\r\n						background-color:#fff;\r\n							border:solid #767676 1px;\r\n							border-radius:2px;\r\n							color:#000;\r\n							font-size:80%;\r\n							padding:5px;\' >\r\n							<input type=radio name=\'d\' id=\'u_opt_1\' value=\'opt1\' onfocus=\'selectoneofthetwoinputspluscolouring(false)\'/><label for=\'u_opt_1\'>RTU/AHU/MAU</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_2\' value=\'opt2\'/><label for=\'u_opt_2\'>EVAP Coolers</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_3\' value=\'opt3\'/><label for=\'u_opt_3\'>Exhaust Fans</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_4\' value=\'opt4\'/><label for=\'u_opt_4\'>Powered Vents</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_5\' value=\'opt5\'/><label for=\'u_opt_5\'>Gravity Vents</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_6\' value=\'opt6\'/><label for=\'u_opt_6\'>Skylights</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_7\' value=\'opt7\'/><label for=\'u_opt_7\'>Roof Drains</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_8\' value=\'opt8\'/><label for=\'u_opt_8\'>Roof Hatch</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_9\' value=\'opt9\'/><label for=\'u_opt_9\'>Floor Openings</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_text\' value=\'opt10\'/><input id=\'u_opt_text\' style=\'width:65%\' type=text placeholder=\'Other\'/>\r\n						</div>\r\n					</div>\r\n					\r\n			<br><br><input id=unit_weight type=text placeholder=\'Unit Weight (lbs.)\' onfocus=\'selectoneofthetwoinputspluscolouring(false)\'/>\r\n					\r\n	<br><br><div id=bottomofframeoptions >\r\n				<input id=save_unit type=button value=\'Add to Cart\' onclick=\'saveframe()\' onfocus=\'selectoneofthetwoinputspluscolouring(false)\'/>\r\n			</div>\r\n				</div>\r\n			</div>\r\n			<div id=all_of_the_frames_you_can_select_from >\r\n				\r\n				<div id=fr_double >\r\n					<img src=\'./frames/frame (0).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (1).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (2).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (5).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (6).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (9).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n				</div>\r\n				<div id=fr_triple >\r\n					<img src=\'./frames/frame (3).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (4).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (7).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (8).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (11).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n				</div>\r\n				<div id=fr_quad >\r\n					<img src=\'./frames/frame (10).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (12).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n				</div>\r\n				\r\n			</div>\r\n			<div id=the_little_x_in_the_top_right onclick=\'closetheframeselectwindow()\'>X</div>\r\n		</div>\r\n	<div id=content_container >\r\n		<div id=fanciest >\r\n			<div class=fancy id=disable_5 >\r\n				<p style=\'text-align:center;\'>Thank you for submitting!</p>\r\n				<input style=\'height:2.5vh;width:5vw;margin-top:32%;margin-left:3.5vw;\' type=button value=\'Return\' onclick=\'location.reload()\' />\r\n			</div>\r\n			<div class=fancy id=disable_4 >\r\n				<div id=f1 >\r\n					<input type=text id=_addnotes placeholder=\'Additional Notes\'>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_2 type=button value=\'Back\' onclick=\'back(2)\'>\r\n					<input id=f2_1_final type=button value=\'Skip\' onclick=\'next(2)\'>\r\n				</div>\r\n			</div>\r\n			<div class=fancy id=disable_3 >\r\n				<div id=f1 >\r\n					<h1>Cart:</h1>\r\n					<div id=cart_area >\r\n						<div class=container_around_selected_frames_in_the_cart_screen id=frame_1 style=\'display:none;\'>\r\n							<img id=saved_frame_1 src=\'\'>\r\n							<div>Qty: \r\n							<select id=quant_1 >\r\n								<option value=\'1\'>1</option>\r\n								<option value=\'2\'>2</option>\r\n								<option value=\'3\'>3</option>\r\n								<option value=\'4\'>4</option>\r\n								<option value=\'5\'>5</option>\r\n								<option value=\'6\'>6</option>\r\n								<option value=\'7\'>7</option>\r\n								<option value=\'8\'>8</option>\r\n								<option value=\'9\'>9</option>\r\n								<option value=\'10\'>10+</option>\r\n							</select></div>\r\n						<br>\r\n							<input id=rmv_q1 type=button value=\'Delete\' onclick=\'removeitemfromcard(1)\'/>\r\n						</div>\r\n						<div><input id=frame_add type=button value=\'Add Frame\' onclick=\'dotheframething()\'/></div>\r\n					</div>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_2 type=button value=\'Back\' onclick=\'back(2)\'>\r\n					<input id=f2_1_final type=button value=\'Skip\' onclick=\'next(2)\'/>\r\n				</div>\r\n			</div>\r\n			<div class=fancy id=disable_2 >\r\n				<div id=f1 >\r\n					<h1>Project Info:</h1>\r\n			<br>	<input class=buTy_0 id=\'_projname\' type=text placeholder=\'project name\'/>\r\n			<br><br><input class=buTy_0 id=\'_postal\' type=postalcode placeholder=\'zip/postal code\'/>\r\n			<br><br><input class=buTy_0 id=\'_neededby\' type=text placeholder=\'frames needed by  (e.g. 01/01/2021)\'/>\r\n			<br><br><form id=project_type >\r\n						<input type=radio name=\'a\' id=\'newmodel\' value=\'NewModel\'/><label for=\'newmodel\'>New Build</label>\r\n						<input type=radio name=\'a\' id=\'TI\' value=\'Newbuild/TI\'/><label for=\'TI\'>Remodel/T.I.</label>\r\n					</form>\r\n						<p style=\'position:relative;left:-25%;top:6%;\'>Roof Material:</p>\r\n					<div class=buTy_2 style=\'left:2%\'>\r\n						<input type=radio name=\'b\' id=\'1_opt_1\' value=\'opt1\'/><label for=\'1_opt_1\'>Steel Deck</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_2\' value=\'opt2\'/><label for=\'1_opt_2\'>Panelized Wood</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_3\' value=\'opt3\'/><label for=\'1_opt_3\'>Concrete</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_4\' value=\'opt4\'/><label for=\'1_opt_4\'>Gypcrete</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_5\' value=\'opt5\'/><input id=\'1_opt_text\' style=\'width:65%\' type=text placeholder=\'Other\'/>\r\n					</div>\r\n						<p style=\'position:relative;right:-25%;top:-2%;\'>Roof Structure:</p>\r\n					<div class=buTy_2 style=\'right:2%;\'>\r\n						<input type=radio name=\'c\' id=\'2_opt_1\' value=\'opt1\'/><label for=\'2_opt_1\'>Steel Joists/Beams</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_2\' value=\'opt2\'/><label for=\'2_opt_2\'>PEMB Purlins</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_3\' value=\'opt3\'/><label for=\'2_opt_3\'>Hybrid</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_4\' value=\'opt4\'/><label for=\'2_opt_4\'>Wood Trusses</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_5\' value=\'opt5\'/><input id=\'2_opt_text\' style=\'width:65%\' type=text placeholder=\'Other\'/>\r\n					</div>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_2 type=button value=\'Back\' onclick=\'back(1)\'>\r\n					<input id=f2_1 type=button value=\'Next\' onclick=\'next(1)\'/>\r\n				</div>\r\n			</div>\r\n			<div class=fancy id=disable_1 >\r\n				<div id=f1 >\r\n					<h1>Customer Info:</h1>\r\n			<br><br><input class=buTy_0 id=_fname type=text required placeholder=\'first name\'/>\r\n			<br><br><input class=buTy_0 id=_lname type=text required placeholder=\'last name\'/>\r\n			<br><br><input class=buTy_0 id=_email type=email required placeholder=\'email\'/>\r\n			<br><br><input class=buTy_0 id=_tel type=tel required placeholder=\'### ###-####\'/>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_1 type=button value=\'Next\' onclick=\'next(0)\'/>\r\n				</div>\r\n			</div>\r\n		</div>\r\n	</div>\r\n\r\n\r\n<script>\r\n	var vault={\r\n		fname:\'\',\r\n		lname:\'\',\r\n		email:\'\',\r\n		tel:\'\',\r\n		\r\n		projname:\'\',\r\n		postal:\'\',\r\n		date:\'\',\r\n		TI:\'\',\r\n		OPT1:\'\',\r\n		OPT2:\'\',\r\n		\r\n		jspace:\'\',\r\n		opsize:\'\',\r\n		uweight:\'\',\r\n		utype:\'\',\r\n		\r\n		notes:\'\'\r\n	},\r\n	istherecurrentlyaframebeingconsidered= false;\r\ntry{\r\n	function closetheframeselectwindow(){\r\n		document.getElementById(\'personalize_frame_frame\').style.opacity= \'0\';\r\n		document.getElementById(\'personalize_frame_frame\').style.visibility= \'hidden\';\r\n		\r\n		document.getElementById(\'fanciest\').style.visibility= \'visible\';\r\n		document.getElementById(\'the_void\').style.opacity= \'0\';\r\n		setTimeout(function(){\r\n			//document.getElementById(\'the_void\').style.visibility= \'hidden\';\r\n			document.getElementById(\'all_of_the_frames_you_can_select_from\').style.visibility= \'visible\';\r\n			document.getElementById(\'the_void\').style.display= \'none\';\r\n		},300);\r\n	}\r\n			function opentheframeselectwindow(){\r\n				//document.getElementById(\'the_void\').style.visibility= \'visible\';\r\n				document.getElementById(\'fanciest\').style.visibility= \'hidden\';\r\n				document.getElementById(\'the_void\').style.display= \'grid\';\r\n				document.getElementById(\'the_void\').style.opacity= \'1\';\r\n			}\r\n	\r\n	function dotheframething(){\r\n		opentheframeselectwindow();\r\n		if(!istherecurrentlyaframebeingconsidered){\r\n			istherecurrentlyaframebeingconsidered= true;\r\n			document.getElementById(\'f2_1_final\').value= \'Submit\';\r\n		} else{\r\n			\r\n		}\r\n	}\r\n	function saveframe(){\r\n		vault.jspace= document.getElementById(\'joist_space\').value;\r\n			vault.opsize= document.getElementById(\'opening_size\').value;\r\n			vault.uweight= document.getElementById(\'unit_weight\').value;\r\n			vault.utype= document.querySelector(\'input[name=\"d\"]:checked\').id;\r\n		\r\n		closetheframeselectwindow();\r\n		document.getElementById(\'frame_1\').style.display= \'block\';\r\n			document.getElementById(\'saved_frame_1\').src= \'./frames/frame (\'+(chosen_frame-1)+\').png\';\r\n			document.getElementById(\'saved_frame_1\').style.width= \'62px\';\r\n	}\r\n	\r\n	function back(a){\r\n		if(a==1){\r\n			document.getElementById(\'disable_1\').style.display= \'grid\';\r\n			document.getElementById(\'disable_1\').style.opacity= \'1\';\r\n			document.getElementById(\'disable_2\').style.opacity= \'0\';\r\n			document.getElementById(\'display_2\').style.display= \'none\'\r\n		}else if(a==2){\r\n			document.getElementById(\'disable_2\').style.display= \'grid\';\r\n			document.getElementById(\'disable_2\').style.opacity= \'1\';\r\n			document.getElementById(\'disable_3\').style.opacity= \'0\';\r\n			document.getElementById(\'display_3\').style.display= \'none\'\r\n		}\r\n	}\r\n	function next(a){\r\n		if(a==0){\r\n			vault.fname= document.getElementById(\'_fname\').value;\r\n			vault.lname= document.getElementById(\'_lname\').value;\r\n			vault.email= document.getElementById(\'_email\').value;\r\n			vault.tel= document.getElementById(\'_tel\').value;\r\n			\r\n			document.getElementById(\'disable_1\').style.display= \'none\';\r\n			document.getElementById(\'disable_2\').style.opacity= \'1\';\r\n		}else if(a==1){\r\n			vault.projname= document.getElementById(\'_projname\').value;\r\n			vault.postal= document.getElementById(\'_postal\').value;\r\n			vault.date= document.getElementById(\'_neededby\').value;\r\n			vault.TI= document.querySelector(\'input[name=\"a\"]:checked\').id;\r\n			vault.OPT1= document.querySelector(\'input[name=\"b\"]:checked\').id;\r\n			vault.OPT2= document.querySelector(\'input[name=\"c\"]:checked\').id;\r\n			\r\n			document.getElementById(\'disable_2\').style.display= \'none\';\r\n			document.getElementById(\'disable_3\').style.opacity= \'1\';\r\n			\r\n			console.log(vault);\r\n		}else if(a==2){\r\n			document.getElementById(\'disable_3\').style.display= \'none\';\r\n			document.getElementById(\'disable_4\').style.opacity= \'1\';\r\n		}\r\n	}\r\n} catch(err){console.log(err);}\r\n	\r\n</script>\r\n\r\n\r\n\r\n\r\n<!--<h1>Let QuickFrames do the take-offs and eliminate your need to detail.</h1>\r\n[contact-form-7 id=\"1936\" title=\"New QuickFrames Quote Form\"]\r\n\r\n\r\nFrom: https://wplearninglab.com/contact-form-7-get-value-from-url/\r\n\r\n<script type=\"text/javascript\">\r\nvar getUrlParameter = function getUrlParameter(sParam) {\r\n    var sPageURL = decodeURIComponent(window.location.search.substring(1)),\r\n        sURLVariables = sPageURL.split(\'&\'),\r\n        sParameterName,\r\n        i;\r\n    for (i = 0; i < sURLVariables.length; i++) {\r\n        sParameterName = sURLVariables[i].split(\'=\');\r\n        if (sParameterName[0] === sParam) {\r\n            return sParameterName[1] === undefined ? true : sParameterName[1];\r\n        }\r\n    }\r\n};\r\n\r\nvar VARIABLE = getUrlParameter(\'PARAMETER\');\r\n\r\nif (VARIABLE != null) {\r\n     document.getElementById(\'INPUT-FIELD-ID\').value = VARIABLE;\r\n}\r\n\r\n</script>\r\n\r\n\r\n<a name=\"quote-a-few-frames\"></a>\r\n\r\n[two_fifth]\r\n<h3>Need Just A Few Frames Quoted?</h3>\r\nIf you are working on a project requiring only a few frames and you know the basic requirements for how they will be used, just fill out the form to the right. We\'ll get a quote back to you within 24 hours or less!\r\n\r\nFor each framed opening, using the <a href=\"#frame-types\"> frame type examples </a> shown below, select the frame type number that most closely matches where the opening will be located relative to the joists/beams and enter that into the <strong>Type</strong> column. While RTUs are shown in these images, they apply to all types of roof top equipment. If none of the images match your configuration, enter (0).\r\n\r\n[responsive] <img class=\"alignright\" src=\"/wp-content/uploads/quote-frame-outline.jpg\" alt=\"Frame Outline Image\" width=\"320\" /> [/responsive]\r\n\r\nIf the framing will <strong>only</strong> support the duct openings and not the curbing, enter the letter (<strong><span style=\"color: #37ade1;\">Y</span></strong>) in the <strong>Duct Only</strong> column. If the framing will support the curbing and equipment, enter the letter (<strong><span style=\"color: #37ade1;\">N</span></strong>).\r\n\r\nSpecify the center-to-center joist/beam spacing as shown by (<strong><span style=\"color: #37ade1;\">A</spacing></strong>) in the image to the right.\r\n\r\nWhen specifying the frame opening size (<strong><span style=\"color: #37ade1;\">B</span></strong>), use the length of the opening running <strong>parallel</strong> to (running with) the joists or beams.\r\n\r\n[responsive] <img class=\"alignright\" src=\"/wp-content/uploads/home-install-after-roof.jpg\" alt=\"Install After Roof Image\" width=\"400\"/> [/responsive]\r\n\r\n[/two_fifth]\r\n\r\n[three_fifth_last]\r\n[contact-form-7 id=\"1036\" title=\"Expanded Quote Request Small\"]\r\n[/three_fifth_last]\r\n\r\n<a name=\"frame-types\"></a>\r\n<h2>Frame Type Examples</h2>\r\n[responsive] <img class=\"alignright\" src=\"/wp-content/uploads/quote-frame-configurations.png\" alt=\"Roof Framing Configurations\" /> [/responsive]\r\n\r\n<a name=\"quote-a-lot-of-frames\"></a>\r\n[divider type=\"space\" margintop=\"0\" marginbottom=\"20\"]\r\n\r\n<h2>Have A Large Or Complex Project? Let Us Do The Take-offs For You!</h2>\r\n[divider type=\"space\" margintop=\"0\" marginbottom=\"10\"]\r\n\r\n[one_third]\r\n[responsive] <img src=\"/wp-content/uploads/drawing-image.jpg\" alt=\"Drawing Image\" /> [/responsive]\r\n[/one_third]\r\n\r\n[two_third_last]\r\nThe simplest way for us to provide you with a customized QuickFrames quotation is for you to allow us to do the take-offs directly from the engineering drawing set.\r\n\r\nWe have developed an extensive database of roof top equipment information, such as sizes, weights, opening dimensions, and structural requirements that allows us to select the optimal roof frames for your applications. All you need to do is to provide us with access to your drawing set and then let us go to work for you. You can also have complete confidence that we treat all drawing sets as proprietary information and we respect the importance of confidentiality for anything you share with us.\r\n\r\nThe easiest way for us to access your files is for you to provide us with an FTP address, login and password. Or, if the file set is small enough, you can also email it to us.\r\n\r\n[contact-form-7 id=\"401\" title=\"Quote Request\"]\r\n\r\n[/two_third_last]-->\r\n','Testing Page','','inherit','closed','closed','','777-revision-v1','','','2020-09-08 03:06:46','2020-09-08 10:06:46','',777,'http://quickframes.miritin.com/777-revision-v1/',0,'revision','',0),(1980,1,'2020-09-08 03:10:13','2020-09-08 10:10:13','<h1>Quote Demo:</h1>\r\n\r\n<style>\r\n\r\n  body{\r\n		font-family:Arial;\r\n	}\r\n\r\n	.Frame_Tool_Img{\r\n		cursor:pointer;\r\n		margin:20px;\r\n		border:2px solid transparent;\r\n		transition:border-color 0.1s linear;\r\n	}\r\n		.Frame_Tool_Img:hover{\r\n			border-color:#79c6e8;\r\n		}\r\n	input{\r\n		text-align:center;\r\n	}\r\n	\r\n	#content_container{\r\n		position:relative;\r\n			left:25vw;\r\n		width:50vw;\r\n			height:100%;\r\n	}\r\n	\r\n	#d{display:none;}\r\n	#tupperware_0{\r\n		grid-area:1 / 1;\r\n		height:100%;\r\n			width:100%;\r\n		display:grid;\r\n			grid-auto-flow:dense;\r\n			grid-template-columns: repeat(7, 1fr);\r\n			grid-template-rows: 500px 500px 500px;\r\n	}\r\n	#tupperware_1{\r\n		grid-area:1 / 1;\r\n		display:none;\r\n	}\r\n	\r\n	#tupperware_2{display:none;}\r\n	\r\n	.coolframebutte{\r\n		width:225px;\r\n		height:auto;\r\n	}\r\n	\r\n\r\n\r\n	#disable_1{\r\n		\r\n	}\r\n	#disable_2,#disable_3,#disable_4{\r\n		opacity:0;\r\n		transition:opacity .25s ease-in-out;\r\n	}\r\n	#disable_4{\r\n		height:7vh;\r\n			width:12vw;\r\n		font-size:2vh;\r\n		top:45vh;\r\n			left:44vw;\r\n	}\r\n\r\n	.fancy{\r\n		width:20vw;\r\n			height:50vh;\r\n			border-radius:10px;\r\n		position:absolute;\r\n			left:25%;\r\n			top:25vh;\r\n		background-color:#eee;\r\n		display:grid;\r\n			grid-auto-columns:100%;\r\n			grid-template-rows:85% 15%;\r\n	}\r\n		#f1{\r\n			backround-color:#fff;\r\n			text-align:center;\r\n		}\r\n		#f2{\r\n			background-color:#bbb;\r\n		}\r\n			#f2_2{\r\n				width:25%;\r\n					height:6%;\r\n				position:absolute;\r\n					left:15%;\r\n					top:90%;\r\n			}\r\n			#f2_1,#f2_1_final{\r\n				width:25%;\r\n					height:6%;\r\n				position:absolute;\r\n					right:15%;\r\n					top:90%;\r\n			}\r\n				.buTy_0{\r\n					height:5%;\r\n						width:65%;\r\n				}\r\n				.buTy_1{\r\n					height:5%;\r\n						width:65%;\r\n				}\r\n				.buTy_2{\r\n					position:absolute;\r\n						width:45%;\r\n						height:23%;\r\n						bottom:18%;\r\n					font-size:80%;\r\n					text-align:left;\r\n					background-color:#fff;\r\n						border:solid #767676 1px;\r\n						border-radius:2px;\r\n				}\r\n					#1_opt_text{\r\n						height:1000%;\r\n					}\r\n					\r\n				#project_type{\r\n					position:relative;\r\n						width:65%;\r\n						height:5%;\r\n						left:17.5%;\r\n					font-size:80%;\r\n					background-color:#fff;\r\n						border:solid #767676 1px;\r\n						border-radius:2px;\r\n				}\r\n\r\n		#cart_area{\r\n			height:65%;\r\n			display:grid;\r\n				grid-template-columns:33% 33% 33%;\r\n				grid-auto-rows:40%;\r\n		}\r\n			.frame_frame_frame{\r\n				\r\n			}\r\n				#frame_add{\r\n					height:24%;\r\n					margin-top:35%;\r\n				}\r\n				.add_frame{\r\n					height:30%;\r\n						width:30%;\r\n					margin-top:25%;\r\n				}\r\n			#_addnotes{\r\n				position:relative;\r\n					width:90%;\r\n					height:10%;\r\n			}\r\n\r\n	#the_void{\r\n		position:absolute;\r\n			top:0;\r\n			left:0;\r\n			z-index:999;\r\n		background-color:rgba(0,0,0,0.6);\r\n		height:100%;\r\n			width:100%;\r\n		display:none;\r\n			grid-template-rows:5% 5% 85% 5%;\r\n			grid-template-columns:5% 90% 5%;\r\n			grid-template-areas:\'. . .\'\r\n								\'. a_fr a_x\'\r\n								\'. a_fr .\'\r\n								\'. . .\';\r\n		opacity:0;\r\n		transition:opacity 0.3s ease-in-out;\r\n	}\r\n		#all_of_the_frames_you_can_select_from{\r\n			grid-area:a_fr;\r\n		}\r\n			#personalize_frame_frame{\r\n				grid-area:a_fr;\r\n				visibility:hidden;\r\n				opacity:0;\r\n				transition:opacity 0.3s ease-in-out;\r\n			}\r\n		#the_little_x_in_the_top_right{\r\n			grid-area:a_x;\r\n				color:#fff;\r\n				font-size:2.4vmax;\r\n				cursor:pointer;\r\n			transition:color .1s linear;\r\n		}\r\n				#the_little_x_in_the_top_right:hover{\r\n					color:#79c6e8;\r\n				}  	\r\n			#customizations{\r\n				position:absolute;\r\n					top:20%;\r\n					height:50%;\r\n					weight:50%;\r\n					left:30%;\r\n				padding:20px;\r\n				border-radius:5px;\r\n				text-align:center;\r\n				background-color:rgba(0,0,0,0.2);\r\n			}\r\n				#bottomofframeoptions{\r\n					position:relative;\r\n						width:100%;\r\n						left:-20px;\r\n						bottom:-20px;\r\n					padding:20px;\r\n					background-color:#bbb;\r\n				}\r\n				#joist_space,#opening_size,#unit_weight{\r\n					height:2.5vh;\r\n					border:none;\r\n					border-left:5px solid transparent;\r\n					transition:border-left 0.2s linear;\r\n				}\r\n				#unit_type{\r\n					color:#fff;\r\n					text-align:left;\r\n				}\r\n			#save_unit{\r\n				width:50%;\r\n					height:2.5vh;\r\n			}\r\n			\r\n	#quickgridthing{\r\n		display:grid;\r\n			grid-template-columns:100%;\r\n			grid-template-areas:100%;\r\n	}\r\n		#grandprize__hori,#grandprize__vert{\r\n			animation:flickercolorselect 1s infinite;\r\n			visibility:hidden;\r\n		}\r\n		.blinking_arrow{\r\n			position:absolute;\r\n				left:10px;\r\n			font-size:1.6vh;\r\n			color:red;\r\n			visibility:hidden;\r\n			animation:flickercolorselect 1s infinite;\r\n		}\r\n	@keyframes flickercolorselect{\r\n		0%{opacity:0;}\r\n		50%{opacity:1;}\r\n		100%{opacity:0;}\r\n	}\r\n\r\n	\r\n	.container_around_selected_frames_in_the_cart_screen{\r\n		\r\n	}\r\n		#rmv_q1{\r\n			color:red;\r\n			border:none;\r\n			background-color:transparent;\r\n			cursor:pointer;\r\n		}\r\n			#rmv_q1:hover{\r\n				text-decoration:underline;\r\n			}\r\n\r\n</style>\r\n<script>\r\n		var input_last_selected= false;\r\n	function selectoneofthetwoinputspluscolouring(a){\r\n		if(a==\'joist\'){\r\n			if(input_last_selected==\'opening\'){\r\n				//document.getElementById(\'opening_size\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_opening\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__vert\').style.visibility= \'hidden\';\r\n			}\r\n			input_last_selected= \'joist\';\r\n			//document.getElementById(\'joist_space\').style.borderLeftColor= \'red\';\r\n			document.getElementById(\'arrow_for_joist\').style.visibility= \'visible\';\r\n			document.getElementById(\'grandprize__hori\').style.visibility= \'visible\';\r\n		} else if(a==\'opening\'){\r\n			if(input_last_selected==\'joist\'){\r\n				//document.getElementById(\'joist_space\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_joist\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__hori\').style.visibility= \'hidden\';\r\n			}\r\n			input_last_selected= \'opening\';\r\n			//document.getElementById(\'opening_size\').style.borderLeftColor= \'red\';\r\n			document.getElementById(\'arrow_for_opening\').style.visibility= \'visible\';\r\n			document.getElementById(\'grandprize__vert\').style.visibility= \'visible\';\r\n		} else if(!a){\r\n			if(input_last_selected==\'joist\'){\r\n				//document.getElementById(\'joist_space\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_joist\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__hori\').style.visibility= \'hidden\';\r\n			} else if(input_last_selected==\'opening\'){\r\n				//document.getElementById(\'opening_size\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_opening\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__vert\').style.visibility= \'hidden\';\r\n			}\r\n		}\r\n	}\r\n	\r\n		var chosen_frame;\r\n	function choose(a){\r\n			let a6=a.src.length-6,a7=a.src.length-7;\r\n		chosen_frame= parseInt(a.src[a7]!=\'(\'?(a.src[a7]+a.src[a6]):a.src[a6])+1;\r\n		\r\n		//document.getElementById(\'tupperware_0\').style.visibility= \'hidden\';\r\n			//document.getElementById(\'tupperware_1\').style.display= \'block\';\r\n		\r\n		document.getElementById(\'grandprize\').src= \'./frames/dry (\'+(chosen_frame-1)+\').png\';\r\n			setTimeout(function(){document.getElementById(\'grandprize\').style.width= \'375px\';},50);\r\n		\r\n		\r\n		document.getElementById(\'all_of_the_frames_you_can_select_from\').style.visibility= \'hidden\';\r\n		document.getElementById(\'personalize_frame_frame\').style.visibility= \'visible\';\r\n				document.getElementById(\'grandprize__hori\').src= \'./frames/hori (\'+(chosen_frame-1)+\').png\';\r\n				document.getElementById(\'grandprize__vert\').src= \'./frames/vert (\'+(chosen_frame-1)+\').png\';\r\n					setTimeout(function(){\r\n								document.getElementById(\'grandprize__hori\').style.width= \'375px\';\r\n								document.getElementById(\'grandprize__vert\').style.width= \'375px\';\r\n							},50);\r\n			document.getElementById(\'personalize_frame_frame\').style.opacity= \'1\';\r\n		\r\n		if(chosen_frame==3 || chosen_frame==10){\r\n			document.getElementById(\'grandprize__vert\').hidden= true;\r\n			document.getElementById(\'opening_size\').hidden= true;\r\n			document.getElementById(\'arrow_for_opening\').hidden= true;\r\n		} else{\r\n			document.getElementById(\'grandprize__vert\').hidden= false;\r\n			document.getElementById(\'opening_size\').hidden= false;\r\n			document.getElementById(\'arrow_for_opening\').hidden= false;\r\n		}\r\n		\r\n		document.getElementById(\'joist_space\').focus();\r\n		\r\n		\r\n		/*	\r\n		let vHeight= document.getElementById(\'grandprize\').height,\r\n			vWidth= document.getElementById(\'grandprize\').width;\r\n			\r\n		document.getElementById(\'ch_width\').style.left= ((vWidth - document.getElementById(\'ch_width\').style.width)/2)+\'px\';\r\n		*/\r\n	}\r\n	\r\n	function removeitemfromcard(a){\r\n		//add stuff here to remove set image\r\n		document.getElementById(\'frame_\'+a).style.display= \'none\';\r\n	}\r\n	\r\n	\r\n/*\r\n\r\nSUBMIT\r\n- include \'additional notes\' section\r\n- links to plans (URL)\r\n	- OR -\r\n- file upload\r\n- CAPTCHA\r\n\r\n*/\r\n</script>\r\n<!--	-->\r\n		<div id=the_void >\r\n			<div id=personalize_frame_frame >\r\n				<div id=quickgridthing >\r\n					<img class=\'Frame_Tool_Img\' id=grandprize__hori src=\'./blue2.png\' style=\'grid-area:1 / 1;\'>\r\n					<img class=\'Frame_Tool_Img\' id=grandprize__vert src=\'./blue1.png\' style=\'grid-area:1 / 1;\'>\r\n					<img class=\'Frame_Tool_Img\' id=grandprize src=\'\' style=\'grid-area:1 / 1;\'>\r\n				</div>\r\n				<div id=customizations >\r\n				\r\n				<div id=arrow_for_joist class=blinking_arrow >►</div>\r\n				<input id=joist_space type=text placeholder=\'Joist Spacing (in.)\' onfocus=\'selectoneofthetwoinputspluscolouring(\"joist\")\'/>\r\n					\r\n				<br><br>\r\n					<div id=arrow_for_opening class=blinking_arrow >►</div>\r\n				<input id=opening_size type=text placeholder=\'Opening Size (in.)\' onfocus=\'selectoneofthetwoinputspluscolouring(\"opening\")\'/>\r\n					\r\n				<br><br><div id=unit_type onclick=\'selectoneofthetwoinputspluscolouring(false)\'>\r\n						<p style=\'text-align:center;\'>Unit Type:</p>\r\n						<div style=\'\r\n						background-color:#fff;\r\n							border:solid #767676 1px;\r\n							border-radius:2px;\r\n							color:#000;\r\n							font-size:80%;\r\n							padding:5px;\' >\r\n							<input type=radio name=\'d\' id=\'u_opt_1\' value=\'opt1\' onfocus=\'selectoneofthetwoinputspluscolouring(false)\'/><label for=\'u_opt_1\'>RTU/AHU/MAU</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_2\' value=\'opt2\'/><label for=\'u_opt_2\'>EVAP Coolers</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_3\' value=\'opt3\'/><label for=\'u_opt_3\'>Exhaust Fans</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_4\' value=\'opt4\'/><label for=\'u_opt_4\'>Powered Vents</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_5\' value=\'opt5\'/><label for=\'u_opt_5\'>Gravity Vents</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_6\' value=\'opt6\'/><label for=\'u_opt_6\'>Skylights</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_7\' value=\'opt7\'/><label for=\'u_opt_7\'>Roof Drains</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_8\' value=\'opt8\'/><label for=\'u_opt_8\'>Roof Hatch</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_9\' value=\'opt9\'/><label for=\'u_opt_9\'>Floor Openings</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_text\' value=\'opt10\'/><input id=\'u_opt_text\' style=\'width:65%\' type=text placeholder=\'Other\'/>\r\n						</div>\r\n					</div>\r\n					\r\n			<br><br><input id=unit_weight type=text placeholder=\'Unit Weight (lbs.)\' onfocus=\'selectoneofthetwoinputspluscolouring(false)\'/>\r\n					\r\n	<br><br><div id=bottomofframeoptions >\r\n				<input id=save_unit type=button value=\'Add to Cart\' onclick=\'saveframe()\' onfocus=\'selectoneofthetwoinputspluscolouring(false)\'/>\r\n			</div>\r\n				</div>\r\n			</div>\r\n			<div id=all_of_the_frames_you_can_select_from >\r\n				\r\n				<div id=fr_double >\r\n					<img src=\'./frames/frame (0).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (1).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (2).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (5).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (6).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (9).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n				</div>\r\n				<div id=fr_triple >\r\n					<img src=\'./frames/frame (3).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (4).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (7).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (8).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (11).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n				</div>\r\n				<div id=fr_quad >\r\n					<img src=\'./frames/frame (10).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (12).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n				</div>\r\n				\r\n			</div>\r\n			<div id=the_little_x_in_the_top_right onclick=\'closetheframeselectwindow()\'>X</div>\r\n		</div>\r\n\r\n\r\n		<div id=fanciest >\r\n			<div class=fancy id=disable_5 >\r\n				<p style=\'text-align:center;\'>Thank you for submitting!</p>\r\n				<input style=\'height:2.5vh;width:5vw;margin-top:32%;margin-left:3.5vw;\' type=button value=\'Return\' onclick=\'location.reload()\' />\r\n			</div>\r\n			<div class=fancy id=disable_4 >\r\n				<div id=f1 >\r\n					<input type=text id=_addnotes placeholder=\'Additional Notes\'>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_2 type=button value=\'Back\' onclick=\'back(2)\'>\r\n					<input id=f2_1_final type=button value=\'Skip\' onclick=\'next(2)\'>\r\n				</div>\r\n			</div>\r\n			<div class=fancy id=disable_3 >\r\n				<div id=f1 >\r\n					<h1>Cart:</h1>\r\n					<div id=cart_area >\r\n						<div class=container_around_selected_frames_in_the_cart_screen id=frame_1 style=\'display:none;\'>\r\n							<img id=saved_frame_1 src=\'\'>\r\n							<div>Qty: \r\n							<select id=quant_1 >\r\n								<option value=\'1\'>1</option>\r\n								<option value=\'2\'>2</option>\r\n								<option value=\'3\'>3</option>\r\n								<option value=\'4\'>4</option>\r\n								<option value=\'5\'>5</option>\r\n								<option value=\'6\'>6</option>\r\n								<option value=\'7\'>7</option>\r\n								<option value=\'8\'>8</option>\r\n								<option value=\'9\'>9</option>\r\n								<option value=\'10\'>10+</option>\r\n							</select></div>\r\n						<br>\r\n							<input id=rmv_q1 type=button value=\'Delete\' onclick=\'removeitemfromcard(1)\'/>\r\n						</div>\r\n						<div><input id=frame_add type=button value=\'Add Frame\' onclick=\'dotheframething()\'/></div>\r\n					</div>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_2 type=button value=\'Back\' onclick=\'back(2)\'>\r\n					<input id=f2_1_final type=button value=\'Skip\' onclick=\'next(2)\'/>\r\n				</div>\r\n			</div>\r\n			<div class=fancy id=disable_2 >\r\n				<div id=f1 >\r\n					<h1>Project Info:</h1>\r\n			<br>	<input class=buTy_0 id=\'_projname\' type=text placeholder=\'project name\'/>\r\n			<br><br><input class=buTy_0 id=\'_postal\' type=postalcode placeholder=\'zip/postal code\'/>\r\n			<br><br><input class=buTy_0 id=\'_neededby\' type=text placeholder=\'frames needed by  (e.g. 01/01/2021)\'/>\r\n			<br><br><form id=project_type >\r\n						<input type=radio name=\'a\' id=\'newmodel\' value=\'NewModel\'/><label for=\'newmodel\'>New Build</label>\r\n						<input type=radio name=\'a\' id=\'TI\' value=\'Newbuild/TI\'/><label for=\'TI\'>Remodel/T.I.</label>\r\n					</form>\r\n						<p style=\'position:relative;left:-25%;top:6%;\'>Roof Material:</p>\r\n					<div class=buTy_2 style=\'left:2%\'>\r\n						<input type=radio name=\'b\' id=\'1_opt_1\' value=\'opt1\'/><label for=\'1_opt_1\'>Steel Deck</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_2\' value=\'opt2\'/><label for=\'1_opt_2\'>Panelized Wood</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_3\' value=\'opt3\'/><label for=\'1_opt_3\'>Concrete</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_4\' value=\'opt4\'/><label for=\'1_opt_4\'>Gypcrete</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_5\' value=\'opt5\'/><input id=\'1_opt_text\' style=\'width:65%\' type=text placeholder=\'Other\'/>\r\n					</div>\r\n						<p style=\'position:relative;right:-25%;top:-2%;\'>Roof Structure:</p>\r\n					<div class=buTy_2 style=\'right:2%;\'>\r\n						<input type=radio name=\'c\' id=\'2_opt_1\' value=\'opt1\'/><label for=\'2_opt_1\'>Steel Joists/Beams</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_2\' value=\'opt2\'/><label for=\'2_opt_2\'>PEMB Purlins</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_3\' value=\'opt3\'/><label for=\'2_opt_3\'>Hybrid</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_4\' value=\'opt4\'/><label for=\'2_opt_4\'>Wood Trusses</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_5\' value=\'opt5\'/><input id=\'2_opt_text\' style=\'width:65%\' type=text placeholder=\'Other\'/>\r\n					</div>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_2 type=button value=\'Back\' onclick=\'back(1)\'>\r\n					<input id=f2_1 type=button value=\'Next\' onclick=\'next(1)\'/>\r\n				</div>\r\n			</div>\r\n			<div class=fancy id=disable_1 >\r\n				<div id=f1 >\r\n					<h1>Customer Info:</h1>\r\n			<br><br><input class=buTy_0 id=_fname type=text required placeholder=\'first name\'/>\r\n			<br><br><input class=buTy_0 id=_lname type=text required placeholder=\'last name\'/>\r\n			<br><br><input class=buTy_0 id=_email type=email required placeholder=\'email\'/>\r\n			<br><br><input class=buTy_0 id=_tel type=tel required placeholder=\'### ###-####\'/>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_1 type=button value=\'Next\' onclick=\'next(0)\'/>\r\n				</div>\r\n			</div>\r\n		</div>\r\n\r\n\r\n<script>\r\n	var vault={\r\n		fname:\'\',\r\n		lname:\'\',\r\n		email:\'\',\r\n		tel:\'\',\r\n		\r\n		projname:\'\',\r\n		postal:\'\',\r\n		date:\'\',\r\n		TI:\'\',\r\n		OPT1:\'\',\r\n		OPT2:\'\',\r\n		\r\n		jspace:\'\',\r\n		opsize:\'\',\r\n		uweight:\'\',\r\n		utype:\'\',\r\n		\r\n		notes:\'\'\r\n	},\r\n	istherecurrentlyaframebeingconsidered= false;\r\ntry{\r\n	function closetheframeselectwindow(){\r\n		document.getElementById(\'personalize_frame_frame\').style.opacity= \'0\';\r\n		document.getElementById(\'personalize_frame_frame\').style.visibility= \'hidden\';\r\n		\r\n		document.getElementById(\'fanciest\').style.visibility= \'visible\';\r\n		document.getElementById(\'the_void\').style.opacity= \'0\';\r\n		setTimeout(function(){\r\n			//document.getElementById(\'the_void\').style.visibility= \'hidden\';\r\n			document.getElementById(\'all_of_the_frames_you_can_select_from\').style.visibility= \'visible\';\r\n			document.getElementById(\'the_void\').style.display= \'none\';\r\n		},300);\r\n	}\r\n			function opentheframeselectwindow(){\r\n				//document.getElementById(\'the_void\').style.visibility= \'visible\';\r\n				document.getElementById(\'fanciest\').style.visibility= \'hidden\';\r\n				document.getElementById(\'the_void\').style.display= \'grid\';\r\n				document.getElementById(\'the_void\').style.opacity= \'1\';\r\n			}\r\n	\r\n	function dotheframething(){\r\n		opentheframeselectwindow();\r\n		if(!istherecurrentlyaframebeingconsidered){\r\n			istherecurrentlyaframebeingconsidered= true;\r\n			document.getElementById(\'f2_1_final\').value= \'Submit\';\r\n		} else{\r\n			\r\n		}\r\n	}\r\n	function saveframe(){\r\n		vault.jspace= document.getElementById(\'joist_space\').value;\r\n			vault.opsize= document.getElementById(\'opening_size\').value;\r\n			vault.uweight= document.getElementById(\'unit_weight\').value;\r\n			vault.utype= document.querySelector(\'input[name=\"d\"]:checked\').id;\r\n		\r\n		closetheframeselectwindow();\r\n		document.getElementById(\'frame_1\').style.display= \'block\';\r\n			document.getElementById(\'saved_frame_1\').src= \'./frames/frame (\'+(chosen_frame-1)+\').png\';\r\n			document.getElementById(\'saved_frame_1\').style.width= \'62px\';\r\n	}\r\n	\r\n	function back(a){\r\n		if(a==1){\r\n			document.getElementById(\'disable_1\').style.display= \'grid\';\r\n			document.getElementById(\'disable_1\').style.opacity= \'1\';\r\n			document.getElementById(\'disable_2\').style.opacity= \'0\';\r\n			document.getElementById(\'display_2\').style.display= \'none\'\r\n		}else if(a==2){\r\n			document.getElementById(\'disable_2\').style.display= \'grid\';\r\n			document.getElementById(\'disable_2\').style.opacity= \'1\';\r\n			document.getElementById(\'disable_3\').style.opacity= \'0\';\r\n			document.getElementById(\'display_3\').style.display= \'none\'\r\n		}\r\n	}\r\n	function next(a){\r\n		if(a==0){\r\n			vault.fname= document.getElementById(\'_fname\').value;\r\n			vault.lname= document.getElementById(\'_lname\').value;\r\n			vault.email= document.getElementById(\'_email\').value;\r\n			vault.tel= document.getElementById(\'_tel\').value;\r\n			\r\n			document.getElementById(\'disable_1\').style.display= \'none\';\r\n			document.getElementById(\'disable_2\').style.opacity= \'1\';\r\n		}else if(a==1){\r\n			vault.projname= document.getElementById(\'_projname\').value;\r\n			vault.postal= document.getElementById(\'_postal\').value;\r\n			vault.date= document.getElementById(\'_neededby\').value;\r\n			vault.TI= document.querySelector(\'input[name=\"a\"]:checked\').id;\r\n			vault.OPT1= document.querySelector(\'input[name=\"b\"]:checked\').id;\r\n			vault.OPT2= document.querySelector(\'input[name=\"c\"]:checked\').id;\r\n			\r\n			document.getElementById(\'disable_2\').style.display= \'none\';\r\n			document.getElementById(\'disable_3\').style.opacity= \'1\';\r\n			\r\n			console.log(vault);\r\n		}else if(a==2){\r\n			document.getElementById(\'disable_3\').style.display= \'none\';\r\n			document.getElementById(\'disable_4\').style.opacity= \'1\';\r\n		}\r\n	}\r\n} catch(err){console.log(err);}\r\n	\r\n</script>\r\n\r\n\r\n\r\n\r\n<!--<h1>Let QuickFrames do the take-offs and eliminate your need to detail.</h1>\r\n[contact-form-7 id=\"1936\" title=\"New QuickFrames Quote Form\"]\r\n\r\n\r\nFrom: https://wplearninglab.com/contact-form-7-get-value-from-url/\r\n\r\n<script type=\"text/javascript\">\r\nvar getUrlParameter = function getUrlParameter(sParam) {\r\n    var sPageURL = decodeURIComponent(window.location.search.substring(1)),\r\n        sURLVariables = sPageURL.split(\'&\'),\r\n        sParameterName,\r\n        i;\r\n    for (i = 0; i < sURLVariables.length; i++) {\r\n        sParameterName = sURLVariables[i].split(\'=\');\r\n        if (sParameterName[0] === sParam) {\r\n            return sParameterName[1] === undefined ? true : sParameterName[1];\r\n        }\r\n    }\r\n};\r\n\r\nvar VARIABLE = getUrlParameter(\'PARAMETER\');\r\n\r\nif (VARIABLE != null) {\r\n     document.getElementById(\'INPUT-FIELD-ID\').value = VARIABLE;\r\n}\r\n\r\n</script>\r\n\r\n\r\n<a name=\"quote-a-few-frames\"></a>\r\n\r\n[two_fifth]\r\n<h3>Need Just A Few Frames Quoted?</h3>\r\nIf you are working on a project requiring only a few frames and you know the basic requirements for how they will be used, just fill out the form to the right. We\'ll get a quote back to you within 24 hours or less!\r\n\r\nFor each framed opening, using the <a href=\"#frame-types\"> frame type examples </a> shown below, select the frame type number that most closely matches where the opening will be located relative to the joists/beams and enter that into the <strong>Type</strong> column. While RTUs are shown in these images, they apply to all types of roof top equipment. If none of the images match your configuration, enter (0).\r\n\r\n[responsive] <img class=\"alignright\" src=\"/wp-content/uploads/quote-frame-outline.jpg\" alt=\"Frame Outline Image\" width=\"320\" /> [/responsive]\r\n\r\nIf the framing will <strong>only</strong> support the duct openings and not the curbing, enter the letter (<strong><span style=\"color: #37ade1;\">Y</span></strong>) in the <strong>Duct Only</strong> column. If the framing will support the curbing and equipment, enter the letter (<strong><span style=\"color: #37ade1;\">N</span></strong>).\r\n\r\nSpecify the center-to-center joist/beam spacing as shown by (<strong><span style=\"color: #37ade1;\">A</spacing></strong>) in the image to the right.\r\n\r\nWhen specifying the frame opening size (<strong><span style=\"color: #37ade1;\">B</span></strong>), use the length of the opening running <strong>parallel</strong> to (running with) the joists or beams.\r\n\r\n[responsive] <img class=\"alignright\" src=\"/wp-content/uploads/home-install-after-roof.jpg\" alt=\"Install After Roof Image\" width=\"400\"/> [/responsive]\r\n\r\n[/two_fifth]\r\n\r\n[three_fifth_last]\r\n[contact-form-7 id=\"1036\" title=\"Expanded Quote Request Small\"]\r\n[/three_fifth_last]\r\n\r\n<a name=\"frame-types\"></a>\r\n<h2>Frame Type Examples</h2>\r\n[responsive] <img class=\"alignright\" src=\"/wp-content/uploads/quote-frame-configurations.png\" alt=\"Roof Framing Configurations\" /> [/responsive]\r\n\r\n<a name=\"quote-a-lot-of-frames\"></a>\r\n[divider type=\"space\" margintop=\"0\" marginbottom=\"20\"]\r\n\r\n<h2>Have A Large Or Complex Project? Let Us Do The Take-offs For You!</h2>\r\n[divider type=\"space\" margintop=\"0\" marginbottom=\"10\"]\r\n\r\n[one_third]\r\n[responsive] <img src=\"/wp-content/uploads/drawing-image.jpg\" alt=\"Drawing Image\" /> [/responsive]\r\n[/one_third]\r\n\r\n[two_third_last]\r\nThe simplest way for us to provide you with a customized QuickFrames quotation is for you to allow us to do the take-offs directly from the engineering drawing set.\r\n\r\nWe have developed an extensive database of roof top equipment information, such as sizes, weights, opening dimensions, and structural requirements that allows us to select the optimal roof frames for your applications. All you need to do is to provide us with access to your drawing set and then let us go to work for you. You can also have complete confidence that we treat all drawing sets as proprietary information and we respect the importance of confidentiality for anything you share with us.\r\n\r\nThe easiest way for us to access your files is for you to provide us with an FTP address, login and password. Or, if the file set is small enough, you can also email it to us.\r\n\r\n[contact-form-7 id=\"401\" title=\"Quote Request\"]\r\n\r\n[/two_third_last]-->\r\n','Testing Page','','inherit','closed','closed','','777-revision-v1','','','2020-09-08 03:10:13','2020-09-08 10:10:13','',777,'http://quickframes.miritin.com/777-revision-v1/',0,'revision','',0),(1981,1,'2020-09-08 03:15:57','2020-09-08 10:15:57','<h1>Quote Demo:</h1>\r\n\r\n<style>\r\n\r\n  body{\r\n		font-family:Arial;\r\n	}\r\n\r\n	.Frame_Tool_Img{\r\n		cursor:pointer;\r\n		margin:20px;\r\n		border:2px solid transparent;\r\n		transition:border-color 0.1s linear;\r\n	}\r\n		.Frame_Tool_Img:hover{\r\n			border-color:#79c6e8;\r\n		}\r\n	input{\r\n		text-align:center;\r\n	}\r\n	\r\n	#content_container{\r\n		position:relative;\r\n			left:25vw;\r\n		width:50vw;\r\n			height:100%;\r\n	}\r\n	\r\n	#d{display:none;}\r\n	#tupperware_0{\r\n		grid-area:1 / 1;\r\n		height:100%;\r\n			width:100%;\r\n		display:grid;\r\n			grid-auto-flow:dense;\r\n			grid-template-columns: repeat(7, 1fr);\r\n			grid-template-rows: 500px 500px 500px;\r\n	}\r\n	#tupperware_1{\r\n		grid-area:1 / 1;\r\n		display:none;\r\n	}\r\n	\r\n	#tupperware_2{display:none;}\r\n	\r\n	.coolframebutte{\r\n		width:225px;\r\n		height:auto;\r\n	}\r\n	\r\n\r\n\r\n	#disable_1{\r\n		\r\n	}\r\n	#disable_2,#disable_3,#disable_4{\r\n		opacity:0;\r\n		transition:opacity .25s ease-in-out;\r\n	}\r\n	#disable_4{\r\n		height:7vh;\r\n			width:12vw;\r\n		font-size:2vh;\r\n		top:45vh;\r\n			left:44vw;\r\n	}\r\n\r\n	.fancy{\r\n		width:20vw;\r\n			height:50vh;\r\n			border-radius:10px;\r\n		position:absolute;\r\n			left:25%;\r\n			top:25vh;\r\n		background-color:#eee;\r\n		display:grid;\r\n			grid-auto-columns:100%;\r\n			grid-template-rows:85% 15%;\r\n	}\r\n		#f1{\r\n			backround-color:#fff;\r\n			text-align:center;\r\n		}\r\n		#f2{\r\n			background-color:#bbb;\r\n		}\r\n			#f2_2{\r\n				width:25%;\r\n					height:6%;\r\n				position:absolute;\r\n					left:15%;\r\n					top:90%;\r\n			}\r\n			#f2_1,#f2_1_final{\r\n				width:25%;\r\n					height:6%;\r\n				position:absolute;\r\n					right:15%;\r\n					top:90%;\r\n			}\r\n				.buTy_0{\r\n					height:5%;\r\n						width:65%;\r\n				}\r\n				.buTy_1{\r\n					height:5%;\r\n						width:65%;\r\n				}\r\n				.buTy_2{\r\n					position:absolute;\r\n						width:45%;\r\n						height:23%;\r\n						bottom:18%;\r\n					font-size:80%;\r\n					text-align:left;\r\n					background-color:#fff;\r\n						border:solid #767676 1px;\r\n						border-radius:2px;\r\n				}\r\n					#1_opt_text{\r\n						height:1000%;\r\n					}\r\n					\r\n				#project_type{\r\n					position:relative;\r\n						width:65%;\r\n						height:5%;\r\n						left:17.5%;\r\n					font-size:80%;\r\n					background-color:#fff;\r\n						border:solid #767676 1px;\r\n						border-radius:2px;\r\n				}\r\n\r\n		#cart_area{\r\n			height:65%;\r\n			display:grid;\r\n				grid-template-columns:33% 33% 33%;\r\n				grid-auto-rows:40%;\r\n		}\r\n			.frame_frame_frame{\r\n				\r\n			}\r\n				#frame_add{\r\n					height:24%;\r\n					margin-top:35%;\r\n				}\r\n				.add_frame{\r\n					height:30%;\r\n						width:30%;\r\n					margin-top:25%;\r\n				}\r\n			#_addnotes{\r\n				position:relative;\r\n					width:90%;\r\n					height:10%;\r\n			}\r\n\r\n	#the_void{\r\n		position:absolute;\r\n			top:0;\r\n			left:0;\r\n			z-index:999;\r\n		background-color:rgba(0,0,0,0.6);\r\n		height:100%;\r\n			width:100%;\r\n		display:none;\r\n			grid-template-rows:5% 5% 85% 5%;\r\n			grid-template-columns:5% 90% 5%;\r\n			grid-template-areas:\'. . .\'\r\n								\'. a_fr a_x\'\r\n								\'. a_fr .\'\r\n								\'. . .\';\r\n		opacity:0;\r\n		transition:opacity 0.3s ease-in-out;\r\n	}\r\n		#all_of_the_frames_you_can_select_from{\r\n			grid-area:a_fr;\r\n		}\r\n			#personalize_frame_frame{\r\n				grid-area:a_fr;\r\n				visibility:hidden;\r\n				opacity:0;\r\n				transition:opacity 0.3s ease-in-out;\r\n			}\r\n		#the_little_x_in_the_top_right{\r\n			grid-area:a_x;\r\n				color:#fff;\r\n				font-size:2.4vmax;\r\n				cursor:pointer;\r\n			transition:color .1s linear;\r\n		}\r\n				#the_little_x_in_the_top_right:hover{\r\n					color:#79c6e8;\r\n				}  	\r\n			#customizations{\r\n				position:absolute;\r\n					top:20%;\r\n					height:50%;\r\n					weight:50%;\r\n					left:30%;\r\n				padding:20px;\r\n				border-radius:5px;\r\n				text-align:center;\r\n				background-color:rgba(0,0,0,0.2);\r\n			}\r\n				#bottomofframeoptions{\r\n					position:relative;\r\n						width:100%;\r\n						left:-20px;\r\n						bottom:-20px;\r\n					padding:20px;\r\n					background-color:#bbb;\r\n				}\r\n				#joist_space,#opening_size,#unit_weight{\r\n					height:2.5vh;\r\n					border:none;\r\n					border-left:5px solid transparent;\r\n					transition:border-left 0.2s linear;\r\n				}\r\n				#unit_type{\r\n					color:#fff;\r\n					text-align:left;\r\n				}\r\n			#save_unit{\r\n				width:50%;\r\n					height:2.5vh;\r\n			}\r\n			\r\n	#quickgridthing{\r\n		display:grid;\r\n			grid-template-columns:100%;\r\n			grid-template-areas:100%;\r\n	}\r\n		#grandprize__hori,#grandprize__vert{\r\n			animation:flickercolorselect 1s infinite;\r\n			visibility:hidden;\r\n		}\r\n		.blinking_arrow{\r\n			position:absolute;\r\n				left:10px;\r\n			font-size:1.6vh;\r\n			color:red;\r\n			visibility:hidden;\r\n			animation:flickercolorselect 1s infinite;\r\n		}\r\n	@keyframes flickercolorselect{\r\n		0%{opacity:0;}\r\n		50%{opacity:1;}\r\n		100%{opacity:0;}\r\n	}\r\n\r\n	\r\n	.container_around_selected_frames_in_the_cart_screen{\r\n		\r\n	}\r\n		#rmv_q1{\r\n			color:red;\r\n			border:none;\r\n			background-color:transparent;\r\n			cursor:pointer;\r\n		}\r\n			#rmv_q1:hover{\r\n				text-decoration:underline;\r\n			}\r\n\r\n</style>\r\n<script>\r\n		var input_last_selected= false;\r\n	function selectoneofthetwoinputspluscolouring(a){\r\n		if(a==\'joist\'){\r\n			if(input_last_selected==\'opening\'){\r\n				//document.getElementById(\'opening_size\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_opening\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__vert\').style.visibility= \'hidden\';\r\n			}\r\n			input_last_selected= \'joist\';\r\n			//document.getElementById(\'joist_space\').style.borderLeftColor= \'red\';\r\n			document.getElementById(\'arrow_for_joist\').style.visibility= \'visible\';\r\n			document.getElementById(\'grandprize__hori\').style.visibility= \'visible\';\r\n		} else if(a==\'opening\'){\r\n			if(input_last_selected==\'joist\'){\r\n				//document.getElementById(\'joist_space\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_joist\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__hori\').style.visibility= \'hidden\';\r\n			}\r\n			input_last_selected= \'opening\';\r\n			//document.getElementById(\'opening_size\').style.borderLeftColor= \'red\';\r\n			document.getElementById(\'arrow_for_opening\').style.visibility= \'visible\';\r\n			document.getElementById(\'grandprize__vert\').style.visibility= \'visible\';\r\n		} else if(!a){\r\n			if(input_last_selected==\'joist\'){\r\n				//document.getElementById(\'joist_space\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_joist\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__hori\').style.visibility= \'hidden\';\r\n			} else if(input_last_selected==\'opening\'){\r\n				//document.getElementById(\'opening_size\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_opening\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__vert\').style.visibility= \'hidden\';\r\n			}\r\n		}\r\n	}\r\n	\r\n		var chosen_frame;\r\n	function choose(a){\r\n			let a6=a.src.length-6,a7=a.src.length-7;\r\n		chosen_frame= parseInt(a.src[a7]!=\'(\'?(a.src[a7]+a.src[a6]):a.src[a6])+1;\r\n		\r\n		//document.getElementById(\'tupperware_0\').style.visibility= \'hidden\';\r\n			//document.getElementById(\'tupperware_1\').style.display= \'block\';\r\n		\r\n		document.getElementById(\'grandprize\').src= \'./frames/dry (\'+(chosen_frame-1)+\').png\';\r\n			setTimeout(function(){document.getElementById(\'grandprize\').style.width= \'375px\';},50);\r\n		\r\n		\r\n		document.getElementById(\'all_of_the_frames_you_can_select_from\').style.visibility= \'hidden\';\r\n		document.getElementById(\'personalize_frame_frame\').style.visibility= \'visible\';\r\n				document.getElementById(\'grandprize__hori\').src= \'./frames/hori (\'+(chosen_frame-1)+\').png\';\r\n				document.getElementById(\'grandprize__vert\').src= \'./frames/vert (\'+(chosen_frame-1)+\').png\';\r\n					setTimeout(function(){\r\n								document.getElementById(\'grandprize__hori\').style.width= \'375px\';\r\n								document.getElementById(\'grandprize__vert\').style.width= \'375px\';\r\n							},50);\r\n			document.getElementById(\'personalize_frame_frame\').style.opacity= \'1\';\r\n		\r\n		if(chosen_frame==3 || chosen_frame==10){\r\n			document.getElementById(\'grandprize__vert\').hidden= true;\r\n			document.getElementById(\'opening_size\').hidden= true;\r\n			document.getElementById(\'arrow_for_opening\').hidden= true;\r\n		} else{\r\n			document.getElementById(\'grandprize__vert\').hidden= false;\r\n			document.getElementById(\'opening_size\').hidden= false;\r\n			document.getElementById(\'arrow_for_opening\').hidden= false;\r\n		}\r\n		\r\n		document.getElementById(\'joist_space\').focus();\r\n		\r\n		\r\n		/*	\r\n		let vHeight= document.getElementById(\'grandprize\').height,\r\n			vWidth= document.getElementById(\'grandprize\').width;\r\n			\r\n		document.getElementById(\'ch_width\').style.left= ((vWidth - document.getElementById(\'ch_width\').style.width)/2)+\'px\';\r\n		*/\r\n	}\r\n	\r\n	function removeitemfromcard(a){\r\n		//add stuff here to remove set image\r\n		document.getElementById(\'frame_\'+a).style.display= \'none\';\r\n	}\r\n	\r\n	\r\n/*\r\n\r\nSUBMIT\r\n- include \'additional notes\' section\r\n- links to plans (URL)\r\n	- OR -\r\n- file upload\r\n- CAPTCHA\r\n\r\n*/\r\n</script>\r\n<!--	-->\r\n		<div id=the_void  style=\"\r\n			position:absolute;\r\n			top:0;\r\n			left:0;\r\n			z-index:999;\r\n		background-color:rgba(0,0,0,0.6);\r\n		height:100%;\r\n			width:100%;\r\n		display:none;\r\n			grid-template-rows:5% 5% 85% 5%;\r\n			grid-template-columns:5% 90% 5%;\r\n			grid-template-areas:\'. . .\'\r\n								\'. a_fr a_x\'\r\n								\'. a_fr .\'\r\n								\'. . .\';\r\n		opacity:0;\r\n		transition:opacity 0.3s ease-in-out;\r\n		\">\r\n			<div id=personalize_frame_frame >\r\n				<div id=quickgridthing >\r\n					<img class=\'Frame_Tool_Img\' id=grandprize__hori src=\'./blue2.png\' style=\'grid-area:1 / 1;\'>\r\n					<img class=\'Frame_Tool_Img\' id=grandprize__vert src=\'./blue1.png\' style=\'grid-area:1 / 1;\'>\r\n					<img class=\'Frame_Tool_Img\' id=grandprize src=\'\' style=\'grid-area:1 / 1;\'>\r\n				</div>\r\n				<div id=customizations >\r\n				\r\n				<div id=arrow_for_joist class=blinking_arrow >►</div>\r\n				<input id=joist_space type=text placeholder=\'Joist Spacing (in.)\' onfocus=\'selectoneofthetwoinputspluscolouring(\"joist\")\'/>\r\n					\r\n				<br><br>\r\n					<div id=arrow_for_opening class=blinking_arrow >►</div>\r\n				<input id=opening_size type=text placeholder=\'Opening Size (in.)\' onfocus=\'selectoneofthetwoinputspluscolouring(\"opening\")\'/>\r\n					\r\n				<br><br><div id=unit_type onclick=\'selectoneofthetwoinputspluscolouring(false)\'>\r\n						<p style=\'text-align:center;\'>Unit Type:</p>\r\n						<div style=\'\r\n						background-color:#fff;\r\n							border:solid #767676 1px;\r\n							border-radius:2px;\r\n							color:#000;\r\n							font-size:80%;\r\n							padding:5px;\' >\r\n							<input type=radio name=\'d\' id=\'u_opt_1\' value=\'opt1\' onfocus=\'selectoneofthetwoinputspluscolouring(false)\'/><label for=\'u_opt_1\'>RTU/AHU/MAU</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_2\' value=\'opt2\'/><label for=\'u_opt_2\'>EVAP Coolers</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_3\' value=\'opt3\'/><label for=\'u_opt_3\'>Exhaust Fans</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_4\' value=\'opt4\'/><label for=\'u_opt_4\'>Powered Vents</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_5\' value=\'opt5\'/><label for=\'u_opt_5\'>Gravity Vents</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_6\' value=\'opt6\'/><label for=\'u_opt_6\'>Skylights</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_7\' value=\'opt7\'/><label for=\'u_opt_7\'>Roof Drains</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_8\' value=\'opt8\'/><label for=\'u_opt_8\'>Roof Hatch</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_9\' value=\'opt9\'/><label for=\'u_opt_9\'>Floor Openings</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_text\' value=\'opt10\'/><input id=\'u_opt_text\' style=\'width:65%\' type=text placeholder=\'Other\'/>\r\n						</div>\r\n					</div>\r\n					\r\n			<br><br><input id=unit_weight type=text placeholder=\'Unit Weight (lbs.)\' onfocus=\'selectoneofthetwoinputspluscolouring(false)\'/>\r\n					\r\n	<br><br><div id=bottomofframeoptions >\r\n				<input id=save_unit type=button value=\'Add to Cart\' onclick=\'saveframe()\' onfocus=\'selectoneofthetwoinputspluscolouring(false)\'/>\r\n			</div>\r\n				</div>\r\n			</div>\r\n			<div id=all_of_the_frames_you_can_select_from >\r\n				\r\n				<div id=fr_double >\r\n					<img src=\'./frames/frame (0).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (1).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (2).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (5).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (6).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (9).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n				</div>\r\n				<div id=fr_triple >\r\n					<img src=\'./frames/frame (3).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (4).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (7).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (8).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (11).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n				</div>\r\n				<div id=fr_quad >\r\n					<img src=\'./frames/frame (10).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (12).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n				</div>\r\n				\r\n			</div>\r\n			<div id=the_little_x_in_the_top_right onclick=\'closetheframeselectwindow()\'>X</div>\r\n		</div>\r\n\r\n\r\n		<div id=fanciest >\r\n			<div class=fancy id=disable_5 >\r\n				<p style=\'text-align:center;\'>Thank you for submitting!</p>\r\n				<input style=\'height:2.5vh;width:5vw;margin-top:32%;margin-left:3.5vw;\' type=button value=\'Return\' onclick=\'location.reload()\' />\r\n			</div>\r\n			<div class=fancy id=disable_4 >\r\n				<div id=f1 >\r\n					<input type=text id=_addnotes placeholder=\'Additional Notes\'>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_2 type=button value=\'Back\' onclick=\'back(2)\'>\r\n					<input id=f2_1_final type=button value=\'Skip\' onclick=\'next(2)\'>\r\n				</div>\r\n			</div>\r\n			<div class=fancy id=disable_3 >\r\n				<div id=f1 >\r\n					<h1>Cart:</h1>\r\n					<div id=cart_area >\r\n						<div class=container_around_selected_frames_in_the_cart_screen id=frame_1 style=\'display:none;\'>\r\n							<img id=saved_frame_1 src=\'\'>\r\n							<div>Qty: \r\n							<select id=quant_1 >\r\n								<option value=\'1\'>1</option>\r\n								<option value=\'2\'>2</option>\r\n								<option value=\'3\'>3</option>\r\n								<option value=\'4\'>4</option>\r\n								<option value=\'5\'>5</option>\r\n								<option value=\'6\'>6</option>\r\n								<option value=\'7\'>7</option>\r\n								<option value=\'8\'>8</option>\r\n								<option value=\'9\'>9</option>\r\n								<option value=\'10\'>10+</option>\r\n							</select></div>\r\n						<br>\r\n							<input id=rmv_q1 type=button value=\'Delete\' onclick=\'removeitemfromcard(1)\'/>\r\n						</div>\r\n						<div><input id=frame_add type=button value=\'Add Frame\' onclick=\'dotheframething()\'/></div>\r\n					</div>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_2 type=button value=\'Back\' onclick=\'back(2)\'>\r\n					<input id=f2_1_final type=button value=\'Skip\' onclick=\'next(2)\'/>\r\n				</div>\r\n			</div>\r\n			<div class=fancy id=disable_2 >\r\n				<div id=f1 >\r\n					<h1>Project Info:</h1>\r\n			<br>	<input class=buTy_0 id=\'_projname\' type=text placeholder=\'project name\'/>\r\n			<br><br><input class=buTy_0 id=\'_postal\' type=postalcode placeholder=\'zip/postal code\'/>\r\n			<br><br><input class=buTy_0 id=\'_neededby\' type=text placeholder=\'frames needed by  (e.g. 01/01/2021)\'/>\r\n			<br><br><form id=project_type >\r\n						<input type=radio name=\'a\' id=\'newmodel\' value=\'NewModel\'/><label for=\'newmodel\'>New Build</label>\r\n						<input type=radio name=\'a\' id=\'TI\' value=\'Newbuild/TI\'/><label for=\'TI\'>Remodel/T.I.</label>\r\n					</form>\r\n						<p style=\'position:relative;left:-25%;top:6%;\'>Roof Material:</p>\r\n					<div class=buTy_2 style=\'left:2%\'>\r\n						<input type=radio name=\'b\' id=\'1_opt_1\' value=\'opt1\'/><label for=\'1_opt_1\'>Steel Deck</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_2\' value=\'opt2\'/><label for=\'1_opt_2\'>Panelized Wood</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_3\' value=\'opt3\'/><label for=\'1_opt_3\'>Concrete</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_4\' value=\'opt4\'/><label for=\'1_opt_4\'>Gypcrete</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_5\' value=\'opt5\'/><input id=\'1_opt_text\' style=\'width:65%\' type=text placeholder=\'Other\'/>\r\n					</div>\r\n						<p style=\'position:relative;right:-25%;top:-2%;\'>Roof Structure:</p>\r\n					<div class=buTy_2 style=\'right:2%;\'>\r\n						<input type=radio name=\'c\' id=\'2_opt_1\' value=\'opt1\'/><label for=\'2_opt_1\'>Steel Joists/Beams</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_2\' value=\'opt2\'/><label for=\'2_opt_2\'>PEMB Purlins</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_3\' value=\'opt3\'/><label for=\'2_opt_3\'>Hybrid</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_4\' value=\'opt4\'/><label for=\'2_opt_4\'>Wood Trusses</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_5\' value=\'opt5\'/><input id=\'2_opt_text\' style=\'width:65%\' type=text placeholder=\'Other\'/>\r\n					</div>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_2 type=button value=\'Back\' onclick=\'back(1)\'>\r\n					<input id=f2_1 type=button value=\'Next\' onclick=\'next(1)\'/>\r\n				</div>\r\n			</div>\r\n			<div class=fancy id=disable_1 >\r\n				<div id=f1 >\r\n					<h1>Customer Info:</h1>\r\n			<br><br><input class=buTy_0 id=_fname type=text required placeholder=\'first name\'/>\r\n			<br><br><input class=buTy_0 id=_lname type=text required placeholder=\'last name\'/>\r\n			<br><br><input class=buTy_0 id=_email type=email required placeholder=\'email\'/>\r\n			<br><br><input class=buTy_0 id=_tel type=tel required placeholder=\'### ###-####\'/>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_1 type=button value=\'Next\' onclick=\'next(0)\'/>\r\n				</div>\r\n			</div>\r\n		</div>\r\n\r\n\r\n<script>\r\n	var vault={\r\n		fname:\'\',\r\n		lname:\'\',\r\n		email:\'\',\r\n		tel:\'\',\r\n		\r\n		projname:\'\',\r\n		postal:\'\',\r\n		date:\'\',\r\n		TI:\'\',\r\n		OPT1:\'\',\r\n		OPT2:\'\',\r\n		\r\n		jspace:\'\',\r\n		opsize:\'\',\r\n		uweight:\'\',\r\n		utype:\'\',\r\n		\r\n		notes:\'\'\r\n	},\r\n	istherecurrentlyaframebeingconsidered= false;\r\ntry{\r\n	function closetheframeselectwindow(){\r\n		document.getElementById(\'personalize_frame_frame\').style.opacity= \'0\';\r\n		document.getElementById(\'personalize_frame_frame\').style.visibility= \'hidden\';\r\n		\r\n		document.getElementById(\'fanciest\').style.visibility= \'visible\';\r\n		document.getElementById(\'the_void\').style.opacity= \'0\';\r\n		setTimeout(function(){\r\n			//document.getElementById(\'the_void\').style.visibility= \'hidden\';\r\n			document.getElementById(\'all_of_the_frames_you_can_select_from\').style.visibility= \'visible\';\r\n			document.getElementById(\'the_void\').style.display= \'none\';\r\n		},300);\r\n	}\r\n			function opentheframeselectwindow(){\r\n				//document.getElementById(\'the_void\').style.visibility= \'visible\';\r\n				document.getElementById(\'fanciest\').style.visibility= \'hidden\';\r\n				document.getElementById(\'the_void\').style.display= \'grid\';\r\n				document.getElementById(\'the_void\').style.opacity= \'1\';\r\n			}\r\n	\r\n	function dotheframething(){\r\n		opentheframeselectwindow();\r\n		if(!istherecurrentlyaframebeingconsidered){\r\n			istherecurrentlyaframebeingconsidered= true;\r\n			document.getElementById(\'f2_1_final\').value= \'Submit\';\r\n		} else{\r\n			\r\n		}\r\n	}\r\n	function saveframe(){\r\n		vault.jspace= document.getElementById(\'joist_space\').value;\r\n			vault.opsize= document.getElementById(\'opening_size\').value;\r\n			vault.uweight= document.getElementById(\'unit_weight\').value;\r\n			vault.utype= document.querySelector(\'input[name=\"d\"]:checked\').id;\r\n		\r\n		closetheframeselectwindow();\r\n		document.getElementById(\'frame_1\').style.display= \'block\';\r\n			document.getElementById(\'saved_frame_1\').src= \'./frames/frame (\'+(chosen_frame-1)+\').png\';\r\n			document.getElementById(\'saved_frame_1\').style.width= \'62px\';\r\n	}\r\n	\r\n	function back(a){\r\n		if(a==1){\r\n			document.getElementById(\'disable_1\').style.display= \'grid\';\r\n			document.getElementById(\'disable_1\').style.opacity= \'1\';\r\n			document.getElementById(\'disable_2\').style.opacity= \'0\';\r\n			document.getElementById(\'display_2\').style.display= \'none\'\r\n		}else if(a==2){\r\n			document.getElementById(\'disable_2\').style.display= \'grid\';\r\n			document.getElementById(\'disable_2\').style.opacity= \'1\';\r\n			document.getElementById(\'disable_3\').style.opacity= \'0\';\r\n			document.getElementById(\'display_3\').style.display= \'none\'\r\n		}\r\n	}\r\n	function next(a){\r\n		if(a==0){\r\n			vault.fname= document.getElementById(\'_fname\').value;\r\n			vault.lname= document.getElementById(\'_lname\').value;\r\n			vault.email= document.getElementById(\'_email\').value;\r\n			vault.tel= document.getElementById(\'_tel\').value;\r\n			\r\n			document.getElementById(\'disable_1\').style.display= \'none\';\r\n			document.getElementById(\'disable_2\').style.opacity= \'1\';\r\n		}else if(a==1){\r\n			vault.projname= document.getElementById(\'_projname\').value;\r\n			vault.postal= document.getElementById(\'_postal\').value;\r\n			vault.date= document.getElementById(\'_neededby\').value;\r\n			vault.TI= document.querySelector(\'input[name=\"a\"]:checked\').id;\r\n			vault.OPT1= document.querySelector(\'input[name=\"b\"]:checked\').id;\r\n			vault.OPT2= document.querySelector(\'input[name=\"c\"]:checked\').id;\r\n			\r\n			document.getElementById(\'disable_2\').style.display= \'none\';\r\n			document.getElementById(\'disable_3\').style.opacity= \'1\';\r\n			\r\n			console.log(vault);\r\n		}else if(a==2){\r\n			document.getElementById(\'disable_3\').style.display= \'none\';\r\n			document.getElementById(\'disable_4\').style.opacity= \'1\';\r\n		}\r\n	}\r\n} catch(err){console.log(err);}\r\n	\r\n</script>\r\n\r\n\r\n\r\n\r\n<!--<h1>Let QuickFrames do the take-offs and eliminate your need to detail.</h1>\r\n[contact-form-7 id=\"1936\" title=\"New QuickFrames Quote Form\"]\r\n\r\n\r\nFrom: https://wplearninglab.com/contact-form-7-get-value-from-url/\r\n\r\n<script type=\"text/javascript\">\r\nvar getUrlParameter = function getUrlParameter(sParam) {\r\n    var sPageURL = decodeURIComponent(window.location.search.substring(1)),\r\n        sURLVariables = sPageURL.split(\'&\'),\r\n        sParameterName,\r\n        i;\r\n    for (i = 0; i < sURLVariables.length; i++) {\r\n        sParameterName = sURLVariables[i].split(\'=\');\r\n        if (sParameterName[0] === sParam) {\r\n            return sParameterName[1] === undefined ? true : sParameterName[1];\r\n        }\r\n    }\r\n};\r\n\r\nvar VARIABLE = getUrlParameter(\'PARAMETER\');\r\n\r\nif (VARIABLE != null) {\r\n     document.getElementById(\'INPUT-FIELD-ID\').value = VARIABLE;\r\n}\r\n\r\n</script>\r\n\r\n\r\n<a name=\"quote-a-few-frames\"></a>\r\n\r\n[two_fifth]\r\n<h3>Need Just A Few Frames Quoted?</h3>\r\nIf you are working on a project requiring only a few frames and you know the basic requirements for how they will be used, just fill out the form to the right. We\'ll get a quote back to you within 24 hours or less!\r\n\r\nFor each framed opening, using the <a href=\"#frame-types\"> frame type examples </a> shown below, select the frame type number that most closely matches where the opening will be located relative to the joists/beams and enter that into the <strong>Type</strong> column. While RTUs are shown in these images, they apply to all types of roof top equipment. If none of the images match your configuration, enter (0).\r\n\r\n[responsive] <img class=\"alignright\" src=\"/wp-content/uploads/quote-frame-outline.jpg\" alt=\"Frame Outline Image\" width=\"320\" /> [/responsive]\r\n\r\nIf the framing will <strong>only</strong> support the duct openings and not the curbing, enter the letter (<strong><span style=\"color: #37ade1;\">Y</span></strong>) in the <strong>Duct Only</strong> column. If the framing will support the curbing and equipment, enter the letter (<strong><span style=\"color: #37ade1;\">N</span></strong>).\r\n\r\nSpecify the center-to-center joist/beam spacing as shown by (<strong><span style=\"color: #37ade1;\">A</spacing></strong>) in the image to the right.\r\n\r\nWhen specifying the frame opening size (<strong><span style=\"color: #37ade1;\">B</span></strong>), use the length of the opening running <strong>parallel</strong> to (running with) the joists or beams.\r\n\r\n[responsive] <img class=\"alignright\" src=\"/wp-content/uploads/home-install-after-roof.jpg\" alt=\"Install After Roof Image\" width=\"400\"/> [/responsive]\r\n\r\n[/two_fifth]\r\n\r\n[three_fifth_last]\r\n[contact-form-7 id=\"1036\" title=\"Expanded Quote Request Small\"]\r\n[/three_fifth_last]\r\n\r\n<a name=\"frame-types\"></a>\r\n<h2>Frame Type Examples</h2>\r\n[responsive] <img class=\"alignright\" src=\"/wp-content/uploads/quote-frame-configurations.png\" alt=\"Roof Framing Configurations\" /> [/responsive]\r\n\r\n<a name=\"quote-a-lot-of-frames\"></a>\r\n[divider type=\"space\" margintop=\"0\" marginbottom=\"20\"]\r\n\r\n<h2>Have A Large Or Complex Project? Let Us Do The Take-offs For You!</h2>\r\n[divider type=\"space\" margintop=\"0\" marginbottom=\"10\"]\r\n\r\n[one_third]\r\n[responsive] <img src=\"/wp-content/uploads/drawing-image.jpg\" alt=\"Drawing Image\" /> [/responsive]\r\n[/one_third]\r\n\r\n[two_third_last]\r\nThe simplest way for us to provide you with a customized QuickFrames quotation is for you to allow us to do the take-offs directly from the engineering drawing set.\r\n\r\nWe have developed an extensive database of roof top equipment information, such as sizes, weights, opening dimensions, and structural requirements that allows us to select the optimal roof frames for your applications. All you need to do is to provide us with access to your drawing set and then let us go to work for you. You can also have complete confidence that we treat all drawing sets as proprietary information and we respect the importance of confidentiality for anything you share with us.\r\n\r\nThe easiest way for us to access your files is for you to provide us with an FTP address, login and password. Or, if the file set is small enough, you can also email it to us.\r\n\r\n[contact-form-7 id=\"401\" title=\"Quote Request\"]\r\n\r\n[/two_third_last]-->\r\n','Testing Page','','inherit','closed','closed','','777-revision-v1','','','2020-09-08 03:15:57','2020-09-08 10:15:57','',777,'http://quickframes.miritin.com/777-revision-v1/',0,'revision','',0),(1982,1,'2020-09-08 03:21:39','2020-09-08 10:21:39','<h1>Quote Demo:</h1>\r\n\r\n<style>\r\n\r\n  body{\r\n		font-family:Arial;\r\n	}\r\n\r\n	.Frame_Tool_Img{\r\n		cursor:pointer;\r\n		margin:20px;\r\n		border:2px solid transparent;\r\n		transition:border-color 0.1s linear;\r\n	}\r\n		.Frame_Tool_Img:hover{\r\n			border-color:#79c6e8;\r\n		}\r\n	input{\r\n		text-align:center;\r\n	}\r\n	\r\n	#content_container{\r\n		position:relative;\r\n			left:25vw;\r\n		width:50vw;\r\n			height:100%;\r\n	}\r\n	\r\n	#d{display:none;}\r\n	#tupperware_0{\r\n		grid-area:1 / 1;\r\n		height:100%;\r\n			width:100%;\r\n		display:grid;\r\n			grid-auto-flow:dense;\r\n			grid-template-columns: repeat(7, 1fr);\r\n			grid-template-rows: 500px 500px 500px;\r\n	}\r\n	#tupperware_1{\r\n		grid-area:1 / 1;\r\n		display:none;\r\n	}\r\n	\r\n	#tupperware_2{display:none;}\r\n	\r\n	.coolframebutte{\r\n		width:225px;\r\n		height:auto;\r\n	}\r\n	\r\n\r\n\r\n	#disable_1{\r\n		\r\n	}\r\n	#disable_2,#disable_3,#disable_4{\r\n		opacity:0;\r\n		transition:opacity .25s ease-in-out;\r\n	}\r\n	#disable_4{\r\n		height:7vh;\r\n			width:12vw;\r\n		font-size:2vh;\r\n		top:45vh;\r\n			left:44vw;\r\n	}\r\n\r\n	.fancy{\r\n		width:20vw;\r\n			height:50vh;\r\n			border-radius:10px;\r\n		position:absolute;\r\n			left:25%;\r\n			top:25vh;\r\n		background-color:#eee;\r\n		display:grid;\r\n			grid-auto-columns:100%;\r\n			grid-template-rows:85% 15%;\r\n	}\r\n		#f1{\r\n			backround-color:#fff;\r\n			text-align:center;\r\n		}\r\n		#f2{\r\n			background-color:#bbb;\r\n		}\r\n			#f2_2{\r\n				width:25%;\r\n					height:6%;\r\n				position:absolute;\r\n					left:15%;\r\n					top:90%;\r\n			}\r\n			#f2_1,#f2_1_final{\r\n				width:25%;\r\n					height:6%;\r\n				position:absolute;\r\n					right:15%;\r\n					top:90%;\r\n			}\r\n				.buTy_0{\r\n					height:5%;\r\n						width:65%;\r\n				}\r\n				.buTy_1{\r\n					height:5%;\r\n						width:65%;\r\n				}\r\n				.buTy_2{\r\n					position:absolute;\r\n						width:45%;\r\n						height:23%;\r\n						bottom:18%;\r\n					font-size:80%;\r\n					text-align:left;\r\n					background-color:#fff;\r\n						border:solid #767676 1px;\r\n						border-radius:2px;\r\n				}\r\n					#1_opt_text{\r\n						height:1000%;\r\n					}\r\n					\r\n				#project_type{\r\n					position:relative;\r\n						width:65%;\r\n						height:5%;\r\n						left:17.5%;\r\n					font-size:80%;\r\n					background-color:#fff;\r\n						border:solid #767676 1px;\r\n						border-radius:2px;\r\n				}\r\n\r\n		#cart_area{\r\n			height:65%;\r\n			display:grid;\r\n				grid-template-columns:33% 33% 33%;\r\n				grid-auto-rows:40%;\r\n		}\r\n			.frame_frame_frame{\r\n				\r\n			}\r\n				#frame_add{\r\n					height:24%;\r\n					margin-top:35%;\r\n				}\r\n				.add_frame{\r\n					height:30%;\r\n						width:30%;\r\n					margin-top:25%;\r\n				}\r\n			#_addnotes{\r\n				position:relative;\r\n					width:90%;\r\n					height:10%;\r\n			}\r\n\r\n	#the_void{\r\n		position:absolute;\r\n			top:0;\r\n			left:0;\r\n			z-index:999;\r\n		background-color:rgba(0,0,0,0.6);\r\n		height:100%;\r\n			width:100%;\r\n		display:none;\r\n			grid-template-rows:5% 5% 85% 5%;\r\n			grid-template-columns:5% 90% 5%;\r\n			grid-template-areas:\'. . .\'\r\n								\'. a_fr a_x\'\r\n								\'. a_fr .\'\r\n								\'. . .\';\r\n		opacity:0;\r\n		transition:opacity 0.3s ease-in-out;\r\n	}\r\n		#all_of_the_frames_you_can_select_from{\r\n			grid-area:a_fr;\r\n		}\r\n			#personalize_frame_frame{\r\n				grid-area:a_fr;\r\n				visibility:hidden;\r\n				opacity:0;\r\n				transition:opacity 0.3s ease-in-out;\r\n			}\r\n		#the_little_x_in_the_top_right{\r\n			grid-area:a_x;\r\n				color:#fff;\r\n				font-size:2.4vmax;\r\n				cursor:pointer;\r\n			transition:color .1s linear;\r\n		}\r\n				#the_little_x_in_the_top_right:hover{\r\n					color:#79c6e8;\r\n				}  	\r\n			#customizations{\r\n				position:absolute;\r\n					top:20%;\r\n					height:50%;\r\n					weight:50%;\r\n					left:30%;\r\n				padding:20px;\r\n				border-radius:5px;\r\n				text-align:center;\r\n				background-color:rgba(0,0,0,0.2);\r\n			}\r\n				#bottomofframeoptions{\r\n					position:relative;\r\n						width:100%;\r\n						left:-20px;\r\n						bottom:-20px;\r\n					padding:20px;\r\n					background-color:#bbb;\r\n				}\r\n				#joist_space,#opening_size,#unit_weight{\r\n					height:2.5vh;\r\n					border:none;\r\n					border-left:5px solid transparent;\r\n					transition:border-left 0.2s linear;\r\n				}\r\n				#unit_type{\r\n					color:#fff;\r\n					text-align:left;\r\n				}\r\n			#save_unit{\r\n				width:50%;\r\n					height:2.5vh;\r\n			}\r\n			\r\n	#quickgridthing{\r\n		display:grid;\r\n			grid-template-columns:100%;\r\n			grid-template-areas:100%;\r\n	}\r\n		#grandprize__hori,#grandprize__vert{\r\n			animation:flickercolorselect 1s infinite;\r\n			visibility:hidden;\r\n		}\r\n		.blinking_arrow{\r\n			position:absolute;\r\n				left:10px;\r\n			font-size:1.6vh;\r\n			color:red;\r\n			visibility:hidden;\r\n			animation:flickercolorselect 1s infinite;\r\n		}\r\n	@keyframes flickercolorselect{\r\n		0%{opacity:0;}\r\n		50%{opacity:1;}\r\n		100%{opacity:0;}\r\n	}\r\n\r\n	\r\n	.container_around_selected_frames_in_the_cart_screen{\r\n		\r\n	}\r\n		#rmv_q1{\r\n			color:red;\r\n			border:none;\r\n			background-color:transparent;\r\n			cursor:pointer;\r\n		}\r\n			#rmv_q1:hover{\r\n				text-decoration:underline;\r\n			}\r\n\r\n</style>\r\n<script>\r\n		var input_last_selected= false;\r\n	function selectoneofthetwoinputspluscolouring(a){\r\n		if(a==\'joist\'){\r\n			if(input_last_selected==\'opening\'){\r\n				//document.getElementById(\'opening_size\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_opening\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__vert\').style.visibility= \'hidden\';\r\n			}\r\n			input_last_selected= \'joist\';\r\n			//document.getElementById(\'joist_space\').style.borderLeftColor= \'red\';\r\n			document.getElementById(\'arrow_for_joist\').style.visibility= \'visible\';\r\n			document.getElementById(\'grandprize__hori\').style.visibility= \'visible\';\r\n		} else if(a==\'opening\'){\r\n			if(input_last_selected==\'joist\'){\r\n				//document.getElementById(\'joist_space\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_joist\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__hori\').style.visibility= \'hidden\';\r\n			}\r\n			input_last_selected= \'opening\';\r\n			//document.getElementById(\'opening_size\').style.borderLeftColor= \'red\';\r\n			document.getElementById(\'arrow_for_opening\').style.visibility= \'visible\';\r\n			document.getElementById(\'grandprize__vert\').style.visibility= \'visible\';\r\n		} else if(!a){\r\n			if(input_last_selected==\'joist\'){\r\n				//document.getElementById(\'joist_space\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_joist\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__hori\').style.visibility= \'hidden\';\r\n			} else if(input_last_selected==\'opening\'){\r\n				//document.getElementById(\'opening_size\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_opening\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__vert\').style.visibility= \'hidden\';\r\n			}\r\n		}\r\n	}\r\n	\r\n		var chosen_frame;\r\n	function choose(a){\r\n			let a6=a.src.length-6,a7=a.src.length-7;\r\n		chosen_frame= parseInt(a.src[a7]!=\'(\'?(a.src[a7]+a.src[a6]):a.src[a6])+1;\r\n		\r\n		//document.getElementById(\'tupperware_0\').style.visibility= \'hidden\';\r\n			//document.getElementById(\'tupperware_1\').style.display= \'block\';\r\n		\r\n		document.getElementById(\'grandprize\').src= \'./frames/dry (\'+(chosen_frame-1)+\').png\';\r\n			setTimeout(function(){document.getElementById(\'grandprize\').style.width= \'375px\';},50);\r\n		\r\n		\r\n		document.getElementById(\'all_of_the_frames_you_can_select_from\').style.visibility= \'hidden\';\r\n		document.getElementById(\'personalize_frame_frame\').style.visibility= \'visible\';\r\n				document.getElementById(\'grandprize__hori\').src= \'./frames/hori (\'+(chosen_frame-1)+\').png\';\r\n				document.getElementById(\'grandprize__vert\').src= \'./frames/vert (\'+(chosen_frame-1)+\').png\';\r\n					setTimeout(function(){\r\n								document.getElementById(\'grandprize__hori\').style.width= \'375px\';\r\n								document.getElementById(\'grandprize__vert\').style.width= \'375px\';\r\n							},50);\r\n			document.getElementById(\'personalize_frame_frame\').style.opacity= \'1\';\r\n		\r\n		if(chosen_frame==3 || chosen_frame==10){\r\n			document.getElementById(\'grandprize__vert\').hidden= true;\r\n			document.getElementById(\'opening_size\').hidden= true;\r\n			document.getElementById(\'arrow_for_opening\').hidden= true;\r\n		} else{\r\n			document.getElementById(\'grandprize__vert\').hidden= false;\r\n			document.getElementById(\'opening_size\').hidden= false;\r\n			document.getElementById(\'arrow_for_opening\').hidden= false;\r\n		}\r\n		\r\n		document.getElementById(\'joist_space\').focus();\r\n		\r\n		\r\n		/*	\r\n		let vHeight= document.getElementById(\'grandprize\').height,\r\n			vWidth= document.getElementById(\'grandprize\').width;\r\n			\r\n		document.getElementById(\'ch_width\').style.left= ((vWidth - document.getElementById(\'ch_width\').style.width)/2)+\'px\';\r\n		*/\r\n	}\r\n	\r\n	function removeitemfromcard(a){\r\n		//add stuff here to remove set image\r\n		document.getElementById(\'frame_\'+a).style.display= \'none\';\r\n	}\r\n	\r\n	\r\n/*\r\n\r\nSUBMIT\r\n- include \'additional notes\' section\r\n- links to plans (URL)\r\n	- OR -\r\n- file upload\r\n- CAPTCHA\r\n\r\n*/\r\n</script>\r\n<!--	-->\r\n		<div id=the_void  style=\"\r\n			position:absolute;\r\n			top:0;\r\n			left:0;\r\n			z-index:999;\r\n		background-color:rgba(0,0,0,0.6);\r\n		height:100%;\r\n			width:100%;\r\n		display:none;\r\n			grid-template-rows:5% 5% 85% 5%;\r\n			grid-template-columns:5% 90% 5%;\r\n			grid-template-areas:\'. . .\'\r\n								\'. a_fr a_x\'\r\n								\'. a_fr .\'\r\n								\'. . .\';\r\n		opacity:0;\r\n		transition:opacity 0.3s ease-in-out;\r\n		\">\r\n			<div id=personalize_frame_frame >\r\n				<div id=quickgridthing >\r\n					<img class=\'Frame_Tool_Img\' id=grandprize__hori src=\'./blue2.png\' style=\'grid-area:1 / 1;\'>\r\n					<img class=\'Frame_Tool_Img\' id=grandprize__vert src=\'./blue1.png\' style=\'grid-area:1 / 1;\'>\r\n					<img class=\'Frame_Tool_Img\' id=grandprize src=\'\' style=\'grid-area:1 / 1;\'>\r\n				</div>\r\n				<div id=customizations >\r\n				\r\n				<div id=arrow_for_joist class=blinking_arrow >►</div>\r\n				<input id=joist_space type=text placeholder=\'Joist Spacing (in.)\' onfocus=\'selectoneofthetwoinputspluscolouring(\"joist\")\'/>\r\n					\r\n				<br><br>\r\n					<div id=arrow_for_opening class=blinking_arrow >►</div>\r\n				<input id=opening_size type=text placeholder=\'Opening Size (in.)\' onfocus=\'selectoneofthetwoinputspluscolouring(\"opening\")\'/>\r\n					\r\n				<br><br><div id=unit_type onclick=\'selectoneofthetwoinputspluscolouring(false)\'>\r\n						<p style=\'text-align:center;\'>Unit Type:</p>\r\n						<div style=\'\r\n						background-color:#fff;\r\n							border:solid #767676 1px;\r\n							border-radius:2px;\r\n							color:#000;\r\n							font-size:80%;\r\n							padding:5px;\' >\r\n							<input type=radio name=\'d\' id=\'u_opt_1\' value=\'opt1\' onfocus=\'selectoneofthetwoinputspluscolouring(false)\'/><label for=\'u_opt_1\'>RTU/AHU/MAU</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_2\' value=\'opt2\'/><label for=\'u_opt_2\'>EVAP Coolers</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_3\' value=\'opt3\'/><label for=\'u_opt_3\'>Exhaust Fans</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_4\' value=\'opt4\'/><label for=\'u_opt_4\'>Powered Vents</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_5\' value=\'opt5\'/><label for=\'u_opt_5\'>Gravity Vents</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_6\' value=\'opt6\'/><label for=\'u_opt_6\'>Skylights</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_7\' value=\'opt7\'/><label for=\'u_opt_7\'>Roof Drains</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_8\' value=\'opt8\'/><label for=\'u_opt_8\'>Roof Hatch</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_9\' value=\'opt9\'/><label for=\'u_opt_9\'>Floor Openings</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_text\' value=\'opt10\'/><input id=\'u_opt_text\' style=\'width:65%\' type=text placeholder=\'Other\'/>\r\n						</div>\r\n					</div>\r\n					\r\n			<br><br><input id=unit_weight type=text placeholder=\'Unit Weight (lbs.)\' onfocus=\'selectoneofthetwoinputspluscolouring(false)\'/>\r\n					\r\n	<br><br><div id=bottomofframeoptions >\r\n				<input id=save_unit type=button value=\'Add to Cart\' onclick=\'saveframe()\' onfocus=\'selectoneofthetwoinputspluscolouring(false)\'/>\r\n			</div>\r\n				</div>\r\n			</div>\r\n			<div id=all_of_the_frames_you_can_select_from >\r\n				\r\n				<div id=fr_double >\r\n					<img src=\'./frames/frame (0).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (1).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (2).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (5).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (6).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (9).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n				</div>\r\n				<div id=fr_triple >\r\n					<img src=\'./frames/frame (3).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (4).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (7).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (8).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (11).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n				</div>\r\n				<div id=fr_quad >\r\n					<img src=\'./frames/frame (10).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (12).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n				</div>\r\n				\r\n			</div>\r\n			<div id=the_little_x_in_the_top_right onclick=\'closetheframeselectwindow()\'>X</div>\r\n		</div>\r\n\r\n\r\n		<div id=fanciest >\r\n			<div class=fancy id=disable_5  style=\"width:20vw;height:50vh;border-radius:10px;position:absolute;left:25%;top:25vh;background-color:#eee;display:grid;grid-auto-columns:100%;grid-template-rows:85% 15%;\">\r\n				<p style=\'text-align:center;\'>Thank you for submitting!</p>\r\n				<input style=\'height:2.5vh;width:5vw;margin-top:32%;margin-left:3.5vw;\' type=button value=\'Return\' onclick=\'location.reload()\' />\r\n			</div>\r\n			<div class=fancy id=disable_4 >\r\n				<div id=f1 >\r\n					<input type=text id=_addnotes placeholder=\'Additional Notes\'>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_2 type=button value=\'Back\' onclick=\'back(2)\'>\r\n					<input id=f2_1_final type=button value=\'Skip\' onclick=\'next(2)\'>\r\n				</div>\r\n			</div>\r\n			<div class=fancy id=disable_3 >\r\n				<div id=f1 >\r\n					<h1>Cart:</h1>\r\n					<div id=cart_area >\r\n						<div class=container_around_selected_frames_in_the_cart_screen id=frame_1 style=\'display:none;\'>\r\n							<img id=saved_frame_1 src=\'\'>\r\n							<div>Qty: \r\n							<select id=quant_1 >\r\n								<option value=\'1\'>1</option>\r\n								<option value=\'2\'>2</option>\r\n								<option value=\'3\'>3</option>\r\n								<option value=\'4\'>4</option>\r\n								<option value=\'5\'>5</option>\r\n								<option value=\'6\'>6</option>\r\n								<option value=\'7\'>7</option>\r\n								<option value=\'8\'>8</option>\r\n								<option value=\'9\'>9</option>\r\n								<option value=\'10\'>10+</option>\r\n							</select></div>\r\n						<br>\r\n							<input id=rmv_q1 type=button value=\'Delete\' onclick=\'removeitemfromcard(1)\'/>\r\n						</div>\r\n						<div><input id=frame_add type=button value=\'Add Frame\' onclick=\'dotheframething()\'/></div>\r\n					</div>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_2 type=button value=\'Back\' onclick=\'back(2)\'>\r\n					<input id=f2_1_final type=button value=\'Skip\' onclick=\'next(2)\'/>\r\n				</div>\r\n			</div>\r\n			<div class=fancy id=disable_2 >\r\n				<div id=f1 >\r\n					<h1>Project Info:</h1>\r\n			<br>	<input class=buTy_0 id=\'_projname\' type=text placeholder=\'project name\'/>\r\n			<br><br><input class=buTy_0 id=\'_postal\' type=postalcode placeholder=\'zip/postal code\'/>\r\n			<br><br><input class=buTy_0 id=\'_neededby\' type=text placeholder=\'frames needed by  (e.g. 01/01/2021)\'/>\r\n			<br><br><form id=project_type >\r\n						<input type=radio name=\'a\' id=\'newmodel\' value=\'NewModel\'/><label for=\'newmodel\'>New Build</label>\r\n						<input type=radio name=\'a\' id=\'TI\' value=\'Newbuild/TI\'/><label for=\'TI\'>Remodel/T.I.</label>\r\n					</form>\r\n						<p style=\'position:relative;left:-25%;top:6%;\'>Roof Material:</p>\r\n					<div class=buTy_2 style=\'left:2%\'>\r\n						<input type=radio name=\'b\' id=\'1_opt_1\' value=\'opt1\'/><label for=\'1_opt_1\'>Steel Deck</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_2\' value=\'opt2\'/><label for=\'1_opt_2\'>Panelized Wood</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_3\' value=\'opt3\'/><label for=\'1_opt_3\'>Concrete</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_4\' value=\'opt4\'/><label for=\'1_opt_4\'>Gypcrete</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_5\' value=\'opt5\'/><input id=\'1_opt_text\' style=\'width:65%\' type=text placeholder=\'Other\'/>\r\n					</div>\r\n						<p style=\'position:relative;right:-25%;top:-2%;\'>Roof Structure:</p>\r\n					<div class=buTy_2 style=\'right:2%;\'>\r\n						<input type=radio name=\'c\' id=\'2_opt_1\' value=\'opt1\'/><label for=\'2_opt_1\'>Steel Joists/Beams</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_2\' value=\'opt2\'/><label for=\'2_opt_2\'>PEMB Purlins</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_3\' value=\'opt3\'/><label for=\'2_opt_3\'>Hybrid</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_4\' value=\'opt4\'/><label for=\'2_opt_4\'>Wood Trusses</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_5\' value=\'opt5\'/><input id=\'2_opt_text\' style=\'width:65%\' type=text placeholder=\'Other\'/>\r\n					</div>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_2 type=button value=\'Back\' onclick=\'back(1)\'>\r\n					<input id=f2_1 type=button value=\'Next\' onclick=\'next(1)\'/>\r\n				</div>\r\n			</div>\r\n			<div class=fancy id=disable_1 >\r\n				<div id=f1 >\r\n					<h1>Customer Info:</h1>\r\n			<br><br><input class=buTy_0 id=_fname type=text required placeholder=\'first name\'/>\r\n			<br><br><input class=buTy_0 id=_lname type=text required placeholder=\'last name\'/>\r\n			<br><br><input class=buTy_0 id=_email type=email required placeholder=\'email\'/>\r\n			<br><br><input class=buTy_0 id=_tel type=tel required placeholder=\'### ###-####\'/>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_1 type=button value=\'Next\' onclick=\'next(0)\'/>\r\n				</div>\r\n			</div>\r\n		</div>\r\n\r\n\r\n<script>\r\n	var vault={\r\n		fname:\'\',\r\n		lname:\'\',\r\n		email:\'\',\r\n		tel:\'\',\r\n		\r\n		projname:\'\',\r\n		postal:\'\',\r\n		date:\'\',\r\n		TI:\'\',\r\n		OPT1:\'\',\r\n		OPT2:\'\',\r\n		\r\n		jspace:\'\',\r\n		opsize:\'\',\r\n		uweight:\'\',\r\n		utype:\'\',\r\n		\r\n		notes:\'\'\r\n	},\r\n	istherecurrentlyaframebeingconsidered= false;\r\ntry{\r\n	function closetheframeselectwindow(){\r\n		document.getElementById(\'personalize_frame_frame\').style.opacity= \'0\';\r\n		document.getElementById(\'personalize_frame_frame\').style.visibility= \'hidden\';\r\n		\r\n		document.getElementById(\'fanciest\').style.visibility= \'visible\';\r\n		document.getElementById(\'the_void\').style.opacity= \'0\';\r\n		setTimeout(function(){\r\n			//document.getElementById(\'the_void\').style.visibility= \'hidden\';\r\n			document.getElementById(\'all_of_the_frames_you_can_select_from\').style.visibility= \'visible\';\r\n			document.getElementById(\'the_void\').style.display= \'none\';\r\n		},300);\r\n	}\r\n			function opentheframeselectwindow(){\r\n				//document.getElementById(\'the_void\').style.visibility= \'visible\';\r\n				document.getElementById(\'fanciest\').style.visibility= \'hidden\';\r\n				document.getElementById(\'the_void\').style.display= \'grid\';\r\n				document.getElementById(\'the_void\').style.opacity= \'1\';\r\n			}\r\n	\r\n	function dotheframething(){\r\n		opentheframeselectwindow();\r\n		if(!istherecurrentlyaframebeingconsidered){\r\n			istherecurrentlyaframebeingconsidered= true;\r\n			document.getElementById(\'f2_1_final\').value= \'Submit\';\r\n		} else{\r\n			\r\n		}\r\n	}\r\n	function saveframe(){\r\n		vault.jspace= document.getElementById(\'joist_space\').value;\r\n			vault.opsize= document.getElementById(\'opening_size\').value;\r\n			vault.uweight= document.getElementById(\'unit_weight\').value;\r\n			vault.utype= document.querySelector(\'input[name=\"d\"]:checked\').id;\r\n		\r\n		closetheframeselectwindow();\r\n		document.getElementById(\'frame_1\').style.display= \'block\';\r\n			document.getElementById(\'saved_frame_1\').src= \'./frames/frame (\'+(chosen_frame-1)+\').png\';\r\n			document.getElementById(\'saved_frame_1\').style.width= \'62px\';\r\n	}\r\n	\r\n	function back(a){\r\n		if(a==1){\r\n			document.getElementById(\'disable_1\').style.display= \'grid\';\r\n			document.getElementById(\'disable_1\').style.opacity= \'1\';\r\n			document.getElementById(\'disable_2\').style.opacity= \'0\';\r\n			document.getElementById(\'display_2\').style.display= \'none\'\r\n		}else if(a==2){\r\n			document.getElementById(\'disable_2\').style.display= \'grid\';\r\n			document.getElementById(\'disable_2\').style.opacity= \'1\';\r\n			document.getElementById(\'disable_3\').style.opacity= \'0\';\r\n			document.getElementById(\'display_3\').style.display= \'none\'\r\n		}\r\n	}\r\n	function next(a){\r\n		if(a==0){\r\n			vault.fname= document.getElementById(\'_fname\').value;\r\n			vault.lname= document.getElementById(\'_lname\').value;\r\n			vault.email= document.getElementById(\'_email\').value;\r\n			vault.tel= document.getElementById(\'_tel\').value;\r\n			\r\n			document.getElementById(\'disable_1\').style.display= \'none\';\r\n			document.getElementById(\'disable_2\').style.opacity= \'1\';\r\n		}else if(a==1){\r\n			vault.projname= document.getElementById(\'_projname\').value;\r\n			vault.postal= document.getElementById(\'_postal\').value;\r\n			vault.date= document.getElementById(\'_neededby\').value;\r\n			vault.TI= document.querySelector(\'input[name=\"a\"]:checked\').id;\r\n			vault.OPT1= document.querySelector(\'input[name=\"b\"]:checked\').id;\r\n			vault.OPT2= document.querySelector(\'input[name=\"c\"]:checked\').id;\r\n			\r\n			document.getElementById(\'disable_2\').style.display= \'none\';\r\n			document.getElementById(\'disable_3\').style.opacity= \'1\';\r\n			\r\n			console.log(vault);\r\n		}else if(a==2){\r\n			document.getElementById(\'disable_3\').style.display= \'none\';\r\n			document.getElementById(\'disable_4\').style.opacity= \'1\';\r\n		}\r\n	}\r\n} catch(err){console.log(err);}\r\n	\r\n</script>\r\n\r\n\r\n\r\n\r\n<!--<h1>Let QuickFrames do the take-offs and eliminate your need to detail.</h1>\r\n[contact-form-7 id=\"1936\" title=\"New QuickFrames Quote Form\"]\r\n\r\n\r\nFrom: https://wplearninglab.com/contact-form-7-get-value-from-url/\r\n\r\n<script type=\"text/javascript\">\r\nvar getUrlParameter = function getUrlParameter(sParam) {\r\n    var sPageURL = decodeURIComponent(window.location.search.substring(1)),\r\n        sURLVariables = sPageURL.split(\'&\'),\r\n        sParameterName,\r\n        i;\r\n    for (i = 0; i < sURLVariables.length; i++) {\r\n        sParameterName = sURLVariables[i].split(\'=\');\r\n        if (sParameterName[0] === sParam) {\r\n            return sParameterName[1] === undefined ? true : sParameterName[1];\r\n        }\r\n    }\r\n};\r\n\r\nvar VARIABLE = getUrlParameter(\'PARAMETER\');\r\n\r\nif (VARIABLE != null) {\r\n     document.getElementById(\'INPUT-FIELD-ID\').value = VARIABLE;\r\n}\r\n\r\n</script>\r\n\r\n\r\n<a name=\"quote-a-few-frames\"></a>\r\n\r\n[two_fifth]\r\n<h3>Need Just A Few Frames Quoted?</h3>\r\nIf you are working on a project requiring only a few frames and you know the basic requirements for how they will be used, just fill out the form to the right. We\'ll get a quote back to you within 24 hours or less!\r\n\r\nFor each framed opening, using the <a href=\"#frame-types\"> frame type examples </a> shown below, select the frame type number that most closely matches where the opening will be located relative to the joists/beams and enter that into the <strong>Type</strong> column. While RTUs are shown in these images, they apply to all types of roof top equipment. If none of the images match your configuration, enter (0).\r\n\r\n[responsive] <img class=\"alignright\" src=\"/wp-content/uploads/quote-frame-outline.jpg\" alt=\"Frame Outline Image\" width=\"320\" /> [/responsive]\r\n\r\nIf the framing will <strong>only</strong> support the duct openings and not the curbing, enter the letter (<strong><span style=\"color: #37ade1;\">Y</span></strong>) in the <strong>Duct Only</strong> column. If the framing will support the curbing and equipment, enter the letter (<strong><span style=\"color: #37ade1;\">N</span></strong>).\r\n\r\nSpecify the center-to-center joist/beam spacing as shown by (<strong><span style=\"color: #37ade1;\">A</spacing></strong>) in the image to the right.\r\n\r\nWhen specifying the frame opening size (<strong><span style=\"color: #37ade1;\">B</span></strong>), use the length of the opening running <strong>parallel</strong> to (running with) the joists or beams.\r\n\r\n[responsive] <img class=\"alignright\" src=\"/wp-content/uploads/home-install-after-roof.jpg\" alt=\"Install After Roof Image\" width=\"400\"/> [/responsive]\r\n\r\n[/two_fifth]\r\n\r\n[three_fifth_last]\r\n[contact-form-7 id=\"1036\" title=\"Expanded Quote Request Small\"]\r\n[/three_fifth_last]\r\n\r\n<a name=\"frame-types\"></a>\r\n<h2>Frame Type Examples</h2>\r\n[responsive] <img class=\"alignright\" src=\"/wp-content/uploads/quote-frame-configurations.png\" alt=\"Roof Framing Configurations\" /> [/responsive]\r\n\r\n<a name=\"quote-a-lot-of-frames\"></a>\r\n[divider type=\"space\" margintop=\"0\" marginbottom=\"20\"]\r\n\r\n<h2>Have A Large Or Complex Project? Let Us Do The Take-offs For You!</h2>\r\n[divider type=\"space\" margintop=\"0\" marginbottom=\"10\"]\r\n\r\n[one_third]\r\n[responsive] <img src=\"/wp-content/uploads/drawing-image.jpg\" alt=\"Drawing Image\" /> [/responsive]\r\n[/one_third]\r\n\r\n[two_third_last]\r\nThe simplest way for us to provide you with a customized QuickFrames quotation is for you to allow us to do the take-offs directly from the engineering drawing set.\r\n\r\nWe have developed an extensive database of roof top equipment information, such as sizes, weights, opening dimensions, and structural requirements that allows us to select the optimal roof frames for your applications. All you need to do is to provide us with access to your drawing set and then let us go to work for you. You can also have complete confidence that we treat all drawing sets as proprietary information and we respect the importance of confidentiality for anything you share with us.\r\n\r\nThe easiest way for us to access your files is for you to provide us with an FTP address, login and password. Or, if the file set is small enough, you can also email it to us.\r\n\r\n[contact-form-7 id=\"401\" title=\"Quote Request\"]\r\n\r\n[/two_third_last]-->\r\n','Testing Page','','inherit','closed','closed','','777-revision-v1','','','2020-09-08 03:21:39','2020-09-08 10:21:39','',777,'http://quickframes.miritin.com/777-revision-v1/',0,'revision','',0),(1983,1,'2020-09-08 03:22:18','2020-09-08 10:22:18','<h1>Quote Demo:</h1>\r\n\r\n<style>\r\n\r\n  body{\r\n		font-family:Arial;\r\n	}\r\n\r\n	.Frame_Tool_Img{\r\n		cursor:pointer;\r\n		margin:20px;\r\n		border:2px solid transparent;\r\n		transition:border-color 0.1s linear;\r\n	}\r\n		.Frame_Tool_Img:hover{\r\n			border-color:#79c6e8;\r\n		}\r\n	input{\r\n		text-align:center;\r\n	}\r\n	\r\n	#content_container{\r\n		position:relative;\r\n			left:25vw;\r\n		width:50vw;\r\n			height:100%;\r\n	}\r\n	\r\n	#d{display:none;}\r\n	#tupperware_0{\r\n		grid-area:1 / 1;\r\n		height:100%;\r\n			width:100%;\r\n		display:grid;\r\n			grid-auto-flow:dense;\r\n			grid-template-columns: repeat(7, 1fr);\r\n			grid-template-rows: 500px 500px 500px;\r\n	}\r\n	#tupperware_1{\r\n		grid-area:1 / 1;\r\n		display:none;\r\n	}\r\n	\r\n	#tupperware_2{display:none;}\r\n	\r\n	.coolframebutte{\r\n		width:225px;\r\n		height:auto;\r\n	}\r\n	\r\n\r\n\r\n	#disable_1{\r\n		\r\n	}\r\n	#disable_2,#disable_3,#disable_4{\r\n		opacity:0;\r\n		transition:opacity .25s ease-in-out;\r\n	}\r\n	#disable_4{\r\n		height:7vh;\r\n			width:12vw;\r\n		font-size:2vh;\r\n		top:45vh;\r\n			left:44vw;\r\n	}\r\n\r\n	.fancy{\r\n		width:20vw;\r\n			height:50vh;\r\n			border-radius:10px;\r\n		position:absolute;\r\n			left:25%;\r\n			top:25vh;\r\n		background-color:#eee;\r\n		display:grid;\r\n			grid-auto-columns:100%;\r\n			grid-template-rows:85% 15%;\r\n	}\r\n		#f1{\r\n			backround-color:#fff;\r\n			text-align:center;\r\n		}\r\n		#f2{\r\n			background-color:#bbb;\r\n		}\r\n			#f2_2{\r\n				width:25%;\r\n					height:6%;\r\n				position:absolute;\r\n					left:15%;\r\n					top:90%;\r\n			}\r\n			#f2_1,#f2_1_final{\r\n				width:25%;\r\n					height:6%;\r\n				position:absolute;\r\n					right:15%;\r\n					top:90%;\r\n			}\r\n				.buTy_0{\r\n					height:5%;\r\n						width:65%;\r\n				}\r\n				.buTy_1{\r\n					height:5%;\r\n						width:65%;\r\n				}\r\n				.buTy_2{\r\n					position:absolute;\r\n						width:45%;\r\n						height:23%;\r\n						bottom:18%;\r\n					font-size:80%;\r\n					text-align:left;\r\n					background-color:#fff;\r\n						border:solid #767676 1px;\r\n						border-radius:2px;\r\n				}\r\n					#1_opt_text{\r\n						height:1000%;\r\n					}\r\n					\r\n				#project_type{\r\n					position:relative;\r\n						width:65%;\r\n						height:5%;\r\n						left:17.5%;\r\n					font-size:80%;\r\n					background-color:#fff;\r\n						border:solid #767676 1px;\r\n						border-radius:2px;\r\n				}\r\n\r\n		#cart_area{\r\n			height:65%;\r\n			display:grid;\r\n				grid-template-columns:33% 33% 33%;\r\n				grid-auto-rows:40%;\r\n		}\r\n			.frame_frame_frame{\r\n				\r\n			}\r\n				#frame_add{\r\n					height:24%;\r\n					margin-top:35%;\r\n				}\r\n				.add_frame{\r\n					height:30%;\r\n						width:30%;\r\n					margin-top:25%;\r\n				}\r\n			#_addnotes{\r\n				position:relative;\r\n					width:90%;\r\n					height:10%;\r\n			}\r\n\r\n	#the_void{\r\n		position:absolute;\r\n			top:0;\r\n			left:0;\r\n			z-index:999;\r\n		background-color:rgba(0,0,0,0.6);\r\n		height:100%;\r\n			width:100%;\r\n		display:none;\r\n			grid-template-rows:5% 5% 85% 5%;\r\n			grid-template-columns:5% 90% 5%;\r\n			grid-template-areas:\'. . .\'\r\n								\'. a_fr a_x\'\r\n								\'. a_fr .\'\r\n								\'. . .\';\r\n		opacity:0;\r\n		transition:opacity 0.3s ease-in-out;\r\n	}\r\n		#all_of_the_frames_you_can_select_from{\r\n			grid-area:a_fr;\r\n		}\r\n			#personalize_frame_frame{\r\n				grid-area:a_fr;\r\n				visibility:hidden;\r\n				opacity:0;\r\n				transition:opacity 0.3s ease-in-out;\r\n			}\r\n		#the_little_x_in_the_top_right{\r\n			grid-area:a_x;\r\n				color:#fff;\r\n				font-size:2.4vmax;\r\n				cursor:pointer;\r\n			transition:color .1s linear;\r\n		}\r\n				#the_little_x_in_the_top_right:hover{\r\n					color:#79c6e8;\r\n				}  	\r\n			#customizations{\r\n				position:absolute;\r\n					top:20%;\r\n					height:50%;\r\n					weight:50%;\r\n					left:30%;\r\n				padding:20px;\r\n				border-radius:5px;\r\n				text-align:center;\r\n				background-color:rgba(0,0,0,0.2);\r\n			}\r\n				#bottomofframeoptions{\r\n					position:relative;\r\n						width:100%;\r\n						left:-20px;\r\n						bottom:-20px;\r\n					padding:20px;\r\n					background-color:#bbb;\r\n				}\r\n				#joist_space,#opening_size,#unit_weight{\r\n					height:2.5vh;\r\n					border:none;\r\n					border-left:5px solid transparent;\r\n					transition:border-left 0.2s linear;\r\n				}\r\n				#unit_type{\r\n					color:#fff;\r\n					text-align:left;\r\n				}\r\n			#save_unit{\r\n				width:50%;\r\n					height:2.5vh;\r\n			}\r\n			\r\n	#quickgridthing{\r\n		display:grid;\r\n			grid-template-columns:100%;\r\n			grid-template-areas:100%;\r\n	}\r\n		#grandprize__hori,#grandprize__vert{\r\n			animation:flickercolorselect 1s infinite;\r\n			visibility:hidden;\r\n		}\r\n		.blinking_arrow{\r\n			position:absolute;\r\n				left:10px;\r\n			font-size:1.6vh;\r\n			color:red;\r\n			visibility:hidden;\r\n			animation:flickercolorselect 1s infinite;\r\n		}\r\n	@keyframes flickercolorselect{\r\n		0%{opacity:0;}\r\n		50%{opacity:1;}\r\n		100%{opacity:0;}\r\n	}\r\n\r\n	\r\n	.container_around_selected_frames_in_the_cart_screen{\r\n		\r\n	}\r\n		#rmv_q1{\r\n			color:red;\r\n			border:none;\r\n			background-color:transparent;\r\n			cursor:pointer;\r\n		}\r\n			#rmv_q1:hover{\r\n				text-decoration:underline;\r\n			}\r\n\r\n</style>\r\n<script>\r\n		var input_last_selected= false;\r\n	function selectoneofthetwoinputspluscolouring(a){\r\n		if(a==\'joist\'){\r\n			if(input_last_selected==\'opening\'){\r\n				//document.getElementById(\'opening_size\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_opening\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__vert\').style.visibility= \'hidden\';\r\n			}\r\n			input_last_selected= \'joist\';\r\n			//document.getElementById(\'joist_space\').style.borderLeftColor= \'red\';\r\n			document.getElementById(\'arrow_for_joist\').style.visibility= \'visible\';\r\n			document.getElementById(\'grandprize__hori\').style.visibility= \'visible\';\r\n		} else if(a==\'opening\'){\r\n			if(input_last_selected==\'joist\'){\r\n				//document.getElementById(\'joist_space\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_joist\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__hori\').style.visibility= \'hidden\';\r\n			}\r\n			input_last_selected= \'opening\';\r\n			//document.getElementById(\'opening_size\').style.borderLeftColor= \'red\';\r\n			document.getElementById(\'arrow_for_opening\').style.visibility= \'visible\';\r\n			document.getElementById(\'grandprize__vert\').style.visibility= \'visible\';\r\n		} else if(!a){\r\n			if(input_last_selected==\'joist\'){\r\n				//document.getElementById(\'joist_space\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_joist\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__hori\').style.visibility= \'hidden\';\r\n			} else if(input_last_selected==\'opening\'){\r\n				//document.getElementById(\'opening_size\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_opening\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__vert\').style.visibility= \'hidden\';\r\n			}\r\n		}\r\n	}\r\n	\r\n		var chosen_frame;\r\n	function choose(a){\r\n			let a6=a.src.length-6,a7=a.src.length-7;\r\n		chosen_frame= parseInt(a.src[a7]!=\'(\'?(a.src[a7]+a.src[a6]):a.src[a6])+1;\r\n		\r\n		//document.getElementById(\'tupperware_0\').style.visibility= \'hidden\';\r\n			//document.getElementById(\'tupperware_1\').style.display= \'block\';\r\n		\r\n		document.getElementById(\'grandprize\').src= \'./frames/dry (\'+(chosen_frame-1)+\').png\';\r\n			setTimeout(function(){document.getElementById(\'grandprize\').style.width= \'375px\';},50);\r\n		\r\n		\r\n		document.getElementById(\'all_of_the_frames_you_can_select_from\').style.visibility= \'hidden\';\r\n		document.getElementById(\'personalize_frame_frame\').style.visibility= \'visible\';\r\n				document.getElementById(\'grandprize__hori\').src= \'./frames/hori (\'+(chosen_frame-1)+\').png\';\r\n				document.getElementById(\'grandprize__vert\').src= \'./frames/vert (\'+(chosen_frame-1)+\').png\';\r\n					setTimeout(function(){\r\n								document.getElementById(\'grandprize__hori\').style.width= \'375px\';\r\n								document.getElementById(\'grandprize__vert\').style.width= \'375px\';\r\n							},50);\r\n			document.getElementById(\'personalize_frame_frame\').style.opacity= \'1\';\r\n		\r\n		if(chosen_frame==3 || chosen_frame==10){\r\n			document.getElementById(\'grandprize__vert\').hidden= true;\r\n			document.getElementById(\'opening_size\').hidden= true;\r\n			document.getElementById(\'arrow_for_opening\').hidden= true;\r\n		} else{\r\n			document.getElementById(\'grandprize__vert\').hidden= false;\r\n			document.getElementById(\'opening_size\').hidden= false;\r\n			document.getElementById(\'arrow_for_opening\').hidden= false;\r\n		}\r\n		\r\n		document.getElementById(\'joist_space\').focus();\r\n		\r\n		\r\n		/*	\r\n		let vHeight= document.getElementById(\'grandprize\').height,\r\n			vWidth= document.getElementById(\'grandprize\').width;\r\n			\r\n		document.getElementById(\'ch_width\').style.left= ((vWidth - document.getElementById(\'ch_width\').style.width)/2)+\'px\';\r\n		*/\r\n	}\r\n	\r\n	function removeitemfromcard(a){\r\n		//add stuff here to remove set image\r\n		document.getElementById(\'frame_\'+a).style.display= \'none\';\r\n	}\r\n	\r\n	\r\n/*\r\n\r\nSUBMIT\r\n- include \'additional notes\' section\r\n- links to plans (URL)\r\n	- OR -\r\n- file upload\r\n- CAPTCHA\r\n\r\n*/\r\n</script>\r\n<!--	-->\r\n		<div id=the_void  style=\"\r\n			position:absolute;\r\n			top:0;\r\n			left:0;\r\n			z-index:999;\r\n		background-color:rgba(0,0,0,0.6);\r\n		height:100%;\r\n			width:100%;\r\n		display:none;\r\n			grid-template-rows:5% 5% 85% 5%;\r\n			grid-template-columns:5% 90% 5%;\r\n			grid-template-areas:\'. . .\'\r\n								\'. a_fr a_x\'\r\n								\'. a_fr .\'\r\n								\'. . .\';\r\n		opacity:0;\r\n		transition:opacity 0.3s ease-in-out;\r\n		\">\r\n			<div id=personalize_frame_frame >\r\n				<div id=quickgridthing >\r\n					<img class=\'Frame_Tool_Img\' id=grandprize__hori src=\'./blue2.png\' style=\'grid-area:1 / 1;\'>\r\n					<img class=\'Frame_Tool_Img\' id=grandprize__vert src=\'./blue1.png\' style=\'grid-area:1 / 1;\'>\r\n					<img class=\'Frame_Tool_Img\' id=grandprize src=\'\' style=\'grid-area:1 / 1;\'>\r\n				</div>\r\n				<div id=customizations >\r\n				\r\n				<div id=arrow_for_joist class=blinking_arrow >►</div>\r\n				<input id=joist_space type=text placeholder=\'Joist Spacing (in.)\' onfocus=\'selectoneofthetwoinputspluscolouring(\"joist\")\'/>\r\n					\r\n				<br><br>\r\n					<div id=arrow_for_opening class=blinking_arrow >►</div>\r\n				<input id=opening_size type=text placeholder=\'Opening Size (in.)\' onfocus=\'selectoneofthetwoinputspluscolouring(\"opening\")\'/>\r\n					\r\n				<br><br><div id=unit_type onclick=\'selectoneofthetwoinputspluscolouring(false)\'>\r\n						<p style=\'text-align:center;\'>Unit Type:</p>\r\n						<div style=\'\r\n						background-color:#fff;\r\n							border:solid #767676 1px;\r\n							border-radius:2px;\r\n							color:#000;\r\n							font-size:80%;\r\n							padding:5px;\' >\r\n							<input type=radio name=\'d\' id=\'u_opt_1\' value=\'opt1\' onfocus=\'selectoneofthetwoinputspluscolouring(false)\'/><label for=\'u_opt_1\'>RTU/AHU/MAU</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_2\' value=\'opt2\'/><label for=\'u_opt_2\'>EVAP Coolers</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_3\' value=\'opt3\'/><label for=\'u_opt_3\'>Exhaust Fans</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_4\' value=\'opt4\'/><label for=\'u_opt_4\'>Powered Vents</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_5\' value=\'opt5\'/><label for=\'u_opt_5\'>Gravity Vents</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_6\' value=\'opt6\'/><label for=\'u_opt_6\'>Skylights</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_7\' value=\'opt7\'/><label for=\'u_opt_7\'>Roof Drains</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_8\' value=\'opt8\'/><label for=\'u_opt_8\'>Roof Hatch</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_9\' value=\'opt9\'/><label for=\'u_opt_9\'>Floor Openings</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_text\' value=\'opt10\'/><input id=\'u_opt_text\' style=\'width:65%\' type=text placeholder=\'Other\'/>\r\n						</div>\r\n					</div>\r\n					\r\n			<br><br><input id=unit_weight type=text placeholder=\'Unit Weight (lbs.)\' onfocus=\'selectoneofthetwoinputspluscolouring(false)\'/>\r\n					\r\n	<br><br><div id=bottomofframeoptions >\r\n				<input id=save_unit type=button value=\'Add to Cart\' onclick=\'saveframe()\' onfocus=\'selectoneofthetwoinputspluscolouring(false)\'/>\r\n			</div>\r\n				</div>\r\n			</div>\r\n			<div id=all_of_the_frames_you_can_select_from >\r\n				\r\n				<div id=fr_double >\r\n					<img src=\'./frames/frame (0).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (1).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (2).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (5).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (6).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (9).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n				</div>\r\n				<div id=fr_triple >\r\n					<img src=\'./frames/frame (3).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (4).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (7).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (8).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (11).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n				</div>\r\n				<div id=fr_quad >\r\n					<img src=\'./frames/frame (10).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (12).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n				</div>\r\n				\r\n			</div>\r\n			<div id=the_little_x_in_the_top_right onclick=\'closetheframeselectwindow()\'>X</div>\r\n		</div>\r\n\r\n\r\n		<div id=fanciest >\r\n			<div class=fancy id=disable_5  style=\"width:20vw;height:50vh;border-radius:10px;position:absolute;left:25%;top:25vh;background-color:#eee;display:grid;grid-auto-columns:100%;grid-template-rows:85% 15%;\">\r\n				<p style=\'text-align:center;\'>Thank you for submitting!</p>\r\n				<input style=\'height:2.5vh;width:5vw;margin-top:32%;margin-left:3.5vw;\' type=button value=\'Return\' onclick=\'location.reload()\' />\r\n			</div>\r\n			<div class=fancy id=disable_4  style=\"width:20vw;height:50vh;border-radius:10px;position:absolute;left:25%;top:25vh;background-color:#eee;display:grid;grid-auto-columns:100%;grid-template-rows:85% 15%;\">\r\n				<div id=f1 >\r\n					<input type=text id=_addnotes placeholder=\'Additional Notes\'>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_2 type=button value=\'Back\' onclick=\'back(2)\'>\r\n					<input id=f2_1_final type=button value=\'Skip\' onclick=\'next(2)\'>\r\n				</div>\r\n			</div>\r\n			<div class=fancy id=disable_3  style=\"width:20vw;height:50vh;border-radius:10px;position:absolute;left:25%;top:25vh;background-color:#eee;display:grid;grid-auto-columns:100%;grid-template-rows:85% 15%;\">\r\n				<div id=f1 >\r\n					<h1>Cart:</h1>\r\n					<div id=cart_area >\r\n						<div class=container_around_selected_frames_in_the_cart_screen id=frame_1 style=\'display:none;\'>\r\n							<img id=saved_frame_1 src=\'\'>\r\n							<div>Qty: \r\n							<select id=quant_1 >\r\n								<option value=\'1\'>1</option>\r\n								<option value=\'2\'>2</option>\r\n								<option value=\'3\'>3</option>\r\n								<option value=\'4\'>4</option>\r\n								<option value=\'5\'>5</option>\r\n								<option value=\'6\'>6</option>\r\n								<option value=\'7\'>7</option>\r\n								<option value=\'8\'>8</option>\r\n								<option value=\'9\'>9</option>\r\n								<option value=\'10\'>10+</option>\r\n							</select></div>\r\n						<br>\r\n							<input id=rmv_q1 type=button value=\'Delete\' onclick=\'removeitemfromcard(1)\'/>\r\n						</div>\r\n						<div><input id=frame_add type=button value=\'Add Frame\' onclick=\'dotheframething()\'/></div>\r\n					</div>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_2 type=button value=\'Back\' onclick=\'back(2)\'>\r\n					<input id=f2_1_final type=button value=\'Skip\' onclick=\'next(2)\'/>\r\n				</div>\r\n			</div>\r\n			<div class=fancy id=disable_2  style=\"width:20vw;height:50vh;border-radius:10px;position:absolute;left:25%;top:25vh;background-color:#eee;display:grid;grid-auto-columns:100%;grid-template-rows:85% 15%;\">\r\n				<div id=f1 >\r\n					<h1>Project Info:</h1>\r\n			<br>	<input class=buTy_0 id=\'_projname\' type=text placeholder=\'project name\'/>\r\n			<br><br><input class=buTy_0 id=\'_postal\' type=postalcode placeholder=\'zip/postal code\'/>\r\n			<br><br><input class=buTy_0 id=\'_neededby\' type=text placeholder=\'frames needed by  (e.g. 01/01/2021)\'/>\r\n			<br><br><form id=project_type >\r\n						<input type=radio name=\'a\' id=\'newmodel\' value=\'NewModel\'/><label for=\'newmodel\'>New Build</label>\r\n						<input type=radio name=\'a\' id=\'TI\' value=\'Newbuild/TI\'/><label for=\'TI\'>Remodel/T.I.</label>\r\n					</form>\r\n						<p style=\'position:relative;left:-25%;top:6%;\'>Roof Material:</p>\r\n					<div class=buTy_2 style=\'left:2%\'>\r\n						<input type=radio name=\'b\' id=\'1_opt_1\' value=\'opt1\'/><label for=\'1_opt_1\'>Steel Deck</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_2\' value=\'opt2\'/><label for=\'1_opt_2\'>Panelized Wood</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_3\' value=\'opt3\'/><label for=\'1_opt_3\'>Concrete</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_4\' value=\'opt4\'/><label for=\'1_opt_4\'>Gypcrete</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_5\' value=\'opt5\'/><input id=\'1_opt_text\' style=\'width:65%\' type=text placeholder=\'Other\'/>\r\n					</div>\r\n						<p style=\'position:relative;right:-25%;top:-2%;\'>Roof Structure:</p>\r\n					<div class=buTy_2 style=\'right:2%;\'>\r\n						<input type=radio name=\'c\' id=\'2_opt_1\' value=\'opt1\'/><label for=\'2_opt_1\'>Steel Joists/Beams</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_2\' value=\'opt2\'/><label for=\'2_opt_2\'>PEMB Purlins</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_3\' value=\'opt3\'/><label for=\'2_opt_3\'>Hybrid</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_4\' value=\'opt4\'/><label for=\'2_opt_4\'>Wood Trusses</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_5\' value=\'opt5\'/><input id=\'2_opt_text\' style=\'width:65%\' type=text placeholder=\'Other\'/>\r\n					</div>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_2 type=button value=\'Back\' onclick=\'back(1)\'>\r\n					<input id=f2_1 type=button value=\'Next\' onclick=\'next(1)\'/>\r\n				</div>\r\n			</div>\r\n			<div class=fancy id=disable_1  style=\"width:20vw;height:50vh;border-radius:10px;position:absolute;left:25%;top:25vh;background-color:#eee;display:grid;grid-auto-columns:100%;grid-template-rows:85% 15%;\">\r\n				<div id=f1 >\r\n					<h1>Customer Info:</h1>\r\n			<br><br><input class=buTy_0 id=_fname type=text required placeholder=\'first name\'/>\r\n			<br><br><input class=buTy_0 id=_lname type=text required placeholder=\'last name\'/>\r\n			<br><br><input class=buTy_0 id=_email type=email required placeholder=\'email\'/>\r\n			<br><br><input class=buTy_0 id=_tel type=tel required placeholder=\'### ###-####\'/>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_1 type=button value=\'Next\' onclick=\'next(0)\'/>\r\n				</div>\r\n			</div>\r\n		</div>\r\n\r\n\r\n<script>\r\n	var vault={\r\n		fname:\'\',\r\n		lname:\'\',\r\n		email:\'\',\r\n		tel:\'\',\r\n		\r\n		projname:\'\',\r\n		postal:\'\',\r\n		date:\'\',\r\n		TI:\'\',\r\n		OPT1:\'\',\r\n		OPT2:\'\',\r\n		\r\n		jspace:\'\',\r\n		opsize:\'\',\r\n		uweight:\'\',\r\n		utype:\'\',\r\n		\r\n		notes:\'\'\r\n	},\r\n	istherecurrentlyaframebeingconsidered= false;\r\ntry{\r\n	function closetheframeselectwindow(){\r\n		document.getElementById(\'personalize_frame_frame\').style.opacity= \'0\';\r\n		document.getElementById(\'personalize_frame_frame\').style.visibility= \'hidden\';\r\n		\r\n		document.getElementById(\'fanciest\').style.visibility= \'visible\';\r\n		document.getElementById(\'the_void\').style.opacity= \'0\';\r\n		setTimeout(function(){\r\n			//document.getElementById(\'the_void\').style.visibility= \'hidden\';\r\n			document.getElementById(\'all_of_the_frames_you_can_select_from\').style.visibility= \'visible\';\r\n			document.getElementById(\'the_void\').style.display= \'none\';\r\n		},300);\r\n	}\r\n			function opentheframeselectwindow(){\r\n				//document.getElementById(\'the_void\').style.visibility= \'visible\';\r\n				document.getElementById(\'fanciest\').style.visibility= \'hidden\';\r\n				document.getElementById(\'the_void\').style.display= \'grid\';\r\n				document.getElementById(\'the_void\').style.opacity= \'1\';\r\n			}\r\n	\r\n	function dotheframething(){\r\n		opentheframeselectwindow();\r\n		if(!istherecurrentlyaframebeingconsidered){\r\n			istherecurrentlyaframebeingconsidered= true;\r\n			document.getElementById(\'f2_1_final\').value= \'Submit\';\r\n		} else{\r\n			\r\n		}\r\n	}\r\n	function saveframe(){\r\n		vault.jspace= document.getElementById(\'joist_space\').value;\r\n			vault.opsize= document.getElementById(\'opening_size\').value;\r\n			vault.uweight= document.getElementById(\'unit_weight\').value;\r\n			vault.utype= document.querySelector(\'input[name=\"d\"]:checked\').id;\r\n		\r\n		closetheframeselectwindow();\r\n		document.getElementById(\'frame_1\').style.display= \'block\';\r\n			document.getElementById(\'saved_frame_1\').src= \'./frames/frame (\'+(chosen_frame-1)+\').png\';\r\n			document.getElementById(\'saved_frame_1\').style.width= \'62px\';\r\n	}\r\n	\r\n	function back(a){\r\n		if(a==1){\r\n			document.getElementById(\'disable_1\').style.display= \'grid\';\r\n			document.getElementById(\'disable_1\').style.opacity= \'1\';\r\n			document.getElementById(\'disable_2\').style.opacity= \'0\';\r\n			document.getElementById(\'display_2\').style.display= \'none\'\r\n		}else if(a==2){\r\n			document.getElementById(\'disable_2\').style.display= \'grid\';\r\n			document.getElementById(\'disable_2\').style.opacity= \'1\';\r\n			document.getElementById(\'disable_3\').style.opacity= \'0\';\r\n			document.getElementById(\'display_3\').style.display= \'none\'\r\n		}\r\n	}\r\n	function next(a){\r\n		if(a==0){\r\n			vault.fname= document.getElementById(\'_fname\').value;\r\n			vault.lname= document.getElementById(\'_lname\').value;\r\n			vault.email= document.getElementById(\'_email\').value;\r\n			vault.tel= document.getElementById(\'_tel\').value;\r\n			\r\n			document.getElementById(\'disable_1\').style.display= \'none\';\r\n			document.getElementById(\'disable_2\').style.opacity= \'1\';\r\n		}else if(a==1){\r\n			vault.projname= document.getElementById(\'_projname\').value;\r\n			vault.postal= document.getElementById(\'_postal\').value;\r\n			vault.date= document.getElementById(\'_neededby\').value;\r\n			vault.TI= document.querySelector(\'input[name=\"a\"]:checked\').id;\r\n			vault.OPT1= document.querySelector(\'input[name=\"b\"]:checked\').id;\r\n			vault.OPT2= document.querySelector(\'input[name=\"c\"]:checked\').id;\r\n			\r\n			document.getElementById(\'disable_2\').style.display= \'none\';\r\n			document.getElementById(\'disable_3\').style.opacity= \'1\';\r\n			\r\n			console.log(vault);\r\n		}else if(a==2){\r\n			document.getElementById(\'disable_3\').style.display= \'none\';\r\n			document.getElementById(\'disable_4\').style.opacity= \'1\';\r\n		}\r\n	}\r\n} catch(err){console.log(err);}\r\n	\r\n</script>\r\n\r\n\r\n\r\n\r\n<!--<h1>Let QuickFrames do the take-offs and eliminate your need to detail.</h1>\r\n[contact-form-7 id=\"1936\" title=\"New QuickFrames Quote Form\"]\r\n\r\n\r\nFrom: https://wplearninglab.com/contact-form-7-get-value-from-url/\r\n\r\n<script type=\"text/javascript\">\r\nvar getUrlParameter = function getUrlParameter(sParam) {\r\n    var sPageURL = decodeURIComponent(window.location.search.substring(1)),\r\n        sURLVariables = sPageURL.split(\'&\'),\r\n        sParameterName,\r\n        i;\r\n    for (i = 0; i < sURLVariables.length; i++) {\r\n        sParameterName = sURLVariables[i].split(\'=\');\r\n        if (sParameterName[0] === sParam) {\r\n            return sParameterName[1] === undefined ? true : sParameterName[1];\r\n        }\r\n    }\r\n};\r\n\r\nvar VARIABLE = getUrlParameter(\'PARAMETER\');\r\n\r\nif (VARIABLE != null) {\r\n     document.getElementById(\'INPUT-FIELD-ID\').value = VARIABLE;\r\n}\r\n\r\n</script>\r\n\r\n\r\n<a name=\"quote-a-few-frames\"></a>\r\n\r\n[two_fifth]\r\n<h3>Need Just A Few Frames Quoted?</h3>\r\nIf you are working on a project requiring only a few frames and you know the basic requirements for how they will be used, just fill out the form to the right. We\'ll get a quote back to you within 24 hours or less!\r\n\r\nFor each framed opening, using the <a href=\"#frame-types\"> frame type examples </a> shown below, select the frame type number that most closely matches where the opening will be located relative to the joists/beams and enter that into the <strong>Type</strong> column. While RTUs are shown in these images, they apply to all types of roof top equipment. If none of the images match your configuration, enter (0).\r\n\r\n[responsive] <img class=\"alignright\" src=\"/wp-content/uploads/quote-frame-outline.jpg\" alt=\"Frame Outline Image\" width=\"320\" /> [/responsive]\r\n\r\nIf the framing will <strong>only</strong> support the duct openings and not the curbing, enter the letter (<strong><span style=\"color: #37ade1;\">Y</span></strong>) in the <strong>Duct Only</strong> column. If the framing will support the curbing and equipment, enter the letter (<strong><span style=\"color: #37ade1;\">N</span></strong>).\r\n\r\nSpecify the center-to-center joist/beam spacing as shown by (<strong><span style=\"color: #37ade1;\">A</spacing></strong>) in the image to the right.\r\n\r\nWhen specifying the frame opening size (<strong><span style=\"color: #37ade1;\">B</span></strong>), use the length of the opening running <strong>parallel</strong> to (running with) the joists or beams.\r\n\r\n[responsive] <img class=\"alignright\" src=\"/wp-content/uploads/home-install-after-roof.jpg\" alt=\"Install After Roof Image\" width=\"400\"/> [/responsive]\r\n\r\n[/two_fifth]\r\n\r\n[three_fifth_last]\r\n[contact-form-7 id=\"1036\" title=\"Expanded Quote Request Small\"]\r\n[/three_fifth_last]\r\n\r\n<a name=\"frame-types\"></a>\r\n<h2>Frame Type Examples</h2>\r\n[responsive] <img class=\"alignright\" src=\"/wp-content/uploads/quote-frame-configurations.png\" alt=\"Roof Framing Configurations\" /> [/responsive]\r\n\r\n<a name=\"quote-a-lot-of-frames\"></a>\r\n[divider type=\"space\" margintop=\"0\" marginbottom=\"20\"]\r\n\r\n<h2>Have A Large Or Complex Project? Let Us Do The Take-offs For You!</h2>\r\n[divider type=\"space\" margintop=\"0\" marginbottom=\"10\"]\r\n\r\n[one_third]\r\n[responsive] <img src=\"/wp-content/uploads/drawing-image.jpg\" alt=\"Drawing Image\" /> [/responsive]\r\n[/one_third]\r\n\r\n[two_third_last]\r\nThe simplest way for us to provide you with a customized QuickFrames quotation is for you to allow us to do the take-offs directly from the engineering drawing set.\r\n\r\nWe have developed an extensive database of roof top equipment information, such as sizes, weights, opening dimensions, and structural requirements that allows us to select the optimal roof frames for your applications. All you need to do is to provide us with access to your drawing set and then let us go to work for you. You can also have complete confidence that we treat all drawing sets as proprietary information and we respect the importance of confidentiality for anything you share with us.\r\n\r\nThe easiest way for us to access your files is for you to provide us with an FTP address, login and password. Or, if the file set is small enough, you can also email it to us.\r\n\r\n[contact-form-7 id=\"401\" title=\"Quote Request\"]\r\n\r\n[/two_third_last]-->\r\n','Testing Page','','inherit','closed','closed','','777-revision-v1','','','2020-09-08 03:22:18','2020-09-08 10:22:18','',777,'http://quickframes.miritin.com/777-revision-v1/',0,'revision','',0),(1984,1,'2020-09-08 03:23:00','2020-09-08 10:23:00','<h1>Quote Demo:</h1>\r\n\r\n<style>\r\n\r\n  body{\r\n		font-family:Arial;\r\n	}\r\n\r\n	.Frame_Tool_Img{\r\n		cursor:pointer;\r\n		margin:20px;\r\n		border:2px solid transparent;\r\n		transition:border-color 0.1s linear;\r\n	}\r\n		.Frame_Tool_Img:hover{\r\n			border-color:#79c6e8;\r\n		}\r\n	input{\r\n		text-align:center;\r\n	}\r\n	\r\n	#content_container{\r\n		position:relative;\r\n			left:25vw;\r\n		width:50vw;\r\n			height:100%;\r\n	}\r\n	\r\n	#d{display:none;}\r\n	#tupperware_0{\r\n		grid-area:1 / 1;\r\n		height:100%;\r\n			width:100%;\r\n		display:grid;\r\n			grid-auto-flow:dense;\r\n			grid-template-columns: repeat(7, 1fr);\r\n			grid-template-rows: 500px 500px 500px;\r\n	}\r\n	#tupperware_1{\r\n		grid-area:1 / 1;\r\n		display:none;\r\n	}\r\n	\r\n	#tupperware_2{display:none;}\r\n	\r\n	.coolframebutte{\r\n		width:225px;\r\n		height:auto;\r\n	}\r\n	\r\n\r\n\r\n	#disable_1{\r\n		\r\n	}\r\n	#disable_2,#disable_3,#disable_4{\r\n		opacity:0;\r\n		transition:opacity .25s ease-in-out;\r\n	}\r\n	#disable_4{\r\n		height:7vh;\r\n			width:12vw;\r\n		font-size:2vh;\r\n		top:45vh;\r\n			left:44vw;\r\n	}\r\n\r\n	.fancy{\r\n		width:20vw;\r\n			height:50vh;\r\n			border-radius:10px;\r\n		position:absolute;\r\n			left:25%;\r\n			top:25vh;\r\n		background-color:#eee;\r\n		display:grid;\r\n			grid-auto-columns:100%;\r\n			grid-template-rows:85% 15%;\r\n	}\r\n		#f1{\r\n			backround-color:#fff;\r\n			text-align:center;\r\n		}\r\n		#f2{\r\n			background-color:#bbb;\r\n		}\r\n			#f2_2{\r\n				width:25%;\r\n					height:6%;\r\n				position:absolute;\r\n					left:15%;\r\n					top:90%;\r\n			}\r\n			#f2_1,#f2_1_final{\r\n				width:25%;\r\n					height:6%;\r\n				position:absolute;\r\n					right:15%;\r\n					top:90%;\r\n			}\r\n				.buTy_0{\r\n					height:5%;\r\n						width:65%;\r\n				}\r\n				.buTy_1{\r\n					height:5%;\r\n						width:65%;\r\n				}\r\n				.buTy_2{\r\n					position:absolute;\r\n						width:45%;\r\n						height:23%;\r\n						bottom:18%;\r\n					font-size:80%;\r\n					text-align:left;\r\n					background-color:#fff;\r\n						border:solid #767676 1px;\r\n						border-radius:2px;\r\n				}\r\n					#1_opt_text{\r\n						height:1000%;\r\n					}\r\n					\r\n				#project_type{\r\n					position:relative;\r\n						width:65%;\r\n						height:5%;\r\n						left:17.5%;\r\n					font-size:80%;\r\n					background-color:#fff;\r\n						border:solid #767676 1px;\r\n						border-radius:2px;\r\n				}\r\n\r\n		#cart_area{\r\n			height:65%;\r\n			display:grid;\r\n				grid-template-columns:33% 33% 33%;\r\n				grid-auto-rows:40%;\r\n		}\r\n			.frame_frame_frame{\r\n				\r\n			}\r\n				#frame_add{\r\n					height:24%;\r\n					margin-top:35%;\r\n				}\r\n				.add_frame{\r\n					height:30%;\r\n						width:30%;\r\n					margin-top:25%;\r\n				}\r\n			#_addnotes{\r\n				position:relative;\r\n					width:90%;\r\n					height:10%;\r\n			}\r\n\r\n	#the_void{\r\n		position:absolute;\r\n			top:0;\r\n			left:0;\r\n			z-index:999;\r\n		background-color:rgba(0,0,0,0.6);\r\n		height:100%;\r\n			width:100%;\r\n		display:none;\r\n			grid-template-rows:5% 5% 85% 5%;\r\n			grid-template-columns:5% 90% 5%;\r\n			grid-template-areas:\'. . .\'\r\n								\'. a_fr a_x\'\r\n								\'. a_fr .\'\r\n								\'. . .\';\r\n		opacity:0;\r\n		transition:opacity 0.3s ease-in-out;\r\n	}\r\n		#all_of_the_frames_you_can_select_from{\r\n			grid-area:a_fr;\r\n		}\r\n			#personalize_frame_frame{\r\n				grid-area:a_fr;\r\n				visibility:hidden;\r\n				opacity:0;\r\n				transition:opacity 0.3s ease-in-out;\r\n			}\r\n		#the_little_x_in_the_top_right{\r\n			grid-area:a_x;\r\n				color:#fff;\r\n				font-size:2.4vmax;\r\n				cursor:pointer;\r\n			transition:color .1s linear;\r\n		}\r\n				#the_little_x_in_the_top_right:hover{\r\n					color:#79c6e8;\r\n				}  	\r\n			#customizations{\r\n				position:absolute;\r\n					top:20%;\r\n					height:50%;\r\n					weight:50%;\r\n					left:30%;\r\n				padding:20px;\r\n				border-radius:5px;\r\n				text-align:center;\r\n				background-color:rgba(0,0,0,0.2);\r\n			}\r\n				#bottomofframeoptions{\r\n					position:relative;\r\n						width:100%;\r\n						left:-20px;\r\n						bottom:-20px;\r\n					padding:20px;\r\n					background-color:#bbb;\r\n				}\r\n				#joist_space,#opening_size,#unit_weight{\r\n					height:2.5vh;\r\n					border:none;\r\n					border-left:5px solid transparent;\r\n					transition:border-left 0.2s linear;\r\n				}\r\n				#unit_type{\r\n					color:#fff;\r\n					text-align:left;\r\n				}\r\n			#save_unit{\r\n				width:50%;\r\n					height:2.5vh;\r\n			}\r\n			\r\n	#quickgridthing{\r\n		display:grid;\r\n			grid-template-columns:100%;\r\n			grid-template-areas:100%;\r\n	}\r\n		#grandprize__hori,#grandprize__vert{\r\n			animation:flickercolorselect 1s infinite;\r\n			visibility:hidden;\r\n		}\r\n		.blinking_arrow{\r\n			position:absolute;\r\n				left:10px;\r\n			font-size:1.6vh;\r\n			color:red;\r\n			visibility:hidden;\r\n			animation:flickercolorselect 1s infinite;\r\n		}\r\n	@keyframes flickercolorselect{\r\n		0%{opacity:0;}\r\n		50%{opacity:1;}\r\n		100%{opacity:0;}\r\n	}\r\n\r\n	\r\n	.container_around_selected_frames_in_the_cart_screen{\r\n		\r\n	}\r\n		#rmv_q1{\r\n			color:red;\r\n			border:none;\r\n			background-color:transparent;\r\n			cursor:pointer;\r\n		}\r\n			#rmv_q1:hover{\r\n				text-decoration:underline;\r\n			}\r\n\r\n</style>\r\n<script>\r\n		var input_last_selected= false;\r\n	function selectoneofthetwoinputspluscolouring(a){\r\n		if(a==\'joist\'){\r\n			if(input_last_selected==\'opening\'){\r\n				//document.getElementById(\'opening_size\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_opening\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__vert\').style.visibility= \'hidden\';\r\n			}\r\n			input_last_selected= \'joist\';\r\n			//document.getElementById(\'joist_space\').style.borderLeftColor= \'red\';\r\n			document.getElementById(\'arrow_for_joist\').style.visibility= \'visible\';\r\n			document.getElementById(\'grandprize__hori\').style.visibility= \'visible\';\r\n		} else if(a==\'opening\'){\r\n			if(input_last_selected==\'joist\'){\r\n				//document.getElementById(\'joist_space\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_joist\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__hori\').style.visibility= \'hidden\';\r\n			}\r\n			input_last_selected= \'opening\';\r\n			//document.getElementById(\'opening_size\').style.borderLeftColor= \'red\';\r\n			document.getElementById(\'arrow_for_opening\').style.visibility= \'visible\';\r\n			document.getElementById(\'grandprize__vert\').style.visibility= \'visible\';\r\n		} else if(!a){\r\n			if(input_last_selected==\'joist\'){\r\n				//document.getElementById(\'joist_space\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_joist\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__hori\').style.visibility= \'hidden\';\r\n			} else if(input_last_selected==\'opening\'){\r\n				//document.getElementById(\'opening_size\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_opening\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__vert\').style.visibility= \'hidden\';\r\n			}\r\n		}\r\n	}\r\n	\r\n		var chosen_frame;\r\n	function choose(a){\r\n			let a6=a.src.length-6,a7=a.src.length-7;\r\n		chosen_frame= parseInt(a.src[a7]!=\'(\'?(a.src[a7]+a.src[a6]):a.src[a6])+1;\r\n		\r\n		//document.getElementById(\'tupperware_0\').style.visibility= \'hidden\';\r\n			//document.getElementById(\'tupperware_1\').style.display= \'block\';\r\n		\r\n		document.getElementById(\'grandprize\').src= \'./frames/dry (\'+(chosen_frame-1)+\').png\';\r\n			setTimeout(function(){document.getElementById(\'grandprize\').style.width= \'375px\';},50);\r\n		\r\n		\r\n		document.getElementById(\'all_of_the_frames_you_can_select_from\').style.visibility= \'hidden\';\r\n		document.getElementById(\'personalize_frame_frame\').style.visibility= \'visible\';\r\n				document.getElementById(\'grandprize__hori\').src= \'./frames/hori (\'+(chosen_frame-1)+\').png\';\r\n				document.getElementById(\'grandprize__vert\').src= \'./frames/vert (\'+(chosen_frame-1)+\').png\';\r\n					setTimeout(function(){\r\n								document.getElementById(\'grandprize__hori\').style.width= \'375px\';\r\n								document.getElementById(\'grandprize__vert\').style.width= \'375px\';\r\n							},50);\r\n			document.getElementById(\'personalize_frame_frame\').style.opacity= \'1\';\r\n		\r\n		if(chosen_frame==3 || chosen_frame==10){\r\n			document.getElementById(\'grandprize__vert\').hidden= true;\r\n			document.getElementById(\'opening_size\').hidden= true;\r\n			document.getElementById(\'arrow_for_opening\').hidden= true;\r\n		} else{\r\n			document.getElementById(\'grandprize__vert\').hidden= false;\r\n			document.getElementById(\'opening_size\').hidden= false;\r\n			document.getElementById(\'arrow_for_opening\').hidden= false;\r\n		}\r\n		\r\n		document.getElementById(\'joist_space\').focus();\r\n		\r\n		\r\n		/*	\r\n		let vHeight= document.getElementById(\'grandprize\').height,\r\n			vWidth= document.getElementById(\'grandprize\').width;\r\n			\r\n		document.getElementById(\'ch_width\').style.left= ((vWidth - document.getElementById(\'ch_width\').style.width)/2)+\'px\';\r\n		*/\r\n	}\r\n	\r\n	function removeitemfromcard(a){\r\n		//add stuff here to remove set image\r\n		document.getElementById(\'frame_\'+a).style.display= \'none\';\r\n	}\r\n	\r\n	\r\n/*\r\n\r\nSUBMIT\r\n- include \'additional notes\' section\r\n- links to plans (URL)\r\n	- OR -\r\n- file upload\r\n- CAPTCHA\r\n\r\n*/\r\n</script>\r\n<!--	-->\r\n		<div id=the_void  style=\"\r\n			position:absolute;\r\n			top:0;\r\n			left:0;\r\n			z-index:999;\r\n		background-color:rgba(0,0,0,0.6);\r\n		height:100%;\r\n			width:100%;\r\n		display:none;\r\n			grid-template-rows:5% 5% 85% 5%;\r\n			grid-template-columns:5% 90% 5%;\r\n			grid-template-areas:\'. . .\'\r\n								\'. a_fr a_x\'\r\n								\'. a_fr .\'\r\n								\'. . .\';\r\n		opacity:0;\r\n		transition:opacity 0.3s ease-in-out;\r\n		\">\r\n			<div id=personalize_frame_frame >\r\n				<div id=quickgridthing >\r\n					<img class=\'Frame_Tool_Img\' id=grandprize__hori src=\'./blue2.png\' style=\'grid-area:1 / 1;\'>\r\n					<img class=\'Frame_Tool_Img\' id=grandprize__vert src=\'./blue1.png\' style=\'grid-area:1 / 1;\'>\r\n					<img class=\'Frame_Tool_Img\' id=grandprize src=\'\' style=\'grid-area:1 / 1;\'>\r\n				</div>\r\n				<div id=customizations >\r\n				\r\n				<div id=arrow_for_joist class=blinking_arrow >►</div>\r\n				<input id=joist_space type=text placeholder=\'Joist Spacing (in.)\' onfocus=\'selectoneofthetwoinputspluscolouring(\"joist\")\'/>\r\n					\r\n				<br><br>\r\n					<div id=arrow_for_opening class=blinking_arrow >►</div>\r\n				<input id=opening_size type=text placeholder=\'Opening Size (in.)\' onfocus=\'selectoneofthetwoinputspluscolouring(\"opening\")\'/>\r\n					\r\n				<br><br><div id=unit_type onclick=\'selectoneofthetwoinputspluscolouring(false)\'>\r\n						<p style=\'text-align:center;\'>Unit Type:</p>\r\n						<div style=\'\r\n						background-color:#fff;\r\n							border:solid #767676 1px;\r\n							border-radius:2px;\r\n							color:#000;\r\n							font-size:80%;\r\n							padding:5px;\' >\r\n							<input type=radio name=\'d\' id=\'u_opt_1\' value=\'opt1\' onfocus=\'selectoneofthetwoinputspluscolouring(false)\'/><label for=\'u_opt_1\'>RTU/AHU/MAU</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_2\' value=\'opt2\'/><label for=\'u_opt_2\'>EVAP Coolers</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_3\' value=\'opt3\'/><label for=\'u_opt_3\'>Exhaust Fans</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_4\' value=\'opt4\'/><label for=\'u_opt_4\'>Powered Vents</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_5\' value=\'opt5\'/><label for=\'u_opt_5\'>Gravity Vents</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_6\' value=\'opt6\'/><label for=\'u_opt_6\'>Skylights</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_7\' value=\'opt7\'/><label for=\'u_opt_7\'>Roof Drains</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_8\' value=\'opt8\'/><label for=\'u_opt_8\'>Roof Hatch</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_9\' value=\'opt9\'/><label for=\'u_opt_9\'>Floor Openings</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_text\' value=\'opt10\'/><input id=\'u_opt_text\' style=\'width:65%\' type=text placeholder=\'Other\'/>\r\n						</div>\r\n					</div>\r\n					\r\n			<br><br><input id=unit_weight type=text placeholder=\'Unit Weight (lbs.)\' onfocus=\'selectoneofthetwoinputspluscolouring(false)\'/>\r\n					\r\n	<br><br><div id=bottomofframeoptions >\r\n				<input id=save_unit type=button value=\'Add to Cart\' onclick=\'saveframe()\' onfocus=\'selectoneofthetwoinputspluscolouring(false)\'/>\r\n			</div>\r\n				</div>\r\n			</div>\r\n			<div id=all_of_the_frames_you_can_select_from >\r\n				\r\n				<div id=fr_double >\r\n					<img src=\'./frames/frame (0).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (1).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (2).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (5).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (6).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (9).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n				</div>\r\n				<div id=fr_triple >\r\n					<img src=\'./frames/frame (3).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (4).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (7).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (8).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (11).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n				</div>\r\n				<div id=fr_quad >\r\n					<img src=\'./frames/frame (10).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (12).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n				</div>\r\n				\r\n			</div>\r\n			<div id=the_little_x_in_the_top_right onclick=\'closetheframeselectwindow()\'>X</div>\r\n		</div>\r\n\r\n\r\n		<div id=fanciest >\r\n			<div class=fancy id=disable_5  style=\"width:20vw;height:50vh;border-radius:10px;position:absolute;left:25%;top:25vh;background-color:#eee;display:grid;grid-auto-columns:100%;grid-template-rows:85% 15%;\">\r\n				<p style=\'text-align:center;\'>Thank you for submitting!</p>\r\n				<input style=\'height:2.5vh;width:5vw;margin-top:32%;margin-left:3.5vw;\' type=button value=\'Return\' onclick=\'location.reload()\' />\r\n			</div>\r\n			<div class=fancy id=disable_4  style=\"width:20vw;height:50vh;border-radius:10px;position:absolute;left:25%;top:25vh;background-color:#eee;display:grid;grid-auto-columns:100%;grid-template-rows:85% 15%;\">\r\n				<div id=f1 >\r\n					<input type=text id=_addnotes placeholder=\'Additional Notes\'>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_2 type=button value=\'Back\' onclick=\'back(2)\'>\r\n					<input id=f2_1_final type=button value=\'Skip\' onclick=\'next(2)\'>\r\n				</div>\r\n			</div>\r\n			<div class=fancy id=disable_3  style=\"width:20vw;height:50vh;border-radius:10px;position:absolute;left:25%;top:25vh;background-color:#eee;display:grid;grid-auto-columns:100%;grid-template-rows:85% 15%;\">\r\n				<div id=f1 >\r\n					<h1>Cart:</h1>\r\n					<div id=cart_area >\r\n						<div class=container_around_selected_frames_in_the_cart_screen id=frame_1 style=\'display:none;\'>\r\n							<img id=saved_frame_1 src=\'\'>\r\n							<div>Qty: \r\n							<select id=quant_1 >\r\n								<option value=\'1\'>1</option>\r\n								<option value=\'2\'>2</option>\r\n								<option value=\'3\'>3</option>\r\n								<option value=\'4\'>4</option>\r\n								<option value=\'5\'>5</option>\r\n								<option value=\'6\'>6</option>\r\n								<option value=\'7\'>7</option>\r\n								<option value=\'8\'>8</option>\r\n								<option value=\'9\'>9</option>\r\n								<option value=\'10\'>10+</option>\r\n							</select></div>\r\n						<br>\r\n							<input id=rmv_q1 type=button value=\'Delete\' onclick=\'removeitemfromcard(1)\'/>\r\n						</div>\r\n						<div><input id=frame_add type=button value=\'Add Frame\' onclick=\'dotheframething()\'/></div>\r\n					</div>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_2 type=button value=\'Back\' onclick=\'back(2)\'>\r\n					<input id=f2_1_final type=button value=\'Skip\' onclick=\'next(2)\'/>\r\n				</div>\r\n			</div>\r\n			<div class=fancy id=disable_2  style=\"width:20vw;height:50vh;border-radius:10px;position:absolute;left:25%;top:25vh;background-color:#eee;display:grid;grid-auto-columns:100%;grid-template-rows:85% 15%;\">\r\n				<div id=f1 >\r\n					<h1>Project Info:</h1>\r\n			<br>	<input class=buTy_0 id=\'_projname\' type=text placeholder=\'project name\'/>\r\n			<br><br><input class=buTy_0 id=\'_postal\' type=postalcode placeholder=\'zip/postal code\'/>\r\n			<br><br><input class=buTy_0 id=\'_neededby\' type=text placeholder=\'frames needed by  (e.g. 01/01/2021)\'/>\r\n			<br><br><form id=project_type >\r\n						<input type=radio name=\'a\' id=\'newmodel\' value=\'NewModel\'/><label for=\'newmodel\'>New Build</label>\r\n						<input type=radio name=\'a\' id=\'TI\' value=\'Newbuild/TI\'/><label for=\'TI\'>Remodel/T.I.</label>\r\n					</form>\r\n						<p style=\'position:relative;left:-25%;top:6%;\'>Roof Material:</p>\r\n					<div class=buTy_2 style=\'left:2%\'>\r\n						<input type=radio name=\'b\' id=\'1_opt_1\' value=\'opt1\'/><label for=\'1_opt_1\'>Steel Deck</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_2\' value=\'opt2\'/><label for=\'1_opt_2\'>Panelized Wood</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_3\' value=\'opt3\'/><label for=\'1_opt_3\'>Concrete</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_4\' value=\'opt4\'/><label for=\'1_opt_4\'>Gypcrete</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_5\' value=\'opt5\'/><input id=\'1_opt_text\' style=\'width:65%\' type=text placeholder=\'Other\'/>\r\n					</div>\r\n						<p style=\'position:relative;right:-25%;top:-2%;\'>Roof Structure:</p>\r\n					<div class=buTy_2 style=\'right:2%;\'>\r\n						<input type=radio name=\'c\' id=\'2_opt_1\' value=\'opt1\'/><label for=\'2_opt_1\'>Steel Joists/Beams</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_2\' value=\'opt2\'/><label for=\'2_opt_2\'>PEMB Purlins</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_3\' value=\'opt3\'/><label for=\'2_opt_3\'>Hybrid</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_4\' value=\'opt4\'/><label for=\'2_opt_4\'>Wood Trusses</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_5\' value=\'opt5\'/><input id=\'2_opt_text\' style=\'width:65%\' type=text placeholder=\'Other\'/>\r\n					</div>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_2 type=button value=\'Back\' onclick=\'back(1)\'>\r\n					<input id=f2_1 type=button value=\'Next\' onclick=\'next(1)\'/>\r\n				</div>\r\n			</div>\r\n			<div class=fancy id=disable_1  style=\"width:20vw;height:50vh;border-radius:10px;position:absolute;left:25%;top:25vh;background-color:#eee;display:grid;grid-auto-columns:100%;grid-template-rows:85% 15%;\">\r\n				<div id=f1 >\r\n					<h1>Customer Info:</h1>\r\n			<br><br><input class=buTy_0 id=_fname type=text required placeholder=\'first name\'/>\r\n			<br><br><input class=buTy_0 id=_lname type=text required placeholder=\'last name\'/>\r\n			<br><br><input class=buTy_0 id=_email type=email required placeholder=\'email\'/>\r\n			<br><br><input class=buTy_0 id=_tel type=tel required placeholder=\'### ###-####\'/>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_1 type=button value=\'Next\' onclick=\'next(0)\'/>\r\n				</div>\r\n			</div>\r\n		</div>\r\n\r\n<div style=\'height:60vh;\'></div>\r\n\r\n\r\n<script>\r\n	var vault={\r\n		fname:\'\',\r\n		lname:\'\',\r\n		email:\'\',\r\n		tel:\'\',\r\n		\r\n		projname:\'\',\r\n		postal:\'\',\r\n		date:\'\',\r\n		TI:\'\',\r\n		OPT1:\'\',\r\n		OPT2:\'\',\r\n		\r\n		jspace:\'\',\r\n		opsize:\'\',\r\n		uweight:\'\',\r\n		utype:\'\',\r\n		\r\n		notes:\'\'\r\n	},\r\n	istherecurrentlyaframebeingconsidered= false;\r\ntry{\r\n	function closetheframeselectwindow(){\r\n		document.getElementById(\'personalize_frame_frame\').style.opacity= \'0\';\r\n		document.getElementById(\'personalize_frame_frame\').style.visibility= \'hidden\';\r\n		\r\n		document.getElementById(\'fanciest\').style.visibility= \'visible\';\r\n		document.getElementById(\'the_void\').style.opacity= \'0\';\r\n		setTimeout(function(){\r\n			//document.getElementById(\'the_void\').style.visibility= \'hidden\';\r\n			document.getElementById(\'all_of_the_frames_you_can_select_from\').style.visibility= \'visible\';\r\n			document.getElementById(\'the_void\').style.display= \'none\';\r\n		},300);\r\n	}\r\n			function opentheframeselectwindow(){\r\n				//document.getElementById(\'the_void\').style.visibility= \'visible\';\r\n				document.getElementById(\'fanciest\').style.visibility= \'hidden\';\r\n				document.getElementById(\'the_void\').style.display= \'grid\';\r\n				document.getElementById(\'the_void\').style.opacity= \'1\';\r\n			}\r\n	\r\n	function dotheframething(){\r\n		opentheframeselectwindow();\r\n		if(!istherecurrentlyaframebeingconsidered){\r\n			istherecurrentlyaframebeingconsidered= true;\r\n			document.getElementById(\'f2_1_final\').value= \'Submit\';\r\n		} else{\r\n			\r\n		}\r\n	}\r\n	function saveframe(){\r\n		vault.jspace= document.getElementById(\'joist_space\').value;\r\n			vault.opsize= document.getElementById(\'opening_size\').value;\r\n			vault.uweight= document.getElementById(\'unit_weight\').value;\r\n			vault.utype= document.querySelector(\'input[name=\"d\"]:checked\').id;\r\n		\r\n		closetheframeselectwindow();\r\n		document.getElementById(\'frame_1\').style.display= \'block\';\r\n			document.getElementById(\'saved_frame_1\').src= \'./frames/frame (\'+(chosen_frame-1)+\').png\';\r\n			document.getElementById(\'saved_frame_1\').style.width= \'62px\';\r\n	}\r\n	\r\n	function back(a){\r\n		if(a==1){\r\n			document.getElementById(\'disable_1\').style.display= \'grid\';\r\n			document.getElementById(\'disable_1\').style.opacity= \'1\';\r\n			document.getElementById(\'disable_2\').style.opacity= \'0\';\r\n			document.getElementById(\'display_2\').style.display= \'none\'\r\n		}else if(a==2){\r\n			document.getElementById(\'disable_2\').style.display= \'grid\';\r\n			document.getElementById(\'disable_2\').style.opacity= \'1\';\r\n			document.getElementById(\'disable_3\').style.opacity= \'0\';\r\n			document.getElementById(\'display_3\').style.display= \'none\'\r\n		}\r\n	}\r\n	function next(a){\r\n		if(a==0){\r\n			vault.fname= document.getElementById(\'_fname\').value;\r\n			vault.lname= document.getElementById(\'_lname\').value;\r\n			vault.email= document.getElementById(\'_email\').value;\r\n			vault.tel= document.getElementById(\'_tel\').value;\r\n			\r\n			document.getElementById(\'disable_1\').style.display= \'none\';\r\n			document.getElementById(\'disable_2\').style.opacity= \'1\';\r\n		}else if(a==1){\r\n			vault.projname= document.getElementById(\'_projname\').value;\r\n			vault.postal= document.getElementById(\'_postal\').value;\r\n			vault.date= document.getElementById(\'_neededby\').value;\r\n			vault.TI= document.querySelector(\'input[name=\"a\"]:checked\').id;\r\n			vault.OPT1= document.querySelector(\'input[name=\"b\"]:checked\').id;\r\n			vault.OPT2= document.querySelector(\'input[name=\"c\"]:checked\').id;\r\n			\r\n			document.getElementById(\'disable_2\').style.display= \'none\';\r\n			document.getElementById(\'disable_3\').style.opacity= \'1\';\r\n			\r\n			console.log(vault);\r\n		}else if(a==2){\r\n			document.getElementById(\'disable_3\').style.display= \'none\';\r\n			document.getElementById(\'disable_4\').style.opacity= \'1\';\r\n		}\r\n	}\r\n} catch(err){console.log(err);}\r\n	\r\n</script>\r\n\r\n\r\n\r\n\r\n<!--<h1>Let QuickFrames do the take-offs and eliminate your need to detail.</h1>\r\n[contact-form-7 id=\"1936\" title=\"New QuickFrames Quote Form\"]\r\n\r\n\r\nFrom: https://wplearninglab.com/contact-form-7-get-value-from-url/\r\n\r\n<script type=\"text/javascript\">\r\nvar getUrlParameter = function getUrlParameter(sParam) {\r\n    var sPageURL = decodeURIComponent(window.location.search.substring(1)),\r\n        sURLVariables = sPageURL.split(\'&\'),\r\n        sParameterName,\r\n        i;\r\n    for (i = 0; i < sURLVariables.length; i++) {\r\n        sParameterName = sURLVariables[i].split(\'=\');\r\n        if (sParameterName[0] === sParam) {\r\n            return sParameterName[1] === undefined ? true : sParameterName[1];\r\n        }\r\n    }\r\n};\r\n\r\nvar VARIABLE = getUrlParameter(\'PARAMETER\');\r\n\r\nif (VARIABLE != null) {\r\n     document.getElementById(\'INPUT-FIELD-ID\').value = VARIABLE;\r\n}\r\n\r\n</script>\r\n\r\n\r\n<a name=\"quote-a-few-frames\"></a>\r\n\r\n[two_fifth]\r\n<h3>Need Just A Few Frames Quoted?</h3>\r\nIf you are working on a project requiring only a few frames and you know the basic requirements for how they will be used, just fill out the form to the right. We\'ll get a quote back to you within 24 hours or less!\r\n\r\nFor each framed opening, using the <a href=\"#frame-types\"> frame type examples </a> shown below, select the frame type number that most closely matches where the opening will be located relative to the joists/beams and enter that into the <strong>Type</strong> column. While RTUs are shown in these images, they apply to all types of roof top equipment. If none of the images match your configuration, enter (0).\r\n\r\n[responsive] <img class=\"alignright\" src=\"/wp-content/uploads/quote-frame-outline.jpg\" alt=\"Frame Outline Image\" width=\"320\" /> [/responsive]\r\n\r\nIf the framing will <strong>only</strong> support the duct openings and not the curbing, enter the letter (<strong><span style=\"color: #37ade1;\">Y</span></strong>) in the <strong>Duct Only</strong> column. If the framing will support the curbing and equipment, enter the letter (<strong><span style=\"color: #37ade1;\">N</span></strong>).\r\n\r\nSpecify the center-to-center joist/beam spacing as shown by (<strong><span style=\"color: #37ade1;\">A</spacing></strong>) in the image to the right.\r\n\r\nWhen specifying the frame opening size (<strong><span style=\"color: #37ade1;\">B</span></strong>), use the length of the opening running <strong>parallel</strong> to (running with) the joists or beams.\r\n\r\n[responsive] <img class=\"alignright\" src=\"/wp-content/uploads/home-install-after-roof.jpg\" alt=\"Install After Roof Image\" width=\"400\"/> [/responsive]\r\n\r\n[/two_fifth]\r\n\r\n[three_fifth_last]\r\n[contact-form-7 id=\"1036\" title=\"Expanded Quote Request Small\"]\r\n[/three_fifth_last]\r\n\r\n<a name=\"frame-types\"></a>\r\n<h2>Frame Type Examples</h2>\r\n[responsive] <img class=\"alignright\" src=\"/wp-content/uploads/quote-frame-configurations.png\" alt=\"Roof Framing Configurations\" /> [/responsive]\r\n\r\n<a name=\"quote-a-lot-of-frames\"></a>\r\n[divider type=\"space\" margintop=\"0\" marginbottom=\"20\"]\r\n\r\n<h2>Have A Large Or Complex Project? Let Us Do The Take-offs For You!</h2>\r\n[divider type=\"space\" margintop=\"0\" marginbottom=\"10\"]\r\n\r\n[one_third]\r\n[responsive] <img src=\"/wp-content/uploads/drawing-image.jpg\" alt=\"Drawing Image\" /> [/responsive]\r\n[/one_third]\r\n\r\n[two_third_last]\r\nThe simplest way for us to provide you with a customized QuickFrames quotation is for you to allow us to do the take-offs directly from the engineering drawing set.\r\n\r\nWe have developed an extensive database of roof top equipment information, such as sizes, weights, opening dimensions, and structural requirements that allows us to select the optimal roof frames for your applications. All you need to do is to provide us with access to your drawing set and then let us go to work for you. You can also have complete confidence that we treat all drawing sets as proprietary information and we respect the importance of confidentiality for anything you share with us.\r\n\r\nThe easiest way for us to access your files is for you to provide us with an FTP address, login and password. Or, if the file set is small enough, you can also email it to us.\r\n\r\n[contact-form-7 id=\"401\" title=\"Quote Request\"]\r\n\r\n[/two_third_last]-->\r\n','Testing Page','','inherit','closed','closed','','777-revision-v1','','','2020-09-08 03:23:00','2020-09-08 10:23:00','',777,'http://quickframes.miritin.com/777-revision-v1/',0,'revision','',0),(1985,1,'2020-09-08 03:32:30','2020-09-08 10:32:30','','dry (0)','','inherit','open','closed','','dry-0','','','2020-09-08 03:32:30','2020-09-08 10:32:30','',0,'http://quickframes.miritin.com/wp-content/uploads/dry-0.png',0,'attachment','image/png',0),(1986,1,'2020-09-08 03:32:31','2020-09-08 10:32:31','','dry (1)','','inherit','open','closed','','dry-1','','','2020-09-08 03:32:31','2020-09-08 10:32:31','',0,'http://quickframes.miritin.com/wp-content/uploads/dry-1.png',0,'attachment','image/png',0),(1987,1,'2020-09-08 03:32:32','2020-09-08 10:32:32','','dry (2)','','inherit','open','closed','','dry-2','','','2020-09-08 03:32:32','2020-09-08 10:32:32','',0,'http://quickframes.miritin.com/wp-content/uploads/dry-2.png',0,'attachment','image/png',0),(1988,1,'2020-09-08 03:32:32','2020-09-08 10:32:32','','dry (3)','','inherit','open','closed','','dry-3','','','2020-09-08 03:32:32','2020-09-08 10:32:32','',0,'http://quickframes.miritin.com/wp-content/uploads/dry-3.png',0,'attachment','image/png',0),(1989,1,'2020-09-08 03:32:33','2020-09-08 10:32:33','','dry (4)','','inherit','open','closed','','dry-4','','','2020-09-08 03:32:33','2020-09-08 10:32:33','',0,'http://quickframes.miritin.com/wp-content/uploads/dry-4.png',0,'attachment','image/png',0),(1990,1,'2020-09-08 03:32:34','2020-09-08 10:32:34','','dry (5)','','inherit','open','closed','','dry-5','','','2020-09-08 03:32:34','2020-09-08 10:32:34','',0,'http://quickframes.miritin.com/wp-content/uploads/dry-5.png',0,'attachment','image/png',0),(1991,1,'2020-09-08 03:32:35','2020-09-08 10:32:35','','dry (6)','','inherit','open','closed','','dry-6','','','2020-09-08 03:32:35','2020-09-08 10:32:35','',0,'http://quickframes.miritin.com/wp-content/uploads/dry-6.png',0,'attachment','image/png',0),(1992,1,'2020-09-08 03:32:35','2020-09-08 10:32:35','','dry (7)','','inherit','open','closed','','dry-7','','','2020-09-08 03:32:35','2020-09-08 10:32:35','',0,'http://quickframes.miritin.com/wp-content/uploads/dry-7.png',0,'attachment','image/png',0),(1993,1,'2020-09-08 03:32:36','2020-09-08 10:32:36','','dry (8)','','inherit','open','closed','','dry-8','','','2020-09-08 03:32:36','2020-09-08 10:32:36','',0,'http://quickframes.miritin.com/wp-content/uploads/dry-8.png',0,'attachment','image/png',0),(1994,1,'2020-09-08 03:32:37','2020-09-08 10:32:37','','dry (9)','','inherit','open','closed','','dry-9','','','2020-09-08 03:32:37','2020-09-08 10:32:37','',0,'http://quickframes.miritin.com/wp-content/uploads/dry-9.png',0,'attachment','image/png',0),(1995,1,'2020-09-08 03:32:38','2020-09-08 10:32:38','','dry (10)','','inherit','open','closed','','dry-10','','','2020-09-08 03:32:38','2020-09-08 10:32:38','',0,'http://quickframes.miritin.com/wp-content/uploads/dry-10.png',0,'attachment','image/png',0),(1996,1,'2020-09-08 03:32:38','2020-09-08 10:32:38','','dry (11)','','inherit','open','closed','','dry-11','','','2020-09-08 03:32:38','2020-09-08 10:32:38','',0,'http://quickframes.miritin.com/wp-content/uploads/dry-11.png',0,'attachment','image/png',0),(1997,1,'2020-09-08 03:32:39','2020-09-08 10:32:39','','dry (12)','','inherit','open','closed','','dry-12','','','2020-09-08 03:32:39','2020-09-08 10:32:39','',0,'http://quickframes.miritin.com/wp-content/uploads/dry-12.png',0,'attachment','image/png',0),(1998,1,'2020-09-08 03:32:52','2020-09-08 10:32:52','','frame (12)','','inherit','open','closed','','frame-12','','','2020-09-08 03:32:52','2020-09-08 10:32:52','',0,'http://quickframes.miritin.com/wp-content/uploads/frame-12.png',0,'attachment','image/png',0),(1999,1,'2020-09-08 03:32:53','2020-09-08 10:32:53','','frame (0)','','inherit','open','closed','','frame-0','','','2020-09-08 03:32:53','2020-09-08 10:32:53','',0,'http://quickframes.miritin.com/wp-content/uploads/frame-0.png',0,'attachment','image/png',0),(2000,1,'2020-09-08 03:32:54','2020-09-08 10:32:54','','frame (1)','','inherit','open','closed','','frame-1','','','2020-09-08 03:32:54','2020-09-08 10:32:54','',0,'http://quickframes.miritin.com/wp-content/uploads/frame-1.png',0,'attachment','image/png',0),(2001,1,'2020-09-08 03:32:55','2020-09-08 10:32:55','','frame (2)','','inherit','open','closed','','frame-2','','','2020-09-08 03:32:55','2020-09-08 10:32:55','',0,'http://quickframes.miritin.com/wp-content/uploads/frame-2.png',0,'attachment','image/png',0),(2002,1,'2020-09-08 03:32:56','2020-09-08 10:32:56','','frame (3)','','inherit','open','closed','','frame-3','','','2020-09-08 03:32:56','2020-09-08 10:32:56','',0,'http://quickframes.miritin.com/wp-content/uploads/frame-3.png',0,'attachment','image/png',0),(2003,1,'2020-09-08 03:32:56','2020-09-08 10:32:56','','frame (4)','','inherit','open','closed','','frame-4','','','2020-09-08 03:32:56','2020-09-08 10:32:56','',0,'http://quickframes.miritin.com/wp-content/uploads/frame-4.png',0,'attachment','image/png',0),(2004,1,'2020-09-08 03:32:57','2020-09-08 10:32:57','','frame (5)','','inherit','open','closed','','frame-5','','','2020-09-08 03:32:57','2020-09-08 10:32:57','',0,'http://quickframes.miritin.com/wp-content/uploads/frame-5.png',0,'attachment','image/png',0),(2005,1,'2020-09-08 03:32:58','2020-09-08 10:32:58','','frame (6)','','inherit','open','closed','','frame-6','','','2020-09-08 03:32:58','2020-09-08 10:32:58','',0,'http://quickframes.miritin.com/wp-content/uploads/frame-6.png',0,'attachment','image/png',0),(2006,1,'2020-09-08 03:32:59','2020-09-08 10:32:59','','frame (7)','','inherit','open','closed','','frame-7','','','2020-09-08 03:32:59','2020-09-08 10:32:59','',0,'http://quickframes.miritin.com/wp-content/uploads/frame-7.png',0,'attachment','image/png',0),(2007,1,'2020-09-08 03:33:00','2020-09-08 10:33:00','','frame (8)','','inherit','open','closed','','frame-8','','','2020-09-08 03:33:00','2020-09-08 10:33:00','',0,'http://quickframes.miritin.com/wp-content/uploads/frame-8.png',0,'attachment','image/png',0),(2008,1,'2020-09-08 03:33:01','2020-09-08 10:33:01','','frame (9)','','inherit','open','closed','','frame-9','','','2020-09-08 03:33:01','2020-09-08 10:33:01','',0,'http://quickframes.miritin.com/wp-content/uploads/frame-9.png',0,'attachment','image/png',0),(2009,1,'2020-09-08 03:33:01','2020-09-08 10:33:01','','frame (10)','','inherit','open','closed','','frame-10','','','2020-09-08 03:33:01','2020-09-08 10:33:01','',0,'http://quickframes.miritin.com/wp-content/uploads/frame-10.png',0,'attachment','image/png',0),(2010,1,'2020-09-08 03:33:02','2020-09-08 10:33:02','','frame (11)','','inherit','open','closed','','frame-11','','','2020-09-08 03:33:02','2020-09-08 10:33:02','',0,'http://quickframes.miritin.com/wp-content/uploads/frame-11.png',0,'attachment','image/png',0),(2011,1,'2020-09-08 03:33:14','2020-09-08 10:33:14','','hori (12)','','inherit','open','closed','','hori-12','','','2020-09-08 03:33:14','2020-09-08 10:33:14','',0,'http://quickframes.miritin.com/wp-content/uploads/hori-12.png',0,'attachment','image/png',0),(2012,1,'2020-09-08 03:33:15','2020-09-08 10:33:15','','hori (0)','','inherit','open','closed','','hori-0','','','2020-09-08 03:33:15','2020-09-08 10:33:15','',0,'http://quickframes.miritin.com/wp-content/uploads/hori-0.png',0,'attachment','image/png',0),(2013,1,'2020-09-08 03:33:15','2020-09-08 10:33:15','','hori (1)','','inherit','open','closed','','hori-1','','','2020-09-08 03:33:15','2020-09-08 10:33:15','',0,'http://quickframes.miritin.com/wp-content/uploads/hori-1.png',0,'attachment','image/png',0),(2014,1,'2020-09-08 03:33:17','2020-09-08 10:33:17','','hori (2)','','inherit','open','closed','','hori-2','','','2020-09-08 03:33:17','2020-09-08 10:33:17','',0,'http://quickframes.miritin.com/wp-content/uploads/hori-2.png',0,'attachment','image/png',0),(2015,1,'2020-09-08 03:33:18','2020-09-08 10:33:18','','hori (3)','','inherit','open','closed','','hori-3','','','2020-09-08 03:33:18','2020-09-08 10:33:18','',0,'http://quickframes.miritin.com/wp-content/uploads/hori-3.png',0,'attachment','image/png',0),(2016,1,'2020-09-08 03:33:19','2020-09-08 10:33:19','','hori (4)','','inherit','open','closed','','hori-4','','','2020-09-08 03:33:19','2020-09-08 10:33:19','',0,'http://quickframes.miritin.com/wp-content/uploads/hori-4.png',0,'attachment','image/png',0),(2017,1,'2020-09-08 03:33:20','2020-09-08 10:33:20','','hori (5)','','inherit','open','closed','','hori-5','','','2020-09-08 03:33:20','2020-09-08 10:33:20','',0,'http://quickframes.miritin.com/wp-content/uploads/hori-5.png',0,'attachment','image/png',0),(2018,1,'2020-09-08 03:33:20','2020-09-08 10:33:20','','hori (6)','','inherit','open','closed','','hori-6','','','2020-09-08 03:33:20','2020-09-08 10:33:20','',0,'http://quickframes.miritin.com/wp-content/uploads/hori-6.png',0,'attachment','image/png',0),(2019,1,'2020-09-08 03:33:21','2020-09-08 10:33:21','','hori (7)','','inherit','open','closed','','hori-7','','','2020-09-08 03:33:21','2020-09-08 10:33:21','',0,'http://quickframes.miritin.com/wp-content/uploads/hori-7.png',0,'attachment','image/png',0),(2020,1,'2020-09-08 03:33:22','2020-09-08 10:33:22','','hori (8)','','inherit','open','closed','','hori-8','','','2020-09-08 03:33:22','2020-09-08 10:33:22','',0,'http://quickframes.miritin.com/wp-content/uploads/hori-8.png',0,'attachment','image/png',0),(2021,1,'2020-09-08 03:33:22','2020-09-08 10:33:22','','hori (9)','','inherit','open','closed','','hori-9','','','2020-09-08 03:33:22','2020-09-08 10:33:22','',0,'http://quickframes.miritin.com/wp-content/uploads/hori-9.png',0,'attachment','image/png',0),(2022,1,'2020-09-08 03:33:23','2020-09-08 10:33:23','','hori (10)','','inherit','open','closed','','hori-10','','','2020-09-08 03:33:23','2020-09-08 10:33:23','',0,'http://quickframes.miritin.com/wp-content/uploads/hori-10.png',0,'attachment','image/png',0),(2023,1,'2020-09-08 03:33:24','2020-09-08 10:33:24','','hori (11)','','inherit','open','closed','','hori-11','','','2020-09-08 03:33:24','2020-09-08 10:33:24','',0,'http://quickframes.miritin.com/wp-content/uploads/hori-11.png',0,'attachment','image/png',0),(2024,1,'2020-09-08 03:33:29','2020-09-08 10:33:29','','vert (0)','','inherit','open','closed','','vert-0','','','2020-09-08 03:33:29','2020-09-08 10:33:29','',0,'http://quickframes.miritin.com/wp-content/uploads/vert-0.png',0,'attachment','image/png',0),(2025,1,'2020-09-08 03:33:30','2020-09-08 10:33:30','','vert (1)','','inherit','open','closed','','vert-1','','','2020-09-08 03:33:30','2020-09-08 10:33:30','',0,'http://quickframes.miritin.com/wp-content/uploads/vert-1.png',0,'attachment','image/png',0),(2026,1,'2020-09-08 03:33:30','2020-09-08 10:33:30','','vert (2)','','inherit','open','closed','','vert-2','','','2020-09-08 03:33:30','2020-09-08 10:33:30','',0,'http://quickframes.miritin.com/wp-content/uploads/vert-2.png',0,'attachment','image/png',0),(2027,1,'2020-09-08 03:33:31','2020-09-08 10:33:31','','vert (3)','','inherit','open','closed','','vert-3','','','2020-09-08 03:33:31','2020-09-08 10:33:31','',0,'http://quickframes.miritin.com/wp-content/uploads/vert-3.png',0,'attachment','image/png',0),(2028,1,'2020-09-08 03:33:32','2020-09-08 10:33:32','','vert (4)','','inherit','open','closed','','vert-4','','','2020-09-08 03:33:32','2020-09-08 10:33:32','',0,'http://quickframes.miritin.com/wp-content/uploads/vert-4.png',0,'attachment','image/png',0),(2029,1,'2020-09-08 03:33:32','2020-09-08 10:33:32','','vert (5)','','inherit','open','closed','','vert-5','','','2020-09-08 03:33:32','2020-09-08 10:33:32','',0,'http://quickframes.miritin.com/wp-content/uploads/vert-5.png',0,'attachment','image/png',0),(2030,1,'2020-09-08 03:33:33','2020-09-08 10:33:33','','vert (6)','','inherit','open','closed','','vert-6','','','2020-09-08 03:33:33','2020-09-08 10:33:33','',0,'http://quickframes.miritin.com/wp-content/uploads/vert-6.png',0,'attachment','image/png',0),(2031,1,'2020-09-08 03:33:34','2020-09-08 10:33:34','','vert (7)','','inherit','open','closed','','vert-7','','','2020-09-08 03:33:34','2020-09-08 10:33:34','',0,'http://quickframes.miritin.com/wp-content/uploads/vert-7.png',0,'attachment','image/png',0),(2032,1,'2020-09-08 03:33:34','2020-09-08 10:33:34','','vert (8)','','inherit','open','closed','','vert-8','','','2020-09-08 03:33:34','2020-09-08 10:33:34','',0,'http://quickframes.miritin.com/wp-content/uploads/vert-8.png',0,'attachment','image/png',0),(2033,1,'2020-09-08 03:33:35','2020-09-08 10:33:35','','vert (9)','','inherit','open','closed','','vert-9','','','2020-09-08 03:33:35','2020-09-08 10:33:35','',0,'http://quickframes.miritin.com/wp-content/uploads/vert-9.png',0,'attachment','image/png',0),(2034,1,'2020-09-08 03:33:36','2020-09-08 10:33:36','','vert (10)','','inherit','open','closed','','vert-10','','','2020-09-08 03:33:36','2020-09-08 10:33:36','',0,'http://quickframes.miritin.com/wp-content/uploads/vert-10.png',0,'attachment','image/png',0),(2035,1,'2020-09-08 03:33:37','2020-09-08 10:33:37','','vert (11)','','inherit','open','closed','','vert-11','','','2020-09-08 03:33:37','2020-09-08 10:33:37','',0,'http://quickframes.miritin.com/wp-content/uploads/vert-11.png',0,'attachment','image/png',0),(2036,1,'2020-09-08 03:33:37','2020-09-08 10:33:37','','vert (12)','','inherit','open','closed','','vert-12','','','2020-09-08 03:33:37','2020-09-08 10:33:37','',0,'http://quickframes.miritin.com/wp-content/uploads/vert-12.png',0,'attachment','image/png',0),(2037,1,'2020-09-08 21:41:22','2020-09-09 04:41:22','<h1>Quote Demo:</h1>\r\n\r\n<style>\r\n\r\n  body{\r\n		font-family:Arial;\r\n	}\r\n\r\n	.Frame_Tool_Img{\r\n		cursor:pointer;\r\n		margin:20px;\r\n		border:2px solid transparent;\r\n		transition:border-color 0.1s linear;\r\n	}\r\n		.Frame_Tool_Img:hover{\r\n			border-color:#79c6e8;\r\n		}\r\n	input{\r\n		text-align:center;\r\n	}\r\n	\r\n	#content_container{\r\n		position:relative;\r\n			left:25vw;\r\n		width:50vw;\r\n			height:100%;\r\n	}\r\n	\r\n	#d{display:none;}\r\n	#tupperware_0{\r\n		grid-area:1 / 1;\r\n		height:100%;\r\n			width:100%;\r\n		display:grid;\r\n			grid-auto-flow:dense;\r\n			grid-template-columns: repeat(7, 1fr);\r\n			grid-template-rows: 500px 500px 500px;\r\n	}\r\n	#tupperware_1{\r\n		grid-area:1 / 1;\r\n		display:none;\r\n	}\r\n	\r\n	#tupperware_2{display:none;}\r\n	\r\n	.coolframebutte{\r\n		width:225px;\r\n		height:auto;\r\n	}\r\n	\r\n\r\n\r\n	#disable_1{\r\n		\r\n	}\r\n	#disable_2,#disable_3,#disable_4{\r\n		opacity:0;\r\n		transition:opacity .25s ease-in-out;\r\n	}\r\n	#disable_4{\r\n		height:7vh;\r\n			width:12vw;\r\n		font-size:2vh;\r\n		top:45vh;\r\n			left:44vw;\r\n	}\r\n\r\n	.fancy{\r\n		width:20vw;\r\n			height:50vh;\r\n			border-radius:10px;\r\n		position:absolute;\r\n			left:25%;\r\n			top:25vh;\r\n		background-color:#eee;\r\n		display:grid;\r\n			grid-auto-columns:100%;\r\n			grid-template-rows:85% 15%;\r\n	}\r\n		#f1{\r\n			backround-color:#fff;\r\n			text-align:center;\r\n		}\r\n		#f2{\r\n			background-color:#bbb;\r\n		}\r\n			#f2_2{\r\n				width:25%;\r\n					height:6%;\r\n				position:absolute;\r\n					left:15%;\r\n					top:90%;\r\n			}\r\n			#f2_1,#f2_1_final{\r\n				width:25%;\r\n					height:6%;\r\n				position:absolute;\r\n					right:15%;\r\n					top:90%;\r\n			}\r\n				.buTy_0{\r\n					height:5%;\r\n						width:65%;\r\n				}\r\n				.buTy_1{\r\n					height:5%;\r\n						width:65%;\r\n				}\r\n				.buTy_2{\r\n					position:absolute;\r\n						width:45%;\r\n						height:23%;\r\n						bottom:18%;\r\n					font-size:80%;\r\n					text-align:left;\r\n					background-color:#fff;\r\n						border:solid #767676 1px;\r\n						border-radius:2px;\r\n				}\r\n					#1_opt_text{\r\n						height:1000%;\r\n					}\r\n					\r\n				#project_type{\r\n					position:relative;\r\n						width:65%;\r\n						height:5%;\r\n						left:17.5%;\r\n					font-size:80%;\r\n					background-color:#fff;\r\n						border:solid #767676 1px;\r\n						border-radius:2px;\r\n				}\r\n\r\n		#cart_area{\r\n			height:65%;\r\n			display:grid;\r\n				grid-template-columns:33% 33% 33%;\r\n				grid-auto-rows:40%;\r\n		}\r\n			.frame_frame_frame{\r\n				\r\n			}\r\n				#frame_add{\r\n					height:24%;\r\n					margin-top:35%;\r\n				}\r\n				.add_frame{\r\n					height:30%;\r\n						width:30%;\r\n					margin-top:25%;\r\n				}\r\n			#_addnotes{\r\n				position:relative;\r\n					width:90%;\r\n					height:10%;\r\n			}\r\n\r\n	#the_void{\r\n		position:absolute;\r\n			top:0;\r\n			left:0;\r\n			z-index:999;\r\n		background-color:rgba(0,0,0,0.6);\r\n		height:100%;\r\n			width:100%;\r\n		display:none;\r\n			grid-template-rows:5% 5% 85% 5%;\r\n			grid-template-columns:5% 90% 5%;\r\n			grid-template-areas:\'. . .\'\r\n								\'. a_fr a_x\'\r\n								\'. a_fr .\'\r\n								\'. . .\';\r\n		opacity:0;\r\n		transition:opacity 0.3s ease-in-out;\r\n	}\r\n		#all_of_the_frames_you_can_select_from{\r\n			grid-area:a_fr;\r\n		}\r\n			#personalize_frame_frame{\r\n				grid-area:a_fr;\r\n				visibility:hidden;\r\n				opacity:0;\r\n				transition:opacity 0.3s ease-in-out;\r\n			}\r\n		#the_little_x_in_the_top_right{\r\n			grid-area:a_x;\r\n				color:#fff;\r\n				font-size:2.4vmax;\r\n				cursor:pointer;\r\n			transition:color .1s linear;\r\n		}\r\n				#the_little_x_in_the_top_right:hover{\r\n					color:#79c6e8;\r\n				}  	\r\n			#customizations{\r\n				position:absolute;\r\n					top:20%;\r\n					height:50%;\r\n					weight:50%;\r\n					left:30%;\r\n				padding:20px;\r\n				border-radius:5px;\r\n				text-align:center;\r\n				background-color:rgba(0,0,0,0.2);\r\n			}\r\n				#bottomofframeoptions{\r\n					position:relative;\r\n						width:100%;\r\n						left:-20px;\r\n						bottom:-20px;\r\n					padding:20px;\r\n					background-color:#bbb;\r\n				}\r\n				#joist_space,#opening_size,#unit_weight{\r\n					height:2.5vh;\r\n					border:none;\r\n					border-left:5px solid transparent;\r\n					transition:border-left 0.2s linear;\r\n				}\r\n				#unit_type{\r\n					color:#fff;\r\n					text-align:left;\r\n				}\r\n			#save_unit{\r\n				width:50%;\r\n					height:2.5vh;\r\n			}\r\n			\r\n	#quickgridthing{\r\n		display:grid;\r\n			grid-template-columns:100%;\r\n			grid-template-areas:100%;\r\n	}\r\n		#grandprize__hori,#grandprize__vert{\r\n			animation:flickercolorselect 1s infinite;\r\n			visibility:hidden;\r\n		}\r\n		.blinking_arrow{\r\n			position:absolute;\r\n				left:10px;\r\n			font-size:1.6vh;\r\n			color:red;\r\n			visibility:hidden;\r\n			animation:flickercolorselect 1s infinite;\r\n		}\r\n	@keyframes flickercolorselect{\r\n		0%{opacity:0;}\r\n		50%{opacity:1;}\r\n		100%{opacity:0;}\r\n	}\r\n\r\n	\r\n	.container_around_selected_frames_in_the_cart_screen{\r\n		\r\n	}\r\n		#rmv_q1{\r\n			color:red;\r\n			border:none;\r\n			background-color:transparent;\r\n			cursor:pointer;\r\n		}\r\n			#rmv_q1:hover{\r\n				text-decoration:underline;\r\n			}\r\n\r\n</style>\r\n<script>\r\n		var input_last_selected= false;\r\n	function selectoneofthetwoinputspluscolouring(a){\r\n		if(a==\'joist\'){\r\n			if(input_last_selected==\'opening\'){\r\n				//document.getElementById(\'opening_size\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_opening\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__vert\').style.visibility= \'hidden\';\r\n			}\r\n			input_last_selected= \'joist\';\r\n			//document.getElementById(\'joist_space\').style.borderLeftColor= \'red\';\r\n			document.getElementById(\'arrow_for_joist\').style.visibility= \'visible\';\r\n			document.getElementById(\'grandprize__hori\').style.visibility= \'visible\';\r\n		} else if(a==\'opening\'){\r\n			if(input_last_selected==\'joist\'){\r\n				//document.getElementById(\'joist_space\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_joist\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__hori\').style.visibility= \'hidden\';\r\n			}\r\n			input_last_selected= \'opening\';\r\n			//document.getElementById(\'opening_size\').style.borderLeftColor= \'red\';\r\n			document.getElementById(\'arrow_for_opening\').style.visibility= \'visible\';\r\n			document.getElementById(\'grandprize__vert\').style.visibility= \'visible\';\r\n		} else if(!a){\r\n			if(input_last_selected==\'joist\'){\r\n				//document.getElementById(\'joist_space\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_joist\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__hori\').style.visibility= \'hidden\';\r\n			} else if(input_last_selected==\'opening\'){\r\n				//document.getElementById(\'opening_size\').style.borderLeftColor= \'transparent\';\r\n				document.getElementById(\'arrow_for_opening\').style.visibility= \'hidden\';\r\n				document.getElementById(\'grandprize__vert\').style.visibility= \'hidden\';\r\n			}\r\n		}\r\n	}\r\n	\r\n		var chosen_frame;\r\n	function choose(a){\r\n			let a6=a.src.length-6,a7=a.src.length-7;\r\n		chosen_frame= parseInt(a.src[a7]!=\'(\'?(a.src[a7]+a.src[a6]):a.src[a6])+1;\r\n		\r\n		//document.getElementById(\'tupperware_0\').style.visibility= \'hidden\';\r\n			//document.getElementById(\'tupperware_1\').style.display= \'block\';\r\n		\r\n		document.getElementById(\'grandprize\').src= \'./frames/dry (\'+(chosen_frame-1)+\').png\';\r\n			setTimeout(function(){document.getElementById(\'grandprize\').style.width= \'375px\';},50);\r\n		\r\n		\r\n		document.getElementById(\'all_of_the_frames_you_can_select_from\').style.visibility= \'hidden\';\r\n		document.getElementById(\'personalize_frame_frame\').style.visibility= \'visible\';\r\n				document.getElementById(\'grandprize__hori\').src= \'./frames/hori (\'+(chosen_frame-1)+\').png\';\r\n				document.getElementById(\'grandprize__vert\').src= \'./frames/vert (\'+(chosen_frame-1)+\').png\';\r\n					setTimeout(function(){\r\n								document.getElementById(\'grandprize__hori\').style.width= \'375px\';\r\n								document.getElementById(\'grandprize__vert\').style.width= \'375px\';\r\n							},50);\r\n			document.getElementById(\'personalize_frame_frame\').style.opacity= \'1\';\r\n		\r\n		if(chosen_frame==3 || chosen_frame==10){\r\n			document.getElementById(\'grandprize__vert\').hidden= true;\r\n			document.getElementById(\'opening_size\').hidden= true;\r\n			document.getElementById(\'arrow_for_opening\').hidden= true;\r\n		} else{\r\n			document.getElementById(\'grandprize__vert\').hidden= false;\r\n			document.getElementById(\'opening_size\').hidden= false;\r\n			document.getElementById(\'arrow_for_opening\').hidden= false;\r\n		}\r\n		\r\n		document.getElementById(\'joist_space\').focus();\r\n		\r\n		\r\n		/*	\r\n		let vHeight= document.getElementById(\'grandprize\').height,\r\n			vWidth= document.getElementById(\'grandprize\').width;\r\n			\r\n		document.getElementById(\'ch_width\').style.left= ((vWidth - document.getElementById(\'ch_width\').style.width)/2)+\'px\';\r\n		*/\r\n	}\r\n	\r\n	function removeitemfromcard(a){\r\n		//add stuff here to remove set image\r\n		document.getElementById(\'frame_\'+a).style.display= \'none\';\r\n	}\r\n	\r\n	\r\n/*\r\n\r\nSUBMIT\r\n- include \'additional notes\' section\r\n- links to plans (URL)\r\n	- OR -\r\n- file upload\r\n- CAPTCHA\r\n\r\n*/\r\n</script>\r\n<!--	-->\r\n		<div id=the_void  style=\"\r\n			position:absolute;\r\n			top:0;\r\n			left:0;\r\n			z-index:999;\r\n		background-color:rgba(0,0,0,0.6);\r\n		height:100%;\r\n			width:100%;\r\n		display:none;\r\n			grid-template-rows:5% 5% 85% 5%;\r\n			grid-template-columns:5% 90% 5%;\r\n			grid-template-areas:\'. . .\'\r\n								\'. a_fr a_x\'\r\n								\'. a_fr .\'\r\n								\'. . .\';\r\n		opacity:0;\r\n		transition:opacity 0.3s ease-in-out;\r\n		\">\r\n			<div id=personalize_frame_frame >\r\n				<div id=quickgridthing >\r\n					<img class=\'Frame_Tool_Img\' id=grandprize__hori src=\'./blue2.png\' style=\'grid-area:1 / 1;\'>\r\n					<img class=\'Frame_Tool_Img\' id=grandprize__vert src=\'./blue1.png\' style=\'grid-area:1 / 1;\'>\r\n					<img class=\'Frame_Tool_Img\' id=grandprize src=\'\' style=\'grid-area:1 / 1;\'>\r\n				</div>\r\n				<div id=customizations >\r\n				\r\n				<div id=arrow_for_joist class=blinking_arrow >►</div>\r\n				<input id=joist_space type=text placeholder=\'Joist Spacing (in.)\' onfocus=\'selectoneofthetwoinputspluscolouring(\"joist\")\'/>\r\n					\r\n				<br><br>\r\n					<div id=arrow_for_opening class=blinking_arrow >►</div>\r\n				<input id=opening_size type=text placeholder=\'Opening Size (in.)\' onfocus=\'selectoneofthetwoinputspluscolouring(\"opening\")\'/>\r\n					\r\n				<br><br><div id=unit_type onclick=\'selectoneofthetwoinputspluscolouring(false)\'>\r\n						<p style=\'text-align:center;\'>Unit Type:</p>\r\n						<div style=\'\r\n						background-color:#fff;\r\n							border:solid #767676 1px;\r\n							border-radius:2px;\r\n							color:#000;\r\n							font-size:80%;\r\n							padding:5px;\' >\r\n							<input type=radio name=\'d\' id=\'u_opt_1\' value=\'opt1\' onfocus=\'selectoneofthetwoinputspluscolouring(false)\'/><label for=\'u_opt_1\'>RTU/AHU/MAU</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_2\' value=\'opt2\'/><label for=\'u_opt_2\'>EVAP Coolers</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_3\' value=\'opt3\'/><label for=\'u_opt_3\'>Exhaust Fans</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_4\' value=\'opt4\'/><label for=\'u_opt_4\'>Powered Vents</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_5\' value=\'opt5\'/><label for=\'u_opt_5\'>Gravity Vents</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_6\' value=\'opt6\'/><label for=\'u_opt_6\'>Skylights</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_7\' value=\'opt7\'/><label for=\'u_opt_7\'>Roof Drains</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_8\' value=\'opt8\'/><label for=\'u_opt_8\'>Roof Hatch</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_9\' value=\'opt9\'/><label for=\'u_opt_9\'>Floor Openings</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_text\' value=\'opt10\'/><input id=\'u_opt_text\' style=\'width:65%\' type=text placeholder=\'Other\'/>\r\n						</div>\r\n					</div>\r\n					\r\n			<br><br><input id=unit_weight type=text placeholder=\'Unit Weight (lbs.)\' onfocus=\'selectoneofthetwoinputspluscolouring(false)\'/>\r\n					\r\n	<br><br><div id=bottomofframeoptions >\r\n				<input id=save_unit type=button value=\'Add to Cart\' onclick=\'saveframe()\' onfocus=\'selectoneofthetwoinputspluscolouring(false)\'/>\r\n			</div>\r\n				</div>\r\n			</div>\r\n			<div id=all_of_the_frames_you_can_select_from >\r\n				\r\n				<div id=fr_double >\r\n					<img src=\'./frames/frame (0).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (1).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (2).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (5).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (6).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (9).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n				</div>\r\n				<div id=fr_triple >\r\n					<img src=\'./frames/frame (3).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (4).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (7).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (8).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (11).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n				</div>\r\n				<div id=fr_quad >\r\n					<img src=\'./frames/frame (10).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (12).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n				</div>\r\n				\r\n			</div>\r\n			<div id=the_little_x_in_the_top_right onclick=\'closetheframeselectwindow()\'>X</div>\r\n		</div>\r\n\r\n\r\n		<div id=fanciest >\r\n			<div class=fancy id=disable_5  style=\"width:20vw;height:50vh;border-radius:10px;position:absolute;left:25%;top:25vh;background-color:#eee;display:grid;grid-auto-columns:100%;grid-template-rows:85% 15%;\">\r\n				<p style=\'text-align:center;\'>Thank you for submitting!</p>\r\n				<input style=\'height:2.5vh;width:5vw;margin-top:32%;margin-left:3.5vw;\' type=button value=\'Return\' onclick=\'location.reload()\' />\r\n			</div>\r\n			<div class=fancy id=disable_4  style=\"width:20vw;height:50vh;border-radius:10px;position:absolute;left:25%;top:25vh;background-color:#eee;display:grid;grid-auto-columns:100%;grid-template-rows:85% 15%;\">\r\n				<div id=f1 >\r\n					<input type=text id=_addnotes placeholder=\'Additional Notes\'>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_2 type=button value=\'Back\' onclick=\'back(2)\'>\r\n					<input id=f2_1_final type=button value=\'Skip\' onclick=\'next(2)\'>\r\n				</div>\r\n			</div>\r\n			<div class=fancy id=disable_3  style=\"width:20vw;height:50vh;border-radius:10px;position:absolute;left:25%;top:25vh;background-color:#eee;display:grid;grid-auto-columns:100%;grid-template-rows:85% 15%;\">\r\n				<div id=f1 >\r\n					<h1>Cart:</h1>\r\n					<div id=cart_area >\r\n						<div class=container_around_selected_frames_in_the_cart_screen id=frame_1 style=\'display:none;\'>\r\n							<img id=saved_frame_1 src=\'\'>\r\n							<div>Qty: \r\n							<select id=quant_1 >\r\n								<option value=\'1\'>1</option>\r\n								<option value=\'2\'>2</option>\r\n								<option value=\'3\'>3</option>\r\n								<option value=\'4\'>4</option>\r\n								<option value=\'5\'>5</option>\r\n								<option value=\'6\'>6</option>\r\n								<option value=\'7\'>7</option>\r\n								<option value=\'8\'>8</option>\r\n								<option value=\'9\'>9</option>\r\n								<option value=\'10\'>10+</option>\r\n							</select></div>\r\n						<br>\r\n							<input id=rmv_q1 type=button value=\'Delete\' onclick=\'removeitemfromcard(1)\'/>\r\n						</div>\r\n						<div><input id=frame_add type=button value=\'Add Frame\' onclick=\'dotheframething()\'/></div>\r\n					</div>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_2 type=button value=\'Back\' onclick=\'back(2)\'>\r\n					<input id=f2_1_final type=button value=\'Skip\' onclick=\'next(2)\'/>\r\n				</div>\r\n			</div>\r\n			<div class=fancy id=disable_2  style=\"width:20vw;height:50vh;border-radius:10px;position:absolute;left:25%;top:25vh;background-color:#eee;display:grid;grid-auto-columns:100%;grid-template-rows:85% 15%;\">\r\n				<div id=f1 >\r\n					<h1>Project Info:</h1>\r\n			<br>	<input class=buTy_0 id=\'_projname\' type=text placeholder=\'project name\'/>\r\n			<br><br><input class=buTy_0 id=\'_postal\' type=postalcode placeholder=\'zip/postal code\'/>\r\n			<br><br><input class=buTy_0 id=\'_neededby\' type=text placeholder=\'frames needed by  (e.g. 01/01/2021)\'/>\r\n			<br><br><form id=project_type >\r\n						<input type=radio name=\'a\' id=\'newmodel\' value=\'NewModel\'/><label for=\'newmodel\'>New Build</label>\r\n						<input type=radio name=\'a\' id=\'TI\' value=\'Newbuild/TI\'/><label for=\'TI\'>Remodel/T.I.</label>\r\n					</form>\r\n						<p style=\'position:relative;left:-25%;top:6%;\'>Roof Material:</p>\r\n					<div class=buTy_2 style=\'left:2%\'>\r\n						<input type=radio name=\'b\' id=\'1_opt_1\' value=\'opt1\'/><label for=\'1_opt_1\'>Steel Deck</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_2\' value=\'opt2\'/><label for=\'1_opt_2\'>Panelized Wood</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_3\' value=\'opt3\'/><label for=\'1_opt_3\'>Concrete</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_4\' value=\'opt4\'/><label for=\'1_opt_4\'>Gypcrete</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_5\' value=\'opt5\'/><input id=\'1_opt_text\' style=\'width:65%\' type=text placeholder=\'Other\'/>\r\n					</div>\r\n						<p style=\'position:relative;right:-25%;top:-2%;\'>Roof Structure:</p>\r\n					<div class=buTy_2 style=\'right:2%;\'>\r\n						<input type=radio name=\'c\' id=\'2_opt_1\' value=\'opt1\'/><label for=\'2_opt_1\'>Steel Joists/Beams</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_2\' value=\'opt2\'/><label for=\'2_opt_2\'>PEMB Purlins</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_3\' value=\'opt3\'/><label for=\'2_opt_3\'>Hybrid</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_4\' value=\'opt4\'/><label for=\'2_opt_4\'>Wood Trusses</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_5\' value=\'opt5\'/><input id=\'2_opt_text\' style=\'width:65%\' type=text placeholder=\'Other\'/>\r\n					</div>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_2 type=button value=\'Back\' onclick=\'back(1)\'>\r\n					<input id=f2_1 type=button value=\'Next\' onclick=\'next(1)\'/>\r\n				</div>\r\n			</div>\r\n			<div class=fancy id=disable_1  style=\"width:20vw;height:50vh;border-radius:10px;position:absolute;left:25%;top:25vh;background-color:#eee;display:grid;grid-auto-columns:100%;grid-template-rows:85% 15%;\">\r\n				<div id=f1 >\r\n					<h1>Customer Info:</h1>\r\n			<br><br><input class=buTy_0 id=_fname type=text required placeholder=\'first name\'/>\r\n			<br><br><input class=buTy_0 id=_lname type=text required placeholder=\'last name\'/>\r\n			<br><br><input class=buTy_0 id=_email type=email required placeholder=\'email\'/>\r\n			<br><br><input class=buTy_0 id=_tel type=tel required placeholder=\'### ###-####\'/>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_1 type=button value=\'Next\' onclick=\'next(0)\'/>\r\n				</div>\r\n			</div>\r\n		</div>\r\n\r\n<div style=\'height:60vh;\'></div>\r\n\r\n{{CODE1}}\r\n\r\n<script>\r\n	var vault={\r\n		fname:\'\',\r\n		lname:\'\',\r\n		email:\'\',\r\n		tel:\'\',\r\n		\r\n		projname:\'\',\r\n		postal:\'\',\r\n		date:\'\',\r\n		TI:\'\',\r\n		OPT1:\'\',\r\n		OPT2:\'\',\r\n		\r\n		jspace:\'\',\r\n		opsize:\'\',\r\n		uweight:\'\',\r\n		utype:\'\',\r\n		\r\n		notes:\'\'\r\n	},\r\n	istherecurrentlyaframebeingconsidered= false;\r\ntry{\r\n	function closetheframeselectwindow(){\r\n		document.getElementById(\'personalize_frame_frame\').style.opacity= \'0\';\r\n		document.getElementById(\'personalize_frame_frame\').style.visibility= \'hidden\';\r\n		\r\n		document.getElementById(\'fanciest\').style.visibility= \'visible\';\r\n		document.getElementById(\'the_void\').style.opacity= \'0\';\r\n		setTimeout(function(){\r\n			//document.getElementById(\'the_void\').style.visibility= \'hidden\';\r\n			document.getElementById(\'all_of_the_frames_you_can_select_from\').style.visibility= \'visible\';\r\n			document.getElementById(\'the_void\').style.display= \'none\';\r\n		},300);\r\n	}\r\n			function opentheframeselectwindow(){\r\n				//document.getElementById(\'the_void\').style.visibility= \'visible\';\r\n				document.getElementById(\'fanciest\').style.visibility= \'hidden\';\r\n				document.getElementById(\'the_void\').style.display= \'grid\';\r\n				document.getElementById(\'the_void\').style.opacity= \'1\';\r\n			}\r\n	\r\n	function dotheframething(){\r\n		opentheframeselectwindow();\r\n		if(!istherecurrentlyaframebeingconsidered){\r\n			istherecurrentlyaframebeingconsidered= true;\r\n			document.getElementById(\'f2_1_final\').value= \'Submit\';\r\n		} else{\r\n			\r\n		}\r\n	}\r\n	function saveframe(){\r\n		vault.jspace= document.getElementById(\'joist_space\').value;\r\n			vault.opsize= document.getElementById(\'opening_size\').value;\r\n			vault.uweight= document.getElementById(\'unit_weight\').value;\r\n			vault.utype= document.querySelector(\'input[name=\"d\"]:checked\').id;\r\n		\r\n		closetheframeselectwindow();\r\n		document.getElementById(\'frame_1\').style.display= \'block\';\r\n			document.getElementById(\'saved_frame_1\').src= \'./frames/frame (\'+(chosen_frame-1)+\').png\';\r\n			document.getElementById(\'saved_frame_1\').style.width= \'62px\';\r\n	}\r\n	\r\n	function back(a){\r\n		if(a==1){\r\n			document.getElementById(\'disable_1\').style.display= \'grid\';\r\n			document.getElementById(\'disable_1\').style.opacity= \'1\';\r\n			document.getElementById(\'disable_2\').style.opacity= \'0\';\r\n			document.getElementById(\'display_2\').style.display= \'none\'\r\n		}else if(a==2){\r\n			document.getElementById(\'disable_2\').style.display= \'grid\';\r\n			document.getElementById(\'disable_2\').style.opacity= \'1\';\r\n			document.getElementById(\'disable_3\').style.opacity= \'0\';\r\n			document.getElementById(\'display_3\').style.display= \'none\'\r\n		}\r\n	}\r\n	function next(a){\r\n		if(a==0){\r\n			vault.fname= document.getElementById(\'_fname\').value;\r\n			vault.lname= document.getElementById(\'_lname\').value;\r\n			vault.email= document.getElementById(\'_email\').value;\r\n			vault.tel= document.getElementById(\'_tel\').value;\r\n			\r\n			document.getElementById(\'disable_1\').style.display= \'none\';\r\n			document.getElementById(\'disable_2\').style.opacity= \'1\';\r\n		}else if(a==1){\r\n			vault.projname= document.getElementById(\'_projname\').value;\r\n			vault.postal= document.getElementById(\'_postal\').value;\r\n			vault.date= document.getElementById(\'_neededby\').value;\r\n			vault.TI= document.querySelector(\'input[name=\"a\"]:checked\').id;\r\n			vault.OPT1= document.querySelector(\'input[name=\"b\"]:checked\').id;\r\n			vault.OPT2= document.querySelector(\'input[name=\"c\"]:checked\').id;\r\n			\r\n			document.getElementById(\'disable_2\').style.display= \'none\';\r\n			document.getElementById(\'disable_3\').style.opacity= \'1\';\r\n			\r\n			console.log(vault);\r\n		}else if(a==2){\r\n			document.getElementById(\'disable_3\').style.display= \'none\';\r\n			document.getElementById(\'disable_4\').style.opacity= \'1\';\r\n		}\r\n	}\r\n} catch(err){console.log(err);}\r\n	\r\n</script>\r\n\r\n\r\n\r\n\r\n<!--<h1>Let QuickFrames do the take-offs and eliminate your need to detail.</h1>\r\n[contact-form-7 id=\"1936\" title=\"New QuickFrames Quote Form\"]\r\n\r\n\r\nFrom: https://wplearninglab.com/contact-form-7-get-value-from-url/\r\n\r\n<script type=\"text/javascript\">\r\nvar getUrlParameter = function getUrlParameter(sParam) {\r\n    var sPageURL = decodeURIComponent(window.location.search.substring(1)),\r\n        sURLVariables = sPageURL.split(\'&\'),\r\n        sParameterName,\r\n        i;\r\n    for (i = 0; i < sURLVariables.length; i++) {\r\n        sParameterName = sURLVariables[i].split(\'=\');\r\n        if (sParameterName[0] === sParam) {\r\n            return sParameterName[1] === undefined ? true : sParameterName[1];\r\n        }\r\n    }\r\n};\r\n\r\nvar VARIABLE = getUrlParameter(\'PARAMETER\');\r\n\r\nif (VARIABLE != null) {\r\n     document.getElementById(\'INPUT-FIELD-ID\').value = VARIABLE;\r\n}\r\n\r\n</script>\r\n\r\n\r\n<a name=\"quote-a-few-frames\"></a>\r\n\r\n[two_fifth]\r\n<h3>Need Just A Few Frames Quoted?</h3>\r\nIf you are working on a project requiring only a few frames and you know the basic requirements for how they will be used, just fill out the form to the right. We\'ll get a quote back to you within 24 hours or less!\r\n\r\nFor each framed opening, using the <a href=\"#frame-types\"> frame type examples </a> shown below, select the frame type number that most closely matches where the opening will be located relative to the joists/beams and enter that into the <strong>Type</strong> column. While RTUs are shown in these images, they apply to all types of roof top equipment. If none of the images match your configuration, enter (0).\r\n\r\n[responsive] <img class=\"alignright\" src=\"/wp-content/uploads/quote-frame-outline.jpg\" alt=\"Frame Outline Image\" width=\"320\" /> [/responsive]\r\n\r\nIf the framing will <strong>only</strong> support the duct openings and not the curbing, enter the letter (<strong><span style=\"color: #37ade1;\">Y</span></strong>) in the <strong>Duct Only</strong> column. If the framing will support the curbing and equipment, enter the letter (<strong><span style=\"color: #37ade1;\">N</span></strong>).\r\n\r\nSpecify the center-to-center joist/beam spacing as shown by (<strong><span style=\"color: #37ade1;\">A</spacing></strong>) in the image to the right.\r\n\r\nWhen specifying the frame opening size (<strong><span style=\"color: #37ade1;\">B</span></strong>), use the length of the opening running <strong>parallel</strong> to (running with) the joists or beams.\r\n\r\n[responsive] <img class=\"alignright\" src=\"/wp-content/uploads/home-install-after-roof.jpg\" alt=\"Install After Roof Image\" width=\"400\"/> [/responsive]\r\n\r\n[/two_fifth]\r\n\r\n[three_fifth_last]\r\n[contact-form-7 id=\"1036\" title=\"Expanded Quote Request Small\"]\r\n[/three_fifth_last]\r\n\r\n<a name=\"frame-types\"></a>\r\n<h2>Frame Type Examples</h2>\r\n[responsive] <img class=\"alignright\" src=\"/wp-content/uploads/quote-frame-configurations.png\" alt=\"Roof Framing Configurations\" /> [/responsive]\r\n\r\n<a name=\"quote-a-lot-of-frames\"></a>\r\n[divider type=\"space\" margintop=\"0\" marginbottom=\"20\"]\r\n\r\n<h2>Have A Large Or Complex Project? Let Us Do The Take-offs For You!</h2>\r\n[divider type=\"space\" margintop=\"0\" marginbottom=\"10\"]\r\n\r\n[one_third]\r\n[responsive] <img src=\"/wp-content/uploads/drawing-image.jpg\" alt=\"Drawing Image\" /> [/responsive]\r\n[/one_third]\r\n\r\n[two_third_last]\r\nThe simplest way for us to provide you with a customized QuickFrames quotation is for you to allow us to do the take-offs directly from the engineering drawing set.\r\n\r\nWe have developed an extensive database of roof top equipment information, such as sizes, weights, opening dimensions, and structural requirements that allows us to select the optimal roof frames for your applications. All you need to do is to provide us with access to your drawing set and then let us go to work for you. You can also have complete confidence that we treat all drawing sets as proprietary information and we respect the importance of confidentiality for anything you share with us.\r\n\r\nThe easiest way for us to access your files is for you to provide us with an FTP address, login and password. Or, if the file set is small enough, you can also email it to us.\r\n\r\n[contact-form-7 id=\"401\" title=\"Quote Request\"]\r\n\r\n[/two_third_last]-->\r\n','Testing Page','','inherit','closed','closed','','777-revision-v1','','','2020-09-08 21:41:22','2020-09-09 04:41:22','',777,'http://quickframes.miritin.com/777-revision-v1/',0,'revision','',0),(2038,1,'2020-09-15 07:49:00','2020-09-15 14:49:00','<h1>Quote Demo:</h1>\n\n\n<!--	-->\n		<div id=the_void  style=\"\n			position:fixed;\n			top:0;\n			left:0;\n			z-index:10000;\n		background-color:rgba(0,0,0,0.8);\n		height:100vh;\n			width:100vw;\n		\">\n			<div id=personalize_frame_frame >\n				<div id=quickgridthing >\n					<img class=\'Frame_Tool_Img specifically_the_frames_that_you_see_when_customizing\' id=grandprize src=\'\' style=\'grid-area:1 / 1;\'>\n					<img class=\'Frame_Tool_Img specifically_the_frames_that_you_see_when_customizing\' id=grandprize__hori src=\'\' style=\'grid-area:1 / 1;\'>\n					<img class=\'Frame_Tool_Img specifically_the_frames_that_you_see_when_customizing\' id=grandprize__vert src=\'\' style=\'grid-area:1 / 1;\'>\n				</div>\n				<div id=customizations >\n				\n				<div id=arrow_for_joist class=blinking_arrow >►</div>\n				<input id=joist_space type=text placeholder=\'Joist Spacing (in.)\' onfocus=\'selectoneofthetwoinputspluscolouring(\"joist\")\'/>\n					\n				<br><br>\n					<div id=arrow_for_opening class=blinking_arrow >►</div>\n				<input id=opening_size type=text placeholder=\'Opening Size (in.)\' onfocus=\'selectoneofthetwoinputspluscolouring(\"opening\")\'/>\n					\n				<br><br><div id=unit_type onclick=\'selectoneofthetwoinputspluscolouring(false)\'>\n						<p style=\'text-align:center;\'>Unit Type:</p>\n						<div style=\'\n						background-color:#fff;\n							border:solid #767676 1px;\n							border-radius:2px;\n							color:#000;\n							font-size:80%;\n							padding:5px;\' >\n							<input type=radio name=\'d\' id=\'u_opt_1\' value=\'opt1\' onfocus=\'selectoneofthetwoinputspluscolouring(false)\'/><label for=\'u_opt_1\'>RTU/AHU/MAU</label>\n							<input type=radio name=\'d\' id=\'u_opt_2\' value=\'opt2\'/><label for=\'u_opt_2\'>EVAP Coolers</label>\n							<input type=radio name=\'d\' id=\'u_opt_3\' value=\'opt3\'/><label for=\'u_opt_3\'>Exhaust Fans</label>\n							<input type=radio name=\'d\' id=\'u_opt_4\' value=\'opt4\'/><label for=\'u_opt_4\'>Powered Vents</label>\n							<input type=radio name=\'d\' id=\'u_opt_5\' value=\'opt5\'/><label for=\'u_opt_5\'>Gravity Vents</label>\n							<input type=radio name=\'d\' id=\'u_opt_6\' value=\'opt6\'/><label for=\'u_opt_6\'>Skylights</label>\n							<input type=radio name=\'d\' id=\'u_opt_7\' value=\'opt7\'/><label for=\'u_opt_7\'>Roof Drains</label>\n							<input type=radio name=\'d\' id=\'u_opt_8\' value=\'opt8\'/><label for=\'u_opt_8\'>Roof Hatch</label>\n							<input type=radio name=\'d\' id=\'u_opt_9\' value=\'opt9\'/><label for=\'u_opt_9\'>Floor Openings</label>\n							<input type=radio name=\'d\' id=\'u_opt_text\' value=\'opt10\'/><input id=\'u_opt_text\' style=\'width:65%\' type=text placeholder=\'Other\'/>\n						</div>\n					</div>\n					\n			<br><br><input id=unit_weight type=text placeholder=\'Unit Weight (lbs.)\' onfocus=\'selectoneofthetwoinputspluscolouring(false)\'/>\n					\n	<br><br><div id=bottomofframeoptions >\n				<input id=save_unit type=button value=\'Add to Cart\' onclick=\'saveframe()\' onfocus=\'selectoneofthetwoinputspluscolouring(false)\'/>\n			</div>\n				</div>\n			</div>\n			<div id=all_of_the_frames_you_can_select_from >\n				\n				<div id=fr_double >\n					<img src=\'../../wp-content/uploads/frame-0.png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\n					<img src=\'../../wp-content/uploads/frame-1.png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\n					<img src=\'../../wp-content/uploads/frame-2.png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\n					<img src=\'../../wp-content/uploads/frame-5.png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\n					<img src=\'../../wp-content/uploads/frame-6.png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\n					<img src=\'../../wp-content/uploads/frame-9.png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\n				</div>\n				<div id=fr_triple >\n					<img src=\'../../wp-content/uploads/frame-3.png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\n					<img src=\'../../wp-content/uploads/frame-4.png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\n					<img src=\'../../wp-content/uploads/frame-7.png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\n					<img src=\'../../wp-content/uploads/frame-8.png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\n					<img src=\'../../wp-content/uploads/frame-11.png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\n				</div>\n				<div id=fr_quad >\n					<img src=\'../../wp-content/uploads/frame-10.png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\n					<img src=\'../../wp-content/uploads/frame-12.png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\n				</div>\n				\n			</div>\n			<div id=the_little_x_in_the_top_right onclick=\'closetheframeselectwindow()\'>X</div>\n		</div>\n\n\n\n\n		<div id=fanciest >\n			<div class=fancy id=disable_5  style=\"width:20vw;height:10vh;border-radius:10px;position:absolute;left:25%;top:25vh;background-color:#eee;display:grid;grid-auto-columns:100%;grid-template-rows:85% 15%;\">\n				<h1 style=\'text-align:center;\'>Thank you for submitting!</h1>\n				<input style=\'height:3.5vh;width:5vw;margin-top:-10%;margin-left:7.5vw;position:absolute;\' type=button value=\'Return\' onclick=\'location.reload()\' />\n			</div>\n                                                                                  \n			<div class=fancy id=disable_4  style=\"width:20vw;height:50vh;border-radius:10px;position:absolute;left:25%;top:25vh;background-color:#eee;display:grid;grid-auto-columns:100%;grid-template-rows:85% 15%;\">\n				<div id=f1 >\n					<textarea id=_addnotes placeholder=\'Additional Notes\'></textarea>\n					<input type=text id=_url placeholder=\'Link to Plans\'>\n					<input type=file id=_upload >\n				</div>\n				<div id=f2 >\n					<input id=f2_2 type=button value=\'Back\' onclick=\'back(3)\'>\n					<input id=f2_1_final_2 type=button value=\'Submit\' onclick=\'next(3)\'>\n				</div>\n			</div>\n                                                                                  \n			<div class=fancy id=disable_3  style=\"width:20vw;height:50vh;border-radius:10px;position:absolute;left:25%;top:25vh;background-color:#eee;display:grid;grid-auto-columns:100%;grid-template-rows:85% 15%;\">\n				<div id=f1 >\n					<h1>Cart:</h1>\n					<div id=cart_area >\n						<div id=thing_that_needs_to_be_after_the_last_frame ><input id=frame_add type=button value=\'Add Frame\' onclick=\'dotheframething()\'/></div>\n                    </div>\n				</div>\n                                                                                                                          \n				<div id=f2 >\n					<input id=f2_2 type=button value=\'Back\' onclick=\'back(2)\'>\n					<input id=f2_1_final type=button value=\'Skip\' onclick=\'next(2)\'/>\n				</div>\n			</div>\n                                                                                  \n			<div class=fancy id=disable_2  style=\"width:20vw;height:50vh;border-radius:10px;position:absolute;left:25%;top:25vh;background-color:#eee;display:grid;grid-auto-columns:100%;grid-template-rows:85% 15%;\">\n				<div id=f1 >\n					<h1>Project Info:</h1>\n			<br>	<input class=buTy_0 id=\'_projname\' type=text placeholder=\'project name\'/>\n			<br><br><input class=buTy_0 id=\'_postal\' type=postalcode placeholder=\'zip/postal code\'/>\n			<br><br><input class=buTy_0 id=\'_neededby\' type=text placeholder=\'frames needed by  (e.g. 01/01/2021)\'/>\n			<br><br><form id=project_type >\n						<div id=bt_newmodel_container ><input type=radio name=\'a\' id=\'newmodel\' value=\'NewModel\'/><label for=\'newmodel\'>New Build</label></div>\n						<div id=bt_ti_container ><input type=radio name=\'a\' id=\'TI\' value=\'Newbuild/TI\'/><label for=\'TI\'>Remodel/T.I.</label></div>\n					</form>\n						<p style=\'position:relative;left:-25%;top:12%;\'>Roof Material:</p>\n					<div class=buTy_2 style=\'left:2%\'>\n						<input type=radio name=\'b\' id=\'1_opt_1\' value=\'opt1\'/><label for=\'1_opt_1\' class=\'butte_radio_lbl\'>Steel Deck</label>\n						<input type=radio name=\'b\' id=\'1_opt_2\' value=\'opt2\'/><label for=\'1_opt_2\' class=\'butte_radio_lbl\'>Panelized Wood</label>\n						<input type=radio name=\'b\' id=\'1_opt_3\' value=\'opt3\'/><label for=\'1_opt_3\' class=\'butte_radio_lbl\'>Concrete</label>\n						<input type=radio name=\'b\' id=\'1_opt_4\' value=\'opt4\'/><label for=\'1_opt_4\' class=\'butte_radio_lbl\'>Gypcrete</label>\n						<input type=radio name=\'b\' id=\'1_opt_5\' value=\'opt5\'/><input id=\'1_opt_text\' style=\'width:65%\' type=text placeholder=\'Other\'/>\n					</div>\n						<p style=\'position:relative;right:-25%;top:3%;\'>Roof Structure:</p>\n					<div class=buTy_2 style=\'right:2%;\'>\n						<input type=radio name=\'c\' id=\'2_opt_1\' value=\'opt1\'/><label for=\'2_opt_1\' class=\'butte_radio_lbl\'>Steel Joists/Beams</label>\n						<input type=radio name=\'c\' id=\'2_opt_2\' value=\'opt2\'/><label for=\'2_opt_2\' class=\'butte_radio_lbl\'>PEMB Purlins</label>\n						<input type=radio name=\'c\' id=\'2_opt_3\' value=\'opt3\'/><label for=\'2_opt_3\' class=\'butte_radio_lbl\'>Hybrid</label>\n						<input type=radio name=\'c\' id=\'2_opt_4\' value=\'opt4\'/><label for=\'2_opt_4\' class=\'butte_radio_lbl\'>Wood Trusses</label>\n						<input type=radio name=\'c\' id=\'2_opt_5\' value=\'opt5\'/><input id=\'2_opt_text\' style=\'width:65%\' type=text placeholder=\'Other\'/>\n					</div>\n				</div>\n				<div id=f2 >\n					<input id=f2_2 type=button value=\'Back\' onclick=\'back(1)\'>\n					<input id=f2_1 type=button value=\'Next\' onclick=\'next(1)\'/>\n				</div>\n			</div>\n                                                                                  \n			<div class=fancy id=disable_1  style=\"width:20vw;height:50vh;border-radius:10px;position:absolute;left:25%;top:25vh;background-color:#eee;display:grid;grid-auto-columns:100%;grid-template-rows:85% 15%;\">\n				<div id=f1 >\n					<h1 style=\'margin-top:7px;\'>Customer Info:</h1>\n			<br><br><input class=buTy_0 id=_fname type=text required placeholder=\'first name\'/>\n			<br><br><input class=buTy_0 id=_lname type=text required placeholder=\'last name\'/>\n			<br><br><input class=buTy_0 id=_email type=email required placeholder=\'email\'/>\n			<br><br><input class=buTy_0 id=_tel type=tel required placeholder=\'### ###-####\'/>\n				</div>\n				<div id=f2 >\n					<input id=f2_1 type=button value=\'Next\' onclick=\'next(0)\'/>\n				</div>\n			</div>\n		</div>\n\n<div style=\'height:60vh;\'></div>\n\n\n\n<!--<h1>Let QuickFrames do the take-offs and eliminate your need to detail.</h1>\n[contact-form-7 id=\"1936\" title=\"New QuickFrames Quote Form\"]\n\n\nFrom: https://wplearninglab.com/contact-form-7-get-value-from-url/\n\n<script type=\"text/javascript\">\nvar getUrlParameter = function getUrlParameter(sParam) {\n    var sPageURL = decodeURIComponent(window.location.search.substring(1)),\n        sURLVariables = sPageURL.split(\'&\'),\n        sParameterName,\n        i;\n    for (i = 0; i < sURLVariables.length; i++) {\n        sParameterName = sURLVariables[i].split(\'=\');\n        if (sParameterName[0] === sParam) {\n            return sParameterName[1] === undefined ? true : sParameterName[1];\n        }\n    }\n};\n\nvar VARIABLE = getUrlParameter(\'PARAMETER\');\n\nif (VARIABLE != null) {\n     document.getElementById(\'INPUT-FIELD-ID\').value = VARIABLE;\n}\n\n</script>\n\n\n<a name=\"quote-a-few-frames\"></a>\n\n[two_fifth]\n<h3>Need Just A Few Frames Quoted?</h3>\nIf you are working on a project requiring only a few frames and you know the basic requirements for how they will be used, just fill out the form to the right. We\'ll get a quote back to you within 24 hours or less!\n\nFor each framed opening, using the <a href=\"#frame-types\"> frame type examples </a> shown below, select the frame type number that most closely matches where the opening will be located relative to the joists/beams and enter that into the <strong>Type</strong> column. While RTUs are shown in these images, they apply to all types of roof top equipment. If none of the images match your configuration, enter (0).\n\n[responsive] <img class=\"alignright\" src=\"/wp-content/uploads/quote-frame-outline.jpg\" alt=\"Frame Outline Image\" width=\"320\" /> [/responsive]\n\nIf the framing will <strong>only</strong> support the duct openings and not the curbing, enter the letter (<strong><span style=\"color: #37ade1;\">Y</span></strong>) in the <strong>Duct Only</strong> column. If the framing will support the curbing and equipment, enter the letter (<strong><span style=\"color: #37ade1;\">N</span></strong>).\n\nSpecify the center-to-center joist/beam spacing as shown by (<strong><span style=\"color: #37ade1;\">A</spacing></strong>) in the image to the right.\n\nWhen specifying the frame opening size (<strong><span style=\"color: #37ade1;\">B</span></strong>), use the length of the opening running <strong>parallel</strong> to (running with) the joists or beams.\n\n[responsive] <img class=\"alignright\" src=\"/wp-content/uploads/home-install-after-roof.jpg\" alt=\"Install After Roof Image\" width=\"400\"/> [/responsive]\n\n[/two_fifth]\n\n[three_fifth_last]\n[contact-form-7 id=\"1036\" title=\"Expanded Quote Request Small\"]\n[/three_fifth_last]\n\n<a name=\"frame-types\"></a>\n<h2>Frame Type Examples</h2>\n[responsive] <img class=\"alignright\" src=\"/wp-content/uploads/quote-frame-configurations.png\" alt=\"Roof Framing Configurations\" /> [/responsive]\n\n<a name=\"quote-a-lot-of-frames\"></a>\n[divider type=\"space\" margintop=\"0\" marginbottom=\"20\"]\n\n<h2>Have A Large Or Complex Project? Let Us Do The Take-offs For You!</h2>\n[divider type=\"space\" margintop=\"0\" marginbottom=\"10\"]\n\n[one_third]\n[responsive] <img src=\"/wp-content/uploads/drawing-image.jpg\" alt=\"Drawing Image\" /> [/responsive]\n[/one_third]\n\n[two_third_last]\nThe simplest way for us to provide you with a customized QuickFrames quotation is for you to allow us to do the take-offs directly from the engineering drawing set.\n\nWe have developed an extensive database of roof top equipment information, such as sizes, weights, opening dimensions, and structural requirements that allows us to select the optimal roof frames for your applications. All you need to do is to provide us with access to your drawing set and then let us go to work for you. You can also have complete confidence that we treat all drawing sets as proprietary information and we respect the importance of confidentiality for anything you share with us.\n\nThe easiest way for us to access your files is for you to provide us with an FTP address, login and password. Or, if the file set is small enough, you can also email it to us.\n\n[contact-form-7 id=\"401\" title=\"Quote Request\"]\n\n[/two_third_last]-->\n','Testing Page','','inherit','closed','closed','','777-autosave-v1','','','2020-09-15 07:49:00','2020-09-15 14:49:00','',777,'http://quickframes.miritin.com/777-autosave-v1/',0,'revision','',0),(2039,1,'2020-09-12 14:51:09','2020-09-12 21:51:09','<h1>Quote Demo:</h1>\r\n\r\n<style>\r\n\r\n  body{\r\n		font-family:Arial;\r\n	}\r\n\r\n	.Frame_Tool_Img{\r\n		cursor:pointer;\r\n		margin:20px;\r\n		border:2px solid transparent;\r\n		transition:border-color 0.1s linear;\r\n	}\r\n		.Frame_Tool_Img:hover{\r\n			border-color:#79c6e8;\r\n		}\r\n	input{\r\n		text-align:center;\r\n	}\r\n	\r\n	#content_container{\r\n		position:relative;\r\n			left:25vw;\r\n		width:50vw;\r\n			height:100%;\r\n	}\r\n	\r\n	#d{display:none;}\r\n	#tupperware_0{\r\n		grid-area:1 / 1;\r\n		height:100%;\r\n			width:100%;\r\n		display:grid;\r\n			grid-auto-flow:dense;\r\n			grid-template-columns: repeat(7, 1fr);\r\n			grid-template-rows: 500px 500px 500px;\r\n	}\r\n	#tupperware_1{\r\n		grid-area:1 / 1;\r\n		display:none;\r\n	}\r\n	\r\n	#tupperware_2{display:none;}\r\n	\r\n	.coolframebutte{\r\n		width:225px;\r\n		height:auto;\r\n	}\r\n	\r\n\r\n\r\n	#disable_1{\r\n		\r\n	}\r\n	#disable_2,#disable_3,#disable_4{\r\n		opacity:0;\r\n		transition:opacity .25s ease-in-out;\r\n	}\r\n	#disable_4{\r\n		height:7vh;\r\n			width:12vw;\r\n		font-size:2vh;\r\n		top:45vh;\r\n			left:44vw;\r\n	}\r\n\r\n	.fancy{\r\n		width:20vw;\r\n			height:50vh;\r\n			border-radius:10px;\r\n		position:absolute;\r\n			left:25%;\r\n			top:25vh;\r\n		background-color:#eee;\r\n		display:grid;\r\n			grid-auto-columns:100%;\r\n			grid-template-rows:85% 15%;\r\n	}\r\n		#f1{\r\n			backround-color:#fff;\r\n			text-align:center;\r\n		}\r\n		#f2{\r\n			background-color:#bbb;\r\n		}\r\n			#f2_2{\r\n				width:25%;\r\n					height:6%;\r\n				position:absolute;\r\n					left:15%;\r\n					top:90%;\r\n			}\r\n			#f2_1,#f2_1_final{\r\n				width:25%;\r\n					height:6%;\r\n				position:absolute;\r\n					right:15%;\r\n					top:90%;\r\n			}\r\n				.buTy_0{\r\n					height:5%;\r\n						width:65%;\r\n				}\r\n				.buTy_1{\r\n					height:5%;\r\n						width:65%;\r\n				}\r\n				.buTy_2{\r\n					position:absolute;\r\n						width:45%;\r\n						height:23%;\r\n						bottom:18%;\r\n					font-size:80%;\r\n					text-align:left;\r\n					background-color:#fff;\r\n						border:solid #767676 1px;\r\n						border-radius:2px;\r\n				}\r\n					#1_opt_text{\r\n						height:1000%;\r\n					}\r\n					\r\n				#project_type{\r\n					position:relative;\r\n						width:65%;\r\n						height:5%;\r\n						left:17.5%;\r\n					font-size:80%;\r\n					background-color:#fff;\r\n						border:solid #767676 1px;\r\n						border-radius:2px;\r\n				}\r\n\r\n		#cart_area{\r\n			height:65%;\r\n			display:grid;\r\n				grid-template-columns:33% 33% 33%;\r\n				grid-auto-rows:40%;\r\n		}\r\n			.frame_frame_frame{\r\n				\r\n			}\r\n				#frame_add{\r\n					height:24%;\r\n					margin-top:35%;\r\n				}\r\n				.add_frame{\r\n					height:30%;\r\n						width:30%;\r\n					margin-top:25%;\r\n				}\r\n			#_addnotes{\r\n				position:relative;\r\n					width:90%;\r\n					height:10%;\r\n			}\r\n\r\n	#the_void{\r\n		position:absolute;\r\n			top:0;\r\n			left:0;\r\n			z-index:999;\r\n		background-color:rgba(0,0,0,0.6);\r\n		height:100%;\r\n			width:100%;\r\n		display:none;\r\n			grid-template-rows:5% 5% 85% 5%;\r\n			grid-template-columns:5% 90% 5%;\r\n			grid-template-areas:\'. . .\'\r\n								\'. a_fr a_x\'\r\n								\'. a_fr .\'\r\n								\'. . .\';\r\n		opacity:0;\r\n		transition:opacity 0.3s ease-in-out;\r\n	}\r\n		#all_of_the_frames_you_can_select_from{\r\n			grid-area:a_fr;\r\n		}\r\n			#personalize_frame_frame{\r\n				grid-area:a_fr;\r\n				visibility:hidden;\r\n				opacity:0;\r\n				transition:opacity 0.3s ease-in-out;\r\n			}\r\n		#the_little_x_in_the_top_right{\r\n			grid-area:a_x;\r\n				color:#fff;\r\n				font-size:2.4vmax;\r\n				cursor:pointer;\r\n			transition:color .1s linear;\r\n		}\r\n				#the_little_x_in_the_top_right:hover{\r\n					color:#79c6e8;\r\n				}  	\r\n			#customizations{\r\n				position:absolute;\r\n					top:20%;\r\n					height:50%;\r\n					weight:50%;\r\n					left:30%;\r\n				padding:20px;\r\n				border-radius:5px;\r\n				text-align:center;\r\n				background-color:rgba(0,0,0,0.2);\r\n			}\r\n				#bottomofframeoptions{\r\n					position:relative;\r\n						width:100%;\r\n						left:-20px;\r\n						bottom:-20px;\r\n					padding:20px;\r\n					background-color:#bbb;\r\n				}\r\n				#joist_space,#opening_size,#unit_weight{\r\n					height:2.5vh;\r\n					border:none;\r\n					border-left:5px solid transparent;\r\n					transition:border-left 0.2s linear;\r\n				}\r\n				#unit_type{\r\n					color:#fff;\r\n					text-align:left;\r\n				}\r\n			#save_unit{\r\n				width:50%;\r\n					height:2.5vh;\r\n			}\r\n			\r\n	#quickgridthing{\r\n		display:grid;\r\n			grid-template-columns:100%;\r\n			grid-template-areas:100%;\r\n	}\r\n		#grandprize__hori,#grandprize__vert{\r\n			animation:flickercolorselect 1s infinite;\r\n			visibility:hidden;\r\n		}\r\n		.blinking_arrow{\r\n			position:absolute;\r\n				left:10px;\r\n			font-size:1.6vh;\r\n			color:red;\r\n			visibility:hidden;\r\n			animation:flickercolorselect 1s infinite;\r\n		}\r\n	@keyframes flickercolorselect{\r\n		0%{opacity:0;}\r\n		50%{opacity:1;}\r\n		100%{opacity:0;}\r\n	}\r\n\r\n	\r\n	.container_around_selected_frames_in_the_cart_screen{\r\n		\r\n	}\r\n		#rmv_q1{\r\n			color:red;\r\n			border:none;\r\n			background-color:transparent;\r\n			cursor:pointer;\r\n		}\r\n			#rmv_q1:hover{\r\n				text-decoration:underline;\r\n			}\r\n\r\n</style>\r\n\r\n<!--	-->\r\n		<div id=the_void  style=\"\r\n			position:absolute;\r\n			top:0;\r\n			left:0;\r\n			z-index:999;\r\n		background-color:rgba(0,0,0,0.6);\r\n		height:100%;\r\n			width:100%;\r\n		display:none;\r\n			grid-template-rows:5% 5% 85% 5%;\r\n			grid-template-columns:5% 90% 5%;\r\n			grid-template-areas:\'. . .\'\r\n								\'. a_fr a_x\'\r\n								\'. a_fr .\'\r\n								\'. . .\';\r\n		opacity:0;\r\n		transition:opacity 0.3s ease-in-out;\r\n		\">\r\n			<div id=personalize_frame_frame >\r\n				<div id=quickgridthing >\r\n					<img class=\'Frame_Tool_Img\' id=grandprize__hori src=\'./blue2.png\' style=\'grid-area:1 / 1;\'>\r\n					<img class=\'Frame_Tool_Img\' id=grandprize__vert src=\'./blue1.png\' style=\'grid-area:1 / 1;\'>\r\n					<img class=\'Frame_Tool_Img\' id=grandprize src=\'\' style=\'grid-area:1 / 1;\'>\r\n				</div>\r\n				<div id=customizations >\r\n				\r\n				<div id=arrow_for_joist class=blinking_arrow >►</div>\r\n				<input id=joist_space type=text placeholder=\'Joist Spacing (in.)\' onfocus=\'selectoneofthetwoinputspluscolouring(\"joist\")\'/>\r\n					\r\n				<br><br>\r\n					<div id=arrow_for_opening class=blinking_arrow >►</div>\r\n				<input id=opening_size type=text placeholder=\'Opening Size (in.)\' onfocus=\'selectoneofthetwoinputspluscolouring(\"opening\")\'/>\r\n					\r\n				<br><br><div id=unit_type onclick=\'selectoneofthetwoinputspluscolouring(false)\'>\r\n						<p style=\'text-align:center;\'>Unit Type:</p>\r\n						<div style=\'\r\n						background-color:#fff;\r\n							border:solid #767676 1px;\r\n							border-radius:2px;\r\n							color:#000;\r\n							font-size:80%;\r\n							padding:5px;\' >\r\n							<input type=radio name=\'d\' id=\'u_opt_1\' value=\'opt1\' onfocus=\'selectoneofthetwoinputspluscolouring(false)\'/><label for=\'u_opt_1\'>RTU/AHU/MAU</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_2\' value=\'opt2\'/><label for=\'u_opt_2\'>EVAP Coolers</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_3\' value=\'opt3\'/><label for=\'u_opt_3\'>Exhaust Fans</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_4\' value=\'opt4\'/><label for=\'u_opt_4\'>Powered Vents</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_5\' value=\'opt5\'/><label for=\'u_opt_5\'>Gravity Vents</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_6\' value=\'opt6\'/><label for=\'u_opt_6\'>Skylights</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_7\' value=\'opt7\'/><label for=\'u_opt_7\'>Roof Drains</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_8\' value=\'opt8\'/><label for=\'u_opt_8\'>Roof Hatch</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_9\' value=\'opt9\'/><label for=\'u_opt_9\'>Floor Openings</label>\r\n						<br><input type=radio name=\'d\' id=\'u_opt_text\' value=\'opt10\'/><input id=\'u_opt_text\' style=\'width:65%\' type=text placeholder=\'Other\'/>\r\n						</div>\r\n					</div>\r\n					\r\n			<br><br><input id=unit_weight type=text placeholder=\'Unit Weight (lbs.)\' onfocus=\'selectoneofthetwoinputspluscolouring(false)\'/>\r\n					\r\n	<br><br><div id=bottomofframeoptions >\r\n				<input id=save_unit type=button value=\'Add to Cart\' onclick=\'saveframe()\' onfocus=\'selectoneofthetwoinputspluscolouring(false)\'/>\r\n			</div>\r\n				</div>\r\n			</div>\r\n			<div id=all_of_the_frames_you_can_select_from >\r\n				\r\n				<div id=fr_double >\r\n					<img src=\'./frames/frame (0).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (1).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (2).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (5).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (6).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (9).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n				</div>\r\n				<div id=fr_triple >\r\n					<img src=\'./frames/frame (3).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (4).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (7).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (8).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (11).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n				</div>\r\n				<div id=fr_quad >\r\n					<img src=\'./frames/frame (10).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n					<img src=\'./frames/frame (12).png\' class=\'Frame_Tool_Img\' onload=\'this.width/=1.5;this.onload=null;\' onclick=\'choose(this)\'>\r\n				</div>\r\n				\r\n			</div>\r\n			<div id=the_little_x_in_the_top_right onclick=\'closetheframeselectwindow()\'>X</div>\r\n		</div>\r\n\r\n\r\n		<div id=fanciest >\r\n			<div class=fancy id=disable_5  style=\"width:20vw;height:50vh;border-radius:10px;position:absolute;left:25%;top:25vh;background-color:#eee;display:grid;grid-auto-columns:100%;grid-template-rows:85% 15%;\">\r\n				<p style=\'text-align:center;\'>Thank you for submitting!</p>\r\n				<input style=\'height:2.5vh;width:5vw;margin-top:32%;margin-left:3.5vw;\' type=button value=\'Return\' onclick=\'location.reload()\' />\r\n			</div>\r\n			<div class=fancy id=disable_4  style=\"width:20vw;height:50vh;border-radius:10px;position:absolute;left:25%;top:25vh;background-color:#eee;display:grid;grid-auto-columns:100%;grid-template-rows:85% 15%;\">\r\n				<div id=f1 >\r\n					<input type=text id=_addnotes placeholder=\'Additional Notes\'>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_2 type=button value=\'Back\' onclick=\'back(2)\'>\r\n					<input id=f2_1_final type=button value=\'Skip\' onclick=\'next(2)\'>\r\n				</div>\r\n			</div>\r\n			<div class=fancy id=disable_3  style=\"width:20vw;height:50vh;border-radius:10px;position:absolute;left:25%;top:25vh;background-color:#eee;display:grid;grid-auto-columns:100%;grid-template-rows:85% 15%;\">\r\n				<div id=f1 >\r\n					<h1>Cart:</h1>\r\n					<div id=cart_area >\r\n						<div class=container_around_selected_frames_in_the_cart_screen id=frame_1 style=\'display:none;\'>\r\n							<img id=saved_frame_1 src=\'\'>\r\n							<div>Qty: \r\n							<select id=quant_1 >\r\n								<option value=\'1\'>1</option>\r\n								<option value=\'2\'>2</option>\r\n								<option value=\'3\'>3</option>\r\n								<option value=\'4\'>4</option>\r\n								<option value=\'5\'>5</option>\r\n								<option value=\'6\'>6</option>\r\n								<option value=\'7\'>7</option>\r\n								<option value=\'8\'>8</option>\r\n								<option value=\'9\'>9</option>\r\n								<option value=\'10\'>10+</option>\r\n							</select></div>\r\n						<br>\r\n							<input id=rmv_q1 type=button value=\'Delete\' onclick=\'removeitemfromcard(1)\'/>\r\n						</div>\r\n						<div><input id=frame_add type=button value=\'Add Frame\' onclick=\'dotheframething()\'/></div>\r\n					</div>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_2 type=button value=\'Back\' onclick=\'back(2)\'>\r\n					<input id=f2_1_final type=button value=\'Skip\' onclick=\'next(2)\'/>\r\n				</div>\r\n			</div>\r\n			<div class=fancy id=disable_2  style=\"width:20vw;height:50vh;border-radius:10px;position:absolute;left:25%;top:25vh;background-color:#eee;display:grid;grid-auto-columns:100%;grid-template-rows:85% 15%;\">\r\n				<div id=f1 >\r\n					<h1>Project Info:</h1>\r\n			<br>	<input class=buTy_0 id=\'_projname\' type=text placeholder=\'project name\'/>\r\n			<br><br><input class=buTy_0 id=\'_postal\' type=postalcode placeholder=\'zip/postal code\'/>\r\n			<br><br><input class=buTy_0 id=\'_neededby\' type=text placeholder=\'frames needed by  (e.g. 01/01/2021)\'/>\r\n			<br><br><form id=project_type >\r\n						<input type=radio name=\'a\' id=\'newmodel\' value=\'NewModel\'/><label for=\'newmodel\'>New Build</label>\r\n						<input type=radio name=\'a\' id=\'TI\' value=\'Newbuild/TI\'/><label for=\'TI\'>Remodel/T.I.</label>\r\n					</form>\r\n						<p style=\'position:relative;left:-25%;top:6%;\'>Roof Material:</p>\r\n					<div class=buTy_2 style=\'left:2%\'>\r\n						<input type=radio name=\'b\' id=\'1_opt_1\' value=\'opt1\'/><label for=\'1_opt_1\'>Steel Deck</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_2\' value=\'opt2\'/><label for=\'1_opt_2\'>Panelized Wood</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_3\' value=\'opt3\'/><label for=\'1_opt_3\'>Concrete</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_4\' value=\'opt4\'/><label for=\'1_opt_4\'>Gypcrete</label>\r\n					<br><input type=radio name=\'b\' id=\'1_opt_5\' value=\'opt5\'/><input id=\'1_opt_text\' style=\'width:65%\' type=text placeholder=\'Other\'/>\r\n					</div>\r\n						<p style=\'position:relative;right:-25%;top:-2%;\'>Roof Structure:</p>\r\n					<div class=buTy_2 style=\'right:2%;\'>\r\n						<input type=radio name=\'c\' id=\'2_opt_1\' value=\'opt1\'/><label for=\'2_opt_1\'>Steel Joists/Beams</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_2\' value=\'opt2\'/><label for=\'2_opt_2\'>PEMB Purlins</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_3\' value=\'opt3\'/><label for=\'2_opt_3\'>Hybrid</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_4\' value=\'opt4\'/><label for=\'2_opt_4\'>Wood Trusses</label>\r\n					<br><input type=radio name=\'c\' id=\'2_opt_5\' value=\'opt5\'/><input id=\'2_opt_text\' style=\'width:65%\' type=text placeholder=\'Other\'/>\r\n					</div>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_2 type=button value=\'Back\' onclick=\'back(1)\'>\r\n					<input id=f2_1 type=button value=\'Next\' onclick=\'next(1)\'/>\r\n				</div>\r\n			</div>\r\n			<div class=fancy id=disable_1  style=\"width:20vw;height:50vh;border-radius:10px;position:absolute;left:25%;top:25vh;background-color:#eee;display:grid;grid-auto-columns:100%;grid-template-rows:85% 15%;\">\r\n				<div id=f1 >\r\n					<h1>Customer Info:</h1>\r\n			<br><br><input class=buTy_0 id=_fname type=text required placeholder=\'first name\'/>\r\n			<br><br><input class=buTy_0 id=_lname type=text required placeholder=\'last name\'/>\r\n			<br><br><input class=buTy_0 id=_email type=email required placeholder=\'email\'/>\r\n			<br><br><input class=buTy_0 id=_tel type=tel required placeholder=\'### ###-####\'/>\r\n				</div>\r\n				<div id=f2 >\r\n					<input id=f2_1 type=button value=\'Next\' onclick=\'next(0)\'/>\r\n				</div>\r\n			</div>\r\n		</div>\r\n\r\n<div style=\'height:60vh;\'></div>\r\n\r\n\r\n\r\n\r\n<!--<h1>Let QuickFrames do the take-offs and eliminate your need to detail.</h1>\r\n[contact-form-7 id=\"1936\" title=\"New QuickFrames Quote Form\"]\r\n\r\n\r\nFrom: https://wplearninglab.com/contact-form-7-get-value-from-url/\r\n\r\n<script type=\"text/javascript\">\r\nvar getUrlParameter = function getUrlParameter(sParam) {\r\n    var sPageURL = decodeURIComponent(window.location.search.substring(1)),\r\n        sURLVariables = sPageURL.split(\'&\'),\r\n        sParameterName,\r\n        i;\r\n    for (i = 0; i < sURLVariables.length; i++) {\r\n        sParameterName = sURLVariables[i].split(\'=\');\r\n        if (sParameterName[0] === sParam) {\r\n            return sParameterName[1] === undefined ? true : sParameterName[1];\r\n        }\r\n    }\r\n};\r\n\r\nvar VARIABLE = getUrlParameter(\'PARAMETER\');\r\n\r\nif (VARIABLE != null) {\r\n     document.getElementById(\'INPUT-FIELD-ID\').value = VARIABLE;\r\n}\r\n\r\n</script>\r\n\r\n\r\n<a name=\"quote-a-few-frames\"></a>\r\n\r\n[two_fifth]\r\n<h3>Need Just A Few Frames Quoted?</h3>\r\nIf you are working on a project requiring only a few frames and you know the basic requirements for how they will be used, just fill out the form to the right. We\'ll get a quote back to you within 24 hours or less!\r\n\r\nFor each framed opening, using the <a href=\"#frame-types\"> frame type examples </a> shown below, select the frame type number that most closely matches where the opening will be located relative to the joists/beams and enter that into the <strong>Type</strong> column. While RTUs are shown in these images, they apply to all types of roof top equipment. If none of the images match your configuration, enter (0).\r\n\r\n[responsive] <img class=\"alignright\" src=\"/wp-content/uploads/quote-frame-outline.jpg\" alt=\"Frame Outline Image\" width=\"320\" /> [/responsive]\r\n\r\nIf the framing will <strong>only</strong> support the duct openings and not the curbing, enter the letter (<strong><span style=\"color: #37ade1;\">Y</span></strong>) in the <strong>Duct Only</strong> column. If the framing will support the curbing and equipment, enter the letter (<strong><span style=\"color: #37ade1;\">N</span></strong>).\r\n\r\nSpecify the center-to-center joist/beam spacing as shown by (<strong><span style=\"color: #37ade1;\">A</spacing></strong>) in the image to the right.\r\n\r\nWhen specifying the frame opening size (<strong><span style=\"color: #37ade1;\">B</span></strong>), use the length of the opening running <strong>parallel</strong> to (running with) the joists or beams.\r\n\r\n[responsive] <img class=\"alignright\" src=\"/wp-content/uploads/home-install-after-roof.jpg\" alt=\"Install After Roof Image\" width=\"400\"/> [/responsive]\r\n\r\n[/two_fifth]\r\n\r\n[three_fifth_last]\r\n[contact-form-7 id=\"1036\" title=\"Expanded Quote Request Small\"]\r\n[/three_fifth_last]\r\n\r\n<a name=\"frame-types\"></a>\r\n<h2>Frame Type Examples</h2>\r\n[responsive] <img class=\"alignright\" src=\"/wp-content/uploads/quote-frame-configurations.png\" alt=\"Roof Framing Configurations\" /> [/responsive]\r\n\r\n<a name=\"quote-a-lot-of-frames\"></a>\r\n[divider type=\"space\" margintop=\"0\" marginbottom=\"20\"]\r\n\r\n<h2>Have A Large Or Complex Project? Let Us Do The Take-offs For You!</h2>\r\n[divider type=\"space\" margintop=\"0\" marginbottom=\"10\"]\r\n\r\n[one_third]\r\n[responsive] <img src=\"/wp-content/uploads/drawing-image.jpg\" alt=\"Drawing Image\" /> [/responsive]\r\n[/one_third]\r\n\r\n[two_third_last]\r\nThe simplest way for us to provide you with a customized QuickFrames quotation is for you to allow us to do the take-offs directly from the engineering drawing set.\r\n\r\nWe have developed an extensive database of roof top equipment information, such as sizes, weights, opening dimensions, and structural requirements that allows us to select the optimal roof frames for your applications. All you need to do is to provide us with access to your drawing set and then let us go to work for you. You can also have complete confidence that we treat all drawing sets as proprietary information and we respect the importance of confidentiality for anything you share with us.\r\n\r\nThe easiest way for us to access your files is for you to provide us with an FTP address, login and password. Or, if the file set is small enough, you can also email it to us.\r\n\r\n[contact-form-7 id=\"401\" title=\"Quote Request\"]\r\n\r\n[/two_third_last]-->\r\n','Testing Page','','inherit','closed','closed','','777-revision-v1','','','2020-09-12 14:51:09','2020-09-12 21:51:09','',777,'http://quickframes.miritin.com/777-revision-v1/',0,'revision','',0),