﻿@charset "UTF-8";

@import url('./bootstrap/css/bootstrap.min.css');

html, body {
    background-color: #ececec;
    color: #333;
    font-size: 13px;
    font-family: "Open Sans",Verdana,Arial,Helvetica,sans-serif;
    line-height: 22px
}

body, th, td, table, h1, h2, h3, h4, h5, h6, .Head, .SubHead, .SubSubHead, .Normal, .NormalBold, .NormalRed, .NormalTextBox, .NormalDisabled, a:link, a:visited, a:hover, input, .CommandButton {
    font-family: "Open Sans",Verdana,Arial,Helvetica,sans-serif
}

em {
    font-style: italic;
    letter-spacing: 0
}

small {
    font-size: 12px;
    letter-spacing: 0
}

h1, h2, h3, h4, h5, h6 {
    color: #333;
    font-family: "Droid Serif", "Open Sans",Verdana,Arial,Helvetica,sans-serif;
    font-weight: normal;
    margin: 15px 0;
    line-height: 30px
}

h1 {
    font-size: 18px
}

h2, h2 .Head {
    font-size: 17px
}

h3, h3 .Head {
    font-size: 16px;
    line-height: 26px
}

h4, h4 .Head {
    font-size: 15px;
    line-height: 22px
}

p {
    font-size: 13px;
    margin: 15px 0;
    line-height: 22px
}

img {
    max-width: 100% !important
}

a, a:link, a:visited, a:active {
    color: #1f82c1;
    font-size: 13px;
    text-decoration: none;
    outline: 0
}

    a:hover {
        color: #1f82c1;
        text-decoration: none;
        outline: 0
    }

ul {
    margin: 0;
    padding: 0;
    list-style: inside disc
}

    ul li {
        font-size: 13px;
        line-height: 24px
    }

    ul.list-style-outside {
        margin-left: 16px;
        padding: 0;
        list-style: outside disc
    }

        ul.list-style-outside li {
            padding-left: 7px
        }

hr {
    clear: both;
    height: 0;
    border-top: 1px solid #d8d8da;
    margin: 15px 0
}

.separation-line {
    clear: both;
    height: 1px;
    margin: 15px 0;
    border-top: 1px dotted #ccc
}

.separation-line-margin-top-0 {
    clear: both;
    height: 1px;
    margin: 0 0 15px 0;
    border-top: 1px dotted #ccc
}

img {
    border: 0
}

.imgLeft {
    float: left;
    margin-right: 30px;
    margin-bottom: 30px
}

.imgRight {
    float: right;
    margin-left: 30px;
    margin-bottom: 30px
}

.imgBorder {
    border: solid 3px #fff
}

.imgPolaroid {
    color: #a6a6a6;
    font-size: 12px;
    text-align: left;
    padding: 13px 13px 17px 13px;
    background-color: #fff;
    box-shadow: 0 1px 2px #ccc
}

    .imgPolaroid img {
        margin-bottom: 12px
    }

ol li {
    list-style-type: decimal;
    margin-bottom: 8px;
    vertical-align: top
}

ol ol {
    margin-top: 8px;
    margin-left: 30px
}

    ol ol li {
        list-style-type: lower-roman
    }

    ol ol ol li {
        list-style-type: lower-alpha
    }

ol ul li {
    list-style-type: lower-roman
}

table.tableDefault {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
    background-color: transparent
}

    table.tableDefault th, table.tableDefault td {
        font-size: 12px;
        padding: 8px
    }

    table.tableDefault th {
        font-weight: bold;
        text-align: left;
        border-bottom: solid 2px #aaa;
        background-color: #d7d7d7
    }

    table.tableDefault td {
        border-bottom: solid 1px #d9d9d9
    }

    table.tableDefault tr:nth-child(odd) {
        background: transparent
    }

    table.tableDefault tr:nth-child(even) {
        background: #e3e4e6
    }

.tableDefault tbody tr:hover td {
    color: #111
}

input, select, textarea {
    border: 1px solid #e1e1e1;
    width: 20%;
    padding: 5px 6px 7px 6px;
    color: #333;
    transition: border-color 0.25s
}

    input:focus, select:focus, textarea:focus {
        border: 1px solid #00b8f1
    }

.navbar .brand {
    display: inline-block;
    margin-left: -23px !important
}

button.primaryButton, a.primaryButton {
    display: inline-block;
    padding: 12px 20px;
    margin-bottom: 5px;
    background-color: #3B96B6;
    background: -moz-linear-gradient(top, #1aa0c9 0%, #1aa0c9);
    background: -webkit-gradient(linear, left top, left bottom, from(#1aa0c9), to(#1aa0c9));
    -moz-border-radius: 0px;
    -webkit-border-radius: 0px;
    border-radius: 0px;
    border: 0px solid #ffffff;
    -moz-box-shadow: 0px 1px 3px rgba(240,240,240,0.5), inset 0px 0px 0px rgba(15,177,217,0);
    -webkit-box-shadow: 0px 1px 3px rgba(240,240,240,0.5), inset 0px 0px 0px rgba(15,177,217,0);
    box-shadow: 0px 1px 3px rgba(240,240,240,0.5), inset 0px 0px 0px rgba(15,177,217,0);
    font-family: "Open Sans",Verdana,Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: bold;
    line-height: 1;
    text-align: center;
    color: #fff;
    text-shadow: 0px 0px 0px rgba(000,000,000,0), 0px 0px 0px rgba(255,255,255,0)
}

button.secondaryButton, a.secondaryButton {
    display: inline-block;
    padding: 12px 20px;
    margin-bottom: 5px;
    background-color: #666;
    background: -moz-linear-gradient(top, #8a8a8a 0%, #8a8a8a);
    background: -webkit-gradient(linear, left top, left bottom, from(#8a8a8a), to(#8a8a8a));
    -moz-border-radius: 0px;
    -webkit-border-radius: 0px;
    border-radius: 0px;
    border: 0px solid #fff;
    -moz-box-shadow: 0px 1px 3px rgba(240,240,240,0.5), inset 0px 0px 0px rgba(15,177,217,0);
    -webkit-box-shadow: 0px 1px 3px rgba(240,240,240,0.5), inset 0px 0px 0px rgba(15,177,217,0);
    box-shadow: 0px 1px 3px rgba(240,240,240,0.5), inset 0px 0px 0px rgba(15,177,217,0);
    font-family: "Open Sans",Verdana,Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: bold;
    line-height: 1;
    text-align: center;
    color: #fff;
    text-shadow: 0px 0px 0px rgba(000,000,000,0),0px 0px 0px rgba(255,255,255,0)
}

button.altButton, a.altButton {
    display: inline-block;
    padding: 9px 32px 9px 22px;
    margin-bottom: 5px;
    background: #484848 url('images/arrow.png') no-repeat 87% center;
    background: url('images/arrow.png') no-repeat 87% center, -moz-linear-gradient(top, #3d3d3d 0%, #3d3d3d);
    background: url('images/arrow.png') no-repeat 87% center, -webkit-gradient(linear, left top, left bottom, from(#3d3d3d), to(#3d3d3d));
    -moz-border-radius: 0px;
    -webkit-border-radius: 0px;
    border-radius: 0px;
    border: 0px solid #ffbf00;
    -moz-box-shadow: 0px 0px 0px rgba(000,000,000,0), inset 0px 0px 0px rgba(255,255,255,0);
    -webkit-box-shadow: 0px 0px 0px rgba(000,000,000,0), inset 0px 0px 0px rgba(255,255,255,0);
    box-shadow: 0px 0px 0px rgba(000,000,000,0), inset 0px 0px 0px rgba(255,255,255,0);
    font-family: "Open Sans",Verdana,Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: bold;
    line-height: 1;
    color: #fff;
    text-shadow: 0px 0px 0px rgba(000,000,000,0), 0px 0px 0px rgba(255,255,255,0)
}

a.dnnPrimaryAction {
    color: #efefef
}

a.dnnSecondaryAction {
    color: #555
}

button.primaryButton:hover, button.secondaryButton:hover, a.primaryButton:hover, a.secondaryButton:hover {
    cursor: pointer;
    cursor: hand;
    background-image: none;
    background-color: #d00
}

button.altButton:hover, a.altButton:hover {
    cursor: pointer;
    cursor: hand;
    background: #d00 url('images/arrow.png') no-repeat 87% center
}

.spacingTop {
    margin-top: 30px
}

.spacingRight {
    margin-right: 30px
}

.spacingBottom {
    margin-bottom: 30px
}

.spacingLeft {
    margin-left: 30px
}

#userControls {
    height: 32px
}

    #userControls .language {
        min-height: 0 !important;
        display: inline
    }

.wrapper {
    margin: 0 auto;
    width: 980px
}

#search {
    float: right;
    width: auto;
    height: 32px
}

    #search a.SearchButton, #search a.SearchButton:link, #search a.SearchButton:visited {
        display: inline-block;
        height: 32px;
        width: 50px;
        margin: 0;
        padding: 0;
        background: url('images/search.png') no-repeat center center #d8d8da;
        vertical-align: 16px;
        text-indent: -9999px;
        transition: opacity 0.35s
    }

        #search a.SearchButton:hover {
            opacity: 0.9
        }

.searchInputContainer {
    background: #f0f0f0;
    width: auto
}

#dnn_dnnSearch_txtSearch {
    display: block;
    float: left;
    background: #f0f0f0;
    width: 356px;
    height: 32px;
    padding: 0 5px 0 10px;
    margin: 0;
    border: none;
    border-radius: 0;
    box-shadow: none;
    outline: none;
    color: #333;
    line-height: 32px;
    -webkit-transition: all 100ms ease-in-out;
    -moz-transition: all 100ms ease-in-out;
    -ms-transition: all 100ms ease-in-out;
    -o-transition: all 100ms ease-in-out;
    transition: all 100ms ease-in-out
}

    #dnn_dnnSearch_txtSearch:active, #dnn_dnnSearch_txtSearch:focus {
        background: #ebebeb;
        border-right: none !important
    }

.dnnSearchResultContainer > .dnnSearchResultItem > .dnnSearchResultItem-Title {
    font-size: 16px;
    font-weight: normal
}

.dnnSearchBoxPanel {
    max-width: inherit
}

.dnnSearchResultPanel {
    max-width: inherit
}

ul.searchSkinObjectPreview {
    width: 369px
}

#login .registerGroup, #login .registerGroup *, #login .loginGroup, #login .loginGroup * {
    display: block
}

#login .registerGroup, #login .loginGroup {
    float: right;
    padding: 0;
    margin: 0
}

    #login .registerGroup li:first-child:hover {
        border-left: #222
    }

    #login .registerGroup li {
        float: left
    }

    #login .registerGroup .buttonGroup {
        margin-right: 0
    }

    #login .registerGroup a, #login .loginGroup a {
        display: block;
        position: relative;
        height: 25px;
        min-width: 12px;
        padding: 7px 15px 0 15px;
        color: #333;
        font-size: 11px;
        vertical-align: middle
    }

        #login .registerGroup a:hover, #login .loginGroup a:hover {
            background: rgb(45,45,45); /* Old browsers */
            background: -moz-linear-gradient(top, rgba(45,45,45,1) 0%, rgba(86,86,86,1) 100%); /* FF3.6+ */
            background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(45,45,45,1)), color-stop(100%,rgba(86,86,86,1))); /* Chrome,Safari4+ */
            background: -webkit-linear-gradient(top, rgba(45,45,45,1) 0%,rgba(86,86,86,1) 100%); /* Chrome10+,Safari5.1+ */
            background: -o-linear-gradient(top, rgba(45,45,45,1) 0%,rgba(86,86,86,1) 100%); /* Opera 11.10+ */
            background: -ms-linear-gradient(top, rgba(45,45,45,1) 0%,rgba(86,86,86,1) 100%); /* IE10+ */
            background: linear-gradient(to bottom, rgba(45,45,45,1) 0%,rgba(86,86,86,1) 100%); /* W3C */
            filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2d2d2d', endColorstr='#565656',GradientType=0 ); /* IE6-9 */
            color: #ddd;
            text-shadow: 0px -1px 0px #333333
        }

        #login .registerGroup a:active, #login .loginGroup a:active {
            color: #fff;
            text-shadow: 0px -1px 0px #333
        }

        #login .registerGroup a:hover, #login .loginGroup a:hover {
            text-decoration: none
        }

        #login .registerGroup a strong, #login .loginGroup a strong {
            display: block;
            position: absolute;
            left: 0;
            top: 0;
            width: 100%;
            overflow: hidden;
            font-size: 11px;
            text-indent: -9999px
        }

