/* --------------------------------------------------------------------- */
/* 1. BACKGROUND COLOR
/* --------------------------------------------------------------------- */

.headline-wrapper, .wrapper.color-bg, #banner .scroll-down a:hover, .work-tabs li a:hover, .work-tabs li.active a, #work-wrapper #close-work-wrapper:hover, #blog-preview li:hover, #blog-wrapper #close-blog-wrapper:hover, .button, input.submit, .social-icons a:hover, .pricing-table.best-price .header, .toggle-box .toggle .header:hover, .toggle-box .toggle .header.active, .skillbar .percent-bg, .maximage-prev:hover, .maximage-next:hover, .bx-wrapper .bx-pager.bx-default-pager a:hover, .bx-wrapper .bx-pager.bx-default-pager a.active, .bx-wrapper .bx-controls-direction a:hover {
    background-color: #fac42c;
}

.button:hover, input.submit:hover {
    background: #fed665;
}

#work-preview .layer {
    background-color: rgba(255,202,51,0.85);
}

#page-preloader, #work-wrapper, .team-member, #blog-preview li, #blog-wrapper, .pricing-table, .toggle-box .toggle .header, .toggle-box .content, .skillbar, .tab-content-navi li a, .callout-box, .alert-box, .bx-wrapper .bx-loading {
    background-color: #292929;
}

body, .bx-wrapper .bx-pager.bx-default-pager a {
    background-color: #444749;
}

#header {
    background-color: #ffca33;
}

.bottom-box {
    background-color: #292929;
}

input.text, textarea {
    background: rgba(0,0,0,0.12);
	color:#FFF;
}



/* --------------------------------------------------------------------- */
/* 2. FONT COLOR
/* --------------------------------------------------------------------- */

a, #main-navigation li a:hover, #main-navigation li a.active, .color, .button.border:hover, .icon-box:hover i, .social-links a:hover, {
    color: #636363;
}

#open-nav:hover {
    color: #1E90FF;
}

body, .social-links a, #open-nav, #main-navigation li a, .work-tabs li a, #work-preview li a, .button, .button.border, input.submit, .social-icons a, .toggle-box .toggle .header, .tab-content-navi li a, .alert-box .close:hover {
    color: #ffffff;
}

p.undertitle {
    color: rgba(102,102,102,0.8);
}

p.undertitle2 {
    color: rgba(255,255,255,0.8);
}

input.text, input.button, textarea {
	color:#ffffff;
}

.bottom-box, p.blockquote,   {
    color: rgba(255,255,255,0.5);
}

.white {
	color:#FFF;
}

/* --------------------------------------------------------------------- */
/* 3. BORDER COLOR
/* --------------------------------------------------------------------- */

#banner .scroll-down a, .work-tabs li a, #work-wrapper #close-work-wrapper, #blog-wrapper #close-blog-wrapper, .button.border, .social-icons a, .maximage-prev, .maximage-next, .bx-wrapper .bx-controls-direction a {
    border-color: #d7d7d7;
}

.textchange {
	color: rgba(102,102,102,0.8);
}

#banner .scroll-down a:hover, .work-tabs li a:hover, .work-tabs li.active a, #work-wrapper #close-work-wrapper:hover, #blog-wrapper #close-blog-wrapper:hover, .button, .button.border:hover, input.submit, .social-icons a:hover, p.blockquote, .pricing-table.best-price .header, .tab-content-navi a.active, .tab-content-navi a:hover, .callout-box, .maximage-prev:hover, .maximage-next:hover, .bx-wrapper .bx-controls-direction a:hover {
    border-color: #ffca33;
}

.button:hover, input.submit:hover {
    border-color: #fed665;
}

.tab-content-navi, .tab-content-navi li a {
    border-color: #353739;
}

.hr {
    border-color: rgba(255,255,255,0.15);
}

.pricing-table .header, .pricing-table .content {
    border-color: rgba(255,255,255,0.35);
}

.textchange {
	color: rgba(102,102,102,0.8);
}