/*

Theme Name: X &ndash; Child Theme
Theme URI: http://theme.co/x/
Author: Themeco
Author URI: http://theme.co/
Description: Make all of your modifications to X in this child theme.
Version: 1.0.0
Template: x

*/

/* GENERAL - Top bar text alignment on mobile and tablet*/


@media (max-width: 320px) {
	
.x-topbar .p-info, .x-topbar .p-info a {
		
float: left !important;
    
font-size: 10px !important;
    
max-width: 80%;
  
}

}

body .x-navbar ul.sub-menu li a {
	
font-size: 25px;
}




@media (max-width: 768px) {
  
.x-topbar .p-info, .x-topbar .p-info a {
    
font-size: 20px !important;
		
float: left !important;  
  
}  
  
.x-topbar {
    
height: 45px;
  
}

}

@media (max-width: 480px) {
  
.x-topbar .p-info, .x-topbar .p-info a {
    
float: left !important;
    
font-size: 10px !important;
    
max-width: 80% !important;
  
}
  
.x-topbar {
    
height: 45px;
  
}

}

.x-container-fluid.offset.cf {
    
margin-left: auto !important;
    
margin-right: auto !important;
    
float: none;
}


/* GENERAL - Center images in Columns */


.x-img {
  
display:block;
  
margin:0 auto;
  
text-align:center;
}



/* GENERAL - Make mobile menu fully clickable */


.x-sub-toggle {
    
width: 100%;
    
text-align: right;
}


.x-sub-toggle>span {
    
padding-right: 10px;
}



/* Topbar Link color */


.x-topbar .p-info a{
    
color: rgb(89, 50, 24);
}



/* Topbar link hover color */


.x-topbar .p-info a:hover {
    
color: hsl(22, 74%, 35%);
}



.x-topbar .p-info {

font-size: 25px;
  

font-family: "Caveat brush";
  

color: rgb(89, 50, 24);

}





.x-topbar .x-social-global a i {
  

font-size: 30px;
  

color: rgb(89, 50, 24);

}



/* Calendar colors */

#multicalendar tbody {
  
background-color: rgba(200, 250, 150, 0.9);
}


#multicalendar .ui-datepicker-calendar th {
  
background-color: rgba(194, 223, 154, 0.9);
}


#multicalendar .ui-datepicker-multi .ui-datepicker-group .ui-datepicker-header {

background-color: rgba(194, 223, 154, 0.9);
}


/* GENERAL - Eliminate white background everywhere*/
.x-container.main:before {
	background-color: transparent;
}


/* GENERAL - Navbar green opacity */
body .x-navbar {
  background-color: rgba(196, 223, 156, 0.7);
}

/*GENERAL - Navbar submenu green opacity */
.x-navbar .desktop .sub-menu {
    background-color: rgba(196, 223, 156, 0.9);
}

/*GENERAL - Top Bar Font Styling*/
.x-topbar .p-info {
font-size: 25px;
  font-family: "Caveat brush";
  color: rgb(89, 50, 24);
}

/*GENERAL - Top Bar Socials Styling*/
.x-topbar .x-social-global a i {
  font-size: 30px;
  color: rgb(89, 50, 24);
}

/*GENERAL - Nav Bar Submenu Font*/
.x-navbar .x-nav .sub-menu a {
   font-size: 20px;
   font-family: "Caveat Brush"
}

/* GENERAL - Footer Font Styling*/
.x-colophon.bottom .x-colophon-content {
        font-size: 16px;
        color:#5b3a2c;
}
/* GENERAL - Footer Menu Styling*/
.x-colophon.bottom .x-nav li a {
        font-size: 16px;
        color:rgb(89, 50, 24);
}
/* GENERAL - Footer Socials Styling*/
footer.x-colophon .x-social-global a i {
        color: rgb(89, 50, 24);
        font-size: 35px;
}


/* GENERAL - Less space between hard returns */
.entry-content p {
	margin-bottom: 1.50em;
	line-height: 1.5;
}
/*GENERAL - arrows submenus*/
.x-navbar .desktop .x-nav li>a>span:after {
  font-size: 16px ;
}


/* BLOG - Change colour comment background*/
.x-comments-area {
background-color: rgba(194, 223, 154, 0.9); padding: 20px 20px;
}

/* BLOG - Change colour comment field front - readables and writeable*/
textarea#comment {
    background-color: rgba(194, 223, 154, 0.9);
    color: #68503c;
}
article.comment {
  background-color: rgba(194, 223, 154, 0);
}


