397 lines
11 KiB
CSS
Executable File
397 lines
11 KiB
CSS
Executable File
/* Put additional vertical space after the content */
|
|
.ss-section {
|
|
margin-bottom: 2ex;
|
|
}
|
|
|
|
/* Navbar language selector */
|
|
.navbar .ss-external {
|
|
font-family: roman;
|
|
font-style: italic;
|
|
padding-left: 1em;
|
|
}
|
|
.navbar .ss-external + .ss-external {
|
|
padding-left: 0;
|
|
}
|
|
.navbar .ss-external a {
|
|
text-shadow: none !important;
|
|
}
|
|
|
|
/* Responsive carousel slides */
|
|
.carousel-inner img {
|
|
display: block;
|
|
max-width: 100%;
|
|
margin: auto;
|
|
}
|
|
|
|
/* Block quotations overrides */
|
|
blockquote {
|
|
font-size: 110%;
|
|
}
|
|
|
|
/* Pagination addendum */
|
|
.pagination .ss-borderless {
|
|
border-top: 0;
|
|
border-bottom: 0;
|
|
}
|
|
|
|
/* AutoTOC styling */
|
|
#ss-toc {
|
|
margin-bottom: 20px;
|
|
}
|
|
#ss-toc.affix {
|
|
position: static !important;
|
|
}
|
|
#ss-toc.affix-top {
|
|
position: static !important;
|
|
}
|
|
#ss-toc strong {
|
|
font-variant: small-caps;
|
|
margin-bottom: 10px;
|
|
}
|
|
/* The affix of #ss-toc is enabled only for md and lg media */
|
|
@media (min-width: 992px) {
|
|
#ss-toc.affix {
|
|
position: fixed !important;
|
|
top: 0px !important;
|
|
/* I have to specify it explicitely because when #ss-toc is at
|
|
* fixed position, its width is no more referenced to the
|
|
* parent container. */
|
|
width: 263px;
|
|
}
|
|
}
|
|
|
|
/* Fotorama customizations */
|
|
.fotorama__caption {
|
|
text-align: center;
|
|
margin-bottom: 4px;
|
|
}
|
|
.fotorama__caption__wrap {
|
|
background-color: rgba(0, 0, 0, 0.5) !important;
|
|
color: #fff;
|
|
font-size: 90%;
|
|
font-weight: normal;
|
|
text-shadow: 1px 1px 1px #000;
|
|
}
|
|
.fotorama__caption__wrap p:last-child {
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
/* Zoomable images */
|
|
.zoom {
|
|
/* By default (without explicit pull) floats on the right */
|
|
float: right;
|
|
clear: right;
|
|
margin-left: 15px;
|
|
}
|
|
.pull-left .zoom {
|
|
clear: left;
|
|
margin-left: 0;
|
|
margin-right: 15px;
|
|
}
|
|
.zoom img {
|
|
background-color: #eee;
|
|
box-shadow: 0 0 6px 2px #ccc;
|
|
-moz-box-shadow: 0 0 6px 2px #ccc;
|
|
-webkit-box-shadow: 0 0 6px 2px #ccc;
|
|
padding: 8px;
|
|
margin: 6px;
|
|
border: 1px solid rgba(0, 0, 0, 0.4);
|
|
border-radius: 5px;
|
|
}
|
|
.zoom img:hover {
|
|
background-color: #fff;
|
|
box-shadow: 0 0 6px 2px #eee;
|
|
-moz-box-shadow: 0 0 6px 2px #eee;
|
|
-webkit-box-shadow: 0 0 6px 2px #eee;
|
|
border-color: rgba(0, 0, 0, 0.2);
|
|
}
|
|
|
|
/* Search results page */
|
|
.ss-results ul {
|
|
list-style: none;
|
|
padding-left: 0;
|
|
}
|
|
.ss-results li {
|
|
padding: 4px 0;
|
|
}
|
|
|
|
/* Provide a way to put inside scrollable boxes chunks of arbitrary
|
|
* HTML code (as required by e.g. privacy policy) */
|
|
.ss-boxed {
|
|
height: 30ex;
|
|
overflow: auto;
|
|
padding: 4px 6px;
|
|
font-size: 14px;
|
|
line-height: 20px;
|
|
color: #555;
|
|
vertical-align: middle;
|
|
-webkit-border-radius: 4px;
|
|
-moz-border-radius: 4px;
|
|
border-radius: 4px;
|
|
background-color: #fff;
|
|
border: 1px solid #ccc;
|
|
}
|
|
.ss-boxed > * {
|
|
margin-top: 0;
|
|
}
|
|
|
|
/* Form overriding */
|
|
form .tab-content {
|
|
padding: 15px 0;
|
|
}
|
|
/* Support for two columns forms, required by silverstripe-adg */
|
|
.ss-2col {
|
|
position: relative;
|
|
}
|
|
.ss-2col .form-group {
|
|
width: 30%;
|
|
float: left;
|
|
}
|
|
.ss-2col .form-group label {
|
|
width: 60%;
|
|
}
|
|
.ss-2col br {
|
|
clear: left;
|
|
}
|
|
.ss-2col .col-sm-offset-3 {
|
|
margin-left: 60%;
|
|
}
|
|
.form-group .ss-without-label {
|
|
margin: 20px 0;
|
|
}
|
|
form legend .btn {
|
|
margin: 6px;
|
|
}
|
|
|
|
/* Company data, usually used in the Sitemap.ss footer */
|
|
.ss-company {
|
|
margin-left: 0 !important;
|
|
margin-bottom: 0 !important;
|
|
}
|
|
.ss-company img {
|
|
display: block;
|
|
float: left;
|
|
padding: 0;
|
|
margin: 2px 8px 0 0;
|
|
}
|
|
.ss-company strong {
|
|
font-size: 17.5px;
|
|
text-shadow: 0px 1px 0px rgba(255,255,255,.9);
|
|
}
|
|
.ss-company small {
|
|
vertical-align: top;
|
|
}
|
|
.ss-company i {
|
|
font-style: normal;
|
|
display: block;
|
|
margin: 4px 4px 0 20px;
|
|
float: left;
|
|
clear: left;
|
|
min-width: 18px;
|
|
}
|
|
|
|
/* Arbitrary nested menu support, required by silverstripe-gtkdoc */
|
|
.dropdown-submenu {
|
|
position: relative;
|
|
}
|
|
.dropdown-submenu > .dropdown-menu {
|
|
top: 0;
|
|
left: 100%;
|
|
margin-top: -6px;
|
|
margin-left: -1px;
|
|
-webkit-border-radius: 0 6px 6px 6px;
|
|
-moz-border-radius: 0 6px 6px 6px;
|
|
border-radius: 0 6px 6px 6px;
|
|
}
|
|
.dropdown-submenu > a:after {
|
|
display: block;
|
|
content: " ";
|
|
float: right;
|
|
width: 0;
|
|
height: 0;
|
|
border-color: transparent;
|
|
border-style: solid;
|
|
border-width: 5px 0 5px 5px;
|
|
border-left-color: #cccccc;
|
|
margin-top: 5px;
|
|
margin-right: -10px;
|
|
}
|
|
.dropdown-submenu:hover>a:after {
|
|
border-left-color: #ffffff;
|
|
}
|
|
.dropdown-submenu:hover > .dropdown-menu {
|
|
display: block;
|
|
}
|
|
.dropdown-submenu.pull-left{
|
|
float: none;
|
|
}
|
|
.dropdown-submenu.pull-left>.dropdown-menu{
|
|
left: -100%;
|
|
margin-left: 10px;
|
|
-webkit-border-radius: 6px 0 6px 6px;
|
|
-moz-border-radius: 6px 0 6px 6px;
|
|
border-radius: 6px 0 6px 6px;
|
|
}
|
|
|
|
/* Support for 2 level nesting in nav-stacked */
|
|
ul.nav-stacked > li > a > i {
|
|
float: right;
|
|
}
|
|
ul.nav-stacked ul {
|
|
margin-bottom: 0;
|
|
font-size: 90%;
|
|
}
|
|
ul.nav-stacked ul > li > a {
|
|
padding-left: 2em;
|
|
}
|
|
ul.nav-stacked ul > li:first-child > a {
|
|
border-radius: 0;
|
|
border-top: 0;
|
|
}
|
|
ul.nav-stacked ul > li:last-child:visible > a {
|
|
border-radius: 0;
|
|
border-bottom: 0;
|
|
}
|
|
.nav-stacked > .active > a,
|
|
.nav-stacked > .active > a:hover {
|
|
color: #ffffff;
|
|
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.2);
|
|
background-color: #0088cc;
|
|
cursor: pointer;
|
|
}
|
|
.tooltip-inner {
|
|
width: 20em;
|
|
}
|
|
|
|
/**
|
|
* Hovering content component, i.e. new content that appears above default
|
|
* content when hovering with the mouse. Based on a snippet by mouse0270:
|
|
* http://bootsnipp.com/mouse0270/snippets/VQOR
|
|
* The HTML code should be along these lines:
|
|
*
|
|
* <div class="ss-hover">
|
|
* <div>
|
|
* $hover_content
|
|
* </div>
|
|
* $default_content
|
|
* </div>
|
|
*
|
|
* This is a typical use case (text over an image):
|
|
*
|
|
* <div class="col-md-3">
|
|
* <div class="ss-hover">
|
|
* <div>
|
|
* <h2>This is a title</h2>
|
|
* <p>This is a description.</p>
|
|
* <p class="pull-right"><a class="btn btn-primary" href="#">Link</a></p>
|
|
* </div>
|
|
* <img src="http://lorempixel.com/400/300/sports/1/" alt="...">
|
|
* </div>
|
|
* </div>
|
|
*/
|
|
.ss-hover {
|
|
position: relative;
|
|
overflow: hidden;
|
|
margin-top: 15px;
|
|
margin-bottom: 15px;
|
|
box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.80);
|
|
-moz-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.80);
|
|
-webkit-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.80);
|
|
border-radius: 4px;
|
|
-moz-border-radius: 4px;
|
|
-webkit-border-radius: 4px;
|
|
}
|
|
.ss-hover > div {
|
|
position: absolute;
|
|
top: -100%;
|
|
right: 0;
|
|
background: rgba(0, 160, 160, 0.8);
|
|
width: 100%;
|
|
height: 100%;
|
|
padding: 2%;
|
|
text-align: center;
|
|
z-index: 2;
|
|
-webkit-transition: all 0.5s ease-in-out;
|
|
-moz-transition: all 0.5s ease-in-out;
|
|
-o-transition: all 0.5s ease-in-out;
|
|
-ms-transition: all 0.5s ease-in-out;
|
|
transition: all 0.5s ease-in-out;
|
|
}
|
|
.ss-hover:hover > div {
|
|
top: 0%;
|
|
}
|
|
.ss-hover h1, .ss-hover h2, .ss-hover h3,
|
|
.ss-hover h4, .ss-hover h5, .ss-hover h6 {
|
|
color: #033C73 !important;
|
|
text-shadow: 0 1px 2px #0ff;
|
|
}
|
|
.ss-hover p {
|
|
color: #fff;
|
|
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
|
|
font-size: larger;
|
|
margin-bottom: 20px;
|
|
}
|
|
|
|
/**
|
|
* The following CSS code is borrowed directly from colorbox examples
|
|
*/
|
|
|
|
/*
|
|
Colorbox Core Style:
|
|
The following CSS is consistent between example themes and should not be altered.
|
|
*/
|
|
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
|
|
#cboxWrapper {max-width:none;}
|
|
#cboxOverlay{position:fixed; width:100%; height:100%;}
|
|
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
|
|
#cboxContent{position:relative;}
|
|
#cboxLoadedContent{overflow:auto; -webkit-overflow-scrolling: touch;}
|
|
#cboxTitle{margin:0;}
|
|
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;}
|
|
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
|
|
.cboxPhoto{float:left; margin:auto; border:0; display:block; max-width:none; -ms-interpolation-mode:bicubic;}
|
|
.cboxIframe{width:100%; height:100%; display:block; border:0;}
|
|
#colorbox, #cboxContent, #cboxLoadedContent{box-sizing:content-box; -moz-box-sizing:content-box; -webkit-box-sizing:content-box;}
|
|
|
|
/*
|
|
User Style:
|
|
Change the following styles to modify the appearance of Colorbox. They are
|
|
ordered & tabbed in a way that represents the nesting of the generated HTML.
|
|
*/
|
|
#cboxOverlay{background:#000;}
|
|
#colorbox{outline:0;}
|
|
#cboxTopLeft{width:14px; height:14px; background:url(images/controls.png) no-repeat 0 0;}
|
|
#cboxTopCenter{height:14px; background:url(images/border.png) repeat-x top left;}
|
|
#cboxTopRight{width:14px; height:14px; background:url(images/controls.png) no-repeat -36px 0;}
|
|
#cboxBottomLeft{width:14px; height:43px; background:url(images/controls.png) no-repeat 0 -32px;}
|
|
#cboxBottomCenter{height:43px; background:url(images/border.png) repeat-x bottom left;}
|
|
#cboxBottomRight{width:14px; height:43px; background:url(images/controls.png) no-repeat -36px -32px;}
|
|
#cboxMiddleLeft{width:14px; background:url(images/controls.png) repeat-y -175px 0;}
|
|
#cboxMiddleRight{width:14px; background:url(images/controls.png) repeat-y -211px 0;}
|
|
#cboxContent{background:#fff; overflow:visible;}
|
|
.cboxIframe{background:#fff;}
|
|
#cboxError{padding:50px; border:1px solid #ccc;}
|
|
#cboxLoadedContent{margin-bottom:5px;}
|
|
#cboxLoadingOverlay{background:url(images/loading_background.png) no-repeat center center;}
|
|
#cboxLoadingGraphic{background:url(images/loading.gif) no-repeat center center;}
|
|
#cboxTitle{position:absolute; bottom:-25px; left:0; text-align:center; width:100%; font-weight:bold; color:#7C7C7C;}
|
|
#cboxCurrent{position:absolute; bottom:-25px; left:58px; font-weight:bold; color:#7C7C7C;}
|
|
|
|
/* these elements are buttons, and may need to have additional styles reset to avoid unwanted base styles */
|
|
#cboxPrevious, #cboxNext, #cboxSlideshow, #cboxClose {border:0; padding:0; margin:0; overflow:visible; position:absolute; bottom:-29px; background:url(images/controls.png) no-repeat 0px 0px; width:23px; height:23px; text-indent:-9999px;}
|
|
|
|
/* avoid outlines on :active (mouseclick), but preserve outlines on :focus (tabbed navigating) */
|
|
#cboxPrevious:active, #cboxNext:active, #cboxSlideshow:active, #cboxClose:active {outline:0;}
|
|
|
|
#cboxPrevious{left:0px; background-position: -51px -25px;}
|
|
#cboxPrevious:hover{background-position:-51px 0px;}
|
|
#cboxNext{left:27px; background-position:-75px -25px;}
|
|
#cboxNext:hover{background-position:-75px 0px;}
|
|
#cboxClose{right:0; background-position:-100px -25px;}
|
|
#cboxClose:hover{background-position:-100px 0px;}
|
|
|
|
.cboxSlideshow_on #cboxSlideshow{background-position:-125px 0px; right:27px;}
|
|
.cboxSlideshow_on #cboxSlideshow:hover{background-position:-150px 0px;}
|
|
.cboxSlideshow_off #cboxSlideshow{background-position:-150px -25px; right:27px;}
|
|
.cboxSlideshow_off #cboxSlideshow:hover{background-position:-125px 0px;}
|