<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Gilmore Car Museum</title>
- <link rel="stylesheet" href="css/app.css" />
+ <link rel="stylesheet" href="css/app.css"/>
+ <link href='http://fonts.googleapis.com/css?family=Balthazar' rel='stylesheet' type='text/css'>
<script src="bower_components/modernizr/modernizr.js"></script>
</head>
<body>
<div class="inner-wrap">
<header>
<div class="row">
- <div class="small-12 medium-4 columns">
- <a id="logo" href="#"><img src="assets/logo.png"></a>
+ <div class="small-12 medium-4 columns text-center">
+ <a id="logo" class="text-center" href="#"><img src="assets/logo.png"></a>
</div>
<div class="small-12 medium-8 columns right">
<div class="small-8 columns show-for-medium-up">
<input type="text" placeholder="SEARCH"><img src="assets/search_button.jpg">
</div>
</div>
- <div class="small-12 columns">
+ <div class="small-12 columns small-only-text-center medium-text-right">
<h1>America's Signature Collection<sup>™</sup></h1>
</div>
</div>
</ul>
</aside>
</header>
+ <div class="show-for-medium-up">
<div class="slider">
</div>
<div class="thumb-nav">
</div>
</div>
</div>
+ </div>
<div class="row content">
<div class="small-12 columns">
<h2>Welcome</h2>
</div>
</div>
</footer>
- <div class="row text-center">
+ <div id="partners" class="row text-center">
<div class="small-offset-0 small-6 medium-4 large-offset-1 large-2 columns">
<a href="#"><img src="assets/naam-logo.png"></a>
</div>
<p>© 2015 Gilmore Car Musuem • All Rights Reserved • Produced by Gaslight Media</p>
</div>
</div>
+ <a class="exit-off-canvas"></a>
</div><!--/inner-wrap-->
</div><!--/off-canvas-wrap-->
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Gilmore Car Museum</title>
<link rel="stylesheet" href="css/app.css" />
+ <link href='http://fonts.googleapis.com/css?family=Balthazar' rel='stylesheet' type='text/css'>
<script src="bower_components/modernizr/modernizr.js"></script>
</head>
<body>
<div class="inner-wrap">
<header>
<div class="row">
- <div class="small-12 medium-4 columns">
+ <div class="small-12 medium-4 columns text-center">
<a id="logo" href="#"><img src="assets/logo.png"></a>
</div>
<div class="small-12 medium-8 columns right">
<input type="text" placeholder="SEARCH"><img src="assets/search_button.jpg">
</div>
</div>
- <div class="small-12 columns">
+ <div class="small-12 columns small-only-text-center medium-text-right">
<h1>America's Signature Collection<sup>™</sup></h1>
</div>
</div>
<li><a id="current-crumb" href="#">General Events</a></li>
</ul>
</div>
- <div class="medium-4 columns show-for-medium-up sidebar">
- <h2>Host an Event</h3>
+ <div class="medium-3 columns show-for-medium-up sidebar">
+ <h3>Host an Event</h3>
<ul>
<li><a id="active" href="#">General Events</a></li>
<li><a href="#">Banquets</a></li>
<li><a href="#">Event/Meeting Spaces</a></li>
<li><a href="#">Approved Caterers</a></li>
</ul>
- <a class="tab" href="#"><h2>Upcoming Events</h2></a>
- <a class="tab" href="#"><h2>News</h2></a>
- <a class="tab" href="#"><h2>The Collections</h2></a>
- <a class="tab" href="#"><h2>Sponsors</h2></a>
+ <a class="tab" href="#"><h3>Upcoming Events</h3></a>
+ <a class="tab" href="#"><h3>News</h3></a>
+ <a class="tab" href="#"><h3>The Collections</h3></a>
+ <a class="tab" href="#"><h3>Sponsors</h3></a>
</div>
- <div class="small-12 medium-8 columns main">
+ <div class="small-12 medium-9 columns main">
<h2>Hold an Event You Won't Soon Forget.<br>In a Venue Like No Other Around.</h2>
<img src="assets/content_header-img.jpg">
<img class="alignleft" src="assets/content_img1.jpg">
</div>
</div>
</footer>
- <div class="row text-center">
+ <div id="partners" class="row text-center">
<div class="small-6 medium-4 large-offset-1 large-2 columns">
<a href="#"><img src="assets/naam-logo.png"></a>
</div>
<p>© 2015 Gilmore Car Musuem • All Rights Reserved • Produced by Gaslight Media</p>
</div>
</div>
+ <a class="exit-off-canvas"></a>
</div><!--/inner-wrap-->
</div><!--/off-canvas-wrap-->
// - - - - - - - - - - - - - - - - - - - - - - - - -
// This is the default html and body font-size for the base rem value.
-// $rem-base: 16px;
+ $rem-base: 16px;
// Allows the use of rem-calc() or lower-bound() in your settings
@import "foundation/functions";
// $include-html-type-classes: $include-html-classes;
// We use these to control header font styles
- $header-font-family: Copperplate, Copperplate Gothic Light;
+ $header-font-family: "Balthazar";
// $header-font-weight: $font-weight-normal;
// $header-font-style: normal;
$header-font-color: $red;
// $topbar-bg: $topbar-bg-color;
// Height and margin
-// $topbar-height: rem-calc(45);
-// $topbar-margin-bottom: 0;
+ $topbar-height: rem-calc(40);
+ $topbar-margin-bottom: 0;
// Controlling the styles for the title in the top bar
// $topbar-title-weight: $font-weight-normal;
li {
display: inline;
a {
- font-size: 0.563em;
+ font-size: 0.750em;
color: $white;
text-transform: uppercase;
+ padding: 0 5px;
}
}
}
}
}
h1 {
+
sup {
font-size: 0.563em;
}
background: transparent;
a {
color: $white;
- font-size: 1.125em;
+ font-size: 0.938em;
background: transparent;
text-transform: uppercase;
}
background: $white;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
+ min-height: 200px;
li {
white-space: nowrap;
background: $white;
left: 20px;
top: 23px;
border: 6px solid #fdefd4;
+ box-shadow: 2px 3px 9px 0px #ababab;
}
}
&:not(.has-form):not(.active) {
background: $white;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
+ min-height: 200px;
li {
white-space: nowrap;
background: $white;
left: 20px;
top: 23px;
border: 6px solid #fdefd4;
+ box-shadow: 2px 3px 9px 0px #ababab;
}
}
&:not(.has-form):not(.active) {
color: #fff;
content: "|";
position: absolute;
- top: 5px;
+ top: 10px;
left: -13px;
- font-size: 20px;
+ font-size: 15px;
font-weight: bold;
display:block;
padding: 0 10px;
}
.has-dropdown > a {
padding-right: 15px !important;
+ margin-bottom: -4px;
&:after {
content: none;
}
width: 100%;
}
label {
- margin-top: 85px;
+ margin-top: 55px;
}
text-align: center;
}
background: #9fa617;
border-radius: 8px;
padding: 5px 10px;
+ box-shadow: 0 3px 6px 0px #ababab;
&:hover {
background: $white;
color: #9fa617;
img {
border: 6px solid #fdefd4;
margin-bottom: 30px;
+ box-shadow: 2px 3px 9px 0px #ababab;
}
}
.sidebar {
- h2 {
+ h3 {
color: $black;
background: #9fa617;
text-align: center;
li {
border-bottom: 1px solid $white;
background: #c5c974;
- padding-left: 15px;
+ padding: 5px 0 5px 15px;
a {
color: $black;
+ text-transform: uppercase;
&#active {
color: $red;
}
}
.tab {
background: #c8b776;
- h2 {
+ h3 {
color: $white;
background: #c8b776;
text-align: center;
text-decoration: underline;
text-decoration-color: $red;
}
+#soc-bottom {
+ margin-bottom: 30px;
+}
footer {
background: #b9b8a3;
img {
padding: 25px 0;
}
}
+#partners {
+ img {
+ padding-top: 30px;
+ }
+}
#copyright {
margin-top: 32px;
margin-bottom: 150px;