/*
 *-----------------------------------------------------------------
  Licensed Materials - Property of HCL Technologies
 *
 * HCL Commerce
 *
  (C) Copyright HCL Technologies Limited 1996, 2020
 *
 *-----------------------------------------------------------------
 */
 
	#deptSubESpot1 {
		height: 137px;
		overflow:hidden;
		position: relative;
		border-radius: 5px;
		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;
	}
 
	#deptSubESpot1.container, #deptSubESpot2.container{
		-webkit-border-radius: 5px;
		border-radius: 5px; 
		-moz-border-radius: 5px;

		border: 1px solid #e9e9e9;
	}

	#deptMainESpot-bkgrd-handbag1 {
		display: none;
	}

	#deptSubESpot1-bkgrd, #deptSubESpot2-bkgrd {
		width:100%;
		height:100%;
		
		/*height:137px;*/
		/* webkit example */
        background-image: -webkit-gradient(
        linear, left bottom, left top, from(rgba(217, 217, 217, 1)),
          to(rgba(255, 255, 255, 0))
        );

        background: -moz-linear-gradient(white, #d9d9d9);  

        background: linear-gradient(to bottom, rgba(255, 255, 255, 0),  rgba(217, 217, 217, 1));
	
        zoom: 1;

	    filter: progid:DXImageTransform.Microsoft.gradient(
	        gradientType=0, startColor=14085119, endColorStr=#d9d9d9ff
	    );
	    -ms-filter: progid:DXImageTransform.Microsoft.gradient(
	        gradientType=0, startColor=14085119, endColorStr=#d9d9d9ff
	    );
	}

	#deptSubESpot1 .espotCont, #deptSubESpot2 .espotCont {
		position: relative;
		margin: 0 auto;
		width: 53%;
		height: 100%;
		max-width: 180px;
	}

	#deptSubESpot1-multiImgCont {
		position: absolute;
		left: -52%;
		width: 100%;
	}

	#deptSubESpot1-bag1 {
		position: absolute;
		z-index: 3;
		height: 59px;
		width: 107px;
		right: 17%;
		top: 55px;
	}
	
	#deptSubESpot1-bag1  > div{
		height: 100%;
		background-image: url("handbag1.png");
		background-position: center;
		background-size: cover;
	}
	
	#deptSubESpot1-bag1  > img{
		width:100%; 
		height:100%;
	}

	#deptSubESpot1-bag2 {
		position: absolute;
		z-index: 2;
		height: 102px;
		width: 117px;
		left: 0;
		top: 11px;
	}
	
	#deptSubESpot1-bag2  > div{
		height: 100%;
		background-image: url("handbag2.png");
		background-position: center;
		background-size: cover;
	}
	
	#deptSubESpot1-bag2  > img{
		width:100%; 
		height:100%; 
	}

	#deptSubESpot1-bag3 {
		width: 162px;
		position:absolute;
		z-index:1;
		display:none;
	}
	
	#deptSubESpot1-bag3  > div{
		height: 100%;
		background-image: url("handbag3.png");
		background-position: center;
		background-size: cover;
	}

	#deptSubESpot1-titleCont {
		position: absolute;
		width: 183px;
		padding-top: 22px;
		right: -40%;
		z-index: 4;
	}

	#deptSubESpot1 .title1 {
		font-family: arial;
		font-size: 21px;
		line-height: 35px;
		color: #666666;
		padding-bottom: 7px;
		margin-bottom: 4px;
		border-bottom: 1px solid #b0afaf;
		text-align:center;
		white-space: nowrap;
	}

	#deptSubESpot1 .title2 {
		font-family: arial;
		font-size: 13px;
		line-height: 16px;
		color: #555555;
		text-align:center;
	}
	
