/* * * modeRGB APR2014 * JOstrander * */ /* * * Admin * (WYSIWYG Content) * */ h1 { color: #8b8b8b; font-weight: bold; font-size: 36px; line-height: normal; font-family: Arial, Helvetica, sans-serif; } h2 { color: #0f4a82; font-weight: bold; font-style: italic; font-size: 36px; line-height: normal; font-family: Arial, Helvetica, sans-serif; } h3 { color: #0f4a82; font-weight: bold; font-style: italic; font-size: 25px; line-height: normal; font-family: Arial, Helvetica, sans-serif; text-align: center; } h4 { color: #0f4a82; font-weight: normal; font-style: none; font-size: 18px; line-height: normal; font-family: Arial, Helvetica, sans-serif; text-align: left; } S /* * * Link Styles * */ a { color: #000000; text-decoration: none;} a:hover { color: #0f4a82; text-decoration: underline; padding-left: 0px;} a.arrow{ text-decoration: underline; padding-left: 15px; font-weight: normal;} a.arrow:hover{ text-decoration: underline;} #arrowhead { width: 540px; height: 8px; background: url('../../images/structure/bullet-arrow-blu.jpg') top left no-repeat; margin: 0 0 0 -36px;} /* * * List Styles * */ ul li{ list-style-image: url('../../images/structure/bullet-arrow-gry.jpg'); margin-bottom: 0px;} p{ margin: 0; padding: 0 0 15px 0;} p img{padding: 5px;} #list { clear: left; float: left; padding: 15px 20px; width: 500px; } #list ul li { background: url('../../images/structure/bullet-arrow-blu.jpg') no-repeat scroll 0 10px transparent; list-style: none outside none; padding-left: 10px; padding-top: 5px; } /* * * Main Navigation * */ #mainNav { height: 31px; width: 1023px; float: right; margin: 140px 0px 0 0px; position: relative;} #mainNav ul{ margin-top: 140px; padding: 0; list-style: none; display: inline; overflow: hidden;} #mainNav ul li { margin:0; padding:0; list-style: none; display: inline;} #mainNav a { float: left; padding: 140px 0 0 0; overflow: hidden; height: 0px; color: #ffffff;} #mainNav a:hover { background-position: 0 -31px;} #mainNav .selected { background-position: 0 -31px;} #aboutus a { width: 96px; background: url('../../images/nav/nav-aboutus.jpg') top left no-repeat; position: relative;} #dentworks a { width: 110px; background: url('../../images/nav/nav-dentworks.jpg') top left no-repeat; position: relative;} #gothail a { width: 90px; background: url('../../images/nav/nav-gothail.jpg') top left no-repeat; position: relative;} #interiorworks a { width: 128px; background: url('../../images/nav/nav-interiorworks.jpg') top left no-repeat; position: relative;} #wheelworks a { width: 119px; background: url('../../images/nav/nav-wheelworks.jpg') top left no-repeat; position: relative;} #triaddetailing a { width: 131px; background: url('../../images/nav/nav-triaddetailing.jpg') top left no-repeat; position: relative;} #testimonials a { width: 113px; background: url('../../images/nav/nav-testimonials.jpg') top left no-repeat; position: relative;} #meetthestaff a { width: 128px; background: url('../../images/nav/nav-meetthestaff.jpg') top left no-repeat; position: relative;} #contactus a { width: 108px; background: url('../../images/nav/nav-contactus.jpg') top left no-repeat; position: relative;} /* * * Layout / Formatting * */ #mainwrapper { width: 100%; background: url('../../images/structure/bg-main.jpg') top left no-repeat; #ffffff; } #wrapper { width: 1077px; margin: 0 auto; position: relative;} #hd { width: 1023px; height: 161px; position: relative; padding-left: 28px; margin-top: 0px; } #hd #logo { background: url('../../images/structure/logo-main.jpg') top left no-repeat; width: 469px; height: 77px; position: absolute; top: 30px; left: 28px;} #hd #logo a { text-indent: -9999em; height: 469px; height: 77px; display: block;} body { width: 100%; background: url('../../images/structure/bg-main.jpg') repeat-x; color: #0f4a82; font-size: 14px; font-family: Arial, Helvetica, sans-serif; line-height: 18px;} #tagline { background: url('../../images/structure/hdr-tagline.jpg') no-repeat left top; width: 464px; height: 60px; position: absolute; top: 50px; right: 100px; display: block;} #social-media { position: absolute; width: 100px; margin: 35px 50px 5px 200px; } .Twitter { relative; width: 28px; height: 27px; float: left; margin-top: 0px; padding-left: 760px; } .Facebook { relative; width: 28px; height: 27px; float: left; margin-top: 10px; padding-left: 760px; } #container{ width: 1077px; padding-bottom: 0; background: url('../../images/structure/page-gradient.jpg') top left no-repeat; position: relative; } #flashPanel { position: relative; width: 580px; height: 268px; top: 20px; left: 0px; float: left; padding: 10px 0 0 0; } .flash { position: relative; width: 580px; height: 268x; top: 0px; float: left; margin-top: -569px; margin-left: 364px; } #banner { width: 938px; height: 371px; margin-top: 0px; background: url( url('../../../MoDE%20RGB%202019/images/main%20image.png)') top left no-repeat; float: left; position: relative; } #gallery { position: relative; width: 1023px; height: 415px; top: -410px; float: left; margin-top: 0px; margin-left: 28px; } #btn-photogallery { width: 192px; height: 25px; background: url('../../images/photo-gallery/btn-photogallery.jpg') top left no-repeat; position: absolute; margin-left: 700px; margin-top: -32px; } #btn-backtopage { width: 188px; height: 26px; background: url('../../images/photo-gallery/btn-backtopage.jpg') top left no-repeat; position: absolute; margin-left: 700px; margin-top: -32px; } #dw-01a { width: 749px; height: 337px; background: url('../../images/photo-gallery/dw_before-after-01a.jpg') top left no-repeat; position: relative; margin-left: 80px; padding-top: 20px; } #dw-01b { width: 749px; height: 337px; background: url('../../images/photo-gallery/dw_before-after-01b.jpg') top left no-repeat; position: relative; margin-left: 80px; padding-top: 20px; } #dw-02a { width: 749px; height: 337px; background: url('../../images/photo-gallery/dw_before-after-02a.jpg') top left no-repeat; position: relative; margin-left: 80px; padding-top: 20px; } #dw-02b { width: 749px; height: 337px; background: url('../../images/photo-gallery/dw_before-after-02b.jpg') top left no-repeat; position: relative; margin-left: 80px; padding-top: 20px; } #dw-03a { width: 749px; height: 337px; background: url('../../images/photo-gallery/dw_before-after-03a.jpg') top left no-repeat; position: relative; margin-left: 80px; padding-top: 20px; } #dw-03b { width: 749px; height: 337px; background: url('../../images/photo-gallery/dw_before-after-03b.jpg') top left no-repeat; position: relative; margin-left: 80px; padding-top: 20px; } #dw-04a { width: 749px; height: 337px; background: url('../../images/photo-gallery/dw_before-after-04a.jpg') top left no-repeat; position: relative; margin-left: 80px; padding-top: 20px; } #dw-04b { width: 749px; height: 337px; background: url('../../images/photo-gallery/dw_before-after-04b.jpg') top left no-repeat; position: relative; margin-left: 80px; padding-top: 20px; } #dw-05a { width: 749px; height: 337px; background: url('../../images/photo-gallery/dw_before-after-05a.jpg') top left no-repeat; position: relative; margin-left: 80px; padding-top: 20px; } #dw-05b { width: 749px; height: 337px; background: url('../../images/photo-gallery/dw_before-after-05b.jpg') top left no-repeat; position: relative; margin-left: 80px; padding-top: 20px; } #iw-01a { width: 749px; height: 337px; background: url('../../images/photo-gallery/iw_before-after-01a.jpg') top left no-repeat; position: relative; margin-left: 80px; padding-top: 20px; } #iw-01b { width: 749px; height: 337px; background: url('../../images/photo-gallery/iw_before-after-01b.jpg') top left no-repeat; position: relative; margin-left: 80px; padding-top: 20px; } #choose { width: 882px; height: 42px; background: url('../../images/choose.jpg') top left no-repeat; position: relative; margin-left: 0px; padding: 10px 0 30px 0px; } #restoration { width: 836px; height: 117px; background: url('../../images/restoration.jpg') top left no-repeat; position: relative; margin-left: 0px; padding: 10px 0 30px 0px; } #interior { width: 891px; height: 157px; background: url('../../images/interior.jpg') top left no-repeat; position: relative; margin-left: 0px; padding: 10px 0 30px 0px; } #exterior { width: 926px; height: 89px; background: url('../../images/exterior.jpg') top left no-repeat; position: relative; margin-left: 0px; padding: 10px 0 30px 0px; } #other { width: 724px; height: 66px; background: url('../../images/other.jpg') top left no-repeat; position: relative; margin-left: 0px; padding: 10px 0 30px 0px; } #slider { width: 999px; overflow: hidden; height: 373px; position: relative; margin: 0px 0 0 20px;} .container { height: 373px; overflow: hidden; cursor: pointer; } ul.slides { display: block; list-style: none; padding: 0; margin: 0; position: relative; width: 999px; height: 373px;} ul.slides li { display: none; padding: 0; margin: 0; position: absolute; left: 0; top: 0; overflow: hidden; width: 999px; height: 373px;} ul.slides li .thumbholder { height: 373px; width: 999px; float: left; position: relative;} ul.slides li .txtholder { width: 373px; float: right; padding-right: 20px;} #slider .pagination { display: block; list-style: none; position: absolute; right: 20px; top: 10px; z-index: 999; width: 373px; text-align: center;} ul.pagination li { display: inline;} ul.pagination li a { display: block; float: left; width: 18px; height: 18px; margin: 3px; background: url('../..images/gallery/slidernav.png') no-repeat; text-indent: -9000px;} ul.pagination li.active a { background: url('../..images/gallery/slidernav-active.png') no-repeat!important; text-indent: -9000px;} #slider .container h2 { display: block; font: normal 30px Georgia, "Times New Roman", Times, serif; color: green; padding-top: 30px; margin-bottom: 15px;} #slider .container p { display: block; font: normal 16px Georgia, "Times New Roman", Times, serif; color: #6e595a; line-height: 22px;} #contact { width: 740px; float: left; margin-left: 160px; position: absolute; margin-top: 370px; } #contact .Cbg { top left no-repeat; width: 780px; height: 379px; margin-top: -370px; } #contact .Ctitle { position: relative; font-weight: bold; font-size: 14px; color: #c00000; } #contact .Ccopy { font-family: Arial, Helvetica, sans-serif; color: #333333; text-align: left; font-size: 14px; font-weight: normal; text-decoration: none; } #contact .Ccopy a { position: relative; display:block; text-align: left; font-size:14px; text-decoration: none; color:#333333; } #contact .Ccopy a:hover, .Ccopy a.active { position: relative; color: #c00000; text-decoration: none; } .Ccol1 { position: relative; width: 300px; float: left; margin-left: 60px; margin-top: -360px; padding: 0px 0px 0px 0px; line-height: 24px; } .Ccol2 { position: relative; width: 350px; float: left; margin-left: 380px; margin-top: -360px; padding: 0px 0px 0px 0px; line-height: 18px; } main.css * { margin: 0; padding: 0; } #main ul.gallery ul { list-style-type:none; margin:10px 0; overflow:hidden; padding-bottom:15px; border-bottom:1px dotted #016239; _border:none; } #main ul.gallery li { float:left; margin:0 5px 5px 0; } #main ul.gallery li img { border: 3px double #879270; height: 80px; width: 80px; } .bodyfull { width: 900px; padding: 0 20px 0px 30px; float: left; margin: 30px 0 0 60px; position: relative; } .bodyindent { margin-left: 50px; position: relative;} #bodyleft { width: 390px; padding: 0 0px 60px 0px; float: left; margin: 0px 0 0 0px; position: absolute; color: #0f4a82; font-weight: normal; font-style: none; font-size: 18px; line-height: normal; font-family: Arial, Helvetica, sans-serif; text-align: left; } #bodyright { width: 390px; padding: 0 0px 60px 540px; float: left; margin: 0px 0 0 0px; position: relative; color: #0f4a82; font-weight: normal; font-style: none; font-size: 18px; line-height: normal; font-family: Arial, Helvetica, sans-serif; text-align: left; } #bodyrightContact { width: 390px; padding: 0 0px 60px 440px; float: left; margin: 0px 0 0 0px; position: relative; color: #0f4a82; font-weight: normal; font-style: none; font-size: 18px; line-height: normal; font-family: Arial, Helvetica, sans-serif; text-align: left; } #biopics { width: 325px; height: 326px; padding: 0px 0px 0px 0px; float: left; position: relative; } .bodyleftContact { width: 350px; height: 900px; margin: 30px 0 0 25px; background: url('../../images/structure/columnfade2.jpg') top left repeat-x; float: left; position: relative;} #formfield { width: 350px; height: auto; margin: 0px 0px 0px 0px; padding-top: 20px; background-image: url('../../images/structure/columnfade2.jpg') top left no-repeat; float: left; } .bodyrightContact { width: 440px; height: 345px; margin: 10px 0 0 30px; } .bodyrightContact a { color: #016239; text-decoration: none;} .ctas{ margin: 10px 0 0 40px;} #content { width: 1077px; float: left; padding-bottom: 20px; background: url('../../images/structure/page-gradient.jpg') top left no-repeat; } .contentContact { width: 960px; height: 850px; float: left; padding-bottom: 60px; } #google-maps { width: 502px; height: 205px; margin: 0 0 0 0px; padding: 0px 0 0px 0; position: relative; } .content.internal { margin-top: 0px; padding-top: 0px;} .colA { width: 530px; margin: auto; position: relative; padding: 0 50px 0 0;} .colB { width: 530px; padding: 0 50px 0 0;} .colC { width: 530px; padding: 0 50px 0 0;} #sidebar { position: relative; margin: -10px 0 0 730px; background: url('../../images/structure/bg-panel.png') no-repeat left top; width: 210px; height: 459px; display: block; } #sidebar a { color: #ffffff; text-decoration: none; margin: 0px 0px 0px 0px; } #sidebar a:hover { color: #ffffff; text-decoration: underline; padding-left: 0px;} #sidebar a.arrow{ text-decoration: underline; padding-left: 0px; font-weight: normal;} #sidebara.arrow:hover{ text-decoration: underline;} /* * * Sub / Pages * */ #subLeftContact { width: 350px; height: 800px; background: url('../../images/structure/columnfade2.jpg') top left repeat-x; float: left; margin: -20px 0 0 16px; } #subLeftContact .image { width: 350px; float: left; margin-top: -10px;} #subLeft { width: 350px; height: 600px; background: url('../../images/structure/columnfade.jpg') top left repeat-x; float: left; margin: -10px 0 0 16px; } #subLeft .image { width: 350px; float: left; margin-top: -10px;} #subLeft .subNav { width: 350px; height: auto; margin-top: 0px;} #subLeft .subNav ul { padding: 0 0; margin: 0 0; list-style: none; font-size: 16px; font-weight: bold; letter-spacing: 3px;} #subLeft .subNav ul li { display: inline; float:left; height: 36px; overflow: hidden; margin: 1px 0 0 0; padding: 0 0 0 0;} #subLeft .subNav ul li a { width: 350px; background: url('../../images/buttons/sub-nav.jpg') top left no-repeat; width: 354px; height: 36px; display: block; padding: 9px 0 0 25px; color: #016239;} #subLeft .subNav ul li a:hover { width: 350px; background: url('../../images/buttons/sub-nav.jpg') top left no-repeat; background-position: 0 -36px; color: #FFFFFF; text-decoration: none;} #subLeft .subNav ul li .selected { background-position: 0 -36px; color: #ffffff;} #subRight { width: 520px; float: left; margin: 50px 10px 10px 30px; } #subRight .copy { width: 520px; padding: 0 30px 0 40px; } #subRightContact { width: 500px; float: left; margin: -480px 10px 10px 390px; position: relative; } #subRightContact .copy { width: 500px; padding: 0 30px 0 40px; } #divider { width: 819px; height: 11px; background: url('../../images/structure/page-divider.jpg') top left no-repeat; position: relative; margin-left: 40px; padding: 10px 0 30px 0px; } #divider-contactus { width: 819px; height: 11px; background: url('../../images/structure/page-divider.jpg') top left no-repeat; position: relative; margin-left: 140px; padding: 10px 0 30px 0px; } #contactbox { width: 431px; height: 411px; background: url('../../images/structure/contactus-formbox.jpg') top left no-repeat; position: relative; margin-left: 400px; margin-top: -230px; padding: 7px 0 30px 0px; } #backtotop { font-size: 14px; text-align: center; margin-top: -100px; padding-right: 10px; padding-bottom: 50px; padding-top:0px; } #backtotop a { color: #0f4b82; text-decoration:none; } #backtotop a:hover { color: #8b8b8b; text-decoration: underline; } .arrowsUp { width: 91px; height: 18px; font-size: 14px; color: #0f4b82; text-decoration: none; } .arrowsRt { width: 91px; height: 18px; font-size: 14px; color: #0f4b82; text-decoration: none; padding-left: -10px; } /* * * Layout / Footer * */ #ft { width: 100%; color: #8b8b8b; height: 200px; margin: 0 auto; background: url('../../images/structure/bg-footer.jpg') top left repeat-x; font-size: 14px; line-height: normal; padding-left: 0px; } #ft #ftmain { width: 1023px; margin: 0 auto; background: #000000 url('../../images/structure/bg-footer.jpg') top left repeat-x; min-height: 100px; padding-left: 36px; } #ft ul li { list-style-image: url('../../images/structure/footer-arrow.jpg'); } #ft a { color: #ffffff; text-decoration: none; } #ft a:hover { color: #ffffff; text-decoration: underline; } #ft .sublogos { width: 100px; height: 46px; float: left; margin: 40px 10px 0 10px; } #ft .copyright { width: 226px; float: left; margin: 40px 0px 0px 63px;} #ft .ftcolumn { width: 170px; float: left; margin-top: 45px; padding-left: 36px; }