.jumbotron { position: relative; padding: 40px 0; color: #fff; text-align: center; text-shadow: 0 1px 3px rgba(0,0,0,.4),0 0 30px rgba(0,0,0,.075); background: #020031; background: -moz-linear-gradient(45deg,#020031 0,#6d3353 100%); background: -webkit-gradient(linear,left bottom,right top,color-stop(0%,#020031),color-stop(100%,#6d3353)); background: -webkit-linear-gradient(45deg,#020031 0,#6d3353 100%); background: -o-linear-gradient(45deg,#020031 0,#6d3353 100%); background: -ms-linear-gradient(45deg,#020031 0,#6d3353 100%); background: linear-gradient(45deg,#020031 0,#6d3353 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#020031', endColorstr='#6d3353', GradientType=1); -webkit-box-shadow: inset 0 3px 7px rgba(0,0,0,.2),inset 0 -3px 7px rgba(0,0,0,.2); -moz-box-shadow: inset 0 3px 7px rgba(0,0,0,.2),inset 0 -3px 7px rgba(0,0,0,.2); box-shadow: inset 0 3px 7px rgba(0,0,0,.2),inset 0 -3px 7px rgba(0,0,0,.2); } .jumbotron a { color: #fff; color: rgba(255,255,255,.5); -webkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; transition: all .2s ease-in-out; } .jumbotron aa:hover { color: #fff; text-shadow: 0 0 10px rgba(255,255,255,.25); } .jumbotron .container { position: relative; z-index: 2; } .jumbotron:after { content: ''; display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: url(img/bs-docs-masthead-pattern.png) repeat center center; opacity: .4; } @media only screen and (-webkit-min-device-pixel-ratio:2),only screen and (min--moz-device-pixel-ratio:2),only screen and (-o-min-device-pixel-ratio:2/1) { .jumbotron:after { background-size: 150px 150px; } } .masthead { padding: 60px 0 80px; margin-bottom: 0; color: #fff; } @media screen and (min-width:768px) { .masthead { padding: 90px 0 110px; } } .masthead h1 { font-size: 60px; line-height: 1; letter-spacing: -2px; font-weight: 700; } @media screen and (min-width:768px) { .masthead h1 { font-size: 90px; } } @media screen and (min-width:992px) { .masthead h1 { font-size: 100px; } } .masthead h2 { font-size: 18px; font-weight: 200; line-height: 1.25; } @media screen and (min-width:768px) { .masthead h2 { font-size: 24px; } } @media screen and (min-width:992px) { .masthead h2 { font-size: 30px; } } .masthead p { font-size: 40px; font-weight: 200; line-height: 1.25; } .masthead .masthead-button-links { margin-top: 30px; } .masthead-links { margin: 0; padding: 0; list-style: none; } .masthead-links li { display: inline; padding: 0 10px; color: rgba(255,255,255,.25); } .masthead-links li a:hover { color: #fff; } .subhead { text-align: center; border-bottom: 1px solid #ddd; } @media screen and (min-width:768px) { .subhead { text-align: left; } } .subhead h1 { font-size: 60px; } .subhead p { margin-bottom: 20px; } @media screen and (min-width:768px) { .subhead p { text-align: left; } } .btn-primary.btn-shadow { -webkit-box-shadow: inset 0 -4px 0 #2a6496; box-shadow: inset 0 -4px 0 #2a6496; border: 0; color: #fff; } .btn-lg.btn-shadow { padding: 13px 35px 17px; } .bc-social { padding: 15px 0; text-align: center; background-color: #f5f5f5; border-top: 1px solid #fff; border-bottom: 1px solid #ddd; } .bc-social-buttons { margin-left: 0; margin-bottom: 0; padding-left: 0; list-style: none; } .bc-social-buttons li { display: inline-block; line-height: 1; color: #555; } .bc-social-buttons li .fa { font-size: 18px; margin-right: 3px; } .bc-social-buttons li .fa-bbs { font-size: 20px; } .bc-social-buttons li a { color: #555; } .bc-social-buttons li.social-qq:hover { color: #428bca; } .bc-social-buttons li.social-bbs a:hover { color: #d9534f; } .bc-social-buttons > li + li:before { padding: 0 10px; color: #ccc; content: "|"; }