/* This is my common style section */

/* NOTE: All color related items at bottom of this file */

    body {
        font-family: Verdana,Arial,Helvetica,sans-serif;
        font-size: 16px;
    }

    .middle-part {
        min-height: 500px;
        padding: 15px 15px;
    }
    
    .SectionContainer {
        box-shadow: 0 1px 20px rgba(0,0,0,0.2);
        margin: 0 auto;
        width: 980px;
        padding: 20px;
        box-sizing: border-box;
    }
    .SectionContainer2 {
        box-shadow: 0 1px 20px rgba(0,0,0,0.2);
        margin: 0 auto;
        padding: 20px;
        box-sizing: border-box;
    }

    .SectionArea {
        margin-left: 20px;
        margin-right: 20px;
        margin-top: 10px;
        margin-bottom: 10px;
    }

    .SectionArea p {
        font-size: 16px;
    }

    .SectionArea ul {
        font-size: 16px;
    }

    .SectionWell,
    .AuthorWell,
    .SeminarWell,
    .UpsellWell {
        padding: 20px;
        border-radius: 16px;
        text-align: left;
        font-size: 16px;
        margin-bottom: 0px;
    }

    .AuthorSectionWellWhiteBG {
        background-color: #ffffff !important;
    }
    
    .SectionBorder {
        border-image: none;
    }

    .SectionTitle {
        font-size: 24px;
        font-weight: bold;
        text-align: center;
    }

    .SectionTitle1 {
        font-weight: bold;
        font-size: 20px;
    }

    .SectionTitle2 {
        font-weight: bold;
        font-size: 16px;
    }

    .SectionBody {
        font-size: 16px;
    }

    .nav-tabs > li > a {
        font-size: 16px;
    }


    /* Custom bullerted list - see bulleted list - style 3 */
    .imgBulletClass {
        background-repeat: no-repeat;
    }

    .BulletWell {
        border-radius: 6px;
        background-color: #fFFAEE;
        padding-top: 15px;
        padding-bottom: 10px;
        padding-left: 20px;
        padding-right: 20px;
    }

    .BulletList {
        list-style: none;
        padding-left: 0;
    }

    .BulletList li {
        position: relative;
        padding-left: 25px;
        padding-right: 5px;
        padding-top: 2px;
        padding-bottom: 2px;
        overflow: auto;
    }

