/********************************
    Global Styles
********************************/

body,h5,h6,p,ul,li,a {
    font-family: "Myriad W01 Regular", "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-weight: 200;
}
h1,h2,h3,h4 {
    font-family: "Myriad W01 Lt", "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-weight: 200;
}
ul {
    margin-left: 1em;
}


/********************************
    MOBILE FIRST!!!
********************************/

/********************************
    Homepage Elements
********************************/

header#home-header {
    position: relative;
    height: auto;
    width: 100%;
    background: url('../images/home-header-bg.png') 0 bottom repeat-x;
    margin-bottom: -12px;
    padding: 1em 0 1em;
    text-align: center;
}
.top-bar-section ul {
    background: none;
}
nav#main-nav {
    float: left;
    width: 100%;
    margin-bottom: 0.5em;
}
nav#main-nav ul.title-area {
}
nav#main-nav li a {
    height: 2.2em;
    background: rgba(0, 0, 0, 0.5);
    color: #ddd;
    font-size: 1em;
    line-height: 2.2em;
    text-transform: uppercase;
    padding: 0 0.5em;
}
#home-splash {
    width: 100%;
    height: auto;
    background: url('../images/home-bg-small.jpg') center center repeat-x;
}

#home-splash, #home-splash h2, #home-splash h3 {    
    color: #444;
}

#feature {
}

#feature ul {
    list-style-position: inside;
    list-style-image: url('../images/gray-diamond-small.png');
    font-size: 1.3em;
}

/*#feature .button {
    background: url('../images/arrow-button.png') left center no-repeat;
    border: none;
    font-weight: normal;
    font-size: 1.5em;
    box-shadow: none;
}*/

#login {
    margin: 2em 0 2em;
    padding-top: 1em;
    background: rgba(255, 255, 255, 0.5);
}
#login h3 {
    text-align: center;
}
#login .button {
    width: 100%;
}

#why-dns {
    margin-top: 2em;
}

#why-dns h2 {
    text-align: center;
}

#main-footer {
    min-height: 5em;
    background: #ddd;
    margin-top: 5em;
}
#main-footer:after {
    background: #ddd;
}
#main-footer ul {
    list-style: none;
}
#main-footer li {
    display: inline;
    margin: 0 0.3em;
}

/********************************
    Inner Page Elements
********************************/

header#inner-header {
    position: relative;
    height: 7em;
    width: 100%;
    background: url('../images/home-header-bg.png') bottom left repeat-x;
    margin-bottom: -12px;
    padding: 1em 0 0;
    text-align: center;
}
#inner-header nav#main-nav.top-bar {
    top: 0.6em; 
    margin-bottom: 2em;
}
#inner-header nav#main-nav.top-bar li a {
    text-align: left;
    font-weight: 400;
}
/*** Secondary DNS Plans ***/

ul#unlimited .title {
    font-size: 1.3em;
    background-color: #accd55;
}
.pricing-table .title {
    background-color: #7eadf4;
    font-family: "Myriad W01 SmBd", "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-weight: normal;
    
}

/*** User Dashboard ***/

#main-stats p {
    font-size: 1.3em;
    line-height: 1;
    font-family: "Myriad W01 Lt", "Helvetica Neue", Helvetica, Arial, sans-serif;
}
span.stat-num,
span.stat-label {
    font-size: 0.8em;
    margin-bottom: 0;
}
span.stat-num {
    font-size: 0.8em;
}
.rons-stuff {
    opacity: 0;
}
.rons-stuff:hover {
    opacity: 1.0;
}

/************************************
    ANYTHING LARGER THAN MOBILE
************************************/

@media only screen and (min-width: 48em) {

/********************************
    Homepage Elements
********************************/

header#home-header {
    position: relative;
    height: auto;
    background: url('../images/home-header-bg.png') 0 bottom repeat-x;
    margin-bottom: -12px;
    text-align: center;
    padding: 1.5em 0 1em;
}
#logo img {
    max-width: 100%;
}
.top-bar .title-area {
float: left;
}
nav#main-nav {
    background: none;
    float: left;
    width: 100%;
    margin: 0;
}
nav#main-nav ul.left {
    position: relative;
    float: left;
    width: 100%;
    list-style: none;
    text-align: center;
    padding: 0;
    background: none;
}

nav#main-nav li {
    display: inline-block;
    float: none;
}

nav#main-nav li a {
    display: block;
    float: left;
    padding: 0;
    height: 2.2em;
    width: 10em;
    background: rgba(0, 0, 0, 0.5);
    color: #ddd;
    font-size: 0.8em;
    line-height: 2.2em;
    text-transform: uppercase;
    -webkit-border-bottom-right-radius: 0.25em;
    -webkit-border-bottom-left-radius: 0.25em;
    -moz-border-radius-bottomright: 0.25em;
    -moz-border-radius-bottomleft: 0.25em;
    border-bottom-right-radius: 0.25em;
    border-bottom-left-radius: 0.25em;
}
nav#main-nav li a:hover {
    color: #fff;
}
#home-splash {
    height: auto;
    background: url('../images/home-bg.jpg') center center repeat-x;
    padding: 4em 0 1em;
}
#feature h1 {
    font-size: 2.3em;
    margin-bottom: 0.2em;
    line-height: 1em;
}
#feature ul {
    list-style-position: inside;
    list-style-image: url('../images/gray-diamond.png');
    font-size: 1.4em;
    margin-bottom: 0.5em;
    overflow: hidden;
}
#feature li {
    font-family: "Myriad W01 Lt", "Helvetica Neue", Helvetica, Arial, sans-serif;
    float: left;
    margin-left: 1em;
    margin-right: 1em;
    width: 12em;
}
#feature .button {
    background: url('../images/arrow-button.png') left center no-repeat;
    width: 290px;
    border: none;
    font-weight: normal;
    font-size: 1.5em;
    text-align: left;
    box-shadow: none;
}
#feature .button:hover {
    text-decoration: underline;
}
#feature-graphic {
    height: 15em;
    background: rgba(0, 0, 0, 0.3);
}

#login {
    background: rgba(255, 255, 255, 0.5);
    margin-top: 0;
}

/********************************
    Inner Page Elements
********************************/

header#inner-header {
    position: relative;
    height: auto;
    max-height: 6em;
    background: url('../images/home-header-bg.png') bottom left repeat-x;
    margin-bottom: 1em;
    padding: 1em 0 1.7em;
}
header#inner-header #logo {
    position: relative;
    top: 0;
    margin: 0;
    padding: 0;
}
header#inner-header #logo img {
    width: 18em;
}
#inner-header .subheader {
    font-size: 0.8em;
}
#inner-header nav#main-nav.top-bar {
    float: right;
    top: 0.6em;
    right: 1em;
    max-width: 60%;
    height: 1.5em;
    margin: 0;
    text-align: right;
    
}
#inner-header nav#main-nav.top-bar li a {
    text-align: center;
    background: none;
    color: #666;
    width: auto;
    height: 1.2em;
    margin: 0 0.6em;
    padding: 0;
    font-weight: 400;
    font-size: 1em;
    line-height: 1em;
}
#inner-header nav#main-nav.top-bar li a:hover {
    border-bottom: 1px dotted #666;
    color: #333;
    -webkit-border-bottom-right-radius: 0;
    -webkit-border-bottom-left-radius: 0;
    -moz-border-radius-bottomright: 0;
    -moz-border-radius-bottomleft: 0;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
}
/*** Dashboard ***/
.news-item {
    font-size: 0.875em;
}