#login .userMessages a, #login .userNotifications a {
    background-color: #333
}

#login .userMessages strong {
    height: 100%;
    background: url('images/icon_message.png') no-repeat center center
}

#login .userNotifications {
    border-right: 1px solid #ccc
}

    #login .userNotifications strong {
        height: 100%;
        background: url('images/icon_notification.png') no-repeat center center
    }

#login .registerGroup a span {
    display: inline-block;
    position: absolute;
    right: 2px;
    top: -9px;
    min-width: 7px;
    margin-right: 3px;
    background: rgb(59,150,182); /*Old browsers*/
    text-align: center;
    font-size: 11px;
    color: #fff;
    text-shadow: 0px 1px 0px #333
}

#login .registerGroup .userProfileImg a {
    min-width: 25px;
    min-height: 32px;
    padding: 0;
    background: none
}

#login .registerGroup a img {
    height: 32px;
    width: 32px;
    background: #333
}

#login .loginGroup {
    border-right: 1px solid #ccc
}

    #login .loginGroup a {
        color: #333
    }

#login .userMessages a span, #login .userNotifications a span {
    display: inline-block;
    margin-top: 9px;
    margin-right: 0px;
    background-color: transparent;
    font-size: 10px
}

#logo {
    float: left
}

.language .language-object {
    display: inline-block;
    margin: 0;
    padding: 0
}

    .language .language-object span {
        float: left;
        padding-top: 3px;
        padding-bottom: 3px;
        padding-left: 5px;
        margin: 0
    }

        .language .language-object span:first-child {
            padding-left: 8px
        }

        .language .language-object span img {
            height: 12px;
            width: 17px;
            opacity: 0.3
        }

        .language .language-object span:hover img {
            opacity: 1
        }

    .language .language-object .Language.selected img {
        opacity: 1;
        border-color: #222;
        -webkit-border-radius: 2px;
        border-radius: 2px;
        -webkit-box-shadow: 0px 1px 0px 0px rgba(255, 255, 255, 0.8);
        box-shadow: 0px 1px 0px 0px rgba(255, 255, 255, 0.8)
    }

.language-object {
    position: absolute;
    top: 52px;
    right: 50px
}

    .language-object select {
        width: 294px;
        padding: 5px
    }

    .language-object span {
        opacity: 0.5;
        margin-left: 10px
    }

        .language-object span.selected {
            opacity: 1
        }

.navbar {
    margin-bottom: 20px
}

.navbar-inner {
    margin: 0;
    padding: 0
}

.navbar .brand {
    margin: 0;
    padding: 0
}

.navbar .nav {
    margin: 0;
    padding: 0
}

    .navbar .nav > li {
        margin-left: 40px
    }

        .navbar .nav > li:first-child {
            margin-left: 0
        }

        .navbar .nav > li > a {
            padding: 0 0 10px 0;
            color: #666;
            font-weight: bold;
            transition: color 0.25s
        }

            .navbar .nav > li > a:hover, .navbar .nav > li > a:focus, .navbar .nav > li > a:active {
                color: #ff2d16;
                transition: color 0.25s
            }

    .navbar .nav .active > a, .navbar .nav .active:hover > a, .navbar .nav .active:focus > a {
        background: none;
        color: #ff2d16
    }

.navbar-inner {
    border: none !important;
    box-shadow: none !important;
    background: none transparent !important;
    padding: 0 3.0%;
    border-radius: 0
}

.navbar .brand {
    padding: 0 !important
}

.nav-collapse {
    float: right;
    position: relative;
    top: 81px
}

.nav li {
    position: relative;
    list-style: none;
    margin: 0
}

.nav > li {
    float: left;
    padding: 0
}

    .nav > li > a, .nav > li > span {
        display: block;
        color: #333;
        font-size: 15px;
        font-weight: bold;
        text-decoration: none
    }

    .nav > li:hover > a, .nav > li.active > a {
        color: #ff2d16; /* override default bootstrap nav pills styles*/
        background-color: transparent !important;
        box-shadow: none !important
    }

        .nav > li:hover > a:active {
            color: #ff2d16
        }

    .nav > li:hover > span {
        color: #ff2d16
    }

</div >
.nav > li > a .caret.hidden-desktop {
    border: none !important;
    background-image: url(bootstrap/img/glyphicons-halflings-white.png);
    background-color: #333;
    background-position: -305px -110px !important;
    width: 30px !important;
    line-height: 30px !important;
    min-height: 30px !important;
    height: auto;
    display: inline-block;
    margin: 0 !important;
    border-radius: 3px
}

.nav > li > a .caret.hidden-desktop:hover {
    background: url(bootstrap/img/glyphicons-halflings-white.png) -305px -110px, linear-gradient(to bottom, #2D2D2D 0%, #565656 100%) !important
}

.nav-tabs > li > a, .nav-pills > li > a {
    padding: 0
}

.nav-pills > li > a {
    margin: 0;
    padding: 0;
    border-radius: 0
}

.nav > li ul {
    position: absolute;
    top: 20px;
    left: -10px;
    z-index: 2;
    padding: 15px 5px;
    display: none;
    width: 280px;
    background: #fff;
    border: 1px solid #cbcbcb;
    border-radius: 0px;
    box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.4)
}

    .nav > li ul li a {
        color: #666;
        font-weight: bold;
        line-height: 30px
    }

.nav-collapse:not(.in) .nav li:hover > ul {
    display: block
}

.nav-collapse .nav li > iframe {
    display: none;
    z-index: 1 !important
}

.nav-collapse:not(.in) .nav li:hover > iframe {
    display: block
}

.navbar .nav > li > .dropdown-menu {
    z-index: 1000;
    top: 20px;
    left: -25px;
    margin-bottom: 50px !important;
    border: 0;
    box-shadow: 0 0 5px rgba(0,0,0,0.15)
}

.nav .dropdown-menu > .active > a, .nav .dropdown-menu > .active > a:focus {
    background-color: transparent !important;
    background-image: none !important;
    color: #ff2d16 !important;
    outline: none
}

.nav .dropdown-menu a {
    display: block;
    color: #666;
    font-size: 14px;
    font-weight: bold;
    margin: 8px 0;
    transition: color 0.25s ease
}

.nav .dropdown-menu > li > a:hover, .nav .dropdown-menu > .active > a:hover {
    background-color: transparent !important;
    background-image: none !important;
    color: #ff2d16 !important;
    transition: color 0.25s ease
}

.navbar .nav > li > .dropdown-menu:before {
    border: none
}

.navbar .nav > li > .dropdown-menu:after {
    border: none
}

.nav-collapse:not(.in) .nav .dropdown-menu {
    border-radius: 0 !important
}

.nav li ul li ul {
    left: 225px;
    top: -8px;
    padding: 15px 5px;
    border-left: 1px solid #ddd
}

.nav-collapse.in {
    width: 100%
}

.navbar .btn-navbar {
    background: #1f82c1 !important;
    transition: opacity 0.35s;
    font-weight: bold;
    border-radius: 5px;
    cursor: pointer
}

    .navbar .btn-navbar:hover, .navbar .btn-navbar:active {
        opacity: 0.9
    }

#Breadcrumb {
    padding-top: 20px;
    padding-bottom: 12px;
    margin-bottom: 25px;
    border-bottom: solid 1px #c0c0c0
}

    #Breadcrumb img {
        margin-left: 10px;
        margin-right: 10px
    }

    #Breadcrumb a.breadcrumbLink:link, #Breadcrumb a.breadcrumbLink:visited {
        color: #666;
        font-size: 12px;
        font-weight: bold
    }

    #Breadcrumb a.breadcrumbLink:hover {
        color: #3B96B6
    }

.threeColLeftPane, .threeColCenterPane, .threeColRightPane {
    float: left;
    width: 306px
}

.threeColSocialLeftPane {
    float: left;
    width: 110px
}

