/* NEW GARMENT */
a.newgarment{
	text-decoration:none;
	display:block;
	padding:1vw;
	margin:4vw auto 5vw auto;
	width:40vw;
	text-align:center;
	font-style: normal;
	font-size:3.5vw;
	border-radius: 1vw;
	color:white;
	border:1px solid #A5B8F1; /*#555;*/
	text-shadow: none;
	background-image: url('../-img/newgarment.png');
	background-position: center 80%;
	background-repeat: no-repeat;
	background-size: 12vw;
	background-color: royalblue;
	height:17vw;
	
	transition: text-shadow 0.3s, border-color 0.3s, background-image 0.6s;
}
	a.newgarment:hover{
		text-shadow: 0 1px 1px #fff;
		border-color:powderblue;
		background-image: url('../-img/newgarment2.png');
	}
form#newGarmentBox{
	color: #222;
	display:block;
	/*min-height:300px;*/
	/*border-bottom-left-radius: 1vw;
	border-bottom-right-radius: 1vw;*/
	margin:auto;
	margin-bottom: 5vw;
	padding:0 5vw 0 5vw;
	margin-top:20vw;
	text-align:center;
}
clothNewGarment{
	font-family: verdana;
	display:flex;
	position:relative;
}
selectGarment{
	display:none;
	position:fixed;
	max-width:80vw;
	max-height:90vw;
	overflow-y:auto;
	overflow-x:hidden;
	margin: 1vw 0 0 4vw;
	padding:2vw;
	box-shadow: 0 1px 4px #555;
	background:whitesmoke;
	border-radius: 1vw;
	text-align:left;
	z-index:2;
}
select.selectSize{
	margin: 1vw 3vw 2vw 2vw;
	padding:1vw 2vw;
	background:white;
	border-radius: 1vw;
	text-align:left;
	font-size: 5vw;
	font-weight:bold;
	border:none;
	cursor:pointer;
}
img.garmentClothIcon, img.garmentClothIconEdit, img.garmentClothIconInList{
	width:18vw;
	cursor:pointer;
	margin: 2vw;
	position: -webkit-sticky; /* Para navegadores basados en WebKit, como Chrome y Safari */
  position: sticky;
  top:20vw;
  display:block;
  /*background:red;*/
}
	img.garmentClothIcon{
		animation: balanceo 0.5s ease-in-out 0.5s;
	  transform-origin: center;
	}
	@keyframes balanceo {
	  0%, 100% {
	    transform: rotate(0deg);
	  }
	  25% {
	    transform: rotate(-10deg);
	  }
	  75% {
	    transform: rotate(10deg);
	  }
	}
