/*   
Theme Name: thetastyother
Theme URI: http://thetastyother.com
Description: thetastyother theme
Author: ithinkmarketing
Author URI: http://ithink.gr
Version: 1.0
*/

/* Apply a natural box layout model to all elements: 
http://paulirish.com/2012/box-sizing-border-box-ftw/ */
* { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }

.chromeframe {position: absolute; top: 0;}

/* Ok, this is where the fun starts.
-------------------------------------------------------------------------------*/

@font-face{
font-family:'Museo-Regular-100';
src:url('fonts/Museo-Regular-100.eot');
src:url('fonts/Museo-Regular-100.eot?#iefix') format('embedded-opentype'),
url('fonts/Museo-Regular-100.woff') format('woff'),
url('fonts/Museo-Regular-100.ttf') format('truetype');
font-weight:normal;
font-style:normal
}
@font-face{
font-family:'Neutraface2Display-Light';
src:url('fonts/Neutraface2Display-Light.eot');
src:url('fonts/Neutraface2Display-Light.eot?#iefix') format('embedded-opentype'),
url('fonts/Neutraface2Display-Light.woff') format('woff'),
url('fonts/Neutraface2Display-Light.ttf') format('truetype');
font-weight:normal;
font-style:normal
}



/* A Linux- and Windows-friendly sans-serif font stack: 
http://prospects.mhurrell.co.uk/post/updating-the-helvetica-font-stack */
body, .more-link, input#submit {font: 14px 'Museo-Regular-100', Helmet, Freesans, sans-serif;}

/* Using local fonts? Check out Font Squirrel's webfont generator: 
http://www.fontsquirrel.com/tools/webfont-generator */

