Permalink
Browse files

more design

  • Loading branch information...
1 parent 2a378c2 commit db90c86185b26f02875d3b75217fcd625449c03b Bob Hanson committed Jun 24, 2012
View
@@ -9,7 +9,7 @@
<?php require_once("layouts/headmeta.php"); ?>
</head>
-<body id="home">
+<body>
<section id="mast_header" class="full_section">
<?php require_once("layouts/header.php"); ?>
@@ -19,19 +19,19 @@
<img src="public/images/logo.png" alt="">
<header class="custom_bold">Some Option</header>
<p>Some text about the option that is pretty dang cool.</p>
- <a href="" title="">Some link to some option</a>
+ <a href="" title="" class="button black_button">View more</a>
</li>
<li>
<img src="public/images/logo.png" alt="">
<header class="custom_bold">Some Option</header>
<p>Some text about the option that is pretty dang cool.</p>
- <a href="" title="">Some link to some option</a>
+ <a href="" title="" class="button black_button">View more</a>
</li>
<li>
<img src="public/images/logo.png" alt="">
<header class="custom_bold">Some Option</header>
<p>Some text about the option that is pretty dang cool.</p>
- <a href="" title="">Some link to some option</a>
+ <a href="" title="" class="button black_button">View more</a>
</li>
<div class="clear"></div>
</ul>
@@ -44,7 +44,7 @@
<div class="clear"></div>
</section>
- <footer class="full_section">
+ <footer id="mast_footer" class="full_section">
<?php require_once("layouts/footer.php"); ?>
<div class="clear"></div>
</footer>
View
@@ -0,0 +1,42 @@
+<!DOCTYPE html>
+<!--[if lt IE 7 ]> <html lang="en" class="no-js ie6"> <![endif]-->
+<!--[if IE 7 ]> <html lang="en" class="no-js ie7"> <![endif]-->
+<!--[if IE 8 ]> <html lang="en" class="no-js ie8"> <![endif]-->
+<!--[if IE 9 ]> <html lang="en" class="no-js ie9"> <![endif]-->
+<!--[if (gt IE 9)|!(IE)]><!--> <html lang="en" class="no-js"> <!--<![endif]-->
+
+<head>
+ <?php require_once("layouts/headmeta.php"); ?>
+</head>
+
+<body class="internal">
+
+ <section id="mast_header" class="full_section">
+ <?php require_once("layouts/header.php"); ?>
+ <div class="clear"></div>
+ </section>
+
+ <section id="content" class="full_section">
+ <?php require_once("views/index.php"); ?>
+ <div class="clear"></div>
+ </section>
+
+ <footer id="mast_footer" class="full_section">
+ <?php require_once("layouts/footer.php"); ?>
+ <div class="clear"></div>
+ </footer>
+ <div class="clear"></div>
+
+
+
+
+ <?php require_once("layouts/scripts.php"); ?>
+
+ <script type="text/javascript" charset="utf-8">
+ $(document).ready(function() {
+
+ });
+ </script>
+</body>
+
+</html>
View
@@ -0,0 +1,14 @@
+<section id="footer" class="content">
+ <section class="column1">
+ <header class="custom_bold">Small Engine Specialties</header>
+ </section>
+ <section class="column1">
+ <header class="custom_bold">Hours of Operation</header>
+
+ </section>
+ <section class="column1">
+ <header class="custom_bold">Specialty Links</header>
+
+ </section>
+
+</section>
View
@@ -3,10 +3,10 @@
<nav id="main_nav" class="silver_gradient round shadow">
<ul>
<li>
- <a href="#" class="custom_bold">Link 1</a>
+ <a href="application.php" class="custom_bold">Link 1</a>
</li>
<li>
- <a href="#" class="custom_bold">Link 2</a>
+ <a href="internal.php" class="custom_bold">Link 2</a>
</li>
<li>
<a href="#" class="custom_bold">Link 3</a>
View
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
@@ -1,22 +1,25 @@
#mast_header {
background-color: #A80303;
}
+#header {
+ height: 130px;
+}
#banner {
- height: 395px;
+ height: 362px;
}
#logo {
position: relative;
float: left;
- width: 157px;
+ width: 560px;
height: 100px;
text-indent: -9999em;
- background: url(../images/logo.png) 0px 0px no-repeat;
+ background: url(../images/logo2.png) 0px 0px no-repeat;
}
#main_nav {
position: absolute;
width: 960px;
height:60px;
- bottom: -60px;
+ bottom: -30px;
left: 0px;
z-index: 1;
}
@@ -41,6 +44,10 @@
border-right: 1px solid rgba(0,0,0,0.2);
border-left: 1px solid rgba(255,255,255,0.6);
}
+#main_nav ul li a:hover {
+ background: #444;
+ color: #fff;
+}
#main_nav ul li a.first {
border-left: none;
}
@@ -62,7 +69,7 @@ ul #main_sections, #main_sections li {
float: left;
}
ul#main_sections {
- margin-top: 95px;
+ margin-top: 60px;
border-left: 1px solid #333;
border-right: 1px solid #fff;
border-left: 1px solid rgba(0,0,0,0.3);
@@ -94,13 +101,35 @@ ul#main_sections li img {
-webkit-box-shadow: 0px 0px 10px #000000;
box-shadow: 0px 0px 10px #000000;
}
-ul#main_sections li header, ul#main_sections li p, ul#main_sections li a {
+ul#main_sections li header, ul#main_sections li p {
color: #fff;
}
+ul#main_sections li a {
+ color: #fff;
+ text-shadow: 1px -1px 2px #000;
+ width: 130px;
+ left: 50%;
+ margin-left: -91px;
+ margin-top: 15px;
+}
+ul#main_sections li a:hover {
+ color: #444;
+}
ul#main_sections li p {
padding: 5px 50px;
}
-
-
-
+.internal #content {
+ padding-top: 25px;
+}
+#map iframe {
+ padding: 10px;
+ border: 1px solid #444;
+}
+.regular_content.content header {
+ font-size: 24px;
+ padding: 10px 0px;
+}
+.regular_content.content header.section_header {
+ border-bottom: 7px solid RGB(178, 77, 77);
+}
View
@@ -89,8 +89,31 @@ html,body{text-align:center;font-family:"Helvetica","Arial",sans-serif;font-weig
-webkit-box-shadow: 0px 0px 8px #000000;
box-shadow: 0px 0px 8px #000000;
}
+/*************************************************************************************************************************************/
+/*************************************************************************************************** LAYOUT **************************/
+.column2, .column1 {
+ position: relative;
+ float: left;
+ padding: 10px 10px 0px 0px
+}
+.column2 {
+ width: 630px;
+}
+.column1 {
+ width: 310px;
+}
/*************************************************************************************************************************************/
+/*************************************************************************************************** FOOTER **************************/
+#mast_footer {background: #444; color:#fff; text-shadow: 1px 1px 2px #000;}
+#footer {
+ padding: 20px 0px;
+ min-height: 300px;
+}
+#footer header {
+ font-size: 18px;
+}
+/*************************************************************************************************************************************/
/*************************************************************************************************** AJAX ****************************/
#ajax_status{position:absolute;top:5px;right:0px;width:134px;padding:10px;background:#fff;background:rgba(255,255,255,0.4);color:#000;display:none;}
#ajax_status img{position:absolute;top:2px;left:5px;}
@@ -156,10 +179,6 @@ p{margin:0px 0px 0px;line-height:18px;}
#player_wrap .close{background-image:url("/images/close.png");cursor:pointer;height:25px;position:absolute;right:-12px;top:-12px;width:25px;}
/*************************************************************************************************************************************/
-/*************************************************************************************************** FOOTER **************************/
-footer{height:62px;width:100%;}
-
-/*************************************************************************************************************************************/
/*************************************************************************************************** FORMS ***************************/
form{position:relative;margin:10px 0px;padding:5px;}
div.field{position:relative;margin:0px 10px 10px 0px;}
@@ -281,6 +300,68 @@ background:-o-linear-gradient(top,#ff7b0d 0%,#ffa84c 100%);/* Opera11.10+ */
background:-ms-linear-gradient(top,#ff7b0d 0%,#ffa84c 100%);/* IE10+ */
filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff7b0d',endColorstr='#ffa84c',GradientType=0 );/* IE6-9 */
background:linear-gradient(top,#ff7b0d 0%,#ffa84c 100%);/* W3C */}
+.silver_button {
+background: rgb(255,255,255); /* Old browsers */
+background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(229,229,229,1) 100%); /* FF3.6+ */
+background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,1)), color-stop(100%,rgba(229,229,229,1))); /* Chrome,Safari4+ */
+background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(229,229,229,1) 100%); /* Chrome10+,Safari5.1+ */
+background: -o-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(229,229,229,1) 100%); /* Opera 11.10+ */
+background: -ms-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(229,229,229,1) 100%); /* IE10+ */
+background: linear-gradient(top, rgba(255,255,255,1) 0%,rgba(229,229,229,1) 100%); /* W3C */
+filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e5e5e5',GradientType=0 ); /* IE6-9 */
+border:1px solid #444;text-shadow:1px 1px 0px #fff;}
+.silver_button:hover{
+background: rgb(125,126,125); /* Old browsers */
+background: -moz-linear-gradient(top, rgba(125,126,125,1) 0%, rgba(14,14,14,1) 100%); /* FF3.6+ */
+background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(125,126,125,1)), color-stop(100%,rgba(14,14,14,1))); /* Chrome,Safari4+ */
+background: -webkit-linear-gradient(top, rgba(125,126,125,1) 0%,rgba(14,14,14,1) 100%); /* Chrome10+,Safari5.1+ */
+background: -o-linear-gradient(top, rgba(125,126,125,1) 0%,rgba(14,14,14,1) 100%); /* Opera 11.10+ */
+background: -ms-linear-gradient(top, rgba(125,126,125,1) 0%,rgba(14,14,14,1) 100%); /* IE10+ */
+background: linear-gradient(top, rgba(125,126,125,1) 0%,rgba(14,14,14,1) 100%); /* W3C */
+filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7d7e7d', endColorstr='#0e0e0e',GradientType=0 ); /* IE6-9 */
+);}
+.silver_button.disabled,.silver_button.disabled:hover{
+background: rgb(125,126,125); /* Old browsers */
+background: -moz-linear-gradient(top, rgba(125,126,125,1) 0%, rgba(14,14,14,1) 100%); /* FF3.6+ */
+background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(125,126,125,1)), color-stop(100%,rgba(14,14,14,1))); /* Chrome,Safari4+ */
+background: -webkit-linear-gradient(top, rgba(125,126,125,1) 0%,rgba(14,14,14,1) 100%); /* Chrome10+,Safari5.1+ */
+background: -o-linear-gradient(top, rgba(125,126,125,1) 0%,rgba(14,14,14,1) 100%); /* Opera 11.10+ */
+background: -ms-linear-gradient(top, rgba(125,126,125,1) 0%,rgba(14,14,14,1) 100%); /* IE10+ */
+background: linear-gradient(top, rgba(125,126,125,1) 0%,rgba(14,14,14,1) 100%); /* W3C */
+filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7d7e7d', endColorstr='#0e0e0e',GradientType=0 ); /* IE6-9 */
+}
+.black_button {
+background: rgb(125,126,125); /* Old browsers */
+background: -moz-linear-gradient(top, rgba(125,126,125,1) 0%, rgba(14,14,14,1) 100%); /* FF3.6+ */
+background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(125,126,125,1)), color-stop(100%,rgba(14,14,14,1))); /* Chrome,Safari4+ */
+background: -webkit-linear-gradient(top, rgba(125,126,125,1) 0%,rgba(14,14,14,1) 100%); /* Chrome10+,Safari5.1+ */
+background: -o-linear-gradient(top, rgba(125,126,125,1) 0%,rgba(14,14,14,1) 100%); /* Opera 11.10+ */
+background: -ms-linear-gradient(top, rgba(125,126,125,1) 0%,rgba(14,14,14,1) 100%); /* IE10+ */
+background: linear-gradient(top, rgba(125,126,125,1) 0%,rgba(14,14,14,1) 100%); /* W3C */
+filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7d7e7d', endColorstr='#0e0e0e',GradientType=0 ); /* IE6-9 */
+border:1px solid #444;text-shadow:1px 1px 0px #fff;}
+.black_button:hover{
+background: rgb(255,255,255); /* Old browsers */
+background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(229,229,229,1) 100%); /* FF3.6+ */
+background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,1)), color-stop(100%,rgba(229,229,229,1))); /* Chrome,Safari4+ */
+background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(229,229,229,1) 100%); /* Chrome10+,Safari5.1+ */
+background: -o-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(229,229,229,1) 100%); /* Opera 11.10+ */
+background: -ms-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(229,229,229,1) 100%); /* IE10+ */
+background: linear-gradient(top, rgba(255,255,255,1) 0%,rgba(229,229,229,1) 100%); /* W3C */
+filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e5e5e5',GradientType=0 ); /* IE6-9 */
+);}
+.black_button.disabled,.black_button.disabled:hover{
+background: rgb(125,126,125); /* Old browsers */
+background: -moz-linear-gradient(top, rgba(125,126,125,1) 0%, rgba(14,14,14,1) 100%); /* FF3.6+ */
+background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(125,126,125,1)), color-stop(100%,rgba(14,14,14,1))); /* Chrome,Safari4+ */
+background: -webkit-linear-gradient(top, rgba(125,126,125,1) 0%,rgba(14,14,14,1) 100%); /* Chrome10+,Safari5.1+ */
+background: -o-linear-gradient(top, rgba(125,126,125,1) 0%,rgba(14,14,14,1) 100%); /* Opera 11.10+ */
+background: -ms-linear-gradient(top, rgba(125,126,125,1) 0%,rgba(14,14,14,1) 100%); /* IE10+ */
+background: linear-gradient(top, rgba(125,126,125,1) 0%,rgba(14,14,14,1) 100%); /* W3C */
+filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7d7e7d', endColorstr='#0e0e0e',GradientType=0 ); /* IE6-9 */
+}
+.webkit .black_button:before, .gecko .black_button:before{position:absolute;display:block;top:0px;left:0px;border-left:1px solid #ccc;border-top:1px solid #fff;content:'';width:99%;height:32px;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;}
+.webkit .silver_button:before, .gecko .silver_button:before{position:absolute;display:block;top:0px;left:0px;border-left:1px solid #ccc;border-top:1px solid #fff;content:'';width:99%;height:32px;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;}
.webkit .green_button:before, .gecko .green_button:before{position:absolute;display:block;top:0px;left:0px;border-left:1px solid #a4cb82;border-top:1px solid #cbde9f;content:'';width:99%;height:32px;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;}
.webkit .purple_button:before, .gecko .purple_button:before{position:absolute;display:block;top:0px;left:0px;border-left:1px solid #7878CC;border-top:1px solid #8E8EF2;content:'';width:99%;height:32px;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;}
.webkit .blue_button:before, .gecko .blue_button:before{position:absolute;display:block;top:0px;left:0px;border-left:1px solid #83b6cc;border-top:1px solid #a0cbde;content:'';width:99%;height:32px;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;}
@@ -289,49 +370,6 @@ background:linear-gradient(top,#ff7b0d 0%,#ffa84c 100%);/* W3C */}
.logout {width: 60px; top: 8px;}
.circle_close{background:url(/images/close.png) 0px 0px no-repeat;text-indent:-9999em;}
-/*************************************************************************************************************************************/
-/*************************************************************************************************** TABS ****************************/
-ul#tabs,ul#tabs li{position:relative;float:left;}
-ul#tabs{margin:10px 0px 0px 6px;}
-#tab_panels, #practice_modules ul {margin:0px;}
-ul#tab_panels li{display:none}
-ul#tab_panels li.active{display:block}
-ul#tabs li{color:#fff;text-align:center;padding:10px 20px;margin-right:5px;background:#7878cc;/* Old browsers */
-background:-moz-linear-gradient(top,#7878cc 0%,#464677 100%);/* FF3.6+ */
-background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#7878cc),color-stop(100%,#464677));/* Chrome,Safari4+ */
-background:-webkit-linear-gradient(top,#7878cc 0%,#464677 100%);/* Chrome10+,Safari5.1+ */
-background:-o-linear-gradient(top,#7878cc 0%,#464677 100%);/* Opera 11.10+ */
-background:-ms-linear-gradient(top,#7878cc 0%,#464677 100%);/* IE10+ */
-background:linear-gradient(top,#7878cc 0%,#464677 100%);/* W3C */
-filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#7878cc',endColorstr='#464677',GradientType=0 );/* IE6-9 */
-border:1px solid #3A3A63;text-shadow:1px 1px 0px #3A3A63;}
-ul#tabs li:hover{background:#464677;/* Old browsers */
-background:-moz-linear-gradient(top,#6161A5 0%,#464677 100%);/* FF3.6+ */
-background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#6161A5),color-stop(100%,#464677));/* Chrome,Safari4+ */
-background:-webkit-linear-gradient(top,#6161A5 0%,#464677 100%);/* Chrome10+,Safari5.1+ */
-background:-o-linear-gradient(top,#6161A5 0%,#464677 100%);/* Opera 11.10+ */
-background:-ms-linear-gradient(top,#6161A5 0%,#464677 100%);/* IE10+ */
-background:linear-gradient(top,#6161A5 0%,#464677 100%);/* W3C */
-filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#6161A5',endColorstr='#464677',GradientType=0 );/* IE6-9 */}
-ul#tabs li.active{background:#5ea522;/* Old browsers */
-background:-moz-linear-gradient(top,#a0c152 1%,#5ea522 100%);/* FF3.6+ */
-background:-webkit-gradient(linear,left top,left bottom,color-stop(1%,#2fc910),color-stop(100%,#299a0b));/* Chrome,Safari4+ */
-background:-webkit-linear-gradient(top,#a0c152 1%,#5ea522 100%);/* Chrome10+,Safari5.1+ */
-background:-o-linear-gradient(top,#a0c152 1%,#5ea522 100%);/* Opera11.10+ */
-background:-ms-linear-gradient(top,#a0c152 1%,#5ea522 100%);/* IE10+ */
-filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#a0c152',endColorstr='#5ea522',GradientType=0 );/* IE6-9 */
-background:linear-gradient(top,#a0c152 1%,#5ea522 100%);/* W3C */
-border:1px solid #55901F;text-shadow:1px 1px 0px #55901F;}
-ul#tabs li.active:hover{background:#85aa42;/* Old browsers */
-background:-moz-linear-gradient(top,#85aa42 0%,#5ea522 100%);/* FF3.6+ */
-background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#85aa42),color-stop(100%,#5ea522));/* Chrome,Safari4+ */
-background:-webkit-linear-gradient(top,#85aa42 0%,#5ea522 100%);/* Chrome10+,Safari5.1+ */
-background:-o-linear-gradient(top,#85aa42 0%,#5ea522 100%);/* Opera11.10+ */
-background:-ms-linear-gradient(top,#85aa42 0%,#5ea522 100%);/* IE10+ */
-filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#299a0b',endColorstr='#5ea522',GradientType=0 );/* IE6-9 */
-background:linear-gradient(top,#85aa42 0%,#5ea522 100%);/* W3C */}
-ul#tabs li:before{position:absolute;display:block;top:0px;left:0px;border-left:1px solid #7878CC;border-top:1px solid #8E8EF2;content:'';width:99.9%;height:99.9%;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;}
-ul#tabs li.active:before{position:absolute;display:block;top:0px;left:0px;border-left:1px solid #a4cb82;border-top:1px solid #cbde9f;content:'';width:99.9%;height:99.9%;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;}
/*************************************************************************************************************************************/
/****************************************************************************************************** MODALS ***********************/
Oops, something went wrong.

0 comments on commit db90c86

Please sign in to comment.