/* -------------------------------------------------------------------------------------------------------
Content
------------------------------------------------------------------------------------------------------- */

body,
p,
.paragraph {
    color: #959595
    /*Change this color code to set the paragraph text and body text color*/
}
h1,
h2,
h3,
h4,
h5,
h6,
#wsite-content h2 {
    color: #757575
    /*Change this color code to set the title color of all headers*/
}
a {
    color: #E56C69
    /*Change this color code to set the color of links on the page*/
}
a:hover {
    color: #757575
    /*Change this color code to set the color of links on the page when hovering*/
}
/* -------------------------------------------------------------------------------------------------------
Static Homepage and splash page Header
------------------------------------------------------------------------------------------------------- */

.splash-page .tp-dottedoverlay,
.static-homepage .tp-dottedoverlay {
    background-color: rgba(44, 62, 80, 0.7) !important
    /*Change this color code to set the static image overlay*/
}
.wft-static-caption {
    color: #fff!important
    /*Change this color code to set the title color of the static header and splash pages*/
}
.wft-static-caption {
    text-shadow: 2px 2px rgba(44, 62, 80, 0.9)
    /*Change this color code to set the title text shadow of the static header and splash pages*/
}
.wft-static-rtext {
    color: #E56C69 !important
    /*Change this color code to set the scrolling text color of the static header and splash pages*/
}
.wft-static-rtext {
    text-shadow: 4px 4px rgba(44, 62, 80, 0.9)
    /*Change this color code to set the scrolling text shadow of the static header and splash pages*/
}
/* -------------------------------------------------------------------------------------------------------
Slider Homepage Header
------------------------------------------------------------------------------------------------------- */

.slider-homepage .tp-dottedoverlay {
    background-color: rgba(44, 62, 80, 0.5)
    /*Change this color code to set the color of slider image overlay*/
}
.wft-slide-caption {
    color: #E56C69 !important;
    /*Change this color code to set the slider title color*/
    
    text-shadow: 2px 2px rgba(44, 62, 80, 0.9)
    /*Change this color code to set the slider title text shadow*/
}
.wft-slide-subcaption {
    color: #fff !important
    /*Change this color code to set the slider sub caption color*/
}
.wft-slide-btn,
.wft-slide-btn a,
.wft-slide-btn:hover,
.wft-slide-btn a:hover {
    color: #fff;
    /*Change the button text color and text hover color / this is for both static and slider buttons*/
}
.wft-slide-btn {
    border: 1px solid #fff;
    /*Change the button border - this is for both static and slider buttons*/
}
/* -------------------------------------------------------------------------------------------------------
Video Homepage Header
------------------------------------------------------------------------------------------------------- */

.video-caption h1 {
    color: #fff !important;
    /*Change this color code to set the video title color*/
    
    text-shadow: 2px 2px rgba(0, 0, 0, 0.2)
    /*Change this color code to set the video text shadow*/
}
.video-caption p {
    color: #fff !important
    /*Change this color code to set the video header sub caption*/
}
.mb_YTPBar .mb_YTPseekbar {
    background: #E56C69
    /*Change this color code to set the youtube progress bar color*/
}
/* -------------------------------------------------------------------------------------------------------
Quote Rotator
------------------------------------------------------------------------------------------------------- */

.owl-theme .owl-controls .owl-page span {
    background: #E56C69 !important
    /*Change this color code to set the background color of the quote rotator*/
}
/* -------------------------------------------------------------------------------------------------------
Parallax Sections
------------------------------------------------------------------------------------------------------- */

#parallax1,
#parallax1 h2 {
    color: #fff !important
    /*Change this color code to set the text color in the Parallax 1 Section*/
}
#parallax2,
#parallax2 h2 {
    color: #fff !important
    /*Change this color code to set the text color in the Parallax 2 Section*/
}
#parallax3,
#parallax3 h2 {
    color: #fff !important
    /*Change this color code to set the text color in the Parallax 3 Section*/
}
#parallax1 h2 span,
#parallax2 h2 span,
.parallax-title span,
.embed-container h2 {
    text-shadow: 4px 4px rgba(44, 62, 80, 0.9)
    /*Change this color code to set the parallax text shadow*/
}
.pattern {
    background-color: rgba(44, 62, 80, 0.7)
    /*Change this color code to set the parallax overlay*/
}
/* -------------------------------------------------------------------------------------------------------
Menu Styling
------------------------------------------------------------------------------------------------------- */

.top-bar,
.menu {
    background: #fff
    /*Change this color code to set the menu top bar background*/
}
@media screen and (max-width: 769px) {
    .top-bar {
        border-bottom: 1px solid #eee
        /*Change this color code to set the menu top bar border on mobile devices*/
    }
}
.menu ul li a {
    color: #757575
    /*Change this color code to set the menu link color*/
}
/*menu text color*/