.threeColSocialCenterPane {
    float: left;
    position: relative;
    width: 560px
}

.threeColSocialRightPane {
    float: left;
    width: 250px
}

.DNNEmptyPane {
    width: 0;
    margin: 0
}

    .DNNEmptyPane.rightTwoCol + div {
        width: 100%
    }

#copyright {
    color: #666;
    font-size: 12px;
    margin-bottom: 25px
}

    #copyright a:link, #copyright a:visited {
        font-size: 12px;
        color: #666
    }

    #copyright a:hover {
        color: #D00
    }

    #copyright a.DNNMobileLink {
        color: #666;
        font-weight: bold
    }

        #copyright a.DNNMobileLink:hover {
            color: #D00
        }

    #copyright .pull-right {
        text-align: right
    }

.copyright-text {
    float: left;
    margin-top: -1px
}

.threeColSocial .console { /*width:250px*/
    width: 100% !important; /* updated for responsive*/
    height: auto;
    background-color: #484848; /* Menu Background Color */
}

.threeColSocial .console-none div {
    cursor: pointer;
    cursor: hand;
    float: left;
    height: auto; /*width: 250px;*/
    width: 100% !important; /* updated for responsive*/
    padding: 0;
    margin: 0;
    text-align: left
}

.threeColSocial .console-none h3 {
    padding: 10px 8px 10px 40px;
    margin: 0;
    border-bottom: solid 1px #fff;
    background: url('images/arrow.png') 18px center no-repeat;
    color: #eee;
    font-size: 13px;
    line-height: 1;
    font-weight: bold
}

.threeColSocial .console-none div div {
    display: none
}

.threeColSocial .console-mouseon {
    background-color: #70b1c7 /* Menu Hover Background Color */
}

#UserProfileImg img {
    width: 100px;
    height: auto;
    border: solid 3px #fff
}

.threeColSocial .UserProfileControls ul {
    margin: 15px 0
}

    .threeColSocial .UserProfileControls ul li {
        list-style-type: none;
        margin-bottom: 3px
    }

.threeColSocialRightPane .DnnModule #mdMemberList {
    margin: 0 0 30px 0
}

.threeColSocialRightPane #mdMemberList ul {
    margin: 10px 0 0 0
}

.threeColSocialRightPane #mdMemberList li {
    margin-bottom: 0;
    -size: 12px;
    font-weight: bold;
    list-style-type: none
}

.threeColSocialRightPane #mdMemberList > li {
    width: 216px;
    margin: 0;
    padding: 6px 17px;
    background: #d7d7d7;
    border: none;
    -webkit-border-radius: 0;
    border-radius: 0;
    -webkit-transition: background 0.15s ease-in-out;
    -moz-transition: background 0.15s ease-in-out;
    -o-transition: background 0.15s ease-in-out;
    -ms-transition: background 0.15s ease-in-out;
    transition: background 0.15s ease-in-out;
    -webkit-box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.3);
    box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.3)
}

    .threeColSocialRightPane #mdMemberList > li:hover {
        z-index: 2; /*bring current li to top for tooltip */
        background: #d7d7d7;
        -webkit-box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.3), inset 0px 0px 0px 0px rgba(255, 255, 255, 1);
        box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.3), inset 0px 0px 0px 0px rgba(255, 255, 255, 1)
    }

.threeColSocial .journalTools {
    max-width: 560px
}

.threeColSocial .journalrow {
    padding-bottom: 10px;
    border-bottom: solid 1px #c0c0c0;
    margin-bottom: 20px
}

.threeColSocial .journalfooter {
    padding: 0;
    margin: 0
}

.threeColSocial .journalrow div.journalitem p.journalfooter {
    font-size: 12px;
    padding: 0;
    margin-bottom: 0
}

.threeColSocial .journalrow div.journalitem ul.jcmt {
    font-size: 12px
}

.threeColSocial .journalrow div.journalitem .likes {
    padding: 2px 5px;
    background-color: #dbdbdb
}

#journalEditor #journalContent .juser, .journalrow .juser {
    border: none;
    color: #3B96B6;
    background-color: transparent
}

.threeColSocial #UserDisplayNameHeader h2 {
    padding-bottom: 10px;
    border-bottom: solid 1px #c0c0c0
}

.threeColSocial #smMainContent .ui-corner-all {
    border-radius: 0
}

.threeColSocial ul.dnnAdminTabNav {
    height: 38px;
    margin-top: 0;
    margin-bottom: 0;
    border-bottom: 1px solid #c0c0c0
}

    .threeColSocial ul.dnnAdminTabNav li {
        margin-right: 1px
    }

        .threeColSocial ul.dnnAdminTabNav li a {
            padding: 10px 15px;
            margin-bottom: 0px;
            border: none;
            background: #d7d7d7;
            -webkit-border-radius: 1px 1px 0px 0px;
            border-radius: 1px 1px 0px 0px;
            -webkit-border-radius: 0px;
            border-radius: 0px;
            color: #666;
            font-size: 12px;
            font-weight: bold;
            text-shadow: none
        }

            .threeColSocial ul.dnnAdminTabNav li a:hover {
                background: #484848;
                color: #eee
            }

        .threeColSocial ul.dnnAdminTabNav li.ui-tabs-active a {
            padding: 10px 15px;
            margin-top: 0px;
            background: #484848;
            color: #eee
        }

.threeColSocial .dnnAdminTabNav a span {
    display: inline;
    min-height: 12px;
    padding: 2px 6px;
    margin-right: 8px;
    background: rgb(59,150,182); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(59,150,182,1) 0%, rgba(35,125,155,1) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(59,150,182,1)), color-stop(100%,rgba(35,125,155,1))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, rgba(59,150,182,1) 0%,rgba(35,125,155,1) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, rgba(59,150,182,1) 0%,rgba(35,125,155,1) 100%); /* Opera 11.10+ */
    background: linear-gradient(top, rgba(59,150,182,1) 0%,rgba(35,125,155,1) 100%); /* W3C */
    -webkit-box-shadow: 0px 1px 0px 0px #666;
    -moz-box-shadow: 0px 1px 0px 0px #666;
    box-shadow: 0px 1px 0px 0px #666;
    color: #eee;
    font-weight: ormal;
    font-size: 11px;
}

.threeColSocial .dnnFormExpandContent {
    position: absolute;
    top: -40px;
    right: 0;
    height: 20px;
    font-size: 12px
}

    .threeColSocial .dnnFormExpandContent a.ComposeMessage {
        font-size: 12px
    }

.threeColSocial a.dnnPrimaryAction {
    display: inline-block;
    padding: 12px 20px;
    margin-bottom: 5px;
    background-color: #3B96B6;
    background: -moz-linear-gradient(top, #1aa0c9 0%, #1aa0c9);
    background: webkit-gradient(linear, left top, left bottom, from(#1aa0c9), to(#1aa0c9));
    -moz-border-radius: 0px;
    -webkit-border-radius: 0px;
    border-radius: 0px;
    border: 0px solid #fff;
    -moz-box-shadow: 0px 1px 3px rgba(240,240,240,0.5), inset 0px 0px 0px rgba(15,177,217,0);
    -webkit-box-shadow: 0px 1px 3px rgba(240,240,240,0.5), inset 0px 0px 0px rgba(15,177,217,0);
    box-shadow: 0px 1px 3px rgba(240,240,240,0.5), inset 0px 0px 0px rgba(15,177,217,0);
    font-family: "Open Sans",Verdana,Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: bold;
    line-height: 1;
    text-align: center;
    color: #fff;
    text-shadow: 0px 0px 0px rgba(000,000,000,0),0px 0px 0px rgba(255,255,255,0)
}

    .threeColSocial a.dnnPrimaryAction:hover, .threeColSocial a.dnnPrimaryAction:active {
        cursor: pointer;
        cursor: hand;
        background-image: none;
        background-color: #d00
    }

.threeColSocial .DnnModule .messageControls .dnnButtonGroup {
    margin-right: 0px /* fixed Archived Button spacinging issue */
}

.threeColSocial .messageControls {
    margin: 0;
    padding: 0;
    padding-bottom: 5px;
    border-bottom: 1px solid #c0c0c0
}

    .threeColSocial .messageControls .messageFolders {
        float: right
    }

.threeColSocial .messageFolders p {
    float: left;
    display: inline-block;
    padding: 8px 15px;
    margin: 0;
    color: #666;
    font-size: 12px
}

    .threeColSocial .messageFolders p strong {
        color: #666;
        font-weight: bold
    }

.threeColSocial .DnnModule-Messaging-Notifications .dnnTertiaryAction {
    width: auto !important;
    padding: 9px 10px;
    font-size: 12px
}

.threeColSocial .DnnModule .selectDrop ul {
    top: 34px;
    min-width: 120px;
    padding: 10px 14px !important;
    border: 1px solid #c2c2c2;
    background: #e7e7e7;
    -moz-border-radius-bottomright: 0px;
    -moz-border-radius-bottomleft: 0px;
    -webkit-border-radius: 0px 0px 0px 0px;
    border-radius: 0px 0px 0px 0px;
    -webkit-box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, .1);
    -moz-box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, .1);
    box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, .1)
}

.threeColSocial .selectDrop.active > a {
    background: #70b1c7;
    color: #eee;
    border-right: solid 0px #3B96B6;
    -webkit-box-shadow: inset 0px 1px 1px 0px #3B96B6;
    -moz-box-shadow: inset 0px 1px 1px 0px #3B96B6;
    box-shadow: inset 0px 1px 1px 0px #3B96B6
}

.threeColSocial .selectDrop ul li {
    margin-bottom: 3px;
    font-size: 12px
}

.threeColSocial .dnnButtonGroup {
    background: transparent;
    -webkit-border-radius: 0;
    border-radius: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
    border: none;
    list-style: none
}

.threeColSocial ul.dnnButtonGroup > li {
    border-left: none
}

.threeColSocial .dnnButtonGroup > li > a {
    border-left: 1px solid #ddd; /*light*/
    border-right: 1px solid #bbb; /*dark*/
    background-color: #d7d7d7;
    color: #666
}

    .threeColSocial .dnnButtonGroup > li > a.active {
        color: #eee;
        border-right: 1px solid #3B96B6;
        background-color: #70b1c7
    }

    .threeColSocial .dnnButtonGroup > li > a.disabled:hover {
        color: #eee;
        border-left: 1px solid #3B96B6;
        background-color: #70b1c7
    }

