/* Themify Custom CSS */
/* GENERAL BACKGROUND COLOR
Changes the contact button background cover on main nav header menu
Changes contact form button background
Changes posts circle color background color*/
.header-horizontal #headerwrap #main-nav .highlight-link a:hover,
.header-horizontal #main-nav .highlight-link.current_page_item > a,
.header-horizontal #main-nav .highlight-link.current-menu-item > a,
.loops-wrapper.list-post .post-date,
.single .post-content .post-date,
.module-buttons a.yellow,
.module-contact button {
         background-color: #4B0082;
}

/* GENERAL BORDER COLOR
Changes highlight-link border on header menu
Changes button borders that aren't customized*/
.header-horizontal #main-nav .highlight-link > a,
 .more-link,
.module-buttons a.yellow,
.module-buttons.outline a.yellow,
.module-contact input[type=reset],
.module-contact input[type=submit],
.module-contact button {
        border-color: #800080;
}

/* HEADER MENU LINK BOX SHADOOW
Changes the horizontal bar on header menu*/
.header-horizontal #main-nav > li > a:hover,
.header-horizontal #main-nav > .current_page_item > a,
.header-horizontal #main-nav > .current-menu-item > a {
        box-shadow: inset 0 2px 0 0 #9400D3;
}

/* GENERAL TEXT COLOR
Changes link colors on the website
Changes fancy header sub headline
Changes blog date and categories and meta labels
Changes >> << arrows for next blog post
Changes hover color for main nav menu
Changes current page main menu color*/
a,
h1 i,
h1 em,
.module-fancy-heading h1 .sub-head,
.post-nav .arrow,
h2 i,
h2 em,
.module-fancy-heading h2 .sub-head,
#main-nav a:hover,
#main-nav .current_page_item > a,
#main-nav .current-menu-item > a,
.post-date,
.post-meta a {
        color: #FF00FF;
}

/* HOVER LINK COLOR
Changes arrow and blog post next hover
Changes link color in body when hover
Changes footer links when hover
Changes color for blog post titles when hover */
a:hover,
#footer a:hover,
.post-nav a:hover > span,
.post-nav .arrow:hover,
.post-title a:hover,
.footer-block .back-top .arrow-up:hover a,
.footer-horizontal-left .back-top .arrow-up:hover a,
.footer-horizontal-right .back-top .arrow-up:hover a,
.footer-left-col .back-top .arrow-up:hover a,
.footer-right-col .back-top .arrow-up:hover a,
.module-buttons .builder_button.yellow:hover,
.mobile_menu_active #headerwrap #main-nav .current_page_item > a,
.mobile_menu_active #headerwrap #main-nav .current-menu-item > a,
.mobile_menu_active.transparent-header #headerwrap #main-nav li a:hover {
        color: #9932CC;
}

/* POST AND CONTACT FORM HOVER BUTTON COLOR */
input[type=reset]:hover,
input[type=submit]:hover,
button:hover {
	background-color: #9932CC;
}

/* CONTACT FORM BUTTON BACKGROUND COLOR
This is to change the background color
for your contact form button. If you want
a hover color to change. Otherwise delete this section */
.module-buttons a.yellow,
.module-contact button {
         background-color: #9932CC;
}

/* MORE BUTTON CUSTOMIZATION
Contact form font color
Post button background color
Does not change the contact form button color */
input[type=reset], input[type=submit], button {
        border-radius: 0;
        color: #fff;
        background-color: #4B0082;
}


/* CUSTOM CSS FOR FORMATING PURPOSES */

.footer-block #footerwrap .back-top a:before {
    font-size: 40px;
}

.footer-block #footerwrap .back-top {
        order: inherit;
        margin-bottom: 10px;
}

.footer-block #footerwrap .back-top .arrow-up a {
  width:50px;
  height: 50px;
}

#footerwrap {
        padding-top: 20px;
}

.header-horizontal #headerwrap { 
background-color: rgba(0,0,0,.7); 
}

.maketable .fork-icon,
.module-fancy-heading .maketable .fork-icon {
display: none;
}

input[type=reset], input[type=submit], button {
	border-radius: 0;
}

.header-horizontal #main-nav .highlight-link > a {
  border-radius: 0;
}

.footer-nav a {
  margin: 0 1em .8em 1em;
}

#footer .social-widget {
    padding: 10px 0;
}