/* Change the rounded blue left-hand corner on top-nav */
#mysql_menu {
    background: #015a84 url('/common/themes/sakila/nav_sakila_front.png') no-repeat top left;
}

/* Clear any margins on page container */
#page   {
    margin: 0 auto;
}

/* Styles for our main front page banner */
#banners {
    position:relative;
    width: 100%;
    height: 330px;
    margin-bottom:20px;
}

#banners .hidden {
    display: none;
}

.fp-banner {
    position: absolute;
    width: 100%;
    margin-top:2px;
    margin-right: 0px;
    padding-right: 0px;
    margin-bottom: 0px;
    background: #e2e2e2;
    height: 330px;
    text-align: center;
}

.fp-banner-image {
    position: relative; 
    margin: 0 auto; 
    width: 960px; 
    height: 330px;
    filter:inherit;
}

.fp-banner-dots {
    position: absolute; 
    top: 317px;
    width: 100%;
    text-align: center;
}

.fp-banner-dots-center {
    position: relative; 
    margin: 0 auto;
}

.fp-banner-dots-left {
    position: relative;
    display: inline-block;
    width: 15px;
    height: 15px;
    background: url('/common/themes/sakila/site-sprite1.png') no-repeat -40px 0;
}

.fp-banner-dots-right {
    position: relative;
    display: inline-block;
    width: 15px;
    height: 15px;
    margin: 0;
    padding:0;
    background: url('/common/themes/sakila/site-sprite1.png') no-repeat -65px 0;
}

.fp-banner-dots a {
    position: relative;
    display: inline-block;
    width: 15px;
    height: 15px;
    background: #fff url('/common/themes/sakila/site-sprite1.png') no-repeat top left;
}

.fp-banner-dots a.on {
    background-position: -15px 0;
}

.fp-banner-dots a.off {
    background-position: top left;
}

.fp-banner-dots a:hover {
    background-position: -15px 0;
}

.fp-banner-link {
    border: 0; 
    position: absolute;     
}

/* Styles for dev front page banner 3-col banners */
#banners-sm {
    position:relative;
    width: 100%;
    height: 239px;
    margin-bottom:20px;
}

#banners-sm-back {
    position: absolute;
    width: 100%;
    height: 239px;
    text-align: center;
    margin: 0 auto;
    padding: 0;
    background: url('/common/themes/sakila/banners/b300-dev-back.jpg') repeat-x top;    
}

#fp-banners-sm-container {
    position:relative;
    max-width: 1200px;
    min-width: 960px;
    height: 237px;
    margin: 0 auto;
}

.fp-banners-sm-col {
    display: block;
    float:left;
    width: 32%;
    height: 237px;
    margin: 0 0.6% 0 0.6%;
    text-align: center;
}


.fp-banner-sm-container {
    display: block;
    max-width: 310px;
    height: 237px;
    margin: 0 auto;
    padding: 18px 0 0 0;
    background: url('/common/themes/sakila/banners/b300-banner-back.jpg') no-repeat top left;
}


/* Front Page Logo Bar Styles */

.fp-logo-container {
    margin: 0 3.2% 0 3.2%;
    position: relative;
    min-width: 880px;
    border-top: 1px solid #bbb;
}

.fp-logo-container a.prev {
    display: block;
    float: left;
    width: 30px;
    height: 80px;
    background: url('/common/themes/sakila/logo-sprite.png') no-repeat 0px 0px;
}

.fp-logo-container a.next {
    display: block;
    float: right;
    width: 30px;
    height: 80px;
    background: url('/common/themes/sakila/logo-sprite.png') no-repeat -90px 0px;
}

.fp-logo-container a.prev,
.fp-logo-container a.next {
    opacity: 0.4;
}

.fp-logo-container a:hover.prev,
.fp-logo-container a:hover.next {
    opacity: 1.0;
}


#fp-logo-bar {
    height:80px; 
    position: relative;
    margin: 0 auto; 
    overflow:hidden; 
}

#fp-logos {
    position: absolute; 
    left: 0; 
    top: 0; 
    height: 80px; 
}

