/*
 Theme Name:   Crissy Child - Yokai
 Theme URI:    http://themeforest.net/user/dabaman/portfolio
 Description:  Crissy Child Theme for Yokai.com site
 Author:       dabaman
 Author URI:   http://themeforest.net/user/dabaman/portfolio
 Template:     Crissy
 Version:      1.0.0
 License:      
 License URI:  
 Tags:         post-formats, threaded-comments, translation-ready
 Text Domain:  crissy-child
*/

/* layout */

.posts_wrapper {
    float: left;
    width: 100%;
    padding: 0 1.5%; 
    overflow: hidden; }

.posts_wrapper > section.content {
    width: calc(100% - 300px);
    padding: 0; }

.site_sidebar { 
    width: 300px;
    margin-left: -100%;
    float: right;}

.site_sidebar > ul { 
    margin-right: 1.5em;
    margin-bottom: 3em;
    margin-left: 1.5%;
    padding: 1em;
    position: relative;
    box-shadow: 5px 10px 10px rgba(0,0,0,.2);
}
.site_sidebar > ul > li:last-child { margin-bottom: 1em; } 

.site_sidebar .widget { margin-bottom: 2em; } 
    

body > footer { 
    overflow: hidden;
    float: left; 
    width: 92.2%; }

/* single layout */
.single_wrapper {
   margin: 0 auto;
   padding: 0 1.5%; 
   max-width: 1200px; }

.single_wrapper > section.content {
    width: calc(100% - 300px);
    float: left;
    padding: 0 1.5%;  }