.threeColSocial .alpha > a:hover {
    color: #eee;
    background-color: #70b1c7;
    border-right: 1px solid #3B96B6
}

.threeColSocial .alpha > a, .threeColSocial .alpha > a:hover, .threeColSocial .alpha > a.active {
    border-left: 1px solid #70b1c7;
    -moz-border-radius-topleft: 0;
    -moz-border-radius-bottomleft: 0;
    -webkit-border-radius: 0;
    border-radius: 0
}

.threeColSocial .omega > a, .threeColSocial .omega > a:active, .threeColSocial .omega > a.active {
    border-right: 1px solid #70b1c7;
    -moz-border-radius-topright: 0;
    -moz-border-radius-bottomright: 0;
    -webkit-border-radius: 0;
    border-radius: 0
}

.threeColSocial a.dnnSecondaryAction.ArchiveItems span {
    display: none /* hide Archive text*/
}

.threeColSocial a.dnnSecondaryAction.ArchiveItems {
    height: 18px;
    min-width: 15px;
    margin-left: 5px;
    background: #d7d7d7 url('images/icon_bin.png') no-repeat center center;
    border-radius: 0;
    -webkit-box-shadow: none;
    text-shadow: none;
    box-shadow: none;
    color: #666;
    border: none
}

    .threeColSocial a.dnnSecondaryAction.ArchiveItems:hover {
        background: #70b1c7 url('images/icon_bin.png') no-repeat center center
    }

.threeColSocial .dnnTertiaryAction:hover, a.dnnTertiaryAction:hover {
    background-color: #70b1c7;
    color: #eee
}

.threeColSocial .smListings {
    font-size: 12px
}

.threeColSocial .DnnModule .smListings ul {
    margin: 0
}

.threeColSocial .smListings > ul > li {
    padding-top: 10px;
    margin: 0;
    background: transparent;
    border-bottom: 1px solid #c0c0c0
}

    .threeColSocial .smListings > ul > li.active {
        background: #f4f4f4 /* background color for active list items*/
    }

    .threeColSocial .smListings > ul > li:last-child {
        border-bottom: none
    }

.threeColSocial .smListings [class^="ListCol-"] {
    padding: 1% 1% 1% 0
}

.threeColSocial .DnnModule-Messaging-Notifications .smListings .ListCol-1 {
    min-width: 20px /* Main message list: Checkbox column width on */
}

.threeColSocial .DnnModule-Messaging-Notifications .smListings .ListCol-2 {
    min-width: 65px /* Main message list: Avatar column width AND Drilldown message list: Message info column width*/
}

.threeColSocial .DnnModule-Messaging-Notifications .smListings .ListCol-3 {
    width: 56% /* Main message list: Message info column width AND Drilldown message list: Time column width */
}

.threeColSocial .DnnModule-Messaging-Notifications .smListings .ListCol-4 {
    font-size: 11px /* Main message list: Time column */
}

.threeColSocial .smTimeStamped {
    font-size: 11px
}

.threeColSocial .DnnModule-Messaging-Details .smListings .ListCol-1 {
    min-width: 65px /* Drilldown message list: Avatar column width*/
}

.threeColSocial .DnnModule-Messaging-Details .smListings .ListCol-2 {
    width: 56% /* Drilldown message list: Message info column width*/
}

.threeColSocial .DnnModule-Messaging-Details .smListings .ListCol-3 {
    float: right; /* Drilldown message list: Time column */
    width: 25%;
    font-size: 12px
}

.threeColSocial .hoverControls a {
    font-size: 12px; /* All lists: Archive & Reply links */
    font-weight: bold
}

.threeColSocial .DnnModule-Messaging-Details .smListings .meta {
    margin-bottom: 5px /* Drilldown message list: UserName link */
}

    .threeColSocial .DnnModule-Messaging-Details .smListings .meta a {
        font-weight: bold /* Drilldown message list: UserName link */
    }

.threeColSocial .DnnModule-Messaging-Details .smListings .message {
    color: #999; /* Drilldown message list: Message text */
    margin: 0
}

.threeColSocial .DnnModule-Messaging-Notifications .smListings .subject {
    font-weight: bold
}

.threeColSocial .DnnModule-Messaging-Notifications .smListings .active .subject {
    font-size: 13px; /* All lists: unread message subject */
    margin-bottom: 3px
}

.threeColSocial .DnnModule-Messaging-Notifications .smListings .meta {
    margin-bottom: 8px; /* All lists: message From - Send to */
    line-height: 14px
}

.threeColSocial .DnnModule-Messaging-Notifications .smListings .message {
    color: #999 /* All lists: Message text */
}

.threeColSocial .DnnModule-Messaging-Details .smListings .ListCol-3 ul li {
    margin-bottom: 0 /* Drilldown message list: Time column */
}

    .threeColSocial .DnnModule-Messaging-Details .smListings .ListCol-3 ul li:first-child {
        color: #999 /* Drilldown message list: Time column */
    }

.threeColSocial .DnnModule-Messaging-Details .smListings .active .ActiveToggle:hover, .smListings .ActiveToggle {
    margin-left: 8px; /* Main message list: Time column-Mark as Read block */
    -webkit-box-shadow: 0px 1px 0px 0px #666;
    -moz-box-shadow: 0px 1px 0px 0px #666;
    box-shadow: 0px 1px 0px 0px #666
}

    .threeColSocial .DnnModule-Messaging-Details .smListings .active .ActiveToggle, .smListings .ActiveToggle:hover {
        margin-left: 8px; /* Main message list: Time column-Mark as Read block hover */
        background: rgb(59,150,182); /* Old browsers */
        background: -moz-linear-gradient(top, rgba(59,150,182,1) 0%, rgba(35,125,155,1) 100%); /* FF3.6+ */
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(59,150,182,1)), color-stop(100%,rgba(35,125,155,1))); /* Chrome,Safari4+ */
        background: -webkit-linear-gradient(top, rgba(59,150,182,1) 0%,rgba(35,125,155,1) 100%); /* Chrome10+,Safari5.1+ */
        background: -o-linear-gradient(top, rgba(59,150,182,1) 0%,rgba(35,125,155,1) 100%); /* Opera 11.10+ */
        background: linear-gradient(top, rgba(59,150,182,1) 0%,rgba(35,125,155,1) 100%); /* W3C */
        -webkit-box-shadow: 0px 1px 0px 0px #666;
        -moz-box-shadow: 0px 1px 0px 0px #666;
        box-shadow: 0px 1px 0px 0px #666
    }

.threeColSocial .DnnModule-Messaging-Notifications .smListings .ListCol-4 ul li {
    margin-bottom: 0px; /* All lists: Time column */
}

    .threeColSocial .DnnModule-Messaging-Notifications .smListings .ListCol-4 ul li:first-child {
        color: #999 /* All lists: Time column */
    }

.threeColSocial .DnnModule-Messaging-Notifications .smListings .active .ActiveToggle:hover, .smListings .ActiveToggle {
    margin-left: 8px; /* Main message list: Time column-Mark as Read block */
    -webkit-box-shadow: 0px 1px 0px 0px #666;
    -moz-box-shadow: 0px 1px 0px 0px #666;
    box-shadow: 0px 1px 0px 0px #666
}

    .threeColSocial .DnnModule-Messaging-Notifications .smListings .active .ActiveToggle, .smListings .ActiveToggle:hover {
        margin-left: 8px; /* Main message list: Time column-Mark as Read block hover*/
        background: rgb(59,150,182); /* Old browsers */
        background: -moz-linear-gradient(top, rgba(59,150,182,1) 0%, rgba(35,125,155,1) 100%); /* FF3.6+ */
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(59,150,182,1)), color-stop(100%,rgba(35,125,155,1))); /* Chrome,Safari4+ */
        background: -webkit-linear-gradient(top, rgba(59,150,182,1) 0%,rgba(35,125,155,1) 100%); /* Chrome10+,Safari5.1+ */
        background: -o-linear-gradient(top, rgba(59,150,182,1) 0%,rgba(35,125,155,1) 100%); /* Opera 11.10+ */
        background: linear-gradient(top, rgba(59,150,182,1) 0%,rgba(35,125,155,1) 100%); /* W3C */
        -webkit-box-shadow: 0px 1px 0px 0px #666;
        -moz-box-shadow: 0px 1px 0px 0px #666;
        box-shadow: 0px 1px 0px 0px #666
    }

.threeColSocial .DnnModule-Messaging-Notifications .notificationControls {
    font-weight: bold /* Main notifications list: Follow back & Dismiss links */
}

.threeColSocial .messageHeader {
    padding: 0;
    margin: 0
}

    .threeColSocial .messageHeader p {
        font-size: 13px;
        color: #666;
        float: left
    }

        .threeColSocial .messageHeader p strong {
            color: #333
        }

    .threeColSocial .messageHeader .returnLink {
        font-size: 12px;
        font-weight: bold
    }

.threeColSocial .morePrevMsgButton {
    color: #666;
    font-size: 12px;
    text-align: center;
    padding: 10px;
    margin-bottom: 15px;
    border: solid 1px #c0c0c0;
    background: #d7d7d7;
    -webkit-box-shadow: inset 0px 0px 3px 0px #ccc;
    -moz-box-shadow: inset 0px 0px 3px 0px #ccc;
    box-shadow: inset 0px 0px 3px 0px #ccc
}

.threeColSocial textarea#replyMessage {
    width: 94%;
    height: 75px;
    color: #666;
    border: 1px solid #c0c0c0;
    background: #f4f4f4
}

    .threeColSocial textarea#replyMessage:focus, .threeColSocial textarea#replyMessage:active {
        color: #666;
        background: #fff
    }

.clear {
    clear: both;
    display: block;
    overflow: hidden;
    visibility: hidden;
    width: 0;
    height: 0
}

.clearfix:after {
    clear: both;
    content: ' ';
    display: block;
    font-size: 0;
    line-height: 0;
    visibility: hidden
}

.left {
    float: left
}

.right {
    float: right
}

