/*	Less Framework 4
	http://lessframework.com
	by Joni Korpi
	License: http://opensource.org/licenses/mit-license.php	*/


/*	Resets
	------	*/

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, 
p, blockquote, pre, a, abbr, address, cite, code, del, dfn, em, 
img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, hr, 
dl, dt, dd, ol, ul, li, fieldset, form, label, legend, 
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figure, figcaption, hgroup, 
menu, footer, header, nav, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
}

article, aside, canvas, figure, figure img, figcaption, hgroup,
footer, header, nav, section, audio, video {
	display: block;
}





/*	Default Layout: 992px. 
		Gutters: 24px.
		Outer margins: 48px.    */

.selectnav{display:none}

/*	Tablet Layout: 768px.
		Gutters: 24px.
		Outer margins: 28px.  */

@media only screen and (min-width: 768px) and (max-width: 991px) {
.container{width:750px}	
.selectnav{display:none}
.slider {
background : url("../images/slider2.jpg") center no-repeat;
height : 354px;
}
.slider h1 {
  color: #EEEEEE;
  font-family: sans-serif;
  font-size: 23px;
  margin-left: 21px;
  margin-top: 68px;
  text-shadow: 1px 2px 1px #555555;
  text-transform: uppercase;
}
.slider p {
  color: #FFFFFF;

  font-size: 14px;
  line-height: 18px;
  margin-bottom: 55px;
  margin-left: 22px;
  margin-top: 20px;
  width: 277px;
}
#butto {
  background: url("images/button_bg.png") repeat-x scroll 0 0 #9BBB16;
  color: #FFFFFF;
  margin: 0 0 0 54px;
  padding: 12px 35px;
}
.heading h2 {
  color: #FBFBFB;
  float: left;

  font-size: 21px;
  margin: 0 10px;
  padding: 10px 10px 10px 0;
  width: 230px;
}
.main_content img{
width: 85px;
height: 88px;
}
.content1 {
  float: left;
  margin-top: 12px;
  width: 247px;
}
.content1 p {
  color: #6A6A6A;

  font-size: 14px;
  margin-bottom: 10px;
  margin-top: 6px;
}
.content_button {
  float: right;
  height: 40px;
  margin-bottom: 15px;
  width: 160px;
}
.content_bottom_heading h2 {
  width: 215px;
}
.recommended {
  width: 423px;
}
.recommended img {width: 92px;}
.arrow_pre {
  margin-left: 19px;
}
.arrow_next {
  margin-right: 50px;
}
.Nulla {
  text-align: justify;
width: 365px;
margin-bottom: 25px;
}
.content_button {
  float: left;
}
.blog {
  margin-left: 24px;
  width: 299px;
}
.blog_content img {
  float: left;
  margin-right: 5px;
  width: 77px;
}
.blog_content h2 {
  margin: 1px 0 5px;
}
.promo_content {
  margin-right: 11px;
  width: 250px;
}
.middle_promo {
  margin-left: 40px;
  width: 194px;
}
.last_promo {
  margin-left: 32px;
  margin-right: 0;
  width: 210px;
}



}



/*	Mobile Layout: 320px.
		Gutters: 24px.
		Outer margins: 34px.*/

@media only screen and (max-width: 767px) {
	
.container{width:300px}	
.selectnav{display: block;
float: right;
margin-top: 10px;
padding: 2px;}	
#nav{display:none}

.header {}
input[type="text"], input[type="submit"] {
width:172px;
margin-top : 1px;
margin-bottom:5px

}
.main_menu_area {
  height: 44px;
}

.slider {
background : url("../images/slider4.jpg") center no-repeat;
height : 141px;
}
.slider h1 {
display:none
}
.slider p {
display:none
}
#butto {
display:none
}

