/*for All*/
* {
		margin: 0;
		padding: 0;
}
header, nav, section, article, footer, fieldset {
		display : block;
}
body {
		background : #003333;
		color : #FFCC66;
		font-family : 'Times New Roman';
		text-align : center;
}
.hed {
		background-image : url(../images/fieldset_02.jpg);
		background-repeat: repeat-y;
		background-size: 100%;
}
.hed h1 {
		font-size : 1.3em;
		margin: 0px;
		padding-top : 10px;
}
.mhed {
		background : url(../images/gradient_01.jpg);
		font-size : 0.6em;
		padding : 5px;
}
#show-menu button{
		background: url(../images/gradient_01.jpg);
		border: none;
		color: #FFCC66;
		font-size : 1.1em;
		text-align : center;
		width: 50%;
		height : 38px;
		padding : 5px;
		margin : 10px;
		box-shadow: 0 2px 5px #000;
		cursor: pointer;
}
#show-menu button img {
		width: 50px;
		height : 25px;
}
nav {
		background : #FFCC66;
		margin : 0px;
}
.clearfix ul {
		display:none;
		list-style-type : none;
		padding: 5px;
}
.clearfix ul li {
		background: url(../images/gradient_01.jpg);
		font-size : 1em;
		text-align : center;
		width: 45%;
		height : 28px;
		padding : 5px;
		margin : 0px 0px 5px 5px;
		box-shadow: 0 2px 5px #000;
		float: left;
}
.clearfix ul li a {
		text-decoration : none;
		color : #FFCC66;
}
.clearfix ul li:hover {
		font-size : 1.1em;
}
#m {
		font-size : 1.1em;
}
#m a {
		color : #280A00;
}
fieldset {
		background-image : url(../images/fieldset_01.jpg);
		background-repeat: repeat-y;
		background-size: 100%;
		border : 1px solid #003333;
		margin: 10px;
}
legend {
		background: #003333;
		font-size : 1.5em;
		margin-left : 10px;
		padding: 5px;
}
.wrapper {
		padding: 20px 0px;
}
.comment-title {
		min-width : 250px;
		height : 35px;
		font-size : 1.2em;
}
.comment-title h3{
		width :50px;
		margin : 5px;
		float :left;
}
.comment-title input{
		width : auto;
		min-width : 100px;
		background : none;
		border : 1px solid #F8A73E;
		color : #F8A73E;
		padding : 3px;
		margin : 5px;
		float : left;
}
.comment-post-wraper{
		margin: 0px 0px 20px 0px;
		width : 100%;
		float : left;
}
.comment-insert-container {
		margin : 10px;
		border : 1px solid #F8A73E;
		width : auto;
}
.comment-insert-container .tekst {
		padding : 20px;
}
.comment-insert textarea {
		background : none;
		border : none;
		width : 98%;
		color : #F8A73E;
		font-size : 1.2em;
		padding : 5px;
}
.comment-post-btn input{
		width : 150px;
		height : 35px;
		background : url("../images/gradient_01.jpg");
		box-shadow: 0 2px 5px #000;
		border : none;
		font-size : 1em;
		color : #FFCC66;
		padding : 5px;
		margin : 10px;
		cursor : pointer;
}
.comment-post-btn input:hover {
		font-size : 1.2em;
}
.comments-list {
	height : auto;
	font-size : 18px;
	margin : 20px;
	text-align : left;
}
ul.comments-holder-ul {
	list-style-type : none;
	margin : 0px;
	padding : 0px;
	width : auto;
	height : auto;
}
ul.comments-holder-ul li.comment-holder {
	list-style-type : none;
	height : auto;
	width : auto;
	padding: 10px;
	margin : 15px 0;
	color : #F8A73E;
	background-image : url(../images/fieldset_02.jpg);
	box-shadow: 0 2px 5px #000;
	overflow : hidden;
	position : relative;
}
ul.comments-holder-ul li.comment-holder .user-img {
	float : left;
	width : 75px;
	height : 56px;
	background : url(../images/pano.jpg);
	border : 1px solid #F8A73E;
	margin: 5px 10px 5px 5px;
}
ul.comments-holder-ul li.comment-holder .user-img:hover {
	border : 1px solid #FFCC66;
}
.comment-body {
	width : auto;
}
ul.comments-holder-ul li.comment-holder h3.username-field {
	height : 25px;
	line-height : 22px;
	font-size : 18px;
}
ul.comments-holder-ul li.comment-holder .comment-text {
	display : block;
	width : auto;
	font-size : 16px;
	margin : 10px 0 10px 67px;
}
ul.comments-holder-ul li.comment-holder:hover .comment-buttons-holder {
	display : block;
}
.comment-buttons-holder {
	display : none;
	position : absolute;
	top : 0px;
	right : 0px;
	width : 30px;
	height : 30px;
}
.comment-buttons-holder ul {
	list-style-type : none;
	overflow : hidden;
	height : 30px;
	background : url(../images/gradiend.jpg) repeat-x;
}
.comment-buttons-holder ul li {
	padding : 4px 8px;
	cursor : pointer;
	float :right;
}
.comment-buttons-holder ul li:hover {
	color : #280A00;
}


.comment-insert {
	width :auto;
	margin : 10px;
	position :relative;
}

.comment-insert-container {
	margin : 0 10px 5px 10px;
	border : 1px solid #F8A73E;
}
.comment-insert h3.who-says {
	height : 30px;
	line-height : 27px;
	color : #F8A73E;
	font-size : 18px;
	margin : 0 10px;
}

.clearfix:after, .mhed:after, .shed:after, #info:after{
		content :"";
		display : block;
		clear : both;
		height : 0;
}
.footer {
		text-align : center;
		margin : 10px 20px;
		float:right;
}




/*for tablet*/
@media only screen and (min-width: 600px) {
    .hed h1 {
		font-size : 2.2em;
            }
.mhed {
		font-size : 85%;
}
nav {
		width : 12%;
		min-width : 150px;
		margin : 0px 20px 0px 0px;
		float:left;
}
.clearfix ul {
		padding: 0px 0px;
}
.clearfix ul li {
		text-align : left;
		font-size : 1.1em;
		width : 90%;
		height : 32px;
		padding : 5px 0px;
		margin : 5px 0px 7px 0px;
}
.clearfix ul li a p {
		padding : 0px 10px 5px 10px;
}
.clearfix ul li:hover {
		width : 100%;
		text-align : right;
		font-size : 1.3em;
}
#m {
		font-size : 1.3em;
		width : 100%;
		text-align : right;
}
}



/* for desktop*/
@media only screen and (min-width: 768px) {
    .hed h1 {
		font-size : 3em;
            }
.mhed {
		font-size : 100%;
}
#show-menu button{
		display : none;
}
nav {
		width : 15%;
		min-width : 200px;
		margin : 0px 20px 0px 0px;
		float:left;
}
.clearfix ul {
		display:block;
		padding: 5px 0px;
}
.clearfix ul li {
		text-align : left;
		font-size : 1.3em;
		width : 90%;
		height : 35px;
		padding : 5px 0px;
		margin : 5px 0px 10px 0px;
}
.clearfix ul li a p {
		padding : 0px 10px 5px 10px;
}
.clearfix ul li:hover {
		width : 100%;
		text-align : right;
		font-size : 1.5em;
}
#m {
		font-size : 1.5em;
		width : 100%;
		text-align : right;
}
}