.content_intro {
    padding-top: 30px;
    color: #8c8c8c;
    font-size: 14px;
    line-height: 20px;
    text-align: center
}

    .content_intro h1 span {
        font-weight: normal
    }

    .content_intro a {
        font-size: 14px
    }

.content_featured {
    color: #999;
    vertical-align: top
}

    .content_featured h2 .TitleH2 {
        display: block;
        margin-bottom: 30px
    }

    .content_featured .normal {
        font-weight: normal
    }

    .content_featured img {
        margin-bottom: 25px
    }

    .content_featured a.primaryButton {
        margin-left: 25px
    }

.content_newslist ul {
    margin: 0
}

    .content_newslist ul li {
        display: block;
        list-style-type: none;
        margin-bottom: 30px
    }

        .content_newslist ul li:after {
            clear: both;
            content: ' ';
            display: block;
            font-size: 0;
            line-height: 0;
            visibility: hidden
        }

        .content_newslist ul li.last {
            margin-bottom: 0
        }

        .content_newslist ul li img {
            float: left;
            margin-right: 20px;
            margin-bottom: 20px
        }

        .content_newslist ul li h5 {
            margin-bottom: 5px
        }

        .content_newslist ul li span, .content_newslist ul li strong {
            color: #a6a6a6
        }

        .content_newslist ul li p {
            margin-top: 12px;
            margin-bottom: 12px
        }

.smallThumbnail img {
    width: 80px
}

.adContent {
    position: absolute;
    padding: 20px;
    background-color: #000;
    opacity: 0.7;
    color: #eee
}

    .adContent h2 {
        margin-bottom: 5px;
        color: #eee;
        font-weight: normal
    }

.content_adstyleOne {
    position: relative;
    margin-right: 0px;
    margin-bottom: 18px;
    color: #eee
}

    .content_adstyleOne .adContent {
        bottom: 0;
        right: -2%
    }

.content_adstyleTwo {
    position: relative;
    margin-bottom: 18px
}

    .content_adstyleOne img, .content_adstyleTwo img {
        width: 100%
    }

.content_adstyleOne img {
    bottom: 0;
    width: 102% !important;
    max-width: 102%
}

.content_adstyleTwo .adContent {
    top: 0
}

.content_adstyleTwo h2 {
    line-height: 1
}

ul.footerlinks {
    margin: 0
}

.footerlinks li {
    list-style: none;
    margin-bottom: 8px
}

    .footerlinks li a:link, .footerlinks li a:visited {
        color: #808080
    }

    .footerlinks li a:hover {
        color: #D00
    }

ul.footerConnect {
    margin: 0
}

    ul.footerConnect li {
        display: inline-block;
        list-style-type: none;
        margin-right: 10px
    }

.content_team ul {
    margin: 0 -12px
}

    .content_team ul li {
        display: inline-block;
        width: 14%;
        margin: 0 0 40px 2%;
        text-align: center;
        list-style-type: none
    }

        .content_team ul li .teampic {
            background-color: #bfbfbf
        }

        .content_team ul li img {
            width: 100%
        }

        .content_team ul li span {
            display: block;
            font-weight: bold;
            white-space: nowrap
        }

.content_products ul {
    margin: 0 -1%
}

    .content_products ul li {
        display: inline-block;
        width: 31.1%;
        margin: 0 1% 45px;
        vertical-align: top;
        list-style-type: none
    }

        .content_products ul li p {
            min-height: 72px
        }

        .content_products ul li img {
            margin-bottom: 25px;
            max-width: 100%;
            width: 100%
        }

.form_oneCol label {
    display: block;
    font-weight: bold;
    margin-bottom: 10px
}

.form_oneCol input, .form_oneCol textarea {
    width: 94%
}

.form_dealer input {
    width: 200px;
    margin-bottom: 5px
}

#container {
    position: relative;
    z-index: 0;
    width: 980px;
    padding: 0px;
    margin: 0 auto
}

#example {
    position: relative;
    width: 980px;
    height: 380px
}

#slides {
    position: absolute;
    z-index: 9;
    top: 0px;
    left: 0px
}

.slides_container {
    display: none;
    position: relative;
    width: 980px;
    overflow: hidden
}

    .slides_container a {
        display: block;
        width: 980px;
        height: 380px
    }

        .slides_container a img {
            display: block
        }

#slides .next, #slides .prev {
    display: block;
    position: absolute;
    width: 20px;
    height: 20px;
    bottom: 9px;
    left: 12px;
    padding: 0;
    z-index: 12
}

#slides .prev {
    background: transparent url('images/left-arrow.png') center center no-repeat
}

#slides .next {
    left: 96px;
    background: transparent url('images/right-arrow.png') center center no-repeat
}

.pagination_wrap {
    display: inline-block;
    position: absolute;
    z-index: 10;
    bottom: 0;
    right: 0;
    width: 128px;
    height: 40px;
    opacity: 0.8;
    background-color: #222
}

.pagination {
    position: absolute;
    z-index: 11;
    bottom: 0;
    right: 0;
    padding: 0;
    margin: 15px 40px
}

    .pagination li {
        float: left;
        margin: 0 3px;
        list-style: none
    }

        .pagination li a {
            float: left;
            display: block;
            width: 9px;
            height: 0;
            padding-top: 8px;
            background-image: url(images/pagination.png);
            background-position: 0 0;
            overflow: hidden
        }

        .pagination li.current a {
            background-position: 0 -9px
        }

.dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus, .dropdown-submenu:hover > a, .dropdown-submenu:focus > a {
    background-image: none !important;
    outline: none !important
}

.row-fluid [class*='span']:not([class*='dnnSortable']) {
    min-height: 0 !important
}

.brand.hidden-desktop {
    max-width: 60%
}

.navbar .nav > .active > a,
.navbar .nav > .active > a:hover,
.navbar .nav > .active > a:focus {
    box-shadow: none !important;
    background-color: transparent !important;
    outline: none !important
}

.nav-tabs .open .dropdown-toggle,
.nav-pills .open .dropdown-toggle,
.nav > li.dropdown.open.active > a:hover,
.nav > li.dropdown.open.active > a:focus {
    background-color: transparent !important;
    color: #D00 !important;
    outline: none !important
}

.dropdown, .dropdown a {
    outline: none !important
}

.carousel {
    margin-bottom: 0
}

.carousel-inner > a > img {
    max-width: 100% !important;
    height: auto !important;
    width: 100% !important
}

.carousel-inner img {
    max-width: 100% !important;
    height: auto !important;
    width: 100% !important
}

.ControlContainer {
    width: 940px !important
}

.caret {
    transition: border-color 0.35s
}

.dropdown:hover .caret, .active .caret {
    border-top: 4px solid #ff2d16 !important
}

.carousel-indicators {
    position: absolute;
    top: 25px;
    right: 3.9%;
    z-index: 5;
    list-style: outside none none;
    margin: 0
}

    .carousel-indicators li {
        border: 1px solid #999;
        background: #f0f0f0;
        border-radius: 10px;
        cursor: pointer
    }

        .carousel-indicators li:hover, .carousel-indicators .active {
            background: #d8d8da;
            border: 1px solid #666
        }

.carousel-caption {
    position: absolute;
    left: 0;
    bottom: 42.5%;
    background: rgba(255,255,255,0.75);
    width: 59.7%;
    padding-left: 3.9%
}

    .carousel-caption h2 {
        margin: 0;
        line-height: 20px
    }

.carousel-control {
    opacity: 0.4;
    position: absolute;
    top: 51%;
    background: transparent;
    width: 33px;
    height: 33px;
    border: none;
    line-height: 30px;
    text-align: center;
    transition: opacity 0.15s
}

    .carousel-control.left {
        top: 0;
        left: 0;
        background: rgba(255,255,255,0.6) url("images/main-slider-button-prev.png") no-repeat 0 50%;
        width: 50px;
        height: 100%;
        margin: 0;
        border-radius: 0
    }

    .carousel-control.right {
        top: 0;
        right: 0;
        background: rgba(255,255,255,0.6) url("images/main-slider-button-next.png") no-repeat 0 50%;
        width: 50px;
        height: 100%;
        margin: 0;
        border-radius: 0
    }

    .carousel-control span {
        display: none
    }

    .carousel-control:hover, .carousel-control:focus {
        opacity: 0.9
    }

.DnnModule-515 {
    height: 330px
}

ul.searchSkinObjectPreview > li p b {
    color: #333
}

.DNNContainer_Title_h2 h2 .TitleH2 {
    display: block;
    margin-bottom: 25px;
    font-weight: normal
}

.DNNContainer_Title_h3 h3 .TitleH3 {
    display: block;
    padding-bottom: 10px;
    margin-bottom: 25px;
    border-bottom: solid 1px #c0c0c0
}

.DNNContainer_Title_h4 h4 .TitleH4 {
    display: block;
    margin-bottom: 25px
}

.copyright-container {
    margin-bottom: 20px;
    text-align: center;
    background: url('images/copyright-background.png') no-repeat center center
}

    .copyright-container a {
        color: #fff;
        font-family: "Open Sans",Verdana,Arial;
        font-size: 14px;
        background: url('Images/icon-btn-sm-circle-arrow.png') no-repeat right 12px center;
        background-color: #aaa;
        -webkit-border-radius: 3px;
        border-radius: 3px;
        margin: 0 12px;
        padding: 9px 36px 9px 16px
    }

        .copyright-container a:hover {
            background-color: #666
        }

    .copyright-container > span.split {
        border-bottom: 1px solid #d9d9d9;
        display: inline-block;
        width: 20px;
        height: 0px;
        overflow: hidden;
        padding-top: 9px;
        vertical-align: top
    }

/* new */

#userControls {
    position: relative
}

.container {
    background: #fff
}

.bg-image-left {
    opacity: 0.75;
    display: block;
    background: url("images/bg-image-left.png") repeat-y;
    position: absolute;
    top: 0;
    left: -10px;
    width: 10px;
    height: 1200px
}

.bg-image-right {
    opacity: 0.75;
    display: block;
    background: url("images/bg-image-right.png") repeat-y;
    position: absolute;
    top: 0;
    right: -10px;
    width: 10px;
    height: 1200px
}

.startseite-slider {
    position: relative
}

