@charset "utf-8";
/* CSS Document */

html,body {
	margin:0;
	padding:0;
	font-family:"Verdana", Arial, Helvetica, sans-serif;
	font-size:16px;
}

h2 {
	font-family:"Monotype Corsiva";
	margin:0;
	padding:0;
	color:#fff;
	font-size:24px;
}

div#top-slide-one {
	width:100%;
	height:32px;
	padding-top:13px;
	background-color:#009933;
	color:#fff;
	font-size:14px;
	vertical-align:middle;
}

div#top-slide-one img {
	float:left;
	padding-right:8px;
	margin-top:-3px;
}

div#top-slide-one #left-side {
	float:left;
	margin-left:48px;
}

div#top-slide-one #right-side {
	float:right;
	margin-right:48px;
}

div#top-slide-two {
	width:100%;
	height:32px;
	padding-top:13px;
	background-color:#fff;
	color:#009933;
	font-size:14px;
}

div#top-slide-two input {
	width: 240px;
    -webkit-transition: width 0.4s ease-in-out;
    transition: width 0.4s ease-in-out;
	padding: 8px 12px;
    margin: 8px;
	margin-right:0;
	margin-top:-4px;
	display: inline-block;
    border: 1px solid #009933;
    box-sizing: border-box;
	float:left;
}

div#top-slide-two button {
	width: 40px;
    margin: 8px;
	margin-left:-1px;
	margin-top:-4px;
	display: inline-block;
    border: 1px solid #009933;
    background-color:#009933;
	background:url(../images/search.png) no-repeat center;
	height:33px;
	float:left;
}

div#top-slide-two a {
	color:#009933;
	text-decoration:none;
}

div#top-slide-two a:hover {
	color:#CC3300;
}

div#top-slide-two img {
	float:left;
	padding-right:8px;
	margin-top:-3px;
}

div#top-slide-two #left-side {
	float:left;
	margin-left:48px;
}

div#top-slide-two #right-side {
	float:right;
	margin-right:48px;
}

div#top-slide-three {
	background:url(../img/logo.jpg) no-repeat center;
	height:110px;
}

@media screen and (max-width:1024px) {
	div#top-slide-three {
		margin-top:16px;
	}
}

@media screen and (max-width:860px)  {
	div#top-slide-two #right-side-cont {
		float:right;
		margin-right:40px;
	}
	
	div#top-slide-two #right-side {
		margin-right:8px;
	}
}

@media screen and (max-width:800px)  {	
	div#top-slide-three {
		clear:both;
	}
}

@media screen and (max-width:720px) {
	div#top-slide-one #left-side {
		float:left;
		margin-left:32px;
	}
	
	div#top-slide-one #right-side {
		margin-right:32px;
	}

	div#top-slide-two #left-side {
		margin-left:24px;
	}
	
	div#top-slide-two #right-side-cont {
		clear:both;
		float:left;
		margin-right:0;
		margin-left:32px;
		margin-bottom:16px;
		font-size:13px;
	}
}

@media screen and (max-width:640px) {
	
}

@media screen and (max-width:540px)  {
	div#top-slide-one #left-side {
		display:none;
	}
	
	div#top-slide-two #left-side {
		float:right;
		margin-right:24px;
	}
	
	div#top-slide-two #right-side-cont {
		float:right;
		margin-right:24px;
		margin-left:0;
	}
}

nav {
	margin:4px 0;
	margin-top:24px;
	font-size:15px;
}

nav ul#menu{
	list-style:none;
	margin:0;
	padding:0;
	text-align:center;
}

#menu li{
	position:relative;
	display:inline;
}

#menu li#op-menu {
	display:none;
}

#menu a{
	display:inline-block;
	padding:10px 24px;
	color:#009933;
	font-weight:bold;
	text-decoration:none;
}

#menu ul{
	position:absolute;
	left:-9999px;
	margin:0;
	padding:0;
	text-align:left;
}

#menu ul li{
	display:block;
}

#menu li:hover ul{
	left:0;
	z-index:999999;
	background-color:#F4F4F4;
}

#menu li:hover a{
	background:#009933;
	color:#fff;
}

#menu li:hover ul a{
	color:#009933;
	text-decoration:none;
	background:none;
	min-width:202px;
}