img.garmentClothIconInList{
	top:auto;
	position:auto;
	display:inline;
	margin:3vw 4vw;
}
img.garmentClothIconEdit{
	cursor:default;
}
/*
.garmentSize{
	display:flex;
	width:40px;
	height:40px;
	cursor:pointer;
	margin: 5px;
	background-image: url('../-img/sizes.png');
	background-size: 40px;
	background-position: 0 0;
	background-repeat: no-repeat;
}
	.garmentSize:hover{
		background-color:white;
	}
	.optionSize{
		display:block;
		padding:2px;
		margin:1px;
		cursor:pointer;
		width:70px;
	}
		.optionSize:hover{
			background: white;
		}
	*/
	input.garmentBrand,
	input.garmentModel{
		/*display:block;*/
		cursor:pointer;
		text-align:left;
		background-color:inherit;
		/*border: 0.7vw solid whitesmoke;*/
		border:none;
		border-radius: 1vw;
		font-size:5vw;
		font-weight:normal;
		padding:1vw;
		margin-bottom:3vw;
		margin-left:2vw;
		width: 50vw;
		color: #666;
		font-family:verdana;
		transition: border-color 0.3s, background-color 0.3s, color 0.3s;
	}
	input.garmentModel{
		font-style:italic;
		border-bottom:0.7vw solid gainsboro;
	}
	input.garmentBrand:focus,
	input.garmentModel:focus{
		text-align:left;
		border-radius: 2vw;
		color:#444;
		transition: border-color 0.3s, background-color 0.3s, color 0.3s;
	}
	textarea#garmentComment{
		cursor:pointer;
		padding:2vw;
		font-size:5vw;
		margin: 8vw auto 8vw auto;
		font-family:arial;
		text-align:justify;
		color:#777;
		/*width:320px;*/
		height:30vw;
		background:whitesmoke;
		border:none;
		border:0.5vw solid #ddd;
	}
	textarea#garmentComment:focus{
		color:#444;
		background:#fafafa;
		border-color:white;
	}
	a.linkGarmentNewBrand{
		font-style: normal;
		display:block;
		float:left;
		font-size:5vw;
		border-radius: 1vw;
		text-align:center;
		/*width:20vw;*/
		color:#999;
		padding:2vw 6vw;
		border:0.5vw solid #ddd;
		text-decoration:none;
		text-shadow: none;
		transition: text-shadow 0.3s, border-color 0.3s;
		margin: 5vw 0 0 5vw;
		background: white;
	}
	clothLineDelete, clothLineDelete2{
		position:absolute;
		cursor:pointer;
		width:7vw;
		height:7vw;
		display:block;
		margin:-33vw 0 0 48vw;
		background: url('../-img/delete.png') left top no-repeat;
		background-size: 6vw;
	}
	clothLineDelete2{
		background-image: url('../-img/delete2.png');
		
	}
	input#newGarmentSubmit, input#delGarmentSubmit{
		font-style: normal;
		display:block-inline;
		font-size:5vw;
		border-radius: 1vw;
		background: royalblue;
		text-align:center;
		/*width:180px;*/
		color:white;
		padding:3vw 8vw;
		border:0.5vw solid #A5B8F1;
		text-decoration:none;
		text-shadow: none;
		transition: text-shadow 0.3s, border-color 0.3s;
		margin: 0px auto 12vw auto;
		cursor:pointer;
	}
	input#delGarmentSubmit{
		background: #F7BBBC;
		margin: 5vw auto 22vw auto;
		display:block;
	}
		input#newGarmentSubmit:hover, input#delGarmentSubmit:hover{
			text-shadow: 0 1px 1px #fff;
			border-color:powderblue;
		}
		input#delGarmentSubmit:hover{
			text-shadow: 0 1px 1px red;
			border-color: crimson;
		}
	
/* DESKTOP VIEW MODIFICATIONS */
@media all and (min-device-width: 640px) and (min-width: 960px) and (orientation: landscape ){
	body{

	}
	
a.newgarment{
	text-decoration:none;
	display:block;
	padding:4px;
	margin:-15px auto 20px auto;
	width:150px;
	text-align:center;
	font-style: normal;
	font-size:12px;
	border-radius: 4px;
	color:white;
	border:1px solid #555;
	text-shadow: none;
	background-image: url('../-img/newgarment.png');
	background-position: center 80%;
	background-repeat: no-repeat;
	background-size: 40px;
	background-color: royalblue;
	height:60px;
	
	transition: text-shadow 0.3s, border-color 0.3s, background-image 0.6s;
}
	a.newgarment:hover{
		text-shadow: 0 1px 1px #fff;
		border-color:powderblue;
		background-image: url('../-img/newgarment2.png');
	}
form#newGarmentBox{
	color: #222;
	border:2px solid white;
	background:whitesmoke;
	display:block;
	width: 550px;
	min-height:300px;
	/*border-bottom-left-radius: 1vw;
	border-bottom-right-radius: 1vw;*/
	box-shadow: 0 1px 4px #BBBBBB;
	margin:auto;
	margin-bottom: 10px;
	padding:50px 50px 10px 50px;
	margin-top:65px;
	text-align:center;
}
clothNewGarment{
	font-family: verdana;
	display:flex;
	width: 600px;
	position:relative;
}
selectGarment{
	display:none;
	position:absolute;
	max-width:300px;
	max-height:300px;
	overflow-y:auto;
	overflow-x:hidden;
	margin: 2px 0 0 -270px;
	padding:10px;
	box-shadow: 0 1px 4px #555;
	background:whitesmoke;
	border-radius: 5px;
	text-align:right;
}
select.selectSize{
	margin: 2px 10px 0 0px;
	padding:2px 4px;
	background:whitesmoke;
	border-radius: 5px;
	text-align:left;
	font-size: 14px;
	font-weight:bold;
	border:none;
	cursor:pointer;	
}
	select.selectSize:hover{
		background:white;
	}
clothInfoNewGarment{
	padding: 0px 0 0 5px;
	display:block;
	width:440px;
	/*background:blue;*/
	
}
	clothLineNewGarment{
		width:430px;
		display:flex;
		/*align-items:flex-start;*/
		align-items: left;
		justify-content: left;
		margin-bottom:10px;
		color: #111;
		transition: color 0.3s, background-color 0.3s;
	}
		clothLineNewGarment:hover{
			background:white;
		}