a.startseite-text-banner {
    position: absolute;
    top: 44.75%;
    left: 0;
    background: rgba(255,45,22,0.75);
    padding: 0.625% 4.2%;
    color: #fff;
    font-weight: bold;
    font-size: 14px;
    width: 55%
}

.startseite-sub-links {
    margin-top: 7px
}

    .startseite-sub-links a {
        background: url('images/link-arrow.png') no-repeat right 6px;
        padding-right: 12px
    }

.startseite-text-banner a {
    margin-right: 8.5%;
    color: #fff;
    font-size: 14px
}

.branches-banner {
    position: relative
}

.branches-text-banner {
    position: absolute;
    top: 28.7%;
    left: 0;
    background: rgba(0, 93, 168, 0.75);
    padding: 1.5% 4.2% 2.2% 4.2%;
    color: #fff;
    font-size: 18px;
    width: 40.2%;
    line-height: 32px
}

.banner {
    position: relative
}

.banner-intro-text {
    position: absolute;
    top: 75px;
    left: 25px;
    background: rgba(255,255,255,0.75);
    width: 92.2%;
    padding: 0px 1.95% 0.25%
}

    .banner-intro-text p {
        color: #333
    }

    .banner-intro-text .columns-2 {
        -webkit-column-rule: none;
        -moz-column-rule: none;
        column-rule: none
    }

#DnnModule-Olsmar_KonsultCarousel {
    position: absolute !important;
    top: 50px !important;
    right: 0 !important
}

.content {
    position: relative;
    clear: both;
    min-height: 820px;
    margin-top: 1.15%;
    padding: 0 3.9%
}

.content-border-top {
    margin: 0;
    padding-top: 2.5%;
    border-top: 15px solid #f0f0f0
}

.columns-2 {
    -webkit-columns: 2;
    -moz-columns: 2;
    columns: 2;
    -webkit-column-rule: 1px dotted #ccc;
    -moz-column-rule: 1px dotted #ccc;
    column-rule: 1px dotted #ccc;
    -webkit-column-gap: 16px;
    -moz-column-gap: 16px;
    column-gap: 16px
}

.content-teaser img {
    float: left
}

article {
    width: 66%;
    min-height: 500px
}

.no-text-justification p {
    text-align: left
}

aside {
    background: #f0f0f0;
    width: 28%;
    min-height: 1200px;
    margin-right: -4.3%;
    padding: 0 4.3% 2% 2.84%
}

    aside ul li {
        padding-bottom: 1%;
        font-size: 13px;
        line-height: 22px
    }

    aside p {
        text-align: left
    }

.link-button {
    background: url("images/link-icon.png") no-repeat;
    width: 17px;
    height: 17px;
    padding-left: 20px;
    font-weight: bold
}

.open-button {
    background: url("images/open-icon.png") no-repeat;
    width: 17px;
    height: 17px;
    margin: 1% 0;
    padding-left: 20px;
    font-weight: bold
}

.closing-button, .top-button {
    background: url("images/closing-icon.png") no-repeat;
    width: 17px;
    height: 17px;
    margin: 1% 0;
    padding-left: 20px;
    font-weight: bold
}

.teaser {
    -webkit-column-rule: none;
    -moz-column-rule: none;
    column-rule: none
}

    .teaser img {
        padding: 1.5%;
        border: 1px dotted #ccc
    }

.content-left {
    width: 49.4%
}

.content-right {
    width: 49.3%
}

.content-left {
    float: left;
    margin-bottom: 1.25%
}

    .content-left img {
        cursor: zoom-in
    }

    .content-left .product-image {
        cursor: zoom-in
    }

.content-right {
    float: right;
    margin-bottom: 1.25%
}

    .content-right h2 {
        margin: 0
    }

.thumbnail {
    float: left;
    width: 29%;
    margin: 3.5% 3.5% 0 0;
    border: 1px solid #e1e1e1;
    transition: border-color 0.35s
}

    .thumbnail:hover {
        border: 1px solid #ff2d16
    }

    .thumbnail img {
        cursor: pointer
    }

.reference-images,
.wrap-reference-images {
    margin-left: -7px;
    margin-right: -7px
}

    .reference-images img {
        cursor: zoom-in
    }

.reference-image {
    display: inline-block;
    padding: 5px 7px 5px 7px;
    box-sizing: border-box;
    vertical-align: top;
}

    .reference-image.separation {
        margin-top: 0;
        margin-bottom: 0
    }

    .reference-image img {
        max-height: 125px;
        cursor: zoom-in;
        transition: transform 0.25s
    }
        /* image edit ratio 185 x 125 */
        .reference-image img:hover {
            transform: scale(1.35);
            transition: transform 0.25s;
            box-shadow: 0 0 5px rgba(0,0,0,0.15)
        }

.single-image img {
    cursor: zoom-in;
    transition: transform 0.25s
}

    .single-image img:hover {
        transform: scale(1.5);
        transition: transform 0.25s;
        box-shadow: 0 0 5px rgba(0,0,0,0.15)
    }

.no-zoom img {
    transition: none;
    box-shadow: none !important
}

    .no-zoom img:hover {
        transform: none
    }

.margin-right-0 {
    margin-right: 0 !important
}

article .reference-image img {
    max-height: 122px
}

h3.references-note {
    color: #588022;
    font-size: 18px
}

.no-transform {
    transform: none !important
}

.self-made {
    position: absolute;
    top: -0.5%;
    right: 3.9%
}

/* --- webshop --- */
.webshop-info {
    padding: 10px;
    color: #f00;
    border: 1px dotted #f00
}

.form-field {
    float: left;
    width: 50%;
    margin: 0.5% 0
}

    .form-field a:hover {
        color: #327dc8;
        cursor: pointer
    }

    .form-field input[type="checkbox"] {
        float: left;
        width: 0;
        margin-right: 1.5%
    }

.modal-popup .form-field {
    width: 33.3%
}

.form-field label {
    cursor: auto
}

    .form-field label a {
        text-decoration: underline
    }

.form-field input, .form-field select {
    display: block;
    width: 85%;
    margin: 1% 0
}

.form-field select {
    width: 88.7%
}

.color {
    display: inline-block;
    width: 35px;
    height: 22px;
    margin-right: 2%;
    cursor: pointer
}

    .color:hover {
        outline: 1px solid #ff2d16
    }

.color-selected {
    outline: 1px solid #ff2d16
}

.reinweiss {
    background-color: #f1ece1
}

.silbermetallic {
    background-color: #a1a1a0
}

.graumetallic {
    background-color: #878581
}

.azurblau {
    background-color: #225f78
}

.anthrazit {
    background-color: #383e42
}

.karminrot {
    background-color: #9b2321
}

.ziegelrot {
    background-color: #8d4931
}

.rotbraun {
    background-color: #66332b
}

.sepiabraun {
    background-color: #4a3526
}

/* --- end webshop ? --- */

.button, .tab {
    display: inline-block;
    background: #1f82c1;
    width: auto !important;
    padding: 10px 15px !important;
    color: #fff !important;
    font-weight: bold;
    border: none !important;
    border-radius: 5px;
    white-space: nowrap;
    cursor: pointer;
    transition: opacity 0.35s !important
}

    .button:hover, .button:focus, .tab:hover, .tab:focus {
        opacity: 0.85 !important;
        background: #1f82c1;
        width: auto !important;
        color: #fff;
        border: none !important
    }

.order-button {
    display: inline-block;
    margin: 2% 0 !important
}

.deactivated {
    background: #ccc
}

    .deactivated:hover {
        opacity: 1 !important;
        background: #ccc;
        cursor: inherit !important
    }

.category h1 {
    margin: 0 0 15px 0
}

.category img {
    cursor: pointer
}

.category .link-button {
    margin-left: 6px
}

.category-content {
    float: left;
    width: 58%
}

    .category-content h2 {
        margin: 7.6% 0 1.5% 0;
        padding-bottom: 1%;
        border-bottom: 1px solid #e6e6e6
    }

    .category-content h3 {
        margin: 5% 0 1.5% 0;
        padding-bottom: 1%;
        border-bottom: 1px solid #e6e6e6
    }

.category-text {
    color: #008cd6;
    font-size: 12px;
    font-weight: bold
}

.categories-menu {
    float: right;
    background: #e6e6e6;
    width: 24.1%;
    margin: 2.1% 4.2% 0 0;
    padding: 1.25% 2.5% 2.5% 2.5%
}

    .categories-menu ul li {
        list-style: none;
        font-size: 13px;
        line-height: 36px
    }

        .categories-menu ul li a {
            transition: color 0.35s
        }

            .categories-menu ul li a:hover, .categories-menu ul li a:focus, .categories-menu ul li a:active {
                color: #327dc8
            }

            .categories-menu ul li a.active {
                color: #003a6c !important
            }

.trademark {
    font-weight: normal
}

.margin-top {
    margin-top: 25px
}

.margin-bottom-0 {
    margin-bottom: 0 !important
}

.border-bottom {
    border-bottom: 1px solid #e6e6e6;
    padding-bottom: 15px
}

.navbar .btn-navbar {
    margin-left: 0;
    margin-right: 0;
    padding: 7px 15px
}

.navbar .btn, .navbar .btn-group {
    margin-top: 58px
}

.tabs {
    margin: 25px 0 20px 0
}

    .tabs a {
        display: inline-block;
        margin-bottom: 5px;
        font-size: 14px
    }

        .tabs a.selected {
            background: #c8c8c8
        }

            .tabs a.selected:hover {
                opacity: 1 !important;
                cursor: auto
            }

    .tabs .tab {
        margin-right: 1px;
        border-radius: 0
    }

        .tabs .tab:first-child {
            border-top-left-radius: 5px
        }

        .tabs .tab:last-child {
            border-top-right-radius: 5px
        }