.menu ul li:after {
    color: #757575
    /*Change this color code to set color of the dot after each menu item*/
}
.menu ul li a span:hover,
.menu ul li:hover a span {
    color: #E56C69 !important
    /*Change this color code to set the menu link color on hover*/
}
#top-nav .current a span {
    color: #E56C69 !important
    /*Change this color code to set the menu link color when selected*/
}
.top-bar .toggle {
    color: #959595
    /*Change this color code to set the color of the hamburger menu icon on mobile broswers*/
}
.top-bar .toggle:hover {
    color: #E56C69
    /*Change this color code to set the color of the hamburger menu icon on mobile broswers when hovering*/
}
/* -------------------------------------------------------------------------------------------------------
Section Background colors (Used to set background colors of multiple sections)
------------------------------------------------------------------------------------------------------- */

.black-bg {
    background: #333
    /*Change this color code to set the background of the footer*/
}
.grey-bg {
    background: #f5f5f5
    /*Change this color code to set the background grey areas*/
}
.white-bg {
    background: #fff
    /*Change this color code to set the background of white sections*/
}
.red-bg {
    background: #E56C69
    /*Change this color code to set the background red sections*/
}
/* -------------------------------------------------------------------------------------------------------
Portfolio Section
------------------------------------------------------------------------------------------------------- */

.option-set li {
    background: #fff
    /*Change this color code to set the background of the portfolio option button*/
}
.option-set li a.selected,
.option-set li a:hover {
    background: #E56C69;
    /*Change this color code to set the background color of the portfolio option button when selected/hovering*/
    
    color: #fff!important
    /*Change this color code to set the text color of the portfolio option button when selected/hovering*/
}
/* -------------------------------------------------------------------------------------------------------
Standard Page - header type
------------------------------------------------------------------------------------------------------- */

#page-title {
    background: #E56C69;
    /*Change this color code to set the background of the page title on standard header type*/
    
    color: #fff
    /*Change this color code to set the text color of the title on the standard header type*/
}
/* -------------------------------------------------------------------------------------------------------
Weebly Specific Element Color styling
------------------------------------------------------------------------------------------------------- */
/*=== WEEBLY BLOCKQUOTES ===*/

blockquote {
    color: #757575;
    /*Change this color code to set the text color on the weebly blockquote element*/
    
    border-left: 4px solid #E56C69 !important
    /*Change this color code to set the left border line of the block quote element*/
}
/*=== WEEBLY DIVIDER ===*/

.wsite-theme-light hr.styled-hr,
hr.styled-hr {
    background-color: #e8e8e8
    /*Change this color code to set the color of the Divider*/
}
/*=== WEEBLY CONTACT FORM ===*/

.wsite-form-field div.wsite-form-input-container .wsite-form-input,
.wsite-form-field .wsite-form-radio-container .form-select {
    background: #444444
    /*Change this color code to set the color of the weebly form background*/
}
.weebly-form-label,
.wsite-form-label,
.form-required {
    color: #757575
    /*Change this color code to set the color of the weebly form field label text*/
}
.wsite-form-field div.wsite-form-input-container .wsite-form-input,
.wsite-form-field .wsite-form-radio-container .form-select {
    color: #959595
    /*Change this color code to set the color of the weebly form field text*/
}
/*=== WEEBLY BUTTONS ===*/

.wsite-button,
.wsite-editor .wsite-button,
.wsite-button-large,
.wsite-button,
.wsite-editor .wsite-button-large {
    background: #E56C69;
    /*Change this color to set the background of the standard weebly button*/
    
    border-bottom: 4px solid #D45B58;
    /*Change this color to set the border color of the standard weebly button*/
    
    color: #fff!important
    /*Change this color to set the text color of the standard weebly button*/
}
.wsite-button:hover,
.wsite-editor .wsite-button:hover,
.wsite-button-large:hover {
    background: #D45B58;
    /*Change this color to set the background of the standard weebly button when hovering*/
    
    border-bottom: 4px solid #D45B58;
    /*Change this color to set the border color of the standard weebly button when hovering*/
    
    color: #fff
    /*Change this color to set the text color of the standard weebly button when hovering*/
}
.wsite-button-highlight,
.wsite-editor .wsite-button-highlight,
.wsite-button-large.wsite-button-highlight {
    background: #40878A;
    /*Change this color to set the background of the alternative weebly button*/
    
    border-bottom: 4px solid #397174;
    /*Change this color to set the border color of the alternative weebly button*/
    
    color: #fff!important
    /*Change this color to set the text color of the alternative weebly button*/
}
.wsite-button-highlight:hover,
.wsite-button-large.wsite-button-highlight:hover {
    background: #397174;
    /*Change this color to set the background of the alternative weebly button when hovering*/
    
    color: #fff;
    /*Change this color to set the border color of the alernative weebly button when hovering*/
    
    border-bottom: 4px solid #397174
    /*Change this color to set the text color of the alternative weebly button when hovering*/
}
/* -------------------------------------------------------------------------------------------------------
Weebly Social Icons
------------------------------------------------------------------------------------------------------- */
/*=== PARALLAX SOCIAL ICONS ===*/