/* We like off-black for text. */
body, select, input, textarea {color: #333; -webkit-appearance: none; border-radius: 0;}

a {color: #000; text-decoration: none;}
a:hover {color: #1abc9c;}

/* Custom text-selection colors (remove any text shadows: 
	http://twitter.com/miketaylr/status/12228805301) */
::-moz-selection{background: #fcd700; color: #fff; text-shadow: none;}
::selection {background: #fcd700; color: #fff; text-shadow: none;} 

/*	j.mp/webkit-tap-highlight-color */
a:link {-webkit-tap-highlight-color: #fcd700;} 

ins {background-color: #fcd700; color: #000; text-decoration: none;}
mark {background-color: #fcd700; color: #000; font-style: italic; font-weight: bold;}

/* Mozilla dosen't style place holders by default */
input:-moz-placeholder { color:#a9a9a9; }
textarea:-moz-placeholder { color:#a9a9a9; }

/* resp images */
img, object, embed {max-width: 100%;height: auto;}


/* And here begins the WordPress fun.
-------------------------------------------------------------------------------*/

#wrapper {width: 980px; margin: 50px auto;}

.post { margin-bottom: 35px; border-bottom: 1px solid #ccc; padding-bottom: 35px;}
.post a{cof7lor: #1abc9c;}
.post h2 a {color: #000;}
.post .entry-date {color: #807f7f;}

.entry-content, .entry {font-family: 'Geneva', sans-serif; margin: 15px 0px;color: #95a5a6;}
.entry p, .entry-content p{	-webkit-margin-before: 1em;	-webkit-margin-after: 1em; margin: 1em auto;}
.entry-content a {}
.entry-content a:hover {}


#meta {}
.postmetadata {}

#sidebar {}

.navgation {}
.next-posts {}
.prev-posts {}

#searchform {}
#s {}
#searchsubmt {}
	
ol.commentlist {list-style: none;}
ol.commentlist li {}
ol.commentlist li.alt {}
ol.commentlist li.bypostauthor {}
ol.commentlist li.byuser {}
ol.commentlist li.comment-author-admin {}
ol.commentlist li.comment {border-bottom: 1px dotted #666; padding: 10px;}
ol.commentlist li.comment div.comment-author {}
ol.commentlist li.comment div.vcard {}
ol.commentlist li.comment div.vcard cite.fn {font-style: normal;}
ol.commentlist li.comment div.vcard cite.fn a.url {}
ol.commentlist li.comment div.vcard img.avatar {float:right; margin: 0 0 10px 10px;}
ol.commentlist li.comment div.vcard img.avatar-32 {}
ol.commentlist li.comment div.vcard img.photo {}
ol.commentlist li.comment div.vcard span.says {}
ol.commentlist li.comment div.commentmetadata {}
ol.commentlist li.comment div.comment-meta {font-size: 10px;}
ol.commentlist li.comment div.comment-meta a {color: #ccc;}
ol.commentlist li.comment p {}
ol.commentlist li.comment ul {}
ol.commentlist li.comment div.reply {font-size: 11px;}
ol.commentlist li.comment div.reply a {font-weight: bold;}
ol.commentlist li.comment ul.children {list-style: none; margin: 10px 0 0;}
ol.commentlist li.comment ul.children li {}
ol.commentlist li.comment ul.children li.alt {}
ol.commentlist li.comment ul.children li.bypostauthor {}
ol.commentlist li.comment ul.children li.byuser {}
ol.commentlist li.comment ul.children li.comment {}
ol.commentlist li.comment ul.children li.comment-author-admin {}
ol.commentlist li.comment ul.children li.depth-2 {border-left: 5px solid #555; margin: 0 0 10px 10px;}
ol.commentlist li.comment ul.children li.depth-3 {border-left: 5px solid #999; margin: 0 0 10px 10px;}
ol.commentlist li.comment ul.children li.depth-4 {border-left: 5px solid #bbb; margin: 0 0 10px 10px;}
ol.commentlist li.comment ul.children li.depth-5 {}
ol.commentlist li.comment ul.children li.odd {}
ol.commentlist li.even {background: #fff;}
ol.commentlist li.odd {background: #f6f6f6;}
ol.commentlist li.parent {border-left: 5px solid #111;}
ol.commentlist li.thread-alt {}
ol.commentlist li.thread-even {}
ol.commentlist li.thread-odd {}



header{
	background-color: #ffffff;
	border-bottom: 1px solid #d1d3d4;
}
header h1 {
	font-family: 'Neutraface2Display-Light';
	font-size: 80px;
	font-weight: normal;
	margin-top: 20px;
	display: inline-block;
	letter-spacing: -2px;
}
header a{color:#3c3c3c; text-decoration:none;}
header #wrapper {margin:0px auto;}
#sidebar-column{	
	width: 300px;
	float: right;
	position: relative;
}
.sidebar {
	background: #ffffff;
	color: #8c8c91;
	padding: 15px;
	position: relative;
	margin-bottom: 15px;
	text-align: center;
}
.sidebar h2, .sidebar h3{
	
	font-size: 22px;
	font-weight: normal;
	text-transform: capitalize;
	color: #000;
	margin-top: 0px;
	margin-bottom: 10px;
	display: block;
}
.sidebar hr{
	width: 66%;
	margin: auto;
}
.sidebar-borderinside{
	padding:10px 10px 7px 10px; 
	background-color: #fff;
}

.sidebar-text-2 {padding: 0;background: transparent;}
.sidebar-text-2 h3 {display:none;}
.sidebar-text-2 a {
	background-color: #fff;
	border: 2px solid #1abc9c;
	color: #1abc9c;
	width:100%;
	line-height: 60px;
	display: table;
	font-size: 22px;
	border-radius: 4px;
	text-align: center;
}
.sidebar-text-2 a:hover {background-color:#1abc9c;color: #fff;}

#main {
  float: left;
  position: relative;
  width: 600px; 
}
#main.full {
    float: none;
    width: 100%; 
}

#content {
	float: left;
	width: 620px;
	margin-right: 60px;
}

article h1, article h2{
	font-size: 32px;font-weight: normal;
}
.cat18{
	font-size: 18px;
	color: #807f7f;
}
#nav {
	border-top: 1px solid #d1d3d4;
	font-size: 0.1px;
	line-height: 1;
	text-align: justify;
	text-transform: uppercase;
	margin-top: 4px;
}
#nav div{float:left; display: inline-block;}
#nav li {
	display: inline-block;
	position:relative;
	font-size: 20px;
	letter-spacing: 1px;
	border-left: 1px solid #d1d3d4;
	padding: 20px 0px 16px;

}
#nav li:first-child {
	border-left: 0px;
}
#nav li:first-child a {
	padding-left: 0px;
}
#nav li a {
	
	display: block;
	line-height: 1;
	padding: 0px 18px;
}
/* sub menu */
#nav li>ul.sub-menu {
    display: none;
    position: absolute; top: 58px;
    background: #fff;
    border: 1px solid #ccc;
    z-index:3;
}
#nav li:hover>ul.sub-menu {
    display: block;
}
#nav li:last-child>ul.sub-menu {
    right: 0;
}
#nav li.visible>ul.sub-menu {
    display: block;
    z-index: 10;
}
#nav li>ul.sub-menu>li>a {
	display: block;
    width: 220px;
    font-size: 18px;
    padding: 15px 10px;
    text-align: left;
}
#nav li>ul.sub-menu>li>a:hover {
	background-color: #F7F7F8; 
}
#nav li>ul.sub-menu>li {
    border: 0 none;
   	border-bottom: 1px solid #ccc;
   	padding: 0;
}
#nav li>ul.sub-menu>li:last-child {
    border: 0 none;
}
.sub-menu{
	display: none;
}



#nav form {
    border: 1px solid #d1d3d4;
    float: right;
    margin: 16px 0px;
    display: inline-block;
}
    #nav form:after { content: ""; display: table; clear: both; }
    #nav form div{ background-color: #fff; position: relative; }
    #nav form input { background: none; border: none; display: block; float: left; height: 24px; font-size:14px;width: inherit;}
    #nav form input[type=text] {/* border-right: 1px solid #d1d3d4;*/width: 125px; }
    #nav form input[type=submit] {
      background-image: url(images/search.jpg);
      /*background-image: url(../imgs/search.svg);*/
      background-position: 50% 50%;
      background-repeat: no-repeat;
      text-indent: -9999px;
      width: 18px; height: 24px;position:absolute;right: 0;}

.nav form { border: 1px solid #d1d3d4; display: inline-block; position: relative; top: -1px; vertical-align: middle; }
    .nav form:after { content: ""; display: table; clear: both; }
    .nav form input { background: none; border: none; display: block; float: left; }
    .nav form input[type=text] { border-right: 1px solid #d1d3d4; width: 125px; }
    .nav form input[type=submit] { background-image: url(../images/search.png); background-image: url(../images/search.svg); background-position: 50% 50%; background-repeat: no-repeat; text-indent: -9999px; width: 18px; }




#footer {
	clear:right;
}
/* old pin widg*/
#pinimgs {
	margin: 0 0 10px !important;
	background-color: #ffffff;
	display: inline-block !important;
	padding-bottom: 10px !important;
}
#pinimg {
	margin: 0 !important;
	width: 100% !important;
	height: auto !important;
	padding: 10px 10px 0 10px !important;
}
#pinbadgewrapper {
	width: 100% !important;
	border: 0;
}

/*pin rss*/ 
.pins-feed-list {background: #fff;}
.pins-feed-list li+li+li .pins-feed-small{padding-bottom: 8px !important;}
.pins-feed-item{margin: 0 !important;float: left;width: 100% !important;}
.pins-feed-small {width: 100%;padding: 10px; padding-bottom: 0;}
.pins-feed-small img{max-width: 100%;width: 100%;}
#pins-feed-follow {padding: 0!important;margin: 20px auto 10px auto;}

/*pin btt*/
.pibfi_pinterest {display: block !important;}
.pibfi_pinterest .xc_pin {
	width: 30px !important; 
	height: 30px !important;
	background-image: url(images/pinit.png) !important;
	left: 5px;
}

/*mailchimp*/
#mc4wp-form-1.form.mc4wp-form {
	display: table;
	width: 100%;
	margin: 0 0 8px;
}
input#mc4wp_email{width: 70%}
input#mc4wp_submit{float: right;background-color: #1abc9c !important;border-color: #1abc9c;width: 28%;padding: 0;line-height: 32px;}
/*simple img*/
.simple-image {	padding: 10px 10px 7px 10px;background-color: #fff;display: inline-block;width:270px;}

/*share wdg*/
.shareCont{display:block; position:relative; clear:both;}
.shareCont h3 {height: 60px;width: 100%;background: url(images/socialshare_bar.png) center 1px no-repeat;position: relative;text-indent: -9999px;}
.shareWrapper {text-align: center;margin: 0 auto;position: absolute;top: 0;left: 0;z-index: 2;width: 100%;background:rgba(255,255,255,.8);display:none; height: 60px;}
.shareWrapper > span {display: inline-block;margin-top: 18px;}
.shareCont:hover h3, .shareCont:focus h3{background:url(images/socialshare_bar.png) center -101px no-repeat;}
.shareCont:hover .shareWrapper, .shareCont:focus .shareWrapper{display:table-row;}

.stMainServices {height:auto !important;}
.stHBubble{display: inline-table !important;}


/******************************************************************
SOCIAL ICONS
******************************************************************/
.social-icon {
    display: inline-block;
    height: 28px;
    width: 28px;
    background-color: #fff;
    background-repeat: no-repeat;
    background-image: url(images/social-icons.png);
}
.facebook-icon { background-position: -216px -108px; }
.twitter-icon { background-position: -360px -360px; }
.pinterest-icon { background-position: -180px -288px; }
.instagram-icon { background-position: 0px -216px; }
.googleplus-icon { background-position: -36px -180px; }
.feed-icon { background-position: -108px -324px; }
.vimeo-icon { background-position: -108px -396px; }
.youtube-icon { background-position: -180px -432px; }
.tumblr-icon { background-position: -324px -360px; }

/* social icons */
ul.header-social { display:inline-block; margin-top: 10px;}
ul.header-social li { float: left; margin-left: 8px; margin-right: 8px; height: 28px; width: 28px; }
ul.header-social li>a { opacity: .7; cursor: pointer; border-radius: 14px; }
ul.header-social li>a:hover { opacity: 1; }

/******************************************************************
COMMENTS
******************************************************************/
ol.commentlist a, cite {
    color: #1ABC9C;
}
ol.commentlist a:hover{color:#000;}
ol.commentlist {
    border-top: 1px dotted #eee;
    border-left: 1px dotted #eee;
    border-right: 1px dotted #eee;
}
ol.commentlist li.comment {padding:0px;}
li.comment { min-height: 70px; border-bottom: 1px dotted #eee; border-left: 0px !important;}
ol.children>li.comment { margin: 0 15px 0 70px; border-top: 1px dotted #ccc; }
ol.children>li.comment:last-child { border-bottom: 0px; }
li.comment.thread-even { background: #fafafa; }
li.comment.thread-odd { }
li.comment.depth-1 { }


ol.commentlist li.comment ul.children li {
	margin: 0 !important;
	padding-left: 45px;
	border-bottom: 0 !important;
	border-top: 1px dotted #666;
}

div.comment-body { position: relative; padding: 10px 10px 10px 70px; }

div.comment-author { padding-top: 3px; font-weight: bold; }
div.comment-author>img.avatar { position: absolute; top: 15px; left: 15px; }
div.comment-author>cite.fn { font-style: normal; }
div.comment-author>cite.fn>a { }
div.comment-author>span.says { display: none; }

div.comment-meta { display: none; }
div.comment-meta>a:first-child { } /* time */
div.comment-meta>a.comment-edit-link { }

div.reply { display: none; }
div.reply>a.comment-reply-link { }

#respond {
    
}
#respond h2 {
    margin: 30px 0 10px 0;
    padding: 0;
    font-size: 26px;
    font-weight: normal;
}

#respond div {
    margin-bottom: 10px;
}

#respond input[type="text"], #comment, .wpcf7-text, .wpcf7-textarea {
    background: #f9f9f9;
    border: 1px solid #bbb;
    border-radius: 2px;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    font-size: 1em;
}
#respond input[type="text"], .wpcf7-text {
    width: 45%;
    padding: 3px;
}

#respond textarea {
    width: 100%;
}

input#submit, .wpcf7-submit {
    font-size: 22px;
    padding: 6px 12px;
    display: inline-block;
    text-align: center;
    cursor: pointer;
    background: #1abc9c;
    color: #fff;
    border: none;
    border-radius:3px;
}
input#submit:hover, .wpcf7-submit:hover {background: #196E5D;}


/* Print styles!
-------------------------------------------------------------------------------*/
@media print {

}


/* Media queries!
-------------------------------------------------------------------------------*/

/* Consider this: www.cloudfour.com/css-media-query-for-mobile-is-fools-gold/*/

@media screen and (max-width:1040px){
	#wrapper {width: 100%;padding: 0 20px;}
	#content {width: 65%; margin-right:20px;}
}
@media screen and (max-width:954px){
	#content {width: 60%;}
}
@media screen and (max-width:854px){
	#content {width: 55%;}
	#nav form {float: none;}
}
@media screen and (max-width:754px){
	#content {width: 50%;}
	
}

@media screen and (max-width:699px){
	#wrapper {width: 100%;}
	#content {width: 100%; margin: 0; float: none;padding: 0 20px;}
	#sidebar-column {width: 100%;float: none;}
	#nav li {border: 0;display: block;text-align: center;}
	#nav li:first-child a {	padding-left: 18px;}
	#nav div {float: none;display: block;}
	#nav form div {width: 100%;display: inline-block;}
	#nav form {display: block;}
	header h1{text-align: center;width: inherit;}

}
@media screen and (min-width:530px) and (max-width:699px){
	#pinimg {width: 50% !important;}
	.pins-feed-item {width: 50% !important;}
}
@media screen and (max-width:530px){
	.shareCont:hover .shareWrapper, 
	.shareCont:focus .shareWrapper, 
	.shareCont:hover h3, 
	.shareCont:focus h3 {height:140px;}
}