.pnlInfo-Film, .pnlMetallbalkone, .pnlMetalldaecher, .pnlGaubenverkleidungen, .pnlKaminverkleidungen, .pnlDachentwaesserung, .pnlTonnendaecher, .pnlLeistendaecher, .pnlTreppendaecher, .pnlIndustriedaecher, .pnlWellprofile, .pnlWinkelstehfalz, .pnlLamellenfassaden, .pnlLochblechfassaden, .pnlSchindelfassaden, .pnlMetallverbundfassaden, .pnlHandwerker, .pnlSonstige, .pnlSondereinzelfertigung, .pnlSerienfertigung, .pnlLuft-und-Klimatechnik, .pnlMetallwaende, .pnlMoebel-Theken, .pnlBarrierefrei, .pnlWasseraufbereitung, .pnlRegenwassernutzung, .pnlKundendienst, .pnlArmaturen-Kueche-Bad, .pnlRenovierung, .pnlWanne-Wanne {
    display: none
}

ul.searchSkinObjectPreview > li p {
    font-style: normal
}

.DnnModule-SearchResults, .DnnModule- {
    padding: 0 4.2%
}

.dnnLabel {
    width: 26.6%;
    text-align: left
}

.DS-Backward, .DS-Forward {
    display: none !important
}

.modal-popup {
    display: none;
    position: absolute;
    top: 10%;
    left: 0;
    right: 0;
    z-index: 100000;
    background: #fff;
    width: 59.3%;
    min-width: 350px;
    min-height: 150px;
    margin: 0 auto;
    padding: 35px;
    box-shadow: 0 0 10px rgba(0,0,0,0.15)
}

.product-image-popup {
    text-align: center
}

.filter-editor-popup {
    top: 15%;
    max-height: 70%;
    overflow: auto
}

h4.confirmation-success-title {
    background: url(../img/success-check.png) no-repeat;
    padding-left: 28px;
    color: #090
}

h4.confirmation-error-title {
    background: url(../img/attention-sign.png) no-repeat 0 -2px;
    padding: 2px 0 0 33px;
    color: #c00
}

.close-popup-button {
    position: absolute;
    top: 20px;
    right: 25px;
    background: url("images/close-icon.png") no-repeat;
    width: 22px;
    height: 22px;
    cursor: pointer
}

.popup-ok-button {
    float: left;
    padding: 6px 30px !important
}

.mount-button {
    margin-bottom: 30px
}

.close-button {
    margin-right: 0 !important;
    cursor: pointer
}

.modal-popup-overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1000;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.25)
}

.team-image {
    width: 48% !important
}

    .team-image img {
        width: 100% !important;
        max-height: none !important
    }

.order-popup ul {
    margin: 1% 0 3.5% 0
}

    .order-popup ul li {
        float: left;
        padding-right: 2.5%;
        list-style: inside;
        white-space: nowrap
    }

.control-group {
    float: left;
    width: 45%;
    margin: 0 5% 2.5% 0
}

    .control-group input, .control-group select, .control-group textarea {
        margin-top: 1%
    }

.control-group-textarea {
    width: 95%
}

    .control-group-textarea textarea {
        min-height: 200px;
        margin-top: 1%;
        resize: none
    }

.success-message {
    color: #00c800;
    padding: 1%;
    border: 1px dotted #00c800
}

.error-message, .alert-error {
    color: #ff2d16;
    padding: 1%;
    border: 1px dotted #f00
}

.error {
    color: #ff2d16
}

    .error input, .error select, .error textarea {
        color: #ff2d16;
        border: 1px dotted #f00 !important
    }

        .error input:focus, .error select:focus, .error textarea:focus {
            background: transparent
        }

.DNNContainer_Title_h2 > h2 {
    display: none
}

.control-group input[type="checkbox"] {
    width: 10px;
    margin: -3px 5px 0 0
}

.control-group label {
    cursor: auto
}

.video-js {
    background: transparent !important;
    width: 100% !important;
    height: 445px !important
}

.vjs-poster {
    background: transparent !important
}

#footer {
    padding: 1.5% 3.9%
}

.footer-menu {
    background: #e6e6e6;
    width: 108.5%;
    margin: 25px 4.2% 25px -4.2%
}

    .footer-menu ul {
        margin-left: 3.9%;
        padding: 5px 0
    }

        .footer-menu ul li {
            display: inline;
            list-style: none;
            margin-right: 40px
        }

            .footer-menu ul li a {
                color: #333;
                transition: color 0.25s ease-in-out
            }

                .footer-menu ul li a:hover {
                    color: #ff2d16;
                    transition: color 0.25s ease-in-out
                }

.footer-bottom .social-media {
    margin: 0 0 20px 0;
}
.footer-bottom .social-media::after {
    content: "";
    display: table;
    clear:both;
}

.footer-bottom a.facebook, .footer-bottom a.instagram {
    display: block;
    float: left;
    margin-right: 10px;
    width: 40px;
    height: 40px;
}

.footer-bottom .ico-facebook {
    width: 40px;
    height: 40px;
    background: url(Images/icon-facebook.png) no-repeat top;
}

.footer-bottom .ico-facebook:hover {
    background: url(Images/icon-facebook.png) no-repeat bottom;
}

.footer-bottom .ico-instagram {
    width: 40px;
    height: 40px;
    background: url(Images/icon-instagram.png) no-repeat top;
}

.footer-bottom .ico-instagram:hover {
    background: url(Images/icon-instagram.png) no-repeat bottom;
}

.media img {
    width: 183px;
    margin: 0 20px 0 0;
}

.width-like-reference-images {
    width: 96.3%
}

@media (min-width:1300px) {
    .container, .navbar-static-top .container, .navbar-fixed-top .container, .navbar-fixed-bottom .container {
        width: 1300px
    }

    select.status-options {
        display: none
    }

    .ControlContainer {
        width: 1170px !important
    }

    .category-intro-text {
        display: none
    }
}

@media (max-width:1300px) {
    .modal-popup {
        width: 80%
    }

    .category-intro-text {
        display: none
    }

    .video-js {
        height: 400px !important
    }
}

@media (max-width:1350px) {
    .navbar .nav > li {
        margin-left: 20px
    }

        .navbar .nav > li a {
            font-size: 13px
        }

    .banner-intro-text {
        display: none
    }

    .category-intro-text {
        display: block
    }

    .video-js {
        height: 320px !important
    }

    .self-made {
        top: -1%
    }
}

@media (max-width:1200px) {
    #Body {
        margin: 0;
        padding: 0;
    }

    #siteHeadouter > .container, #contentWrapper > .container {
        width: 94%;
        padding-left: 2%;
        padding-right: 2%
    }

    .content_products ul li {
        width: 47.5%
    }

    select.status-options {
        display: none
    }

    .content_adstyleOne {
        width: 100% !important;
        max-width: 100%
    }

        .content_adstyleOne img {
            width: 103% !important;
            max-width: 103%
        }

        .content_adstyleOne .adContent {
            bottom: 0;
            right: -3%
        }

    .content_adstyleOne, .content_adstyleTwo {
        margin-bottom: 15px
    }

    .navbar .nav > li {
        margin: 10px 0
    }

        .navbar .nav > li a {
            font-size: 14px
        }

    .nav-collapse, .nav {
        width: 100%
    }

        .nav li {
            padding: 0 !important;
            min-height: 30px !important;
            height: auto
        }

        .nav-collapse .dropdown-menu {
            margin: 0 0 0 4% !important;
            width: 95% !important
        }

            .nav-collapse .nav > li a, .nav-collapse .dropdown-menu a {
                height: 35px !important;
                padding: 5px 15px !important;
                font-weight: normal;
                line-height: 36px !important;
                border: 1px solid #eee !important
            }

        .nav-collapse .dropdown.open > a {
            background-color: #eee !important
        }

        .nav > li > ul {
            position: relative !important;
            width: 100% !important
        }

    .nav {
        width: 100%;
    }

    .navbar .nav > li > .dropdown-menu {
        top: 5px;
        margin-bottom: 30px !important
    }

    img {
        max-width: 100%
    }

    #userControls {
        width: 98%
    }

    #siteHeadouter > .container, #contentWrapper > .container {
        width: 98%;
        padding-left: 0;
        padding-right: 0
    }

    .content h2 {
        font-size: 16px
    }

    .bg-image-left, .bg-image-right {
        display: none
    }

    .startseite-text-banner, .branches-text-banner {
        font-size: 14px
    }

    .categories p {
        font-size: 13px
    }

    .footer-menu ul li {
        margin-right: 25px
    }

    .video-js {
        height: 300px !important
    }

    .nav-collapse {
        top: 20px !important
    }

    .caret {
        margin-top: 11px !important;
        border-left: 16px solid transparent;
        border-right: 16px solid transparent;
        border-top: 16px solid #afafaf
    }

    .dropdown:hover .caret, .active .caret {
        border-top: 16px solid #ff2d16 !important
    }

    .navbar .nav > li > .dropdown-menu {
        left: 0
    }
}

@media (max-width:767px) {
    #Body {
        margin: 0;
        padding: 0
    }

    #search {
        margin-bottom: 10px
    }

    #siteHeadouter > .container,
    #contentWrapper > .container {
        width: 90%;
        padding-left: 5%;
        padding-right: 5%
    }

    .language-object {
        right: 3.1%
    }

    .NormalTextBox {
        display: none
    }

    .content_products ul {
        margin: 0 -2%
    }

        .content_products ul li {
            width: 45.5%;
            margin: 0 2% 45px
        }

    .adContent {
        padding-top: 5px
    }

        .adContent h2 {
            font-size: 18px
        }

    .carousel-indicators {
        display: none
    }

    .carousel-caption {
        bottom: 20%
    }

    .content_adstyleOne {
        width: 100% !important;
        max-width: 100%
    }

        .content_adstyleOne img {
            width: 100% !important;
            max-width: 100%
        }

        .content_adstyleOne .adContent {
            bottom: 0;
            right: 0%
        }

    #siteHeadouter > .container, #contentWrapper > .container {
        width: 100%;
        padding: 0
    }

    article {
        float: none;
        width: 100%
    }

    aside {
        float: none;
        width: 100%
    }

    .columns-2 {
        -webkit-columns: 1;
        -moz-columns: 1;
        columns: 1;
        -webkit-column-rule: none;
        -moz-column-rule: none;
        column-rule: none;
        -webkit-column-gap: none;
        -moz-column-gap: none;
        column-gap: none
    }

    .content-left, .content-right {
        float: none;
        width: auto
    }

    .product-image {
        cursor: auto !important
    }

    .product-image-popup {
        display: none !important
    }

    .modal-popup {
        top: 0;
        left: 0;
        width: 100%;
        overflow: scroll
    }

        .modal-popup .form-field {
            width: 50%
        }

    .carousel-control {
        bottom: 10px;
        height: 20px;
        width: 20px;
        border: none;
        border-radius: 0;
        z-index: 6;
        background-position: center center;
        background-repeat: no-repeat;
        background-color: transparent
    }

    .carousel-indicators {
        background: rgba(34, 34, 34,0.7);
        top: 0;
        padding: 15px 55px 15px 30px;
        right: 0
    }

        .carousel-indicators li {
            margin-bottom: 0
        }

    .carousel-control.right {
        background-image: url(images/right-arrow.png) center;
        text-indent: -9999px;
        height: 100% !important;
        right: 0px
    }

    .carousel-control.left {
        background-image: url(images/left-arrow.png) center;
        text-indent: -9999px;
        height: 100% !important;
        left: auto
    }

    .reference-images,
    .wrap-reference-images {
        margin-left: -1%;
        margin-right: -1%
    }

    .reference-image {
        width: 30%;
        padding: 5px 1% 5px 1%;
    }

    #dnn_dnnLOGOmobi_imgLogo {
        margin-left: 15px
    }

    aside .reference-image {
        width: auto
    }

    #userControls {
        width: 100%
    }
}

