rocketeria.css

/* Rocketeria.biz CSS */

/* @font-face {
font-family: Quicksand;
src: url("../style/fonts/Quicksand-Regular.otf");
}

@font-face {
font-family: Quicksand-Bold;
src: url("../style/fonts/Quicksand-Bold.otf");
} */

html, body {
margin: 0;
padding: 0;
height: 100%;
width: 100%;
}

body {
	font-family: 'Quicksandregular', sans-serif;
	color: #0f0403;
	background: url("../images/bg-main-2.png") no-repeat center top, -moz-linear-gradient(left, rgba(0,0,0,1) 0%, rgba(0,0,0,1) 5%, rgba(150,35,31,1) 50%, rgba(150,35,31,1) 51%, rgba(0,0,0,1) 95%, rgba(0,0,0,1) 100%); /* FF3.6+ */
	background: url("../images/bg-main-2.png") no-repeat center top, -webkit-gradient(left top, right top, color-stop(0%, rgba(0,0,0,1)), color-stop(5%, rgba(0,0,0,1)), color-stop(50%, rgba(150,35,31,1)), color-stop(51%, rgba(150,35,31,1)), color-stop(95%, rgba(0,0,0,1)), color-stop(100%, rgba(0,0,0,1))); /* Chrome,Safari4+ */
	background: url("../images/bg-main-2.png") no-repeat center top, -webkit-linear-gradient(left, rgba(0,0,0,1) 0%, rgba(0,0,0,1) 5%, rgba(150,35,31,1) 50%, rgba(150,35,31,1) 51%, rgba(0,0,0,1) 95%, rgba(0,0,0,1) 100%); /* Chrome10+,Safari5.1+ */
	background: url("../images/bg-main-2.png") no-repeat center top, -o-linear-gradient(left, rgba(0,0,0,1) 0%, rgba(0,0,0,1) 5%, rgba(150,35,31,1) 50%, rgba(150,35,31,1) 51%, rgba(0,0,0,1) 95%, rgba(0,0,0,1) 100%); /* Opera 11.10+ */
	background: url("../images/bg-main-2.png") no-repeat center top, -ms-linear-gradient(left, rgba(0,0,0,1) 0%, rgba(0,0,0,1) 5%, rgba(150,35,31,1) 50%, rgba(150,35,31,1) 51%, rgba(0,0,0,1) 95%, rgba(0,0,0,1) 100%); /* IE10+ */
	background: url("../images/bg-main-2.png") no-repeat center top, linear-gradient(to right, rgba(0,0,0,1) 0%, rgba(0,0,0,1) 5%, rgba(150,35,31,1) 50%, rgba(150,35,31,1) 51%, rgba(0,0,0,1) 95%, rgba(0,0,0,1) 100%); /* W3C */
}

.image-bg {
	background: url("../images/bg-main.png") #0f0403 no-repeat center top !important;
}

#page-wrapper {
width: 960px;
margin: 0 auto;
min-height: 100%;
background: #FFFFFF;
}


a {
color: #0f0403;
text-decoration: none;
font-family: 'Quicksandregular', sans-serif;
}

p, h1, h2, h3, h4, h5, h6, ul, li {
margin: 0;
padding: 0;
}

.clear {
clear: both;
}

/* Header Content */

#header {
background-color: #96231f;
height: 103px;
background-image: url("../images/bg-header.png");
}

#header > a {
height: 103px;
width: 372px;
display: block;
float: left;
cursor: pointer;
cursor: hand;
}

#header h1 {
background: url("../images/header-text.png") no-repeat 26px 20px;
text-indent: -9999px;
height: 80px;
width: 372px;
margin: 0;
float: left;
}

#header .header-info {
float: right;
color:  #f7bd20;
text-align: right;
padding-right: 20px;
padding-top: 12px;
}

#header .header-info a {
float: none;
color:  #f7bd20;
text-decoration: underline;
}

/* Navigation */

#nav-wrapper {
background-color: #f7bd20;
height: 41px;
}

#nav-contents {
list-style-type: none;
font-size: 20px;
margin: 0;
padding: 0;
text-transform: uppercase;
}

#nav-contents li {
    float: left;
    margin-top: 8px;
    text-align: center;
    width: 137px;
}

#nav-contents a{
font-family: 'Quicksandbold',sans-serif !important;
padding: 8px 7px;
}

#nav-contents a:hover, .footer-nav a:hover, .footer-quick-links a:hover {
color: #96231f;
}

/* Main Body Content */

#main {
padding-bottom: 95px;
overflow: auto;
}

.ie7 #main {
overflow: hidden;
}