#menu li:hover ul a:hover{
	text-decoration:none;
	background-color:#66FF99;
	color:#CC3300;
}

#menu ul a{
	white-space:nowrap;
	display:block;
	border-bottom:1px solid #009933;
}

/*Style 'show menu' label button and hide it by default*/
nav .show-menu {
    font-family: "Verdana", Helvetica, Arial, sans-serif;
    font-weight: bold;
	color: #fff;
    background:#CC3300;
    text-align: center;
    padding: 10px 0;
    display: none;
}
/*Hide checkbox*/
nav input[type=checkbox]{
    display: none;
}
/*Show menu when invisible checkbox is checked*/
nav input[type=checkbox]:checked ~ #menu{
    display: block;
}
/*Responsive Styles*/
@media screen and (max-width : 960px){
    /*Make dropdown links appear inline*/
    ul#menu {
        position: static;
        display: none;
    }
    /*Make all menu links full width*/
    #menu li ul {
        width: 100%;	
		background-color:#33FF99;
    }
	
	#menu li a {
        width: 100%;	
		background-color:#33FF99;
    }
	
	#menu a {
		padding:10px 0;
		text-align:center;
	}
	
	#menu li:hover ul{
		position:relative;
		display:inline;
	}
	
    /*Display 'show menu' link*/
    nav .show-menu {
        display:block;
    }
}

#content {
	margin:0;
	padding:0;
	position:relative;
}

#content #top-corners,#top-corners2,#top-corners3 {
	border-radius: 25px;
    padding: 8px 16px;
	width: 93.4%;
	clear:both;
	margin:0 auto;
	margin-top:20px;
	margin-bottom:20px;
	background: #009933; /* For browsers that do not support gradients */
  	background: -webkit-linear-gradient(left, #009933 , #73AD21); /* For Safari 5.1 to 6.0 */
  	background: -o-linear-gradient(right, #009933, #73AD21); /* For Opera 11.1 to 12.0 */
  	background: -moz-linear-gradient(right, #009933, #73AD21); /* For Firefox 3.6 to 15 */
  	background: linear-gradient(to right, #009933 , #73AD21); /* Standard syntax */
}

@media screen and (max-width:1024px)  {
	#content #top-corners,#top-corners2,#top-corners3 {
		width: 95%;
		box-sizing:border-box;
	}
}

#content #see-all  {
	clear:both;
	float:right;
	margin-top:-22px;
	margin-right:8px;
	font-size:12px;
	font-weight:bold;
	color:#fff;
}

#content #see-all a {
	color:#fff;
	text-decoration:underline;
}

#content #see-all a:hover {
	color:#FFFFCC;
	text-decoration:underline;
}

.responsive {
    padding: 0 32px;
    float: left;
    width: 24.99999%;
	box-sizing: border-box;
}

@media only screen and (max-width: 1024px){
    .responsive {
        width: 49.99999%;
        margin: 6px 0;
    }
}

@media only screen and (max-width: 600px){
    .responsive {
        width: 100%;
    }
}

.clearfix:after {
    content: "";
    display: table;
    clear: both;
	margin-bottom:16px;
}

.gallery a {
	text-decoration:none;
}	

.gallery a:hover {
	box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
	text-decoration:none;
	display:block;
}

.gallery #desc {
	min-height:115px;
	width:96%;
	margin:0 auto;
	border-top:2px dashed #EAEAEA;
	padding-bottom:6px;
}

.gallery #desc h2 {
	font-size:22px;
	margin:0;
	margin-top:12px;
	color:#FF0000;
	float:left;
	padding:0 8px 4px 6px;
}

.gallery #desc h3 {
	font-size:16px;
	margin:12px 0 6px 0;
	padding:0 8px;
}

.gallery #desc #merk {
	font-size:14px;
	font-style:italic;
	padding:0 8px;
}

.gallery #thline {
	font-size:14px;
	color:#79767C;
	text-decoration:line-through;
	float:left;
	padding:13px 0 8px 4px;	
}

#bottom-bar {
	clear: both;
	position:relative;
    min-height:420px;
	width:100%;
	background-color:#009933;
	box-sizing:border-box;
}

#bottom-bar #slide-one {
	height:75px;
	background-color:#fff;
}

#bottom-bar #slide-two {
	border-top:3px solid #CC0000;
}

