/*************************************************************************************************************************
Screen smaller than 680px
*************************************************************************************************************************/
@media all and (max-width: 680px) {

  /* Overall */
  .container {margin: 0 auto; width: 90%; overflow: hidden; background: #000000;} *****background
  .header {position: relative; width: 100%; margin: 0 auto; border-bottom: 1px solid #ffecec;}
  .section,
  .aside,
  .section-wide {clear: both; width: 94%; margin: 3%;}
  .footer {clear: both; overflow: hidden; margin: 0 auto; width: 100%; border-top: 10px solid #ffecec;}

 

 


  /* .footer */
  .footer-inner {overflow: hidden; line-height: 1.8em;}
  .footer-widget {clear: both; display: block; padding: 1% 3%; margin-bottom: 30px;}
  p.footer-copy {background: #efefef; width: 90%; clear: both; text-align: center; font-size: .9em; overflow: hidden; padding: 20px; margin: 0 auto;}
  p.footer-copy .footer-credit {}


}

/*************************************************************************************************************************
Screen between 681px and 980px
*************************************************************************************************************************/
@media all and (min-width: 681px) and (max-width: 980px) {

  /* Overall */
  .container {margin: 0 auto; width: 90%; overflow: hidden; background: #000000;} background****
  .header {position: relative; width: 100%; margin: 0 auto; border-bottom: 1px solid #ffecec;}
  .section {float: left; width: 60%; margin: 3% 0 3% 3%;}
  .section-wide {clear: both; width: 94%; margin: 3%;}
  .aside {float: right; width: 30%; margin: 1% 1% 1% 0;}
  .footer {clear: both; overflow: hidden; margin: 0 auto; width: 100%; border-top: 10px solid #000;}
  /* .footer */
  .footer-inner {overflow: hidden; line-height: 1.8em;}
  
  p.footer-copy {background: #efefef; width: 90%; clear: both; text-align: center; font-size: .9em; overflow: hidden; padding: 20px; margin: 0 auto;}
  
}

/*************************************************************************************************************************
Screen larger than 981px sidebar and main container
*************************************************************************************************************************/
@media all and (min-width: 981px) {

  /* Overall */
  .container {margin: 0 auto; width: 1020px; overflow: hidden; background: #000000;}
  .header {position: relative; width: 1020px; margin: 0 auto; border-bottom: 1px solid #ffecec;}
  .section {float: left; width: 980px; margin: 10px 5px 10px 10px;}
  .section-wide {clear: both; width: 660px; margin: 20px;}
  .aside {float: right; width: 240px; margin: 1px 1px 1px 0;}
  .footer {clear: both; overflow: hidden; margin: 0 auto; width: 1020px; border-top: 10px solid #ffecec;}

  /* .footer */
  .footer-inner {overflow: hidden; line-height: 1.8em;}
 
  p.footer-copy {background: #efefef; width: 980px; clear: both; font-size: .9em; overflow: hidden; padding: 20px; margin: 0 auto;}
  p.footer-copy .footer-credit {display: block; float: right; width: 55px; height: 11px; background: url('images/footer_credit.png') no-repeat 0 0; margin: 5px 0 0 0; text-indent: -9999px;}

}

/* Overall */
body {font: 400 .85em "Silom", Lucida Sans Unicode, Lucida Grande, Verdana, Tahoma, Arial, Sans-serif; color: #666;}
body p {margin-bottom: 2px; line-height: 1.8em; word-wrap: break-word;}

/* hgroup */
h1,
h2,
h3,
h4,
h5,
h6 {line-height: 1.2em; margin-bottom: 15px; font-weight: 400;}
h1 {font-family: 'din-pro'; font-size: 1.2em; color: #ffcfcf;}
h2 {font-family: 'din-pro'; font-size: 1.2em; text-transform: uppercase; color: #ffcfcf;}
h3 {font-family: 'din-pro'; font-size: 1.2em; color: #ffcfcf;}
h4 {font-family: 'din-pro'; font-size: 1.2em;  text-transform: uppercase; color: #333;}
h5 {font-family: 'din-pro'; font: arial; font-size: 5.2em; color: #555;}
h6 {font-family: 'din-pro'; font-size: 1em; color: #555;}

/* Links */
a {color: #fc7988; text-decoration: none; -moz-transition: all .3s ease-in-out; -webkit-transition: all .3s ease-in-out; -ms-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out;}

/* .article */
.article {margin-bottom: 50px; overflow: hidden; clear: both;}
.article .post-thumb {padding: 2px; border: 3px double #000000;}
.article .post-thumbnail {border: 0; hight: 450px; width: 980px;}
.article .post-title {p font-size: 1.4em; font-weight: 700; text-transform: uppercase; padding: 20px 20px 20px 20px; position: absolute; color: #fff;  text-shadow: -1px 0px 4px rgba(5, 5, 5, 0.53);  margin-right: 50px; line-height: 1.2em; letter-spacing: 1px;}

/* .article misc */
.page-pagination {clear: both; padding: 5px 0; line-height: 1em;}
.page-pagination .page-pagination-title {font-weight: bold;}
.page-pagination .page-pagination-number {display: inline-block; border: 1px solid #ccc; padding: 5px 8px;}
.page-pagination a .page-pagination-number {}
.page-pagination a .page-pagination-number:hover {}
.pagination {clear: both; font-weight: 700; text-transform: uppercase; padding: 10px; margin: 20px 0 40px 0; overflow: hidden; list-style: none; border: 5px solid #000;}
.pagination p {margin: 0;}
.pagination a:hover,
.pagination .current {padding: 5px 10px; background: red;}
.pagination a {padding: 5px 10px;}
.post-footer {clear: both; padding: 10px 0;}
.post-footer p {margin-bottom: 10px;}
.post-footer h5 {margin-top: 20px; font-size: 1.3em; text-transform: uppercase; text-align: center;}
.post-footer ul.post-related {margin: 0; padding: 10px 0 20px 0; list-style: none; overflow: hidden; border-bottom: 1px solid #ddd;}
.post-footer ul.post-related li {float: left; width: 300px; margin: 0 10px; text-align: center; font-size: .8em;}
.post-footer ul.post-related li img {padding: 3px; border: 1px solid #ddd;}
.post-footer ul {margin: 0; list-style: none;}
.post-footer ul li {margin: 5px 0;}

ul.post-related {list-style: none;}

ul.post-info-meta {color: #888; padding: 0;}
ul.post-info-meta li {list-style: none; float: left;}
ul.post-info-meta li .post-print {display: block; width: 55px; height: 20px; background: url('images/post_print.gif') no-repeat 0 0; text-indent: -9999em;}
/* .footer */
.footer-widget h4 {font-size: 1.1em; font-weight: 400; letter-spacing: 1px; text-transform: uppercase; color: #7a7a7a;}
.footer-widget ol,
.footer-widget ul {clear: both; list-style: none;}
.footer-widget ol li,
.footer-widget ul li {margin: 5px 0; padding: 5px 0; line-height: 1.8em; border-bottom: 1px solid #efefef;}
.footer-widget select {width: 98%; color: #888; margin: 5px 0; padding: 3px;}
.footer-widget p {margin-bottom: 10px; line-height: 1.8em;}


/* .comment-box */
.comment-box {clear: both; margin-top: 20px; padding: 0 10px; overflow: hidden;}
.comment-box h4 {font-size: 1.4em; margin: 10px 0;}

#respond {padding: 10px; background: #f0f0f0;}
p.comment-inputs {margin-bottom: 0;}
.required-input {color: #f00;}
.comment-input {width: 50%;}
.comment-textarea {width: 95%; height: 80px;}
.comment-input,
.comment-textarea {border: 1px solid #ccc; padding: 5px; color: #999; font: normal .85em Verdana, Tahoma, Arial, San-serif;}
.avatar {margin-right: 20px; float: left; border: 1px solid #999;}
.comment-meta {clear: both; overflow: hidden;}
.comment-meta h6 {font-size: 1em; margin-bottom: 3px;}
.comment-meta small {font-style: italic; color: #999; font-size: .85em;}
ol.commentlist {margin: 0;}
ol.commentlist li {border-bottom: 1px solid #ddd; margin-bottom: 20px; list-style: none;}
ol.commentlist li p {padding: 5px 0; margin: 0 0 10px 55px; line-height: 1.8em;}
ol.commentlist li ul {padding: 0;}
ol.commentlist li ul.children li {border: none; border-left: 1px solid #ddd; padding: 0 0 0 30px; margin: 0; list-style: none;}

ol.commentlist .comment-content {overflow: hidden;}
ol.commentlist .comment {overflow: hidden; padding: 10px 0;}

a.comment-reply-link {background: #fc7988; color: #fff; padding: 2px 5px; font: normal .75em Verdana, Tahoma, Arial, San-serif;}
a#cancel-comment-reply-link {background: #fc7988; color: #fff; padding: 2px 5px; font: normal .5em Verdana, Tahoma, Arial, San-serif;}
a.comment-reply-link {float: right;}
.comment-pagination {clear: both; overflow: hidden; margin: 10px 0;}



/* img */
img {max-width: 100%; height: auto;}
img.aligncenter {display: block; margin: 0 auto 10px auto;}
img.alignright {display: inline; margin: 0 0 10px 20px;}
img.alignleft {display: inline; margin: 0 20px 10px 0;}

label {display: inline-block; margin-right: 20px; vertical-align: top;}
select,
textarea,
input {border: 1px solid #ccc; color: #888; padding: 8px; -webkit-transition: all .3s ease-in-out; -moz-transition: all .3s ease-in-out; -ms-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out;}
input[type=submit] {border: 1px solid #ddd; color: #555; cursor: pointer; padding: 8px 10px;
background: #eeeeee; /* Old browsers */
background: -moz-linear-gradient(top,  #eeeeee 0%, #ffffff 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#eeeeee), color-stop(100%,#ffffff)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #eeeeee 0%,#ffffff 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #eeeeee 0%,#ffffff 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #eeeeee 0%,#ffffff 100%); /* IE10+ */
background: linear-gradient(to bottom,  #eeeeee 0%,#ffffff 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
}
input[type=submit]:hover {border: 1px solid #aaa;
 -webkit-box-shadow: 0px 0px 2px 1px rgba(0, 0, 0, .2); box-shadow: 0px 0px 2px 1px rgba(0, 0, 0, .2);
background: #fff; /* Old browsers */
background: -moz-linear-gradient(top,  #ffffff 0%, #eeeeee 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#eeeeee)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #ffffff 0%,#eeeeee 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #ffffff 0%,#eeeeee 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #ffffff 0%,#eeeeee 100%); /* IE10+ */
background: linear-gradient(to bottom,  #ffffff 0%,#eeeeee 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#eeeeee',GradientType=0 ); /* IE6-9 */
}
/* Misc */
.clearfix {clear: both; height: 10px;}
.half {
	
	width:calc(50% - 6px);
	float: left;
}

.halfblog {
	
	width:calc(33.3% - 6px);
	float: left;
}


.hen-select select {
	background-position: 92% center;
	max-width: 145px;
	border-radius: 6px !important;
	box-shadow: none;
	outline: none !important;
	font-family: silom;
	padding: 8px 15px !important;
	background-color: #202020;
	border-color: transparent;
	background-image: url(https://hentaied.com/wp-content/uploads/2021/10/caret-up-fill.png) !important;
	background-repeat: no-repeat !important;
	background-position: 98% center  !important;
	position: relative;
	border-radius: 5px;
	padding: 8px !important;
	border: 2px solid #F27AE4;
	color: #fff;
	font-weight: Bold;
	background: #000;
	-webkit-appearance: none;
}
.hen-select{
	display: flex;
	align-items: center;
	gap: 10px;
}