/* Home Page */

.billboard-image {
z-index: 0;
}

/* Billboard Slider */

#slides {
width: 696px;
height: 285px;
float: left;
padding: 12px;
}

.ie7 .no-js-slide .billboard-content {
bottom: 289px;
}

.slidejs-container .slidejs-navigation {
width: 696px;
height: 285px;
float: left;
}

#slides .arrow-next {
border: 0;
cursor: pointer;
cursor: hand;
width: 50px;
height: 50px;
position: relative;
bottom: 170px;
left: 590px;
z-index: 9999;
background: url("../images/a03.png") 55px -35px no-repeat;
}

#slides .arrow-next:focus,  #slides .arrow-previous:focus {
outline: none;
}

#slides .arrow-previous {
border: 0;
cursor: pointer;
cursor: hand;
width: 50px;
height: 50px;
position: relative;
left: 1px;
bottom: 170px;
z-index: 9999;
background: url("../images/a03.png") 55px -35px no-repeat;
}

.slidejs-pagination {
display: none;
}

.billboard-content h2 {
bottom: 252px;
    font-size: 33px;
    height: 42px;
    left: -5px;
    margin: 0;
    padding: 3px 26px 0 12px;
    position: relative;
    text-align: center;
    text-transform: uppercase;
    width: 330px;
}

.ie7 .billboard-content h2 {
position: absolute;
top: 38px;
left: 340px;
}

.ie8 .billboard-content h2 {
left: -10px;
}

.ie7 .billboard-content h2, .ie8 .billboard-content h2{
width: 335px;
}

.billboard-header-green {
background-color: #58a326;
}

.billboard-header-yellow {
background-color: #d79e05;
}

.billboard-header-red {
background-color: #96231f;
}

.billboard-header-purple {
background-color: #9702b6;
}

.billboard-content {
height: 289px;
width: 348px;
float: right;
color: #FFFFFF;
/* background: url("../images/billboard-content-bg-green.png") top right no-repeat; */
}

.bg-billboard-green {
position: relative;
right: 95px;
}

.billboard-content p {
position: relative;
bottom: 250px;
width: 280px;
font-size: 16px;
line-height: 1.35em;
left: 26px;
text-align: center;
}

.ie7 .billboard-content p {
bottom: 200px;
}

.billboard-link-1 {
position: relative;
top: 40px;
}

.billboard-link-2 {
position: relative;
top: 20px;
}

.billboard-link-3 {
position: relative;
bottom: 90px;
left: 125px;
}

.ie7 .billboard-link {
bottom: 95px;
}

.bg-billboard-arrows-green {
position: relative;
right: 69px;
opacity: 0.75;
filter:alpha(opacity=75); /* For IE8 and earlier */
float: left;
}

/* End Billboard Styling */

.btn-submit-yellow, input[type="submit"].btn-submit-yellow{
text-transform: uppercase;
font-family: 'Quicksandbold', sans-serif !important;
font-size: 18px;
padding: 8px 24px;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
font-family: inherit;
background: #f7bd20;
border: 0;
cursor: pointer;
cursor: hand;
}

.btn-submit-yellow:hover {
color: #96231f;
}

.btn-submit-yellow:focus, .btn-submit-red:focus {
outline: none;
}

.newsletter-submit {
margin: 4px 15px 1px;
width: 178px;
}

.home-newsletter, .newsletter-side {
float: right;
background: url("../images/bg-newsletter-red.png") no-repeat;
color: #f7bd20;
position: relative;
right: 16px;
top: 12px;
width: 212px;
}

.newsletter-signup {
height: 152px;
}

.ie7 .newsletter-signup {
height: 163px;
}

/* .ie9 .newsletter-signup, .ie10 .newsletter-signup, .ie8 .newsletter-signup, .ie11 .newsletter-signup {
margin-bottom: 36px;
} */

.ie7 #billboard-newsletter-signup {
position: relative;
bottom: 12px;
}

.newsletter-signup h3 {
margin: 12px 0;
text-align: center;
}
.newsletter-social h3 {
text-transform: uppercase;
color: #FFFFFF;
font-size: 25px;
padding-top: 3px;
text-align: center;
margin-bottom: 5px;
}

.newsletter-social a{
padding-left: 8px;
}

.newsletter-email {
padding: 9px 9px;
margin: 0 0 4px 14px;
width: 160px;
border: 0;
}

.newsletter-tag {
margin: 5px 36px;
font-size: 12px;
text-transform: uppercase;
font-family: 'Quicksandbold', sans-serif !important;
}

