|
|
| (28 intermediate revisions not shown) |
| Line 1: |
Line 1: |
| - | html, body {
| |
| - | height: 100%;
| |
| - | }
| |
| | | | |
| - | body {
| |
| - | margin: 0px;
| |
| - | padding: 0px;
| |
| - | background: #080808 url(images/main-bg.png) repeat;
| |
| - | font-family: 'Open Sans', sans-serif;
| |
| - | font-size: 13px;
| |
| - | color: #2B2B2B;
| |
| - | }
| |
| - |
| |
| - |
| |
| - | h1, h2, h3 {
| |
| - | margin: 0;
| |
| - | padding: 0;
| |
| - | }
| |
| - |
| |
| - | p, ol, ul {
| |
| - | margin-top: 0px;
| |
| - | }
| |
| - |
| |
| - | p {
| |
| - | line-height: 180%;
| |
| - | }
| |
| - |
| |
| - | strong {
| |
| - | }
| |
| - |
| |
| - | a {
| |
| - | color: #0000FF;
| |
| - | }
| |
| - |
| |
| - | a:hover {
| |
| - | text-decoration: none;
| |
| - | }
| |
| - |
| |
| - | a img {
| |
| - | border: none;
| |
| - | }
| |
| - |
| |
| - | img.border {
| |
| - | }
| |
| - |
| |
| - | img.alignleft {
| |
| - | float: left;
| |
| - | }
| |
| - |
| |
| - | img.alignright {
| |
| - | float: right;
| |
| - | }
| |
| - |
| |
| - | img.aligncenter {
| |
| - | margin: 0px auto;
| |
| - | }
| |
| - |
| |
| - | hr {
| |
| - | display: none;
| |
| - | }
| |
| - |
| |
| - | /** WRAPPER */
| |
| - |
| |
| - | #wrapper {
| |
| - | }
| |
| - |
| |
| - | .container {
| |
| - | width: 1000px;
| |
| - | margin: 0px auto;
| |
| - | }
| |
| - |
| |
| - | .clearfix {
| |
| - | clear: both;
| |
| - | }
| |
| - |
| |
| - | /** HEADER */
| |
| - |
| |
| - | #header {
| |
| - | overflow: hidden;
| |
| - | width: 900px;
| |
| - | height: 150px;
| |
| - | padding: 0px 50px;
| |
| - | background: url(images/gradient-bg.png) no-repeat center top;
| |
| - | }
| |
| - |
| |
| - | /** LOGO */
| |
| - |
| |
| - | #logo {
| |
| - | float: left;
| |
| - | width: 300px;
| |
| - | height: 150px;
| |
| - | }
| |
| - |
| |
| - | #logo h1, #logo p {
| |
| - | margin: 0px;
| |
| - | line-height: normal;
| |
| - | }
| |
| - |
| |
| - | #logo h1 a {
| |
| - | display: block;
| |
| - | line-height: 150px;
| |
| - | text-transform: uppercase;
| |
| - | text-decoration: none;
| |
| - | font-family: 'Archivo Narrow', sans-serif;
| |
| - | font-size: 1.3em;
| |
| - | color: #FFFFFF;
| |
| - | }
| |
| - |
| |
| - | /** MENU */
| |
| - |
| |
| - | #menu {
| |
| - | float: right;
| |
| - | width: 600px;
| |
| - | height: 99px;
| |
| - | }
| |
| - |
| |
| - | #menu ul {
| |
| - | float: right;
| |
| - | margin: 0px;
| |
| - | padding: 60px 0px 0px 0px;
| |
| - | list-style: none;
| |
| - | line-height: normal;
| |
| - | }
| |
| - |
| |
| - | #menu li {
| |
| - | float: left;
| |
| - | margin-left: 2em;
| |
| - | }
| |
| - |
| |
| - | #menu a {
| |
| - | display: block;
| |
| - | padding: 10px 15px;
| |
| - | letter-spacing: 2px;
| |
| - | text-decoration: none;
| |
| - | text-transform: uppercase;
| |
| - | font-family: 'Archivo Narrow', sans-serif;
| |
| - | font-size: 1.10em;
| |
| - | font-weight: 600;
| |
| - | color: #B6B6B6;
| |
| - | }
| |
| - |
| |
| - | #menu .active a
| |
| - | {
| |
| - | background: #0091E6;
| |
| - | border-radius: 5px;
| |
| - | color: #FFFFFF;
| |
| - | }
| |
| - |
| |
| - | #menu a:hover {
| |
| - | text-decoration: underline;
| |
| - | }
| |
| - |
| |
| - | /** PAGE */
| |
| - |
| |
| - | #page {
| |
| - | overflow: hidden;
| |
| - | width: 900px;
| |
| - | padding: 70px 50px 50px 50px;
| |
| - | background-color: #FFFFFF;
| |
| - | border-radius: 10px 10px 0px 0px;
| |
| - | }
| |
| - |
| |
| - | #page h2
| |
| - | {
| |
| - | margin-bottom: 30px;
| |
| - | }
| |
| - |
| |
| - | /** CONTENT */
| |
| - |
| |
| - | #content {
| |
| - | float: right;
| |
| - | width: 580px;
| |
| - | }
| |
| - |
| |
| - | #content #onecolumn
| |
| - | {
| |
| - | padding-bottom: 30px;
| |
| - | border-bottom: 1px solid #D4D4D4;
| |
| - | }
| |
| - |
| |
| - | #content h2
| |
| - | {
| |
| - | letter-spacing: -1px;
| |
| - | font-size: 3em;
| |
| - | }
| |
| - |
| |
| - | /** SIDEBAR */
| |
| - |
| |
| - | #sidebar {
| |
| - | float: left;
| |
| - | width: 260px;
| |
| - | padding-top: 10px;
| |
| - | }
| |
| - |
| |
| - | #sidebar #sbox1
| |
| - | {
| |
| - | margin-bottom: 40px;
| |
| - | }
| |
| - |
| |
| - | #sidebar #sbox2
| |
| - | {
| |
| - | overflow: hidden;
| |
| - | margin-bottom: 50px;
| |
| - | }
| |
| - |
| |
| - | #sidebar #sbox3
| |
| - | {
| |
| - | overflow: hidden;
| |
| - | }
| |
| - | /** BANNER */
| |
| - |
| |
| - | #banner {
| |
| - | overflow: hidden;
| |
| - | padding: 50px 0px 0px 0px;
| |
| - | background: #A11C47 url(images/banner-bg.png) repeat;
| |
| - | border-radius: 10px 10px 0px 0px;
| |
| - | }
| |
| - |
| |
| - | #banner:before
| |
| - | {
| |
| - | content: '';
| |
| - | width: 100%;
| |
| - | height: 100%;
| |
| - | display: block;
| |
| - | position: absolute;
| |
| - | background: url('images/gradient-bg.png') no-repeat right top;
| |
| - | background-size: 100% 100%;
| |
| - | top: 0px;
| |
| - | right: 0px;
| |
| - | }
| |
| - |
| |
| - |
| |
| - | /* Footer */
| |
| - |
| |
| - | #footer {
| |
| - | overflow: hidden;
| |
| - | width: 900px;
| |
| - | padding: 70px 50px 50px 50px;
| |
| - | background-color: #161616;
| |
| - | border-top: 6px solid #000000;
| |
| - | border-radius: 0px 0px 10px 10px;
| |
| - | }
| |
| - |
| |
| - | #footer h2
| |
| - | {
| |
| - | padding: 0px 0px 50px 0px;
| |
| - | font-weight: 400;
| |
| - | color: #D3D3D3;
| |
| - | }
| |
| - |
| |
| - | #footer p {
| |
| - | color: #4E4E4E;
| |
| - | }
| |
| - |
| |
| - | #footer #fbox1 {
| |
| - | float: left;
| |
| - | width: 260px;
| |
| - | margin-right: 60px;
| |
| - | }
| |
| - |
| |
| - | #footer #fbox2 {
| |
| - | float: left;
| |
| - | width: 260px;
| |
| - | }
| |
| - |
| |
| - | #footer #fbox3 {
| |
| - | float: right;
| |
| - | width: 260px;
| |
| - | }
| |
| - |
| |
| - | #copyright
| |
| - | {
| |
| - | overflow: hidden;
| |
| - | width: 900px;
| |
| - | padding: 50px;
| |
| - | }
| |
| - |
| |
| - | #copyright p
| |
| - | {
| |
| - | text-align: center;
| |
| - | text-shadow: 1px 1px 1px rgba(0,0,0,1);
| |
| - | }
| |
| - |
| |
| - | #copyright a
| |
| - | {
| |
| - | color: #4E4E4E;
| |
| - | }
| |
| - |
| |
| - |
| |
| - | ul.style1
| |
| - | {
| |
| - | margin: 0px;
| |
| - | padding: 0px;
| |
| - | list-style: none;
| |
| - | }
| |
| - |
| |
| - | ul.style1 li
| |
| - | {
| |
| - | padding: 10px 0px 20px 0px;
| |
| - | border-top: 1px solid #242424;
| |
| - | }
| |
| - |
| |
| - | ul.style1 a
| |
| - | {
| |
| - | color: #4E4E4E;
| |
| - | }
| |
| - |
| |
| - | ul.style1 .first
| |
| - | {
| |
| - | padding-top: 0px;
| |
| - | border-top: none;
| |
| - | }
| |
| - |
| |
| - | ul.style2
| |
| - | {
| |
| - | margin: 30px 0px 0px 0px;
| |
| - | padding: 0px;
| |
| - | list-style: none;
| |
| - | }
| |
| - |
| |
| - | ul.style2 li
| |
| - | {
| |
| - | float: left;
| |
| - | margin-right: 10px;
| |
| - | }
| |
| - |
| |
| - | ul.style3
| |
| - | {
| |
| - | margin: 0px;
| |
| - | padding: 0px;
| |
| - | list-style: none;
| |
| - | }
| |
| - |
| |
| - | ul.style3 li
| |
| - | {
| |
| - | padding: 10px 0px 20px 0px;
| |
| - | border-top: 1px solid #E0E0E0;
| |
| - | }
| |
| - |
| |
| - | ul.style3 a
| |
| - | {
| |
| - | color: #4E4E4E;
| |
| - | }
| |
| - |
| |
| - | ul.style3 .first
| |
| - | {
| |
| - | padding-top: 0px;
| |
| - | border-top: none;
| |
| - | }
| |
| - | /** Slider */
| |
| - |
| |
| - | #slider
| |
| - | {
| |
| - | overflow: hidden;
| |
| - | margin: 0 auto;
| |
| - | position: relative;
| |
| - | }
| |
| - |
| |
| - | #slider .button
| |
| - | {
| |
| - | display: inline-block;
| |
| - | background: #0074C6;
| |
| - | color: #ffffff;
| |
| - | text-align: center;
| |
| - | line-height: 50px;
| |
| - | height: 50px;
| |
| - | text-decoration: none;
| |
| - | outline: 0;
| |
| - | border-radius: 8px;
| |
| - | font-size: 1.25em;
| |
| - | border-bottom: solid 2px #0054A6;
| |
| - | text-shadow: 0 1px 1px #003A6C;
| |
| - | }
| |
| - |
| |
| - | #slider .button:hover
| |
| - | {
| |
| - | background: #2094E6;
| |
| - | }
| |
| - |
| |
| - | #slider .viewer
| |
| - | {
| |
| - | width: 900px;
| |
| - | height: 400px;
| |
| - | margin: 0 auto 50px auto;
| |
| - | overflow: hidden;
| |
| - | }
| |
| - |
| |
| - | #slider .viewer .reel
| |
| - | {
| |
| - | display: none;
| |
| - | }
| |
| - |
| |
| - | #slider .viewer .reel .slide
| |
| - | {
| |
| - | position: relative;
| |
| - | width: 900px;
| |
| - | height: 500px;
| |
| - | }
| |
| - |
| |
| - | #slider .viewer .reel h2
| |
| - | {
| |
| - | position: absolute;
| |
| - | top: 230px;
| |
| - | left: 0;
| |
| - | padding: 0px 30px;
| |
| - | line-height: 80px;
| |
| - | background: #111111;
| |
| - | text-align: center;
| |
| - | opacity: 0.75;
| |
| - | font-weight: normal;
| |
| - | font-family: 'Archivo Narrow', sans-serif;
| |
| - | color: #ffffff;
| |
| - | font-size: 4.50em;
| |
| - | }
| |
| - |
| |
| - | #slider .viewer .reel p
| |
| - | {
| |
| - | position: absolute;
| |
| - | top: 310px;
| |
| - | left: 0;
| |
| - | display: block;
| |
| - | padding: 5px 35px;
| |
| - | background: #0074C6;
| |
| - | text-align: center;
| |
| - | opacity: 0.75;
| |
| - | font-family: 'Archivo Narrow', sans-serif;
| |
| - | font-weight: normal;
| |
| - | color: #ffffff;
| |
| - | font-size: 2.00em;
| |
| - | }
| |
| - |
| |
| - | #slider .indicator
| |
| - | {
| |
| - | padding: 30px 0px;
| |
| - | background-color: #7A0C30;
| |
| - | margin: 0 auto 0 auto;
| |
| - | }
| |
| - |
| |
| - | #slider .indicator ul
| |
| - | {
| |
| - | list-style: none;
| |
| - | padding: 0;
| |
| - | margin: 0;
| |
| - | text-align: center;
| |
| - | }
| |
| - |
| |
| - | #slider .indicator ul li
| |
| - | {
| |
| - | display: inline-block;
| |
| - | width: 12px;
| |
| - | height: 12px;
| |
| - | text-indent: -9999em;
| |
| - | background: #970D39;
| |
| - | margin: 0 2px 0 2px;
| |
| - | border-radius: 8px;
| |
| - | }
| |
| - |
| |
| - | #slider .indicator ul li.active
| |
| - | {
| |
| - | background: #C4164E;
| |
| - | }
| |
| - |
| |
| - | #two-column
| |
| - | {
| |
| - | padding-top: 50px;
| |
| - | }
| |
| - |
| |
| - | .box-content
| |
| - | {
| |
| - | overflow: hidden;
| |
| - | margin-bottom: 4em;
| |
| - | }
| |
| - |
| |
| - | .box-content p
| |
| - | {
| |
| - | padding-left: 60px;
| |
| - | }
| |
| - |
| |
| - | .title
| |
| - | {
| |
| - | display: block;
| |
| - | padding-left: 60px;
| |
| - | padding-bottom: 1em;
| |
| - | font-size: 1.70em !important;
| |
| - | font-weight: 600;
| |
| - | color: #333333;
| |
| - | }
| |
| - |
| |
| - | .title01
| |
| - | {
| |
| - | background: url(images/icon01.png) no-repeat left top;
| |
| - | }
| |
| - |
| |
| - | .title02
| |
| - | {
| |
| - | background: url(images/icon02.png) no-repeat left top;
| |
| - | }
| |
| - |
| |
| - | /* List Style 1 */
| |
| - |
| |
| - | .list-style1 {
| |
| - | margin: 0px;
| |
| - | padding: 0px;
| |
| - | list-style: none;
| |
| - | }
| |
| - |
| |
| - | .list-style1 li {
| |
| - | padding: 20px 0px 20px 0px;
| |
| - | border-top: 1px solid #D4D4D4;
| |
| - | }
| |
| - |
| |
| - | .list-style1 .date {
| |
| - | font-weight: bold;
| |
| - | color: #212121;
| |
| - | }
| |
| - |
| |
| - | .list-style1 img {
| |
| - | float: left;
| |
| - | margin-right: 25px;
| |
| - | }
| |
| - |
| |
| - | .list-style1 .first {
| |
| - | padding-top: 0px;
| |
| - | border-top: none;
| |
| - | }
| |
| - |
| |
| - | /* List Style 1 */
| |
| - |
| |
| - | .link-style {
| |
| - | display: inline-block;
| |
| - | margin-top: 10px;
| |
| - | padding: 5px 15px;
| |
| - | background: #0091E6;
| |
| - | border-radius: 5px;
| |
| - | letter-spacing: 1px;
| |
| - | text-decoration: none;
| |
| - | text-transform: uppercase;
| |
| - | color: #FFFFFF;
| |
| - | }
| |
| - |
| |
| - |
| |
| - |
| |
| - |
| |
| - | .testimonial
| |
| - | {
| |
| - | font-style: italic;
| |
| - | color: #878787;
| |
| - | }
| |
| - |
| |
| - | .author
| |
| - | {
| |
| - | padding-top: 20px;
| |
| - | font-style: italic;
| |
| - | }
| |
| - |
| |
| - | .author .name
| |
| - | {
| |
| - | display: block;
| |
| - | padding: 5px 0px;
| |
| - | font-size: 1.2em;
| |
| - | font-weight: 700;
| |
| - | font-style: normal;
| |
| - | }
| |
| - |
| |
| - | .author .position
| |
| - | {
| |
| - | display: block;
| |
| - | padding: 5px 0px;
| |
| - | }
| |
| - |
| |
| - | .author img
| |
| - | {
| |
| - | float: left;
| |
| - | margin-right: 30px;
| |
| - | border-radius: 10px;
| |
| - | border: 5px solid rgba(0,0,0,.1);
| |
| - | }
| |
"