#bottom-bar #slide-two #box {
	float:left;
	margin-top:10px;
}

#bottom-bar #box #head {
	font-weight:bold;
	font-size:14px;
	color:#fff;
	padding:4px 8px 12px 54px;
	text-decoration:underline;
}

#bottom-bar #slide-two ul {
	list-style-type:none;
    margin:0;
    padding:0;
	overflow:hidden;
}

#bottom-bar #slide-two ul li {
	min-width:160px;
	padding:4px 8px 12px 54px;
}

#bottom-bar #slide-two ul li a {
	color:#fff;
    text-decoration:none;
	font-size:13px;
	font:"Courier New", Courier, monospace;
}

#bottom-bar #slide-two ul li a:hover {
	text-decoration:underline;
	color:#000;
}

#bottom-bar #slide-two ul #contact {
	color:#fff;
    text-decoration:none;
	font-weight:bold;
	font-size:13px;
	font:"Courier New", Courier, monospace;
}

#bottom-bar #slide-two img {
	padding-right:4px;
}

#bottom-bar #slide-two ul #contact #desc{
	color:#fff;
    font-size:13px;
	font-weight:normal;
	font:"Courier New", Courier, monospace;
	margin-top:4px;
	padding-left:24px;
}

#bottom-bar #slide-three #box2 {
	margin:10px 58px 0 72px;
	float:right;
}

#bottom-bar #slide-three #box2 #titles {
	font-weight:bold;
	font-size:14px;
	color:#fff;
	padding:4px 8px 12px 0;
	text-decoration:underline;
	float:left;
}

#bottom-bar #slide-three #box2 #titles {
	font-weight:bold;
	font-size:14px;
	color:#fff;
	padding:4px 8px 12px 0;
	text-decoration:underline;
	float:left;
}

#bottom-bar #slide-three #box2 #addr {
	clear:both;
	float:left;
	font-size:13px;
	color:#fff;
	padding:6px 0;
}

#bottom-bar #maps {
	clear:both;
	float:left;
	margin-top:4px;
}

#bottom-bar #endofpage {
	width:100%;
	height:34px;
	background-color:#73AD21;
	border-top:1px solid #fff;
	float:left;
	margin-top:20px;
}

#bottom-bar #endofpage #left {
	color:#fff;
	font-size:12px;
	font-weight:bold;
	float:left;
	padding:10px 0 10px 54px;
}

#bottom-bar #endofpage #right {
	color:#fff;
	font-size:12px;
	font-weight:bold;
	float:right;
	padding:10px 54px 10px 0;
}

#bottom-bar #endofpage #right a {
	color:#CC0000;
	text-decoration:none;
}

#bottom-bar #endofpage #right a:hover {
	text-decoration:underline;
}

iframe {
	width:360px;
	height:200px;
}

@media screen and (max-width:1280px) {
  #bottom-bar {
  	display:inline-block;
  }
  
  #bottom-bar #slide-two ul li {
  	min-width:240px;
	padding:4px 6px 12px 54px;
  }

  #bottom-bar #slide-three #box2 {
  	margin:10px 58px 0 0;
  }
  
  #bottom-bar #slide-three #box2 {
  	float:left;
	margin:14px 18px 0 48px;
  }
}

@media screen and (max-width:1024px) {
  #bottom-bar #box #head {
	padding:4px 8px 12px 32px;
	text-decoration:underline;
  }
  
  #bottom-bar #slide-two ul li {
  	min-width:240px;
	padding:4px 6px 12px 32px;
  }
  
  #bottom-bar #slide-three #box2 {
  	float:left;
	margin:14px 18px 0 32px;
  }
  
  #bottom-bar #endofpage #left {
	padding-left:16px;
  }
  
  #bottom-bar #endofpage #right {
	padding-right:16px;
  }
}

@media screen and (max-width:960px) {
  #bottom-bar #box #head {
	padding:4px 8px 12px 44px;
	text-decoration:underline;
  }
  
  #bottom-bar #slide-two ul li {
	min-width:200px;
	padding:4px 6px 12px 44px;
  }
  
  #bottom-bar #slide-three #box2 {
  	clear:both;
	float:left;
	margin:14px 18px 6px 44px;
  }
  
  #bottom-bar #endofpage #left {
	padding-left:16px;
  }
  
  #bottom-bar #endofpage #right {
	padding-right:16px;
  } 
}