.heading {
  border-radius: 4px 4px 0 0;
  margin-bottom: -4px;
  width:300px
}
.heading h2 {
font-size: 18px;
margin: 0 78px;
padding: 10px 10px 10px 0;
text-align: center;
width: 176px;
}
.main_content img{
width: 85px;
height: 88px;
}
.content1 {
float: left;
margin-top: 12px;
width: 247px;
margin-left: 10px;
}
.content1 p {
  color: #6A6A6A;

  font-size: 14px;
  margin-bottom: 10px;
  margin-top: 6px;
}
.content_button {
  float: right;
  height: 40px;
  margin-bottom: 15px;
  width: 160px;
}

.content_bottom_headein_area {
  margin-top: 25px;
}
.content_bottom_heading h2 {
  width: 194px;
}
#sp {
  margin-left: 135px;
margin-right: 5px;
width: 136px;;
}
.recommended {
  width: 300px;
}
.recommended img {width: 66px;}
.arrow_pre {
  margin-left: 16px;
}
.arrow_next {
  margin-right: 17px;
}
.Nulla {
  text-align: justify;
width: 298px;
margin-bottom: 25px;
}
.content_button {
  float: left;
}
.blog {
  margin-left: 1px;
  width: 291px;
}
.blog_content img {
  float: left;
  margin-right: 5px;
  width: 77px;
}
.blog_content h2 {
  margin: 1px 0 5px;
}
.promo_content {
  margin-right: 11px;
  width: 250px;
}
.middle_promo {
  margin-left: 40px;
  width: 194px;
}
.last_promo {
  margin-left: 32px;
  margin-right: 0;
  width: 210px;
}

	
}



/*	Wide Mobile Layout: 480px. */

@media only screen and (min-width: 480px) and (max-width: 767px) {
	
.container{width:460px}	
.selectnav{display: block;
float: right;
margin-top: 10px;
padding: 2px;}	
#nav{display:none}

.header {}
input[type="text"], input[type="submit"] {
width:172px;
margin-top : 11px;

}
.main_menu_area {
  height: 44px;
}

.slider {
background : url("../images/slider3.jpg") center no-repeat;
height : 217px;
}
.slider h1 {
  font-size: 15px;
  margin-left: 17px;
  margin-top: 25px;
display:block
}
.slider p {
display: block;
font-size: 12px;
line-height: 14px;
margin-bottom: 6px;
margin-left: 16px;
margin-top: 2px;
text-align: inherit;
width: 149px;
}
#butto {display: block;
font-size: 13px;
margin: 0 0 2px 35px;
padding: 4px 18px;
width: 91px;
}
.heading {
  border-radius: 4px 4px 0 0;
  margin-bottom: -4px;
  width:460px
}

.heading h2 {
font-size: 18px;
margin: 0 110px;
padding: 10px 10px 10px 0;
width: 230px;
text-align: center;
}
.main_content img{
width: 85px;
height: 88px;
}
.content1 {
float: left;
margin-top: 12px;
width: 247px;
margin-left: 87px;
}
.content1 p {
  color: #6A6A6A;

  font-size: 14px;
  margin-bottom: 10px;
  margin-top: 6px;
}
.content_button {
  float: right;
  height: 40px;
  margin-bottom: 15px;
  width: 160px;
}

.content_bottom_headein_area {
  margin-top: 25px;
}
.content_bottom_heading h2 {
  width: 215px;
}
.recommended {
  width: 423px;
}
.recommended img {width: 92px;}
.arrow_pre {
  margin-left: 19px;
}
.arrow_next {
  margin-right: 50px;
}
.Nulla {
  text-align: justify;
width: 365px;
margin-bottom: 25px;
}
.content_button {
  float: left;
}
.blog {
  margin-left: 24px;
  width: 299px;
}
.blog_content img {
  float: left;
  margin-right: 5px;
  width: 77px;
}
.blog_content h2 {
  margin: 1px 0 5px;
}
.promo_content {
  margin-right: 11px;
  width: 250px;
}
.middle_promo {
  margin-left: 40px;
  width: 194px;
}
.last_promo {
  margin-left: 32px;
  margin-right: 0;
  width: 210px;
}
}