/*
Theme Name: Rabbit and Co
Theme URI: http://localhost/wp
Author: the WordPress team
Author URI: http://wordpress.org/
Description: In 2014, our default theme lets you create a responsive magazine website with a sleek, modern design. Feature your favorite homepage content in either a grid or a slider. Use the three widget areas to customize your website, and change your content's layout with a full-width page template and a contributor page to show off your authors. Creating a magazine website with WordPress has never been easier.
Version: 1.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: black, green, white, light, dark, two-columns, three-columns, left-sidebar, right-sidebar, fixed-layout, responsive-layout, custom-background, custom-header, custom-menu, editor-style, featured-images, flexible-header, full-width-template, microformats, post-formats, rtl-language-support, sticky-post, theme-options, translation-ready, accessibility-ready
Text Domain: twentyfourteen

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
*/

/**
 * 1.0 Reset
 *
 * Resetting and rebuilding styles have been helped along thanks to the fine
 * work of Eric Meyer http://meyerweb.com/eric/tools/css/reset/index.html
 * along with Nicolas Gallagher and Jonathan Neal
 * http://necolas.github.com/normalize.css/ and Blueprint
 * http://www.blueprintcss.org/
 *
 * -----------------------------------------------------------------------------
 */

/* ------------------------ reset css start -------------------------- */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {margin: 0;padding: 0;border: 0;font-size: 100%;font:inherit;vertical-align: baseline;}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary {display: block;}
audio,canvas,video {display: inline-block;}
body {line-height: 1;}
div{ box-sizing:border-box;}
ol, ul, li {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after,q:before, q:after {content: '';content: none;}
table {border-collapse: collapse;border-spacing: 0;}
img{ max-width:100%; height:auto; display:inline-block; transition:all 500ms ease-in-out; opacity:1;}
/* ------------------------ reset css end -------------------------- */

/* ------------------------ basic element CSS start -------------------------- */
* {margin: 0; padding: 0;}
body {font-family: 'Conv_cour'; font-size: 18px; line-height:26px; color: #382b1a; background:url(images/bg.png) repeat 0 0 #cfc088; height:100%; overflow-x:hidden;}
img, img a {border: none; outline: none;}
nav, ul, ol, li {list-style-type: none;}
a { color:#382b1a; outline: medium none; text-decoration: none;}
a:hover, a:active, a:focus {outline: none;}
input, textarea, select{outline:none;}
.noPading{ padding:0 !important;}
.wrapper{ max-width:1400px; margin:0 auto; background:url(images/pattern.gif) repeat 0 0;}
.wrapBg{ background-image:url(images/left-bg.gif), url(images/right-bg.gif); background-repeat:repeat-y; background-position:top left, top right; padding:0 90px 0 85px;}
.spacer{clear:both;height:auto;font-size:0;line-height:0;}
/* ------------------------ basic element CSS end -------------------------- */

/* ------------------------ Font Face start -------------------------- */
@font-face {font-family: 'Conv_cour';src: url('fonts/cour.eot');src: local('☺'), url('fonts/cour.woff') format('woff'), url('fonts/cour.ttf') format('truetype'), url('fonts/cour.svg') format('svg');font-weight: normal;font-style: normal;}
@font-face {font-family: 'TypeOneWF';src: url('fonts/TypeOneWF.eot?#iefix') format('embedded-opentype'),  url('fonts/TypeOneWF.otf')  format('opentype'),url('fonts/TypeOneWF.woff') format('woff'), url('fonts/TypeOneWF.ttf')  format('truetype'), url('fonts/TypeOneWF.svg#TypeOneWF') format('svg');font-weight: normal;font-style: normal;}
@font-face {font-family: 'Olicana-Fine';src: url('fonts/2CCFA9_0_0.eot');src: url('fonts/2CCFA9_0_0.eot?#iefix') format('embedded-opentype'),url('fonts/2CCFA9_0_0.woff2') format('woff2'),url('fonts/2CCFA9_0_0.woff') format('woff'),url('fonts/2CCFA9_0_0.ttf') format('truetype');}
@font-face {font-family: 'Wausau';src: url('fonts/2CCFA9_1_0.eot');src: url('fonts/2CCFA9_1_0.eot?#iefix') format('embedded-opentype'),url('fonts/2CCFA9_1_0.woff2') format('woff2'),url('fonts/2CCFA9_1_0.woff') format('woff'),url('fonts/2CCFA9_1_0.ttf') format('truetype');}
/* ------------------------ Font Face end -------------------------- */

/* ------------------------ Homepage CSS start -------------------------- */
.topBg{ background:url(images/banrtopBg.gif) no-repeat 100% 0; padding:20px 0 0 0;}
.leftPan{ width:40%; float:left;}
.logo{ width:50%; float:left;}
.outsideNav { width:39%; float:left;}
.togleMenu{ background:url(images/nav-icon.png) no-repeat 100% 50%; height:24px; width:auto; display:none; font-size:18px; line-height:24px; padding:0 35px 0 0; color:#382b1a; position: absolute; right: 5%; top: 3.5%; z-index:1000;}
.navPan ul{ width:50%; float:right; text-align:right;}
.navPan ul li{ font-family: 'Wausau'; font-size:24px; line-height:24px; padding:0 0 3px;}
.navPan ul li a{ padding:0 50px 0 0; display:block;}
.navPan ul li a:hover, .navPan ul li.current-menu-item a{ background:url(images/nav-hover.png) no-repeat 100% 0;}
.contentPan{ padding:16.5% 0 0 0; clear:both; position:relative;}
.outsideContent{width:40%; float:left; clear:inherit; padding:6% 0 0 0; position:relative;}
.outsideBlog{width:40%; float:none; clear:inherit; margin:30% 0 0 0; padding:0; }
.contentPic{ width:46%; position:absolute; right:-32px; z-index:10; -ms-transform: rotate(4deg); /* IE 9 */-webkit-transform: rotate(4deg); /* Chrome, Safari, Opera */ transform: rotate(4deg);}
.contentPic img{ display:block; width:100%; height:auto;}
.contentPan h1{font-family: 'Wausau'; font-size:42px; line-height:42px; padding:0 40% 10% 0;}
.contentPan p{ padding:0 0 20px;}
.contentPan ul{margin:0 0 0 -55px;}
.contentPan ul li{ font-family: 'Wausau'; background:url(images/hand-bullet.png) no-repeat 0 0; font-size:24px; line-height:24px; padding:5px 0 20px 60px;}

.rightPan{ width:60%; float:right;}
.bannerOutside{ float:right; width:60%;}
.bannerPan{width:105%; position:relative; right:-18px; }
.imgBorder{width:100%; overflow:hidden; height:100%; border-style: solid; border-width: 5px 6px 5px 5px; -moz-border-image: url(images/border.png) 5 6 5 5; -webkit-border-image: url(images/border.png) 5 6 5 5; -o-border-image: url(images/border.png) 5 6 5 5; border-image: url(images/border.png) 5 6 5 5 round;}

.bannerPan img{ display:block; width:100%; height:auto;}
.graphicsPan{ margin:-6% 0 0 0; position:relative;}
.graphicsPan img{ display:block; width:100%; height:auto;}
.picOne{width:53%; float:left; margin:0 0 0 10%; -ms-transform: rotate(-3deg); /* IE 9 */-webkit-transform: rotate(-3deg); /* Chrome, Safari, Opera */ transform: rotate(-3deg);}
.graphicsPan big{ display:block; width:36.4%; font-family: 'Olicana-Fine'; font-size:64px; line-height:64px; float:right; color:#382b1a; padding:13% 0 0 0;}
.graphicsPan big span{ padding:0 0 0 20%;}
.picTwo{width:30%; position:relative; z-index:10; top:0; margin:6% 0 0 7%; -ms-transform: rotate(3deg); /* IE 9 */-webkit-transform: rotate(3deg); /* Chrome, Safari, Opera */ transform: rotate(3deg);}
/* ------------------------ Homepage CSS end -------------------------- */

/* ------------------------ Footer CSS start -------------------------- */
.footerWrap{ background:url(images/ftr-bg.gif) repeat-x 0 0; max-width:1400px; margin:0 auto;}
.ftrBg{ background-image:url(images/ftr-left.gif), url(images/ftr-right.gif); background-repeat:repeat-y; background-position:top left, top right; padding:0 73px 0 65px; position:relative;}
.labelTag{ background:url(images/label.png) no-repeat 0 0; width:359px; height:270px; position:absolute; bottom:0; right:30%; }
.tagBox{font-family: 'Wausau'; font-size:24px; line-height:24px; padding:39% 0 0 30%; -ms-transform: rotate(-13deg); /* IE 9 */-webkit-transform: rotate(-13deg); /* Chrome, Safari, Opera */ transform: rotate(-13deg);}
.tagBox p{ padding:0 0 10px;}
.tagBox span{ display:block;}
.knife{width:8.5%; position:absolute; bottom:4%; right:18.5%; -ms-transform: rotate(7deg); /* IE 9 */-webkit-transform: rotate(7deg); /* Chrome, Safari, Opera */ transform: rotate(7deg);}
.ant{width:14%; position:absolute; bottom:40%; right:6%;}
.ant img{ width:100%; height:auto;}
.knifeStraight{width:10%; position:absolute; bottom:60%; left:6%;}
.frok{width:4.5%; position:absolute; bottom:60%; left:9.5%;}
.knifeTilt{width:10%; position:absolute; bottom:0; left:33%; -ms-transform: rotate(8deg); /* IE 9 */-webkit-transform: rotate(8deg); /* Chrome, Safari, Opera */ transform: rotate(8deg);}
.frokTilt{width:6%; position:absolute; bottom:250%; left:13.5%; -ms-transform: rotate(50deg); /* IE 9 */-webkit-transform: rotate(50deg); /* Chrome, Safari, Opera */ transform: rotate(50deg);}
.alice{width:17%; position:absolute; bottom:50%; left:10%;}
.ftrBg .left{ font-size:14px; line-height:24px; width:55%; float:left; padding:6% 0 1.9%;}
.ftrBg .right{ font-size:14px; line-height:24px; width:39%; text-align:right; float:right; padding:6% 0 1.9%;}
.ftrBg .right.fHome{ background:url(images/pattern.gif) repeat 0 0;}
.ftrBg .right.fInr{ background:url(images/ftr-pattern.gif) no-repeat 100% 100%;}
.ftrBg .right img{ display:block; width:auto; height:auto; float:right; margin:0 0 0 10px;}
.facebook{ margin:0 0 0 2%;}
/* ------------------------ Footer CSS end -------------------------- */

/* ------------------------ Content CSS start -------------------------- */
.rightContent{ padding:7% 0 30% 2%;}
.rightContent h1{font-family: 'Wausau'; font-size:42px; line-height:42px; padding:0 0 30px;}
.rightContent h2{font-family: 'Wausau'; font-size:24px; line-height:24px; padding:10px 0 10px;}
.rightContent h3{font-family: 'Conv_cour'; font-weight:bold; font-size:19px; line-height:24px; padding:10px 0 10px;}
.rightContent h4{font-family: 'Conv_cour'; font-weight:bold; font-size:17px; line-height:22px; padding:5px 0 40px;}
.contentrightPic{ width:36%; float:left; margin:0 3% 5% 0; -ms-transform: rotate(-3deg); /* IE 9 */-webkit-transform: rotate(-3deg); /* Chrome, Safari, Opera */ transform: rotate(-3deg);}
.contentrightPic img{ display:block; width:100%; height:auto; }
.rightContent p{ font-size:16px; line-height:24px; padding:0 0 18px;}
.rightContent p em{ font-style:italic;}
.rightContent p strong{ font-weight:bold;}
.rightContent p a, .rightContent ul li a { color:#990000; font-weight:bold;}
.rightContent ul{ padding:0 0 5px; display:inline-block;}
.rightContent ul li{ background:url(images/arrow-bullet.gif) no-repeat 0 5px; padding:0 0 15px 40px; font-size:16px; line-height:24px;}
.contentPicinr{ width:110%; position:absolute; left:-10%; top:30%; z-index:10; -ms-transform: rotate(4deg); /* IE 9 */-webkit-transform: rotate(4deg); /* Chrome, Safari, Opera */ transform: rotate(4deg);}
.contentPicinr2{ width:60%; position:absolute; left:30%; top:30%; margin:62% 0 0 0; z-index:10; -ms-transform: rotate(-4deg); /* IE 9 */-webkit-transform: rotate(-4deg); /* Chrome, Safari, Opera */ transform: rotate(-4deg);}
.contentPicinr img, .contentPicinr2 img{ display:block; width:100%; height:auto;}
/* ------------------------ Content CSS end -------------------------- */

/* ------------------------ Cafe CSS start -------------------------- */
.leftGrphics{ margin:0 0 340% 0;}
.cafePic1{ width:54%; position:absolute; left:3%; top:0; margin:12% 0 0 0; z-index:10; -ms-transform: rotate(4deg); /* IE 9 */-webkit-transform: rotate(4deg); /* Chrome, Safari, Opera */ transform: rotate(4deg);}
.cafePic2{ width:85%; position:absolute; left:10%; top:0; margin:50% 0 0 0; z-index:5; -ms-transform: rotate(-4deg); /* IE 9 */-webkit-transform: rotate(-4deg); /* Chrome, Safari, Opera */ transform: rotate(-4deg);}
.cafePic3{ width:54%; position:absolute; left:10%; top:0; margin:170% 0 0 0; z-index:10; -ms-transform: rotate(-4deg); /* IE 9 */-webkit-transform: rotate(-4deg); /* Chrome, Safari, Opera */ transform: rotate(-4deg);}
.cafePic1 img, .cafePic2 img, .cafePic3 img{ display:block; width:100%; height:auto;}
.rightLcontent{ width:50%; float:left; padding:3% 0 0 0;}
.rightLcontent img{ width:100%; height:auto; display:block;}
.rightRcontent{ width:42%; float:right; padding:3% 0 0 0;}
.rightRcontent span{ display:block;}
/* ------------------------ Cafe CSS end -------------------------- */

/* ------------------------ Menu CSS start -------------------------- */
.boxPan .box{ width:33%; float:left; margin:0 0.3% 0 0;}
.boxPan .box img{ display:block; width:100%; height:auto;}
.boxPan .box h3{ font-family: 'Wausau'; font-size:24px; text-align:center; padding:10px 0 30px 0;}
.boxPan .box:nth-child(odd){ -ms-transform: rotate(-1deg); /* IE 9 */-webkit-transform: rotate(-1deg); /* Chrome, Safari, Opera */ transform: rotate(-1deg);}
.boxPan .box:nth-child(even){-ms-transform: rotate(1deg); /* IE 9 */-webkit-transform: rotate(1deg); /* Chrome, Safari, Opera */ transform: rotate(1deg);}
.leftMenupic{ position:relative;}
.spoon{width:32%; position:absolute; top:0; left:20%; -ms-transform: rotate(12deg); /* IE 9 */-webkit-transform: rotate(12deg); /* Chrome, Safari, Opera */ transform: rotate(12deg);}
/* ------------------------ Menu CSS end -------------------------- */

/* ------------------------ Blog CSS start -------------------------- */
.blogLeft{ padding:0 0 140%;}
.blogLeft h1{ width:100%; padding:0 0 24px;}
.blogLeft h2{ font-family: 'Wausau'; font-size:36px; line-height:36px; padding:0 0 24px;}
.blogLeft a:hover{ color:#000;}
.blogLeft big{ display:block; width:60%; font-family: 'Olicana-Fine'; font-size:64px; line-height:64px; color:#382b1a; padding:8% 0 0 0;}
.blogLeft p{ padding:0 18% 24px 0;}
.blogLeft big span{ padding:0 0 0 20%;}
.blogBlock{ background:url(images/divider.png) no-repeat 0 100%; margin:0 0 3%; padding:0 0 1%; height:auto; overflow:hidden;}
.blog .blogBlock:nth-child(5){ background:none;}
.archive .blogBlock:nth-child(6){ background:none;}
.blogBlock img{ display:block; float:right; width:38%; margin:0 0 0 4%; -ms-transform: rotate(2deg); /* IE 9 */-webkit-transform: rotate(2deg); /* Chrome, Safari, Opera */ transform: rotate(2deg);}
.alignleft{ float:left; width:38%; margin:0 3% 4% 0; -ms-transform: rotate(2deg); /* IE 9 */-webkit-transform: rotate(2deg); /* Chrome, Safari, Opera */ transform: rotate(2deg);}
.alignleft img{ display:block; width:100%; height:auto;}
.blogBlock h2{ padding:0 0 10px;}
.blogBlock a{ padding:0 0 10px; color:#990000;}
.blogBlock a:hover{ color:#000;}
.datePan{ padding:0 0 2%; font-size:16px; line-height:24px;}
.blogBlock p{font-size:16px; line-height:24px; padding:0 0 24px;}
.pagination{ font-family: 'Wausau'; font-size:21px; line-height:25px; color:#990000; clear:both; position:relative; z-index:100;}
.pagination a{color:#990000; padding:0 2% 0 0; display:inline-block;}
.pagination span{ display:inline-block; padding:0 2% 0 0; color:#000;}
.pagination a:hover{color:#000;}
.commentPan{width:98%; background-image:url(images/divider.png), url(images/divider.png); background-repeat:repeat-x; background-position:left top, left bottom; padding:5% 0; margin:4% 0 0 0; clear:both;}
.commentPan h3{font-family: 'Wausau'; font-size:24px; line-height:30px; color:#666; padding:0 0 18px;}
.rightPan label{font-size:18px; line-height:24px; font-weight:bold; color:#666; display:block; padding:0 0 5px;}
.rightPan label small{font-weight:normal;}
.rightPan input[type='text'], .rightPan input[type='email'], .rightPan input[type='password'], .rightPan input[type='search']{ font-family: 'Conv_cour'; display:block; width:70%; padding:10px; color:#666; font-size:16px; height:25px; line-height:25px; border:solid 1px #d7d7d6; background:#fff; margin:0 0 1%;}
.rightPan textarea{ font-family: 'Conv_cour'; display:block; width:95%; padding:10px; color:#666; font-size:16px; height:200px; overflow:auto; resize:none; line-height:25px; border:solid 1px #d7d7d6; background:#fff; margin:0 0 3%;}
.rightPan input[type='submit']{ font-family: 'Wausau'; width:auto; padding:0; color:#990000; font-size:24px; height:30px; line-height:30px; border:0; background:transparent; margin:0 0 2%; cursor:pointer;}
.acf-map {width: 100%; height: 300px; border:0; margin: 0;}
.catDropdwn{ display:none;}
.select{position:relative; padding:0 0 8px 0;}
.select select { font-family: "Wausau"; font-size:26px; line-height:26px; -webkit-appearance: none; -moz-appearance: none; appearance: none; height:35px; border:0; width:100%; color:#382b1a; text-indent: 0; background:none;}
.select:before{content:''; pointer-events:none; height:35px; width:18px; position:absolute; right:0px; background:url(images/select-bg.gif) no-repeat 0 9px;z-index:50;}
.relatedPost{ padding:24px 0 0 0;}
/* ------------------------ Blog CSS end -------------------------- */

/* ------------------------ Responsive Style start CSS -------------------------- */
@media all and (max-width : 1300px) and (min-width : 1024px) {
	.topBg{ background-size:59%;}
	.outsideNav, .leftPan{ margin:0 0 0 -5%; width:50%;}
	.rightPan, .bannerOutside {width: 55%;}
	.outsideContent{ width:42%;}
	.bannerPan{ width:110%;}
	.contentPic{ width:42%;}
	.picOne{ width:50%;}
	.labelTag {bottom:0; right: 35%; height:220px; width: 300px; background-size:100%;}
	.tagBox{ font-size:18px; line-height:18px;}
	.tagBox p {padding: 0 0 5px;}
	.ftrBg .left{ padding:9.5% 0 1%;}
	.ftrBg .right{ padding:8% 0 1.9%;}
	.knife{bottom:30%; right:20%; width:7%;}
	.ant{ right:8%;}
	.blogLeft p{ padding:0 16% 24px 0;}
	.outsideBlog{ margin:40% 0 0 0;}
}

@media all and (max-width : 1023px) and (min-width : 768px) {
	.togleMenu{ display:block;}
	.nav-menu{display:none; position:absolute; width:173px; height:auto; background:#efe4c0; right:5%; top:6%; z-index:100;}
	.navPan ul{ width:180px; padding:10px 0;}
	.navPan ul li{ font-size:18px; line-height:18px;}
	.navPan ul li a{ padding:0 35px 0 10px;}
	.navPan ul li a:hover, .navPan ul li.current-menu-item a{ background:url(images/nav-hover.png) no-repeat 95% 0; background-size:25px;}
	.rightPan, .bannerOutside {width: 62%; padding:8% 0 0;}	
	.outsideNav { width:38%;}
	.outsideNav .logo{ width:80%;}
	.bannerPan {right: 0;width: 102%;}
	.picOne {margin: 0 0 0 -10%; width: 43%;}
	.graphicsPan big {font-size: 47px;line-height: 47px;padding: 15% 0 0; width: 58%;}
	.graphicsPan big span{ padding:0;}
	.picTwo {left:-57%; margin:0; position:absolute; top:10%; width: 28%;}
	.responsiveConpic {width:32%; position:absolute; right:4%; top:-50%; z-index:10; -ms-transform: rotate(4deg); /* IE 9 */-webkit-transform: rotate(4deg); /* Chrome, Safari, Opera */ transform: rotate(4deg);}
	.contentPan h1{ padding:0 5% 4% 0;}
	.contentPan ul {margin: 0 0 0 -36px;}
	.contentPan ul li{ background-size:38px; padding:5px 0 20px 50px; background-position:0 8px;}
	.wrapBg {background-size: 30px auto;padding: 0 21px 0 30px;}
	.home .topBg{ background-size:60%; padding:20px 0 16% !important;}
	.topBg{background-size:60%; padding:20px 0 0 !important;}
	.outsideContent {clear: both; float:none; padding:3% 0 0 2%; width: 100%;}
	.knife {bottom: 90%; right: 21.5%; width: 3.2%;}
	.ant {bottom: 150%; right: 9%; width: 10%;}
	.ftrBg{background-size: 38px auto;padding: 0 21px 0 30px;}
	.labelTag {bottom:60%; height:200px; right: 30%; width:250px; background-size:100%;}
	.tagBox {font-size: 14px; line-height: 14px;}
	.tagBox p {padding: 0;}
	.footerWrap{ background-size:66%;}
	.facebook{ display:inline-block; margin:5px 0 0 8px; width: 20px;}
	.ftrBg .left { bottom: 47%; float: none; font-size: 12px; line-height: 16px; padding:0 70px 0 0; position: absolute; right: 0; width: 100%; text-align:right;}
	.ftrBg .right{ font-size:12px; padding:6% 0 .8%;}
	.leftPan{ float:none; width:100%;}
	.leftPan .contentPan{ clear:inherit;}
	.contentPicinr {left: inherit; right: 0; top: 35%; width: 56%;}
	.contentPicinr2 {left: inherit; margin: 0 ; right: 32%; top: 100%; width: 26%;}
	.responsiveRightpan{ float:none; width:100%; clear:both;}
	.responsiveRightpanmenu{ float:none; width:100%; clear:both; padding:0;}
	.knifeStraight {bottom: 0;left: 6%;width: 3%;}
	.knifeStraight img{ width:100%; height:auto;}
	.frok{ left:11%; bottom:0;}
	.spoon { left: inherit; right: 25%; top: -140px; -ms-transform: rotate(-50deg); /* IE 9 */-webkit-transform: rotate(-50deg); /* Chrome, Safari, Opera */ transform: rotate(-50deg); width: 14%;}
	.knifeTilt {bottom: 0; left: 28%; width: 3.4%;}
	.frokTilt {bottom: 150%; left: 9.5%; width: 4%;}
	.alice {bottom: 50%; left: 10%; width: 15%;}
	.cafePic1 {left: 2%; margin: 0; top: -100%; width: 20%; z-index: 10;}
	.cafePic2 {left: 10%; margin: 0; top: 100%; width: 26%;z-index: 5;}
	.cafePic3 {left: 28%; margin: 0; top: 220%; width: 20%; z-index: 0;}
	.leftGrphics {margin: 0;}
	.rightCafecontent h1{ display:none;}
	.rightCafecontent { position:relative; padding: 28% 0 35% 2%;}
	.rightCafecontent p.first{padding: 0 4% 0 50%; position: absolute; top: -3%; left:0;}
	.blogLeft aside{ display:none;}
	.catDropdwn{ width:165px; display:block; float:left;}
	.blogLeft {padding: 0;}
	.blogLeft big {float: right;font-size: 35px;line-height: 35px;padding: 0 5% 0 0;text-align: right;width: 50%;}
	.blogLeft big span {padding: 0;}
	.responsiveRightblog{ padding:0; float:none; clear:both; width:100%;}
	.blogBlock img{ width:30%;}
	.outsideBlog {clear: inherit; float: none; margin: 0; padding: 0 0 40%; width: 100%;}
	.rightContsingle{ padding:7% 0 3% 2%;}
	.alignleft {float: none; margin: 0; position: absolute; right: 4%; top: 8%; width: 30%;}
	.blogLeft p{ padding:0 3% 24px 0;}
}

@media all and (max-width : 767px) and (min-width : 480px) {
	.togleMenu{ display:block; top:7.5%;}
	.nav-menu{display:none; position:absolute; width:173px; height:auto; background:#efe4c0; right:5%; top:16%; z-index:100;}
	.navPan ul{ width:180px; padding:10px 0;}
	.navPan ul li{ font-size:18px; line-height:18px;}
	.navPan ul li a{ padding:0 35px 0 10px;}
	.navPan ul li a:hover, .navPan ul li.current-menu-item a{ background:url(images/nav-hover.png) no-repeat 95% 0; background-size:25px;}
	.rightPan, .bannerOutside {width: 62%; padding:50px 0 0;}	
	.outsideNav { width:38%;}
	.outsideNav .logo{ width:80%;}
	.logo{ width:36%;}
	.logo img{ width:100%; height:auto;}
	.bannerPan {right: 0;width: 102%;}
	.picOne {margin: 0 0 0 -10%; width: 42%;}
	.graphicsPan big { font-size: 33px; line-height: 33px; padding: 15% 0 0; width: 64%;}
	.graphicsPan big span{ padding:0;}
	.picTwo {left:-57%; margin:0; position:absolute; top:10%; width: 28%;}
	.responsiveConpic {width:32%; position:absolute; right:4%; top:-50%; z-index:10; -ms-transform: rotate(4deg); /* IE 9 */-webkit-transform: rotate(4deg); /* Chrome, Safari, Opera */ transform: rotate(4deg);}
	.contentPan h1{ padding:0 5% 4% 0;}
	.contentPan ul {margin: 0 0 0 -36px;}
	.contentPan ul li{ background-size:38px; padding:5px 0 20px 50px; background-position:0 8px;}
	.wrapBg {background-size: 30px auto;padding: 0 21px 0 30px;}
	.home .topBg{ background-size:60%; padding:20px 0 55% !important;}
	.topBg{background-size:60%; padding:20px 0 0 !important;}
	.outsideContent {clear: both; float:none; padding:3% 0 0 2%; width: 100%;}
	.knife { bottom: 2%;left: 12%;right: inherit; width: 5.5%;}
	.ant {bottom: 90%; right: inherit; left:20%; width: 15%;}
	.ftrBg{background-size: 24px auto;padding: 0 21px 0 30px;}
	.labelTag {bottom:90%; height: 200px; right: 10%; width: 250px; background-size:100%;}
	.tagBox {font-size: 14px; line-height: 14px;}
	.tagBox p {padding: 0;}
	.footerWrap{ background-size:66%;}
	.facebook{ display:inline-block; margin:5px 0 0 8px; width: 20px;}
	.ftrBg .left { bottom: 47%; float: none; font-size: 12px; line-height: 16px; padding:0 70px 0 0; position: absolute; right: 0; width: 100%; text-align:right;}
	.ftrBg .right{ font-size:12px; padding:6% 0 .8%; width:60%;}
	.leftPan{ float:none; width:100%;}
	.leftPan .contentPan{ clear:inherit; padding:30% 0 0;}
	.contentPicinr {left: inherit; right: 0; top: 35%; width: 54%;}
	.contentPicinr2 {left: inherit; margin: 0 ; right: 38%; top: 90%; width: 22%;}
	.responsiveRightpan{ float:none; width:100%; clear:both;}
	.responsiveRightpanmenu{ float:none; width:100%; clear:both; padding:0;}
	.knifeStraight {bottom: 0;left: 6%;width: 3%;}
	.knifeStraight img{ width:100%; height:auto;}
	.frok{ left:11%; bottom:0;}
	.spoon { left: inherit; right: 25%; top: -190px; -ms-transform: rotate(-50deg); /* IE 9 */-webkit-transform: rotate(-50deg); /* Chrome, Safari, Opera */ transform: rotate(-50deg); width: 14%;}
	.knifeTilt {bottom: 0; left: 28%; width: 3.4%;}
	.frokTilt {bottom: 150%; left: 9.5%; width: 4%;}
	.alice {bottom: 50%; left: 10%; width: 15%;}
	.boxPan .box{ width:49.5%;}
	.cafePic1 {left: 42%; margin: 0; top: 100%; width: 20%; z-index: 10;}
	.cafePic2 {left: 6%; margin: 0; top: -320%; width: 26%;z-index: 5;}
	.cafePic3 {left: 65%; margin: 0; top: 90%; width: 20%; z-index: 0;}
	.leftGrphics {margin: 0;}
	.rightCafecontent h1{ display:none;}
	.rightCafecontent { position:relative; padding: 15% 0 35% 2%;}
	.rightCafecontent p.first{padding: 0 0 18px; position: inherit; top: 0; left:0;}
	.blogLeft aside{ display:none;}
	.catDropdwn{ width:165px; display:block; float:none;}
	.blogLeft {padding: 0;}
	.blogBlock{ background-size:65%;}
	.blogLeft big {float: none; font-size: 35px;line-height: 35px;padding: 0 5% 0 0; text-align: left; width: 90%;}
	.blogLeft big span {padding: 0;}
	.responsiveRightblog{ padding:0; float:none; clear:both; width:100%;}
	.blogBlock img{ width:30%; margin:0 0 5% 4%;}
	.outsideBlog {clear: inherit; float: none; margin: 0; padding: 0 0 40%; width: 100%;}
	.rightContsingle{ padding:7% 0 3% 2%;}
	.alignleft {float: none; margin: 0; position: absolute; right: 4%; top: 18%; width: 30%;}
	.blogLeft p{ padding:0 4% 24px 0;}
}

@media all and (max-width : 479px){
	.togleMenu{ display:block; top:3%;}
	.nav-menu{display:none; position:absolute; width:173px; height:auto; background:#efe4c0; right:5%; top:7%; z-index:100;}
	.navPan ul{ width:180px; padding:10px 0;}
	.navPan ul li{ font-size:18px; line-height:18px;}
	.navPan ul li a{ padding:0 35px 0 10px;}
	.navPan ul li a:hover, .navPan ul li.current-menu-item a{ background:url(images/nav-hover.png) no-repeat 95% 0; background-size:25px;}
	.rightPan, .bannerOutside {width: 62%; padding:40px 0 0;}
	.outsideNav { width:38%;}
	.outsideNav .logo{ width:80%;}
	.logo{ width:36%;}
	.logo img{ width:100%; height:auto;}
	.bannerPan {right: 0; width: 104%;}
	.picOne {margin: 0 0 0 -10%; width: 37%;}
	.graphicsPan{ margin:-20% 0 0;}
	.responsiveTag { font-family:"Olicana-Fine"; font-size: 30px; line-height: 30px; padding: 1% 0 7% 0; width: 100%;}
	.responsiveTag span{ padding:0;}
	.picTwo {left:-57%; margin:0; position:absolute; top:10%; width: 28%;}
	.responsiveConpic {width:32%; position:absolute; right:4%; top:-25%; z-index:10; -ms-transform: rotate(4deg); /* IE 9 */-webkit-transform: rotate(4deg); /* Chrome, Safari, Opera */ transform: rotate(4deg);}
	.contentPan h1, .rightContent h1{ padding:0 5% 4% 0; font-size:30px; line-height:30px;}
	.contentPan ul {margin: 0;}
	.contentPan ul li{ background-size:26px; padding:5px 0 20px 32px; background-position:0 8px;}
	.wrapBg {background-size: 15px auto;padding: 0 15px;}
	.home .topBg{ background-size:60%; padding:20px 0 67% !important;}
	.topBg{background-size:60%; padding:20px 0 20% !important;}
	.outsideContent {clear: both; float:none; padding:3% 0 0 2%; width: 100%;}
	.knife { bottom: 2%;left: 12%;right: inherit; width: 5.5%;}
	.ant {bottom: 90%; right: inherit; left:20%; width: 15%;}
	.ftrBg{background-size: 17px auto; padding: 0 15px;}
	.labelTag {bottom:100%; height: 200px; right: 5%; width: 250px; background-size:100%;}
	.tagBox {font-size: 14px; line-height: 14px;}
	.tagBox p {padding: 0;}
	.footerWrap{ background-size:66%;}
	.facebook{ display:inline-block; margin:5px 0 0 8px; width: 20px;}
	.ftrBg .left { bottom: 72%; float: none; font-size: 12px; line-height: 16px; padding:0 20px 0 0; position: absolute; right: 0; width: 100%; text-align:right;}
	.ftrBg .right{ font-size:12px; padding:6% 0 .8%; width:101%;}
	.ftrBg .right a{ display:block; clear:both;}
	.responsive-ftr-bg{ display:block; background:url(images/responsive-ftr-bg.gif) no-repeat 0 100%; height:100%; overflow:hidden;}
	.leftPan{ float:none; width:100%;}
	.leftPan .contentPan{ clear:inherit; padding:27.5% 0 0;}
	.contentPicinr {left: inherit; right: 0; top: 35%; width: 56%;}
	.contentPicinr2 {left: inherit; margin: 0 ; right: 32%; top: 100%; width: 26%;}
	.responsiveRightpan{ float:none; width:100%; clear:both;}
	.responsiveRightpanmenu{ float:none; width:100%; clear:both; padding:0;}
	.knifeStraight {bottom: 0;left: 6%;width: 5%;}
	.knifeStraight img{ width:100%; height:auto;}
	.frok{ left:13%; bottom:0; width:7.5%;}
	.spoon { left: inherit; right: 25%; top: -100px; -ms-transform: rotate(-50deg); /* IE 9 */-webkit-transform: rotate(-50deg); /* Chrome, Safari, Opera */ transform: rotate(-50deg); width: 14%;}
	.knifeTilt {bottom: 0; left: 28%; width: 3.4%;}
	.frokTilt {bottom: 110%; left: 9.5%; width: 4%;}
	.alice {bottom: 50%; left: 10%; width: 15%;}
	.boxPan .box{ width:49.5%;}
	.cafePic1 {left: 42%; margin: 0; top: 100%; width: 20%; z-index: 10;}
	.cafePic2 {left: 6%; margin: 0; top: -320%; width: 26%;z-index: 5;}
	.cafePic3 {left: 65%; margin: 0; top: 90%; width: 20%; z-index: 0;}
	.leftGrphics {margin: 0;}
	.rightCafecontent h1{ display:none;}
	.rightCafecontent { position:relative; padding: 15% 0 35% 2%;}
	.rightCafecontent p.first{padding: 0 0 18px; position: inherit; top: 0; left:0;}
	.rightLcontent {float: none; width: 95%;}
	.rightRcontent {float: none; padding:5% 0 0; width: 95%;}
	.blogLeft aside{ display:none;}
	.catDropdwn{ width:165px; display:block; float:none;}
	.blogLeft {padding: 0;}
	.blogLeft big {float: none; font-size: 26px; line-height: 26px; padding: 0 5% 0 0; text-align: left; width: 95%;}
	.blogBlock{ background-size:100%;}
	.blogLeft big span {padding: 0;}
	.responsiveRightblog{ padding:0; float:none; clear:both; width:100%;}
	.blogBlock img{ width:30%; margin:0 0 15% 4%;}
	.outsideBlog {clear: inherit; float: none; margin: 0; padding: 0 0 40%; width: 100%;}
	.rightContsingle{ padding:7% 0 3% 2%;}
	.alignleft {float: none; margin: 0; position: absolute; right: 4%; top: 9%; width: 30%;}
	.blogLeft p{ padding:0 2% 24px 0;}
}
@media all and (max-width : 640px){
	.rightPan{
		width: 100%;
	}
	

}





/* ------------------------ Responsive Style end CSS -------------------------- */