@media screen and (max-width:720px) {
  #bottom-bar #slide-two ul li {
	min-width:160px;
	padding:4px 102px 12px 44px;
  }
  
  #bottom-bar #box #head {
	padding:4px 8px 12px 44px;
	text-decoration:underline;
  }
  
  #bottom-bar #slide-three #box2 {
	margin:24px 0 8px 44px;
	float:left;
  }

  #bottom-bar #slide-three #box2 #titles {
	font-weight:bold;
	font-size:14px;
	color:#fff;
	padding:4px 8px 12px 0;
	text-decoration:underline;
	float:left;
  }
  
  #bottom-bar #endofpage #left {
	padding-left:44px;
  }
  
  #bottom-bar #endofpage #right {
	padding-right:44px;
  } 
}

@media screen and (max-width:640px) {
  #bottom-bar #slide-two ul li {
	padding:4px 64px 12px 44px;
  }
  
  #bottom-bar #box #head {
	padding:4px 8px 12px 44px;
	text-decoration:underline;
  }
  
  #bottom-bar #slide-three #box2 {
	margin:24px 0 8px 44px;
	float:left;
  }

  #bottom-bar #slide-three #box2 #titles {
	font-weight:bold;
	font-size:14px;
	color:#fff;
	padding:4px 8px 12px 0;
	text-decoration:underline;
	float:left;
  }
  
  #bottom-bar #endofpage #left {
	padding-left:44px;
  }
  
  #bottom-bar #endofpage #right {
	float:left;
	padding-left:44px;
  	color:#000;
  }
}

@media screen and (max-width:600px) {
  #bottom-bar #slide-two ul li {
	padding:4px 64px 12px 44px;
  }
  
  #bottom-bar #box #head {
	padding:4px 8px 12px 44px;
	text-decoration:underline;
  }
  
  #bottom-bar #slide-three #box2 {
	margin:24px 0 8px 44px;
	float:left;
  }

  #bottom-bar #slide-three #box2 #titles {
	font-weight:bold;
	font-size:14px;
	color:#fff;
	padding:4px 8px 12px 0;
	text-decoration:underline;
	float:left;
  }
  
  #bottom-bar #endofpage #left {
	padding-left:44px;
  }
}

@media screen and (max-width:480px) {
  #bottom-bar #slide-two ul li {
	min-width:120px;
	padding:4px 6px 12px 24px;
  }
  
  #bottom-bar #box #head {
	padding:4px 8px 12px 24px;
	text-decoration:underline;
  }
  
  #bottom-bar #slide-three #box2 {
	margin:14px 0 0 24px;
	float:left;
  }

  #bottom-bar #slide-three #box2 #titles {
	font-weight:bold;
	font-size:14px;
	color:#fff;
	padding:4px 8px 12px 0;
	text-decoration:underline;
	float:left;
  }
  
  #bottom-bar #endofpage #left {
	padding-left:24px;
  }
  
  #bottom-bar #endofpage #right {
	float:left;
	padding-left:24px;
  	color:#000;
  } 
}

@media screen and (max-width:360px) {
  iframe {
	width:288px;
	height:160px;
  }
}

/* for product list and detail */
#content #navigate {
	float:left; 
	font-size:12px; 
	margin-left:32px; 
	position:absolute;
	color:#009933;
}

#content #navigate a {
	color:#cc0000;
	text-decoration:underline;
}

#content #hori-box {
	clear:both;
	float:left;
}

#content #pro-header {
	width:96%;
	text-align:center;
	font-family:"Verdana", Arial, Helvetica, sans-serif;
	font-size:22px;
	font-weight:bold;
	color:#cc0000;
	margin:48px 0 24px 0;
}

#content #pro-name {
	float:right;
	font-family:"Verdana", Arial, Helvetica, sans-serif;
	font-size:20px;
	font-weight:bold;
	color:#cc0000;
	margin:0 32px 24px 0;
}

@media screen and (max-width:960px) {
  #content #pro-name {
  	clear:both;
  	float:none;
	margin:24px 0 16px 32px;
	padding-top:36px;
  }
}

#content #sel-cont {
	clear:both;
	margin:32px;
	margin-bottom:0;
}