@media (max-width: 1023px) { #fp-logo-bar { width: 720px; } }
@media (min-width: 1024px) { #fp-logo-bar { width: 840px; } }
@media (min-width: 1144px) { #fp-logo-bar { width: 960px; } }
@media (min-width: 1264px) { #fp-logo-bar { width: 1080px; } }
@media (min-width: 1384px) { #fp-logo-bar { width: 1200px; } }
@media (min-width: 1504px) { #fp-logo-bar { width: 1320px; } }
@media (min-width: 1634px) { #fp-logo-bar { width: 1440px; } }
@media (min-width: 1754px) { #fp-logo-bar { width: 1560px; } }
@media (min-width: 1874px) { #fp-logo-bar { width: 1680px; } }

#fp-logos a {
    display: block;
    float: left;
    width: 120px;
    height: 80px;
    background: url('/common/themes/sakila/logo-sprite.png?v=2') no-repeat top left;
}

#fp-logos a.fp-logo-paypal             { background-position: -120px 0px; }
#fp-logos a.fp-logo-f5                 { background-position: -240px 0px; }
#fp-logos a.fp-logo-google             { background-position: -360px 0px; }
#fp-logos a.fp-logo-facebook           { background-position: -480px 0px; }
#fp-logos a.fp-logo-verizon-wireless   { background-position: -600px 0px; }
#fp-logos a.fp-logo-adobe              { background-position: -720px 0px; }
#fp-logos a.fp-logo-alcatel-lucent     { background-position: -840px 0px; }
#fp-logos a.fp-logo-symantec           { background-position: -960px 0px; }
#fp-logos a.fp-logo-telenor            { background-position: -1080px 0px; }

#fp-logos a.fp-logo-linkedin           { background-position: -0px   -80px; }
#fp-logos a.fp-logo-square             { background-position: -120px -80px; }
#fp-logos a.fp-logo-twitter            { background-position: -240px -80px; }
#fp-logos a.fp-logo-booking            { background-position: -360px -80px; }
#fp-logos a.fp-logo-zappos             { background-position: -480px -80px; }
#fp-logos a.fp-logo-ebay               { background-position: -600px -80px; }
#fp-logos a.fp-logo-dropbox            { background-position: -720px -80px; }
#fp-logos a.fp-logo-cisco              { background-position: -840px -80px; }
#fp-logos a.fp-logo-youtube            { background-position: -960px -80px; }
#fp-logos a.fp-logo-virgin-america     { background-position: -1080px -80px; }

#fp-logos a.fp-logo-hm                 { background-position: -0px   -160px; }
#fp-logos a.fp-logo-walmart            { background-position: -120px -160px; }
#fp-logos a.fp-logo-ticketmaster       { background-position: -240px -160px; }
#fp-logos a.fp-logo-amazon             { background-position: -360px -160px; }
#fp-logos a.fp-logo-directv            { background-position: -480px -160px; }

/* Basic grid setup - 4 col */
.row-container {
    text-align: center;
    margin: 0;
    padding: 0;
    padding-bottom: 10px;
}

.row {
    clear: both;
    padding: 0;
    margin: 0;
    max-width: 1200px;
    display: inline-block;
    zoom:1; /* For IE 6/7 */
}

.row h2 {
    margin: 0;
    padding: 15px 0 5px 5px;
    font-size: 125%;
    font-weight: normal;
    color: #e97b00;
    line-height: 130%;
}

.row ul {
    padding-left: 5px;
}

.row:before,
.row:after {
    content:"";
    display:table;
}
.row:after {
    clear:both;
}

.col {
    display: block;
    float:left;
    margin: 0% 0.6% 0% 0.6%;
}

.col ul li {
    padding-top:4px;
    padding-top:5px;
}

.col:first-child { margin-left: 3.2%; }
.col:last-child { margin-right: 3.2%; }

.span_1_of_3 {
    width: 30%;
    text-align: left;
}

.span_2_of_3 {
    width: 60%;
    text-align: left;
}

.oow-callout {
    border: 1px solid #cccccc;
    margin: 0px 5px 15px 5px;
    text-align: left;
    padding: 0px 5px 0px 15px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;        
}

.oow-callout p {
    padding-left: 20px;
}

.small-fp-callout {
    padding: 8px 5px 8px 5px;
}

.small-fp-callout-one-line {
    margin:5px 5px 20px 5px;
    color: #313131;
    background-color: #d7e9f7;
    text-align: left;
    font-size: 135%;
    padding: 6px 6px 6px 20px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
}


.small-fp-callout-top {
    color: #313131;
    background-color: #d7e9f7;
    text-align: center;
    font-size: 135%;
    padding: 6px;
    -webkit-border-top-left-radius: 8px;
    -webkit-border-top-right-radius: 8px;
    -moz-border-radius-topleft: 8px;
    -moz-border-radius-topright: 8px;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
}

.orange .small-fp-callout-top {
    background-color: #f8e7cd;
}

.small-fp-callout-bottom {
    color: #313131;
    background-color: #e8f3f9;
    text-align: center;
    font-size: 115%;
    padding: 3px;
    -webkit-border-bottom-left-radius: 8px;
    -webkit-border-bottom-right-radius: 8px;
    -moz-border-radius-bottomleft: 8px;
    -moz-border-radius-bottomright: 8px;
    border-bottom-left-radius: 8px;
    border-bottom-right-radius: 8px;
}

.orange .small-fp-callout-bottom {
    background-color: #fff4e4;
}

/* Override promo styles used in Contact Sales */
.promo11 {
    padding: 0 0 0 15px;
    width: 250px;
}

.promo11 h2 {
    padding-left: 0;
}

.blog-post-container {
    font-size: 100%;
}

.blog-post-container h2 {
    font-size: 150%; 
    padding-top: 0px;
}

.blog-posts {
    padding: 10px 0px 0px 5px;
}

.blog-posts p {
    padding-bottom: 10px;
}

.blog-posts a {
    font-weight: bold;
}

/* Footer styles */
#footer .six-col .links,
#footer .five-col .links {
    position: relative;
    float: left;
    display: block;
    margin: 0 1.2% 0 0;
    text-align:center;
}

#footer .six-col .links {
    width: 15.3%;
}
#footer .five-col .links {
    width: 18.3%;
}


/* Equal width footer cols look weird given content (seldom changes), so let's adjust here */
#footer .six-col .links:nth-of-type(1) {
    width:18%;
}
#footer .six-col .links:nth-of-type(2) {
    width:14.6%;
}
#footer .six-col .links:nth-of-type(3) {
    width:16%;
}
#footer .six-col .links:nth-of-type(4) {
    width:12.6%;
}
#footer .six-col .links:nth-of-type(5) {
    width:12.6%;
}
#footer .six-col .links:nth-of-type(6) {
    width:18%;
}

#footer .five-col .links:nth-of-type(1) {
    width:17.3%;
}
#footer .five-col .links:nth-of-type(2) {
    width:19.3%;
}
#footer .five-col .links:nth-of-type(3) {
    width:20.3%;
}
#footer .five-col .links:nth-of-type(4) {
    width:15.3%;
}
#footer .five-col .links:nth-of-type(5) {
    width:19.3%;
}


#footer ul {
    text-align: left;
    display: inline-block;
}

#footer ul li {
    margin: 0;
}

#footer #search {
    display:none;
}

#footer {
    background: #fff;
    padding: 10px;
    margin: 0 3.2% 0 3.2%;
    min-width: 860px;
    color: #3b3e45;
    border-top: 1px solid #bbb;
    border-bottom: 1px solid #bbb;
}

#footer a {
    color: #777;
}

#footer a:hover {
    text-decoration: underline;
    color: #333;
}

#copyright-oracle {
    text-align: left;
    margin-left: 3.2%;
    margin-top: 5px;
    margin-bottom: 20px;
}

#disclaimer-oracle {
    padding: 10px 20px 20px 20px;
    margin: 0 3.2% 0 3.2%;
    color: #777;
    font-size:85%;
}