/* background images for posts */
.box,
.comment>article,
#respond,
.prev_post_fixed:hover, 
.next_post_fixed:hover,
#imagelightbox,
.alphabetical_menu .sub-menu { 
	background: #f0e8dc url(lib/images/posts_bg.jpg); }

    
.box,
.comment>article,
#respond,
.alphabetical_menu .sub-menu { border-bottom: 1px solid #695c2d; }



@media only screen and (min-width: 768px) {
    /* dropdowns */
    .navigation li .sub-menu, 
    .menu_cart .mini_cart {
        background: #f0e8dc url(lib/images/posts_bg.jpg);
        border: 1px solid #f0e8dc;
	    box-shadow:0 10px 10px rgba(0,0,0,.2); }
	
	.navigation li .sub-menu:before,
	.menu_cart .mini_cart:before {
		    border-bottom-color: #f0e8dc; 
	}
	
	.navigation li ul a { 
		border-bottom-color: rgba(0,0,0,.1); }
}


.feat_img:before, 
.contact_template header:before {
	border-bottom-color: #ece4c4; }


/* sidebars */
ul.sidebar_right_1 { 
    background: url(lib/images/sidebar_1_bg.jpg) repeat-y;
    padding-top: 2em; }

.sidebar_right_1:before {
    content: '';
    width: 149px;
    height: 64px;
    left: 50%;
    margin-left: -75px;
    display: block;
    background: url(lib/images/sticker.png) no-repeat;
    position: absolute;
    top: -37px;
}

.sidebar_right_2 { 
    background: url(lib/images/sidebar_2_bg.png) repeat-y;
    padding-left: 3.5em !important;
    }

.site_sidebar .widgettitle {
    font-family: 'Gloria Hallelujah', cursive;
    font-size: 1.3em; }


/* header */

body>header {
    padding: 1.5em 0;
}

/* logo */

#logo h1 {
    font-size: 2.5em; }

#logo h1,
span.tagline,
.navigation > li > a,
a.site_search {
    text-shadow: 1px 1px 1px rgba(0,0,0,.5); }

/* tagline */
span.tagline {
    text-align: center;
    display: inline-block;
    font-size: .8em; 
    font-family: 'Gloria Hallelujah', cursive;
    position: relative;
    top: -.5em;
    color: #f8f8f8; }


/* search */
#searchform > input {
    color: white; }

.navigation > li > a:hover,
.navigation > li.current-menu-item > a,
.site_search:hover, 
.site_search.active {
    color: #e2e0e0; }

/* standard menu */
.navigation  li  a {
    font-style: normal; }


/* alpabetical menu */

.alphabetical_menu {
	 text-align: center;
}

.alphabetical_menu > li {
    display: inline-block;
    margin-bottom: .5em;
    position: relative; }
.alphabetical_menu > li > a {
    display: inline-block;
    padding: .1em .5em;
    border: 1px solid #b79784;
    box-shadow: 0 3px 3px rgba(0,0,0,.2);
    background: #6c3c24;
    text-align: center;
    font-size: .9em;
    text-transform: uppercase;
    font-style: normal;
    vertical-align: bottom;}

.alphabetical_menu > li:not(:last-child) > a {
    margin-right: .5em; }

.alphabetical_menu .sub-menu {
    visibility: hidden;
    transition: opacity .2s;
    position: absolute;
    opacity: 0;
    z-index: 1000;
    padding: 1em 1.5em;
    min-width: 175px;
    left: 0;
    font-size: .95em;
    box-shadow:0 10px 10px rgba(0,0,0,.2);
    text-align:left; }

.alphabetical_menu li:hover .sub-menu {
    visibility: visible;
    opacity: 1; }

.alphabetical_menu .sub-menu li a {
    display: block;
    color: inherit;
    padding: .25em 0; }

.alphabetical_menu .sub-menu li:not(:last-child) a {
    border-bottom: 1px solid rgba(0,0,0,.1); }

.index.box { margin-top: 16px; }
.index .wrapper { margin-top: -16px; }

.box { 
    box-shadow: 0 5px 40px rgba(0,0,0,.2); }

.box:before {
    content: "";
    position: absolute;
    top: -16px;
    right: 0;
    border-width: 0 16px 16px 0;
    border-style: solid;
    border-color: transparent;
    border-right-color: transparent !important;
    border-bottom-color: #d2c9ab;
    box-shadow: -1px 1px 2px rgba(0,0,0,.3);}

.box:after { 
    content: "";
    position: absolute;
    top: -16px;
    left: 0;
    right: 16px;
    height: 16px;
    background: url(lib/images/posts_bg.jpg); }

.index.box:hover:before {
    border-width:0 16px 16px 0;
    transition: 0; }

.page.box,
.single.box {
    margin-top: 20px; }

.page.box .wrapper,
.single.box .wrapper {
    padding-top: 2.5em; }
    
.page.box:before,
.single.box:before {
    top: -20px;
    right: 0;
    border-width: 0 20px 20px 0; }

.page.box:after,
.single.box:after { 
    top: -20px;
    left: 0;
    right: 20px;
    height: 20px; }

.gallery_template .box:before,
.gallery_template .box:after { content: none; }
.gallery_template .box .wrapper { margin-top: 0; }


/* form elements */
input[type=text], input[type=email], input[type=password], textarea {
    background: transparent;
    border-bottom-color: #333; }

/* tables */

.content tbody tr {
    border-color: rgba(0,0,0,.1); }


/* comments */
.single .comments_number_icon i { 
    color: #f0e8dc; }

.comments_number_icon a { 
    color: #666; }

.comment-meta,
.comment-reply-link, 
#cancel-comment-reply-link {
    color: #666; }

.comment>article:before { 
    border-right-color: #f0e8dc; }
#respond:before {
    border-bottom-color: #f0e8dc; }

/* lightbox */
#imagelightbox { 
    border: none; 
    padding: 20px; }


/* small screens */

@media only screen and (max-width: 1335px) {
    
    .prev_post_fixed, .next_post_fixed {
        display: none;
    }
    
    .post_nav { display: block; }
    
}

@media only screen and (min-width: 1225px) and (max-width: 1600px) {
    .posts_wrapper .grid_block { width: 30%; }  
}


@media only screen and (min-width: 1025px) and (max-width: 1224px) {
    .posts_wrapper .grid_block { width: 47%; }  
}

@media only screen and (min-width: 768px) and (max-width: 1024px) {
    .posts_wrapper .grid_block { width: 97%; }  
}
    

@media only screen and (max-width: 767px) {
    
    #menu-alphabetical-menu { display: none; }
    
    span.tagline {
        float: left;
        text-align: left;
    }
    
    .posts_wrapper > section.content,
    .single_wrapper > section.content {
        width: 100%; }

    .site_sidebar { 
        width: 100%;
        margin-left: 0;
        margin-top: 3em; }
    
    .site_sidebar > ul {
        margin-right: 3%;
        margin-left: 3%; }
    
    
}

@media only screen and (max-width: 479px) {
    #imagelightbox {
        padding: 8px;
    }
}

.single header>span {

display: none;

}

.navigation>li>ul:before, .menu_cart .mini_cart:before {

content: none;

}

@media only screen and (max-width: 767px) {

.alphabetical_menu { display: none; }

}

.sidebar_right_1 .widget_recent_entries li {
	text-align: center;
}

.sidebar_right_1 .widget_recent_entries a {
	font-family: 'Gloria Hallelujah', cursive;
}

.alphabetical_menu .sub-menu-2columns ul {
min-width: 316px;
}
   
.alphabetical_menu .sub-menu-2columns ul.sub-menu li {
    display: inline-block;
    float: left;
    width: 130px;
}
.alphabetical_menu .sub-menu-2columns ul.sub-menu li:nth-child(odd) {
    float: left;
    margin-right: 10px;
}
.alphabetical_menu .sub-menu-2columns ul.sub-menu li:nth-child(even) {
    float: right;
}

.alphabetical_menu .sub-menu-3columns ul {
min-width: 456px;
}
   
.alphabetical_menu .sub-menu-3columns ul.sub-menu li {
    display: inline-block;
    float: left;
    width: 130px;
}
.alphabetical_menu .sub-menu-3columns ul.sub-menu li:nth-child(3n-2) {
    float: left;
    margin-right: 10px;
}
.alphabetical_menu .sub-menu-3columns ul.sub-menu li:nth-child(3n-1) {
    float: none;
    margin-right: 10px;
}
.alphabetical_menu .sub-menu-3columns ul.sub-menu li:nth-child(3n+0) {
    float: right;
}