header { display:none}
.hidden { display:none }
button { margin:0 }
.select2-container { max-width:100%; width:350px !important; margin-bottom: 25px !important; }
.fa-circle-dollar {margin-left: 50px }
.fa-close { color:red }
hr { margin:15px 0}
.content img { max-width: 100%; width:100%; display:block; }
.content img:hover { transform:scale(.9) }
.sub-products a { text-align:center; display:block; font-size: 20px; margin-bottom: 25px}
.sub-products .back { text-align:left; font-size:14px; margin:0}
.fullwidth { width:100% !important; max-width:100% !important}
.showme { display:block !important; z-index:9999 !important }
.hideme { display:none !important }
footer, .copyright, #cta  { display:none }

p.small { font-size: 14px; line-height: 14px; margin-top: 5px !important; display:block; background:#f3e48f; padding: 10px; }
#file-upload-filename { color:red; font-weight:bold }
.fa-spinner { background:transparent !important; color:#000 !important; padding:0 !important; }
.fa-spinner { position: absolute; top: 40%; left:45%; background:red !important; color:#fff !important; padding: 25px !important; font-size: 5em !important; border-radius: 50em; box-shadow: 0 0 50px #000;  }
.saving-overlay {position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(255,255,255,0.8);display:flex;align-items:center;justify-content:center;z-index:10000;}
.saving-overlay .fa-spinner { font-size:5em; color:#000; }
input:invalid { border-color: #cc0000; }
input[type='file'] { color: transparent; }
#image-controls b { display:inline-block; }
#fieldError.error { font-weight:bold; color:#cc0000 }
html :where(img) { height: auto !important}

.progress { display:block; height:15px; background:#fff; border-radius: 50em; width:100%; margin-bottom:10px; box-shadow: inset 0 0 5px #333}
.progress-bar { display:block; height:15px; background:#336633; border-radius: 50em; color:#fff; font-size:10px; text-align:center; box-shadow:inset 5px 5px 10px #33cc33 }


/* Product Canvas */
.product-container { width: 1280px; padding: 15px 25px 75px !important; }
.span_1_of_4 {width: 25%; margin: 0; padding: 0; }
.span_3_of_4 {width: 75%; margin: 0 ; padding: 0;  }

#product-graph { position: relative; display:block; width: 915px; height: 575px; padding:0; background:#fff; border-radius:10px; border-bottom:1px solid #ccc; z-index:0 !Important; overflow:hidden }
.product-details { font-family:arial; color:#000; font-size: 13px; padding: 8px; border-radius: 5px; background:#333; color:#fff; margin-bottom:10px }
.product-details b { display:inline-block !important; margin:0 !important}

#product-container-form select { width:100%; }
#product-container-form  h3 { background:#333; color:#fff; padding: 10px 10px 10px 0; font-size: 1em; }
#product-container-form  h3 i { float:right; font-size: 1.4em   }
#product-container-form .submit-button { background:green; color:#fff; padding: 15px 35px; border: 0; margin-top: 25px; border-radius: .25em; margin-bottom:25px !important }
#product-container-form fieldset:not(:first-of-type) { display: none; }

#product p:hover { text-decoration:underline }


#product-container { position:relative; top:70px; display:inline-block; width: 72.5%; height:92.5vh;  box-shadow:inset 0 0 15px #333;  }
.wrapper { max-width:100% !important; background-color:red; background-image:url('https://www.trigardmemorials.com/wp-content/uploads/2023/12/grass.jpg');  }

/* HTML2CANVAS Styles */
canvas { width:100% !important; height: auto; position: absolute; left: 0; top: 0; }
#preview-product {background:#fff; display:block; padding: 70px 60px; text-align:center; border:1px solid #999; margin-bottom: 15px; width:100%; position: relative;  }



/* Buttons*/
#product-container-form .action-button {
	background: #cc0000;
	font-weight: bold;
	color: white;
	cursor: pointer;
	padding: 22px;
	font-size: 16px;
	text-transform: uppercase;
	border-radius:.25em;
	width:23%;
	float:right;
	border:2px solid #8c4245
}
#product-container-form .action-button:hover {
	background: #ff0000;
}

.previous { background:#999 !important; border-color:#999 !important; float:left !important }

#product-form-container fieldset {
	background: white;
	border: 0 !important;
	box-sizing: border-box;
	width: 100%;
	position: absolute;
	top:0
}



 /* The alert message box */
.alert {padding:5px 15px ;background-color:#999;color:white;z-index:9999 !important; display:block; margin-bottom:0; border-radius:5px;  }
.alert.danger{background:linear-gradient(to right, #d3a61b 25%, #fff); }
.alert.success{background: linear-gradient(to right, #4CAF50 25%, #fff);}
.alert .closebtn {margin-left: 15px;color: white;font-weight: bold;float: right;font-size: 22px;line-height: 20px;cursor: pointer;transition: 0.3s;}
.alert .closebtn:hover {color: black;}
.alert span {padding:0 !Important; color:#fff !Important; background:transparent !Important; border:0 !important}

#grid { position: absolute; top:0; left: 0; z-index:1; display:none;  }

#ruler-open,
#ruler-close { position: absolute; bottom: 0px; left:10px; z-index: 9999; display: block; font-size: 2em; cursor:pointer; color:#000  }
#ruler-open:hover,
#ruler-close { color:red; }
#ruler-close { display:none }

img#output { max-width: 200px }

fieldset h2 { padding:0; background:transparent;}

fieldset { padding: 2.5%; max-width: 1280px; margin: 50px auto; height: auto !important; border-radius: 15px;}


#top-navigation { display:block; width: 100%; background:#482d19; color:#fff !important; padding:5px 0px 5px 20px; font-size: 18px; position: fixed; top:0; z-index:9999 }
#top-navigation .textright a { display:inline-block; position: relative; color:#fff !important; margin-right:35px; text-align:center  }
#top-navigation .textright a:hover { color:#bb9847; }
#top-navigation .textright a:hover span { display:inline-block; position: absolute; width: 100px; left:-30px; top: 40px; background:#000; font-size:14px;text-align:center; padding: 5px; border-radius:5px   }
#top-navigation .textright b { font-weight:normal; font-size: 11px; display:block; }
#top-navigation span { display:inline-block; margin-top:17px; font-size: 18px; }
#top-navigation img { float:left; margin-right: 25px }
#top-navigation .button { margin:8px 0 0; border-radius:0 }
#top-navigation i { color:#fff; font-size: 28px; margin-top: 10px }
#top-navigation i:hover { color:#bb9847 }


.logo { float:left; padding: 0 !important; }
.logo img { width: 60px; height: auto} 
#total { display:inline-block; margin:0; color:#fff !important }

#left-navigation { top:70px; position: relative; display:inline-block; width: 5%; height:92.5vh; background:#fff;}
#left-navigation a { display:block; color:#111; font-size: 1.5em; text-align:center; padding: 10px 0 }
#left-navigation a span { display:block; font-size: 14px; }
#left-navigation a:hover, #left-navigation a:focus { background:#eee; }
#left-navigation a:hover i, #left-navigation a:focus i { color:#bb9847 }

#left-navigation.dark { position: relative; display:inline-block; width: 5%; height:92.5vh; background:#25180d;   }
#left-navigation.dark a { display:block; color:#fff; font-size: 1.5em; text-align:center; padding: 10px 0 }
#left-navigation.dark a:hover, #left-navigation.dark a:focus { background:#111; }
#left-navigation a:hover i, #left-navigation a:focus i { color:#bb9847 }

#left-navigation.tblue { position: relative; display:inline-block; width: 5%; height:92.5vh; background:#2a4555;   }
#left-navigation.tblue a { display:block; color:#fff; font-size: 1.5em; text-align:center; padding: 10px 0 }
#left-navigation.tblue a:hover, #left-navigation.tblue a:focus { background:#d1dde9; color:#2a4555 }
#left-navigation.tblue a:hover i, #left-navigation.tblue a:focus i { color:#2a4555 }

#main-container {overflow:hidden !important;}

#product-options { position: relative; top:70px; display:inline-block; width: 22.5%; height:92.5vh; background:#ddd; padding: 35px; color:#111 !important; overflow-x: hidden; overflow-y: auto; font-size: 14px}
#product-options h2 { color:#111 !important; margin-bottom:10px; text-transform:capitalize; font-size: 1.5em }
#product-options h3 { color:#111; background:transparent; font-size: 18px; padding:0; margin:0 }
#product-options .button { width:100%; display:block; text-align:center }
#product-options select, #product-options input[type="text"], #product-options textarea { display:block; width:100%; margin-bottom:15px; padding:15px;  }
#product-options label { color:#111; font-size: 18px}
#product-options label i{ color:#bb9847 }

#product-options p { margin-top:10px;  }
#product-options ol { margin-left: 25px; }
#product-options a { color:#111 }
#product-options a:hover { text-decoration:underline }
#product-options span { font-size: 15px }

#product-options.dark { background:#111; color:#fff !important; }
#product-options.dark h2 { color:#fff !important; }
#product-options.dark h3 { color:#bb9847; }
#product-options.dark a { color:#fff !important; }
#product-options.dark .button { color:#fff !important; border-color:#fff !important }
#product-options.dark label { color:#fff }

#product-options.tblue { background:#d1dde9; color:#111 !important; }
#product-options.tblue h2 { color:#111 !important; }
#product-options.tblue h3 { color:#111; background:#d1dde9;}
#product-options.tblue a { color:#111; }
#product-options.tblue .button { color:#fff !important; border-color:#111 !important }
#product-options.tblue #drop_zone { color:#111 !important; border-color:#111 !important }


#template span { margin-bottom:15px; display:block }
#emblems .col { width:100% }


#top-navigation.tblue { background:#5c8aa2 !important; color:#fff; }
 


.tools { display:block; background:#fff; color:#111; box-shadow: 0 0 3px #333; font-size: 20px; padding:10px; position: absolute; width:100%; z-index:9995; }
.tools i { font-size: 1em !important }
.tools button:active, .tools span:active {transform:scale(.9) !important; }
.tools #fontname,
.tools #fontDate,
.tools .span_3_of_4 select { width: 30% !important; font-size: 20px !important; padding:5px !important; margin: 0 15px; background:#e5e5e5 }

.tools button { border-radius:5px; background:#fff; border:1px solid #c5c5c5; padding:5px; width: 30px; text-align:center }
.tools a{ padding: 3px 0 3px 10px;border-radius:5px; background:#fff; border:1px solid #c5c5c5; color:#000 !Important }
.tools span {padding: 2px 0px 2px 5px; border-radius: 5px; background:#fff; color:#000; cursor:pointer; border:1px solid #c5c5c5 }
.tools a.undo-steps, .tools a.undo-steps span { border:0; padding:10px; color:red }
.tools a.undo-steps i { color:red}

.tools .fa-close { color:#000 }
.tools i:hover, .tools a:hover, .tools button:hover, .tools button:hover i { cursor:pointer; color:red !Important}

.hideButton { background:#cc0000 !important; }
.hideButton i { background:#cc0000 !important; color:#fff !important; }

.tools input[type="checkbox"] {width: 20px; height: 20px; display: inline-block; margin:0 0 0 5px; position: relative; top:5px; border:1px solid red !important;}
#removeBgCheckbox { margin-left: 25px !important; }
.tools .new { background:#cc9900; color:#fff; padding: 3px; }

#tools #btn-Convert-Html2Image, button { background:#fff; border:0;}


#ui { display:none !important}
#ui, #bg  { display:inline-block; position: relative; background:#e5e5e5 !important; color:#111 !important; padding: 10px; border:0;  font-size: 14px !Important; border-radius: 5px;  max-width: 125px; margin:0; border:1px solid #ccc }
#bg.dark, #ui.dark{ background:#482d19 !important; color:#fff !important; }
#bg.tblue, #ui.tblue{ background:#d1dde9 !important; color:#111; }

#fontname option:nth-child(1),
#fontDates option:nth-child(1),
#fontWords option:nth-child(1) { font-family:'Dutch Roman' !important; font-weight:bold }

#fontname option:nth-child(3), 
#fontDates option:nth-child(3),
#fontWords option:nth-child(3){ font-family:'Helvetica' !important; font-weight:bold }

#fontname option:nth-child(3), 
#fontDates option:nth-child(3),
#fontWords option:nth-child(3){ font-family:'Monotype C' !important; font-weight:bold}

#fontname option:nth-child(4), 
#fontDates option:nth-child(4),
#fontWords option:nth-child(4){ font-family:'Optima' !important; font-weight:bold}


.showButton { background:transparent; float:right; }

#drop_zone { border: 2px dashed #bbb; border-radius: 5px; padding: 25px; text-align: center; color: #bbb !important; margin: 15px 0;  }
#drop_zone.light { border-color:#111; color:#111 !important }
#small_preview,#small_preview2,#small_preview3,#small_preview4,#small_preview5,#small_preview6,#small_preview7 { width: 75px; height: 75px; object-fit: cover; margin: 5px; }

#medallion-options { margin-top: 20px; }
#medallion-options label{ width: 32%; display:inline-block; }
#medallion-options img { width:100% !important; height: auto !Important; }

#photo #removeBgCheckbox { margin:0 !important }

#nameText,#Name1, #Name2 { padding-left: 35px !important; background:#fff url('https://www.trigardmemorials.com/wp-content/uploads/2023/07/circle-user-solid.svg') center left 5px no-repeat; background-size: 20px 20px; }
#bornText, #deathText, #born2Text, #death2Text { padding-left: 35px !important; background:#fff url('https://www.trigardmemorials.com/wp-content/uploads/2023/07/calendar-days-solid.svg') center left 5px no-repeat; background-size: 20px 20px;}

#granite.granite-shadow { box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75) !important;}

#notesArea { min-height: 300px; background:#fff9cd; border-radius: 0; padding: 25px !important; font-size: 20px !important }
#notes i { color: red; font-size: 3em; position: absolute; right:20px; top:50px; transform:rotateZ(25deg);  }
#notes p { color:#111 !important; text-align:center; font-size: 18px}

#help .button { background:#000; border: 1px solid #fff; margin: 10px 0; color:#fff !important }
#help .button:hover { background:#444 !important; }
#help .button i {float:left; font-size: 1.35em; color:#bb9847 !important; margin-bottom:15px }
#help h3 { font-size: 1.5em }
#help a.button { color:#fff }
#help .col { float:none }

#products img { width:90%; height: auto; border-radius:0; margin:0 auto; }
#products a { display:inline-block; margin: 0  1% 15px; text-align:center; color:#111; text-transform:uppercase; width: 46%; font-size: 14px;}
#products img:hover { opacity:.8; transform:scale(.9)}


select[name="size"], select[name="emblems-emblem_size"] { background:#fff url('https://www.trigardmemorials.com/wp-content/uploads/2021/07/ruler.png') center left 5px no-repeat; background-size: 25px 25px; padding-left: 35px !important; }
select[name="template"] { background:#fff url('https://www.trigardmemorials.com/wp-content/uploads/2017/12/template-icon.png') center left no-repeat; background-size: 35px auto; padding-left: 35px !important; }
select[name="background"] { background:#fff url('https://www.trigardmemorials.com/wp-content/uploads/2023/07/background-thumb.jpg') center left 5px no-repeat; background-size: 25px 25px; padding-left: 35px !important; }
select[name="vase"] { background:#fff url('https://www.trigardmemorials.com/wp-content/uploads/2023/07/vase-thumb.jpg') center left 5px no-repeat; background-size: 25px 25px; padding-left: 35px !important }
select[name="scrolls"] { background:#fff url('https://www.trigardmemorials.com/wp-content/uploads/2017/11/scrolls.png') center left no-repeat; background-size: 30px 30px; padding-left: 35px !important }
select[name="accents"] { background:#fff url('https://www.trigardmemorials.com/wp-content/uploads/2023/07/rose-thumb.jpg') center left 5px no-repeat; background-size: 25px 25px; padding-left: 35px !important }
select[name="border"] { background:#fff url('https://www.trigardmemorials.com/wp-content/uploads/2023/07/border-thumb.jpg') center left 5px no-repeat; background-size: 25px 25px; padding-left: 35px !important }
select[name="graniteBase"] { background:#fff url('https://www.trigardmemorials.com/wp-content/uploads/2017/12/granite-icon.png') center left 5px no-repeat; background-size: 25px 25px; padding-left: 35px !important }
select[name="shape"] { background:#fff url('https://www.trigardmemorials.com/wp-content/uploads/2023/10/shape.png') center left 5px no-repeat; background-size: 25px 25px; padding-left: 35px !important }
select[name="medallion-mounting"], select[name="emblems-mounting"] { background:#fff url('https://www.trigardmemorials.com/wp-content/uploads/2023/10/mounting.png') center left 5px no-repeat; background-size: 25px 25px; padding-left: 35px !important }

input#customBackground{ background:#fff url('https://www.trigardmemorials.com/wp-content/uploads/2023/11/custom-color.jpg') center left 5px no-repeat; background-size: 25px 25px; padding-left: 35px !important }

select.booties { background:#fff url('https://www.trigardmemorials.com/wp-content/uploads/2023/10/booties-thumb.jpg') center left 5px no-repeat; background-size: 25px 25px; padding-left: 35px !important }

select[name="image-color"] { background:#fff url('/wp-content/uploads/2017/10/photo.png') center left 5px no-repeat; background-size: 25px 25px; padding-left: 35px !important }



.faq-answer {
    display: none;
    padding: 5px;
	padding-left: 25px;
	background:#fff
}
.faq-answer p { color:#333 !important }

.faq-question {
    background-color: #fff;
    border: none;
    text-align: left;
    padding: 10px;
    width: 100%;
    text-transform: capitalize;
    font-weight: bold;
	margin-top:5px;
	font-size: 16px;
}

.faq-question:hover {
    background-color: #ccc;
}

.faq-question .icon {float: right; }


/* Product UI =================================================== */
#product-graph{ background:transparent !important; border:0 !important; margin:0 auto  }

#product-container-form { padding:0 !important}


#btnSaveDesign {  position: fixed; top:12px; right:220px; background:transparent; font-weight: bold; display:inline-block; z-index: 9999 !important; }
#btnSaveDesign i{ color:#fff; display:block; margin-bottom:0px; font-size: 32px; }
#btnSaveDesign:hover,
#btnSaveDesign:hover i { color:#bb9847; }
#btnSaveDesign b { font-size: 11px; font-weight:normal; color:#fff;  }


img#emblem1,
img#emblem2,
img#emblem3 { position: absolute; display:inline-block; z-index:9999 !important;}

img#emblem1:active,
img#emblem2:active,
img#emblem3:active { border:1px solid red; }

#portrait-border {  z-index:9998 !important; }
img#portrait:active,
img#portrait2:active,
img#portrait3:active,
img#portrait4:active,
img#portrait5:active,
img#portrait6:active,
img#portrait7:active {border:1px solid red !important; box-shadow: 0 0 15px red}
img#vase {z-index:9995 !important;}



/* Field Set - Checkout Form */
fieldset .title { color:#8c4245; font-size: 1.5em; line-height:1em;  font-weight:bold; margin-bottom: 15px; border-bottom:1px solid #ccc; padding-bottom: 10px; }
fieldset h2 {   background:#333; color:#fff; padding: 15px;  }
fieldset h2 i { float:right; font-size: 1.5em !Important }

fieldset.save-design { background:#fff; height:92.5vh; width:100% !important }
fieldset.save-design p { font-size:15px; background:#fcfbb2; border:1px solid #bbba7d; color:#111; margin: 10px 0 10px 0; padding: 10px; }
fieldset.save-design a i{ color:#666; font-size: 1.25em; margin-right:5px;  }
 .savebutton { color:#666; font-weight:bold; text-align:center; border:2px solid #999; padding: 10px 0 5px; font-size: 13px; border-radius: 5px; background:#fff; background:linear-gradient(#fff, #ccc); margin-bottom:0 !Important; text-decoration:none; display:inline-block; width: 125px; float:left; min-height: 70px; margin-right: 15px }

fieldset button { margin-bottom:0 !Important; }
.savebutton i { display:block !important; font-size: 20px; margin-bottom: 5px; }
fieldset.save-design .button:hover, .savebutton:hover { color:#000; background:#fff; background:linear-gradient(#ccc, #eee) }

.save-design #preview-product {float:right; }
.save-design a { color:#3366ff; text-decoration:underline }
.save-design a:hover { color:darkgreen }

fieldset #preview-product { background:#fff; display:block; padding: 0 ; width: 95% !important; height: 700px !important; border:0 !important }
fieldset canvas { position: relative !Important; top:0; height:auto !important; background:#fff; max-width: 80%; max-height:550px;   }

.design .next { display:none }

/*Download Button */
#btn-Convert-Html2Image { background:#fff; border-radius:50px; border:1px solid #111; padding: 10px; color:#111 !important; text-decoration:none; margin:0 auto; display:block; text-align:center } 
#btn-Convert-Html2Image i{ color:#111 !important;  } 

/*Back Button */
#product-container-form .previous { background:#999 !important}

fieldset.submit-order { background:#fff; width:500px; margin: 50px auto; padding:50px; border:2px solid #999 !important; box-shadow:inset 0 0 100px #ccc; }
.submit-order p { font-size:11px; background:#fcfbb2; border:1px solid #bbba7d; color:#000; margin: 10px 0 10px 0; padding: 10px; }
.submit-order input[type="text"] { width:100%; margin-bottom:10px; display:block; }
fieldset.submit-order .previous { background:transparent !important; color:#000; cursor:pointer }

.becomedealer { color:#fff !Important; text-decoration:none !Important }
.becomedealer i { color:#fff !important}


/* Billing - Shipping */
.billing-shipping  { background:#fff; padding: 5% !important; height: 92.5vh; }
.billing-shipping input[type="text"] { width: 42%; margin: 10px 2.5%; }
.billing-shipping strong { margin-left:15px; font-size: 1.5em; display:block; }
.billing-shipping input { border:1px solid #ccc !important }
.same-as-bill { margin-left: 15px; }

fieldset.billing-shipping { padding: 0 }
fieldset.billing-shipping .col { border:2px solid #999; background:#fff; width: 48%; padding-bottom: 25px;   }
fieldset.billing-shipping .col:nth-child(2) { float:right; }


/*Saved Designs */
#product-options .design-link-container { background:#fff; color:#fff; padding:15px 15px 15px 15px; text-align:center; border-radius:5px;  }
#product-options .design-link img { max-width:100% !important; float:none; margin:0 !important; }

#product-options .design-link-container .title { margin:0 !Important;}
#product-options .design-link-container p { float:none !important; width:100%  !important; display:block !important;; margin:0 }


#product-options .design-link-container small,
#product-options .design-link-container br,
#product-options .remove-design { display:none !important }
#product-options .design-link-container .title { font-size: 20px !important; color:#000 !important; margin:0 !important; display:block !important }

#product-options .design-link-container .button { display:block !important; width:100% !important; margin:10px 0 0 !important }



.next-btn { display:block; background:#cc0000; color:#fff !important; font-weight:bold; text-align:center; text-transform:uppercase; padding:10px 35px; border-radius: 10px; z-index:9999 !Important}
#product-options .next-btn { padding:20px; }
.next-btn:hover {background:#ff0000}



.undo-reset-icon {
    background: none;
    font-size: 18px;
}



/* Field Set - Checkout Form */
fieldset .title { color:#8c4245; font-size: 1.5em; line-height:1em;  font-weight:bold; margin-bottom: 15px; border-bottom:1px solid #ccc; padding-bottom: 10px; }
fieldset h2 {   background:#333; color:#fff; padding: 15px;  }
fieldset h2 i { float:right; font-size: 1.5em !Important }

fieldset.save-design { background:#fff }
fieldset.save-design p { font-size:15px; background:#fcfbb2; border:1px solid #bbba7d; color:#111; margin: 10px 0 10px 0; padding: 10px; }
fieldset.save-design a i{ color:#666; font-size: 1.25em; margin-right:5px;  }
 .savebutton { color:#666; font-weight:bold; text-align:center; border:2px solid #999; padding: 10px 0 5px; font-size: 13px; border-radius: 5px; background:#fff; background:linear-gradient(#fff, #ccc); margin-bottom:0 !Important; text-decoration:none; display:inline-block; width: 125px; float:left; min-height: 70px; margin-right: 15px }

fieldset button { margin-bottom:0 !Important; }
.savebutton i { display:block !important; font-size: 20px; margin-bottom: 5px; }
fieldset.save-design .button:hover, .savebutton:hover { color:#000; background:#fff; background:linear-gradient(#ccc, #eee) }

.save-design #preview-product {float:right; }
.save-design a { color:#3366ff; text-decoration:underline }
.save-design a:hover { color:darkgreen }

fieldset #preview-product { background:#fff; display:block; padding: 0 ; width: 95% !important; height: 550px !important;  }
fieldset canvas { position: absolute; top:0; height:auto !important; background:#fff  }

fieldset.submit-order { background:#fff; width:500px; margin: 50px auto; padding:50px; border:2px solid #999 !important; box-shadow:inset 0 0 100px #ccc; }
.submit-order p { font-size:11px; background:#fcfbb2; border:1px solid #bbba7d; color:#000; margin: 10px 0 10px 0; padding: 10px; }
.submit-order input[type="text"] { width:100%; margin-bottom:10px; display:block; }
fieldset.submit-order .previous { background:transparent !important; color:#000; cursor:pointer }

.becomedealer { color:#fff !Important; text-decoration:none !Important }
.becomedealer i { color:#fff !important}


/* Billing - Shipping */
.billing-shipping  { padding: 0 25px; }
.billing-shipping input[type="text"] { width: 42%; margin: 10px 2.5%; }
.billing-shipping strong { margin-left:15px; font-size: 1.5em; display:block; }
.billing-shipping input { border:1px solid #ccc !important }
.same-as-bill { margin-left: 15px; }

fieldset.billing-shipping { padding: 0 }
fieldset.billing-shipping .col { border:2px solid #999; background:#fff; width: 48%; padding-bottom: 25px;   }
fieldset.billing-shipping .col:nth-child(2) { float:right; }

/* Mobile - Alert */
.product-designer-mobile { background:#f9acac; border:2px solid #d06b6b; color:#000; padding: 50px; width: 80%; margin:50px auto !important;  }
.product-designer-mobile a { color:blue !important; display:block; text-decoration:underline; }


/* RESPONSIVE BREAKPOINTS *************/

@media only screen and (max-width : 1140px) {
	#left-navigation { position: relative; display:inline-block; top: 70px; width: 100%; height:auto; background:#fff; margin-top:0px; border-top:1px solid #fff;  }
	#left-navigation a{ display:inline-block; float:left; width: 14.25%; border-right:1px solid #ccc }

	#product-options { position: relative; display;block; left:0px; to:50px; z-index: 9995;  width: 100%; height:auto; background:#ddd; padding: 35px; overflow-x: hidden; overflow-y: auto;}
	#product-container { width:100%; height: auto }

	#product-options select, #product-options input { width: 32% !important; display:inline-block; float:left; margin-right: 1% !important; }
	#products a  { width: 22% !important; }

	.products-icon { position: relative; bottom: 0px; width:100%; }

	#product-container { position: relative; top:70px; }

	#top-navigation {  position:fixed; top:0; z-index:9997; display:block; width:100%; }
	#top-navigation .col { width: 50% }
	#top-navigation .progress { display:none !important}

	#mobile-nav { display:none !Important }

	#emblems .col, #help .col { width: 31%; margin:1%; display:inline-block;}

	#notesArea { min-height: 150px; }

	#ui, #bg { display:none !important}

	#template h2, #person h2, #photo h2, #emblems h2, #notes h2, #products h2 { display:none }
	#template span { display:none }

	#product {transform:scale(1)}

	#drop_zone {clear:left}
}

@media only screen and (max-width : 767px) {
	#top-navigation, #left-navigation, #product-container, #product-options { display:none }
	
	#customPopup { display: none !important; }
}