img.garmentClothIcon{
	animation: balanceo 0.5s ease-in-out 0.5s;
  transform-origin: center;
}
@keyframes balanceo {
  0%, 100% {
    transform: rotate(0deg);
  }
  25% {
    transform: rotate(-10deg);
  }
  50% {
  	transform: rotate(10deg);
  }
  75% {
    transform: rotate(-10deg);
  }
}
img.garmentClothIcon, img.garmentClothIconEdit, img.garmentClothIconInList{
	width:50px;
	cursor:pointer;
	margin: 5px;
	position: sticky;
	top: auto;
}
img.garmentClothIconEdit{
	cursor:default;
}
img.garmentClothIcon:hover{
	background:white;
}
img.garmentClothIconEdit:hover{
	background:auto;
}
/*.garmentSize{
	display:flex;
	width:40px;
	height:40px;
	cursor:pointer;
	margin: 5px;
	background-image: url('../-img/sizes.png');
	background-size: 40px;
	background-position: 0 0;
	background-repeat: no-repeat;
}
	.garmentSize:hover{
		background-color:white;
	}
	.optionSize{
		display:block;
		padding:2px;
		margin:1px;
		cursor:pointer;
		width:70px;
	}
		.optionSize:hover{
			background: white;
		}
	*/
	input.garmentBrand,
	input.garmentModel{
		margin:0;
		cursor:pointer;
		text-align:left;
		background-color:inherit;
		border: 1px solid whitesmoke;
		border-radius: 4px;
		font-size:14px;
		font-weight:normal;
		height:20px;
		width: 250px;
		color: #666;
		font-family:verdana;
		transition: border-color 0.3s, background-color 0.3s, color 0.3s;
	}
	input.garmentModel{
		margin-top:3px;
		font-style:italic;
		font-size:14px;
	}
	input.garmentBrand:focus,
	input.garmentModel:focus{
		text-align:left;
		background-color:white;
		border: 1px solid #bbb;
		border-radius: 4px;
		height:20px;
		color:#444;
		font-family:verdana;
		transition: border-color 0.3s, background-color 0.3s, color 0.3s;
	}
	textarea#garmentComment{
		cursor:pointer;
		padding:3px;
		font-size:16px;
		margin: 15px 30px 0 80px;
		font-family:verdana;
		text-align:justify;
		color:#777;
		width:390px;
		height:70px;
		background:whitesmoke;
		border:none;
		border:1px solid #ddd;
	}
	textarea#garmentComment:hover{
		background:#fafafa;
	}
	textarea#garmentComment:focus{
		color:#444;
		background:#fafafa;
		border-color:white;
	}
	a.linkGarmentNewBrand{
		font-style: normal;
		display:block;
		float:left;
		font-size:16px;
		border-radius: 4px;
		text-align:center;
		width:250px;
		color:#999;
		padding:3px 10px;
		border:1px solid white;
		text-decoration:none;
		text-shadow: none;
		transition: text-shadow 0.3s, border-color 0.3s;
		margin: 15px 0 0 10px;
		background: white;
	}
		a.linkGarmentNewBrand:hover{
			text-shadow: 0 1px 1px #fff;
			border-color:green;
		}
	clothLineDelete, clothLineDelete2{
		margin:0;
		position:absolute;
		cursor:pointer;
		width:20px;
		height:20px;
		display:block;
		/*background:orange;*/
		margin-left:410px;
		background: url('../-img/delete.png') left top no-repeat;
		background-size: 20px;
	}
	clothLineDelete2{
		background-image: url('../-img/delete2.png');
	}
	input#newGarmentSubmit, input#delGarmentSubmit{
		font-style: normal;
		display:block-inline;
		font-size:14px;
		border-radius: 4px;
		background: royalblue;
		text-align:center;
		width:245px;
		color:white;
		padding:13px 10px;
		border:1px solid white;
		text-decoration:none;
		text-shadow: none;
		transition: text-shadow 0.3s, border-color 0.3s;
		margin: 15px 15px 0 50px;
		cursor:pointer;
	}
	input#delGarmentSubmit{
		background: #F7BBBC;
		margin: 15px auto 15px 6px;
		width:130px;
		display:inline;
	}
		input#newGarmentSubmit:hover, input#delGarmentSubmit:hover{
			text-shadow: 0 1px 1px #fff;
			border-color:powderblue;
		}
		input#delGarmentSubmit:hover{
			text-shadow: 0 1px 1px red;
			border-color: crimson;
		}
	
	
}	
	
/* \- NEW GARMENT */