#content select {
	min-width: 240px;
    padding: 8px;
	margin:0;
	margin-bottom:32px;
    display: inline-block;
    border: 1px solid #cc0000;
}

#content select#sub {
	float:left;
}

#content select#merk {
	margin-left:8px;
}

#content select#sort {
	float:right;
}

@media only screen and (max-width: 820px){
	 #content #sel-cont {
	 	box-sizing:border-box;
	 }

     #content select#sub {
		width:100%;
		margin:4px 0;
	  }
		
	  #content select#merk {
		width:100%;
		margin:4px 0;
	  }
		
	  #content select#sort {
		width:100%;
		margin:4px 0;
		float:left;
	  }
}

#content select#stts {
	margin-left: 32px;
	float:left;
}

#content #box-trans {
	width:50%;
	margin-top:48px;
	float:left;
	position:absolute;
	border-top:1px dotted #cccccc;
	border-bottom:1px dotted #cccccc;
	padding:12px 0;
}

#content #box-trans #text {
	float:left;
	padding:8px 16px 8px 0;
}

#content #box-trans input {
	width:32px;
	padding:8px;
	float:left;
	text-align:center;
	border:1px solid #000099;
}

#content #box-trans button {
	border:none;
	display:inline;
	padding:8px 24px;
	float:right;
	background-color:#000099;
	color:#fff;
	font-size:16px;
	font-weight:bold;
}

#content #hori-box {
	width:100%;
}

#content #box-img {
	width:52.4%;
	margin-top:128px;
	float:left;
	box-sizing:border-box;
}
@media screen and (max-width: 1024px){
	#content #box-img {
		width:47.8%;
	}
}

#content #box-img img {
	width:100%;
}

#content #box-desc {
	float:right;
	margin-bottom:4px;
    border: 1px solid #cccccc;
    width: 45%;
	min-height:160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
	text-align:justify;
}

#content #box-desc #pro-detail {
	float:left;
	margin:16px;
    width: 100%;
	font-size:16px;
	font-weight:bold;
	text-decoration:underline;
}

#content #box-desc #pro-desc {
	float:left;
	width:93%;
	margin:16px 12px;;
	margin-bottom:0;
	padding-bottom:12px;
	border-bottom:1px solid #cccccc;
}

#content #box-desc #left {
	float:left;
	font-size:14px;
	font-weight:bold;
}

#content #box-desc #right {
	font-size:16px;
	float:right;
}

#content #box-desc #pro-desc-last {
	float:left;
	width:93%;
	margin:16px;
	margin-bottom:0;
	padding-bottom:24px;
    font-size:16px;
}

@media only screen and (max-width: 1024px){
	#content #box-trans {
		width:45%;
	}
	
	/*#content #box-img {
		width:45%;
	}*/
	
	#content #box-desc {
		width:50%;
	}
}

@media screen and (max-width: 960px){
	#content #box-trans {
		width:100%;
		margin-top:0;
		box-sizing:border-box;
		position:relative;
	}
	
	#content #box-img {
		clear:both;
		float:left;
		width:100%;
		margin-top:8px;
	}
	
	#content #box-desc {
		width:100%;
		margin-top:16px;
	}
}

@media only screen and (max-width: 900px){
	#content #box-img {
		margin-top:8px;
		width:100%;
	}

	#content #box-desc {
		clear:both;
		float:left;
		width:100%;
		margin-top:32px;
	}
}

#content #other {
	clear:both;
	padding-top:48px;
	font-size:18px;
	font-weight:bold;
	color:#cc0000;
}

#content #other-prod {
	padding-top:12px;
}

#content #box-other {
	width:20%;
	min-height:115px;
	float:left;
	margin:5px 15px 5px 43px;
	border:1px solid #cccccc;
	/*padding-bottom:6px;*/
}

#content #box-other a:hover {
	display:inline-block;
	border:1px solid #00CC33;
}

#content #box-other img {
	width:100%;
	padding:24px 0;
	margin:0 auto;
}

#content #box-other #desc {
	width:100%;
	border-top:1px solid #EAEAEA;
	background-color:#CCFFCC;
	padding-bottom:12px;
	min-height:110px;
}

