Tue, 2016-05-24 15:41
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0px; padding: 0px; border: 0px none; outline: 0px none; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; } :focus { outline: 0px none; } ol, ul { list-style: none outside none; } strong{font-weight:bold;} a { text-decoration: none;color:#D6CC99; } .clear{clear:both;} @font-face { font-family: 'MyriadPro'; src: url('myriadproregular.eot'); src: url('myriadproregular.eot?#iefix') format('embedded-opentype'), url('myriadproregular.woff') format('woff'), url('myriadproregular.ttf') format('truetype'), url('myriadproregular.svg#myriadproregular') format('svg'); font-weight: normal; font-style: normal; } body { line-height: 1; font-size: 0.875em; font-family: Arial; background: url('../img/bg.png') repeat #A3886D;color: #b0a886; min-width: 960px; } #header { width: 100%; padding: 0px 0 0 0; margin:0 auto;/*background: url('../img/ornament.png') no-repeat scroll center 30px transparent; */} .header_bg { display:none;position:absolute;top:20px;width: 100%; padding: 0; margin:0 auto;background: url('../img/menu_bg.png') repeat-x 0 0 #A34D12;height: 36px;z-index:-1; } .inner_header_bg { position:absolute;top:0px;width: 100%; padding: 0; margin:0 auto;background: url('../img/menu_bg.png') repeat-x 0 0 #A34D12;height: 36px;z-index:-1; } .header_container { margin:0 auto; width: 960px; padding: 0px 0px;position:relative; z-index:100; } #menu_box { width: 185px;height: 415px; padding:10px;position:absolute;left:0px;top:0px;background:rgba(0, 0, 0, 0.8); } #logo { display: block; width: 165px; height: 185px; padding:0px;margin: 0px auto; background: url('../img/logo.png') no-repeat scroll center center transparent; } #logo a { display: block; width: 165px; height: 185px; text-indent: -999999px!important; } #social {position:absolute;right:10px;top:6px; } #social a{float:left;margin-left:5px;} #social a:hover{margin-top:1px;} #topmenu {position:absolute;right:116px;top:11px; } #topmenu ul { } #topmenu ul li{float:left;display:inline-block;margin:0 5px 0px 0; } #topmenu ul li a{font-size: 14px; color: #A34D12; text-decoration: none;padding:5px 10px;background:rgba(0, 0, 0, 0.7); } #topmenu ul li a:hover{color: #807856; } #navi { float: left;z-index:10;position:relative; margin: 35px 0px 0px 0px; width: 100%;} #navi ul { float: left; } #navi ul li { float: left; } #navi ul li a { float: left; display: block; font-size: 14px; line-height: 24px; color: #fff;text-decoration: none; width:150px;margin: 0px 0px 0 10px;padding: 0px 0px 0 20px; height: 24px; cursor: pointer;background: url('../img/dot.png') no-repeat left center transparent; } #navi ul li a:hover, #navi ul li a.current { color:#D6CC99; } #navi ul li.last a{ margin-right:0px; } #navi ul li.divider { float: left; display: block; line-height: 36px; width:12px;background: url('../img/dot.png') no-repeat center center transparent; margin: 0px; height: 36px;text-indent: -999999px!important; } #footer_container { width: 100%; margin: 10px auto 0px auto;padding: 30px 0 30px 0;} .footer_top { margin:0 auto; width: 940px; padding: 20px 10px; /*background: url('../img/dots_vertical.png') repeat-x 0 5px #A34D12;*/background:rgba(0, 0, 0, 0.5); -webkit-box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.9); -moz-box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.9); box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.9); } .footer_top h4 { color: #fff; font-size:22px; font-family: 'MyriadPro';line-height:28px; margin-bottom:15px;text-shadow: 1px 1px 0px #000;} .footer_top p { color: #D6CC99; font-size:16px;line-height:18px;text-shadow: 1px 1px 0px #000;} .footer_top ul { } .footer_top ul li { color: #D6CC99; font-size:20px;margin-bottom:12px; font-family: 'MyriadPro';text-shadow: 1px 1px 0px #000;} .footer_top a.map{ display:block;background:rgba(0, 0, 0, 0.4);padding:10px;-webkit-box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.9);-moz-box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.9);box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.9); } .footer_top .shipping{ float:left;margin: 0px 15px 10px 0px; } .footer_top .footer_left { float:left;width:220px; margin-right:40px; } .footer_top .footer_middle { float:left;width:300px; margin-right:40px; } .footer_top .footer_right { float:left;width:340px; } .footer_copyright { margin:0 auto; width: 960px; padding: 20px 0 20px 0; } .footer_copyright p { float: left; width: 700px; color: #fff; } .footer_copyright a { color: #fff; text-decoration: none; } .footer_copyright a:hover { text-decoration: underline; } #wapp{position:relative;float:right;} #wapp a{ display: block; width: 75px;height: 20px;background:transparent url(../img/wapp.png) no-repeat center;text-indent: -999999px!important;} #content { width: 960px; margin:0px auto 0 auto; min-height: 500px; padding-top:35px; } #banner { float: left; width: 960px; height: 400px; overflow: hidden; position:relative; background:rgba(0, 0, 0, 0.4); -webkit-box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.9); -moz-box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.9); box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.9);} #banner .banner_container { width:940px; height: 380px; margin:10px; display: block; position: relative; overflow: hidden; } #banner .slides_container { width:940px; height: 380px; margin:0 auto; display: block; position: relative; overflow: hidden; } #banner .banner_item{ position: relative;} #banner .banner_item h3{ position: absolute; top:50px;right:50px;text-align:right;color:#fff;font-size:28px; text-shadow:1px 1px #000;font-family: 'MyriadPro';} #banner .prev { position: absolute; bottom: 170px; left: 210px; width: 37px; height: 37px; z-index: 101; cursor: pointer; display: block;opacity: 0.5; } #banner .next{ position: absolute; bottom: 170px; right: 20px; width: 37px; height: 37px; z-index: 101; cursor: pointer; display: block;opacity: 0.5; } #banner .next:hover, #banner .prev:hover { opacity: 1; } .barel { position: absolute; bottom:0px;right:0px;z-index:100;} #main_content { margin: 30px auto; width: 960px; padding: 0px; } #main_content.inner { padding: 30px 10px 10px 10px;width: 940px;background:rgba(0, 0, 0, 0.7); -webkit-box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.9); -moz-box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.9); box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.9); } .full_box { float: left; width: 940px; padding: 10px;margin:0 0 30px 0; background:rgba(0, 0, 0, 0.7); -webkit-box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.9); -moz-box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.9); box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.9); } .full_box_thumb{float:left;margin:0 15px 0px 0;-webkit-box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.9);-moz-box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.9);box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.9);} .full_box h2 { float:left;width: 630px; p font-family: 'MyriadPro';color: #A34D12;font-size:20px; margin:0px 0 10px 0;padding:6px 0px; border-bottom:1px solid #807856;background: url('../img/small_ornament.png') no-repeat scroll right -2px transparent;text-shadow: 1px 1px 0px #000;} .full_box h2 a { color: #A34D12; text-decoration: none; display: block;} .full_box h2 a span { color: #b0a886;} .full_box p { margin:0px 0 6px 0;line-height:18px;text-shadow: 1px 1px 0px #000;} .mini_box { float: left; width: 290px; padding: 10px;margin-right: 15px; background:rgba(0, 0, 0, 0.7); -webkit-box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.9); -moz-box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.9); box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.9); } .mini_box.last { margin-right: 0px;} .mini_box_image { display:block;-webkit-box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.9);-moz-box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.9);box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.9);} .mini_box h2 { font-family: 'MyriadPro';color: #A34D12;font-size:20px; margin:0px 0 10px 0;padding:6px 0px; border-bottom:1px solid #807856;background: url('../img/small_ornament.png') no-repeat scroll right -2px transparent;text-shadow: 1px 1px 0px #000;} .mini_box h2 a { color: #A34D12; text-decoration: none; display: block;} .mini_box h2 a span { color: #b0a886;} .mini_box p { color: #b0a886;line-height:18px; margin:10px 0 15px 0;text-shadow: 1px 1px 0px #000;} a.read_more { display: block;width:160px; font-size: 15px; color: #A34D12; text-decoration: none;text-align:center;padding:5px;float:right;background:rgba(0, 0, 0, 0.7); } a.read_more:hover {color: #807856; } .half_box{float:left;width: 452px; padding: 10px;margin: 30px 16px 0 0; background:rgba(0, 0, 0, 0.7); -webkit-box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.9); -moz-box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.9); box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.9);} .half_box.last{margin-right:0px;} .half_box h2 { font-family: 'MyriadPro';color: #A34D12;font-size:20px; margin:0px 0 10px 0;padding:6px 0px; border-bottom:1px solid #807856;text-shadow: 1px 1px 0px #000;} .half_box h2 a { color: #A34D12; text-decoration: none; display: block;} .half_box h2.spot { background: url('../img/spot.png') no-repeat scroll right -1px transparent;} .half_box h2.newsletter { background: url('../img/newsletter.png') no-repeat scroll right 0px transparent;} .half_box h2 a span, .half_box h2 span { color: #b0a886;} .half_box p { color: #b0a886;line-height:18px; margin:10px 0 15px 0;text-shadow: 1px 1px 0px #000;} .half_box object { float:left; margin:10px 20px 5px 0;} a.download { display: block;width:39px;height:40px; text-decoration: none;float:right;background: url('../img/download.png') no-repeat scroll center center transparent;text-indent: -999999px!important; } .inner h1{ font-family: 'MyriadPro';color: #fff;font-size:26px; margin:0px 0 10px 0;padding:6px 0px;border-bottom:1px solid #807856;background: url('../img/small_ornament.png') no-repeat scroll right -2px transparent;} .inner h2{ font-family: 'MyriadPro';font-size:20px; margin:0px 0 10px 0;padding:0px 0px;text-shadow: 1px 1px 0px #000;} .inner p{ color: #b0a886;line-height:18px; margin:5px 0 10px 0;text-shadow: 1px 1px 0px #000;} .inner p.intro{line-height:22px;font-size:17px;} ul.list { margin:10px 10px; overflow:auto;} ul.list li { margin-bottom:12px;padding-left:20px;background: url('../img/dot.png') no-repeat left center transparent;text-shadow: 1px 1px 0px #000;} #gallery_content { width:960px;margin-top: 10px;float: left; } .thumb {float:left;margin:0 0 20px 0;-webkit-box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.9);-moz-box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.9);box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.9);} .thumb span{display:block;margin:0 0 0px 0;padding:5px;background:rgba(0, 0, 0, 0.7);font-size: 15px; color: #A34D12; text-decoration: none;text-align:center;} #video_content iframe {float:left;margin:0 12px 10px 0;} ul.contact_list {margin:0 10px 10px 10px;padding:0px;list-style: none outside none;} ul.contact_list li{margin:0 0 5px 0px;padding:0px 0 0 22px;color:#b0a886;line-height:20px;font-size:16px;text-shadow: 1px 1px 0px #000;} ul.contact_list li.address{background:transparent url(../img/address.png) no-repeat 0 2px;} ul.contact_list li.tel{background:transparent url(../img/tel.png) no-repeat 0 2px;} ul.contact_list li.mob{background:transparent url(../img/mob.png) no-repeat 0 2px;} ul.contact_list li.fax{background:transparent url(../img/fax.png) no-repeat 0 2px;} ul.contact_list li.email{background:transparent url(../img/email.png) no-repeat 0 2px;} .contact_left{margin:30px 0px 0px 0;padding: 30px 10px 10px 10px;width:600px;float:left;background:rgba(0, 0, 0, 0.7); -webkit-box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.9); -moz-box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.9); box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.9);} .contact_right{margin:30px 0px 0px 0;padding: 35px 10px 10px 10px;width:280px;float:right;background:rgba(0, 0, 0, 0.7); -webkit-box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.9); -moz-box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.9); box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.9);} .contact_map{margin:30px 0px 0px 0;padding: 20px 10px 10px 10px;width:280px;float:right;background:rgba(0, 0, 0, 0.7); -webkit-box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.9); -moz-box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.9); box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.9);} .contact_right h2, .contact_map h2{ font-family: 'MyriadPro';color: #fff;font-size:22px; margin:0px 0 10px 0;padding:6px 0px;border-bottom:1px solid #807856;background: url('../img/small_ornament.png') no-repeat scroll right -2px transparent;} .contact_element{margin:0 10px 15px 0;width:290px;float:left;} #contactForm { margin:20px 0 85px 0;padding:0px;display:block;} #contactForm label { font-size: 17px; margin:0px 0 6px 0;padding:0px;display:block;color: #D6CC99;font-family:'MyriadPro';} #contactForm input, #contactForm textarea{ padding:10px; font-family: Arial; font-size: 15px; color: #fff;border: none; background:rgba(0, 0, 0, 0.7);margin-bottom:8px;} #contactForm input{ width:255px; } #contactForm input#security_code{ width:141px; } #contactForm textarea{ width:555px; } #contactForm input:hover, #contactForm input:focus, #contactForm textarea:hover, #contactForm textarea:focus{ border-color: #fff; } #contactForm .submit_button { float: left; display: block; padding: 0px 0px 0px 0px; margin-left: 160px; margin-top: 20px;} #contactForm .submit_button input { float: left; width: 250px; height: 40px; padding:0; background:rgba(0, 0, 0, 0.7); border:none;cursor:pointer; font-size: 20px; font-weight: normal; color: #A34D12; text-decoration: none;font-family:'MyriadPro';} #contactForm .submit_button input:hover { color: #807856; } .error { color:#f90408!important; font-size:12px!important; width:100%; clear:both; } .error_message { background:rgba(0, 0, 0, 0.7); padding:10px; color: #807856; font-size:14px; width:580px; clear:both; } .error_message p { color: #A34D12; } .left_thumb{float:left;margin:0 15px 10px 0;-webkit-box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.9);-moz-box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.9);box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.9);} .right_thumb{float:right;margin:0 0px 10px 15px;-webkit-box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.9);-moz-box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.9);box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.9);} .dimensions_box{float:left;margin:10px 11px 10px 11px;width:215px;} .dimensions_box.last{margin-right:0px;} .dimensions{display:block;margin:0 0px 0px 0px;padding:8px 8px;clear:both;float:left;border-bottom:1px solid #B0A886;} .dimensions span{float:left;width:50px;font-size:15px;font-weight:bold;} .dimensions small{float:left;width:100px;font-size:15px;} @media only screen and (min-width:1600px) and (max-width:2000px) { } @media only screen and (min-width:768px) and (max-width:1118px) { } @media only screen and (min-width:300px) and (max-width:810px){ body { font-size:90%;} } @media only screen and (min-width:200px) and (max-width:560px){ body { font-size:90%;} }
//mod edit: code tags added. ~gt
PLEASE HELP ME HAVE SO MANY DAYS TRYING TO SEE WHAT TO FILL IN MEDIA QUERIES TO DO THE SITE RESPONSIVE. IF HTML ALSO NEEDED I CAN EMBED HTML
//mod note: Please avoid using all caps, as it is like shouting. Used mixed case for ease of readability. ~gt