.ie7 .newsletter-tag {
position: relative;
bottom: 22px;
}

.ie7 .newsletter-email {
margin-left: 15px !important;
}

.newsletter-social {
background: url("../images/bg-social-yellow.png") no-repeat;
padding-bottom: 10px;
margin-top: 35px;
}

.newsletter-social h3 {
text-transform: uppercase;
color: #FFFFFF;
font-family: 'Quicksandbold', sans-serif !important;
}

.btn-facebook-red {
background: url("../images/btn-facebook-red.png") no-repeat;
cursor: pointer;
cursor: hand;
width: 39px;
height: 39px;
border: 0;
}

.btn-facebook-red:hover {
background: url("../images/btn-facebook-black.png") no-repeat;
}

.btn-twitter-red {
background: url("../images/btn-twitter-red.png") no-repeat;
cursor: pointer;
cursor: hand;
width: 39px;
height: 39px;
border: 0;
}

.btn-twitter-red:hover {
background: url("../images/btn-twitter-black.png") no-repeat;
}

.btn-instagram-red {
background: url("../images/btn-instagram-red.png") no-repeat;
cursor: pointer;
cursor: hand;
width: 39px;
height: 39px;
border: 0;
}

.btn-instagram-red:hover {
background: url("../images/btn-instagram-black.png") no-repeat;
}

.btn-youtube-red {
background: url("../images/btn-youtube-red.png") no-repeat;
cursor: pointer;
cursor: hand;
width: 39px;
height: 39px;
border: 0;
}

.btn-youtube-red:hover {
background: url("../images/btn-youtube-black.png") no-repeat;
}

.home-bottom {
height: 400px;
}

.home-bottom h3 {
color: #FFFFFF;
text-transform: uppercase;
font-family: 'Quicksandbold', sans-serif !important;
font-size: 27px;
text-align: center;
margin: 32px 0 20px 0;
padding: 10px 0;
}

.home-testimonials {
width: 292px;
height: 389px;
background: url("../images/bg-testimonials.png") no-repeat;
color: #abfffc;
float: left;
position: relative;
bottom: 183px;
margin-left: 14px;
overflow: hidden;
}

.ie7 .home-testimonials {
float: none;
left: 14px;
}

.home-testimonials h3, .testimonials-side h3 {
background-color: #04bde5;
}

.home-store {
background: url("../images/bg-store.png") no-repeat;
width: 292px;
height: 182px;
color: #f97b7d;
float: left;
margin: 0px 16px 0 14px;
}

.home-store:hover, .home-lessons:hover, .home-rentals:hover, .home-events:hover, .home-testimonials:hover, .testimonials-side:hover {
-webkit-box-shadow: 5px 5px 5px #888888;
-o-box-shadow: 5px 5px 5px #888888;
box-shadow: 5px 5px 5px #888888;
}

.home-store h3 {
background-color: #96231f;
}

.home-lessons {
background: url("../images/bg-lessons.png") no-repeat;
width: 292px;
height: 182px;
color: #9df860;
float: left;
margin: 0px 12px;
}

.home-lessons h3 {
background-color: #58a326;
}

.home-rentals {
background: url("../images/bg-rentals.png") no-repeat;
width: 292px;
height: 182px;
color: #f5ed14;
float: left;
margin: 24px 16px 0 14px;
}

.home-rentals h3 {
background-color: #d79e05;
}

.home-events {
background: url("../images/bg-events.png") no-repeat;
width: 292px;
height: 182px;
color: #e26ffb;
float: left;
margin: 24px 12px 0;
}

.home-events h3 {
background-color: #9702b7;
}

.home-store p, .home-lessons p, .home-rentals p, .home-events p, .testimonials-side p {
font-size: 20px;
text-align: center;
}

.home-testimonials p {
font-size: 19px;
line-height: 1.2em;
margin-left: 22px;
width: 260px;
}

/* Sub-Page Styling */

.push {
height: 80px;
clear: both;
}

#header-sub h1{
text-transform: uppercase;
color: #FFF;
z-index: 1;
font-size: 25px;
font-family: 'Quicksandbold', sans-serif !important;
float: left;
position: relative;
bottom: 29px;
left: 46px;
}

#content-sub, #header-sub {
float: left;
width: 665px;
}

#content-sub {
padding: 0 0 115px 35px;
}

#content-sub p, #content-sub ul {
line-height: 1.4em;
}

#content-sub ul {
padding: 6px 15px;
}