.clients .wsite-social-instagram,
.wsite-editor .wsite-social-instagram,
.clients .wsite-social-plus,
.wsite-editor .wsite-social-plus,
.clients .wsite-social-mail,
.wsite-editor .wsite-social-mail,
.clients .wsite-social-pinterest,
.wsite-editor .wsite-social-pinterest,
.clients .wsite-social-rss,
.wsite-editor .wsite-social-rss,
.clients .wsite-social-yahoo,
.wsite-editor .wsite-social-yahoo,
.clients .wsite-social-facebook,
.wsite-editor .wsite-social-facebook,
.clients .wsite-social-twitter,
.wsite-editor .wsite-social-twitter,
.clients .wsite-social-linkedin,
.wsite-editor .wsite-social-linkedin,
.clients .wsite-social-flickr,
.wsite-editor .wsite-social-flickr,
.clients .wsite-social-vimeo,
.wsite-editor .wsite-social-vimeo,
.clients .wsite-social-youtube,
.wsite-editor .wsite-social-youtube {
    border: 2px solid #fff;
    /*Change this color code to set the border color of the parallax social icons*/
    
    color: #fff
    /*Change this color code to set the color of the parallax social icons*/
}
.clients .wsite-social-instagram:hover,
.wsite-editor .wsite-social-instagram:hover,
.clients .wsite-social-facebook:hover,
.wsite-editor .wsite-social-facebook:hover,
.clients .wsite-social-mail:hover,
.wsite-editor .wsite-social-mail:hover,
.clients .wsite-social-pinterest:hover,
.wsite-editor .wsite-social-pinterest:hover,
.clients .wsite-social-rss:hover,
.wsite-editor .wsite-social-rss:hover,
.clients .wsite-social-yahoo:hover,
.wsite-editor .wsite-social-yahoo:hover,
.clients .wsite-social-plus:hover,
.wsite-editor .wsite-social-plus:hover,
.clients .wsite-social-twitter:hover,
.wsite-editor .wsite-social-twitter:hover,
.clients .wsite-social-linkedin:hover,
.wsite-editor .wsite-social-linkedin:hover,
.clients .wsite-social-flickr:hover,
.wsite-editor .wsite-social-flickr:hover,
.clients .wsite-social-vimeo:hover,
.wsite-editor .wsite-social-vimeo:hover,
.clients .wsite-social-youtube:hover,
.wsite-editor .wsite-social-youtube:hover {
    border: 2px solid #fff;
    /*Change this color code to set the border color of the parallax social icons when hovering*/
    
    color: #E56C69
    /*Change this color code to set the color of the parallax social icons when hovering*/
}
/*=== DRAG AND DROP WEEBLY SOCIAL ICONS ===*/

.content .wsite-social-instagram,
.wsite-editor .wsite-social-instagram,
.content .wsite-social-plus,
.wsite-editor .wsite-social-plus,
.content .wsite-social-mail,
.wsite-editor .wsite-social-mail,
.content .wsite-social-pinterest,
.wsite-editor .wsite-social-pinterest,
.content .wsite-social-rss,
.wsite-editor .wsite-social-rss,
.content .wsite-social-yahoo,
.wsite-editor .wsite-social-yahoo,
.content .wsite-social-facebook,
.wsite-editor .wsite-social-facebook,
.content .wsite-social-twitter,
.wsite-editor .wsite-social-twitter,
.content .wsite-social-linkedin,
.wsite-editor .wsite-social-linkedin,
.content .wsite-social-flickr,
.wsite-editor .wsite-social-flickr,
.content .wsite-social-vimeo,
.wsite-editor .wsite-social-vimeo,
.content .wsite-social-youtube,
.wsite-editor .wsite-social-youtube {
    color: #E56C69
    /*Change this color code to set the color of the standard Weebly social icons*/
}
.content .wsite-social-instagram:hover,
.wsite-editor .wsite-social-instagram:hover,
.content .wsite-social-facebook:hover,
.wsite-editor .wsite-social-facebook:hover,
.content .wsite-social-mail:hover,
.wsite-editor .wsite-social-mail:hover,
.content .wsite-social-pinterest:hover,
.wsite-editor .wsite-social-pinterest:hover,
.content .wsite-social-rss:hover,
.wsite-editor .wsite-social-rss:hover,
.content .wsite-social-yahoo:hover,
.wsite-editor .wsite-social-yahoo:hover,
.content .wsite-social-plus:hover,
.wsite-editor .wsite-social-plus:hover,
.content .wsite-social-twitter:hover,
.wsite-editor .wsite-social-twitter:hover,
.content .wsite-social-linkedin:hover,
.wsite-editor .wsite-social-linkedin:hover,
.content .wsite-social-flickr:hover,
.wsite-editor .wsite-social-flickr:hover,
.content .wsite-social-vimeo:hover,
.wsite-editor .wsite-social-vimeo:hover,
.content .wsite-social-youtube:hover,
.wsite-editor .wsite-social-youtube:hover {
    color: #E56C69
    /*Change this color code to set the color of the standard Weebly social icons when hovering*/
}