﻿html, body {
    overflow-x: hidden;
}

/*-----------FOOTER-------------*/
.footer-2 {
    padding: 35px 0px 0px;
    position: relative;
    margin-top: 30px;
}


.footer-2 .connect ul {
    list-style: none;
    margin: 8px 0px 10px;
    padding: 0px;
}

.footer-2 .connect ul:after {
    content: " ";
    clear: both;
    display: block;
}

.footer-2 .connect ul li {
    margin: 0px 8px;
    float: left;
}

ul.social-media li.fb {
    background: none;
    padding: 0;
}

.footer-2 .connect ul li.fb a { background-position: 0px 0px; }

.footer-2 .connect ul li.twt a { background-position: -45px 0px; }

.footer-2 .connect ul li.in a { background-position: -92px 0px; }

.footer-2 .connect ul li.gplus a { background-position: -138px 0px; }

.footer-2 .connect ul li:first-child { margin-left: 0px; }

.footer-2 .connect ul li:last-child { margin-right: 0px; }

.footer-2 .connect p {
    font-size: 14px;
    line-height: 150%;
}

.footer-2 .connect p a { margin-right: 0px; }

.footer-2 .copyright img {
    margin: 0px 0px 18px;
    display: block;
}

.footer-2 .copyright p {
    font-size: 14px;
    margin: 0px 0px 5px;
}

.footer-2 .accredited { text-align: center; }

.footer-2 .accredited img { margin: 0px 0px 13px; }

.footer-2 .accredited p {
    font-size: 14px;
    margin-bottom: 3px;
}

.footer-2 #back2top {
    width: 48px;
    height: 48px;
    text-align: center;
    background: #636262;
    color: #fff;
    border-radius: 50px;
    font-size: 24px;
    padding: 7px 5px 7px 8px;
    position: absolute;
    top: 18px;
    right: 70px;
    cursor: hand;
    cursor: pointer;
    opacity: 0.5;
    transition: all ease 0.5s;
    z-index: 300;
}

.footer-2 #back2top:hover { opacity: 1; }

@media print {
    .no-print, .no-print * {
        display: none !important;
    }
}

.fa, .fas { font: normal normal 900 26px/1 "Font Awesome 5 Pro"; }

.far { font: normal normal 400 26px/1 "Font Awesome 5 Pro"; }

.fab { font: normal normal 900 26px/1 "Font Awesome 5 Brands"; }

#social { display: inline-block; }

#social li {
    float: left;
    position: relative;
    margin: 0 5px 0 5px;
}

#social i.fa-brands {
    font-size: 32px;
}

/*--------General Styles-----------*/

.container {
    width: 100%;
    max-width: 1225px;
    padding: 0px 20px;
}


.font-weight-bold { font-weight: bold; }

.field-validation-error {
    color: Red;
    font-weight: bold;
}

input.input-validation-error, select.input-validation-error {
    background-color: #f4cecd;
    border: 1px solid #d9534f
}

input[type=checkbox].input-validation-error {
    box-shadow: 0 0 6px 4px #f4cecd;
}

.btn-primary { color: white !important; }

.btn-success { color: white !important; }

.btn-warning { color: white !important; }

.btn-whiteoutline {
    border: 1px solid #fff;
    border-radius: 0px;
    background: transparent;
    color: #fff;
    padding: 6px 18px 6px;
    margin-left: 30px;
}

.btn-linkcoloroutline {
    border-radius: 0px;
    background: transparent;
    color: #fff;
    padding: 6px 18px 6px;
    margin-left: 30px;
}

.btn-profilesubmit {
    background: #7DC142;
    color: white !important;
    border: none !important;
    padding: 10px 20px;
    font-weight: bold;
}

.Padding6x18px { padding: 6px 18px 6px 18px; }


.floating-chat {
    position: fixed;
    bottom: 20px;
    right: 30px;
    z-index: 300;
    border: none;
    background: #f5f7fa;
    cursor: pointer;
    border-radius: .275in;
    width: .55in;
    height: .55in;
    transition: all ease 0.3s;
    font-size: 18px;
    color: #4A4E4E !important;
}