#content-sub a {
text-decoration: underline;
}
 
 .bg-header-sub {
 position: relative;
 top: 12px;
 left: 14px;
 }
 
 .list-header-green, .list-header-red, .list-header-yellow, .list-header-purple, .list-header-blue {
 text-transform: uppercase;
 margin-left: 32px;
 font-family: font-family: 'Quicksandbold', sans-serif !important;
 }
 
 .list-header-green {
 color: #58a326;
 }
 
 .list-header-red {
 color: #96231f;
 }
 
 .list-header-yellow {
 color: #f7bd20;
 }
 
 .list-header-purple {
 color: #9702b7;
 }
 
 .list-header-blue {
 color: #04bde5;
 }

.btn {
background-color: #58a326;
color: #FFF;
text-transform: uppercase;
text-decoration: none !important;
font-family: 'Quicksandbold', sans-serif !important;
left: 239px;
top: 28px;
font-size: 18px;
padding: 7px 15px;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
} 

.btn:hover {
	color: inherit;
	text-decoration: none !important;
	cursor: pointer;
	cursor: hand;
}
 
#sidebar {
width: 245px;
float: right;
position: relative;
bottom: 115px;
left: 2px;
}

.testimonials-side {
float: right;
width: 211px;
height: 390px;
background: url("../images/bg-testimonials-2.png") no-repeat;
position: relative;
top: 23px;
right: 16px;
color: #FFF;
overflow: hidden;
}

.testimonials-side h3 {
color: #ffffff;
font-family: 'Quicksandbold',sans-serif !important;
font-size: 24px;
padding: 13px 0;	
position: relative;
text-align: center;
text-transform: uppercase;
top: 31px;
}

.testimonials-side p {
font-size: 19px;
line-height: 1.2em;
margin-left: 22px;
text-align: left;
position: relative;
top: 50px;
width: 170px;
}

/* Footer */

#footer  {
position: relative;
height: 258px;
clear: both;
margin: -258px auto 0;
background: url("../images/separator-footer.png") center top no-repeat #f7bd20;
width: 960px;
}

#footer h3 {
font-family: 'Quicksandbold', sans-serif;
text-transform: uppercase;
}

.ie7 #footer {
margin-top: 0;
}

.footer-nav, .footer-newsletter, .footer-social, .footer-quick-links {
float: left;
width: 240px;
margin-top: 28px;
}


.footer-newsletter h3, .footer-social h3 {
text-align: center;
}

.footer-nav h3, .footer-quick-links h3 {
margin-left: 34px;
}

.footer-nav ul, .footer-quick-links ul {
list-style-type: none;
padding-left: 0;
}

.footer-nav li, .footer-quick-links li {
margin: 6px 46px;
}

.footer-nav li a, .footer-quick-links li a {
font-family: 'Quicksandbold', sans-serif;
}

.footer-newsletter-email {
padding: 9px 9px;
margin: 13px 0 4px 28px;
width: 160px;
}

.footer-social h3 {
margin-bottom: 7px;
}

.footer-social a {
margin-left: 7px;
}

.footer-social-push {
margin-left:14px;
}
.btn-submit-red {
text-transform: uppercase;
font-family: 'Quicksandbold', sans-serif !important;
font-size: 18px;
padding: 8px 24px;
font-family: inherit;
border: 0;
cursor: pointer;
cursor: hand;
color: #FFFFFF;
background-color: #96231f !important;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
behavior: url("pie/pie.htc");
}

.btn-submit-red:hover {
color: #f7bd20;
}

.footer-newsletter-submit {
margin-left: 29px;
width: 178px;
}

.btn-facebook-black {
background: url("../images/btn-facebook-black.png") no-repeat;
cursor: pointer;
cursor: hand;
width: 39px;
height: 39px;
border: 0;
}

.btn-facebook-black:hover {
background: url("../images/btn-facebook-red.png") no-repeat;
}

.btn-twitter-black {
background: url("../images/btn-twitter-black.png") no-repeat;
cursor: pointer;
cursor: hand;
width: 39px;
height: 39px;
border: 0;
}

.btn-twitter-black:hover {
background: url("../images/btn-twitter-red.png") no-repeat;
}

.btn-instagram-black {
background: url("../images/btn-instagram-black.png") no-repeat;
cursor: pointer;
cursor: hand;
width: 39px;
height: 39px;
border: 0;
}

.btn-instagram-black:hover {
background: url("../images/btn-instagram-red.png") no-repeat;
}

.btn-youtube-black {
background: url("../images/btn-youtube-black.png") no-repeat;
cursor: pointer;
cursor: hand;
width: 39px;
height: 39px;
border: 0;
}

.btn-youtube-black:hover {
background: url("../images/btn-youtube-red.png") no-repeat;
}