#content #box-other #desc h2 {
	font-size:22px;
	margin:0;
	margin-top:12px;
	padding:0 8px;
	color:#FF0000;
	float:left;
	background-color:#CCFFCC;
}

#content #box-other #desc h3 {
	font-size:16px;
	margin:12px 0 6px 0;
	padding:0 8px;
}

#content #box-other #desc #merk {
	font-size:14px;
	font-style:italic;
	padding:0 8px;
	background-color:#CCFFCC;
}

/* General content seperti about us dll */

#content #gnr-title {
	text-align:left;
	font-family:"Verdana", Arial, Helvetica, sans-serif;
	font-size:20px;
	font-weight:bold;
	color:#cc0000;
	margin-left:32px;
	padding-top:36px;
}

@media screen and (max-width: 960px){
	#content #gnr-title {
		margin-top:24px;
	}
}

#content #gnr-subtitle {
	clear:both;
	font-size:14px;
	font-weight:normal;
	padding-top:6px;
	padding-bottom:32px;
}

#content p {
	margin:0;
	padding:0;
}

#content #general {
	clear:both;
	width:70%;
	margin:8px;
	margin-left:96px;
	text-align:justify;
	font-size:14px;
	line-height:22px;
	padding-top:24px;
	border-top:1px solid #E6E6E6;
}

/* login, signup and contact us form */
#content #frm-title {
	width:40%;
	text-align:left;
	font-family:"Verdana", Arial, Helvetica, sans-serif;
	font-size:20px;
	font-weight:bold;
	color:#cc0000;
	margin-left:32px;
	padding-top:36px;
}

@media screen and (max-width: 960px){
	#content #frm-title {
		margin-top:24px;
	}
}

#content #box-login {
	width:35%;
	box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
	border:1px solid #cccccc;
	display:inline-block;
	margin:24px 0 8px 32px;
	padding:0 32px;
	padding-top:12px;
	vertical-align:top;
	box-sizing: border-box;
}

#content #box-login.register {
	width:50%;
}

#content #login-area {
	width:100%;
}

#content #login-desc {
	padding:8px 0 24px 0;
}

#content #login-desc a {
	color:#CC3300;
	text-decoration:none;
	font-weight:bold;
}

#content #login-desc a:hover {
	text-decoration:underline;
}

#content #login-title {
	font-size:18px;
	font-weight:normal;
	margin:12px 24px 24px 0;
	color:#009933;
	text-align:justify;
}

#content #login-subtitle {
	clear:both;
	font-size:14px;
	font-weight:normal;
	padding-top:6px;
	color:#CC0000;
}

#content #info {
	font-size:16px;
	font-weight:bold;
	font-style:italic;
	text-align:left;
	padding:24px 0 0 32px;
	color:#CC0000;
}

#content #login-area #text {
	clear:both;
	float:left;
	padding:8px 24px 6px 0;
}

#content #login-area input, textarea{
	clear:both;
    width: 100%;
    padding: 8px 12px;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
    resize: vertical;
	margin-bottom:6px;
}

#content #login-area select {
	clear:both;
    width: 100%;
    padding: 8px 12px;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
    resize: vertical;
	margin-bottom:6px;
}

#content #login-area button {
	clear:both;
	border:none;
	display:inline-block;
	margin:24px 0 22px 0;
	padding:8px 24px;
	float:right;
	background-color:#000099;
	color:#fff;
	font-size:16px;
	font-weight:bold;
	border-radius: 4px;
	box-sizing: border-box;
}

#content #co-detail {
	float:left;
	margin:16px;
    	width: 100%;
	font-size:16px;
	font-weight:bold;
	text-decoration:underline;
}
#content #co-desc {
	float:left;
	width:93%;
	margin:8px 16px;
	margin-bottom:0;
	padding-bottom:12px;
	border-bottom:1px solid #cccccc;
}

@media screen and (max-width: 960px){
	#content #box-login {
		clear:both;
		float:left;
		width:60%;
	}
	
	#content #box-login.register {
		clear:both;
		float:left;
		width:75%;
	}
}

@media screen and (max-width: 640px){
	#content #box-login {
		width:80%;
	}
	
	#content #box-login.register {
		width:80%;
	}
}

@media screen and (max-width: 540px){
	#content #box-login {
		width:85%;
	}
	
	#content #box-login.register {
		width:85%;
	}
}