/*    .BulletList li:before {
        content: '';
        width: 20px;
        height: 20px;
        position: absolute;
        background-size: cover;
        background-position: center;
        left: 0;
        top: 50%;
        transform: translateY(-50%);
    }*/


    .VideoContainer {
        position: relative;
        margin-top: 20px;
        padding-bottom: 53%;
        padding-top: 35px;
        height: 0;
    }

        .VideoContainer iframe {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
        }

    .Testimonial h2 {
        margin-bottom: 5px;
    }

    .TestimonialTitle {
        font-size: 24px;
        font-weight: bold;
        text-align: center;
        padding: 10px;
    }

    .TestimonialBody {
        padding: 15px;
    }

    .TestimonialImage {
        border-radius: 100%;
        padding-right: 15px;
        float: left;
    }

    .TestimonialInfo-1 {
        font-style: italic;
    }

    .TestimonialInfo-2 {
        font-weight: bold;
    }


    .EmailFormArea {
        margin-left: 10px;
        padding: 30px;
    }

    .EmailFormImg {
        max-width: 200px;
    }


    .SqueezeWell {
        background-color: #ffffff !important;
    }
    
    .SqueezeImg {
        max-width: 300px;
    }

    .SqueezeBlock {
        background-color: #eeeeee;
        border-radius: 16px;
        margin: 20px;
        padding: 10px;
        display: inline-block;
    }


    .FeaturedItemBlock {
        background-color: #eeeeee;
        border-radius: 16px;
        padding: 10px;
        min-height: 250px;
    }

    .FeaturedItemImg {
        display: block;
        margin-left: auto;
        margin-right: auto;
        width: 50%;
        font-size: 48px;
    }

    .FeaturedItemImgBg {
        width: 60px;
        height: 60px;
        text-align: center;
        padding-top: 10px;
        font-size: 36px;
    }


    .BlogImg {
        padding-bottom: 10px;
    }


    .FooterText {
        font-size: 12px;
    }


    .btn {
        padding: 10px 12px;
        font-size: 16px;
        line-height: 1.42857143;
        min-width: 160px;
        text-align: center;
        border-radius: 0;
        text-transform: uppercase;
        margin: 10px 0;
        -webkit-transition: all 0.2s ease-in-out;
        -o-transition: all 0.2s ease-in-out;
        transition: all 0.2s ease-in-out;
        display: inline-block;
        font-weight: normal;
        white-space: normal;
        vertical-align: middle;
        -ms-touch-action: manipulation;
        touch-action: manipulation;
        cursor: pointer;
        background-image: none;
        border: 1px solid transparent;
        border-top-color: transparent;
        border-right-color: transparent;
        border-bottom-color: transparent;
        border-left-color: transparent;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
    }

    .btn-lg,
    .btn-group-lg > .btn {
        padding: 10px 16px;
        font-size: 18px;
        line-height: 1.3333333;
        border-radius: 6px;
    }

    .btn.btn-lg {
        min-width: 300px;
        overflow-wrap:break-word;
    }
    .light-translucent-bg {
        background-size: auto auto;
        z-index: 1;
        position: relative;
    }

    .parallax-bg-3 {
        background: url("https://cdn.pesi.com/images/shared/misc/parallax-bg-3.jpg") 50% 0px no-repeat; /* 1920px x 1275px */
    }

    .parallax {
        padding: 50px 0;
        background-attachment: fixed !important;
    }


    /* General definitions */
    .centerImg, .CenterImg {
        display: block;
        margin-left: auto;
        margin-right: auto;
    }

    .left { text-align: left; }
    .right { text-align: right; }
    .center { text-align: center; }

    .ma5 { margin: 5px; }
    .ma10 { margin: 10px; }
    .ma15 { margin: 15px; }
    .ma20 { margin: 20px; }
    .ma30 { margin: 30px; }
    
    .ml5 { margin-left: 5px; }
    .ml10 { margin-left: 10px; }
    .ml15 { margin-left: 15px; }
    .ml20 { margin-left: 20px; }
    .ml30 { margin-left: 30px; }

    .mr5 { margin-right: 5x; }
    .mr10 { margin-right: 10px; }
    .mr15 { margin-right: 15px; }
    .mr20 { margin-right: 20px; }
    .mr30 { margin-right: 30px; }

    .mt5 { margin-top: 5px; }
    .mt10 { margin-top: 10px; }
    .mt15 { margin-top: 15px; }
    .mt20 { margin-top: 20px; }
    .mt30 { margin-top: 30px; }

    .mb5 { margin-bottom: 5px; }
    .mb10 { margin-bottom: 10px; }
    .mb15 { margin-bottom: 15px; }
    .mb20 { margin-bottom: 20px; }
    .mb30 { margin-bottom: 30px; }

    .pa5 { padding: 5px; }
    .pa10 { padding: 10px; }
    .pa15 { padding: 15px; }
    .pa20 { padding: 20px; }
    .pa30 { padding: 30px; }

    .pt5 { padding-top: 5px; }
    .pt10 { padding-top: 10px; }
    .pt15 { padding-top: 15px; }
    .pt20 { padding-top: 20px; }
    .pt30 { padding-top: 30px; }
    
    .pb5 { padding-bottom: 5px; }
    .pb10 { padding-bottom: 10px; }
    .pb15 { padding-bottom: 15px; }
    .pb20 { padding-bottom: 20px; }
    .pb30 { padding-bottom: 30px; }

    .pl5 { padding-left: 5px; }
    .pl10 { padding-left: 10px; }
    .pl15 { padding-left: 15px; }
    .pl20 { padding-left: 20px; }
    .pl30 { padding-left: 30px; }
    
    .pr5 { padding-right: 5px; }
    .pr10 { padding-right: 10px; }
    .pr15 { padding-right: 15px; }
    .pr20 { padding-right: 20px; }
    .pr30 { padding-right: 30px; }

    
    .font6 { font-size: 6px; }
    .font8 { font-size: 8px; }
    .font10 { font-size: 10px; }
    .font12 { font-size: 12px; }
    .font14 { font-size: 14px; }
    .font16 { font-size: 16px; }
    .font18 { font-size: 18px; }
    .font20 { font-size: 20px; }
    .font22 { font-size: 22px; }
    .font24 { font-size: 24px; }
    .font28 { font-size: 28px; }
    .font30 { font-size: 30px; }
    .font32 { font-size: 32px; }
    .font36 { font-size: 36px; }
    .font40 { font-size: 40px; }
    .font44 { font-size: 44px; }
    .font48 { font-size: 48px; }
    .font50 { font-size: 50px; }


    .Call2Action {
        display: block;
        max-width: 300px;
        margin-left: auto;
        margin-right: auto;
    }

    .LeftCol {
        margin-left: 0 !important;
    }

    .RightCol {
        margin-right: 0 !important;
        float: right !important;
    }

    .blog-subtitle {
        font-size: 14px;
    }


    /* Screen size adjustments */
    @media screen and (max-width: 768px) {
        .Call2Action {
            max-width: 50%
        }

/*        .SectionArea {
            display: -webkit-box;
            display: -moz-box;
            display: -ms-flexbox;
            display: -webkit-flex;
            display: flex;
            -webkit-flex-flow: row wrap;
            -moz-flex-flow: row wrap;
            -ms-flex-flow: row wrap;
            flex-flow: row wrap;
        }*/

        .LeftCol {
            order: 2;
            -webkit-order: 2;
            -moz-order: 2;
            -ms-order: 2;
            margin-right: 0 !important;
        }

        .RightCol {
            order: 1;
            -webkit-order: 1;
            -moz-order: 1;
            -ms-order: 1;
            margin-left: 0 !important;
        }

        .LeftCol,
        .RightCol {
            width: 100% !important;
            float: none !important;
        }

        .btn.btn-lg {
            min-width: 80%;
        }

        #mainwrapper > .container {
            width: 100%;
            margin: 0;
            padding: 0;
        }
        
        #mainwrapper .middle-part {
            margin: 0;
            max-width: 100%;
        }

        #mobileFooter .SectionArea {
            margin-left: 0;
            margin-top: 10px;
            margin-bottom: 10px;
            margin-right: 10px;
        }
    }

    @media screen and (max-width: 480px) {
        .Call2Action {
            max-width: 75%
        }

        .btn.btn-lg {
            min-width: 100%;
        }
    }



    /* General color definitions */
    .Red, .red { color: #B42025; }
    .Orange, .orange { color: #D4560D; }
    .Green, .green { color: #73966C; }
    .Pink, .pink { color: #B84F6D; }
    .Blue, .blue { color: #5A657C; }
    .PESIBlue, .pesiblue { color: #006699; }
    .Teal, .teal { color: #56938b; }
    .Gray, .gray { color: #666666; }
    .White, .white { color: #ffffff; }
    .Black, .black { color: #000000; }
    .LtBlack, .ltblack { color: #333333; }
    .LtWhite, .ltwhite { color: #F1F1F1; }

    .TanBackground {
        background-color: #FDF6E9;
    }

    .RedBackground {
        background-color: #B42025;
        color: #ffffff;
    }

    .OrangeBackground {
        background-color: #D4560D;
        color: #ffffff;
    }

    .GreenBackground {
        background-color: #73966C;
        color: #ffffff;
    }

    .PinkBackground {
        background-color: #B84F6D;
        color: #ffffff;
    }

    .PesiBlueBackground {
        background-color: #006699;
        color: #ffffff;
    }

    .BlueBackground {
        background-color: #5A657C;
        color: #ffffff;
    }

    .TealBackground {
        background-color: #56938b;
        color: #000000;
    }

    .LtGrayBackground {
        background-color: #F1F1F1;
    }

    .GrayBackground {
        background-color: #EFF5FF;
    }

    .WhiteBackground {
        background-color: #ffffff;
    }

    .BlackBackground {
        background-color: #000000;
    }

    .LtWhiteBackground {
        background-color: #EDF1EA;
    }

        

    /* Default 'Blue' color scheme to which can be overridden for selecting one of the color_????.css files */
    .SectionWell {
        background-color: #FDF6E9;
    }

    .SectionBorder {
        border: dashed #B5420B;
    }

    .SectionTitle {
        color: #006699;
    }
/*
    .light-translucent-bg {
        color: #333333;
        border-bottom: 1px solid #dadada;
    }
*/

    /* Button color settings */
    .btn-default:hover,
    .btn-default:focus,
    .btn-default:active,
    .btn-default.active,
    .open .dropdown-toggle.btn-default {
        color: #ffffff !important;
        background-color: #cd3c2e;
        border-color: #cd3c2e;
    }

    .btn-default {
        background-color: #e84c3d;
        color: #ffffff !important;
        border-color: #cd3c2e;
    }


    /* Horizontal line color settings */
    .HRLineBackground {
        background-color: #006699;
    }

    .HRLine1 { height: 1px; }
    .HRLine2 { height: 2px; }
    .HRLine3 { height: 3px; }
    .HRLine4 { height: 4px; }
    .HRLine5 { height: 5px; }
    .HRLine6 { height: 6px; }
    .HRLine7 { height: 7px; }
    .HRLine8 { height: 8px; }
    .HRLine9 { height: 9px; }
    

    /* Slider color settings */
    .SliderBackground {
        background-color: #ffffff;
    }
    
    .SliderDefaultText {
        color: #4e5b5e;
        background-color: #ffffff;
    }
    
    .SliderTitleText {
        color: #006699;
        background-color: #ffffff;
    }
    
    .SliderSubtitleText {
        color: #006699;
        background-color: #ffffff;
    }
    
    .SliderReverseText {
        color: #ffffff;
        background-color: #4e5b5e;
    }
    
        
    .slider_bg {
        color: #4e5b5e;
        background-color: #ffffff;
    }

    .slider_text_lt_bg {
        color: #4e5b5e;
        background-color: #ffffff;
    }

    .slider_text_drk_bg {
        color: #006699;
        background-color: #ffffff;
    }

    .slider_text_spc_bg {
        color: #e1e1e1;
        background-color: #006699;
    }


    /* Author color settings */
    .AuthorBackground {
        background-color: #ffffff;
    }

    .AuthorTitle {
        color: #006699;
    }

    .AuthorBody {
        color: #333333;
    }


    /* Testimonial color settings */
    .TestimonialBackground {
        background-color: #ffffff;
    }

    .TestimonialBlock {
        min-height: 220px;
    }

    .TestimonialTitle {
        color: #006699;
    }

    .TestimonialBody {
        color: #333333;
    }


    /* Training For color settings */
    .TrainingForBackground {
        background-color: #ffffff;
    }

    .TrainingForBody {
        color: #333333;
    }


    /* Bonus color settings */
    .BonusBackground {
        background-color: #ffffff;
    }

    .BonusTitle {
        color: #006699;
    }

    .BonusIntro {
        color: #B54208;
    }

    .BonusBody {
        color: #333333;
    }


    /* Call To Action color setting */
    .CallToActionBackground {
        background-color: #EFF5FA;
    }

    .CallToActionTitle {
        color: #666666;
    }

    .CallToActionValue {
        color: #666666;
    }

    .CallToActionPrice {
        color: #B54208;
    }


    /* Certificate of Completion color settings */
    .CertificateCompletionBackground {
        background-color: #ffffff;
    }

    .CertificateCompletionTitle {
        color: #006699;
    }

    .CertificateCompletionBody {
        color: #333333;
    }


    /* Certificate Module color settings */
    .CertificateModuleBackground {
        background-color: #ffffff;
    }

    .CertificateModuleTitle {
        color: #006699;
    }

    .CertificateModuleTitle2 {
        color: #666666;
    }

    .CertificateModuleHighlight {
        color:#b91921;
    }


    /* Module color settings */
    .ModuleBackground {
        background-color: #ffffff;
    }

    .ModuleTitle {
        color:#006699;
    }

    .ModuleDescription {
        color: #333333;
    }

    .ModuleText {
        color: #333333;
    }

    .ModuleHighlight {
        color: #006699;
    }


    /* Next Steps color settings */
    .NextStepsBackground {
        background-color: #ffffff;
    }

    .NextStepsTitle {
        color: #006699;
    }

    .NextStepsText {
        color: #666666;
    }


    /* Parallax color settings */
    .ParallaxBackground {
        color: #333333;
        border-bottom: 1px solid #dadada;
    }

    .ParallaxTitle {
        color: #333333;
    }

    .ParallaxText {
        color: #333333;
    }

    .ParallaxPrice {
        color: #b91921;
    }


    /* Satisfaction guarantee color settings */
    .SatisfactionGuaranteeBackground {
        background-color: #ffffff;
    }

    .SatisfactionGuaranteeTitle {
        color: #006699;
    }

    .SatisfactionGuaranteeText {
        color: #333333;
    }



    .box-style-1:not(.team-member):hover i {
        color: #e84c3d;
    }

    .box-style-2 .RedBackground {
        color: #ffffff;
    }

    .box-style-2:hover .RedBackground {
        background-color: #ffffff;
        border: 1px solid #e84c3d;
    }

    .box-style-2:hover .RedBackground * {
        color: #e84c3d;
    }

    .social-links {
        list-style: none;
        font-size: 0;
        padding: 0;
        margin: 20px 0 20px 0;
    }
    
    .circle {
        -webkit-border-radius: 100%;
        -moz-border-radius: 100%;
        border-radius: 100%;
    }


    /* Collapsible text section */
    /* Style the button that is used to open and close the collapsible content */
    .SectionCollapsible .collapsible {
        background-color: #eee;
        color: #444;
        cursor: pointer;
        padding: 18px;
        width: 100%;
        border: none;
        text-align: left;
        outline: none;
        font-size: 15px;
    }

    /* Add a background color to the button if it is clicked on (add the .active class with JS), and when you move the mouse over it (hover) */
    .SectionCollapsible .active, .SectionCollapsible .collapsible:hover {
        background-color: #ccc;
    }

    /* Style the collapsible content. Note: hidden by default */
    .SectionCollapsible .content {
        padding: 0 18px;
        display: none;
        overflow: hidden;
        background-color: #f1f1f1;
    } 

    .SectionCollapsible .collapsible:after {
        content: '\02795'; /* Unicode character for "plus" sign (+) */
        font-size: 13px;
        color: white;
        float: right;
        margin-left: 5px;
    }

    .SectionCollapsible .active:after {
        content: "\2796"; /* Unicode character for "minus" sign (-) */
    }
    

    /* Testimonial - Style 3 section */
    .Testimonial3 { text-align: center; padding: 20px 70px 20px 70px; }
    .Testimonial3 h3 { font-size: 35px; font-weight: 900; margin-bottom: 70px; }
    .Testimonial3 .Quote { padding: 115px 20px 30px 20px; position: relative; line-height: 1.6; }
    .Testimonial3 .Quote .Quote-Text { min-height: 120px; }
    .Testimonial3 .Quote:before { position: absolute; top: 45px; right: 0; left: 0; margin: auto; background-repeat: no-repeat; background-position: top center; content: ""; width: 41px; height: 36px; }
    .Testimonial3 .Quote h6 { font-weight: 700; font-size: 18px; padding: 20px 0 20px; }
    .Testimonial3 .Quote .Quote-Footer { border-top: dashed 2px #ebebeb; padding: 20px 0 0; }
    .Testimonial3 .Quote .Quote-Footer a { font-weight: 700; }
    .Testimonial3 .Quote .Quote-Footer a i { margin-right: 10px; }
    .Testimonial3 .owl-carousel.owl-drag .owl-item { padding-bottom: 10px; }
    .Testimonial3 .owl-theme .owl-dots { margin-top: 45px; }
    .Testimonial3 .owl-theme .owl-nav { margin-top: 0; }
    .Testimonial3 .owl-carousel .owl-nav button.owl-prev { position: absolute; left: -70px; top: 40%; font-size: 0; }
    .Testimonial3 .owl-carousel .owl-nav button.owl-prev:before { background: url('//s3.amazonaws.com/email.pesi.com/landing_page/bh/arrow.png'); background-repeat: no-repeat; background-position: left; content: ""; width: 20px; height: 34px; display: block; }
    .Testimonial3 .owl-carousel .owl-nav button.owl-next { position: absolute; right: -70px; top: 40%; display: block; font-size: 0; }
    .Testimonial3 .owl-carousel .owl-nav button.owl-next:before { background: url('//s3.amazonaws.com/email.pesi.com/landing_page/bh/arrow.png'); background-repeat: no-repeat; background-position: right; content: ""; width: 20px; height: 34px; display: block; }
    .Testimonial3 .owl-carousel .owl-nav button.owl-prev:hover, .testimonial3 .owl-carousel .owl-nav button.owl-next:hover { background: none; }



/* End of my style section */
