/* ** MZBOXES.CSS classes for boxes with borders and shadows/ */ /*--------------------------------------------------------------*/ /* General purpose background colours */ /*--------------------------------------------------------------*/ .bk-antiquewhite { background-color:antiquewhite; } .bk-blue0 { background-color:#d0f0ff; } .bk-blue1 { background-color:#e0f0ff; } .bk-blue2 { background-color:#a8d8ff; } .bk-blue3 { background-color:#90d8f8; } .bk-cream1 { background-color:#ffedbd; } .bk-pink0 { background-color:#ffe0e0; } .bk-pink1 { background-color:#ff8080; } .bk-green0 { background-color:#d8ffd8; } .bk-green2 { background-color:#a8ffa8; } .bk-orange0 { background-color:#ffc887; } .bk-purple0 { background-color:#e8c8ff; } .bk-purple2 { background-color:#dbb0ff; } .bk-white { background-color:#ffffff; } .bk-yellow { background-color:#fbf2bf; } .bk-yellow-dark { background-color:#f6eaaa; } .bk-grey0 { background-color:#d8d8d8; } .bk-grey1 { background-color:#f0f0f0; } /* ** ----------------------------------------- ** box... classes contain borders and shadow ** ----------------------------------------- */ .box002 { /* border: 2px #dddddd solid; */ } .box03s { box-shadow: 3px 3px 3px #c0c0c0; } .box4b { border: 1px gray solid; box-shadow: 3px 3px 3px #c0c0c0; } .box9b { border: 1px gray solid; box-shadow: 3px 3px 3px #c0c0c0; } .box11b { border: 1px gray solid; box-shadow: 3px 3px 3px #c0c0c0; } div.panelsq { border: 2px #dddddd solid; margin-top: 6px; } div.panelsq h2 { text-align:center; } /* ** ------------------------------------------------- ** table cell borders ** ------------------------------------------------- */ td.bordered { border: 1px solid #c0c0c0 } td.border_l { border-left: 1px solid #c0c0c0 } td.border_r { border-right: 1px solid #c0c0c0 } td.border_t { border-top: 1px solid #c0c0c0 } td.border_b { border-bottom:1px solid #c0c0c0 } td.border_tl { border-top: 1px solid #c0c0c0; border-left: 1px solid #c0c0c0 } td.border_tr { border-top: 1px solid #c0c0c0; border-right:1px solid #c0c0c0 } td.border_bl { border-bottom:1px solid #c0c0c0; border-left: 1px solid #c0c0c0 } td.border_br { border-bottom:1px solid #c0c0c0; border-right:1px solid #c0c0c0 } td.border_tlr { border-top: 1px solid #c0c0c0; border-left: 1px solid #c0c0c0; border-right:1px solid #c0c0c0 } td.border_blr { border-bottom:1px solid #c0c0c0; border-left: 1px solid #c0c0c0; border-right:1px solid #c0c0c0 } /*==================================================================================*/ /* Margin classes */ /*==================================================================================*/ .margin95c { width:95%; margin-left:auto; margin-right:auto; } /* ** ------------------------------------------------- ** pad... classes contain padding ** ------------------------------------------------- */ .pad05 { padding: 5px; } .pad10 { padding: 10px; } .pad20 { padding: 20px; } .pad25 { padding: 25px; } .pad-lr00 { padding-left: 0px; padding-right: 0px; } .pad-lr05 { padding-left: 5px; padding-right: 5px; } .pad-lr10 { padding-left: 10px; padding-right: 10px; } .pad-lr20 { padding-left: 20px; padding-right: 20px; } .pad-lr25 { padding-left: 25px; padding-right: 25px; } .pad-lr30 { padding-left: 30px; padding-right: 30px; } .pad-lr40 { padding-left: 40px; padding-right: 40px; } .padlr30 { padding-left:30px; padding-right:70px; } .pad-tb10 { padding-top:10px; padding-bottom:10px; } /*==================================================================================*/ /* Generic defaults */ /*==================================================================================*/ .margin95c { width:95%; margin-left:auto; margin-right:auto; } /* ** ------------------------------------------------- ** textbox... classes contain float, margin, padding ** % widths ** ------------------------------------------------- */ .textbox-right { float:right; margin-left:20px; padding:10px; } .textbox-40 { width:40%; margin-left:auto; margin-right:auto; } .textbox-60 { width:60%; margin-left:auto; margin-right:auto; } .textbox-80 { width:80%; margin-left:auto; margin-right:auto; } .textbox-90 { width:90%; margin-left:auto; margin-right:auto; } .textbox-95 { width:95%; margin-left:auto; margin-right:auto; } /* ** --------------------------------------------------- ** frame... classes contain border, padding and shadow ** --------------------------------------------------- */ .frm-4p-3s { border: 1px #a0a0a0 solid; padding: 4px; box-shadow: 3px 3px 3px #c0c0c0; } /* -------------------------------------------- */ /* Colours for panels: text and background */ /* -------------------------------------------- */ div.bk-cream1 a.btnbuy { display:block; width:42px; height:20px; color:#ffffff; text-align:center; text-decoration:none; } div.bk-cream1 a.btnbuy:link { background-image:url(../image10/btnmaroon42x20.gif); color:#ffffff; font-weight:bold; text-decoration:none; } div.bk-cream1 a.btnbuy:visited { background-image:url(../image10/btnmaroon42x20.gif); color:#ffffff; font-weight:bold; text-decoration:none; } div.bk-cream1 a.btnbuy:active { background-image:url(../image10/btnmaroon42x20.gif); color:#ffffff; font-weight:bold; text-decoration:none; } div.bk-cream1 a.btnbuy:hover { background-image:url(../image10/btnmaroon42x20.gif); color:#ffff00; font-weight:bold; text-decoration:none; } div.bk-cream1 a.btn100 { display:block; width:100px; height:20px; padding:0px; color:#ffffff; text-align:center; line-height:20px; vertical-align:middle; text-decoration:none; } div.bk-cream1 a.btn100:link { background-image:url(../image10/btnmaroon100x20.gif); color:#ffffff; font-weight:bold; text-decoration:none; } div.bk-cream1 a.btn100:visited { background-image:url(../image10/btnmaroon100x20.gif); color:#ffffff; font-weight:bold; text-decoration:none; } div.bk-cream1 a.btn100:active { background-image:url(../image10/btnmaroon100x20.gif); color:#ffffff; font-weight:bold; text-decoration:none; } div.bk-cream1 a.btn100:hover { background-image:url(../image10/btnmaroon100x20.gif); color:#ffff00; font-weight:bold; text-decoration:none; } div.bk-cream1 td.pricetable { border-bottom:1px solid #b98585; } div.bk-cream1 span.tx-product { color: maroon; } div.bk-cream1 p.tx-price { color: #333333; } div.bk-cream1 span.tx-product1 { color: maroon; } div.bk-cream1 span.tx-product2 { color: #622c2c; } div.bk-blue1 h2 { color: #00008b; } /* tx-blue */ div.bk-blue1 span.tx-product { color: #00008b; } /* tx-blue */ div.bk-blue1 p.tx-price { color: #0063ef; } /* tx-logoblue */ div.bk-blue1 span.tx-product1 { color: #00008b; } /* tx-blue */ div.bk-blue1 span.tx-product2 { color: #0063ef; } /* cf tx-price */ /* cf a.btnblue42x20: */ div.bk-blue1 a.btnbuy { display:block; width:42px; height:20px; color:#ffffff; text-align:center; } div.bk-blue1 a.btnbuy:link { background-image:url(../image10/btnblue42x20.gif); color:#ffffff; font-weight:bold; text-decoration:none; } div.bk-blue1 a.btnbuy:visited { background-image:url(../image10/btnblue42x20.gif); color:#ffffff; font-weight:bold; text-decoration:none; } div.bk-blue1 a.btnbuy:active { background-image:url(../image10/btnblue42x20.gif); color:#ffffff; font-weight:bold; text-decoration:none; } div.bk-blue1 a.btnbuy:hover { background-image:url(../image10/btnblue42x20.gif); color:#000000; font-weight:bold; text-decoration:none; } div.bk-blue1 td.pricetable { border-bottom:1px solid #90d8f8; } /* blue3 */ div.bk-green0 h2 { color: #008b00; } /* tx-green */ div.bk-green0 span.tx-product { color: #008b00; } /* tx-green */ div.bk-green0 p.tx-price { color: #0ad21d; } /* tx-green2 */ div.bk-green0 a.btnbuy { display:block; width:42px; height:20px; color:#ffffff; text-align:center; } div.bk-green0 a.btnbuy:link { background-image:url(../image10/btngreen42x20.gif); color:#ffffff; font-weight:bold; text-decoration:none; } div.bk-green0 a.btnbuy:visited { background-image:url(../image10/btngreen42x20.gif); color:#ffffff; font-weight:bold; text-decoration:none; } div.bk-green0 a.btnbuy:active { background-image:url(../image10/btngreen42x20.gif); color:#ffffff; font-weight:bold; text-decoration:none; } div.bk-green0 a.btnbuy:hover { background-image:url(../image10/btngreen42x20.gif); color:#000000; font-weight:bold; text-decoration:none; } div.bk-green0 td.pricetable { border-bottom:1px solid #90ff90; } /* tx-green3 */ /* ** --------------------------------------------------- ** backgrounds: ** --------------------------------------------------- */ .grad_lr_blue { /* background: -webkit-linear-gradient(left, #a9d9ff , #ceefff ); */ /* For Safari 5.1 to 6.0 */ /* background: -o-linear-gradient( right, #a9d9ff , #ceefff );*/ /* For Opera 11.1 to 12.0 */ /* background: -moz-linear-gradient( right, #a9d9ff , #ceefff );*/ /* For Firefox 3.6 to 15 */ background: linear-gradient( to right, #a9d9ff , #ceefff ); /* Standard syntax */ } .grad_lr_yellow { /* background: -webkit-linear-gradient(left, #f3e8b5 , #fff9dc ); */ /* For Safari 5.1 to 6.0 */ /* background: -o-linear-gradient( right, #f3e8b5 , #fff9dc );*/ /* For Opera 11.1 to 12.0 */ /* background: -moz-linear-gradient( right, #f3e8b5 , #fff9dc );*/ /* For Firefox 3.6 to 15 */ background: linear-gradient( to right, #f3e8b5 , #fff9dc ); /* Standard syntax */ } div.bk-blue-grad1 { /* background: -webkit-linear-gradient(left, #a8d8ff, #d0f0ff ); */ /* Safari 5.1-6.0 */ /* background: -o-linear-gradient( right, #a8d8ff, #d0f0ff ); */ /* Opera 11.1-12.0 */ /* background: -moz-linear-gradient( right, #a8d8ff, #d0f0ff ); */ /* Firefox 3.6-15 */ background: linear-gradient( to right, #a8d8ff, #d0f0ff ); /* Std (LAST) */ } div.bk-cream-grad1 { /* background: -webkit-linear-gradient(left, #ffeea9, #ffefd0 ); */ /* Safari 5.1-6.0 */ /* background: -o-linear-gradient( right, #ffeea9, #ffefd0 ); */ /* Opera 11.1-12.0 */ /* background: -moz-linear-gradient( right, #ffeea9, #ffefd0 ); */ /* Firefox 3.6-15 */ background: linear-gradient( to right, #ffeea9, #ffefd0 ); /* Std (LAST) */ } .bk-grad-yellow0 { /* background-image:url(../image10/bk-yellow0-grad.png); background-repeat:repeat-y; background-color:#fff7ce; */ /* background: -webkit-linear-gradient(left, #F3E8B5, #FFF9DD); */ /* For Safari 5.1 to 6.0 */ /* background: -o-linear-gradient( right, #F3E8B5, #FFF9DD); */ /* For Opera 11.1 to 12.0 */ /* background: -moz-linear-gradient(right, #F3E8B5, #FFF9DD); */ /* For Firefox 3.6 to 15 */ background: linear-gradient(to right, #F3E8B5, #FFF9DD); /* Standard syntax */ } .bk-blue-2-0-n { background-image:url(../image10/bk-blue-2-0-n.png); background-repeat:repeat-y; background-color:#d0f0ff; /* bk-blue0 */ } /* ** ------------------------------------------------- ** Responsiveness ** ------------------------------------------------- */ @media all and (max-width: 699px) { .textbox-40 { width:60%; } .textbox-60 { width:80%; } .textbox-80 { width:95%; } .textbox-90 { width:95%; } } /* ** ------------------------------------------------- ** ------------------------------------------------- */