/* BLOG - Green Backgrounds for Blog Oveview*/
.blog .x-main .hentry, 
.search .x-main .hentry, 
.archive .x-main .hentry {
    background-color: rgba(194, 223, 154, 0.9);
    padding-top: 0;
    border: none;
}
/* BLOG - Margin adjustment for Blog Overview*/
.blog .x-main .hentry h2.entry-title, 
.search .x-main .hentry h2.entry-title, 
.archive .x-main .hentry h2.entry-title {
    margin-top: 10px;
}

/* BLOG - Sidebar Layout*/
.x-sidebar {
    background-color: rgba(194, 223, 154, 0.9);
}

.x-sidebar.right { padding: 20px 20px !important;}

/* BLOG - Numbers blog overview normal state layout*/
.x-pagination a, .x-pagination span {
  color: rgb(89, 50, 24);
  font-size: 24px;
  height: 32px;
  line-height: 32px;
  width: 32px;
  background-color: rgba(194, 223, 154, 0.9);
  border-radius: 10px;
}

/* BLOG - Numbers blog overview hover color and background*/
.x-pagination a:hover {
  background-color: rgba(194,223,154,0.9);
  color: #fff;
}
/* BLOG - Numbers blog overview current item color and background*/
.x-pagination span.current {
  background-color: #67442d;
  color: #fff;
}

/*BLOG - hide header on blog pages*/
.single-post .entry-wrap .entry-header {
    display: none;
}

/* SHOP - Change background colour and layout shop page*/
.archive .x-main{
background-color: rgba(194, 223, 154, 0.9);
border-radius: 4px;
margin: 40px auto;
padding: 10px
}

/* SHOP - Change background for header: DOUBLE CHECK IF NECESSARY!*/
.archive .x-header-landmark {
background-color: rgba(194, 223, 154, 0.9);
border-radius: 4px;
margin: 40px auto;
padding-left:30px;
}

/* SHOP - Change background colour individual product pages*/
.product-template-default .x-main {
background-color: rgba(194, 223, 154, 0.9);
padding-top:50px;
}

/*SHOP - Change size description tab individual product pages*/
.woocommerce-tabs li{
  display: none;
}

/*SHOP - hide links to shop on individual product pages*/
.product-template-default  .entry-top-navigation{
display: none;
}
/*BLOG - hide header on blog pages*/
.single-post .entry-wrap .entry-header {
    display: none;
}

/* MISFITS UNIFIED - change background color top bar*/
.page-id-4485 .x-topbar {
  background-color:rgba(178, 105, 181,0.9)
}
/* MISFITS UNIFIED - change background color menu bar MU*/
.page-id-4485 .x-navbar {
  background-color:rgba(178, 105, 181,0.9)
}
/* MISFITS UNIFIED - change background footer MU*/
.page-id-4485 .x-colophon.bottom {
  background-color:rgba(178, 105, 181,0.9)
}
/* MISFITS UNIFIED - change submenus and topbar*/
.page-id-4485 .x-navbar .sub-menu {
background-color:rgba(178, 105, 181,0.9)
}

.page-id-4485 .x-navbar .mobile .x-nav li > a {

    color: hsl(260, 60%, 20%);

}

.page-id-4485 .x-navbar .x-nav>li>a {
color: hsl(260, 60%, 20%);
}


.page-id-4485 .x-topbar .p-info {
color: hsl(260, 60%, 20%);
}




/* WPP - change background color top bar WPP*/
.page-id-3208 .x-topbar {
  background-color:rgba(255, 255, 255, 0.7)
}
/* WPP - change background color menu bar WPP*/
.page-id-3208 .x-navbar {
  background-color:rgba(255, 255, 255, 0.7)
}
/* WPP - change background color submenus*/

.page-id-3208 .x-navbar .sub-menu {

  background-color:rgba(255, 255, 255, 0.9)
}
/* WPP - change background footer WPP*/
.page-id-3208 .x-colophon.bottom {
  background-color:rgba(255, 255, 255, 0.7)
}
/* WPP - change submenu colors and topbar*/
.page-id-3208 .x-navbar .mobile .x-nav li > a {

    color: hsl(180, 80%, 20%);

}

.page-id-3208 .x-navbar .x-nav>li>a {
color: hsl(180, 80%, 20%);
}

.page-id-3208 .x-topbar .p-info {
color: hsl(180, 80%, 20%);
}
.page-id-3208 .x-navbar .sub-menu {
	background-color:rgba(255, 255, 255, 0.9)}

/* bottom footer link color */ 

.x-colophon.bottom .x-colophon-content a { color: #67442d; } 

/* bottom footer link hover color */

.x-colophon.bottom a:hover { color: #f77825; } 

.x-tab-pane {
  background-color: rgba(194, 223, 154, 0.9)
}
