@font-face { font-family: 'FONT_ARIAL'; src: url('../fonts/Arial.eot'); src: url('../fonts/Arial.eot') format('embedded-opentype'), url('../fonts/Arial.woff2') format('woff2'), url('../fonts/Arial.woff') format('woff'), url('../fonts/Arial.ttf') format('truetype'), url('../fonts/Arial.svg#Arial') format('svg'); }
@font-face { font-family: 'FONT_ARIAL_BOLD'; src: url('../fonts/Arial_Bold.eot'); src: url('../fonts/Arial_Bold.eot') format('embedded-opentype'), url('../fonts/Arial_Bold.woff2') format('woff2'), url('../fonts/Arial_Bold.woff') format('woff'), url('../fonts/Arial_Bold.ttf') format('truetype'), url('../fonts/Arial_Bold.svg#Arial_Bold') format('svg'); }

html, body { margin: 0; height: 100%; user-select: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; background-color: #FFF; }
body { display: flex; flex-direction: column; }
main { flex: 1; overflow: auto; height: inherit; background-image: linear-gradient(to bottom, #BAC9E3,#064287); }
section { height: 100%; overflow: auto; }
section:last-child { border: none; }
footer { font-family: 'FONT_ARIAL_BOLD'; font-size: 8pt; color: #FFF; background-color: #064287; text-align: center; height: 20px; padding-bottom: 2px; }

label { font-family: 'FONT_ARIAL'; font-size: 14px; font-weight: normal; color: #064287; }

#Container { width: 100%; height: auto; min-height: 100%; margin-left: auto; margin-right: auto; background-color: #FFF; overflow: hidden; }
#Admin_Container { width: 100%; height: 100% !important; margin-left: auto; margin-right: auto; background-color: #FFF; }
#Masthead_Container { width: 100%; height: 120px; float: left; background-image: url(../images/SA_2016_Logo.webp); background-repeat: no-repeat; background-position: center top; margin-top: 10px; margin-bottom: 2px; }
#Masthead_Logo { width: 245px; height: 120px; background-image: url(../images/logo.webp); background-repeat: no-repeat; background-position: left top; float: left; display: inline; }
#Masthead_SCC { width: 755px; height: 120px; float: left; display: inline; background-color: #064287; background-repeat: no-repeat; background-position: center top; background-image: url(../images/scc.png); }
#Content_Container { width: 100%; height: auto; float: left; }
#Orders_Container { width: 100%; height: auto; margin-left: auto; margin-right: auto; }

/* Menu at the top */
#Page_Menu_Container { font-family: 'FONT_ARIAL_BOLD'; font-size: 10pt; font-weight: normal; color: #FFF; background-color: #064287; text-align: center; width: 100%; height: max-content; display: flex; flex-direction: row; gap: 10px; justify-content: center; border-bottom-width: 1px; border-top-width: 1px; border-bottom-style: solid; border-top-style: solid; border-bottom-color: #064287; border-top-color: #064287; }
.Page_Menu_Button { width: max-content; height: inherit; font-family: 'FONT_ARIAL_BOLD'; font-size: 10pt; color: #FFF; padding: 6px; display: inline; }
.Page_Menu_Button:hover { background-color: #FFF; color: #064287; }

/* All Pages */
#Page_Header { font-family: 'FONT_ARIAL_BOLD'; font-size: 24px; font-weight: normal; color: #FFF; text-align: center; background-color: #064287; width: 100%; padding-top: 10px; padding-bottom: 10px; }
.Page_SubHeader { font-family: 'FONT_ARIAL'; font-size: 18px; font-weight: normal; color: #064287; text-align: center; }
#Footer_Container { position: relative; font-family: 'FONT_ARIAL_BOLD'; font-size: 12px; font-weight: normal; color: #FFF; background-color: #064287; height: 20px; width: 100%; bottom: 0px; text-align: center; margin-left: auto; margin-right: auto; }

/* Index.php Main Menu */
#Main_Menu_Container { width: 80%; height: max-content; overflow: hidden; max-height: max-content; min-height: 350px; padding: 20px; margin-left: auto; margin-right: auto; display: flex; flex-direction: row; flex-flow: row wrap; justify-content: center; align-content: center; }
.Main_Menu_Header { font-family: 'FONT_ARIAL_BOLD'; font-size: 24px; font-weight: normal; color: #064287; height: 35px; width: 100%; text-align: center; margin-left: auto; margin-right: auto; }
.Main_Menu_Tile_Container { width: 220px; height: max-content; overflow: hidden; max-height: max-content; min-height: 230px; margin-left: 12px; margin-right: 12px; margin-top: 15px; margin-bottom: 15px; background-color: #FFF; border-color: #064287; border-width: 1px; border-style: solid; -moz-border-radius: 8px; -webkit-border-radius: 8px; -khtml-border-radius: 8px; border-radius: 8px; behavior:url("border-radius.htc"); box-shadow: 2px 10px 15px #000; }
.Main_Menu_Tile_Header { font-family: 'FONT_ARIAL_BOLD'; font-size: 10pt; font-weight: normal; color: #FFF; background-color: #064287; height: 16px; width: 100%; padding-top: 4px; text-align: center; }
.Main_Menu_Icon { width: 180px; height: 200px; margin-left: auto; margin-right: auto; margin-top: 5px; cursor: pointer; }

/* PRODUCTS PAGE */
#Product_Page_Products_Container { height: auto; width: 90%; display: flex; flex-direction: row; flex-flow: row wrap; justify-content: center; align-content: center; margin-top: 20px; margin-right: auto; margin-left: auto; overflow: hidden; }

/* PRODUCT BOX */
.Product_Box_Container { width: 210px; height: max-content; overflow: hidden; max-height: max-content; min-height: 350px; margin-left: 24px; background-color: #FFF; border-color: #064287; border-width: 1px; border-style: solid; margin-bottom: 30px; -moz-border-radius: 8px; -webkit-border-radius: 8px; -khtml-border-radius: 8px; border-radius: 8px; behavior:url("border-radius.htc"); box-shadow: 2px 10px 15px #000; float: left; display: inline; }
.Product_Image_Container { width: 180px; height: 200px; margin-left: auto; margin-right: auto; margin-bottom: 5px; }
.Product_Image_Container img { cursor: pointer; }
.Product_Image_Frame { margin-top: 5px; -moz-border-radius: 8px; -webkit-border-radius: 8px; -khtml-border-radius: 8px; border-radius: 8px; behavior:url("border-radius.htc"); border-color: #BBB; border-width: 1px; border-style: solid; }
.Product_Details_Container { width: 200px; height: max-content; overflow: hidden; }
.Product_Details_Row_Container { width: 200px; height: max-content; min-height: 22px; overflow: hidden; margin-left: auto; margin-right: auto; text-align: center; padding-top: 5px; padding-bottom: 5px; }
.Product_Details_Itemname { font-family: 'FONT_ARIAL_BOLD'; font-weight: normal; font-size: 8pt; width: calc(100% - 20px); min-height: 38px; height: max-content; padding-left: 10px; padding-right: 10px; padding-top: 6px; padding-bottom: 5px; float: left; background-color: #064287; color: #FFF; text-align: center; letter-spacing: 1.5pt; text-transform: uppercase }
.Product_Details_Header { font-family: 'FONT_ARIAL_BOLD'; font-weight: normal; font-size: 9pt; width: max-content; height: 18px; margin-left: auto; margin-right: auto; }
.Product_Details_Quantity_Selector { font-family: 'FONT_ARIAL'; font-weight: normal; font-size: 9pt; width: max-content; margin-left: auto; margin-right: auto; }
.Product_Details_Text { font-family: 'FONT_ARIAL'; font-weight: normal; font-size: 8pt; width: max-content; margin-left: auto; margin-right: auto; }

/* Product Type Sprites and Positioning */
#Envelopes_Menu_Container { height: auto; width: 400px; margin-top: 20px; margin-right: auto; margin-left: auto; overflow: hidden; }
.Envelope { width: 400px; height: 175px; float: left; background-image: url(../images/envelopes.png); background-repeat: no-repeat; }
#Envelope_1 { background-position: 0px -1047px; }
#Envelope_2 { background-position: 0px 0px; }
#Envelope_3 { background-position: 0px -174px; height: 174px; }
#Envelope_4 { background-position: 0px -348px; }
#Envelope_5 { background-position: 0px -522px; }
#Envelope_6 { background-position: 0px -697px; }
#Envelope_7 { background-position: 0px -872px; }
#Envelope_8 { background-position: 0px -1222px; }
.Order_Envelope { width: 300px; height: 70px; float: left; font-family: 'FONT_ARIAL'; font-size: 12px; font-weight: normal; color: #064287; }
.Envelope_Description { font-family: 'FONT_ARIAL_BOLD'; font-size: 12px; font-weight: normal; color: #064287; text-align: center; width: 400px; }
.Order_Envelope select, .Order_Letterhead select, .Order_Note_Cards select, .Order_Guest_Passes select, .Order_Mailing_Labels select { font-family: 'FONT_ARIAL'; font-size: 12px; font-weight: normal; color: #064287; }
#Letterhead_Menu_Container, #Folder_Menu_Container, #Guest_Passes_Menu_Container, #Mailing_Labels_Menu_Container { height: auto; width: 100%; margin-top: 20px; margin-right: auto; margin-left: auto; overflow: hidden; }
#Letterhead_1, #Letterhead_4 { width: 325px; height: 421px; background-image: url(../images/letterheads.png); background-repeat: no-repeat; background-position: 0px 0px; margin-left: auto; margin-right: auto; }
#Letterhead_4 { background-position: -325px 0px; }
#Folder_1 { width: 300px; height: 263px; background-image: url(../images/folders.png); background-repeat: no-repeat; background-position: 0px 0px; margin-left: auto; margin-right: auto; }
.Order_Letterhead, .Order_Folder, .Order_Guest_Passes, .Order_Mailing_Labels { width: 325px; height: 50px; font-family: 'FONT_ARIAL'; font-size: 12px; font-weight: normal; color: #064287; text-align: center; margin-left: auto; margin-right: auto; padding-bottom: 30px; }
#Note_Card_Menu_Container_Menu_Container { height: auto; width: 100%; margin-top: 20px; margin-right: auto; margin-left: auto; overflow: hidden; }
.Order_Note_Card {  width: 325px; height: 50px; margin-top: 421px; float: left; font-family: 'FONT_ARIAL'; font-size: 12px; font-weight: normal; color: #064287; text-align: center; }
#Note_Card_1 { width: 300px; height: 432px; background-image: url(../images/notecards.png); background-repeat: no-repeat; background-position: 0px 0px; margin-left: auto; margin-right: auto; }
#Note_Card_Env_1 { width: 300px; height: 480px; background-image: url(../images/note_card_envelope.png); background-repeat: no-repeat; background-position: 0px 0px; margin-left: auto; margin-right: auto; }
.Guest_Pass { width: 300px; height: 392px; background-image: url(../images/guest_passes.png); background-repeat: no-repeat; background-position: 0px 0px; margin-left: auto; margin-right: auto; }
#Guest_Pass_1 { background-position: 0px 0px; }
#Guest_Pass_2 { background-position: -300px 0px; }
#Mailing_Label_1 { width: 300px; height: 250px; background-image: url(../images/mailing_labels.png); background-repeat: no-repeat; background-position: 0px 0px; margin-left: auto; margin-right: auto; }
.Select_Quantity { width: 325px; height: 50px; float: left; text-align: center; }
.Add_To_Cart { width: 100%; height: 50px; float: left; }
hr.product_divider { border: 0; height: 1px; background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0)); }

/* SHOPPING CART */
#Shopping_Cart { width: 80%; margin-top: 15px; margin-left: auto; margin-right: auto; }
#Shopping_Cart tr:nth-child(even) { background-color: #FFF; }
#Shopping_Cart tr:nth-child(odd) { background-color: #BAC9E3; }
#Shopping_Cart tr:last-child { background-color: transparent; }			/* Total and buttons */
.Shopping_Cart_Total { background-color: #FFF; }
.Cart_Header { font-family: 'FONT_ARIAL_BOLD'; font-size: 14px; font-weight: normal; color: #FFF; background-color: #064287; padding: 4px; }
.Cart_Cell, .Cart_Cell_Actions, .Cart_Total_Cell_Left { border-bottom-width: 1px; border-left-width: 1px; border-bottom-style: solid; border-left-style: solid; border-bottom-color: #064287; border-left-color: #064287; font-family: 'FONT_ARIAL'; font-size: 14px; font-weight: normal; color: #064287; padding: 4px; }
.Cart_Cell_Actions { border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: #064287; border-right-width: 1px; border-right-style: solid; border-right-color: #064287; }
.Cart_Total_Cell_Left { background-color: #FFF; }
.Cart_Total_Cell_Right { font-family: 'FONT_ARIAL_BOLD'; font-size: 14px; font-weight: normal; color: #064287; background-color: #FFF; width: 100px; border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: #064287; border-right-width: 1px; border-right-style: solid; border-right-color: #064287; padding-left: 2px; padding-right: 2px; }
#Continue_Shopping { font-family: 'FONT_ARIAL'; font-size: 14px; font-weight: normal; color: #064287; text-align: center; margin-top: 10px; }

.Empty_Cart_Container { width: max-content; height: max-content; margin-left: auto; margin-right: auto; margin-top: 20px; text-align: center; background-color: #FFF; padding: 20px; border-color: #064287; border-width: 1px; border-style: solid; -moz-border-radius: 8px; -webkit-border-radius: 8px; -khtml-border-radius: 8px; border-radius: 8px; behavior:url("border-radius.htc"); box-shadow: 2px 2px 7px #000; }
.Empty_Cart { font-family: 'FONT_ARIAL_BOLD'; font-size: 14pt; font-weight: normal; background-color: #FFF; color: #064287; text-align: center; }

#Checkout_Container { width: 600px; height: max-content; margin-top: 20px; margin-right: auto; margin-left: auto; padding-top: 10px; padding-bottom: 10px; background-color: #FFF; border-color: #064287; border-width: 1px; border-style: solid; margin-bottom: 30px; -moz-border-radius: 8px; -webkit-border-radius: 8px; -khtml-border-radius: 8px; border-radius: 8px; behavior:url("border-radius.htc"); box-shadow: 2px 10px 15px #000; }
#Order_Complete_Message { font-family: 'FONT_ARIAL_BOLD'; font-size: 14pt; font-weight: normal; color: #064287; text-align: center; margin-top: 10px; }
#Order_Complete_Order_Number { font-family: 'FONT_ARIAL_BOLD'; font-size: 16pt; font-weight: normal; color: #064287; margin-top: 25px; text-align: center; }
.Form_Field_Header { font-family: 'FONT_ARIAL_BOLD'; font-size: 12pt; font-weight: normal; color: #064287; }
.Form_Field_Text { font-family: 'FONT_ARIAL'; font-size: 12pt; font-weight: normal; color: #064287; border: 1px solid #064287; }
.Form_Field_Text_Error { font-family: 'FONT_ARIAL'; font-size: 12pt; font-weight: normal; color: #064287; background-color: #FCF; border: 1px solid #900; }
.Form_Field_Required { font-family: 'FONT_ARIAL'; font-size: 12pt; font-weight: normal; color: #064287; }
.Instructions { font-family: 'FONT_ARIAL'; font-size: 8pt; font-weight: normal; color: #064287; font-style: italic; }
#first, #last, #title, #department, #address, #city, #state, #email { width: 150px; }
#zipcode { width: 50px; }
#phone_ac, #phone_ex, #state { width: 31px; margin-right: 16px; }
#phone_nm { width: 40px; }

/* PDF Link Page */
#Past_Orders_Lookup tr:nth-child(even) { background: #CCC; }
#Past_Orders_Lookup tr:nth-child(odd) { background: #FFF; }
.Past_Orders_Lookup_Header { font-family: 'FONT_ARIAL_BOLD'; font-size: 14px; font-weight: normal; background-color: #0068B1; color: #FFF; }
.Past_Orders_Lookup_Cell { border-top-width: 1px; border-top-style: solid; border-top-color: #0068B1; }
