#the_void{
  	display:none;
			grid-template-rows:5% 5% 85% 5%;
			grid-template-columns:5% 90% 5%;
			grid-template-areas:'. . .'
								'. a_fr a_x'
								'. a_fr .'
								'. . .';
		opacity:0;
		transition:opacity 0.3s ease-in-out;
  }
  #thing_to_increase_total_height_of_page{
    height:20vh;
  }
  
  .NewQuoteItem{
    display:none;
  }
  
  .Frame_Tool_Img{
		cursor:pointer;
		margin:20px;
		border:2px solid transparent;
		transition:border-color 0.1s linear;
	}
		.Frame_Tool_Img:hover{
			border-color:#79c6e8;
		}
  .specifically_the_frames_that_you_see_when_customizing{
  		position:absolute;
    		left:25vw;
   		 	top:6vh;
  }
	
	
	.coolframebutte{
		width:225px;
		height:auto;
	}


	#disable_1{
		
	}
	#disable_2,#disable_3,#disable_4,#disable_5{
        width: 20vw;
        height: 50vh;
        border-radius: 10px;
        position: absolute;
        left: 25%;
        background-color: #eee;
        display: grid;
        grid-auto-columns: 100%;
        grid-template-rows: 85% 15%;
		opacity:0;
		transition:opacity .25s ease-in-out;
	}
	#disable_5{
		height:7vh;
			width:12vw;
		font-size:2vh;
		top:45vh;
			left:44vw;
    
  	  visibility:hidden;
	}

	.fancy{
		width:20vw;
			height:50vh;
			border-radius:10px;
		position:relative;
			left:25%;
			top:35vh;
    	z-index:2;
		background-color:#eee;
		display:grid;
			grid-auto-columns:100%;
			grid-template-rows:85% 15%;
	}
		#f1{
			backround-color:#fff;
			text-align:center;
		}
		#f2{
			background-color:#bbb;
		}
			#f2_2{
				width:25%;
					height:6%;
				position:absolute;
					left:15%;
					top:90%;
			}
			#f2_1,#f2_1_final,#f2_1_final_2{
				width:25%;
					height:6%;
				position:absolute;
					right:15%;
					top:90%;
			}
				.buTy_0{
					height:7%;
						width:65%;
    				margin-top:4px;
				}
				.buTy_1{
					height:5%;
						width:65%;
				}
				.buTy_2{
					position:absolute;
						width:45%;
						height:23%;
						bottom:18%;
					font-size:80%;
					text-align:left;
					background-color:#fff;
						border:solid #767676 1px;
						border-radius:2px;
   					 overflow-y:scroll;
				}
                  .butte_radio_lbl{
						margin-top:-3px;
   						margin-left:1px;
                  }
					#1_opt_text{
						height:1000%;
					}
					
				#project_type{
					position:relative;
						width:65%;
						height:5%;
						left:17.5%;
					font-size:80%;
					background-color:#fff;
						border:solid #767676 1px;
						border-radius:2px;
    				display:grid;
    					grid-template-columns:50% 50%;
				}
                      #bt_newmodel_container{
    					grid-area:1 / 1;
    					margin-left:1px;
                      }
                      #bt_ti_container{
   						grid-area:1 / 2;
    					margin-left:1px;
                      }
		
		#cart_area{
			height:100%;
			display:grid;
				grid-template-columns:33% 33% 33%;
				grid-auto-rows:50%;
		}
			.frame_frame_frame{
				
			}
				#frame_add{
					height:24%;
					margin-top:35%;
				}
				.add_frame{
					height:30%;
						width:30%;
					margin-top:25%;
				}
			#_addnotes{
				position:relative;
					width:90%;
					height:30%;
    			margin-top:5%;
			}
            #_url{
   				position:relative;
   				margin-top:30%;
            }
            #_upload{
                position:relative;
   				margin-top:5%;
            }
	
	#the_void{
		position:absolute;
			top:0;
			left:0;
			z-index:999;
		background-color:rgba(0,0,0,0.6);
		height:100%;
			width:100%;
		display:none;
			grid-template-rows:5% 5% 85% 5%;
			grid-template-columns:5% 90% 5%;
			grid-template-areas:'. . .'
								'. a_fr a_x'
								'. a_fr .'
								'. . .';
		opacity:0;
		transition:opacity 0.3s ease-in-out;
	}
		#all_of_the_frames_you_can_select_from{
			grid-area:a_fr;
		}
			#personalize_frame_frame{
				grid-area:a_fr;
				visibility:hidden;
    			pointer-events:none;
				opacity:0;
				transition:opacity 0.3s ease-in-out;
			}
		#the_little_x_in_the_top_right{
			grid-area:a_x;
				color:#fff;
				font-size:2.4vmax;
				cursor:pointer;
			transition:color .1s linear;
		}
				#the_little_x_in_the_top_right:hover{
					color:#79c6e8;
				}
			#customizations{
				position:absolute;
					top:7h;
					height:50%;
					left:50%;
				padding:20px;
				border-radius:5px;
				text-align:center;
				background-color:rgba(0,0,0,0.2);
			}
				#bottomofframeoptions{
					position:relative;
						width:100%;
						left:-20px;
						bottom:-20px;
					padding:20px;
					background-color:#bbb;
				}
				#joist_space,#opening_size,#unit_weight{
					height:2.5vh;
					border:none;
					border:2px solid transparent;
				}
				#unit_type{
					color:#fff;
					text-align:left;
				}
			#save_unit{
				width:50%;
					height:2.5vh;
			}
			
	#quickgridthing{
		display:grid;
			grid-template-columns:100%;
			grid-template-areas:100%;
	}
		#grandprize__hori,#grandprize__vert{
			animation:flickercolorselect 1s infinite;
			visibility:hidden;
		}
		.blinking_arrow{
			position:absolute;
				left:10px;
			font-size:1.6vh;
			color:red;
			visibility:hidden;
			animation:flickercolorselect 1s infinite;
		}
	@keyframes flickercolorselect{
		0%{opacity:0;}
		50%{opacity:1;}
		100%{opacity:0;}
	}
	
	
	.container_around_selected_frames_in_the_cart_screen{
   		 cursor:pointer;
	}
		.rmv{
			color:red;
			border:none;
			background-color:transparent;
			cursor:pointer;
		}
			.rmv:hover{
				text-decoration:underline;
			}
  
  




    #customizations{
   		min-height:440px;
    }
  @media (max-width: 319px){
    #thing_to_increase_total_height_of_page{
      height:500px;
    }
    #f2_1, #f2_1_final, #f2_1_final_2 {
        height: 30px;
    }
    #save_unit {
	height: 30px;
    }
    #disable_1{
		width:100vw;
			height:350px;
			top:550px;
      left:10vw;
    }
    #disable_2{
      left: 10vw;
      top:550px;
      height: 500px;
      width: 100vw;
    }
    #disable_3{
      left: 10vw;
      height: 500px;
      width: 100vw;
      top: 550px;
    }
    #disable_4{
    	left: 10vw;
      	height: 500px;
     	width: 100vw;
     	top: 550px;
    }
    #the_void{
      overflow-y:scroll;
    }
    .specifically_the_frames_that_you_see_when_customizing{
        left: 0vw;
        top: 6vh;
        margin: 0;
    }
    #customizations{
        top: calc(6vh + 400px);
        left: 12%;
    }
    .fancy{
      margin-left:-10%;
		width:100vw;
			height:60vh;
			top:90vh;
      left:2.8vw;

	}
  }
  @media (min-width: 320px) and (max-width: 411px){
    #thing_to_increase_total_height_of_page{
      height:500px;
    }
    #f2_1, #f2_1_final, #f2_1_final_2 {
        height: 30px;
    }
    #save_unit {
	height: 30px;
    }
    #disable_1{
	width:100vw;
	height:400px;
	top:550px;
        left:0vw;
    }
    #disable_2{
      left: 0vw;
      top:550px;
      height: 500px;
      width: 100vw;
    }
    #disable_3{
      left: 10vw;
      height: 500px;
      width: 100vw;
      top: 550px;
    }
    #disable_4{
    	left: 10vw;
      	height: 500px;
     	width: 100vw;
     	top: 550px;
    }
    #the_void{
      overflow-y:scroll;
    }
    .specifically_the_frames_that_you_see_when_customizing{
        left: 0vw;
        top: 6vh;
        margin: 0;
    }
    #customizations{
        top: calc(6vh + 400px);
        left: 20%;
    }
    .fancy{
      margin-left:-10%;
		width:100vw;
			height:60vh;
			top:90vh;
      left:2.8vw;

	}
  }
  @media (min-width: 412px) and (max-width: 769px){
    #thing_to_increase_total_height_of_page{
      height:500px;
    }
    #f2_1, #f2_1_final, #f2_1_final_2 {
        height: 30px;
    }
    #save_unit {
	height: 30px;
    }
    #disable_1{
		width:350px;
		height:350px;
		top:500px;
        left: calc(50% - 125px);
    }
    #disable_2{
        left: calc(50% - 125px);
      top:500px;
      height: 500px;
      width:350px;
    }
    #disable_3{
        left: calc(50% - 125px);
      top:500px;
      height: 500px;
      width:350px;
    }
    #disable_4{
        left: calc(50% - 125px);
      top:500px;
      height: 500px;
      width:350px;
    }
    #the_void{
      overflow-y:scroll;
    }
    .specifically_the_frames_that_you_see_when_customizing{
        left: calc(50% - 185px);
        top: 6vh;
        margin: 0;
    }
    #customizations{
        top: calc(6vh + 400px);
        left: calc(50% - 110px);
    }
    .fancy{
      margin-left:-10%;
		width:100vw;
			height:60vh;
			top:90vh;
      left:2.8vw;

	}
  }
  @media (min-width: 770px) and (max-width: 1249px){
    #thing_to_increase_total_height_of_page{
      height:700px;
    }
    #f2_1, #f2_1_final, #f2_1_final_2 {
        height: 30px;
    }
    #save_unit {
	height: 30px;
    }
    #disable_1{
		width:400px;
		height:350px;
		top:500px;
        left: calc(50% - 125px);
    }
    #disable_2{
        left: calc(50% - 125px);
      top:500px;
      height: 500px;
      width:400px;
    }
    #disable_3{
        left: calc(50% - 125px);
      top:500px;
      height: 500px;
      width:400px;
    }
    #disable_4{
        left: calc(50% - 125px);
      top:500px;
      height: 500px;
      width:400px;
    }
    #the_void{
      overflow-y:scroll;
    }
    .specifically_the_frames_that_you_see_when_customizing{
        left: calc(50% - 300px);
        top: 6vh;
        margin: 0;
    }
    #customizations{
        left: calc(50% + 100px);
        top: 6vh;
        margin: 0;
    }
    .fancy{
      margin-left:-10%;
		width:100vw;
			height:60vh;
			top:90vh;
      left:2.8vw;

	}
  }
  @media (min-width: 1250px){
    #thing_to_increase_total_height_of_page{
      height:700px;
    }
    #f2_1, #f2_1_final, #f2_1_final_2 {
        height: 30px;
    }
    #save_unit {
	height: 30px;
    }
    #disable_1{
		width:400px;
		height:425px;
		top:65px;
        left: calc(50% - 125px);
    }
    #disable_2,#disable_3,#disable_4{
        left: calc(50% - 125px);
      top:650px;
      height: 500px;
      width:400px;
    }
    #the_void{
      overflow-y:scroll;
    }
    .specifically_the_frames_that_you_see_when_customizing{
        left: calc(50% - 350px);
        top: 6vh;
        margin: 0;
    }
    #customizations{
        left: calc(50% + 180px);
        top: 6vh;
        margin: 0;
    }
    .fancy{
      margin-left:-10%;
		width:100vw;
			height:60vh;
			top:90vh;
      left:2.8vw;

	}
  }