diff options
Diffstat (limited to 'docs/website/css/main.css')
| -rw-r--r-- | docs/website/css/main.css | 260 |
1 files changed, 260 insertions, 0 deletions
diff --git a/docs/website/css/main.css b/docs/website/css/main.css new file mode 100644 index 0000000000..db9c4c90de --- /dev/null +++ b/docs/website/css/main.css @@ -0,0 +1,260 @@ +/* + * Author: Carlos Alvarez + * URL: http://alvarez.is + * + * Project Name: FLATTY - Free Bootstrap 3 Theme + * Version: 1.0 + * URL: http://blacktie.co + */ + +body { + background-color: #f2f2f2; + font-family: 'Roboto', sans-serif; + font-weight: 300; + font-size: 16px; + color: #555; + + -webkit-font-smoothing: antialiased; + -webkit-overflow-scrolling: touch; +} + +/* Titles */ +h1, h2, h3, h4, h5, h6 { + font-family: 'Roboto', sans-serif; + font-weight: 300; + color: #333; +} + +h1 { + font-size: 40px; +} + +h3 { + color: #95a5a6; + font-weight: 400; +} + +h4 { + color: #95a5a6; + font-weight: 400; + font-size: 20px; +} + +.ellipsis p { + margin-bottom:10px; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; +} + +.centered { + text-align: center; +} + +/* Links */ +a { + color: #3498db; + word-wrap: break-word; + + -webkit-transition: color 0.1s ease-in, background 0.1s ease-in; + -moz-transition: color 0.1s ease-in, background 0.1s ease-in; + -ms-transition: color 0.1s ease-in, background 0.1s ease-in; + -o-transition: color 0.1s ease-in, background 0.1s ease-in; + transition: color 0.1s ease-in, background 0.1s ease-in; +} + +a:hover, +a:focus { + color: #7b7b7b; + text-decoration: none; + outline: 0; +} + +a:before, +a:after { + -webkit-transition: color 0.1s ease-in, background 0.1s ease-in; + -moz-transition: color 0.1s ease-in, background 0.1s ease-in; + -ms-transition: color 0.1s ease-in, background 0.1s ease-in; + -o-transition: color 0.1s ease-in, background 0.1s ease-in; + transition: color 0.1s ease-in, background 0.1s ease-in; +} + + hr { + display: block; + height: 1px; + border: 0; + border-top: 1px solid #ccc; + margin: 1em 0; + padding: 0; +} + +.navbar-default { + background-color: #3498db; + border-color: transparent; +} + +.navbar-default .navbar-brand { + color: white; +} + +.navbar-default .navbar-nav > li > a { + color: white; +} + +/* Helpers */ + +.mt { + margin-top: 40px; + margin-bottom: 40px; +} + +.nh { + margin-top: 80px; + margin-bottom: 40px; +} + +.form-control { + height: 42px; + font-size: 18px; + width: 280px; +} + +i { + margin: 8px; + color: #3498db; +} + + +/* HeaderWrap */ +#headerwrap { + /* background: url(../img/bg01.jpg) no-repeat center top; */ + background-color: #3498db; + margin-top: -20px; + padding-top:120px; + background-attachment: relative; + background-position: center center; + min-height: 400px; + max-height: 800px; + width: 100%; + + -webkit-background-size: 100%; + -moz-background-size: 100%; + -o-background-size: 100%; + background-size: 100%; + + -webkit-background-size: cover; + -moz-background-size: cover; + -o-background-size: cover; + background-size: cover; +} + +#headerwrap h1 { + color: white; + font-size: 60px; + font-weight: bold; + letter-spacing: 1px; +} + +#menubutton { + max-height: 50px; + margin-top: 6px; + padding-top: 15px; + margin-left: 10px; +} + +.panel-sponsor { + min-height: 300px; + text-align: justify; + text-justify: inter-word; +} + +@media (min-width: 768px) and (max-width: 991px) { + .navbar-collapse.collapse { + display: none !important; + } + .navbar-collapse.collapse.in { + display: block !important; + } + .navbar-header .collapse, .navbar-toggle { + display:block !important; + } + .navbar-header { + float:none; + } + .navbar-collapse { + overflow:hidden; + } + #menubutton { + margin-right: 40px; + width: 45px; + } + .text-shrink { + visibility: hidden; + } +} + +@media (max-width:767px) { + #menubutton { + max-height: 50px; + margin-top: 6px; + padding-top: 15px; + margin-left: 15px; + margin-right: 15px; + } +} + +/* entire container, keeps perspective */ +.flip-container { + perspective: 1000; +} + /* flip the pane when hovered */ + .flip-container:hover .flipper, .flip-container.hover .flipper { + transform: rotateY(180deg); + } + +.flip-container, .front, .back { + width: 180px; + height: 180px; +} + +/* flip speed goes here */ +.flipper { + transition: 0.6s; + transform-style: preserve-3d; + + position: relative; +} + +/* hide back of pane during swap */ +.front, .back { + backface-visibility: hidden; + + position: absolute; + top: 0; + left: 0; +} + +/* front pane, placed above back */ +.front { + z-index: 2; + /* for firefox 31 */ + transform: rotateY(0deg); +} + +/* back, initially hidden pane */ +.back { + transform: rotateY(180deg); +} + +.back img { + -moz-transform: scaleX(-1); + -o-transform: scaleX(-1); + -webkit-transform: scaleX(-1); + transform: scaleX(-1); + filter: FlipH; + -ms-filter: "FlipH"; +} + +.panel-box p { + height: 1.5em; +} |