.floating-chat:hover { background-color: #c5c7ca; }

.floating-chat i { padding: 10px 0px 0px 8px; }

.floating-chat div {
    display: inline-flex;
    align-items: center;
}

.floating-chat span { display: none; }

@media (min-width: 667px) {
    .col-sm-4.align-center {
        width: 33%;
        float: left;
    }
}

.animated-2x {
    -webkit-animation-duration: .5s;
    animation-duration: .5s
}

.animated-3x {
    -webkit-animation-duration: .25s;
    animation-duration: .25s
}

.animated-slow {
    -webkit-animation-duration: 4s;
    animation-duration: 4s
}

.TextCentered { text-align: center; }

.WhiteText { color: #fff !important; }

.Hero {
    position: relative;
    text-align: center;
    color: white;
    overflow: hidden !important;
}

.Hero img { width: 100%; }

.Block {
    height: 275px;
    position: relative;
    text-align: center;
}

.BlockContentBottom {
    position: absolute;
    Bottom: 5%;
    width: 90%;
    Right: 05%;
    Color: White !important;
    padding-bottom: 25px;
    Text-align: center;
}

.BlockContentBottom h3 {
    border: none !important;
    Color: White !important;
}

.HeroContent {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
}

.TitleBar { margin-bottom: 20px; }

.GreyBorderedBox {
    border: 1px solid #d3d3d3 !important;
    padding: 10px !important;
    height: inherit !important;
    min-height: 100% !important;
    max-width: 350px !important;
    margin: 0px auto !important;
}

.BoxImage {
    margin-top: -10px;
    margin-left: -10px;
    margin-right: -10px;
    margin-bottom: 10px;
}

.GreyText { color: #797c80 !important; }

.TextFontSize25px { font-size: 25px }

.TextBoxGreyBorder {
    border: #b7b7b7 1px solid;
    padding: 7px 10px;
}

.GreyPanel { background-color: #fafafa; }

.Testimonial {
    background: url(../CustomImages/quote_left_up.png) top left no-repeat;
    border: 0px;
    padding: 0px 0px;
    margin: 0px 0px;
    font-style: italic;
    font-size: 24px;
    margin-bottom: 40px;
    padding-left: 60px;
}

.Testimonial p {
    padding-right: 45px;
    background: url(../CustomImages/quote_right_down.png) top right no-repeat;
    text-align: center;
}

blockquote .testimonial {
    padding: 30px 80px 40px;
    position: relative;
}

.source {
    font-family: "Utopia-italic";
    font-size: 28px;
    font-weight: 500;
    text-align: center;
    font-style: italic;
}

.validation-error {
    color: red;
    font-weight: bold;
    font-style: italic;
}

@-webkit-keyframes flipCenter {
    from {
        -webkit-transform: perspective(100000px) rotate3d(1, 0, 0, 90deg);
        transform: perspective(100000px) rotate3d(1, 0, 0, 90deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
        opacity: 0
    }

    40% {
        -webkit-transform: perspective(100000px) rotate3d(1, 0, 0, 0deg);
        transform: perspective(100000px) rotate3d(1, 0, 0, 0deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }

    60% {
        -webkit-transform: perspective(100000px) rotate3d(1, 0, 0, 0deg);
        transform: perspective(100000px) rotate3d(1, 0, 0, 0deg);
        opacity: 1
    }

    80% {
        -webkit-transform: perspective(100000px) rotate3d(1, 0, 0, 0deg);
        transform: perspective(100000px) rotate3d(1, 0, 0, 0deg)
    }

    100% {
        -webkit-transform: perspective(100000px);
        transform: perspective(100000px)
    }
}

@keyframes flipCenter {
    from {
        -webkit-transform: perspective(100000px) rotate3d(1, 0, 0, 90deg);
        transform: perspective(100000px) rotate3d(1, 0, 0, 90deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
        opacity: 0
    }

    40% {
        -webkit-transform: perspective(100000px) rotate3d(1, 0, 0, 0deg);
        transform: perspective(100000px) rotate3d(1, 0, 0, 0deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }

    60% {
        -webkit-transform: perspective(100000px) rotate3d(1, 0, 0, 0deg);
        transform: perspective(100000px) rotate3d(1, 0, 0, 0deg);
        opacity: 1
    }

    80% {
        -webkit-transform: perspective(100000px) rotate3d(1, 0, 0, 0deg);
        transform: perspective(100000px) rotate3d(1, 0, 0, 0deg)
    }

    100% {
        -webkit-transform: perspective(100000px);
        transform: perspective(100000px)
    }
}

.flipCenter {
    -webkit-animation-name: flipCenter;
    animation-name: flipCenter;
    -webkit-backface-visibility: visible !important;
    backface-visibility: visible !important
}

@-webkit-keyframes desployDown {
    from {
        -webkit-transform: scaleY(0);
        transform: scaleY(0);
        -webkit-transform-origin: top;
        transform-origin: top
    }

    100% {
        -webkit-transform: scaleY(1);
        transform: scaleY(1);
        -webkit-transform-origin: top;
        transform-origin: top;
        opacity: 1
    }
}

@keyframes desployDown {
    from {
        -webkit-transform: scaleY(0);
        transform: scaleY(0);
        -webkit-transform-origin: top;
        transform-origin: top
    }

    100% {
        -webkit-transform: scaleY(1);
        transform: scaleY(1);
        -webkit-transform-origin: top;
        transform-origin: top;
        opacity: 1
    }
}

.desployDown {
    -webkit-animation-name: desployDown;
    animation-name: desployDown;
    -webkit-backface-visibility: visible !important;
    backface-visibility: visible !important
}

.reveal {
    -webkit-animation-name: reveal;
    animation-name: reveal
}

.absolute-shadow {
    position: absolute;
    top: 20px
}

@-webkit-keyframes reveal {
    from { clip: rect(0, 2000px, 0, 0) }

    100% { clip: rect(0, 2000px, 500px, 0) }
}

@keyframes reveal {
    from { clip: rect(0, 2000px, 0, 0) }

    100% { clip: rect(0, 2000px, 500px, 0) }
}

.animation-delay-1 {
    -webkit-animation-delay: .1s !important;
    animation-delay: .1s !important
}

.animation-delay-2 {
    -webkit-animation-delay: .2s !important;
    animation-delay: .2s !important
}

.animation-delay-3 {
    -webkit-animation-delay: .3s !important;
    animation-delay: .3s !important
}

.animation-delay-4 {
    -webkit-animation-delay: .4s !important;
    animation-delay: .4s !important
}

.animation-delay-5 {
    -webkit-animation-delay: .5s !important;
    animation-delay: .5s !important
}

.animation-delay-6 {
    -webkit-animation-delay: .6s !important;
    animation-delay: .6s !important
}

.animation-delay-7 {
    -webkit-animation-delay: .7s !important;
    animation-delay: .7s !important
}

.animation-delay-8 {
    -webkit-animation-delay: .8s !important;
    animation-delay: .8s !important
}

.animation-delay-9 {
    -webkit-animation-delay: .9s !important;
    animation-delay: .9s !important
}

.animation-delay-10 {
    -webkit-animation-delay: 1s !important;
    animation-delay: 1s !important
}

.animation-delay-11 {
    -webkit-animation-delay: 1.1s !important;
    animation-delay: 1.1s !important
}

.animation-delay-12 {
    -webkit-animation-delay: 1.2s !important;
    animation-delay: 1.2s !important
}

.animation-delay-13 {
    -webkit-animation-delay: 1.3s !important;
    animation-delay: 1.3s !important
}

.animation-delay-14 {
    -webkit-animation-delay: 1.4s !important;
    animation-delay: 1.4s !important
}

.animation-delay-15 {
    -webkit-animation-delay: 1.5s !important;
    animation-delay: 1.5s !important
}

.animation-delay-16 {
    -webkit-animation-delay: 1.6s !important;
    animation-delay: 1.6s !important
}

.animation-delay-17 {
    -webkit-animation-delay: 1.7s !important;
    animation-delay: 1.7s !important
}

.animation-delay-18 {
    -webkit-animation-delay: 1.8s !important;
    animation-delay: 1.8s !important
}

.animation-delay-19 {
    -webkit-animation-delay: 1.9s !important;
    animation-delay: 1.9s !important
}

.animation-delay-20 {
    -webkit-animation-delay: 2s !important;
    animation-delay: 2s !important
}

.animation-delay-21 {
    -webkit-animation-delay: 2.1s !important;
    animation-delay: 2.1s !important
}

.animation-delay-22 {
    -webkit-animation-delay: 2.2s !important;
    animation-delay: 2.2s !important
}

.animation-delay-23 {
    -webkit-animation-delay: 2.3s !important;
    animation-delay: 2.3s !important
}

.animation-delay-24 {
    -webkit-animation-delay: 2.4s !important;
    animation-delay: 2.4s !important
}

.animation-delay-25 {
    -webkit-animation-delay: 2.5s !important;
    animation-delay: 2.5s !important
}

.animation-delay-26,
.animation-delay-27 {
    -webkit-animation-delay: 2.6s !important;
    animation-delay: 2.6s !important
}

.animation-delay-28 {
    -webkit-animation-delay: 2.8s !important;
    animation-delay: 2.8s !important
}

.animation-delay-29 {
    -webkit-animation-delay: 2.9s !important;
    animation-delay: 2.9s !important
}

.animation-delay-30 {
    -webkit-animation-delay: 3s !important;
    animation-delay: 3s !important
}

.animation-delay-40 {
    -webkit-animation-delay: 4s !important;
    animation-delay: 4s !important
}

.animation-delay-45 {
    -webkit-animation-delay: 4.5s !important;
    animation-delay: 4.5s !important
}

@font-face {
    font-family: SocialGlyphs;
    src: url(../fonts/socialglyphs-webfont.eot);
    src: url(../fonts/socialglyphs-webfont.eot?#iefix) format('embedded-opentype'), url(../fonts/socialglyphs-webfont.woff) format('woff'), url(../fonts/socialglyphs-webfont.ttf) format('truetype'), url(../fonts/socialglyphs-webfont.svg#SocialGlyphsRegular) format('svg');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

a.social {
    display: inline-block;
    margin: 0 20px 20px 0;
    color: #fff
}

a.social:link { opacity: 1 }

a.social:hover {
    box-shadow: inset 0 0 0 250px rgba(255, 255, 255, .1);
    text-decoration: none;
    color: #fff
}

a.social:active { opacity: .8 }


.social-facebook {
    display: block;
    text-decoration: none;
    font-family: SocialGlyphs;
    text-align: center;
    font-size: 35px;
    line-height: 1.2em;
    text-indent: 10px;
    font-weight: regular;
    color: #fff;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, .2);
    width: 44px;
    height: 44px;
    border-radius: 3px;
    background-color: #4f78b4;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .1);
    background-image: linear-gradient(to top, #4974b0, #6e90c0)
}

.social-google,
.social-instagram,
.social-twitter {
    text-indent: 2px;
    color: #fff;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, .2);
    width: 44px;
    height: 44px;
    border-radius: 3px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .1);
    display: block;
    text-decoration: none;
    font-family: SocialGlyphs;
    text-align: center
}

.social-facebook:after { content: "A" }

.social-twitter {
    font-size: 33px;
    line-height: 1.3em;
    background-color: #4e9edc;
    background-image: linear-gradient(to top, #4e9edc, #5daae6)
}

.social-twitter:after { content: "B" }

.social-google {
    font-size: 34px;
    line-height: 1.2em;
    background-color: #da4935;
    background-image: linear-gradient(to top, #da4935, #e15946)
}

.social-google:after { content: "C" }

.social-myspace {
    display: block;
    text-decoration: none;
    font-family: SocialGlyphs;
    text-align: center;
    font-size: 32px;
    line-height: 1.4em;
    color: #fff;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, .2);
    width: 44px;
    height: 44px;
    border-radius: 3px;
    background-color: #474747;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .1);
    background-image: linear-gradient(to top, #424242, #4e4e4e)
}

.social-myspace:after { content: "D" }

.social-instagram {
    font-size: 35px;
    line-height: 1.2em;
    background-color: #49709b;
    background-image: linear-gradient(to top, #49709b, #6387af)
}

.social-instagram:after { content: "E" }

.social-linkedin {
    display: block;
    text-decoration: none;
    font-family: SocialGlyphs;
    text-align: center;
    font-size: 30px;
    line-height: 1.4em;
    color: #fff;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, .2);
    width: 44px;
    height: 44px;
    border-radius: 3px;
    background-color: #005a87;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .1);
    background-image: linear-gradient(to top, #005a87, #066696)
}

.social-vimeo,
.social-youtube {
    font-size: 32px;
    line-height: 1.3em;
    display: block;
    text-decoration: none;
    font-family: SocialGlyphs;
    text-align: center;
    color: #fff;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, .2);
    width: 44px;
    height: 44px;
    border-radius: 3px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .1)
}

.social-linkedin:after { content: "F" }

.social-vimeo {
    text-indent: 0;
    background-color: #61a0ad;
    background-image: linear-gradient(to top, #61a0ad, #68aebd)
}

.social-vimeo:after { content: "G" }

.social-youtube {
    text-indent: 2px;
    background-color: #c9322b;
    background-image: linear-gradient(to top, #c9322b, #dc3f38)
}

.social-youtube:after { content: "H" }

.social-dribbble {
    display: block;
    text-decoration: none;
    font-family: SocialGlyphs;
    text-align: center;
    font-size: 35px;
    line-height: 1.2em;
    color: #fff;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, .2);
    width: 44px;
    height: 44px;
    border-radius: 3px;
    background-color: #eb4d8a;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .1);
    background-image: linear-gradient(to top, #eb4d8a, #f84e90)
}

.social-dribbble:after { content: "I" }

.social-forrst {
    display: block;
    text-decoration: none;
    font-family: SocialGlyphs;
    text-align: center;
    font-size: 32px;
    line-height: 1.4em;
    color: #fff;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, .2);
    width: 44px;
    height: 44px;
    border-radius: 3px;
    background-color: #267434;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .1);
    background-image: linear-gradient(to top, #267434, #328a42)
}

.social-forrst:after { content: "J" }

.social-stumbleupon {
    display: block;
    text-decoration: none;
    font-family: SocialGlyphs;
    text-align: center;
    font-size: 35px;
    line-height: 1.1em;
    color: #fff;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, .2);
    width: 44px;
    height: 44px;
    border-radius: 3px;
    background-color: #ea4b24;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .1);
    background-image: linear-gradient(to top, #ea4b24, #f7623d)
}

.social-blogger,
.social-pinterest,
.social-yahoo {
    display: block;
    text-decoration: none;
    font-family: SocialGlyphs;
    text-align: center;
    line-height: 1.2em
}

.social-stumbleupon:after { content: "K" }

.social-pinterest {
    font-size: 36px;
    color: #fff;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, .2);
    width: 44px;
    height: 44px;
    border-radius: 3px;
    background-color: #b8242a;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .1);
    background-image: linear-gradient(to top, #b8242a, #c5383e)
}

.social-pinterest:after { content: "L" }

.social-blogger {
    font-size: 35px;
    text-indent: 5px;
    color: #fff;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, .2);
    width: 44px;
    height: 44px;
    border-radius: 3px;
    background-color: #fc9847;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .1);
    background-image: linear-gradient(to top, #fc9847, #ffa55c)
}

.social-blogger:after { content: "M" }

.social-yahoo {
    font-size: 33px;
    color: #fff;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, .2);
    width: 44px;
    height: 44px;
    border-radius: 3px;
    background-color: #5f0d8e;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .1);
    background-image: linear-gradient(to top, #72179d, #9227b6)
}

.social-evernote,
.social-wordpress {
    font-size: 38px;
    line-height: 1.1em;
    font-family: SocialGlyphs;
    color: #fff;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, .2);
    width: 44px;
    height: 44px;
    border-radius: 3px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .1);
    display: block;
    text-align: center;
    text-decoration: none
}

.social-yahoo:after { content: "N" }

.social-evernote {
    background-color: #7ac143;
    background-image: linear-gradient(to top, #7ac143, #8fc565)
}

.social-evernote:after { content: "O" }

.social-wordpress {
    text-indent: 2px;
    background-color: #2485b3;
    background-image: linear-gradient(to top, #2485b3, #4597be)
}

.social-wordpress:after { content: "P" }

.social-foursquare {
    display: block;
    text-decoration: none;
    font-family: SocialGlyphs;
    text-align: center;
    font-size: 34px;
    line-height: 1.4em;
    color: #fff;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, .2);
    width: 44px;
    height: 44px;
    border-radius: 3px;
    background-color: #0bbadf;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .1);
    background-image: linear-gradient(to top, #0bbadf, #4cc1da)
}

.social-foursquare:after { content: "Q" }

.social-lastfm {
    display: block;
    text-decoration: none;
    font-family: SocialGlyphs;
    text-align: center;
    font-size: 32px;
    line-height: 1.3em;
    color: #fff;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, .2);
    width: 44px;
    height: 44px;
    border-radius: 3px;
    background-color: #de1600;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .1);
    background-image: linear-gradient(to top, #de1600, #de402e)
}

.social-lastfm:after { content: "R" }

.social-behance {
    display: block;
    text-decoration: none;
    font-family: SocialGlyphs;
    text-align: center;
    font-size: 36px;
    line-height: .9em;
    text-indent: 2px;
    color: #fff;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, .2);
    width: 44px;
    height: 44px;
    border-radius: 3px;
    background-color: #1e6fed;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .1);
    background-image: linear-gradient(to top, #1e6fed, #2f7df6)
}

.social-behance:after { content: "S" }

.social-tumblr {
    display: block;
    text-decoration: none;
    font-family: SocialGlyphs;
    text-align: center;
    font-size: 32px;
    line-height: 1.3em;
    color: #fff;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, .2);
    width: 44px;
    height: 44px;
    border-radius: 3px;
    background-color: #466484;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .1);
    background-image: linear-gradient(to top, #466484, #4f759e)
}

.social-tumblr:after { content: "T" }

.social-feed {
    display: block;
    text-decoration: none;
    font-family: SocialGlyphs;
    text-align: center;
    font-size: 34px;
    line-height: 1.2em;
    color: #fff;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, .2);
    width: 44px;
    height: 44px;
    border-radius: 3px;
    background-color: #ef922f;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .1);
    background-image: linear-gradient(to top, #ef922f, #f8a64f)
}

.social-feed:after { content: "U" }

.social-skype {
    display: block;
    text-decoration: none;
    font-family: SocialGlyphs;
    text-align: center;
    font-size: 36px;
    text-indent: 1px;
    line-height: 1.1em;
    color: #fff;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, .2);
    width: 44px;
    height: 44px;
    border-radius: 3px;
    background-color: #00aff0;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .1);
    background-image: linear-gradient(to top, #00aff0, #1bc1ff)
}

.social-skype:after { content: "V" }

.social-email {
    display: block;
    text-decoration: none;
    font-family: SocialGlyphs;
    text-align: center;
    font-size: 35px;
    line-height: 1em;
    color: #fff;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, .2);
    width: 44px;
    height: 44px;
    border-radius: 3px;
    background-color: #1d90dd;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .1);
    background-image: linear-gradient(to top, #1d90dd, #2da2f0)
}

.social-email:after { content: "W" }

.social-sharethis {
    display: block;
    text-decoration: none;
    font-family: SocialGlyphs;
    text-align: center;
    font-size: 33px;
    line-height: 1.3em;
    color: #fff;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, .2);
    width: 44px;
    height: 44px;
    border-radius: 3px;
    background-color: #008850;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .1);
    background-image: linear-gradient(to top, #008850, #119e64)
}

.small-font,
p.small { font-size: .9em }

.strong { font-weight: 400 }

a:active,
a:focus,
a:hover { color: #000 }

.primary-color { color: grey }

a.button { text-decoration: none }

input:-webkit-autofill { -webkit-box-shadow: 0 0 0 1000px #fff inset }

.margin-small {
    margin-top: 5px;
    margin-bottom: 5px
}

.video embed,
.video iframe,
.video object {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0
}

.video {
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden
}

.handwriting { font-family: 'Indie Flower', cursive }

.alignleft,
.alignright {
    margin-bottom: 10px;
    margin-top: 5px
}

.uppercase { text-transform: uppercase }

.alignleft {
    float: left;
    margin-right: 10px
}

.alignright {
    float: right;
    margin-left: 10px
}

.aligncenter {
    display: block;
    margin: 0 auto
}

.imageborder {
    padding: 5px;
    border: 1px solid #ddd
}

img.alignleft + p,
img.alignright + p { margin-top: 0 }

.p-lg {
    font-size: 1.1em;
    line-height: 180%
}

.margin-bottom { margin-bottom: 40px }

.margin-top-20 { margin-top: 20px }

.margin-top { margin-top: 40px }

.margin-top-80 { margin-top: 80px }

hr.color { border-color: grey !important }

hr.dotted { border-style: dotted !important }

hr.dashed { border-style: dashed !important }

hr.double {
    height: 5px;
    border-bottom-width: 1px;
    border-bottom-color: #ddd;
    border-bottom-style: solid
}

hr.less-space { margin: 10px 0; }

.list-line {
    list-style-type: none;
    padding: 0
}

.list-line li { border-bottom: solid 1px #eee }

.list-line li:first-child { border-top: solid 1px #eee }

.list-line li a {
    color: #333;
    text-decoration: none;
    padding: 7px;
    display: block;
    transition: all .25s ease
}

.list-line li a:hover {
    background-color: #f5f5f5;
    color: grey
}

.small-caps { font-variant: small-caps }

#Container .mix { display: none }

.text-icon {
    margin-bottom: 30px;
    overflow: hidden
}

.text-icon .icon-ar {
    float: left;
    margin-top: 5px
}

.text-icon-content {
    padding-left: 70px;
    font-size: .9em
}

.text-icon-content p { margin-top: 5px }

.slogan {
    font-family: Lato, sans-serif;
    font-size: 2em;
    line-height: 150%;
    margin-bottom: 50px;
    font-weight: 300
}

.blockquote-color-bg-dark:after,
.blockquote-color-bg-light:after,
.blockquote-color-bg-primary:after {
    font: var(--fa-font-solid);
    content: "\f10e";
    left: 10px;
    bottom: 10px
}

.slogan > span { color: grey }

.section-lines {
    border-top: solid 1px #ddd;
    border-bottom: solid 1px #ddd;
    margin-bottom: 40px;
    background-color: #f9f9f9
}

.section-title {
    border-bottom: solid 1px #ddd;
    padding-bottom: 15px;
    margin-top: 39px;
    color: #000
}

.section-title:first-letter { color: grey }

.css-section { margin-bottom: 50px }

.wrap-primary-color {
    background-color: grey;
    padding: 40px 0;
    color: #fff
}

.wrap-primary-color h1,
.wrap-primary-color h2,
.wrap-primary-color h3,
.wrap-primary-color h4,
.wrap-primary-color h5,
.wrap-primary-color h6 { color: #fff }

.dropcaps::first-letter {
    float: left;
    color: grey;
    font-size: 3em;
    font-weight: 400;
    padding: 10px 10px 10px 5px;
    margin-top: 2px
}

.dropcaps-bg::first-letter {
    background-color: grey;
    color: #fff;
    margin-right: 10px;
    border-radius: 2px;
    padding: 10px 5px;
    font-size: 2.8em;
    margin-top: 4px
}

.dropcaps-circle-bg::first-letter,
.dropcaps-circle::first-letter {
    padding: 10px 8px;
    font-size: 2.3em;
    margin-right: 10px;
    margin-top: 2px
}

.dropcaps-circle::first-letter {
    border: 1px solid grey;
    border-radius: 30px
}

.dropcaps-circle-bg::first-letter {
    background-color: grey;
    color: #fff;
    border-radius: 30px
}

.border-box {
    background-color: #f9f9f9;
    border: 3px solid #eee;
    border-left-color: grey;
    padding: 20px;
    margin-bottom: 20px
}

.blockquote-color { border-color: grey }

.blockquote-color-bg {
    border-color: grey;
    border-bottom: solid 1px grey;
    background-color: #f9f9f9
}

.blockquote-big {
    font-size: 1.8em;
    line-height: 140%;
    font-style: oblique;
    border: none
}

.blockquote-big footer {
    font-style: normal;
    font-size: .7em
}

.blockquote-color-bg-primary {
    font-size: 1em;
    background-color: grey;
    color: #fff;
    padding: 20px;
    text-align: center;
    position: relative;
    border: none
}

.blockquote-color-bg-dark:after,
.blockquote-color-bg-primary:after {
    position: absolute;
    color: #fff;
    font-size: 2.6em
}

.blockquote-color-bg-dark,
.blockquote-color-bg-light {
    font-size: 1em;
    padding: 20px;
    text-align: center;
    position: relative;
    border: none
}

.blockquote-color-bg-dark {
    background-color: #444;
    color: #fff
}

.blockquote-color-bg-light {
    background-color: #ddd;
    color: #333;
    text-shadow: 1px 1px 0 #fff
}

.em-danger-inverse,
.em-info-inverse,
.em-primary-inverse,
.em-royal-inverse,
.em-success-inverse,
.em-warning-inverse {
    padding: 0 5px;
    border-radius: 2px
}

.blockquote-color-bg-light:after {
    position: absolute;
    color: #333;
    font-size: 2.6em
}

.blockquote-color-bg-dark footer,
.blockquote-color-bg-primary footer {
    color: #eee;
    font-size: .9em
}

.blockquote-color-bg-light footer {
    color: #666;
    font-size: .9em
}

.em-primary { color: grey }

.em-success { color: #02c66c }

.em-info { color: #54c8eb }

.em-warning { color: #f0ad4e }

.em-danger { color: #d9534f }

.em-help,
.em-royal { color: #ac60d0 }

.em-primary-inverse {
    background-color: grey;
    color: #fff
}

.em-success-inverse {
    background-color: #02c66c;
    color: #fff
}

.em-info-inverse {
    background-color: #54c8eb;
    color: #fff
}

.em-warning-inverse {
    background-color: #f0ad4e;
    color: #fff
}

.em-danger-inverse {
    background-color: #d9534f;
    color: #fff
}

.em-royal-inverse {
    background-color: #ac60d0;
    color: #fff
}


.btn-social,
.icon-ar,
.social-icon-ar {
    display: inline-block;
    text-align: center
}


.btn-social {
    color: #aaa;
    border: 1px solid #aaa;
    padding: 8px 0;
    width: 150px;
    margin: 0 5px 5px 0;
    text-decoration: none;
    line-height: 1;
    transition: background .25s ease
}

.btn-social.btn-social-white {
    color: #fff !important;
    border-color: #fff !important
}

.btn-social:hover {
    text-decoration: none;
    background-color: #aaa;
    color: #fff
}

.btn-social:active { box-shadow: inset 1px 2px 1px rgba(0, 0, 0, .2) }

.btn-social-white {
    color: #fff;
    border-color: #fff;
    transition: all .25s ease
}

.btn-social-white:hover {
    color: grey;
    border-color: grey;
    background-color: rgba(0, 0, 0, .1)
}

.btn-social .fa {
    margin: 0 10px 0 0;
    font-size: 18px
}

.btn-social.solid:hover { text-shadow: 0 -1px 2px rgba(0, 0, 0, .3) }

.btn-social.sm {
    width: 32px;
    height: 32px
}

.btn-social.lg {
    width: 220px;
    padding: 12px 0
}

.btn-social.xl-lg {
    width: 400px;
    padding: 18px 0
}

.btn-social.round { border-radius: 5px }

.btn-social.sm .fa { margin: 0 }

.btn-social.rss {
    color: #ef922f;
    border-color: #ef922f
}

.btn-social.rss.solid,
.btn-social.rss:hover {
    color: #fff;
    background-color: #ef922f
}

.btn-social.facebook {
    color: #3b5998;
    border-color: #3b5998
}

.btn-social.facebook.solid,
.btn-social.facebook:hover {
    color: #fff;
    background-color: #3b5998
}

.btn-social.twitter {
    color: #00aced;
    border-color: #00aced
}

.btn-social.twitter.solid,
.btn-social.twitter:hover {
    color: #fff;
    background-color: #00aced
}

.btn-social.google-plus {
    color: #dd4b39;
    border-color: #dd4b39
}

.btn-social.google-plus.solid,
.btn-social.google-plus:hover {
    color: #fff;
    background-color: #dd4b39
}

.btn-social.youtube {
    color: #b00;
    border-color: #b00
}

.btn-social.youtube.solid,
.btn-social.youtube:hover {
    color: #fff;
    background-color: #b00
}

.btn-social.linkedin {
    color: #007bb6;
    border-color: #007bb6
}

.btn-social.linkedin.solid,
.btn-social.linkedin:hover {
    color: #fff;
    background-color: #007bb6
}

.btn-social.instagram {
    color: #517fa4;
    border-color: #517fa4
}

.btn-social.instagram.solid,
.btn-social.instagram:hover {
    color: #fff;
    background-color: #517fa4
}

.btn-social.pinterest {
    color: #cb2027;
    border-color: #cb2027
}

.btn-social.pinterest.solid,
.btn-social.pinterest:hover {
    color: #fff;
    background-color: #cb2027
}

.btn-social.wordpress {
    color: #4597be;
    border-color: #4597be
}

.btn-social.wordpress.solid,
.btn-social.wordpress:hover {
    color: #fff;
    background-color: #4597be
}

.btn-social.git {
    color: #666;
    border-color: #666
}

.btn-social.git.solid,
.btn-social.git:hover {
    color: #fff;
    background-color: #666
}

.btn-social.flickr {
    color: #ff0084;
    border-color: #ff0084
}

.btn-social.flickr.solid,
.btn-social.flickr:hover {
    color: #fff;
    background-color: #ff0084
}

.btn-social.stack-overflow {
    color: #bbb;
    border-color: #bbb
}

.btn-social.stack-overflow.solid,
.btn-social.stack-overflow:hover {
    color: #fff;
    background-color: #bbb
}

.btn-social.vine {
    color: #00b48a;
    border-color: #00b48a
}

.btn-social.vine.solid,
.btn-social.vine:hover {
    color: #fff;
    background-color: #00b48a
}

.btn-social.dribbble {
    color: #f26798;
    border-color: #f26798
}

.btn-social.dribbble.solid,
.btn-social.dribbble:hover {
    color: #fff;
    background-color: #f26798
}

.btn-social.foursquare {
    color: #0072b1;
    border-color: #0072b1
}

.btn-social.foursquare.solid,
.btn-social.foursquare:hover {
    color: #fff;
    background-color: #0072b1
}

.btn-social.tumblr {
    color: #32506d;
    border-color: #32506d
}

.btn-social.tumblr.solid,
.btn-social.tumblr:hover {
    color: #fff;
    background-color: #32506d
}

.social-icon-ar {
    width: 44px;
    height: 44px;
    color: #fff;
    font-size: 28px;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, .2);
    border-radius: 2px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .1);
    margin: 0 20px 20px 0
}

.social-icon-ar .fa { padding-top: 10px }

.social-icon-ar:hover {
    color: #fff;
    text-shadow: 0 -1px 2px rgba(0, 0, 0, .3);
    box-shadow: 1px 1px 0 rgba(0, 0, 0, .2)
}

.social-icon-ar.round { border-radius: 5px }

.social-icon-ar.circle { border-radius: 40px }

.social-icon-ar.sm {
    width: 25px;
    height: 25px;
    margin: 0 10px 10px 0;
    font-size: 15px
}

.social-icon-ar.sm .fa { padding-top: 6px }

.social-icon-ar.tumblr {
    background-color: #32506d;
    background-image: linear-gradient(to top, #32506d, #426a90)
}

.social-icon-ar.rss {
    background-color: #ef922f;
    background-image: linear-gradient(to top, #ef922f, #f3ab5e)
}

.social-icon-ar.twitter {
    background-color: #00aced;
    background-image: linear-gradient(to top, #00aced, #21c2ff)
}

.social-icon-ar.facebook {
    background-color: #3b5998;
    background-image: linear-gradient(to top, #3b5998, #4c70ba)
}

.social-icon-ar.linkedin {
    background-color: #007bb6;
    background-image: linear-gradient(to top, #007bb6, #009de9)
}

.social-icon-ar.pinterest {
    background-color: #cb2027;
    background-image: linear-gradient(to top, #cb2027, #e03e44)
}

.social-icon-ar.instagram {
    background-color: #517fa4;
    background-image: linear-gradient(to top, #517fa4, #7098b8)
}

.social-icon-ar.google-plus {
    background-color: #dd4b39;
    background-image: linear-gradient(to top, #dd4b39, #e47365)
}

.social-icon-ar.youtube {
    background-color: #b00;
    background-image: linear-gradient(to top, #b00, #e00)
}

.social-icon-ar.git {
    background-color: #666;
    background-image: linear-gradient(to top, #666, grey)
}

.social-icon-ar.wordpress {
    background-color: #4597be;
    background-image: linear-gradient(to top, #4597be, #6baccb)
}

.social-icon-ar.flickr {
    background-color: #ff0084;
    background-image: linear-gradient(to top, #ff0084, #ff339d)
}

.social-icon-ar.stack-overflow {
    background-color: #bbb;
    background-image: linear-gradient(to top, #bbb, #d4d4d4)
}

.social-icon-ar.vine {
    background-color: #00b48a;
    background-image: linear-gradient(to top, #00b48a, #00e7b1)
}

.social-icon-ar.dribbble {
    background-color: #f26798;
    background-image: linear-gradient(to top, #f26798, #f696b8)
}

.social-icon-ar.foursquare {
    background-color: #0072b1;
    background-image: linear-gradient(to top, #0072b1, #0093e4)
}

.icon-ar {
    width: 40px;
    height: 40px;
    font-size: 18px;
    background-color: grey;
    color: #fff;
    border-radius: 2px;
    margin: 0 5px 5px 0;
    line-height: 2.2
}

.icon-ar.icon-ar-square { border-radius: 0 }

.icon-ar.icon-ar-round { border-radius: 5px }

.icon-ar.icon-ar-circle { border-radius: 100px }

.icon-ar.icon-ar-inverse {
    background-color: transparent;
    color: grey;
    border: 1px solid grey
}

.icon-ar.icon-ar-inverse.icon-ar-no-border {
    width: auto;
    height: auto;
    line-height: 1;
    border: none;
    font-size: 60px
}

.icon-ar.icon-ar-sm {
    width: 32px;
    height: 32px;
    font-size: 16px;
    line-height: 2
}

.icon-ar.icon-ar-lg {
    width: 50px;
    height: 50px;
    font-size: 22px;
    line-height: 2.2
}

.icon-ar.icon-ar-xl-lg {
    width: 80px;
    height: 80px;
    font-size: 36px;
    line-height: 2.2
}

.icon-ar.icon-ar-xxl-lg {
    width: 120px;
    height: 120px;
    font-size: 48px;
    line-height: 2.6
}

.icon-ar.icon-ar-white {
    background-color: #fff;
    color: grey
}

.icon-ar.icon-ar-white.icon-ar-inverse {
    background-color: transparent;
    color: #fff;
    border: 1px solid #fff
}

.icon-ar.icon-ar-danger { background-color: #d9534f }

.icon-ar.icon-ar-warning { background-color: #f0ad4e }

.icon-ar.icon-ar-success { background-color: #02c66c }

.icon-ar.icon-ar-info { background-color: #54c8eb }

.icon-ar.icon-ar-help { background-color: #ac60d0 }

.icon-ar.icon-ar-black { background-color: #333 }

.icon-ar.icon-ar-inverse.icon-ar-white {
    background-color: transparent;
    color: #fff;
    border-color: #fff
}

.icon-ar.icon-ar-inverse.icon-ar-danger {
    background-color: transparent;
    color: #d9534f;
    border-color: #d9534f
}

.icon-ar.icon-ar-inverse.icon-ar-warning {
    background-color: transparent;
    color: #f0ad4e;
    border-color: #f0ad4e
}

.icon-ar.icon-ar-inverse.icon-ar-success {
    background-color: transparent;
    color: #02c66c;
    border-color: #02c66c
}

.icon-ar.icon-ar-inverse.icon-ar-info {
    background-color: transparent;
    color: #54c8eb;
    border-color: #54c8eb
}

.icon-ar.icon-ar-inverse.icon-ar-help {
    background-color: transparent;
    color: #ac60d0;
    border-color: #ac60d0
}

.icon-ar.icon-ar-inverse.icon-ar-black {
    background-color: transparent;
    color: #333;
    border-color: #333
}

.table-striped-primary > tbody > tr:nth-child(odd) > td,
.table-striped-primary > tbody > tr:nth-child(odd) > th,
a > .icon-ar.icon-ar-inverse:hover {
    background-color: grey;
    color: #fff
}

.content-box {
    display: block;
    text-align: center;
    overflow: hidden;
    padding: 15px;
    margin-bottom: 5px
}

.content-box.box-default {
    background-color: #f6f6f6;
    border: 1px solid #e5e5e5
}

.content-box.box-default:hover { background-color: #f3f3f3 }

.content-box.box-danger .content-box-title,
.content-box.box-info .content-box-title,
.content-box.box-primary .content-box-title,
.content-box.box-royal .content-box-title,
.content-box.box-success .content-box-title,
.content-box.box-warning .content-box-title { color: #fff }

.content-box-title.counter {
    font-size: 3em;
    color: #333;
    margin-top: 0
}

.content-box.box-primary {
    background-color: grey;
    color: #fff;
    border: 1px solid #4d4d4d
}

.content-box.box-success {
    background-color: #02c66c;
    color: #fff;
    border: 1px solid #016135
}

.content-box.box-info {
    background-color: #54c8eb;
    color: #fff;
    border: 1px solid #179bc2
}

.content-box.box-warning {
    background-color: #f0ad4e;
    color: #fff;
    border: 1px solid #c77c11
}

.content-box.box-danger {
    background-color: #d9534f;
    color: #fff;
    border: 1px solid #a02622
}

.content-box.box-royal {
    background-color: #ac60d0;
    color: #fff;
    border: 1px solid #792e9c
}

.popover,
.progress { border-radius: 0 }

.content-box.box-primary:hover { background-color: #737373 }

.content-box.box-success:hover { background-color: #02ad5e }

.content-box.box-info:hover { background-color: #3dc1e8 }

.content-box.box-warning:hover { background-color: #eea236 }

.content-box.box-danger:hover { background-color: #d43f3a }

.content-box.box-royal:hover { background-color: #a24cca }

.progress-sm { height: 10px }

.progress-xs { height: 5px }

.progress-lg { height: 30px }

.modal-open,
.modal-open #sb-site {
    position: static !important;
    overflow: hidden !important;
    width: auto !important;
    height: auto !important
}

.progress-lg .progress-bar { line-height: 30px }

.progress-bar { background-color: grey }

.progress-bar-success { background-color: #02c66c }

.progress-bar-info { background-color: #54c8eb }

.progress-bar-warning { background-color: #f0ad4e }

.progress-bar-danger { background-color: #d9534f }

.progress-bar-royal { background-color: #ac60d0 }

.panel-border {
    background-color: #f5f5f5;
    box-shadow: inset 0 0 2px rgba(0, 0, 0, .1);
    border: 0;
    padding: 10px
}

.panel-border .panel-body {
    background-color: #fff;
    box-shadow: 0 0 2px rgba(0, 0, 0, .1)
}

.modal-content { border-radius: 0 }

.modal-body.no-padding { padding: 0 }

.moda-title { font-weight: 400 }

.modal-open #sb-site {
    -webkit-transform: none !important;
    transform: none !important
}

.nav-tabs.nav-tabs-transparent li a {
    font-size: 1.3em;
    color: #7e8488;
    margin-right: 0;
    padding-left: 15px;
    padding-right: 15px;
    border-right: solid 1px #ddd;
    font-family: Lato;
    transition: all .25s ease
}

.alert i,
.nav-tabs.nav-tabs-ar li a i { font-size: 1.2em }

.nav-tabs.nav-tabs-transparent li a:hover { background-color: #e5e5e5 }

.nav-tabs.nav-tabs-transparent li.active a,
.nav-tabs.nav-tabs-transparent li.active a:focus,
.nav-tabs.nav-tabs-transparent li.active a:hover {
    background-image: linear-gradient(to top, #737373, grey);
    color: #fff;
    border-bottom: solid 1px #ddd
}

.nav-tabs.nav-tabs-ar {
    border-top: solid 3px #e5e5e5;
    border-right: solid 1px #e5e5e5;
    font-family: Lato, sans-serif;
    background-color: #fafafa
}


.nav-tabs.nav-tabs-ar li a {
    margin-top: -3px;
    margin-right: 0;
    border-radius: 0;
    color: #555;
    transition: padding .2s, border-top .2s;
    -moz-transition: padding .2s, border-top .2s;
    -webkit-transition: padding .2s, border-top .2s;
    padding-right: 5px;
    padding-left: 5px;
    background-color: #fafafa;
    margin-left: -1px;
    border: 0;
    border-bottom: solid 1px #e5e5e5;
    border-top: solid 3px #e5e5e5
}

.nav-tabs.nav-tabs-ar li:first-child a {
    border-left: solid 1px #e5e5e5;
    margin-left: 0
}

.nav-tabs.nav-tabs-ar li a:hover,
.nav-tabs.nav-tabs-ar li.active a,
.nav-tabs.nav-tabs-ar li.active a:focus,
.nav-tabs.nav-tabs-ar li.active a:hover {
    border-top: solid 3px grey;
    background-color: #f9f9f9;
    border-left: solid 1px #e5e5e5;
    border-right: solid 1px #e5e5e5;
    color: grey;
    padding-right: 5px;
    padding-left: 5px;
    font-weight: 500
}

.nav-tabs.nav-tabs-ar li.active a {
    position: relative;
    z-index: 2
}

.nav-tabs.nav-tabs-ar li.active a,
.nav-tabs.nav-tabs-ar li.active a:focus,
.nav-tabs.nav-tabs-ar li.active a:hover { border-bottom: solid 1px #f9f9f9 }

.nav-tabs.nav-tabs-ar li a:hover {
    position: relative;
    z-index: 1;
    border-bottom-color: #e5e5e5;
    border-top-color: #000;
    color: #000
}

@media (min-width: 370px) {
    .nav-tabs.nav-tabs-ar li a {
        padding-right: 10px;
        padding-left: 10px
    }

    .nav-tabs.nav-tabs-ar li a:hover,
    .nav-tabs.nav-tabs-ar li.active a,
    .nav-tabs.nav-tabs-ar li.active a:focus,
    .nav-tabs.nav-tabs-ar li.active a:hover {
        padding-right: 25px;
        padding-left: 25px
    }
}

.nav-tabs + .tab-content,
.nav-tabs.nav-tabs-ar + .tab-content {
    padding: 15px;
    border-left: solid 1px #e5e5e5;
    border-right: solid 1px #e5e5e5;
    border-bottom: solid 1px #e5e5e5;
    overflow: hidden
}

.nav-tabs.nav-tabs-ar + .tab-content { background-color: #f9f9f9 }

.nav-tabs.nav-tabs-ar.nav-tabs-ar-white,
.nav-tabs.nav-tabs-ar.nav-tabs-ar-white li a,
.nav-tabs.nav-tabs-ar.nav-tabs-ar-white li a:hover,
.nav-tabs.nav-tabs-ar.nav-tabs-ar-white li.active a,
.nav-tabs.nav-tabs-ar.nav-tabs-ar-white li.active a:focus,
.nav-tabs.nav-tabs-ar.nav-tabs-ar-white li.active a:hover,
.nav-tabs.nav-tabs-ar.nav-tabs-ar-white + .tab-content { background-color: #fff }

.nav-tabs li a { border-radius: 2px }

.nav-tabs.nav-tabs-round li a { border-radius: 5px 5px 0 0 }

.nav-tabs li a:hover { background-color: #f5f5f5 }

.label {
    text-shadow: none;
    font-family: "Open Sans"
}

.label-primary { background-color: grey }

.label-success { background-color: #02c66c }

.label-warning { background-color: #f0ad4e }

.label-danger { background-color: #d9534f }

.label-info { background-color: #54c8eb }

.label-royal { background-color: #ac60d0 }

.badge-square { border-radius: 0 }

.alert,
.badge-round { border-radius: 2px }

.badge-primary {
    background-color: grey;
    color: #fff
}

.alert h1,
.alert h2,
.alert h3,
.alert h4,
.alert h5,
.alert h6 {
    color: inherit;
    margin: 0 0 5px;
    font-weight: 400
}

.alert i { margin-right: 5px }

.alert > .close {
    text-shadow: 0 1px 0 #fff;
    filter: alpha(opacity=30);
    opacity: .3
}

.alert-primary > .close {
    color: #fff;
    text-shadow: none;
    filter: alpha(opacity=80);
    opacity: .8
}

.alert-info {
    background-color: #ddf4fb;
    border: 1px solid #54c8eb
}

.alert-success {
    background-color: #ddffef;
    border: 1px solid #02c66c
}

.alert-warning {
    background-color: #fceedb;
    border: 1px solid #f0ad4e
}

.alert-danger {
    background-color: #f4cecd;
    border: 1px solid #d9534f
}

.alert-royal {
    background-color: #ead6f3;
    border: 1px solid #ac60d0;
    color: #792e9c
}

.alert-primary {
    background-color: #8d8d8d;
    border: 1px solid grey;
    color: #fff
}

.alert.alert-border {
    border-left-width: 5px !important;
    border-right-width: 5px !important
}

.alert.alert-primary.alert-border { border-color: #4d4d4d }

.well {
    border-radius: 2px;
    background-color: #f3f3f3;
    border-color: #e0e0e0
}

.nav-pills > .active > a > .badge {
    color: #fff;
    background-color: grey
}

.list-group-sm a,
.list-group-sm li {
    padding-top: 5px;
    padding-bottom: 5px
}

.list-group-item-success {
    background-color: #d3ffea;
    color: #017a43
}

.list-group-item-warning {
    background-color: #fceedb;
    color: #df8a13
}

.list-group-item-danger {
    background-color: #f8dede;
    color: #b52b27
}

.list-group-item-info {
    background-color: #d4f1fa;
    color: #19add9
}

.list-group-item-royal {
    background-color: #f2e6f8;
    color: #8834b0
}

.list-group-item:first-child {
    border-top-left-radius: 0;
    border-top-right-radius: 0
}

.list-group-item:last-child {
    margin-bottom: 0;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0
}

.list-group-striped li:nth-child(odd) { background-color: #eee }

a.list-group-item:focus,
a.list-group-item:hover {
    text-decoration: none;
    background-color: #f5f5f5
}

a.list-group-item.active,
a.list-group-item.active:focus,
a.list-group-item.active:hover {
    z-index: 2;
    color: #fff;
    background-color: grey;
    border-color: grey
}

.right-line {
    position: relative;
    z-index: 1;
    overflow: hidden;
    color: #000;
    margin: 30px 0
}

.right-line:after {
    position: absolute;
    top: 55%;
    overflow: hidden;
    width: 100%;
    height: 1px;
    content: '\a0';
    background-color: #ddd;
    border-left: solid 20px #fff
}

.pagination {
    display: inline-block;
    padding-left: 0;
    margin: 20px 0;
    border-radius: 0
}

.pagination > li { display: inline }

.pagination > li > a,
.pagination > li > span {
    position: relative;
    float: left;
    padding: 6px 12px;
    margin-left: -1px;
    line-height: 1.42857143;
    color: grey;
    text-decoration: none;
    background-color: #fff;
    border: 1px solid #ddd
}

.pagination > li:first-child > a,
.pagination > li:first-child > span {
    margin-left: 0;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0
}

.pagination > li:last-child > a,
.pagination > li:last-child > span {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0
}

.pagination > li > a:focus,
.pagination > li > a:hover,
.pagination > li > span:focus,
.pagination > li > span:hover {
    background-color: grey;
    border-color: grey;
    color: #fff
}

.pagination > .active > a,
.pagination > .active > a:focus,
.pagination > .active > a:hover,
.pagination > .active > span,
.pagination > .active > span:focus,
.pagination > .active > span:hover {
    z-index: 2;
    color: #fff;
    cursor: default;
    background-color: grey;
    border-color: grey
}

.pagination.pagination-border > li > a,
.pagination.pagination-border > li > span {
    position: relative;
    float: left;
    padding: 6px 12px;
    margin-left: -1px;
    line-height: 1.42857143;
    color: #000;
    text-decoration: none;
    background-color: transparent;
    border: none;
    border-bottom: 3px solid #eee
}

.pagination.pagination-border > .active > a,
.pagination.pagination-border > .active > a:focus,
.pagination.pagination-border > .active > a:hover,
.pagination.pagination-border > .active > span,
.pagination.pagination-border > .active > span:focus,
.pagination.pagination-border > .active > span:hover,
.pagination.pagination-border > li > a:focus,
.pagination.pagination-border > li > a:hover,
.pagination.pagination-border > li > span:focus,
.pagination.pagination-border > li > span:hover {
    border-color: grey;
    background-color: transparent;
    color: grey
}

.pager li > a,
.pager li > span {
    border-radius: 2px;
    color: grey
}

.pager li > a:hover,
.pager li > span:hover {
    color: #fff;
    background-color: grey
}

.pager.pager-border li > a,
.pager.pager-border li > span {
    border-radius: 2px;
    color: grey;
    border: none;
    border-bottom: 3px solid #eee;
    padding-left: 0;
    padding-right: 0;
    margin: 0 15px
}

.checkbox-inline.checkbox-inline,
.checkbox.checkbox-inline,
.radio.radio-inline { margin-top: 0 }

.pager.pager-border li > a:hover,
.pager.pager-border li > span:hover {
    background-color: transparent;
    border-color: grey;
    color: #000
}

.rounded-corners { border-radius: 5px !important; }

input.with-space { margin: 2px 0; }

select.with-space { margin: 2px 0; }

.information-tooltip {
    position: relative;
    display: inline-block;
}

.information-tooltip .informationtext {
    visibility: hidden;
    background-color: #eee;
    color: #333;
    text-align: center;
    border-radius: 6px;
    padding: 5px 10px;
    position: absolute;
    z-index: 1;
    top: -13px;
    left: 130%;
    font-family: "Open Sans", Arial, sans-serif !important;
    font-size: 14px !important;
    width: 400px;
    line-height: 1;
}

.information-tooltip .informationtext::after {
    content: " ";
    position: absolute;
    top: 50%;
    right: 100%; /* To the left of the tooltip */
    margin-top: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: transparent #eee transparent transparent;
}

.information-tooltip:hover .informationtext { visibility: visible; }

.form-control {
    display: block;
    width: 100%;
    height: 36px;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s
}

.form-control:focus {
    border-color: grey;
    box-shadow: none
}

select.form-control,
textarea.form-control { border-radius: 0 }

textarea.form-control:focus { border-color: grey }

.checkbox,
.checkbox-inline { padding-left: 20px }

.checkbox label,
.checkbox-inline label {
    display: inline-block;
    vertical-align: middle;
    position: relative;
    padding-left: 5px;
    margin-right: 10px
}

.checkbox label::before,
.checkbox-inline label::before {
    content: "";
    display: inline-block;
    position: absolute;
    width: 18px;
    height: 18px;
    left: 0;
    top: 2px;
    margin-left: -20px;
    border: 1px solid #ccc;
    border-radius: 0;
    background-color: #fff;
    transition: border .15s ease-in-out
}

.checkbox label::after,
.checkbox-inline label::after {
    display: inline-block;
    position: absolute;
    width: 18px;
    height: 18px;
    left: 0;
    top: 2px;
    margin-left: -20px;
    padding-left: 3px;
    padding-top: 1px;
    font-size: 11px;
    color: grey
}

.checkbox input[type=checkbox],
.checkbox-inline input[type=checkbox] {
    opacity: 0;
    z-index: 1;
    transition: all .15s ease-in-out
}

.checkbox input[type=checkbox]:focus + label::before,
.checkbox-inline input[type=checkbox]:focus + label::before { border-color: grey }

.checkbox input[type=checkbox]:checked + label::after,
.checkbox-inline input[type=checkbox]:checked + label::after {
    content: "";
    background-color: grey;
    width: 10px;
    height: 10px;
    top: 6px;
    left: 4px;
    transition: all .15s ease-in-out
}

.checkbox input[type=checkbox]:disabled + label,
.checkbox-inline input[type=checkbox]:disabled + label { opacity: .65 }

.checkbox input[type=checkbox]:disabled + label::before,
.checkbox-inline input[type=checkbox]:disabled + label::before {
    background-color: #ddd;
    cursor: not-allowed
}

.radio { padding-left: 20px }

.radio label {
    display: inline-block;
    vertical-align: middle;
    position: relative;
    padding-left: 5px;
    line-height: 1.5
}

.radio label::after,
.radio label::before {
    display: inline-block;
    position: absolute;
    margin-left: -20px
}

.radio label::before {
    content: "";
    width: 17px;
    height: 17px;
    left: 0;
    border: 1px solid #ccc;
    border-radius: 50%;
    background-color: #fff;
    transition: border .15s ease-in-out
}

.radio label::after {
    content: " ";
    width: 9px;
    height: 9px;
    left: 4px;
    top: 4px;
    border-radius: 50%;
    background-color: grey;
    -webkit-transform: scale(0, 0);
    transform: scale(0, 0);
    transition: .1s cubic-bezier(.8, -.33, .2, 1.33)
}

.caption-ar,
.thumbnail { transition: all .25s ease }

.radio input[type=radio] {
    opacity: 0;
    z-index: 1
}

.radio input[type=radio]:focus + label::before { border-color: grey }

.radio input[type=radio]:checked + label::after {
    -webkit-transform: scale(1, 1);
    transform: scale(1, 1)
}

.radio input[type=radio]:disabled + label { opacity: .65 }

.radio input[type=radio]:disabled + label::before { cursor: not-allowed }

.radio.radio-dark label::before {
    background-color: #444;
    border: 0
}

.container .jumbotron,
.jumbotron,
.panel,
.panel .panel-footer,
.panel-group .panel,
.panel-heading { border-radius: 0 }

.radio.radio-dark label::after {
    width: 11px;
    height: 11px;
    left: 3px;
    top: 3px
}

.input-group-addon {
    border-radius: 0;
    background-color: grey;
    border-color: #767676;
    color: #fff
}

.has-success .checkbox,
.has-success .checkbox-inline,
.has-success .control-label,
.has-success .radio,
.has-success .radio-inline,
.has-success .royal-block { color: #019450 }

.has-success .form-control {
    border-color: #02c66c;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075)
}

.has-success .form-control:focus {
    border-color: #019450;
    box-shadow: none
}

.has-success .input-group-addon {
    color: #02c66c;
    background-color: #dff0d8;
    border-color: #02c66c
}

.has-success .form-control-feedback { color: #02c66c }

.has-warning .checkbox,
.has-warning .checkbox-inline,
.has-warning .control-label,
.has-warning .radio,
.has-warning .radio-inline,
.has-warning .royal-block { color: #ec971f }

.has-warning .form-control {
    border-color: #f0ad4e;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075)
}

.has-warning .form-control:focus {
    border-color: #c77c11;
    box-shadow: none
}

.has-warning .input-group-addon {
    color: #f0ad4e;
    background-color: #dff0d8;
    border-color: #f0ad4e
}

.has-warning .form-control-feedback { color: #f0ad4e }

.has-error .checkbox,
.has-error .checkbox-inline,
.has-error .control-label,
.has-error .radio,
.has-error .radio-inline,
.has-error .royal-block { color: #c9302c }

.has-error .form-control {
    border-color: #d9534f;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075)
}

.has-error .form-control:focus {
    border-color: #a02622;
    box-shadow: none
}

.has-error .input-group-addon {
    color: #d9534f;
    background-color: #dff0d8;
    border-color: #d9534f
}

.has-error .form-control-feedback { color: #d9534f }

.form-group .glyphicon { margin-top: 5px }

.jumbotron {
    padding: 20px 30px;
    margin-bottom: 30px;
    color: inherit;
    background-color: #f5f5f5;
    border-left: solid 1px #ddd;
    border-right: solid 1px #ddd;
    border-top: solid 5px grey;
    border-bottom: solid 5px grey;
    overflow: hidden
}

.panel-danger-dark .panel-footer a,
.panel-danger-dark .panel-header a,
.panel-danger-dark .panel-heading a,
.panel-danger-dark .panel-plus-link a,
.panel-info-dark .panel-footer a,
.panel-info-dark .panel-header a,
.panel-info-dark .panel-heading a,
.panel-info-dark .panel-plus-link a,
.panel-primary .panel-footer a,
.panel-primary .panel-header a,
.panel-primary .panel-heading a,
.panel-primary .panel-plus-link a,
.panel-primary-dark .panel-footer a,
.panel-primary-dark .panel-header a,
.panel-primary-dark .panel-heading a,
.panel-primary-dark .panel-plus-link a,
.panel-royal-dark .panel-footer a,
.panel-royal-dark .panel-header a,
.panel-royal-dark .panel-heading a,
.panel-royal-dark .panel-plus-link a,
.panel-success-dark .panel-footer a,
.panel-success-dark .panel-header a,
.panel-success-dark .panel-heading a,
.panel-success-dark .panel-plus-link a,
.panel-warning-dark .panel-footer a,
.panel-warning-dark .panel-header a,
.panel-warning-dark .panel-heading a,
.panel-warning-dark .panel-plus-link a { color: #fff }

.jumbotron p {
    font-size: 1.2em;
    font-weight: 400
}

.lead {
    font-weight: 400;
    font-family: Lato, "Open Sans", sans-serif
}

.lead-lg {
    font-size: 1.8em;
    font-weight: 300
}

.lead-lg strong { font-weight: 400 }

.lead-sm { font-size: 1.2em }

.lead-hand {
    font-size: 1.3em;
    font-family: 'Indie Flower', cursive;
    line-height: 170%
}

.panel-heading,
.panel-heading-link,
.panel-plus-link { font-family: Lato, "Open Sans", sans-serif }

.panel-default,
.panel-default .panel-heading { border-color: #e5e5e5 }

.panel-primary { border-color: grey }

.panel-primary .panel-footer,
.panel-primary .panel-heading {
    background-color: grey;
    color: #fff
}

.panel-heading a { font-weight: 500 !important }

.panel-heading i {
    margin-right: 5px;
    font-size: 1.1em
}

.panel-title { padding: 7px }

.panel-heading-link,
.panel-plus-link {
    background-color: transparent;
    padding: 0;
    margin: 0;
    border: 0;
    position: relative
}

.panel-plus-link a {
    background-color: inherit;
    padding-top: 10px !important;
    padding-bottom: 10px !important
}

.panel-plus-link a:active,
.panel-plus-link a:focus,
.panel-plus-link a:hover { background-color: transparent !important }

.panel-group .panel > .panel-heading.panel-plus-link a.collapsed:before {
    font: var(--fa-font-solid);
    content: "\f067";
    font-size: 1.4em;
    margin-right: 10px;
    vertical-align: middle;
    font-style: normal;
    text-decoration: inherit
}

.panel-group .panel > .panel-heading.panel-plus-link a:before {
    font: var(--fa-font-solid);
    content: "\f068";
    font-size: 1.4em;
    margin-right: 10px;
    vertical-align: middle;
    font-style: normal;
    text-decoration: inherit
}


.panel-danger-dark .panel-heading a:hover,
.panel-danger-dark .panel-plus-link a:hover,
.panel-info-dark .panel-heading a:hover,
.panel-info-dark .panel-plus-link a:hover,
.panel-primary .panel-heading a:hover,
.panel-primary .panel-plus-link a:hover,
.panel-primary-dark .panel-heading a:hover,
.panel-primary-dark .panel-plus-link a:hover,
.panel-royal-dark .panel-heading a:hover,
.panel-royal-dark .panel-plus-link a:hover,
.panel-success-dark .panel-heading a:hover,
.panel-success-dark .panel-plus-link a:hover,
.panel-warning-dark .panel-heading a:hover,
.panel-warning-dark .panel-plus-link a:hover { background-color: none }

.panel-default .panel-heading-link a,
.panel-default .panel-plus-link a { color: #333 }

.panel .panel-footer i { margin: 0 5px }

.panel .panel-heading-link a:after {
    font: var(--fa-font-solid);
    content: "\f107";
    font-size: 1.2em;
    float: right;
    background-color: grey;
    color: #fff;
    padding: 5px 0;
    margin-top: -5px;
    margin-right: -15px;
    width: 33px;
    text-align: center
}

.panel-danger-dark .panel-heading-link a:after,
.panel-info-dark .panel-heading-link a:after,
.panel-primary .panel-heading-link a:after,
.panel-primary-dark .panel-heading-link a:after,
.panel-royal-dark .panel-heading-link a:after,
.panel-success-dark .panel-heading-link a:after,
.panel-warning-dark .panel-heading-link a:after { background-color: #333 }

.panel .panel-heading-link a.collapsed:after { content: "\f104" }

.panel-success .panel-heading-link a:after { background-color: #02c66c }

.panel-info .panel-heading-link a:after { background-color: #54c8eb }

.panel-warning .panel-heading-link a:after { background-color: #f0ad4e }

.panel-danger .panel-heading-link a:after { background-color: #d9534f }

.panel-royal .panel-heading-link a:after { background-color: #ac60d0 }

.panel-success .panel-heading-link a,
.panel-success .panel-plus-link a { color: #017a43 }

.panel-info .panel-heading-link a,
.panel-info .panel-plus-link a { color: #19add9 }

.panel-warning .panel-heading-link a,
.panel-warning .panel-plus-link a { color: #df8a13 }

.panel-danger .panel-heading-link a,
.panel-danger .panel-plus-link a { color: #b52b27 }

.panel-royal .panel-heading-link a,
.panel-royal .panel-plus-link a { color: #8834b0 }

.panel-heading-link > a,
.panel-heading.panel-plus-link > a {
    display: block;
    padding: 5px 15px
}

.panel-heading-link > a > i { margin-right: 10px }

.panel .panel-heading a {
    font-size: 1em;
    font-weight: 400;
    text-decoration: none
}

.panel .panel-danger .panel-heading a:hover,
.panel .panel-danger-dark .panel-heading a:hover,
.panel .panel-info .panel-heading a:hover,
.panel .panel-info-dark .panel-heading a:hover,
.panel .panel-primary .panel-heading a:hover,
.panel .panel-primary-dark .panel-heading a:hover,
.panel .panel-royal .panel-heading a:hover,
.panel .panel-royal-dark .panel-heading a:hover,
.panel .panel-success .panel-heading a:hover,
.panel .panel-success-dark .panel-heading a:hover,
.panel .panel-warning .panel-heading a:hover,
.panel .panel-warning-dark .panel-heading a:hover { background-color: transparent !important }

.panel-body-no-padding { padding: 0 !important }

.panel-default .panel-footer,
.panel-default .panel-heading {
    background-color: #f3f3f3;
    color: #333
}

.panel-royal .panel-footer,
.panel-royal .panel-heading {
    background-color: #dfc2ed;
    color: #5a2275;
    border: 1px solid #d5afe7
}

.panel-royal .panel-body { border: 1px solid #dfc2ed }

.panel-primary-dark .panel-footer,
.panel-primary-dark .panel-heading {
    background-color: #676767;
    color: #fff
}

.panel-success-dark .panel-footer,
.panel-success-dark .panel-heading {
    background-color: #5ca43f;
    color: #fff
}

.panel-info-dark .panel-footer,
.panel-info-dark .panel-heading {
    background-color: #288ec3;
    color: #fff
}

.panel-warning-dark .panel-footer,
.panel-warning-dark .panel-heading {
    background-color: #e4c016;
    color: #fff
}

.panel-danger-dark .panel-footer,
.panel-danger-dark .panel-heading {
    background-color: #a94242;
    color: #fff
}

.panel-royal-dark .panel-footer,
.panel-royal-dark .panel-heading {
    background-color: #792e9c;
    color: #fff
}

.panel-primary-dark .panel-body { border: 1px solid #676767 }

.panel-success-dark .panel-body { border: 1px solid #5ca43f }

.panel-info-dark .panel-body { border: 1px solid #288ec3 }

.panel-warning-dark .panel-body { border: 1px solid #e4c016 }

.panel-danger-dark .panel-body { border: 1px solid #a94242 }

.panel-royal-dark .panel-body { border: 1px solid #792e9c }

.breadcrumb > li + li:before {
    padding: 0 6px 0 5px;
    content: "\00bb"
}

.nav-pills > li > a {
    border-radius: 0;
    color: #333
}

.nav-pills.nav-stacked > li.active > a,
.nav-pills.nav-stacked > li.active > a:focus,
.nav-pills.nav-stacked > li.active > a:hover {
    border-left: solid 3px #000;
    background-color: #eee;
    color: #333
}

.nav-pills.nav-stacked > li > a { border-left: solid 3px grey }

.nav-pills.nav-stacked > li > a:hover { border-left: solid 3px #000 }

.nav-stacked > li + li { margin: 0 }

.nav-stacked {
    background-color: #f9f9f9;
    border: 1px solid #eee
}

.thumbnail {
    border-radius: 0;
    position: relative
}

a.thumbnail.active,
a.thumbnail:focus,
a.thumbnail:hover { border-color: grey }

.thumbnail.thumbnail-round,
.thumbnail.thumbnail-round > img { border-radius: 5px }

.img-caption-ar {
    position: relative;
    padding: 5px;
    border: 1px solid #ddd;
    margin-bottom: 20px;
    color: #fff;
    width: 100%
}

.img-caption-ar img { width: 100% }

.caption-ar {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: rgba(0, 0, 0, 0);
    opacity: 0
}

.carousel-e .carousel-indicators,
.carousel-razon .carousel-indicators { bottom: 0 !important }

.caption-ar .caption-content {
    width: 80%;
    height: 150px;
    left: 10%;
    top: 40%;
    margin-top: -20px;
    position: absolute;
    text-align: center;
    visibility: hidden;
    transition: all .5s ease;
    -webkit-transform: translateY(-100%);
    transform: translateY(-100%)
}

.carousel-e .carousel-img img,
.carousel-razon .carousel-img img { width: 100% }

.caption-ar:hover .caption-content {
    visibility: visible;
    -webkit-transform: translateY(0);
    transform: translateY(0)
}

.caption-ar:hover {
    background-color: rgba(0, 0, 0, .5);
    opacity: 1
}

.caption-ar .caption-content a {
    background-color: rgba(128, 128, 128, .5);
    padding: 10px 10px 8px;
    color: #fff;
    border: 1px solid #999;
    text-decoration: none;
    margin-bottom: 10px !important;
    display: inline-block;
    transition: all .25s ease
}

.caption-ar .caption-content a:hover { background-color: rgba(200, 200, 200, .5) }

.caption-ar .caption-content a i { margin-right: 10px }

.caption-ar .caption-content .caption-title {
    padding: 0;
    color: #fff;
    margin: 0 auto;
    text-align: center;
    font-size: 1.5em
}

.caption-ar .caption-content .caption-title + p { margin-top: 5px }

.navbar-default {
    box-shadow: 0 1px 2px rgba(0, 0, 0, .4), inset 0 0 2px rgba(255, 255, 255, .75);
    background-image: linear-gradient(to top, #ececec, #f4f4f4);
    margin-bottom: 0;
    border-bottom: 0
}


.navbar-default .navbar-brand {
    font-size: 28px;
    font-weight: 300;
    text-transform: lowercase;
    font-family: Muli, sans-serif;
    word-spacing: -6px;
    -webkit-text-stroke: 0;
    background-image: url(../img/colors/gray/logo.png);
    background-position: left center;
    background-repeat: no-repeat;
    padding-left: 45px;
    color: #000
}

@media (min-width: 360px) and (max-width: 768px) {
    .navbar-default .navbar-brand { margin-left: 10px }
}

@media (max-width: 400px) {
    .navbar-default .navbar-brand {
        background: 0 0 !important;
        padding-left: 0
    }

    .Hero { overflow: hidden !important; }

    .Hero img:not(.Hero-responsive) {
        height: 300px !important;
        width: auto !important;
        max-width: none !important;
    }

    .Hero-responsive {
        min-height: 200px !important;
        width: auto !important;
    }

    .btn-linkcolorhover { margin-bottom: 5px !important; }
}

.sb-icon-navbar i {
    background-color: #555;
    background-image: linear-gradient(to top, #4d4d4d, #666);
    color: #fff
}

.sb-icon-navbar i {
    margin-left: 15px;
    vertical-align: middle;
    font-size: 1.5em;
    padding: 15px 14px 14px;
    height: 50px
}

.carousel-e .carousel-img,
.carousel-img {
    height: 400px;
    vertical-align: middle;
    overflow: hidden
}

@media (max-width: 991px) {
    .sb-icon-navbar i {
        position: absolute;
        right: 0;
        top: 0;
        margin: 0
    }
}

.carousel-e .carousel-caption,
.carousel-razon .carousel-caption {
    position: static;
    text-align: left
}

.carousel-section-e {
    margin-bottom: 40px;
    overflow: hidden
}

.carousel-e {
    background-color: grey;
    background-color: rgba(128, 128, 128, .9)
}

.carousel-e .carousel-img-wrap { display: table-row }

.carousel-e .carousel-img { display: static }

.carousel-e .carousel-indicators li { margin: 0 2px }

.carousel-section {
    background-image: url(../img/slide_back.jpg);
    margin-bottom: 40px;
    background-size: cover;
    background-position: top center;
    overflow: hidden
}

.carousel-razon {
    background-color: grey;
    background-color: rgba(90, 90, 90, .9)
}

.carousel-razon-dark {
    background-color: #444;
    background-color: rgba(0, 0, 0, .6)
}

.carousel-razon .carousel-img-wrap { display: table-row }

.carousel-img { display: table-cell }

.carousel-razon .carousel-indicators li { margin: 0 2px }

.carousel-text span { color: #FFE163 }

.carousel-title {
    margin: 20px 0 10px;
    padding: 0;
    font-size: 2.2em;
    color: #fff;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, .5);
    line-height: 1.4em
}

.crousel-subtitle {
    font-size: 1.8em;
    color: #FFE163;
    margin-bottom: 20px;
    font-weight: 300;
    font-family: Lato, sans-serif
}

.carousel-list { margin: 20px 0 }

.carousel-list li {
    color: #fff;
    font-size: 1.4em;
    margin-bottom: 10px;
    overflow: hidden
}

.carousel-list li i {
    font-size: 1.6em;
    margin-right: 20px;
    color: #fff
}

.carousel-control {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 15%;
    font-size: 20px;
    color: #fff;
    text-align: center;
    filter: alpha(opacity=80);
    opacity: .8
}

.carousel-control.left {
    background-image: none;
    -webkit-filter: none;
    filter: none
}

.carousel-control.right {
    right: 0;
    left: auto;
    background-image: none;
    -webkit-filter: none;
    filter: none
}

.carousel-control:focus,
.carousel-control:hover {
    color: #fff;
    text-decoration: none;
    filter: alpha(opacity=100);
    outline: 0;
    opacity: 1
}

.carousel-control .glyphicon-chevron-left,
.carousel-control .glyphicon-chevron-right,
.carousel-control .icon-next,
.carousel-control .icon-prev {
    position: absolute;
    top: 50%;
    z-index: 5;
    display: inline-block
}

.carousel-control .glyphicon-chevron-left,
.carousel-control .icon-prev { left: 50% }

.carousel-control .glyphicon-chevron-right,
.carousel-control .icon-next { right: 50% }

.carousel-control .icon-next,
.carousel-control .icon-prev {
    width: 20px;
    height: 20px;
    margin-top: -10px;
    margin-left: -10px;
    font-family: serif
}

.carousel-control .icon-prev:before { content: '\2039' }

.carousel-control .icon-next:before { content: '\203a' }

@media (max-width: 767px) {
    .carousel-indicators {
        top: 10px !important;
        bottom: auto !important
    }

    .carousel-title {
        margin: 10px 0 5px;
        padding: 0;
        font-size: 2em;
        line-height: 1.3em
    }

    .crousel-subtitle { font-size: 1.4em }

    .carousel-text p { margin-bottom: 10px }

    .carousel-list { margin: 5px 0 0 }

    .carousel-list li {
        font-size: 1.2em;
        line-height: 1em;
        margin-bottom: 4px
    }

    .carousel-list li span { padding: 5px }

    .carousel-list li i {
        width: 42px;
        padding: 5px
    }

    .carousel-control {
        left: auto;
        bottom: auto;
        top: 20px
    }

    .carousel-control.left { right: 50px }

    .carousel-control.right { right: 0 }

    .Hero img:not(.Hero-responsive) {
        height: 350px !important;
        width: auto !important;
        max-width: none !important;
    }

    .Hero-responsive {
        min-height: 200px !important;
        width: auto !important;
    }

    .btn-linkcolorhover { margin-bottom: 5px !important; }

    #logo img { max-width: 140px !important; }
}

#footer-widgets {
    background-color: #444;
    color: #eee;
    padding: 0 0 20px;
    margin-top: 30px;
    border-top: solid 1px #ccc;
    box-shadow: 0 0 1px rgba(0, 0, 0, .3)
}

.footer-widget-title {
    font-family: Lato, sans-serif;
    font-size: 1.6em;
    color: #9a9a9a
}

#footer a,
#footer a:hover { color: grey }

#footer-widgets a {
    color: #eee;
    text-decoration: none;
    transition: all .25s ease
}

#footer-widgets a:hover { color: #9a9a9a }

#footer {
    background-color: #333;
    color: #ccc;
    padding: 17px 0;
    text-align: center;
    border-top: solid 1px #555
}

#footer a { text-decoration: none }

#footer p {
    margin: 0;
    padding: 0;
    line-height: 100%
}

.footer-widget .media { margin-bottom: 10px }

.footer-widget .media .media-heading {
    font-size: 1.1em;
    line-height: 1.3em
}

.footer-widget small {
    color: #ccc;
    font-style: oblique
}

.footer-widget .thumbnail {
    border-color: #666;
    background-color: rgba(0, 0, 0, .2)
}

.three_cols { overflow: hidden }

.three_cols > li {
    float: left;
    width: 33.333%;
    padding-bottom: 2px;
    padding-top: 1px
}

.input-group > input[type=text] {
    height: 34px;
    position: relative;
    z-index: 3
}

input.input-lg[type=text] { height: 40px !important }

.sb-slidebar { color: #fff }

.sb-slidebar input[type=text] {
    border-radius: 0;
    height: 50px;
    background-color: #333;
    border: 0;
    border-bottom: solid 1px #2f2f2f;
    box-shadow: none;
    color: #fff
}

.sb-slidebar .input-group .btn {
    height: 50px;
    background-color: grey;
    color: #fff;
    border-color: #2f2f2f;
    border-radius: 0
}

.sb-slidebar .input-group .btn i { font-size: 1.4em }

.slidebar-header {
    color: grey;
    font-size: 1.6em;
    border-bottom: solid 1px #2f2f2f;
    padding: 15px 20px;
    margin: 10px 0 20px
}

.padding-20 { padding: 20px 0 }

.padding-40 { padding: 40px 0 }

.padding-top-20 { padding-top: 20px }

.padding-top-40 { padding-top: 40px }

.padding-right-40 { padding-right: 40px; }

.margin-10 { margin: 10px 0 !important }

.no-margin { margin: 0 !important }

.no-padding { padding: 0 !important }

.no-margin-bottom { margin-bottom: 0 !important }

.no-margin-top { margin-top: 0 !important }

.no-margin-left { margin-left: 0 !important }

.no-margin-right { margin-right: 0 !important }

.lateral-padding {
    padding-left: 20px;
    padding-right: 20px
}

.slidebar-menu,
.slidebar-menu li {
    margin: 0;
    padding: 0
}

.slidebar-menu li {
    list-style-type: none;
    list-style-position: outside
}

.slidebar-menu li a {
    display: block;
    color: #ddd;
    padding: 10px 20px;
    border-bottom: solid 1px #2f2f2f;
    text-decoration: none
}

.slidebar-menu li a:hover {
    background-color: #000;
    color: #fff
}

.slidebar-social-icons { padding: 0 20px }

.syntaxhighlighter a,
.syntaxhighlighter code,
.syntaxhighlighter div,
.syntaxhighlighter table,
.syntaxhighlighter table caption,
.syntaxhighlighter table tbody,
.syntaxhighlighter table td,
.syntaxhighlighter table thead,
.syntaxhighlighter table tr,
.syntaxhighlighter textarea { overflow: hidden !important }

.syntaxhighlighter,
.syntaxhighlighter .line.alt1,
.syntaxhighlighter .line.alt2 { background-color: #fff !important }

.syntaxhighlighter .line.highlighted.alt1,
.syntaxhighlighter .line.highlighted.alt2 { background-color: #e0e0e0 !important }

.syntaxhighlighter .line.highlighted.number,
.syntaxhighlighter table caption { color: #000 !important }

.syntaxhighlighter .gutter { color: #afafaf !important }

.syntaxhighlighter .gutter .line { border-right: 3px solid grey !important }

.syntaxhighlighter .gutter .line.highlighted {
    background-color: grey !important;
    color: #fff !important
}

.syntaxhighlighter.printing .line .content { border: none !important }

.syntaxhighlighter.collapsed { overflow: visible !important }

.syntaxhighlighter.collapsed .toolbar {
    color: #00f !important;
    background: #fff !important;
    border: 1px solid grey !important
}

.syntaxhighlighter.collapsed .toolbar a { color: #00f !important }

.syntaxhighlighter.collapsed .toolbar a:hover { color: red !important }

.syntaxhighlighter .toolbar {
    color: #fff !important;
    background: grey !important;
    border: none !important
}

.syntaxhighlighter .toolbar a { color: #fff !important }

.syntaxhighlighter .plain,
.syntaxhighlighter .plain a,
.syntaxhighlighter .toolbar a:hover { color: #000 !important }

.syntaxhighlighter .comments,
.syntaxhighlighter .comments a { color: #008200 !important }

.syntaxhighlighter .string,
.syntaxhighlighter .string a { color: #00f !important }

.syntaxhighlighter .keyword {
    color: #069 !important;
    font-weight: 700 !important
}

.syntaxhighlighter .preprocessor { color: gray !important }

.syntaxhighlighter .variable { color: #a70 !important }

.syntaxhighlighter .value { color: #090 !important }

.syntaxhighlighter .functions { color: #ff1493 !important }

.syntaxhighlighter .constants { color: #06c !important }

.syntaxhighlighter .script {
    font-weight: 700 !important;
    color: #069 !important;
    background-color: none !important
}

.syntaxhighlighter .color1,
.syntaxhighlighter .color1 a { color: gray !important }

.syntaxhighlighter .color2,
.syntaxhighlighter .color2 a { color: #ff1493 !important }

.syntaxhighlighter .color3,
.syntaxhighlighter .color3 a { color: red !important }

.bs-glyphicons-list {
    padding-left: 0;
    list-style: none
}

.bs-glyphicons-list li {
    float: left;
    width: 25%;
    height: 115px;
    padding: 10px;
    font-size: 10px;
    line-height: 1.4;
    text-align: center;
    border: 1px solid #fff;
    background-color: #f9f9f9
}

.bs-glyphicons-list .glyphicon {
    margin-top: 5px;
    margin-bottom: 10px;
    font-size: 24px
}

.bs-glyphicons-list .glyphicon-class {
    display: block;
    text-align: center;
    word-wrap: break-word
}

.bs-glyphicons-list li:hover {
    color: #fff;
    background-color: grey
}

@media (min-width: 768px) {
    .bs-glyphicons-list {
        margin-left: 0;
        margin-right: 0
    }

    .bs-glyphicons-list li {
        width: 12.5%;
        font-size: 12px
    }
}

.fontawesome-icon-list .fa-hover a {
    font-size: 1.1em;
    line-height: 2em;
    color: #333;
    display: block;
    text-decoration: none;
    padding: 3px 10px;
    border-radius: 2px
}

.fontawesome-icon-list .fa-hover a:hover {
    color: #fff;
    background-color: grey
}

.fontawesome-icon-list .fa-hover a i {
    font-size: 1.4em;
    margin-right: 10px;
    line-height: 1.8em;
    vertical-align: baseline
}

@media (min-width: 768px) {
    .drop-demo ul {
        position: static;
        z-index: 0;
        margin: 0;
        padding: 0
    }

    .drop-demo .dropdown-menu .dropdown-submenu ul { position: absolute }
}

@media (max-width: 767px) {
    .drop-demo ul {
        position: static;
        z-index: 0;
        margin: 0;
        padding: 0
    }

    .drop-demo .dropdown-menu .dropdown-submenu ul {
        position: static;
        box-shadow: none;
        border: 0;
        margin: 0;
        padding-left: 15px
    }
}

.carousel-images .carousel-indicators {
    bottom: auto;
    top: 10px
}

.carousel-images .carousel-control {
    position: absolute;
    top: 50%;
    bottom: auto;
    height: 50px;
    left: 20px;
    width: 50px;
    font-size: 20px;
    color: #fff;
    text-align: center;
    text-shadow: 0 1px 2px rgba(0, 0, 0, .6);
    opacity: .5;
    filter: alpha(opacity=50);
    z-index: 90
}

.carousel-images .carousel-control.left {
    background-image: none;
    background-repeat: no-repeat;
    -webkit-filter: none;
    filter: none
}

.carousel-images .carousel-control.right {
    right: 0;
    left: auto;
    background-image: none;
    background-repeat: no-repeat;
    -webkit-filter: none;
    filter: none
}

.carousel-images .carousel-control:focus,
.carousel-images .carousel-control:hover {
    color: #fff;
    text-decoration: none;
    outline: 0;
    opacity: .9;
    filter: alpha(opacity=90)
}

.carousel-images .carousel-caption {
    background-color: rgba(0, 0, 0, .5);
    width: 100%;
    left: auto;
    right: auto;
    bottom: 0;
    padding: 20px
}

.bx-wrapper .bx-caption,
.carousel-images .carousel-caption.carousel-caption-dark { background-color: rgba(0, 0, 0, .7) }

.carousel-images .carousel-caption h1,
.carousel-images .carousel-caption h2,
.carousel-images .carousel-caption h3,
.carousel-images .carousel-caption h4,
.carousel-images .carousel-caption h5,
.carousel-images .carousel-caption h6 {
    color: #fff;
    margin: 0 0 10px
}

.carousel-images .carousel-caption h1 a,
.carousel-images .carousel-caption h2 a,
.carousel-images .carousel-caption h3 a,
.carousel-images .carousel-caption h4 a,
.carousel-images .carousel-caption h5 a,
.carousel-images .carousel-caption h6 a {
    color: #fff;
    text-decoration: none
}

.bx-wrapper {
    border: none;
    box-shadow: none
}

.bx-wrapper .bx-loading { background-image: url(../img/bx_loader.gif) }

.bx-wrapper .bx-caption { padding: 5px }

.bx-wrapper .bx-caption span {
    font-family: Lato, sans-serif;
    font-size: 1em;
    margin: 0;
    line-height: 1em;
    padding-bottom: 15px
}

.bx-wrapper .bx-prev {
    left: 0;
    background: url(../img/controls.png) 0 -32px no-repeat
}

.bx-wrapper .bx-next {
    right: 10px;
    background: url(../img/controls.png) -43px -32px no-repeat
}

.bx-wrapper .bx-viewport {
    box-shadow: none;
    border: 0
}

.bxslider-controls { position: relative }

.bxslider-controls .bx-next,
.bxslider-controls .bx-prev {
    font-size: 1.4em;
    font-weight: 500;
    background-color: rgba(0, 0, 0, .5);
    padding: 6px 0;
    color: #fff;
    width: 32px;
    height: 35px;
    position: absolute;
    top: -60px;
    display: inline-block;
    text-align: center;
    text-decoration: none
}

.bxslider-controls .bx-next { right: 0 }

.bxslider-controls .bx-prev { right: 37px }

.bxslider-controls .bx-next:hover,
.bxslider-controls .bx-prev:hover { background-color: grey }

.calification {
    color: #ffde00;
    font-size: 1.3em;
    margin-bottom: 10px
}

.calification i {
    margin: 0;
    padding: 0;
    line-height: 100%
}

.home-devices { padding-top: 20px }

@media (min-width: 1200px) {
    .home-devices { padding-top: 80px }
}

.icon-devices {
    margin: 30px 0 20px;
    font-size: 3em;
    text-align: center;
    padding: 0
}

.portfolio-menu h3,
.portfolio-menu h4 {
    padding: 10px;
    border-left: solid 3px grey;
    font-weight: 400
}

.icon-devices li {
    list-style-type: none;
    list-style-position: outside;
    display: inline-block
}

.icon-devices li a {
    color: #777;
    margin-right: 10px
}

.icon-devices li a:hover { color: #666 }

.icon-devices li.active a { color: grey }

.portfolio-menu {
    background-color: #f9f9f9;
    margin-bottom: 40px
}

.portfolio-menu h3 {
    font-size: 1.2em;
    color: #fff;
    background-color: grey;
    margin: 0
}

.portfolio-menu h3 i,
.portfolio-menu h4 i {
    font-size: .85em;
    margin-right: 5px
}

.portfolio-menu h4 {
    font-size: 1.2em;
    color: #333;
    background-color: #f1f1f1;
    margin: 0
}

.portfolio-cats,
.portfolio-cols,
.portfolio-desc {
    margin: 0;
    padding: 0;
    list-style-type: none;
    list-style-position: outside;
    box-sizing: border-box
}

.portfolio-cats li span {
    padding: 7px 10px;
    border-left: solid 3px #ddd;
    display: block;
    margin: 0;
    text-decoration: none;
    color: #333;
    cursor: pointer
}

.portfolio-cats li span.active,
.portfolio-cats li span.active:hover,
.portfolio-cats li span:hover {
    color: #000;
    border-color: grey
}

.portfolio-cats li span.active { font-weight: 600 }

.portfolio-cols li {
    float: left;
    width: 25%;
    margin: 0;
    padding: 0;
    text-align: center
}

.portfolio-cols li a {
    display: block;
    text-decoration: none;
    color: #333;
    font-size: 1.3em;
    margin: 0;
    border-right: solid 1px #ddd;
    padding: 7px 0
}

.portfolio-cols li:first-child a,
.portfolio-desc li:first-child a { border-left: solid 3px #ddd }

.portfolio-cols li:last-child a,
.portfolio-desc li:last-child a { border-right: none }

.portfolio-cols li a.active,
.portfolio-cols li a.active:focus,
.portfolio-cols li a.active:hover,
.portfolio-desc li a.active,
.portfolio-desc li a.active:focus,
.portfolio-desc li a.active:hover {
    background-color: grey;
    color: #fff;
    font-weight: 400
}

.portfolio-desc li {
    float: left;
    width: 50%;
    margin: 0;
    padding: 0;
    text-align: center
}

.portfolio-desc li a {
    display: block;
    text-decoration: none;
    color: #333;
    font-size: 1.1em;
    margin: 0;
    border-right: solid 1px #ddd;
    padding: 5px 0
}

.portfolio-topbar-cols li:last-child,
.portfolio-topbar-desc li:last-child,
.topbar-border { border-right: solid 1px #eee }

.portfolio-item-caption {
    text-align: center;
    margin-bottom: 20px
}

.portfolio-item-caption h1,
.portfolio-item-caption h2,
.portfolio-item-caption h3,
.portfolio-item-caption h4,
.portfolio-item-caption h5,
.portfolio-item-caption h6 {
    margin-bottom: 5px;
    margin-top: 0
}

.portfolio-topbar {
    background-color: #f9f9f9;
    margin-bottom: 30px;
    border-top: solid 1px #eee;
    border-left: solid 1px #eee
}

.portfolio-topbar h1,
.portfolio-topbar h2,
.portfolio-topbar h3,
.portfolio-topbar h4,
.portfolio-topbar h5,
.portfolio-topbar h6 {
    display: block;
    text-align: center;
    font-size: 1.3em;
    margin: 0;
    padding: 8px 0;
    line-height: 1;
    border-right: solid 1px #eee
}

.portfolio-topbar-cats li,
.portfolio-topbar-cols li,
.portfolio-topbar-desc li {
    float: left;
    list-style-type: none;
    list-style-position: outside
}

.portfolio-topbar-cats,
.portfolio-topbar-cols,
.portfolio-topbar-desc {
    margin: 0 auto;
    padding: 0;
    overflow: hidden;
    float: left
}

.portfolio-topbar-cats li span {
    display: inline-block;
    padding: 5px 12px;
    cursor: pointer;
    border-bottom: solid 3px #eee
}

.portfolio-topbar-cats li span.active,
.portfolio-topbar-cats li span.active:hover { border-bottom: solid 3px grey }

.portfolio-topbar-cols li a,
.topbar-border {
    border-bottom: solid 3px #eee;
    display: block
}

.topbar-border {
    width: 100%;
    padding: 5px 12px
}

@media (min-width: 992px) and (max-width: 1199px) {
    .portfolio-topbar-cats li span { padding: 5px 9px }

    .portfolio-item-panel .panel-body {
        font-size: .9em;
        line-height: 160%
    }

    .portfolio-item-panel h4 { margin-top: 0 }
}

.portfolio-topbar-cols {
    display: block;
    width: 100%
}

.portfolio-topbar-cols li {
    width: 25%;
    float: left;
    text-align: center
}

.portfolio-topbar-cols li a {
    padding: 5px 12px;
    cursor: pointer;
    text-decoration: none;
    color: #333
}

.portfolio-topbar-cols li a.active,
.portfolio-topbar-cols li a.active:hover,
.portfolio-topbar-desc li a.active,
.portfolio-topbar-desc li a.active:hover { border-bottom-color: grey }

.portfolio-topbar-cats li span:hover,
.portfolio-topbar-cols li a:hover,
.portfolio-topbar-desc li a:hover { border-bottom-color: #999 }

.portfolio-topbar .col-md-8 { padding-right: 0 }

.portfolio-topbar .col-md-2.port-fix {
    padding-right: 0;
    padding-left: 0
}

.portfolio-topbar .col-md-2 { padding-left: 0 }

.portfolio-topbar-desc li {
    float: left;
    width: 50%;
    text-align: center
}

.portfolio-topbar-desc {
    display: block;
    width: 100%
}

.portfolio-topbar-desc li a {
    display: block;
    padding: 5px 12px;
    cursor: pointer;
    border-bottom: solid 3px #eee;
    text-decoration: none;
    color: #333
}

.ec-box {
    margin-bottom: 20px;
    border: 1px solid #eee;
    box-shadow: 1px 1px 2px rgba(0, 0, 0, .2);
    position: relative;
    transition: all .25s ease
}

.ec-box:hover {
    -webkit-transform: translateY(-5px);
    transform: translateY(-5px);
    z-index: 10
}

.ec-box img {
    display: block;
    margin: 0 auto
}

.ec-box-footer {
    background-color: #f5f5f5;
    padding: 5px;
    overflow: hidden;
    margin-top: 10px
}

.ec-box-footer .label {
    font-size: 1em;
    padding-top: 8px;
    padding-bottom: 8px;
    display: inline-block;
    margin-bottom: 0
}

.ec-box-footer .ec-price {
    display: block;
    font-size: 1.2em;
    color: #02c66c;
    text-align: center;
    margin-top: 5px
}

.ec-box-header {
    background-color: #f5f5f5;
    padding: 5px;
    font-weight: 600;
    text-align: center
}

.ec-filters-menu ul {
    padding: 0;
    list-style-type: none
}

.ec-filters-menu ul li a {
    display: block;
    color: #333;
    border-left: solid 3px #ddd;
    padding-left: 15px;
    text-decoration: none
}

#bx-pager a,
.pi-content,
.price-box { display: inline-block }

.ec-filters-menu ul li a:hover {
    border-color: #000;
    color: #000
}

.ec-filters-menu ul li a.active {
    border-color: grey;
    color: grey
}

.price-box {
    font-size: 2.4em;
    margin-right: 10px;
    vertical-align: middle;
    border: 1px solid #FFE163;
    padding: 9px;
    border-radius: 2px
}

#bx-pager a {
    border: 1px solid #ddd;
    padding: 3px
}

@media (max-width: 991px) {
    #bx-pager { margin-bottom: 40px }

    .BlockContentBottom {
        Bottom: 5%;
        width: 90%;
        Color: White !important;
        padding-bottom: 25px;
        text-align: center;
    }
}

.e-price {
    font-size: 1.4em;
    padding: 15px;
    background-color: grey;
    color: #fff;
    margin-bottom: 20px;
    text-align: center
}

.e-price span { font-size: 2em }

.post {
    margin-bottom: 30px;
    overflow: hidden
}

.post .panel.panel-default .panel-heading a {
    color: #000;
    font-size: 1.2em;
    margin: 0
}

.post .panel.panel-primary .panel-heading a {
    color: #fff;
    font-size: 1.2em;
    margin: 0
}

.post-title {
    font-size: 1.6em;
    margin: 0 0 20px;
    padding-bottom: 10px;
    border-bottom: solid 1px #eee
}

.post .post-title a {
    color: grey;
    text-decoration: none
}

.img-post {
    padding: 5px;
    border: 1px solid #ccc;
    background-color: #eee;
    margin: 0 auto 20px
}

.post p { line-height: 190% }

.comments-sidebar li h4,
.post-sidebar h4 {
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    line-height: 140%
}

.post-content { font-size: .9em }

.post-info {
    margin-top: 20px;
    padding: 5px 0;
    border-top: solid 1px #ddd;
    border-bottom: solid 1px #ddd;
    overflow: hidden;
    vertical-align: baseline;
    position: relative
}

.post-info span { color: grey }

.post-info .btn {
    position: absolute;
    right: 0;
    top: 3px
}

.post-info-b i { margin: 0 5px }

.pi-content { margin-top: 5px }

.sub-comments {
    padding-left: 50px;
    border-left: dotted 1px #ddd
}

.block { margin-bottom: 40px }

.block .nav > li > a > i { font-size: 1.3em }

.block ul { padding: 0 }

.block ul.simple li {
    list-style-type: none;
    margin: 3px 0
}

.block ul.simple li a {
    border-left: solid 2px grey;
    padding-left: 20px
}

.block ul.simple li a:hover { border-color: #000 }

.block ul.simple li ul { padding-left: 20px }

.post-sidebar { padding: 0 }

.post-sidebar li {
    list-style-type: none;
    overflow: hidden;
    margin-bottom: 20px
}

.post-sidebar img {
    float: left;
    padding: 5px;
    border: 1px solid #ccd;
    background-color: #ddd;
    margin-right: 10px
}

.post-sidebar h4 {
    margin: 0;
    padding: 0;
    font-size: 1.1em
}

.post-sidebar .date {
    margin-top: 10px;
    color: #666;
    display: block
}

.tags-cloud a {
    border: 1px solid #ddd;
    padding: 3px 5px;
    margin: 2px;
    display: inline-block;
    font-size: .9em;
    color: grey;
    text-decoration: none
}

.tags-cloud a:hover {
    background-color: grey;
    color: #fff
}

.comments-sidebar {
    padding: 0;
    margin: 0
}

.comments-sidebar li {
    list-style-type: none;
    margin: 10px 0;
    overflow: hidden
}

.comments-sidebar li:nth-child(2n) img {
    border-radius: 50px;
    float: left;
    margin-right: 10px
}

.comments-sidebar li:nth-child(2n + 1) img {
    border-radius: 50px;
    float: right;
    margin-left: 10px
}

.comments-sidebar li h4 { font-size: 1em }

.masonry-item.blog-item hr { margin: 0 0 10px }

.masonry-item.blog-item .btn { margin-top: 5px }

.masonry-item.blog-item .img-responsive { width: 100% }

.masonry-item.blog-item .autor-post img {
    width: 45px;
    height: 45px;
    border-radius: 200px;
    margin-right: 10px
}

@media (min-width: 768px) {
    .timeline-left { border-right: solid 5px #ddd }

    .timeline-right { padding-top: 100px }

    .timeline-event-left {
        width: 97%;
        position: relative
    }

    .timeline-event-left:before,
    .timeline-event-right:before {
        width: 20px;
        height: 20px;
        background-color: grey;
        position: absolute;
        top: 13px;
        margin-left: -12px;
        z-index: 10;
        content: ""
    }

    .timeline-event-left:before {
        border-radius: 50px;
        border: 4px solid #ddd;
        right: -37px
    }

    .timeline-event-right:before {
        border-radius: 50px;
        border: 4px solid #ddd;
        left: -25px
    }

    .timeline-event-right {
        width: 97%;
        margin-left: 3%;
        position: relative
    }

    .timeline-event:after {
        content: "";
        width: 0;
        height: 0;
        border-style: solid;
        position: absolute;
        top: 9px
    }

    .timeline-event-left:after {
        border-width: 14px 0 14px 20px;
        border-color: transparent transparent transparent grey;
        right: -18px
    }

    .timeline-event-right:after {
        border-width: 14px 20px 14px 0;
        border-color: transparent grey transparent transparent;
        left: -18px
    }
}

@media (min-width: 992px) {
    .timeline-event-left:before {
        right: -41px;
        margin-left: -12px
    }

    .timeline-event-right:before {
        left: -29px;
        margin-left: -12px
    }
}

@media (min-width: 1200px) {
    .timeline-event-left:before {
        right: -44px;
        margin-left: -12px
    }

    .timeline-event-right:before {
        left: -32px;
        margin-left: -12px
    }
}

.timeline-title {
    text-align: center;
    display: block;
    margin: 0 auto 40px
}

.timeline-title span {
    background-color: grey;
    padding: 8px;
    color: #fff;
    border-radius: 3px
}

@media (min-width: 768px) {
    .timeline-2 {
        border-left: solid 5px #eee;
        list-style-type: none;
        margin: 0 0 0 110px;
        padding: 0 0 0 20px
    }

    .timeline-2 li { position: relative }

    .timeline-2-point {
        top: 20px;
        left: -10px;
        width: 10px;
        height: 10px;
        position: absolute;
        background: grey;
        margin: 0 0 0 -17px;
        box-shadow: 0 0 0 4px #eee;
        -webkit-font-smoothing: antialiased;
        border-radius: 30px;
        z-index: 20
    }

    .timeline-2 li:hover .timeline-2-point { background-color: #444 }

    .timeline-2 li .timeline-time {
        position: relative;
        top: 0;
        left: -150px;
        z-index: 20;
        text-align: right;
        display: block;
        width: 100px
    }

    .timeline-2 li .timeline-time span {
        display: block;
        font-size: 1.6em
    }

    .timeline-2 li .alert,
    .timeline-2 li .panel,
    .timeline-2 li blockquote {
        margin-top: -45px;
        position: relative;
        top: 0
    }
}

#header-full,
.coming-back,
.profile-header,
.services-header { background-size: cover }

@media (max-width: 767px) {
    .timeline-2 {
        list-style-type: none;
        margin: 0;
        padding: 0
    }

    .timeline-2-point { display: none }

    .timeline-2 li { margin-bottom: 40px }

    .timeline-2 li .timeline-time {
        font-size: 1.6em;
        padding-bottom: 20px;
        display: block
    }
}

.pricign-box {
    border: 1px solid #444;
    box-shadow: 3px 3px 8px 0 #ccc;
    margin-bottom: 20px;
    transition: all .3s
}

#back-top a,
.header-full-icons .icon-ar,
.services-header-list li a,
.top-nav-social a,
a.feature-icon { transition: all .25s ease }

.pricign-box:hover { box-shadow: 0 0 8px 2px rgba(0, 0, 0, .39) }

.pricing-box-header {
    color: #fff;
    background-color: #444;
    padding: 10px
}

.pricing-box-header > h2 {
    margin: 0 0 10px;
    padding: 0;
    line-height: 100%;
    font-size: 2em;
    text-align: center;
    color: #fff
}

.pricing-box-header > p {
    font-size: .9em;
    font-weight: 300;
    text-align: center;
    margin: 0
}

.pricing-box-price {
    padding: 10px;
    margin-bottom: 7px;
    background-color: #ededed;
    border-bottom: solid 1px #ddd
}

.pricing-box-price h3 {
    margin: 0;
    padding: 0;
    line-height: 100%;
    font-size: 2em;
    text-align: center
}

.pricing-box-price h3 > sub { font-size: .6em }

.pricing-box-content > ul { padding: 0 }

.pricing-box-content > ul > li {
    list-style-type: none;
    padding: 7px 0;
    border-bottom: dotted 1px #ddd;
    vertical-align: top
}

.pricing-box-content > ul > li > i {
    margin: 0 14px;
    font-size: 1.4em;
    list-style-position: inside
}

.pricing-box-footer {
    margin: 10px auto;
    text-align: center
}

.pricign-box-pro { border-color: grey }

.pricing-table-content li,
.pricing-table-head { border-bottom: solid 1px #ddd }

.pricign-box-pro > .pricing-box-header {
    color: #fff;
    background-color: grey
}

.pricing-table {
    border-top: solid 1px #ddd;
    border-left: solid 1px #ddd;
    margin-bottom: 40px
}

.pricing-table-content {
    list-style-type: none;
    padding: 0;
    font-size: .9em;
    margin: 0;
    text-align: center
}

.pricing-table-content li {
    padding: 5px 10px;
    margin: 0
}

.border-fix-pricing { border-right: solid 1px #ddd }

.pricing-table-description { margin-top: 70px }

.pricing-desc-title,
.pricing-table-head h2 {
    background-color: grey;
    color: #fff;
    margin: 0;
    text-align: center
}

.pricing-desc-title {
    font-size: 24px;
    padding: 21px 5px 20px;
    height: 69px
}

.pricing-table-head h2 {
    font-size: 1.3em;
    padding: 10px 5px;
    font-weight: 400;
    height: 70px
}

.pricing-table-head h2 span {
    font-size: 12px;
    display: block;
    padding-top: 5px
}

.pricing-table-head .price {
    text-align: center;
    font-size: 24px;
    font-weight: 400;
    height: 32px
}

.pricing-table-head .price i {
    font-style: normal;
    font-size: 32px
}

.pricing-table-description .pricing-table-content { text-align: left }

.pricing-table-content li:nth-child(2n + 1) { background-color: #f9f9f9 }

.pricing-table-description i {
    margin-right: 10px;
    color: grey;
    font-size: 1.1em
}

.pricing-table-footer .btn { border-radius: 0 }

.pricing-table-content .fa-check { color: #02c66c }

.pricing-table-content .fa-xmark { color: #d9534f }

.pricing-table-content .fa-times { color: #d9534f }

@media (min-width: 992px) {
    .pricing-col {
        margin: 0;
        padding: 0
    }
}

@media (max-width: 991px) {
    .pricing-table-content span { display: block }

    .pricing-table { border-right: solid 1px #ddd }
}

.circles-text { font-size: 2em !important }

#header-full {
    background-image: url(../img/back.jpg);
    background-repeat: no-repeat;
    color: #fff
}

.wrap-primary {
    background-color: grey;
    background-color: rgba(64, 64, 64, .7);
    padding: 40px 0
}

#header-full .secondary-color {
    text-shadow: 0 1px 2px rgba(0, 0, 0, .75);
    color: #FFE163;
    font-weight: 300
}

#header-full .lead {
    text-shadow: 0 1px 2px rgba(0, 0, 0, .75);
    font-weight: 300;
    font-size: 1.6em;
    max-width: 700px;
    margin: 0 auto
}

.header-full-icons {
    margin-top: 80px;
    text-shadow: 0 1px 2px rgba(0, 0, 0, .75)
}

.header-full-icons .icon-ar:hover { background-color: rgba(255, 255, 255, .2) }

#header-full h1,
#header-full h2,
#header-full h3,
#header-full h4,
#header-full h6 {
    color: #fff;
    text-shadow: 0 1px 2px rgba(0, 0, 0, .75);
    font-family: Muli, Lato, sans-serif
}

.head-title {
    font-size: 5em;
    font-weight: 300;
    text-align: center;
    color: #fff !important
}

@media (min-height: 900px) {
    .wrap-primary { padding: 20px 0 }

    .header-full-icons { margin-top: 40px }
}

@media (min-height: 990px) {
    .wrap-primary { padding: 80px 0 40px }
}

@media (max-height: 900px) {
    .wrap-primary { padding: 0 }

    .header-full-icons { margin-top: 40px }

    .head-title { font-size: 3em }

    .head-subtitle { font-size: 2em }

    .header-full-icons .icon-ar.icon-ar-xl-lg {
        width: 60px;
        height: 60px;
        font-size: 32px;
        line-height: 1.8
    }
}

@media (max-height: 768px) {
    .head-full-logo { display: none }
}

@media (max-width: 991px) {
    .wrap-primary { padding: 20px 0 }

    .header-full-icons { margin-top: 40px }

    .head-title {
        font-size: 3em;
        font-weight: 300;
        text-align: center;
        color: #fff !important
    }

    .head-subtitle { font-size: 2em }
}

.wrap-dark-color {
    background-color: #333;
    color: #666
}

.wrap-dark-color p.lead {
    margin: 20px 0;
    font-size: 1.3em
}

.feature-icon:first-child { border-left: solid 1px #444 }

.feature-container { display: table }

a.feature-icon {
    display: table-cell;
    padding: 20px;
    min-width: 130px;
    border-right: solid 1px #444;
    text-decoration: none;
    color: #666;
    cursor: pointer
}

a.feature-icon:hover {
    color: #fff;
    background-color: grey
}

.feature-icon i {
    display: block;
    font-size: 2.6em;
    margin-bottom: 10px;
    text-align: center
}

.feature-icon h4 {
    font-size: 1.2em;
    margin: 0;
    color: #666;
    text-align: center
}

.feature-icon:hover h4 { color: #fff }

@media (min-width: 1200px) {
    a.feature-icon:hover { min-width: 200px }
}

@media (max-width: 991px) {
    .feature-container {
        display: block;
        text-align: center;
        border: 0;
        margin: 0;
        padding: 0
    }

    .feature-icon:first-child { border-left: 0 }

    a.feature-icon {
        float: left;
        width: 25%;
        border: 0
    }
}

@media (max-width: 519px) {
    .feature-container h4 { font-size: 1em }

    .feature-icon:first-child { border-left: 0 }

    a.feature-icon {
        float: left;
        border: 0;
        min-width: 0;
        width: 50%
    }
}

.error-404 { max-width: 500px }

.error-404 h1 {
    font-size: 6em;
    text-transform: uppercase;
    font-family: 'Open Sans'
}

.error-404 h2 {
    font-size: 3em;
    text-transform: uppercase
}

@media (min-height: 1019px) {
    .error-404 { margin: 48px auto 49px }
}

.paper-back {
    background-image: url(../img/back.png);
    background-repeat: repeat;
    position: fixed;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0
}

.profile-header,
.services-header,
.title-logo { background-repeat: no-repeat }

.title-logo {
    background-image: url(../img/colors/gray/logo50.png);
    background-position: center top;
    font-size: 2.3em;
    font-weight: 300;
    font-family: Muli, Lato, sans-serif;
    color: #000;
    padding-top: 70px;
    margin-bottom: 20px;
    text-align: center
}

.title-logo span { color: grey }

.transparent-div {
    box-shadow: 0 0 4px rgba(0, 0, 0, .2), inset 0 0 2px #fff;
    border: 1px solid #c3c3c3;
    background-color: rgba(255, 255, 255, .4);
    padding: 20px;
    color: #7e8488
}

.transparent-div h1,
.transparent-div h2,
.transparent-div h3 { color: #7e8488 }

.transparent-div h1 { font-size: 3.5em }

.transparent-div p {
    font-size: 1.2em;
    font-family: Lato, sans-serif;
    font-weight: 300;
    margin-bottom: 25px
}

.transparent-div .btn-ar.btn-primary {
    border: 1px solid #5a5a5a;
    background-image: linear-gradient(to bottom, grey, #6e6e6e);
    font-size: 14px;
    padding-left: 30px;
    padding-right: 30px;
    border-radius: 0
}

.absolute-center { height: 700px }

@media (min-width: 500px) {
    .absolute-center {
        width: 500px;
        height: 500px;
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
        right: 0;
        margin: auto
    }
}

.home-news-box { margin-bottom: 30px }

@media (max-width: 991px) {
    .home-news-box { margin-top: 40px }

    .home-news-box h5 { font-size: 1em }
}

.profile-header {
    min-height: 350px;
    background-image: url(../img/back_profile.jpg);
    color: #fff;
    margin-bottom: 40px
}

.dark-div { background-color: rgba(0, 0, 0, .5) }

.profile-header .dark-div {
    min-height: 350px;
    padding: 50px 0
}

.profile-header h1 {
    text-shadow: 0 1px 2px rgba(0, 0, 0, .75);
    font-size: 3em;
    text-align: center;
    color: #fff
}

.profile-header h2 {
    text-shadow: 0 1px 2px rgba(0, 0, 0, .75);
    font-size: 1.7em;
    text-align: center;
    color: #FFE163
}

.profile-header-btn .btn {
    margin: 10px;
    padding: 12px 20px
}

.home-profile-img img {
    border: 10px solid rgba(255, 255, 255, .5);
    box-shadow: 0 0 5px rgba(0, 0, 0, .5);
    margin-top: 10px
}

.profile-header-social {
    text-align: center;
    margin: 20px 0 0
}

.services-header {
    min-height: 350px;
    background-image: url(../img/back_services.jpg);
    color: #fff;
    margin-bottom: 40px
}

.primary-dark-div { background-color: rgba(82, 82, 82, .5) }

.services-header .primary-dark-div {
    min-height: 350px;
    padding: 50px 0
}

.service-header-text {
    max-width: 450px;
    text-shadow: 0 1px 2px rgba(0, 0, 0, .75)
}

.service-header-text h1 { color: #FFE163 }

.service-header-text .btn-ar.btn-primary {
    box-shadow: 0 0 3px rgba(255, 255, 255, .75), inset 0 0 2px rgba(255, 255, 255, .75);
    border: 1px solid #00577c;
    background-image: linear-gradient(to top, #717171, grey);
    padding: 13px 45px;
    font-size: 1.1em;
    text-shadow: none;
    margin: 20px 0
}

.service-header-text .btn-ar.btn-primary:active {
    background-image: linear-gradient(to bottom, #717171, grey);
    box-shadow: 0 0 3px rgba(255, 255, 255, .75), inset 0 0 2px rgba(0, 0, 0, .2)
}

.services-header-list {
    list-style-type: none;
    padding: 0;
    margin: 0
}

.services-header-list li a {
    display: block;
    color: #fff;
    text-decoration: none;
    font-size: 1.7em;
    font-family: Lato, "Open Sans", sans-serif;
    font-weight: 300;
    text-shadow: 0 1px 2px rgba(0, 0, 0, .75);
    background-color: rgba(255, 255, 255, .2);
    box-shadow: 0 0 5px #000, inset 0 0 2px rgba(255, 255, 255, .65);
    border: 1px solid rgba(255, 255, 255, .4);
    padding: 15px;
    margin: 20px 0
}

.services-header-list li a i {
    margin-right: 10px;
    font-size: 1.1em
}

.services-header-list li a:hover {
    text-shadow: 0 1px 2px rgba(0, 0, 0, .75);
    background-color: rgba(255, 255, 255, .3);
    box-shadow: 0 0 5px #000, inset 0 0 2px rgba(255, 255, 255, .95)
}

@media (min-width: 992px) and (max-width: 1199px) {
    .services-header-list li a { font-size: 1.4em }
}

@media (max-width: 600px) {
    .services-header-list li a { font-size: 1.4em }
}

.logig-form { max-width: 500px }

.login-form-full {
    padding-top: 50px;
    max-width: 500px;
    margin: 0 auto
}

.paper-back-full {
    background-image: url(../img/back.png);
    background-repeat: repeat;
    padding-bottom: 30px
}

.coming-back,
.coming-desc h1,
.header-full-title { background-repeat: no-repeat }

@media (min-height: 800px) {
    .login-form-full { padding-top: 10% }
}

.profile-avatar-container { position: relative }

.profile-avatar {
    position: absolute;
    top: -100px;
    left: 100px;
    border: 10px solid rgba(255, 255, 255, .5);
    box-shadow: 0 0 5px rgba(0, 0, 0, .5)
}

.nav-profile {
    background-color: #f9f9f9;
    border-bottom: solid 1px #eee;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .3);
    margin-bottom: 60px
}

.nav-profile ul {
    padding: 0;
    margin: 0;
    overflow: hidden;
    min-height: 50px;
    list-style-type: none
}

.profile-counters li {
    float: left;
    text-align: center
}

.profile-counters li a {
    font-family: Lato;
    display: block;
    color: #333;
    font-size: 22px;
    padding: 6px 40px 4px 0;
    text-decoration: none
}

.profile-counters li a:hover { color: grey }

.profile-counters li a span {
    display: block;
    font-size: 13px
}

.profile-header-text {
    text-shadow: 0 1px 2px rgba(0, 0, 0, .75);
    margin-top: 130px
}

.profile-header-text h1 { color: #FFE163 }

#getting-started,
.coming-back,
.coming-desc h1,
.profile-header-text h2 { color: #fff }

@media (max-width: 767px) {
    .profile-avatar {
        position: static;
        margin: 0 auto;
        display: block
    }

    .nav-profile { margin-bottom: 40px }

    .profile-header-text {
        text-align: center;
        margin-top: 0
    }
}

.coming-back {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: url(../img/coming_back.jpg)
}

.coming-content {
    background-color: rgba(0, 10, 17, .76);
    margin-top: 20px;
    padding: 30px 0
}

.coming-content h1 { font-family: Muli, Lato, sans-serif }

.coming-counter h1 {
    color: #fff;
    font-size: 3em;
    text-align: right;
    margin: 0 0 40px
}

#getting-started span { display: block }

.coming-date {
    list-style-type: none;
    padding: 0;
    float: right
}

.coming-date li {
    float: left;
    display: block;
    text-align: center;
    font-size: 36px;
    font-weight: 300;
    font-family: Lato;
    margin: 0 15px
}

.coming-date li span {
    display: block;
    font-size: 18px;
    margin-top: 15px
}

.coming-date li.colon { margin: 0 }

.coming-date li:last-child { margin-right: 0 }

.coming-desc h1 {
    font-size: 40px;
    display: block;
    margin: 0 0 20px;
    padding-left: 70px;
    background-image: url(../img/logo50_white.png);
    background-position: left center
}

.coming-desc p {
    font-size: 1.2em;
    line-height: 170%
}

.coming-social {
    float: right;
    margin-top: 150px
}

@media (max-width: 991px) {
    .coming-social {
        float: left;
        margin-top: 20px
    }
}

@media (min-height: 600px) {
    .coming-content { margin-top: 50px }
}

@media (min-height: 800px) {
    .coming-content { margin-top: 300px }
}

.coming-date.coming-date-black {
    display: block;
    width: 100%;
    overflow: hidden;
    float: none;
    text-align: center;
    margin: 20px auto
}

.coming-date.coming-date-black li {
    color: #7e8488;
    float: none;
    display: inline-block;
    vertical-align: top
}

.service-list li {
    counter-increment: myIndex;
    position: relative;
    margin-bottom: 20px;
    padding: 10px 0 10px 80px
}

.service-list li:before {
    content: counter(myIndex);
    font-family: Roboto, sans-serif;
    font-size: 2em;
    padding: 10px 15px;
    border: 1px solid grey;
    color: grey;
    border-radius: 500px;
    position: absolute;
    top: 10px;
    left: 0
}

.header-full-dark .header-full-title h1 a,
.header-full-title h1 {
    font-family: Muli;
    word-spacing: -7px
}

#back-top a {
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 999999999;
    color: #eee;
    background-color: rgba(0, 0, 0, .3);
    padding: 10px;
    border-radius: 5px;
    text-align: center
}

#back-top a:hover { background-color: rgba(0, 0, 0, .7) }

.top-nav .dropdown a,
.top-nav-social {
    background-color: #f1f1f1;
    display: inline-block
}

#back-top a i { font-size: 2em }

@media (max-width: 767px) {
    #back-top a {
        position: fixed;
        bottom: 10px;
        right: 10px
    }

    #back-top a i { font-size: 1.6em }
}

.header-full { background-image: linear-gradient(to top, #f0f0f0, #f4f4f4) }

.header-full-title {
    float: left;
    overflow: hidden;
    padding-left: 75px;
    background-image: url(../img/colors/gray/logo_big.png);
    background-position: left center
}

.header-full-title h1 {
    margin-bottom: 5px;
    margin-top: 15px;
    color: #000;
    font-size: 32px
}

.header-full-title h1 a {
    color: #000;
    text-decoration: none
}

.header-full-title h1 span,
.header-full-title h1 span a { color: grey }

.header-full-title p {
    margin-bottom: 15px;
    font-size: 1.2em;
    text-align: center
}

.top-nav {
    float: right;
    position: relative
}

.top-nav .dropdown {
    display: inline-block;
    margin-left: 20px;
    z-index: 60000000;
    vertical-align: top
}

.top-nav .dropdown a {
    margin: 0;
    padding: 7px 10px;
    color: #000;
    text-decoration: none;
    box-shadow: inset 0 0 1px #fff;
    border: 1px solid #e3e6e8;
    border-top: 0
}

.top-nav .dropdown > a:after { content: none }

.top-nav .dropdown a i {
    font-size: 1.2em;
    color: #444
}

.top-nav-social {
    margin: 0 0 0 20px;
    padding: 0;
    list-style-type: none;
    box-shadow: inset 0 0 1px #fff;
    border: 1px solid #e3e6e8;
    border-top: 0;
    overflow: hidden
}

.header-full + .navbar-inverse,
.navbar-header-full {
    box-shadow: none;
    background-image: none
}

.top-nav-social li {
    float: left;
    margin: 0
}

.top-nav-social a {
    font-size: 1.5em;
    margin: 0;
    color: #444;
    display: inline-block;
    padding: 7px 10px;
    min-width: 40px;
    text-align: center
}

.top-nav-social a.twitter:hover {
    background-color: #00aced;
    color: #fff
}

.top-nav-social a.facebook:hover {
    background-color: #3b5998;
    color: #fff
}

.top-nav-social a.instagram:hover {
    background-color: #517fa4;
    color: #fff
}

.top-nav-social a.rss:hover {
    background-color: #ef922f;
    color: #fff
}

.top-nav-social a.linkedin:hover {
    background-color: #007bb6;
    color: #fff
}

.top-nav-social a.git:hover {
    background-color: #666;
    color: #fff
}

.top-nav-social a.google-plus:hover {
    background-color: #dd4b39;
    color: #fff
}

.top-nav-social a.youtube:hover {
    background-color: #b00;
    color: #fff
}

.top-nav-social a.pinterest:hover {
    background-color: #cb2027;
    color: #fff
}

.top-nav-social a.wordpress:hover {
    background-color: #4597be;
    color: #fff
}

.top-nav-social a.flickr:hover {
    background-color: #ff0084;
    color: #fff
}

.top-nav-social a.vine:hover {
    background-color: #00b48a;
    color: #fff
}

.top-nav-social a.dribbble:hover {
    background-color: #f26798;
    color: #fff
}

.top-nav-social a.foursquare:hover {
    background-color: #0072b1;
    color: #fff
}

.top-nav-social a.tumblr:hover {
    background-color: #32506d;
    color: #fff
}

.header-full-dark {
    background-image: none;
    background-color: #444;
    color: #fff
}

.header-full-dark .header-full-title h1 a {
    margin-bottom: 5px;
    margin-top: 15px;
    color: #fff;
    font-size: 32px
}


.header-full-dark .top-nav-social {
    margin: 0 0 0 20px;
    padding: 0;
    list-style-type: none;
    display: inline-block;
    background-color: #333;
    box-shadow: inset 0 0 1px #323232;
    border: 1px solid #555;
    border-top: 0;
    overflow: hidden
}

.header-full-dark .top-nav-social li {
    float: left;
    margin: 0
}

.header-full-dark .top-nav-social a {
    color: #999;
    transition: all .25s ease
}

.header-full-dark .top-nav .dropdown a {
    color: #999;
    background-color: #333;
    box-shadow: inset 0 0 1px #323232;
    border: 1px solid #555;
    border-top: 0
}

.header-full-dark .top-nav .dropdown a i { color: #999 }

.header-full-dark .top-nav .dropdown-menu {
    color: #999;
    background-color: #333
}

.header-full-dark .top-nav .dropdown-menu input {
    color: #999;
    background-color: #444;
    border-color: #555;
    box-shadow: none
}

.header-full-dark .top-nav .dropdown-menu input:focus { border-color: grey }

.header-full-dark ~ .navbar-dark { border-top: solid 1px #555 }

.header-full-dark + .navbar-inverse { border-color: grey }

.bootstrap-switch {
    border-radius: 0;
    border: 1px solid #ccc
}

.bootstrap-switch .bootstrap-switch-handle-off,
.bootstrap-switch.bootstrap-switch-inverse.bootstrap-switch-off .bootstrap-switch-label,
.bootstrap-switch.bootstrap-switch-on .bootstrap-switch-label {
    border-bottom-right-radius: 0;
    border-top-right-radius: 0
}

.bootstrap-switch .bootstrap-switch-handle-on,
.bootstrap-switch.bootstrap-switch-inverse.bootstrap-switch-on .bootstrap-switch-label,
.bootstrap-switch.bootstrap-switch-off .bootstrap-switch-label {
    border-bottom-left-radius: 0;
    border-top-left-radius: 0
}

.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-primary,
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-primary {
    color: #fff;
    background: grey
}

.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-info,
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-info {
    color: #fff;
    background: #54c8eb
}

.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-success,
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-success {
    color: #fff;
    background: #02c66c
}

.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-warning,
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-warning {
    background: #f0ad4e;
    color: #fff
}

.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-royal,
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-royal {
    color: #fff;
    background: #ac60d0
}

.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-danger,
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-danger {
    color: #fff;
    background: #d9534f
}

.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-default {
    color: #333;
    background-color: #ddd
}

.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-default {
    color: #eee;
    background: #5a5a5a
}

.bootstrap-switch .bootstrap-switch-label {
    text-align: center;
    margin-top: -1px;
    margin-bottom: -1px;
    z-index: 100;
    color: #333;
    background: #fff
}

.bootstrap-switch input[type=radio],
.bootstrap-switch input[type=checkbox] {
    position: absolute !important;
    top: 0;
    left: 0;
    opacity: 0;
    filter: alpha(opacity=0);
    z-index: -1
}

.bootstrap-switch input[type=radio].form-control,
.bootstrap-switch input[type=checkbox].form-control { height: auto }

.bootstrap-switch.bootstrap-switch-mini .bootstrap-switch-handle-off,
.bootstrap-switch.bootstrap-switch-mini .bootstrap-switch-handle-on,
.bootstrap-switch.bootstrap-switch-mini .bootstrap-switch-label {
    padding: 1px 5px;
    font-size: 12px;
    line-height: 1.5
}

.bootstrap-switch.bootstrap-switch-small .bootstrap-switch-handle-off,
.bootstrap-switch.bootstrap-switch-small .bootstrap-switch-handle-on,
.bootstrap-switch.bootstrap-switch-small .bootstrap-switch-label {
    padding: 5px 10px;
    font-size: 12px;
    line-height: 1.5
}

.bootstrap-switch.bootstrap-switch-large .bootstrap-switch-handle-off,
.bootstrap-switch.bootstrap-switch-large .bootstrap-switch-handle-on,
.bootstrap-switch.bootstrap-switch-large .bootstrap-switch-label {
    padding: 6px 16px;
    font-size: 18px;
    line-height: 1.33
}

.bootstrap-switch.bootstrap-switch-disabled,
.bootstrap-switch.bootstrap-switch-indeterminate,
.bootstrap-switch.bootstrap-switch-readonly { cursor: default !important }

.bootstrap-switch.bootstrap-switch-disabled .bootstrap-switch- .bootstrap-switch.bootstrap-switch-readonly .bootstrap-switch-label,
.bootstrap-switch.bootstrap-switch-disabled .bootstrap-switch-handle-off,
.bootstrap-switch.bootstrap-switch-disabled .bootstrap-switch-handle-on,
.bootstrap-switch.bootstrap-switch-indeterminate .bootstrap-switch-handle-off,
.bootstrap-switch.bootstrap-switch-indeterminate .bootstrap-switch-handle-on,
.bootstrap-switch.bootstrap-switch-indeterminate .bootstrap-switch-label,
.bootstrap-switch.bootstrap-switch-readonly .bootstrap-switch-handle-off,
.bootstrap-switch.bootstrap-switch-readonly .bootstrap-switch-handle-on {
    opacity: .5;
    filter: alpha(opacity=50);
    cursor: default !important
}

.bootstrap-switch.bootstrap-switch-animate .bootstrap-switch-container { transition: margin-left .5s }

.bootstrap-switch.bootstrap-switch-inverse .bootstrap-switch-handle-off,
.bootstrap-switch.bootstrap-switch-inverse .bootstrap-switch-handle-on { border-radius: 0 }

.bootstrap-switch.bootstrap-switch-focused {
    border-color: grey;
    box-shadow: none;
    outline: 0
}

.megamenu {
    padding: 15px 0 0 !important;
    background-color: #f2f2f2;
    border: 1px solid #f0f0f0;
    color: #333;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .45)
}

.dropdown-megamenu {
    border: 0;
    margin: 0;
    padding: 0;
    background-color: transparent !important
}

.megamenu-section { margin-bottom: 15px }

.megamenu .megamenu-title {
    margin-top: 0;
    margin-bottom: 5px
}

.megamenu li,
.megamenu li a,
.megamenu ul {
    margin: 0;
    padding: 0
}

.megamenu ul {
    list-style-type: none;
    list-style-position: outside
}

.megamenu li a {
    color: #333 !important;
    font-family: "Open Sans", sans-serif;
    font-weight: 400;
    font-size: 12.5px;
    transition: all .15s ease
}

#primary-plan,
#primary-plan h1 { font-family: Muli }

.megamenu li a:focus,
.megamenu li a:hover {
    color: grey !important;
    background-color: transparent;
    text-decoration: none
}

.wrap-primary-plan {
    background-image: url(../img/plan.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: bottom center;
    color: #fff
}

#primary-plan {
    text-align: center;
    color: #fff;
    padding: 10px 20px;
    margin: 20px auto;
    display: block
}

#primary-plan h1 {
    font-weight: 300;
    font-size: 2.6em;
    color: #fff
}

.wrap-pointers { background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAYAAABytg0kAAAAE0lEQVQIW2NkYGD4D8SMjEACDAAOKQEDKKNmJgAAAABJRU5ErkJggg==) }

.content-box-trans {
    background-color: rgba(0, 0, 0, .5) !important;
    border: 0 !important
}

#subscribe-plan {
    max-width: 484px;
    margin: 40px auto 80px
}

#subscribe-plan input {
    background-color: rgba(0, 0, 0, .5);
    border: 1px solid rgba(255, 255, 255, .7);
    box-shadow: inset 0 1px 2px 1px rgba(0, 0, 0, .44);
    color: #fff;
    height: 42px;
    border-radius: 0;
    font-size: 16px;
    border-right: 0
}

#subscribe-plan input:focus { box-shadow: 0 0 3px 0 #fff }

#subscribe-plan .btn {
    height: 42px;
    background: -webkit-gradient(left top, left bottom, color-stop(0, rgba(0, 0, 0, 0)), color-stop(100%, #000));
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0, #000 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#000000', GradientType=0);
    border: 1px solid rgba(255, 255, 255, .7);
    font-size: 16px;
    color: #ddd;
    border-radius: 0;
    padding: 0 25px;
    z-index: 2
}

#subscribe-plan .btn:focus,
#subscribe-plan .btn:hover { text-shadow: 0 0 1px #fff }

#subscribe-plan .btn:active {
    background: -webkit-gradient(left bottom, left top, color-stop(0, rgba(0, 0, 0, .5)), color-stop(100%, #000));
    background: linear-gradient(to top, rgba(0, 0, 0, .5) 0, #000 100%)
}

.road-splash,
.sh-wrap-commerce,
.wrap-polygons { background-repeat: no-repeat }

#subscribe-plan .lead-lg {
    text-align: center;
    font-size: 2em;
    margin-bottom: 10px
}

.tabs-left,
.tabs-right {
    border-bottom: none;
    padding-top: 2px
}

.tabs-left { border-right: 1px solid #ddd }

.tabs-right { border-left: 1px solid #ddd }

.tabs-left > li,
.tabs-right > li {
    float: none;
    margin-bottom: 2px
}

.tabs-left > li { margin-right: -1px }

.tabs-right > li { margin-left: -1px }

.tabs-left > li.active > a,
.tabs-left > li.active > a:focus,
.tabs-left > li.active > a:hover {
    border-bottom-color: #ddd;
    border-right-color: transparent
}

.tabs-right > li.active > a,
.tabs-right > li.active > a:focus,
.tabs-right > li.active > a:hover {
    border-bottom: 1px solid #ddd;
    border-left-color: transparent
}

.tabs-left > li > a {
    border-radius: 4px 0 0 4px;
    margin-right: 0;
    display: block
}

.tabs-right > li > a {
    border-radius: 0 4px 4px 0;
    margin-right: 0
}

.sideways {
    margin-top: 50px;
    border: none;
    position: relative
}

.overlay,
.wrap-polygons { border-top: solid 1px #ddd }

.sideways > li {
    height: 20px;
    width: 120px;
    margin-bottom: 100px
}

.sideways > li > a {
    border-bottom: 1px solid #ddd;
    border-right-color: transparent;
    text-align: center;
    border-radius: 4px 4px 0 0
}

.sideways > li.active > a,
.sideways > li.active > a:focus,
.sideways > li.active > a:hover {
    border-bottom-color: transparent;
    border-right-color: #ddd;
    border-left-color: #ddd
}

.sideways.tabs-left { left: -50px }

.sideways.tabs-right { right: -50px }

.sideways.tabs-right > li {
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg)
}

.sideways.tabs-left > li {
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg)
}

.tabs-left-ar > li { margin-bottom: 0 }

.tabs-left-ar > li.active > a,
.tabs-left-ar > li > a {
    border-radius: 0;
    background-color: #f9f9f9;
    border-left: solid 3px #ccc
}

.vertical-tabs-left,
.vertical-tabs-right {
    display: table;
    background-color: #fafafa;
    border-top: solid 1px #ddd;
    border-bottom: solid 1px #ddd
}

.vertical-tabs-left { border-right: solid 1px #ddd }

.vertical-tabs-right { border-left: solid 1px #ddd }

.vertical-tab-list {
    display: table-cell;
    min-width: 150px;
    vertical-align: top
}

.vertical-tabs-right .vertical-tab-list {
    border-right: solid 3px #ddd;
    border-left: solid 1px #ddd
}

.vertical-tabs-left .vertical-tab-list {
    border-left: solid 3px #ddd;
    border-right: solid 1px #ddd
}

.vertical-tabs-right .vertical-tab-list ul.nav > li > a {
    border-right: solid 3px #ddd;
    margin-right: -3px;
    color: #444;
    padding-top: 6px;
    padding-bottom: 6px;
    font-size: 13px
}

.vertical-tabs-left .vertical-tab-list ul.nav > li > a {
    border-left: solid 3px #ddd;
    margin-left: -3px;
    color: #444;
    padding-top: 6px;
    padding-bottom: 6px;
    font-size: 13px
}

.vertical-tabs-right .vertical-tab-list ul.nav > li > a:focus,
.vertical-tabs-right .vertical-tab-list ul.nav > li > a:hover {
    border-right: solid 3px #999;
    background-color: #f1f1f1
}

.vertical-tabs-right .vertical-tab-list ul.nav > li.active > a,
.vertical-tabs-right .vertical-tab-list ul.nav > li.active > a:focus,
.vertical-tabs-right .vertical-tab-list ul.nav > li.active > a:hover {
    border-right: solid 3px grey;
    background-color: #f1f1f1
}

.vertical-tabs-left .vertical-tab-list ul.nav > li > a:focus,
.vertical-tabs-left .vertical-tab-list ul.nav > li > a:hover {
    border-left: solid 3px #999;
    background-color: #f1f1f1
}

.vertical-tabs-left .vertical-tab-list ul.nav > li.active > a,
.vertical-tabs-left .vertical-tab-list ul.nav > li.active > a:focus,
.vertical-tabs-left .vertical-tab-list ul.nav > li.active > a:hover {
    border-left: solid 3px grey;
    background-color: #f1f1f1
}

.vertical-tabs-left .tab-content,
.vertical-tabs-right .tab-content {
    display: table-cell;
    padding: 20px
}

.overlay {
    z-index: 2;
    background-color: #fff;
    position: relative;
    padding-top: 40px
}

.wrap-polygons {
    background-image: url(../img/back_polygons.jpg);
    background-position: center center;
    background-size: cover;
    padding: 30px 0;
    border-bottom: solid 1px #ddd
}

.wrap-polygons.ar-intro-product {
    border: none;
    padding-bottom: 0
}

.wrap-polygons.ar-intro-product h1 { font-size: 2.9em }

.wrap-polygons.ar-intro-product .lead {
    font-weight: 300;
    font-size: 1.4em;
    line-height: 160%
}

.wrap-polygons.ar-intro-product .social-icons { margin: 10px 0 }

.wrap-polygons.ar-intro-product .btn-polygon { margin: 15px 0 }

.wrap-polygons.ar-intro-product .btn-polygon .btn { margin: 0 5px }

.yamm .collapse,
.yamm .dropdown,
.yamm .dropup,
.yamm .nav { position: static }

.panel.panel-card,
.yamm .container { position: relative }


.yamm .dropdown-submenu > .dropdown-menu {
    top: -1px;
    margin-top: -5px;
    margin-left: 0
}

.yamm .yamm-content { padding: 0 }

.yamm .dropdown.yamm-fw .dropdown-menu {
    left: 0;
    right: 0
}

.col-megamenu {
    border-right: solid 1px #ddd;
    padding: 0
}

.col-megamenu::last-child { border: 0 }

.yamm-content .row { margin: 0 }

.megamenu-block .megamenu-block-title {
    line-height: 1;
    margin: 0;
    color: grey;
    font-size: 16px;
    padding: 15px 20px 10px;
    text-transform: uppercase
}

.megamenu-block .megamenu-block-title i { margin-right: 5px }

.megamenu-block ul {
    margin: 0;
    padding: 0
}

.megamenu-block ul li {
    list-style: none;
    margin: 0;
    padding: 0
}

.megamenu-block ul li a {
    padding: 2px 20px;
    font-size: 13px;
    display: block;
    color: #333
}

.megamenu-block ul li a i { margin-right: 5px }

.megamenu-block ul li a:hover { text-decoration: none }

.navbar-dark .megamenu-block-title,
.navbar-inverse .megamenu-block-title { color: #f2f2f2 }

.navbar-dark .col-megamenu,
.navbar-inverse .col-megamenu { border-right: solid 1px #555 }

#t-cards {
    padding-top: 80px;
    padding-bottom: 80px;
    background-color: #345
}

.panel.panel-card {
    height: 241px;
    border: 1px solid #ddd;
    overflow: hidden
}

.panel.panel-card .panel-heading {
    position: relative;
    z-index: 2;
    height: 120px;
    border-bottom-color: #fff;
    overflow: hidden;
    transition: height .6s ease-in-out
}

.panel.panel-card .panel-heading img {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 1;
    width: 120%;
    -webkit-transform: translate3d(-50%, -50%, 0);
    transform: translate3d(-50%, -50%, 0)
}

.panel.panel-card .panel-heading button {
    position: absolute;
    top: 10px;
    right: 15px;
    z-index: 3
}

.panel.panel-card .panel-header { margin: 10px 0 }

.panel.panel-card .panel-figure {
    position: absolute;
    top: auto;
    left: 50%;
    z-index: 3;
    width: 70px;
    height: 70px;
    background-color: #fff;
    border-radius: 50%;
    opacity: 1;
    box-shadow: 0 0 0 3px #fff;
    -webkit-transform: translate3d(-50%, -50%, 0);
    transform: translate3d(-50%, -50%, 0);
    transition: opacity .4s ease-in-out
}

.panel.panel-card .panel-body {
    padding-top: 40px;
    padding-bottom: 20px;
    transition: padding .4s ease-in-out
}

.panel.panel-card .panel-thumbnails { padding: 0 15px 20px }

.panel-thumbnails .thumbnail {
    width: 60px;
    max-width: 100%;
    margin: 0 auto;
    background-color: #fff
}

.panel.panel-card:hover .panel-heading {
    height: 55px;
    transition: height .4s ease-in-out
}

.panel.panel-card:hover .panel-figure {
    opacity: 0;
    transition: opacity .4s ease-in-out
}

.panel.panel-card:hover .panel-body {
    padding-top: 20px;
    transition: padding .4s ease-in-out
}

.max-width-500 { max-width: 500px }

.ar-nav-pills {
    background-color: #f5f5f5;
    border: 1px solid #ddd;
    margin-bottom: 30px
}

.ar-nav-pills li { border-left: solid 1px #ddd }

.ar-nav-pills li a .fa {
    margin-right: 5px;
    font-size: 1.1em
}

.ar-nav-pills li.active a,
.ar-nav-pills li.active a:focus,
.ar-nav-pills li.active a:hover { background-color: grey }

.ar-nav-pills li:first-child { border-left: none }

@media (max-width: 767px) {
    .ar-nav-pills {
        background-color: #f5f5f5;
        border: 1px solid #ddd;
        margin-bottom: 30px
    }

    .ar-nav-pills li {
        border-left: none;
        margin: 0 0 -5px !important
    }
}

.hand-list { margin-top: 20px }

.hand-list li { margin-bottom: 40px }

#splash-page { height: 100% }

#splash-page #splash-intro {
    position: relative;
    background-color: #333;
    height: 100%
}

#splash-page #splash-intro .container { padding-top: 100px }

#splash-page #splash-content {
    position: relative;
    height: 100%;
    overflow: auto;
    background-color: #fff;
    padding-top: 80px
}

.road-splash {
    background-image: url(../img/back_lead5.jpg);
    background-position: bottom center;
    background-size: cover;
    color: #fff
}

.sh-wrap-commerce,
.wrap-hero {
    background-position: center center;
    background-size: cover
}

.road-splash h1,
.road-splash h2,
.road-splash h3,
.road-splash h4,
.road-splash h5,
.road-splash h6 { color: #FFE163 }

.road-splash .download-zone { margin-top: 20px }

.road-splash .download-zone h2 {
    color: #fff;
    font-size: 2.8em;
    line-height: 1;
    padding-top: 0;
    margin-top: 0
}

.road-splash .download-zone .other-platforms {
    font-size: 12px;
    color: #FFE163;
    padding-top: 5px
}

.road-splash .download-zone .btn-transparent {
    border-radius: 0;
    display: table;
    max-width: 240px
}

.road-splash .download-zone .btn-transparent i {
    display: table-cell;
    font-size: 2em;
    padding-right: 20px;
    vertical-align: middle
}

.road-splash .download-zone .btn-transparent span {
    display: table-cell;
    vertical-align: top;
    font-size: 26px;
    text-align: left
}

.road-splash .download-zone .btn-transparent span small {
    display: block;
    font-size: 12px
}

.splash-title {
    font-family: Oswald;
    font-weight: 700;
    font-size: 4em;
    color: #fff !important;
    text-shadow: 3px 4px #000
}

.splash-title span { color: grey }

.splash-lead {
    font-family: Lato;
    line-height: 1.4em;
    font-weight: 300;
    text-shadow: 1px 2px 1px #000;
    font-size: 1.8em;
    max-width: 720px;
    margin: 20px auto
}

.splash-lead span { color: #FFE163 }

#splash-footer {
    position: absolute;
    bottom: 10px;
    left: 48%;
    background-color: rgba(128, 128, 128, .6);
    border-radius: 100px
}

#splash-footer:hover { background-color: grey }

#splash-footer i {
    font-size: 32px;
    padding: 10px
}

@media (max-height: 768px) {
    #splash-page #splash-intro .container { padding-top: 50px }

    #splash-page #splash-content { padding-top: 80px }
}

@media (min-width: 1200px) {
    .road-splash .splash-lead {
        font-size: 2em;
        line-height: 1.4em
    }

    .road-splash p {
        font-size: 1.3em;
        margin-bottom: 15px;
        line-height: 1.6em;
        font-weight: 300
    }

    .road-splash .download-zone .other-platforms {
        font-size: 18px;
        padding-top: 5px;
        margin-top: 40px
    }
}

@media (max-width: 991px) {
    .download-zone {
        text-align: center;
        margin: 0 auto
    }

    .download-zone a.btn { max-width: none }
}

.animated.animated-fast {
    -webkit-animation-duration: .25s;
    animation-duration: .25s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both
}

.wrap-hero { background-image: url(../img/bg_ny.jpg) }

.wrap-hero .carousel-hero {
    background-color: rgba(108, 108, 108, .58);
    position: relative
}

.wrap-hero .carousel-hero .carousel-control {
    background-color: rgba(0, 0, 0, .5);
    display: inline-block;
    height: 40px;
    width: 40px;
    top: 20px;
    text-align: center;
    border: 1px solid rgba(255, 255, 255, .3)
}

.wrap-hero .carousel-hero .carousel-control i {
    font-size: 24px;
    line-height: 1.7
}

.wrap-hero .carousel-hero .carousel-control.left {
    left: auto;
    right: 75px
}

.wrap-hero .carousel-hero .carousel-control.right { right: 20px }

.wrap-hero .carousel-hero .carousel-caption {
    position: static;
    text-align: left;
    font-family: Lato, sans-serif
}

.wrap-hero .carousel-hero .carousel-caption span { color: #00fea7 }

.wrap-hero .carousel-hero .carousel-caption .carousel-list {
    color: #fff;
    font-family: Lato, sans-serif;
    font-weight: 300
}

.wrap-hero .carousel-hero .carousel-caption .carousel-list li { line-height: 1 }

.wrap-hero .carousel-hero .carousel-caption .carousel-list li span { top: 6px }

.wrap-hero .carousel-hero .carousel-caption .carousel-list strong {
    font-weight: 300;
    color: #00fea7
}

.wrap-hero .carousel-hero .carousel-caption .carousel-list span { color: #fff }

.wrap-hero .carousel-hero .carousel-object {
    position: relative;
    min-height: 350px;
    overflow: hidden
}

.wrap-hero .carousel-hero .carousel-object img {
    position: absolute;
    bottom: 0
}

.sh-header-full-title {
    background-image: none;
    padding-left: 0
}

.sh-header-full-title .sh-logo {
    display: inline-block;
    left: 0;
    border: 2px solid #444;
    border-radius: 5px;
    padding: 10px;
    color: grey;
    margin: 17px 10px 0;
    height: 65px;
    width: 65px;
    text-align: center;
    vertical-align: top
}

.sh-header-full-title .sh-header-title { display: inline-block }

.sh-header-full-title .sh-header-title h1 {
    margin-top: 15px;
    margin-bottom: 5px
}

.sh-header-full-title .sh-header-title p {
    margin-bottom: 18px;
    margin-top: 0;
    color: #999;
    font-size: 14px;
    position: relative;
    z-index: 1;
    text-transform: uppercase
}

.sh-header-full-title .sh-header-title p:after,
.sh-header-full-title .sh-header-title p:before {
    content: "";
    border-bottom: solid 1px #999;
    position: absolute;
    z-index: 1;
    left: 0;
    width: 100%
}

.sh-header-full-title .sh-header-title p:after { top: 10px }

.sh-header-full-title .sh-header-title p:before { top: 14px }

.sh-header-full-title .sh-header-title p span {
    background-color: #f1f1f1;
    padding: 0 5px;
    position: relative;
    z-index: 2
}

.dropdown-menu-lang {
    width: auto;
    box-shadow: none
}

.dropdown-menu-lang li a { display: block !important }

.header-full-dark .sh-header-title p span { background-color: #444 }

.header-full-dark .sh-logo { border-color: #bbb }

.header-full-dark .dropdown-menu-lang li a {
    color: #fff !important;
    background-image: none
}

.header-full-dark .dropdown-menu-lang li a:focus,
.header-full-dark .dropdown-menu-lang li a:hover { background-color: grey !important }

.sh-wrap-commerce {
    background-image: url(../img/back_wrap_commerce.jpg);
    color: #fff;
    padding: 30px 0;
    min-height: 500px
}

#sh-home-intro .title { text-transform: uppercase }

#sh-home-intro .title h1,
#sh-home-intro .title h2 {
    font-family: Oswald, sans-serif;
    color: #fff
}

#sh-home-intro .title h1 span,
#sh-home-intro .title h2 span { color: grey }

#sh-home-intro .title h1 {
    font-size: 4.8em;
    font-weight: 600;
    word-spacing: -10px;
    border-bottom: solid 1px #fff;
    padding-bottom: 30px;
    margin-bottom: 30px;
    line-height: 1;
    display: inline-block
}

#sh-home-intro .title h2 {
    font-size: 1.4em;
    margin-top: 0;
    letter-spacing: 1px
}

#sh-home-intro .title .btn-intro-shop {
    background-image: none !important;
    border: 1px solid #f1f1f1;
    border-radius: 0;
    font-family: Oswald, sans-serif;
    padding: 15px 25px;
    font-size: 1.2em;
    font-weight: 300
}

#sh-home-intro .title .btn-primary.btn-intro-shop { background-color: rgba(128, 128, 128, .4) }

#sh-home-intro .title .btn-primary.btn-intro-shop:hover { background-color: grey }

#sh-home-intro .title .btn-success.btn-intro-shop { background-color: rgba(2, 198, 108, .4) }

#sh-home-intro .title .btn-success.btn-intro-shop:hover { background-color: #02c66c }

#sh-home-intro .title .btn-info.btn-intro-shop { background-color: rgba(84, 200, 235, .4) }

#sh-home-intro .title .btn-info.btn-intro-shop:hover { background-color: #54c8eb }

#sh-home-intro .title .btn-warning.btn-intro-shop { background-color: rgba(240, 173, 78, .4) }

#sh-home-intro .title .btn-warning.btn-intro-shop:hover { background-color: #f0ad4e }

#sh-home-intro .title .btn-danger.btn-intro-shop { background-color: rgba(217, 83, 79, .4) }

#sh-home-intro .title .btn-danger.btn-intro-shop:hover { background-color: #d9534f }

#sh-home-intro .title .btn-royal.btn-intro-shop { background-color: rgba(172, 96, 208, .4) }

#sh-home-intro .title .btn-royal.btn-intro-shop:hover { background-color: #ac60d0 }

#sh-home-intro .title .sh-home-intro-btn { margin: 40px 0 }

#sh-home-intro .title .sh-home-intro-btn .btn { margin: 0 5px 5px 0 }

#sh-home-intro .title .sh-home-intro-social a:link { color: #fff !important }

.sh-product-body {
    padding: 0;
    position: relative;
    z-index: 1
}

.sh-product-body .sh-product-caption {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, .6);
    opacity: 0;
    transition: all .25s ease;
    color: #fff;
    padding: 20px
}

.sh-product-body .sh-product-caption hr {
    width: 80%;
    text-align: center;
    margin: 0 auto;
    border-color: rgba(255, 255, 255, .3)
}

.sh-product-body .sh-product-caption .sh-product-caption-title {
    color: #fff;
    display: block;
    text-align: center;
    margin-top: 30px;
    margin-bottom: 10px;
    font-family: Muli
}

.sh-product-body .sh-product-caption .sh-product-caption-des {
    text-align: center;
    font-size: .9em
}

.sh-product-body .sh-product-caption:hover { opacity: 1 }

.sh-product-body .sh-price {
    position: absolute;
    bottom: 10px;
    left: 10px;
    z-index: 10;
    background-color: rgba(0, 0, 0, .6);
    color: #fff;
    padding: 10px 15px;
    border-radius: 2px;
    font-family: Muli, 'Open Sans'
}

.row-grid [class^=col-] { margin-bottom: 20px }

#agm-configurator {
    position: fixed;
    z-index: 1040;
    top: 0;
    bottom: 0;
    left: -300px;
    display: table;
    width: 340px;
    height: 100%
}

#agm-configurator #agm-configurator-content {
    display: table-cell;
    width: 300px;
    color: #fff;
    border-right: solid 1px #333;
    background-color: #222
}

#agm-configurator #agm-configurator-content .panel {
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background-color: #222
}

#agm-configurator #agm-configurator-content .panel .panel-body:last-child { border-bottom: solid 1px #333 }

#agm-configurator #agm-configurator-content .panel .panel-heading {
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background-color: #1c1c1c
}

#agm-configurator #agm-configurator-content .panel .panel-heading a {
    font-family: 'Roboto Condensed', sans-serif;
    font-weight: 400;
    line-height: 2rem;
    position: relative;
    display: block;
    margin-top: -1px;
    padding: 10px 15px;
    text-transform: uppercase;
    color: #72797b;
    border-top: solid 1px #2b2b2b;
    border-bottom: solid 1px #2b2b2b
}

#agm-configurator #agm-configurator-button,
#body-options,
#icon-options { display: table-cell }

#agm-configurator #agm-configurator-content .panel .panel-heading a:after {
    font-family: 'Open Sans';
    font-size: 25px;
    position: absolute;
    top: -3px;
    right: 15px;
    content: '_'
}

#agm-configurator #agm-configurator-content .panel .panel-heading a.collapsed:after {
    top: 10px;
    content: '+'
}

#agm-configurator #agm-configurator-content .panel .panel-collapse {
    background: 0 0;
    border: none
}

#body-options,
#icon-options i {
    background-image: linear-gradient(to top, #ececec, #f4f4f4);
    box-shadow: 0 1px 2px rgba(0, 0, 0, .4), inset 0 0 2px rgba(255, 255, 255, .75)
}

#agm-configurator #agm-configurator-content .panel .panel-body {
    border: 0;
    font-size: 1.25rem
}

#agm-configurator #agm-configurator-content .panel .panel-body h5 { margin-top: 0 }

#agm-configurator #agm-configurator-button #agm-configurator-btn {
    position: relative;
    top: 180px;
    width: 40px;
    height: 40px;
    margin-left: -1px;
    color: #fff;
    border: none;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    background-color: #222
}

#agm-configurator #agm-configurator-button #agm-configurator-btn i {
    font-size: 2.2rem;
    margin-left: -2px;
    line-height: 1.5
}

#theme-options {
    display: table;
    position: fixed;
    top: 150px;
    left: -260px;
    z-index: 1000;
    transition: all .25s ease
}

#theme-options:hover,
.Proxy { left: 0 }

#icon-options i { padding: 10px }

#body-options {
    width: 260px;
    background-color: #eee;
    padding: 15px 20px;
    position: relative;
    z-index: 100
}

#body-options h2 {
    font-size: 1.3em;
    margin-bottom: 10px
}

#color-options .color-box {
    display: inline-block;
    text-indent: -999999px !important;
    width: 30px;
    height: 30px;
    background-color: #fff;
    margin: 5px
}

#color-options .color-blue { background-color: #0099da }

#color-options .color-blue2 { background-color: #4d7db3 }

#color-options .color-blue3 { background-color: #6695e2 }

#color-options .color-blue4 { background-color: #2366f0 }

#color-options .color-blue5 { background-color: #38d3ff }

#color-options .color-green { background-color: #21ba91 }

#color-options .color-green2 { background-color: #21ba49 }

#color-options .color-green3 { background-color: #13e018 }

#color-options .color-green4 { background-color: #5ebe1e }

#color-options .color-green5 { background-color: #0a9200 }

#color-options .color-red { background-color: #e73c3c }

#color-options .color-red2 { background-color: #ae0000 }

#color-options .color-red3 { background-color: #ed0742 }

#color-options .color-fuchsia { background-color: #ff4c94 }

#color-options .color-pink { background-color: #ff41e6 }

#color-options .color-yellow { background-color: #f6dc00 }

#color-options .color-yellow2 { background-color: #c5b319 }

#color-options .color-orange { background-color: #ffb644 }

#color-options .color-orange2 { background-color: #e97900 }

#color-options .color-orange3 { background-color: #c37744 }

#color-options .color-violet { background-color: #9f2cc0 }

#color-options .color-violet2 { background-color: #9000ec }

#color-options .color-violet3 { background-color: #c64dff }

#color-options .color-gray { background-color: grey }

#color-options .color-aqua { background-color: #29d7d5 }

.cssButton { display: none }

.cssButton div {
    cursor: pointer;
    border: 0 solid #000;
    display: -moz-inline-stack;
    display: inline-block;
    padding: 0;
    margin: 0;
    position: relative;
    -moz-user-select: none;
    user-select: none
}

.cssButton div.cssButton0 {
    margin-top: 2px;
    margin-bottom: 2px
}

.cssButton div.cssButton2 {
    padding: 0 2px;
    margin-top: -1px;
    margin-bottom: -1px
}

.cssButton div.cssButton3 {
    margin-top: -2px;
    margin-bottom: -2px
}

.cssButton div.cssButton4 { top: 1px }

.cssButton div.cssButtonText {
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    display: block;
    font-size: 120%;
    white-space: nowrap
}

.cssButton div.horizontalBorders {
    border-top-width: 1px;
    border-bottom-width: 1px
}

.cssButton div.verticalBorders {
    border-left-width: 1px;
    border-right-width: 1px
}

div.cssButtonHover div.cssButton0 {
    border-left-width: 2px;
    border-right-width: 2px
}

.cssButtonHover div.cssButton2 { padding: 0 1px }

div.cssButtonHover div.cssButton0 {
    border-left-width: 1px;
    border-right-width: 1px
}

.cssButtonHover div.cssButton2 { padding: 0 2px }

div.cssButtonHover div.cssButton0 {
    border-left-width: 2px;
    border-right-width: 2px
}

.cssButtonHover div.cssButton2 { padding: 0 1px }

.CssButtonDefault .buttonBorder1 { border-color: #aaa #777 #666 #aaa }

.CssButtonDefaultHover div.buttonBorder1 { border-color: #999 #6b6b6b #222 #999 }

.CssButtonDefault .buttonBorder2 { border-color: #e3e3e3 #e3e3e3 #bbb }

.CssButtonDefaultHover div.buttonBorder2 { border-color: silver silver #888 }

.CssButtonDefault .buttonBackground {
    background-color: #ddd;
    color: #222
}

.CssButtonDefaultDown div.buttonBackground { background-color: #aaa }

.CssButtonAdd .buttonBorder1 { border-color: #aaa #777 #666 #aaa }

.CssButtonAddHover div.buttonBorder1 { border-color: #999 #6b6b6b #222 #999 }

.CssButtonAdd .buttonBorder2 { border-color: #e3e3e3 #e3e3e3 #bbb }

.CssButtonAddHover div.buttonBorder2 { border-color: #cacaca #cacaca #888 }

.CssButtonAdd .buttonBackground {
    background-color: #ddd;
    color: #222
}

.CssButtonAddDown div.buttonBackground { background-color: #aaa }

.CssButtonAdd div.cssButtonText {
    padding: 5px 0 5px 20px;
    background-image: url(../CustomImages/plus.png);
    background-repeat: no-repeat;
    background-position: 5% 50%
}

.CssButtonBig .buttonBorder1 { border-color: #aaa #777 #666 #aaa }

.CssButtonBigHover div.buttonBorder1 { border-color: #999 #6b6b6b #222 #999 }

.CssButtonBig .buttonBorder2 { border-color: #e3e3e3 #e3e3e3 #bbb }

.CssButtonBigHover div.buttonBorder2 { border-color: #cacaca #cacaca #888 }

.CssButtonBig .buttonBackground {
    background-color: #ddd;
    color: #222
}

.CssButtonBigDown div.buttonBackground { background-color: #aaa }

.CssButtonBig div.cssButtonText { padding: 5px 0 }

.CssButtonGreyNext div.cssButtonText,
.CssButtonNext div.cssButtonText {
    padding: 5px 23px 5px 0;
    background-position: 95% 50%;
    background-repeat: no-repeat
}

.CssButtonNext .buttonBorder1 { border-color: #689042 #597b39 #597b39 }

.CssButtonNextHover div.buttonBorder1 { border-color: #48642e #4c6930 #364b22 #597b39 }

.CssButtonNext .buttonBorder2 { border-color: #76a44b }

.CssButtonNextHover div.buttonBorder2 { border-color: #6d9746 #6d9746 #5e833c }

.CssButtonNext .buttonBackground {
    color: #fff;
    background-color: #87bb56
}

.CssButtonNextDown div.buttonBackground { background-color: #49662f }

.CssButtonNext div.cssButtonText { background-image: url(../CustomImages/fastforward.png) }

.CssButtonNextHover div.cssButtonText { background-image: url(../CustomImages/fastforward2.gif) }

.CssButtonGreyNext .buttonBorder1 { border-color: #aaa #777 #666 #aaa }

.CssButtonGreyNextHover div.buttonBorder1 { border-color: #999 #6b6b6b #222 #999 }

.CssButtonGreyNext .buttonBorder2 { border-color: #cacaca #cacaca #bbb }

.CssButtonGreyNextHover div.buttonBorder2 { border-color: #b3b3b3 #b3b3b3 #888 }

.CssButtonGreyNext .buttonBackground {
    color: #222;
    background-color: #dcdcdc
}

.CssButtonGreyNextDown div.buttonBackground { background-color: #aaa }

.CssButtonGreyNext div.cssButtonText { background-image: url(../CustomImages/Icons/fastforward_grey.png) }

.CssButtonGreyNextHover div.cssButtonText { background-image: url(../CustomImages/Icons/fastforward_grey2.gif) }

.CssButtonGreyBack .buttonBorder1 { border-color: #aaa #777 #666 #aaa }

.CssButtonGreyBackHover div.buttonBorder1 { border-color: #999 #6b6b6b #222 #999 }

.CssButtonGreyBack .buttonBorder2 { border-color: #cacaca #cacaca #bbb }

.CssButtonGreyBackHover div.buttonBorder2 { border-color: #b3b3b3 #b3b3b3 #888 }

.CssButtonGreyBack .buttonBackground {
    color: #222;
    background-color: #dcdcdc
}

.CssButtonGreyBackDown div.buttonBackground { background-color: #aaa }

.CssButtonGreyBack div.cssButtonText {
    padding: 5px 0 5px 23px;
    background-image: url(../CustomImages/Icons/rewind_grey.png);
    background-repeat: no-repeat;
    background-position: 5% 50%
}

.CssButtonGreyBackHover div.cssButtonText { background-image: url(../CustomImages/Icons/rewind_grey2.gif) }

.Proxy {
    text-align: center;
    display: block;
    padding: 5px;
    width: 100%;
    top: 0;
    background: #990909;
    color: #e5e5e5;
    border-bottom: 2px solid #000;
    z-index: 1
}

.license_gvLicenses th { text-align: left }

.Proxy a:link,
.Proxy a:visited {
    font-weight: 700;
    color: #fff
}

body.sfPageEditor { background: #fff }

.license_gvLicenses td,
.license_gvLicenses th { padding: 4px }

.courses_gvLicenses {
    width: 100%;
    min-width: 660px
}

.courses_gvLicenses td { padding: 2px }

.courses_gvLicenses select { font-size: small }

.courses_gvLicenses [type=text] {
    height: 100%;
    padding: 0 1px
}

.cobrandOrderedCourses_gvOrdered * td,
.cobrandOrderedCourses_gvOrdered * th,
.cobrandTables * td,
.cobrandTables * th {
    padding: 0 3px;
    max-width: 210px;
    word-wrap: break-word
}

.cobrandCustomerProfilesTable { border-collapse: collapse }

.questionReviewQuestionWrapper label { width: 90% }

.tblPrelicense > tbody > tr > td { padding: 5px }

.invoiceBlock thead td {
    font-weight: 700;
    background-color: #ddd;
    padding: 2px
}

#ExamInfoTop {
    margin: auto;
    max-width: 705px;
}

.studentList td { background-color: #fff }

.prelicenseH1 {
    margin-top: 15px;
    margin-bottom: 15px;
    line-height: 1;
    font-size: 26px
}

.prelicenseH4 { font-size: 13px }

@media print {
    .main,
    .more-link a { border: none }

    .content { width: 100% }

    #back-top,
    .Broadcast,
    .panel-footer,
    .Proxy,
    .sidebar,
    .wrpLoginName { display: none }
}

body .sfContentBlock table,
body .sfContentBlock table td {
    border-top: none;
    border-left: none;
    border-right: none;
    border-bottom: none
}

body .sfContentBlock p { margin: 0 }

.page-header { border-bottom: 0 }

.PageTitle {
    text-align: center !important;
    color: white !important;
    font-size: 60px !important;
    font-weight: 600 !important;
    margin: 40px 0 50px !important;
    padding: 0px 20px !important;
    text-shadow: 0px 5px 5px rgba(0, 0, 0, 0.2) !important;
}

.ButtonShadow { box-shadow: 1px 2px 1px 1px rgba(0, 0, 0, 0.7) !important; }

.btn-lg {
    min-width: 250px !important;
    margin: 5px 20px 5px 20px !important;
    padding: 15px 60px !important;
}

@media only screen and (min-width: 400px) {
    .btn-lg-wrap {
        min-width: 250px !important;
        margin: 5px 20px 5px 20px !important;
        padding: 15px 60px !important;
        font-size: 18px;
        line-height: 1.3333333;
        white-space: normal;
        margin-left: 0px !important;
    }
}

@media only screen and (max-width: 399px) {
    .btn-lg-wrap {
        white-space: normal;
        font-size: 18px;
        line-height: 1.3333333;
        padding: 10px 16px;
        margin-left: 0px !important;
    }
}

/*<!-- Button flexbox container-- >*/

.btn-box {
    display: flex;
    flex-direction: row;
    margin: 30px 0px;
}

/*<!-- Individual button container horizontal padding-- >*/

.btn-box > div { padding: 0px 20px 0px 0px; }

/*<!-- Change btn-box direction to column & btn containers to pad vertically-- >*/

@media (max-width: 800px) {
    .btn-box { flex-direction: column; }

    .btn-box > div { padding: 0px 0px 34px 0px; }
}


.btn:disabled { cursor: default; }

.courseDescription ul {
    list-style: disc;
    display: block;
    padding-left: 40px;
    margin: 1em 0;
}


.courseDescription ol {
    list-style: decimal;
    display: block;
    padding-left: 40px;
    margin: 1em 0;
}

.courseDescription p {
    margin-top: 1em;
    margin-bottom: 1em;
}

.print fieldset {
    display: block !important;
    margin-left: 2px !important;
    margin-right: 2px !important;
    border: 2px groove !important;
    padding: .35em .75em .625em !important;
}

.rules ul {
    list-style: disc;
    display: block;
    padding-left: 40px;
    margin: 1em 0;
}

.ddlDisabled { background-color: #e0e0e0; }

.standard-rounded-border {
    border-style: solid;
    border-width: 2px;
    border-radius: 7px;
    padding: 15px;
}

.standard-rounded-border-light {
    border-style: solid;
    border-width: 1px;
    border-radius: 7px;
    padding: 15px;
}

.standardTable { margin: 0px 0 4px 10px; }

.standardTable th {
    padding: 2px 10px 2px 4px;
    font-weight: bold;
    font-size: 10pt;
}

.standardTable td {
    padding: 2px 8px;
    font-size: 10pt;
}

.standardTableAltRow { background-color: #EEEEEE; }

.standardButton {
    width: 100%;
    font-weight: bold;
}

.standard-required {
    color: red;
    font-weight: bold;
}

.standard-smalltext { font-size: 8pt; }

.standard-smallredtext {
    color: red;
    font-size: 8pt;
}

div.loader {
    display: block;
    margin-left: auto;
    margin-right: auto;
    margin-top: 15px;
    border-left: 6px solid #dadada;
    border-right: 6px solid #dadada;
    border-bottom: 6px solid #dadada;
    border-width: 6px;
    border-style: solid;
    border-radius: 50%;
    width: 50px;
    height: 50px;
    animation: spin 1.2s linear infinite;
}

@keyframes spin {
    0% { transform: rotate(0deg); }

    100% { transform: rotate(360deg); }
}

@media (max-width: 767px) {
    .text-xs-center { text-align: center; }

    .padding-xs-20 { padding: 20px; }

    .padding-xs-0 { padding: 0; }
}

@media (min-width: 768px) and (max-width: 992px) {
    .text-sm-center { text-align: center; }

    .padding-sm-20 { padding: 20px; }

    .padding-sm-0 { padding: 0; }
}


/*Privacy Policy CSS Start*/

.divOrderedList ol { list-style-type: decimal; }

.divOrderedList ol li { margin: 5px 5px 5px 25px; }

.divUnorderedList ul { list-style-type: disc; }

.divUnorderedList ul li { margin: 5px 5px 5px 25px; }

/*Privacy Policy CSS End*/

/*Login Refresh CSS Start*/

.link-button {
    text-decoration: none;
    display: inline-block;
    background: ButtonFace;
    color: ButtonText;
    background: white;
    float: none;
    padding: 7px 10px 7px 25px;
}

.link-button:hover { background-color: lightgoldenrodyellow; }

.circle-icon {
    background: #F3F3F3;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    text-align: center;
    line-height: 40px;
    vertical-align: middle;
    display: table-cell;
    float: left;
}

/*Login Refresh CSS End*/


/**************************
 * Blog Table of Contents 
***************************/

#toc_container {
    background: #f9f9f9 none repeat scroll 0 0;
    border: none;
    display: table;
    font-size: 85%;
    margin: 1em;
    padding: 20px;
    width: auto;
}

.toc_title {
    font-weight: 700;
    text-align: left;
    margin-bottom: 5px;
}

#toc_container li,
#toc_container ul,
#toc_container ul li {
    list-style: none outside none !important;
    padding-left: 0;
    line-height: 1.5;
}


/***********************
* This section was pulled from Layout_Transform in Sitefinity
************************/

@media
only screen and (-moz-min-device-pixel-ratio: 2),
only screen and (-o-min-device-pixel-ratio: 2/1),
only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and (min-device-pixel-ratio: 2),
only screen and (min-width: 240px) and (max-width: 320px),
only screen and (min-width: 320px) and (max-width: 480px),
only screen and (min-width: 480px) and (max-width: 960px) {
    .sfPublicWrapper { width: auto !important; }
}


/***********************
* Navigation Styles Start
************************/

.main-nav-2022 {
    margin: 0px 0px 0px 0px;
    z-index: 990;
    border-radius: 0px 0px 0px;
    -webkit-box-shadow: 0 1px 5px 1px rgba(214, 214, 214, 1);
    box-shadow: 0 1px 5px 1px rgba(214, 214, 214, 1);
    border-left: 0px;
    border-right: 0px;
    position: sticky;
    top: 0;
}

.sfPageEditor .main-nav-2022 { position: static; }

.main-nav-2022 .navbar { margin-bottom: 0; }

.main-nav-2022 .navbar ul.menu {
    padding: 0px;
    margin: 0px !important;
    float: right;
    list-style: none;
    display: flex;
    align-items: center;
}

.main-nav-2022 .navbar ul.menu li {
    float: left;
    margin: 27px 0px;
    border-bottom: 5px solid #fff;
    position: relative;
}


.main-nav-2022 .navbar ul.menu #cart a {
    padding-left: 0px;
    padding-right: 5px
}

.main-nav-2022 .navbar ul.menu li a {
    font-size: 14.19px;
    text-transform: uppercase;
    font-weight: 700;
    padding: 10px 23px;
    display: block;
}

.main-nav-2022 .navbar ul.menu li .cart-item {
    font-size: 14.19px;
    text-transform: uppercase;
    font-weight: 700;
    padding: 10px 23px;
    display: block;
}

.dropdown-cart {
    position: absolute !important;
    border: 1px solid #ccc !important;
}


.cart-item::after { content: none !important; }

.main-nav-2022 .navbar ul.menu li a .glyphicon { margin-left: 10px; }

/*Dropdown Stylings*/

.main-nav-2022 .navbar .dropdown a::after {
    right: 7px;
    font-size: 12px;
    content: "\f107";
    position: absolute;
    display: inline-block;
    font: var(--fa-font-solid);
}

.main-nav-2022 .navbar .dropdown .open {margin-top: 15px !important;}

.main-nav-2022 .navbar #cart.dropdown a::after {
    font-size: 12px;
    content: none;
    position: absolute;
    display: inline-block;
    font: var(--fa-font-solid);
}

.main-nav-2022 .navbar .dropdown-menu-item {
    margin: 0px !important;
    float: none !important;
}

.main-nav-2022 .navbar .dropdown-menu-item a::after { content: none; }

/*Cart Summary Dropdown Stylings*/

.cartSummary {
    font-family: 'Roboto', sans-serif !important;
    padding: 0px !important;
}

    .cartSummary a:after {
        content: none !important;
    }

.cartSummarySection {
    width: 165px !important;
    padding: 20px 10px 2px !important;
    text-align: center !important;
    position: absolute;
}

/*Account Button Stylings*/

.main-nav-2022 .navbar ul.account-button.menu li a {
    border-radius: 25px;
    color: white !important;
}

.main-nav-2022 .navbar ul.account-button.menu li a::after { content: ""; }

.main-nav-2022 .navbar ul.account-button.menu li a .glyphicon {
    border-radius: 25px;
    color: white !important;
}

/*Navbar Toggle Stylings*/

.main-nav-2022 .navbar-toggle { margin-top: 22px; }

.main-nav-2022 .navbar-toggle .icon-bar {
    width: 26px;
    height: 4px;
    background: #004b71;
}

.main-nav-2022 .navbar-toggle .icon-bar + .icon-bar { margin-top: 5px; }

.main-nav-2022 .navbar-toggle .icon-bar:hover, button.navbar-toggle:hover .icon-bar { background: #7bc240; }

/*Navbar Search Stylings*/

.main-nav-2022 .navbar ul.menu .liSearch {
    display: flex;
    align-items: center;
    cursor: pointer;
    transition: all .3s ease .6s;
    margin-top: 33px;
    margin-left: 10px;
    font-size: 12px;
    float: right;
}

.main-nav-2022 .navbar ul.menu .liSearch:hover { border: none; }

.main-nav-2022 .navbar .liSearch a.liSearchIcon {
    padding: 5px 5px;
    color: #757575;
}

.main-nav-2022 .btnSiteSearch {
    border: none;
    background: none;
}

.main-nav-2022 .divSearchContainer {
    display: inherit;
    padding: 5px 5px;
    border-radius: 25px;
    /*background: #f5f5f5;*/
    margin-top: -4px;
}

.main-nav-2022 .search-input { display: none; }


.main-nav-2022 .pnlSearch { display: inherit; }

/*Navbar Contact Stylings*/

.main-nav-2022 .navbar ul.menu .liContact {
    display: flex;
    align-items: center;
    cursor: pointer;
    transition: all .3s ease .6s;
    margin-top: 33px;
    margin-left: 10px;
    font-size: 12px;
    float: right;
}

.main-nav-2022 .navbar ul.menu .liContact:hover { border: none; }

.main-nav-2022 .navbar .liContact a.liContactIcon {
    padding: 5px 5px;
    color: #757575;
}

.main-nav-2022 .btnContactSearch {
    border: none;
    background: none;
}

.main-nav-2022 .divContactContainer {
    display: contents;
    padding: 3px 6px 2px 2px;
    border-radius: 25px;
    margin-top: -4px;
}

.main-nav-2022 .navbar ul.menu .divContactContainer > a { padding: 10px 5px; }

.main-nav-2022 .pnlContact { display: inherit; }

/*SubMenu Stylings*/

.main-nav-2022 .navbar ul.menu li ul.sub-menu {
    display: none;
    list-style: none;
    margin: 0px;
    padding: 0px;
    position: absolute;
    top: 99px;
    right: 0px;
    background: #fff;
    min-width: 200px;
    z-index: 222;
}

.main-nav-2022 .navbar ul.menu li ul.sub-menu li {
    float: none;
    padding: 0px 0px;
    border-bottom: 0px;
    border-top: 1px solid #d3d3d3;
}

.main-nav-2022 .navbar ul.menu li .sub-menu li a { color: #3a3a3a; }

.main-nav-2022 .parent .sub-menu {
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s !important;
    max-height: 0 !important;
    display: block !important;
    overflow: hidden !important;
    opacity: 0 !important;
}

.main-nav-2022 .parent:hover .sub-menu {
    max-height: 500px !important;
    opacity: 1 !important;
}

.main-nav-2022 .navbar-collapse ul.menu li .parent .sub-menu {
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s !important;
    max-height: 0 !important;
    display: block !important;
    overflow: hidden !important;
    opacity: 0 !important;
}

.main-nav-2022 .navbar-collapse ul.menu li .parent:hover .sub-menu {
    max-height: 500px !important;
    opacity: 1 !important;
}

/*Hamburger menu stylings*/

.hamburgerBar {
    width: 23px;
    height: 3px;
    background-color: #004b71;
    margin: 5px 0;
    border-radius: 10px;
}

.hamburgerBar.cross1 { transform: rotate(-45deg) translate(-2px, 3px); }

.hamburgerBar.cross2 { transform: rotate(45deg) translate(-2px, -4px); }


/*Navbar Collapse Stylings*/

.main-nav-2022 .navbar-collapse.in { overflow-y: visible; }


/*768 for XS, 992 for SM+XS in Bootstrap3*/

/* Added custom size here since bootstrap default stops at "lg" */

@media (min-width: 1248px) {
    .hidden-xxl { display: none !important; }
    .main-nav-2022 .navbar ul.menu {
        width: auto;
    }
    .mobile-header-nav {
        margin-top: 0;
    }

    .margin-for-nav {margin-top: 0;}
}

/* UPDATE: Changed from 992 to custom 1382 so that the current WebCE menu fits on one line or collapses. This can be scaled down when we reduce the content in our menu */

@media (max-width: 1248px) {
    .main-nav-2022 .navbar-header { float: none; }
    
    .margin-for-nav {
        margin-top: 22px;
    }
    .main-nav-2022 .navbar-nav {
        float: none !important;
        margin: 7.5px -15px;
    }

    .mobile-header-nav {
        margin-top: 20px;
    }

    .main-nav-2022 .navbar-toggle { color: #004b71; }

    .main-nav-2022 .navbar-toggle.collapsed .fa-xmark { display: none; }

    .main-nav-2022 .navbar-toggle.collapsed .fa-times { display: none; }

    .main-nav-2022 .navbar-toggle.collapsed .menu-bars { display: block; }

    .main-nav-2022 .navbar-toggle.collapsed .fa-bars { display: block; }

    .main-nav-2022 .navbar-toggle.collapsed .menu-cross { display: none; }

    .main-nav-2022 .navbar-toggle .fa-bars { display: none; }

    .main-nav-2022 .navbar-toggle .menu-bars { display: none; }

    .main-nav-2022 .navbar-header { float: none; }

    .main-nav-2022 .navbar-nav > li { float: none; }

    .main-nav-2022 .navbar-nav > li > a {
        padding-top: 10px;
        padding-bottom: 10px;
    }

    .main-nav-2022 .navbar-text {
        float: none;
        margin: 15px 0;
    }

    .main-nav-2022 .navbar ul.menu {
        padding: 0px;
        margin: 0px !important;
        float: none;
        list-style: none;
        width: -webkit-fill-available;
    }

    .main-nav-2022 .navbar ul.menu li {
        float: none;
        margin: 0px 0px;
        position: relative;
        text-align: left;
        width: 100%;
    }

    .main-nav-2022 .navbar ul.menu li a {
        padding: 14px 20px;
        width: max-content;
        position: relative;
    }


    /*Searchbar Styling Overrides*/
    .main-nav-2022 .navbar ul.menu .liSearch {
        display: flex;
        align-items: center;
        cursor: pointer;
        transition: all .3s ease .6s;
        margin-top: 33px;
        margin-left: 10px;
        font-size: 12px;
        float: none;
        width: 100%;
    }

    .main-nav-2022 .navbar ul.menu .liSearch .pnlSearch { margin: auto; }

    .main-nav-2022 .divSearchContainer {
        display: inherit;
        padding: 3px 6px 2px 2px;
        border-radius: 25px;
        background: #f5f5f5;
        margin-top: -4px;
    }

    .main-nav-2022 .search-input {
        font-size: inherit;
        line-height: 25px;
        border: 0;
        display: block;
        font-family: inherit;
        color: #757575;
        margin: 0 0 0 10px;
        line-height: 20px;
        background: transparent;
        padding: 2px;
    }

    .main-nav-2022 .navbar .dropdown a::after {position: fixed;}

    /*Contact Button Styling Overrides*/
    .main-nav-2022 ul.contact-button.menu { display: flex; }

    /*Account Button Styling Overrides*/
    .main-nav-2022 ul.account-button.menu { display: none; }

    /*Navbar Toggle Overrides*/
    .main-nav-2022 .navbar-toggle { display: block; }

    /*Navbar Collapse Overrides*/
    .main-nav-2022 .navbar-collapse {
        border-top: 1px solid transparent;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
        padding: 0;
    }

    .main-nav-2022 .navbar-collapse,
    .main-nav-2022 .navbar-collapse.collapse,
    .main-nav-2022 .navbar-collapse.in,
    .main-nav-2022 .navbar-collapse.collapsing {
        max-height: 100vh !important;
    }

    .main-nav-2022 .navbar-collapse.collapse { display: none !important; }

    .main-nav-2022 .navbar-collapse.collapse.in { display: block !important; width: auto; }

    .main-nav-2022 .collapsing { overflow: hidden !important; }

    /*SM Nav Links Stylings*/
    .main-nav-2022 .navbar ul.menu.sm-nav-links {
        float: none;
        display: inline-block
    }

    .main-nav-2022 .navbar ul.menu.sm-nav-links li { text-align: center; }

    .main-nav-2022 .navbar ul.menu.sm-nav-links li a {
        width: 50%;
        display: inline-block
    }

    /*Dropdown Overrides*/
    .main-nav-2022 .navbar ul.menu ul.dropdown-menu {
        position: absolute;
        float: none;
        margin-top: 0;
        background-color: transparent;
        border: 0;
        -webkit-box-shadow: none;
        box-shadow: none;
    }
}


@media (max-width: 768px) {
    .main-nav-2022 .navbar-header { padding: 0px 20px; }

    .main-nav-2022 .navbar-toggle {
        margin-right: 0px;
    }

    .main-nav-2022 .dropdown-backdrop { z-index: 0 !important; }
}

@media (max-width: 541px) {
    .main-nav-2022 .navbar-header {padding: 0;}
}

#logo {
    display: inline-block;
    margin: 30px 0px;
    position: relative;
    z-index: 101;
    max-width: 140px;
}

@media (min-width: 769px) {
    #logo { max-width: 220px; }
}

/***********************
* Navigation Styles End
************************/

/***********************
* Notification Styles Start
************************/

.notification-widget .dropdown .dropdown-menu a::after { content: none; }

.notification-widget .dropdown .dropdown-menu { min-width: 350px; }

.notification-widget .dropdown .dropdown-menu li a::after { content: none; }

.notification-widget .dropdown .dropdown-menu a:hover { text-decoration: none; }

.notification-widget .dropdown .dropdown-menu a::after { content: none; }

.notificationMenuToggle::after { content: none !important; }

.notificationMenuToggle {
    color: #757575 !important;
    padding: 0 6px 0 6px !important;
    white-space: nowrap;
    color: #757575;
}
.dropdown .open {
    position:fixed;
}
.dropdown.open #notificationMenuToggle { background-color: #ffffff; }

.notification-widget div.dropdown ul.dropdown-menu a {
    color: #757575 !important;
    font-size: medium;
    padding: initial;
    font-weight: initial;
    text-transform: initial;
}

.notification-widget div.dropdown ul.dropdown-menu li {
    float: initial;
    border-bottom: initial;
}

.notification-widget div.dropdown ul.dropdown-menu li.dropdown-menu-item { cursor: pointer; }

.notification-widget div.dropdown ul.dropdown-menu li.dropdown-menu-item:hover { background-color: #f5f5f5 }

.notification-widget .dropdown-menu-item { padding: 10px 25px; }

@media (max-width: 1248px) {
    .notification-widget {
        margin-top: 15px;
        margin-bottom: 20px
    }
}

@media (min-width: 1249px) {
    .notification-widget {
        margin-top: 35px;
        margin-bottom: 40px;
    }
}


.notification-item {
    border-bottom: 2px solid gray;
    cursor: pointer;
    padding: 5px 10px;
}

    .notification-item:hover {
        background-color: #cacfd2;
    }


.notification-inbox-title {
    text-align: center;
    margin-bottom: 10px;
    height: 300px;
    width: 100vw;
    display: table-cell;
    vertical-align: middle;
    background-image: url("/ImageAssets/Photos/3messages-background.png?v=638829116400000000");
    background-size: cover;
}

.notification-inbox {
    border: 2px solid black;
    margin-top: 30px;
}

.notification-inbox ul { margin: 0 !important; }

.notification-inbox li { border-bottom: 2px solid black; }

.notification-list { padding-left: 0px; }

.notification-display { padding-top: 10px; }

.notification-inbox-title h1, .notification-inbox-title h3 {
    color: white;
}

/***********************
* Notification Styles End
************************/