@media (max-width:480px) {
    #Body {
        margin: 0;
        padding: 0
    }

    #dnn_dnnSearch_txtSearch {
        width: 200px
    }

    .carousel-caption {
        display: none
    }

    .content_products ul li {
        width: 98%
    }

    .LoginPanel {
        width: 90% !important
    }

    .moduleSearch {
        width: inherit;
        float: none;
        padding-right: 20px
    }

        .moduleSearch input {
            width: 100% !important;
            margin-bottom: 10px !important
        }

        .moduleSearch > input[type="text"] + a {
            float: left;
            width: auto
        }

    ul.searchSkinObjectPreview {
        width: 213px
    }

    div.blog-list-title {
        width: inherit
    }

    div[class*="status-container"] {
        padding: 0 20px
    }

    .link-wrap {
        display: none
    }

    select.status-options {
        margin: 20px 0;
        width: 100%
    }

    table.idea-list-table tbody td {
        padding: 10px 5px !important
    }

    .idea-list-vote-panel {
        width: auto
    }

    .dnnSocialLink span {
        line-height: 1;
        font-size: inherit
    }

    .answer-list-tbl-container {
        padding: 0
    }

    table.answer-list-table td {
        padding-left: 5px
    }

    .status-expanded-container .profile-topContainer > .dnnRight > ul.profile-statistics > li {
        width: 33%
    }

    .status-expanded-container .profile-topContainer > .dnnRight > ul.profile-statistics {
        width: 200px
    }

    .dnnSocialLink .profile-link {
        margin-top: 50px
    }

    .modal-popup .form-field {
        width: 100%
    }

    .control-group {
        width: 90%
    }

    .video-js {
        height: 200px !important
    }

    .sub-category-buttons a, .sub-category-buttons a:hover {
        width: 87.5% !important
    }

    .button, .tab, .button:hover, .tab:hover {
        width: 86% !important;
        text-align: center
    }
}
/* --------- start social media icons in header -----------*/
.social-media-header {
    position: absolute;
    top: 52px;
    right: 440px;
}
@media (max-width: 767px) {
    .social-media-header {
        display: none;
    }
}

    .social-media-header::after {
        content: "";
        display: table;
        clear: both;
    }

    .social-media-header a.facebook, .social-media-header a.instagram {
        display: block;
        float: left;       
        width: 32px;
        height: 32px;
    }
    .social-media-header a.facebook {
        margin-right: 10px;
    }
    .social-media-header a.instagram {
        margin-right: 10px;
    }
    .social-media-header .ico-facebook {
        width: 32px;
        height: 32px;
        background: url(Images/icon-facebook-32px.png) no-repeat top;
    }

        .social-media-header .ico-facebook:hover {
            background: url(Images/icon-facebook-32px.png) no-repeat bottom;
        }

.social-media-header .ico-instagram {
    width: 32px;
    height: 32px;
    background: url(Images/icon-instagram-32px.png) no-repeat top;
}

        .social-media-header .ico-instagram:hover {
            background: url(Images/icon-instagram-32px.png) no-repeat bottom;
        }
/* --------- end social media icons in header -----------*/
/* --------- nur neue styles für webshop 2018 -----------*/
/*grid*/
.columns-holder {
    margin: 0 -2.5% 0 -2.5%;
    box-sizing: border-box;
}

    .columns-holder .grid-3col {
        box-sizing: border-box;
        float: left;
        width: 28.33333%;
        margin: 3.5% 2.5% 0 2.5%;
    }

.form-wrapper .form-field {
    width: 33.3%
}

@media (max-width:767px) {
    .form-wrapper .form-field {
        width: 50%
    }
}

@media (max-width:480px) {
    .form-wrapper .form-field {
        width: 100%
    }
}

/* thumbnail grid*/
.shop-thumbnails-grid {
    margin: 0 -1.5% 0 -1.5%;
    box-sizing: border-box;
    width: 98%;
}

.shop-thumbnail-4col-grid {
    box-sizing: border-box;
    float: left;
    width: 22%;
    margin: 3.5% 1.5% 0 1.5%;
    border: 1px solid #e1e1e1;
    transition: border-color 0.35s
}

.shop-thumbnail:hover {
    border: 1px solid #ff2d16
}

.shop-thumbnail img {
    cursor: pointer;
    box-sizing: border-box;
}

/*product navi*/

.product .product-label {
    word-wrap: break-word
}

.product-img {
    border: 1px solid #e1e1e1;
    transition: border-color 0.35s
}

.product.product-selected .product-img {
    border: 1px solid #ff2d16;
}

.product.product-selected .product-label {
    color: #ff2d16;
}

.product:hover .product-img {
    border: 1px solid #ff2d16;
    transition: border-color 0.35s
}

.product:hover .product-label {
    color: #ff2d16;
    transition: border-color 0.35s
}


/* warenkorb */
.shop-headline {
    color: #ff2d16;
}

.table-responsive-wrap {
    overflow-x: auto;
}

.shopcart-tbl,
.shopcart-summary-tbl {
    width: 100%;
    border: none;
    border-collapse: collapse;
    min-width: 530px;
}

    .shopcart-tbl thead tr th {
        background-color: #E6E6E6;
    }

.shopcart-tbl {
    border-bottom: 1px dotted #ccc;
    margin-top: 10px;
    margin-bottom: 10px;
}

    .shopcart-tbl thead tr th,
    .shopcart-tbl tbody tr td,
    .shopcart-summary-tbl tr td {
        padding: 3px 8px;
    }

    .shopcart-tbl tr th.tbl-col-descript {
        text-align: left;
    }

    .shopcart-tbl tr th.tbl-col-amount,
    .shopcart-tbl tr td.tbl-col-amount,
    .shopcart-tbl tr th.tbl-col-price,
    .shopcart-tbl tr td.tbl-col-price,
    .shopcart-summary-tbl tr td:nth-child(2) {
        text-align: right;
    }

.shopcart-total {
    font-size: 16px;
    font-weight: bold;
}

.shopcart-tbl tr .delete-icon {
    display: block;
    background: url("/Resources/Com-Active/img/delete-icon.png") no-repeat;
    width: 13px;
    height: 16px;
}

.shopcart.order {
    margin-bottom: 20px;
    max-width: 950px;
}

.shopcart-tbl tr .delete-icon:hover {
    background: url("/Resources/Com-Active/img/delete-icon.png") bottom no-repeat;
}

@media (max-width: 480px) {
    .order-buttons a.button {
        float: none;
        margin-bottom: 15px
    }
}

.btn-delivery-address-wrap {
    margin: 15px 0 20px 0
}

.delivery-address {
    display: none;
}

.terms-conditions {
    margin: 15px 0 20px 0
}

    .terms-conditions input[type="checkbox"] {
        width: 20px;
    }

.order-confirm-headline.headline-success {
    background: url("/Resources/Com-Active/img/success-check.png") 0 5px no-repeat;
    padding-left: 28px;
    color: #090;
}

.order-confirm-headline.headline-error {
    color: #ff2d16;
}

.order-confirm-mail {
    color: #090;
}

.payment-col {
    width: 33.3%;
    min-width: 250px;
    margin-bottom: 20px;
    float: left;
}

.controls .control-data {
    font-weight: bold;
}

.shop .product-image {
    cursor: auto;
}

.orderdata-page.content, .thankyou-page.content {
    min-height: 620px;
}


.requestFormCustomerRow {
    width: 100%;
}

.requestFormCustomerCell {
    width: 300px;
    float: left;
}

.requestFormLabel {
    width: 68px;
    float: left;
    margin-top: 10px;
}
/* --------- end webshop ----------- */

/* ---------  cookie note / complience, Cookie Hinweis ---------- */
.cookie-note {position:fixed; bottom: 10px; left: 0; right: 0; background:#050706; padding:20px 30px;  z-index:999; box-shadow:0px 0px 8px #555;}

.cookie-note .cookie-message {width:85%; float:left; display:block; padding: 0; margin:0; color:#eee; font-size:14px; line-height:1.5;}
.cookie-note a.cookieinfo {color:#008854; text-decoration:underline;}
.cookie-note a.cookieinfo:hover {color:#005937;}

.cookie-note .cookie-button {width:15%; min-width:50px; float:right;}
.cookie-note .cookie-button a.button {cursor:pointer; background:#008854; color:#fff; padding:8px 14px; margin:0 0 0px 20px; text-decoration:none; border-radius:3px; font-size:13px; font-weight: bold; float: right;}
.cookie-note .cookie-button a.button:hover {background-color:#005937;}

@media screen and (max-width: 500px) {
    .cookie-note .cookie-message {width:100%; float:left; margin-bottom:20px;}
    .cookie-note .cookie-button {width:100%; min-width:50px; float:right;}
}

@media screen and (min-width: 992px) {
    .cookie-note {width:75%; max-width:500px; bottom:10px;  left:10px; border-radius:0px;}
}
/* --------- end cookie note / complience, Cookie Hinweis ---------- */