@media screen and (min-width: 1281px) {
	#deptSubESpot1 {
		height: 179px;
	}

	#deptSubESpot1 .espotCont, #deptSubESpot2 .espotCont {
		width: 53%;
		height: 100%;
		max-width: 287px;
	}

	#deptSubESpot1-multiImgCont {
		position: absolute;
		left: -47%;
		width: 100%;
	}

	#deptSubESpot1-bag1 {
		position: absolute;
		z-index: 3;
		width: 141px;
		height: 78px;
		right: 28%;
		top: 81px;
	}

	#deptSubESpot1-bag2 {
		position: absolute;
		z-index: 2;
		width: 155px;
		height: 135px;
		left: 0;
		top: 6px;
	}

	#deptSubESpot1-bag3 {
		position: absolute;
		z-index: 1;
		display: block;
		width: 162px;
		height: 69px;
		right: 20px;
		top: 60px;
	}

	#deptSubESpot1-titleCont {
		position: absolute;
		width: 230px;
		padding-top: 32px;
		right: -38%;
		z-index: 4;
	}

	#deptSubESpot1 .title1 {
		font-size: 26px;
		line-height: 35px;
		padding-bottom: 12px;
		margin-bottom: 7px;
	}

	#deptSubESpot1 .title2 {
		font-family: arial;
		font-size: 14px;
		line-height: 17px;
		color: #555555;
		text-align: center;
	}	

}

@media screen and (min-width: 952px) {
	#deptSubESpot1 .title1 {
		line-height: 20px;
		white-space: normal;
	}
}

@media screen and (max-width: 952px) {
	#deptSubESpot1 {
		height: 178px;
	}

	#deptSubESpot1-bkgrd, #deptSubESpot2-bkgrd {
		height:178px;
	}

	#deptSubESpot1 .espotCont, #deptSubESpot2 .espotCont {
		width: 100%;
		height: 100%;
		max-width: 200px;
	}

	#deptSubESpot1-multiImgCont {
		left: 0;
		width: 90%;
	}

	#deptSubESpot1-bag1 {
		width: 83px;
		height: 46px;
		right: 7%;
		top: 42px;
	}

	#deptSubESpot1-bag2 {
		width: 92px;
		height: 80px;
		left: 14%;
		top: 7px;
	}

	#deptSubESpot1-titleCont {
		position: relative;
		width: 172px;
		margin: 0 auto;
		padding-top: 101px;
		right: auto;
		z-index: 0;
	}

	#deptSubESpot1 .title1 {
		font-size: 18px;
		line-height: 17px;
	}

	#deptSubESpot1 .title2 {
		font-size: 11px;
		line-height: 16px;
	}
}

@media screen and (max-width: 856px) {
	#deptSubESpot1 .title1 {
		font-size: 14px;
	}
}

@media screen and (max-width: 600px) {
	
	#deptSubESpot1 {
		width:100%;
		height:98px;
	}
	
	#ApparelRow2_Content_Left_ {
		margin: 0 -10px;
	}

	#subESpot.col12 #deptSubESpot1.container,
	#subESpot.col12 #deptSubESpot1.container {
		margin: 0 0 10px 0;	
	}

	#deptSubESpot1-bkgrd, #deptSubESpot2-bkgrd {
		-webkit-border-radius: 0px;
		border-radius: 0px; 
		-moz-border-radius: 0px;
	}

	#deptSubESpot1 .espotCont, #deptSubESpot2 .espotCont {
		width: 55%;
		height: 100%;
		max-width: 186px;
	}

	#deptSubESpot1.container, #deptSubESpot2.container {
		border-left: 0;
		border-right: 0;
		-webkit-border-radius: 0px;
		border-radius: 0px;
		-moz-border-radius: 0px;
	}

	#deptSubESpot1-bkgrd, #deptSubESpot2-bkgrd {
		background-image: none;
	}

	#deptSubESpot1-multiImgCont {
		position: absolute;
		left: -40%;
		width: 100%;
	}

	#deptSubESpot1-bag1 {
		display: none;
	}

	#deptSubESpot1-bag2 {
		display: none;
	}
	
	#deptSubESpot1-bag3 {
		display: none;
	}
	
	#deptSubESpot1-bkgrd-handbag1 {
		display: block;
		position: absolute;
		width: 100%;
		height: 100%;
	}
	
	#deptSubESpot1-bkgrd-handbag1 > div {
		width: 100%;
		height: 100%;
		background-image: url("bkgd-handbag1.jpg");
		background-position: center;
		background-size: cover;
	}

	#deptSubESpot1-titleCont {
		position: absolute;
		width: 183px;
		padding-top: 19px;
		right: -37%;
	}

	#deptSubESpot1 .title1 {
		font-size: 16px;
		line-height: 17px;
	}
}

@media screen and (max-width: 520px) {
	#deptSubESpot2 .title1 {
		font-size: 15px;
		line-height: 17px;
	}
}