﻿@import url(http://fonts.googleapis.com/css?family=Noticia+Text);

/* Make the page have 100% height */
html, body { height: 100%; min-height: 100%; padding: 0px; margin: 0px; }
body, h1, h2, h3, h4, h5, h6 { font-family: "Noticia Text", sans-serif; }
h1, h2, h3, h4, h5, h6 { font-family: "Noticia Text", sans-serif;padding: 5px 0px 5px 0px; }

/* The basic 3 row layout*/
#header-wrapper { min-height: 7%; padding: 0px; margin: 0px; }
#content-wrapper { min-height: 83%; padding: 0px; margin: 0px; }
#footer-wrapper { min-height: 10%; padding: 0px; margin: 0px; }

/* Page and pen toolbar */
#toolbar { position:absolute; top:85px;left:5px;z-index:99; }

/* Responsive header */
@media screen and (min-width:720px) {
	/* Show the bar at the top for larger screens*/
	#bootstrap-nav-menu { float: left; }
	#search { float:left; margin-top: 10px; padding-left: 150px; }
}
@media screen and (max-width:720px) {
	#search-mobile { margin: 15px;padding-left:10px; }
	#toolbar { display:none; }
}
#header-wrapper { background-color: #F8F8F8; border-bottom: 1px solid #DDD; } /* redefine the bootstrap nav bar*/
	#header-wrapper .navbar { border: 0px; margin-bottom: 0px !important; min-height: 100%; }

/* Login bar*/
#login-status	{ text-align:right;padding:2px; }
#loggedinas	{ display:block; }

/* The main page container*/
#container { padding: 20px !important; font-size: 1em; }

/* Change the default footer */
#footer-wrapper { background-color: #F8F8F8; }
#footer-inner { padding: 0px 20px; border-top: 1px solid #F8F8F8; min-height: 100%; }
#viewhistory { display: inline; }

/* Settings page */
#configuration-container legend { font-size:1.2em !important; }
#configuration-container select { font-size:0.9em !important;font-weight:normal;}
#configuration-container input { font-size:0.9em !important;font-weight:normal;}

/* StoreBuilder Theme Styles */
.logo { float: left; padding: 25px 0px 20px 50px; }
.top-links {
    float: right;
    padding: 40px 40px 0px 0px;
}
.top-links .sub-nav-links  { float: right; }
.top-links .mobile-menu-btn { float: left; }
.top-links .mobile-menu-btn:hover, .top-links .mobile-menu-btn:focus { cursor: pointer; opacity:0.8; }
.top-links .sub-nav-links ul { list-style: none; padding: 0; margin: 0;}
.top-links .sub-nav-links ul li { display: inline-block; }
.top-links .sub-nav-links ul li a {
    display: block;
	padding: 13px 20px;
	color: #fff;
    background: #00969f;
	font-size: 18px;
	letter-spacing: 1px;

	background: -moz-linear-gradient(top,  #00969f 0%, #00969f 50%, #23a5ad 50%, #23a5ad 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#00969f), color-stop(50%,#00969f), color-stop(50%,#23a5ad), color-stop(100%,#23a5ad));
	background: -webkit-linear-gradient(top,  #00969f 0%,#00969f 50%,#23a5ad 50%,#23a5ad 100%);
	background: -o-linear-gradient(top,  #00969f 0%,#00969f 50%,#23a5ad 50%,#23a5ad 100%);
	background: -ms-linear-gradient(top,  #00969f 0%,#00969f 50%,#23a5ad 50%,#23a5ad 100%);
	background: linear-gradient(to bottom,  #00969f 0%,#00969f 50%,#23a5ad 50%,#23a5ad 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00969f', endColorstr='#23a5ad',GradientType=0 );
}
.top-links .sub-nav-links ul li a:hover, .top-links .sub-nav-links ul li a:focus { opacity:0.8; }
.mobile-menu-btn {
    display: none;
}

.menu { background-color: #000; /* height: 60px; */ clear: both; font-size: 18px; letter-spacing: 1px; }
.menu ul { list-style: none; margin: 0; padding: 0; }
.menu ul:first-child { margin: 0 0 0 30px; }
.menu ul li { position: relative; display: inline-block; }
.menu ul li a { display: block; padding: 15px 10px; color: #fff; text-transform: uppercase; }
.menu ul li a:hover, .menu ul li a:focus { color: #f9a41a; opacity: 1; }
.menu ul li.selected > a { color: #f9a41a; }
.menu ul li ul { position: absolute; left: -9999em; z-index:6; background-color: #000; }
.menu ul li ul li { display: block; border-top: 1px solid #4d4d4d; white-space: nowrap; }
.menu ul ul li a { padding: 5px 20px; }
.menu ul li:hover ul { left: auto; }

/* Tablet styles */
@media screen and (max-width: 1024px) {
	.logo img {
        padding: 25px 25px 20px 25px;
        width: 100%;
        max-width: 355px;
        height: auto;
    }
    .top-links .sub-nav-links ul li a {
        font-size: 16px;
        padding: 10px 12px !important;
    }
	.menu { font-size: 16px; }
	.menu ul li a { padding: 15px 10px; }
    .banner {
        background-position: center top;
    }
}


/* CUSTOMIZATIONS recommended by StudioThink for style consistency. */
a {
	color: #00969f;
}
a:focus, a:hover {
	text-decoration: none;
	color: inherit;
	opacity:0.8;
}
body, h1, h2, h3, h4, h5, h6 {
    font-family: "proxima-nova",sans-serif;
}
h1, h2, h3, h4, h5, h6 {
    color: #00969f;
    font-family: "Proxima Nova",sans-serif;
    font-weight: 700;
    letter-spacing: 1px;
    padding: 5px 0;
}
.navbar-nav > li > a {
    color: #ffffff;
    display: block;
    font-family: "Proxima-Nova",sans-serif;
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 1px;
    padding: 15px;
    text-transform: uppercase;
}
.top-links .sub-nav-links ul li a {
    background: rgba(0, 0, 0, 0) linear-gradient(to bottom, #00969f 0%, #00969f 50%, #23a5ad 50%, #23a5ad 100%) repeat scroll 0 0;
    color: #fff;
    display: block;
    font-size: 18px;
    letter-spacing: 1px;
    padding: 13px 20px 10px;
}
.navbar {
    border-radius: 0 !important;
}
.navbar-nav {
  margin: 0px 0px 0px 20px;
}
.header-wrapper{
    text-align:center;
    margin-bottom:20px;
}
#content-wrapper ul, ol {
    padding-left: 20px;
}
#footer-wrapper {
   font-family: "proxima-nova”, sans-serif;
    font-size: 16px;
    font-weight: 600;
    /*min-height: 185px;*/
    padding-top: 15px;
    padding-bottom: 20px;
    position: relative;
    text-align: center;
    text-transform: uppercase;
}
#footer-wrapper h6 { margin-top: 0px; margin-bottom: 0px; } 
#loggedinas { margin-top: 10px; }
.pagetitle {
	background: rgba(0, 0, 0, 0) linear-gradient(to bottom, #00969f 0%, #00969f 50%, #23a5ad 50%, #23a5ad 100%) repeat scroll 0 0;
    color: #ffffff;
    display: inline-block;
    font: 600 55px/1.2em "proxima-nova",Calibri,Candara,sans-serif;
    letter-spacing: 1px;
    margin-bottom: 5px;
    margin-top: 10px;
    padding: 10px 35px;
    text-align: center; /* Center this on the page like the current Resource page */
}

/*
- All the fonts on the page should become Proxima Nova. We’re using @font-face on the main site…let me know if they have any problems implementing Proxima Nova or if they need the font files for it.
- The font for header 1 will need to change to Proxima Nova and I’d really like it to be centered on the page like the Terms & Conditions page. I’d also like it to have a 20px space underneath it so that “Welcome to the StoreBuilder Wiki!” text isn’t so close to it.
- The lists on the page - I’d like them to have the style “Padding-left: 16px;” added to them so that they align with the headlines
- The div with class “container” still has an extra 15px of padding-right. I’d like it to be 0px so that the centered text isn’t off by 15px.
*/