/* color overwrites
    dark blue: #258dc1
    light blue: #2aabeb
    normal blue: #28a0dc
*/

a {
    color: #2aabeb;
}

a:hover,
a:focus {
    color: #258dc1;
}

.btn-link:hover,
.btn-link:focus {
    color: #258dc1;
}

.nav .dropdown-toggle:hover .caret,
.nav .dropdown-toggle:focus .caret {
    border-top-color: #258dc1;
    border-bottom-color: #258dc1;
}

.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus,
.dropdown-submenu:hover > a,
.dropdown-submenu:focus > a {
    background-color: #2aabeb;
    background-image: -moz-linear-gradient(top, #2aabeb, #28a0dc);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#2aabeb), to(#28a0dc));
    background-image: -webkit-linear-gradient(top, #2aabeb, #28a0dc);
    background-image: -o-linear-gradient(top, #2aabeb, #28a0dc);
    background-image: linear-gradient(to bottom, #2aabeb, #28a0dc);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff2aabeb', endColorstr='#ff28a0dc', GradientType=0);
}

.dropdown-menu > .active > a,
.dropdown-menu > .active > a:hover,
.dropdown-menu > .active > a:focus {
    background-color: #2aabeb;
    background-image: -moz-linear-gradient(top, #2aabeb, #28a0dc);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#2aabeb), to(#28a0dc));
    background-image: -webkit-linear-gradient(top, #2aabeb, #28a0dc);
    background-image: -o-linear-gradient(top, #2aabeb, #28a0dc);
    background-image: linear-gradient(to bottom, #2aabeb, #28a0dc);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff2aabeb', endColorstr='#ff28a0dc', GradientType=0);
}

.btn-primary {
    background-color: #258dc1;
    *background-color: #258dc1;
    background-image: -moz-linear-gradient(top, #2aabeb, #258dc1);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#2aabeb), to(#258dc1));
    background-image: -webkit-linear-gradient(top, #2aabeb, #258dc1);
    background-image: -o-linear-gradient(top, #2aabeb, #258dc1);
    background-image: linear-gradient(to bottom, #2aabeb, #258dc1);
    border-color: #258dc1 #258dc1 #002a80;
    border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff2aabeb', endColorstr='#ff258dc1', GradientType=0);
    filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active,
.btn-primary.disabled,
.btn-primary[disabled] {
    background-color: #258dc1;
    *background-color: #258dc1;
}

.btn-group.open .btn-primary.dropdown-toggle {
    background-color: #258dc1;
}

.btn-link {
    color: #2aabeb;
}

.nav-list > .active > a,
.nav-list > .active > a:hover,
.nav-list > .active > a:focus {
    background-color: #2aabeb;
}

.nav-pills > .active > a,
.nav-pills > .active > a:hover,
.nav-pills > .active > a:focus {
    background-color: #2aabeb;
}

.nav .dropdown-toggle .caret {
    border-top-color: #2aabeb;
    border-bottom-color: #2aabeb;
}

a.thumbnail:hover,
a.thumbnail:focus {
    border-color: #2aabeb;
}

/* GLOBAL STYLES
    -------------------------------------------------- */
/* Padding below the footer and lighter body text */

body {
    padding-bottom: 40px;
    color: #5a5a5a;
}

/* CUSTOMIZE THE NAVBAR
-------------------------------------------------- */

/* Special class on .container surrounding .navbar, used for positioning it into place. */
.navbar-wrapper {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    z-index: 10;
    margin-top: 20px;
    margin-bottom: -90px; /* Negative margin to pull up carousel. 90px is roughly margins and height of navbar. */
}

.navbar-wrapper .navbar {

}

/* Remove border and change up box shadow for more contrast */
.navbar .navbar-inner {
    border: 0;
    -webkit-box-shadow: 0 2px 10px rgba(0, 0, 0, .25);
    -moz-box-shadow: 0 2px 10px rgba(0, 0, 0, .25);
    box-shadow: 0 2px 10px rgba(0, 0, 0, .25);
}

/* Downsize the brand/project name a bit */
.navbar .brand {
    padding: 8px 20px 7px; /* Increase vertical padding to match navbar links */
    font-size: 16px;
    font-weight: bold;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, .5);
    background: #fff;
    border-radius: 4px;
}

.navbar .brand img {
    width: 154px;
    height: 35px;
}

/* Navbar links: increase padding for taller navbar */
.navbar .nav > li > a {
    padding: 15px 20px;
    font-weight: bold;
}

/* Offset the responsive button for proper vertical alignment */
.navbar .btn-navbar {
    margin-top: 10px;
}

.dropdown-menu {
    top: 95%;
}

/* Subhead (other pages)
------------------------- */
.subhead {
    text-align: left;
    border-bottom: 1px solid #ddd;
}

.subhead h1 {
    font-size: 60px;
}

.subhead p {
    margin-bottom: 20px;
}

.subhead .navbar {
    display: none;
}

/* Jumbotrons
-------------------------------------------------- */

/* Base class
------------------------- */
.jumbotron {
    position: relative;
    padding: 100px 0 20px;
    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; /* Old browsers */
    background: -moz-linear-gradient(45deg, #258dc1 0%, #2aabeb 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left bottom, right top, color-stop(0%, #258dc1), color-stop(100%, #2aabeb)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(45deg, #258dc1 0%, #2aabeb 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(45deg, #258dc1 0%, #2aabeb 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(45deg, #258dc1 0%, #2aabeb 100%); /* IE10+ */
    background: linear-gradient(45deg, #258dc1 0%, #2aabeb 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#258dc1', endColorstr='#2aabeb', GradientType=1); /* IE6-9 fallback on horizontal gradient */
    -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 h1 {
    font-size: 80px;
    font-weight: bold;
    letter-spacing: -1px;
    line-height: 1;
}

.jumbotron p {
    font-size: 24px;
    font-weight: 300;
    line-height: 1.25;
    margin-bottom: 30px;
}

/* Link styles (used on .masthead-links as well) */
.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 a:hover {
    color: #fff;
    text-shadow: 0 0 10px rgba(255, 255, 255, .25);
}

/* Download button */
.masthead .btn {
    padding: 19px 24px;
    font-size: 24px;
    font-weight: 200;
    color: #fff; /* redeclare to override the `.jumbotron a` */
    border: 0;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
    -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1), 0 1px 5px rgba(0, 0, 0, .25);
    -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1), 0 1px 5px rgba(0, 0, 0, .25);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1), 0 1px 5px rgba(0, 0, 0, .25);
    -webkit-transition: none;
    -moz-transition: none;
    transition: none;
}

.masthead .btn:hover {
    -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1), 0 1px 5px rgba(0, 0, 0, .25);
    -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1), 0 1px 5px rgba(0, 0, 0, .25);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1), 0 1px 5px rgba(0, 0, 0, .25);
}

.masthead .btn:active {
    -webkit-box-shadow: inset 0 2px 4px rgba(0, 0, 0, .1), 0 1px 0 rgba(255, 255, 255, .1);
    -moz-box-shadow: inset 0 2px 4px rgba(0, 0, 0, .1), 0 1px 0 rgba(255, 255, 255, .1);
    box-shadow: inset 0 2px 4px rgba(0, 0, 0, .1), 0 1px 0 rgba(255, 255, 255, .1);
}

/* Pattern overlay
------------------------- */
.jumbotron .container {
    position: relative;
    z-index: 2;
    text-align: left;
}

.jumbotron:after {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    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;
    }

}

/* Sidenav for Docs
-------------------------------------------------- */

.bs-docs-sidenav {
    width: 228px;
    margin: 30px 0 0;
    padding: 0;
    background-color: #fff;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
    -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, .065);
    -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, .065);
    box-shadow: 0 1px 4px rgba(0, 0, 0, .065);
}

.bs-docs-sidenav li a {
    display: block;
    width: 190px    \9;
    margin: 0 0 -1px;
    padding: 8px 14px;
    border: 1px solid #e5e5e5;
}

.bs-docs-sidenav li li a {
    padding-left: 20px;
}

.bs-docs-sidenav li li li a {
    padding-left: 30px;
}

.bs-docs-sidenav li li li a {
    padding-left: 40px;
}

.bs-docs-sidenav li ul {
    padding: 0;
    list-style: none;
    margin: 0;
}

.bs-docs-sidenav > li:first-child > a {
    -webkit-border-radius: 6px 6px 0 0;
    -moz-border-radius: 6px 6px 0 0;
    border-radius: 6px 6px 0 0;
}

.bs-docs-sidenav > li:last-child > a {
    -webkit-border-radius: 0 0 6px 6px;
    -moz-border-radius: 0 0 6px 6px;
    border-radius: 0 0 6px 6px;
}

.bs-docs-sidenav > .active > a {
    position: relative;
    z-index: 2;
    padding: 9px 15px;
    border: 0;
    text-shadow: 0 1px 0 rgba(0, 0, 0, .15);
    -webkit-box-shadow: inset 1px 0 0 rgba(0, 0, 0, .1), inset -1px 0 0 rgba(0, 0, 0, .1);
    -moz-box-shadow: inset 1px 0 0 rgba(0, 0, 0, .1), inset -1px 0 0 rgba(0, 0, 0, .1);
    box-shadow: inset 1px 0 0 rgba(0, 0, 0, .1), inset -1px 0 0 rgba(0, 0, 0, .1);
}

.bs-docs-sidenav .active>a {
    font-weight: bold;
}

/* Featurettes
------------------------- */

.featurette-divider {
    margin: 80px 0; /* Space out the Bootstrap <hr> more */
}

.featurette {
    overflow: hidden; /* Vertically center images part 2: clear their floats. */
}

/* Give some space on the sides of the floated elements so text doesn't run right into it. */
.featurette-image.pull-left {
    margin-right: 40px;
}

.featurette-image.pull-right {
    margin-left: 40px;
    margin-bottom: 10px;
}

/* Thin out the marketing headings */
.featurette-heading {
    font-size: 50px;
    font-weight: 300;
    line-height: 1;
    letter-spacing: -1px;
}

.breadcrumb {
    margin-top: 20px;
}

/* Footer
-------------------------------------------------- */

.footer {
    text-align: center;
    padding: 30px 0;
    margin-top: 70px;
    border-top: 1px solid #e5e5e5;
    background-color: #f5f5f5;
}

.footer p {
    margin-bottom: 0;
    color: #777;
}

.footer-links {
    margin: 10px 0;
}

.footer-links li {
    display: inline;
    padding: 0 2px;
}

.footer-links li:first-child {
    padding-left: 0;
}

#content section {
    margin-bottom: 30px;
}

.thumbnail-examples .img-container {
    height: 150px;
    background: url(/website/static/img/transparent-background-placeholder.png) repeat top left;
}

.thumbnail-examples .row-fluid {
    margin-bottom: 20px;
    border-bottom: 1px solid #5a5a5a;
    padding-bottom: 10px;
}

.image-hotspot {
    position: absolute;
    background: rgba(235, 105, 9, 0.2);
}

.image-marker {
    position: absolute;
    width: 20px;
    height: 20px;
    border-radius: 10px;
    background: #2aabeb;
}

/* RESPONSIVE */

/* Tablet to desktop
------------------------- */
@media (min-width: 768px) and (max-width: 979px) {
    /* Widen masthead and social buttons to fill body padding */
    .jumbotron {
        margin-top: -20px; /* Offset bottom margin on .navbar */
    }
}

/* Tablet
------------------------- */
@media (max-width: 767px) {
    /* Widen masthead and social buttons to fill body padding */
    .jumbotron {
        padding: 40px 20px;
        margin-top: -20px; /* Offset bottom margin on .navbar */
        margin-right: -20px;
        margin-left: -20px;
    }
}

/* Landscape phones
------------------------- */
@media (max-width: 480px) {
    /* Downsize the jumbotrons */
    .jumbotron h1 {
        font-size: 45px;
    }

    .jumbotron p,
    .jumbotron .btn {
        font-size: 18px;
    }

    .jumbotron .btn {
        display: block;
        margin: 0 auto;
    }
}

@media (max-width: 979px) {

    .container.navbar-wrapper {
        margin-bottom: 0;
        width: auto;
    }

    .navbar-inner {
        border-radius: 0;
        margin: -20px 0;
    }
}

@media (max-width: 767px) {

    .navbar-inner {
        margin: -20px;
    }
}

@media (max-width: 979px) {
    .featurette {
        height: auto;
        padding: 0;
    }

    .featurette-image.pull-left,
    .featurette-image.pull-right {
        display: block;
        float: none;
        max-width: 40%;
        margin: 0 auto 20px;
    }

    .pimcore_video {
        width: 100% !important;
        height: 175px !important;
    }
}

@media (max-width: 767px) {

    .featurette-heading {
        font-size: 30px;
    }

    .featurette .lead {
        font-size: 18px;
        line-height: 1.5;
    }
}

@media (min-width: 1200px) {
    .bs-docs-sidenav {
        width: 258px;
    }

    .bs-docs-sidenav > li > a {
        width: 230px  \9; /* Override the previous IE8-9 hack */
    }
}

/* Desktop
------------------------- */
@media (max-width: 980px) {
    /* When affixed, space properly */
    .bs-docs-sidenav {
        top: 0;
        width: 218px;
        margin-top: 30px;
        margin-right: 0;
    }
}

/* Tablet to desktop
------------------------- */
@media (min-width: 768px) and (max-width: 979px) {

    /* Widen masthead and social buttons to fill body padding */
    .jumbotron {
        margin-top: -20px; /* Offset bottom margin on .navbar */
    }

    /* Adjust sidenav width */
    .bs-docs-sidenav {
        width: 166px;
        margin-top: 20px;
    }

    .bs-docs-sidenav.affix {
        top: 0;
    }
}

/* Tablet
------------------------- */
@media (max-width: 767px) {
    /* Sidenav */
    .bs-docs-sidenav {
        width: auto;
        margin-bottom: 20px;
    }

    .bs-docs-sidenav.affix {
        position: static;
        width: auto;
        top: 0;
    }
}

dt {
    float: left;
    margin: 10px;
    width: 200px;
    
} 
.errors {
    border:  1px solid #CC3D3D;
}
.description {
    color: #969696;
}