/* This CSS for small Mobile*/
@media only screen and (max-width: 767px) {
#tshirt {
  background-position: center center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  display: block;
  height: 648px;
  left: 50%;
  margin-left: -150px;
  position: absolute;
  top: -10px;
  width: 300px;
}

#tshirt.type-one #card-face-second {
  height: 33px;
  left: 100px;
  position: absolute;
  top: 325px;
  width: 68px;
}

#tshirt.type-one #card-face-first {
  height: 50px;
  left: 117px;
  position: absolute;
  top: 308px;
  width: 52px;
}

#tshirt.type-two #card-face-second {
  height: 33px;
  left: 98px;
  position: absolute;
  top: 317px;
  width: 68px;
}

#tshirt.type-two #card-face-first {
  height: 30px;
  left: 115px;
  position: absolute;
  top: 300px;
  width: 52px;
}

#tshirt.type-three #card-face-second {
  height: 33px;
  left: 99px;
  position: absolute;
  top: 318px;
  width: 68px;
}

#tshirt.type-three #card-face-first {
  height: 30px;
  left: 116px;
  position: absolute;
  top: 301px;
  width: 52px;
}

#tshirt.type-four #card-face-second {
  height: 33px;
  left: 98px;
  position: absolute;
  top: 324px;
  width: 68px;
}

#tshirt.type-four #card-face-first {
  height: 30px;
  left: 115px;
  position: absolute;
  top: 307px;
  width: 52px;
}

main.container {
  overflow-x: hidden;
}

.heading-text-top h2 {
  font-size: 14px;
  margin: 30px 0 20px;
}

.heading-text-top h2 strong {
  font-size: 30px;
  position: relative;
  top: 6px;
}

#cart-button {
  height: 33px;
  right: -5px;
  top: -13px;
  width: 40px;
}

main {
  background-attachment: local;
  background-size: 100% 74%;
  min-height: 567px;
}

#left-red-arrow h2, #right-red-arrow h2 {
  font-size: 14px;
}

#left-red-arrow {
  background-position: 33px 40px;
  background-size: 36% 39%;
  height: 206px;
  left: 0;
  position: absolute;
  top: 86px;
  width: 250px;
  z-index: 28;
}

#right-red-arrow {
  background-position: 85px 37px;
  background-size: 43% 80%;
  height: 168px;
  left: 45px;
  position: absolute;
  text-shadow: 1px 1px 1px #fff;
  top: 123px;
  width: 250px;
}

body {
  background-position: center bottom;
}

#add-to-cart #add-to-cart-button {
  left: 50%;
  margin-left: -100px;
  width: 200px;
}

#add-to-cart #add-to-cart-button {
  background-repeat: no-repeat;
  background-size: 100% auto;
  left: 50%;
  margin-left: -100px;
  top: 565px;
  width: 200px;
}

#left-arrow {
  box-shadow: 1px 1px 2px #000;
  height: 34px;
  left: 0;
  top: 300px;
}

#right-arrow {
  box-shadow: 1px 1px 2px #000;
  height: 34px;
  left: 255px;
  top: 300px;
}

main.container {
  width: 320px;
}

#tshirt.type-one #hand, #tshirt.type-two #hand, #tshirt.type-three #hand, #tshirt.type-four #hand {
  display: none;
}

#wear-your-shirt > h2 {
  font-size: 17px;
}

#wear-your-shirt {
  top: 500px;
}

.popup, .popup_product {
  top: 10px !important;
  width: 280px;
  left: 50% !important;
  margin-left:-140px;
  height: 450px;
}

.popup-content-tshirt > img {
  margin: 40px auto 20px !important;
  width: 70% !important;
}

.tshirt-small {
  height: 50px;
  width: 50px;
}

.sizes {
  margin: 90px 0 40px;
  padding-top: 40px;
}

#customer_details, #order_review {
  width: 100%;
}

#order_review {
  margin-top: 20px;
}

.wp-social-login-widget {
  margin-top: -15px;
  text-align: center;
}
}

/* This CSS for Tablet */
@media only screen and (min-width: 768px) and (max-width: 991px) {
#tshirt {
  background-position: center center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  display: block;
  height: 648px;
  left: 50%;
  margin-left: -225px;
  position: absolute;
  top: 184px;
  width: 450px;
}

#tshirt.type-one #card-face-first, #tshirt.type-four #card-face-first {
  left: 170px;
  top: 296px;
  width: 84px;
}

#tshirt.type-one #card-face-second, #tshirt.type-four #card-face-second {
  left: 143px;
  top: 322px;
  width: 111px;
}

#tshirt.type-two #card-face-first {
  left: 170px;
  top: 286px;
  width: 84px;
}

#tshirt.type-two #card-face-second {
  left: 143px;
  top: 312px;
  width: 111px;
}

#tshirt.type-three #card-face-second {
  left: 144px;
  top: 314px;
  width: 111px;
}

#tshirt.type-three #card-face-first {
  left: 171px;
  top: 287px;
  width: 84px;
}

#add-to-cart #add-to-cart-button {
  left: 50%;
  margin-left: -165px;
  width: 330px;
}

.maps img {
  margin-top: 75px;
  width: 100%;
}

.heading-text-top h2 {
  font-size: 35px;
  margin: 60px 0 20px;
}

#cart-button {
  right: 15px;
}

#left-red-arrow {
  background-position: 206px 47px; 
  background-size:30% auto;
  left: 0;
  top: 249px;
  width: 415px;
}

#right-red-arrow {
  background-position: 56px 59px;
  background-size: 65% auto;
  font-size: 18px;
  left: 297px;
  position: absolute;
  top: 277px;
  width: 428px;
}

#left-arrow {
  left: 175px;
  top: 490px;
}

#right-arrow {
  left: 510px;
  top: 490px;
}

#tshirt.type-one #hand {
  background-size: 87% auto;
  left: 196px;
  top: 339px;
  width: 208px;
}

#tshirt.type-two #hand, #tshirt.type-three #hand {
  background-size: 83% auto;
  left: 195px;
  top: 334px;
  width: 208px;
}

main {
  min-height: 1085px;
}

#add-to-cart #add-to-cart-button {
  top: 930px;
}

#wear-your-shirt > h2 {
  font-size: 26px;
}

#wear-your-shirt {
  top: 875px;
}

.heading-text-top h2 strong {
  font-size: 66px;
  top: 10px;
}

body {
  background-position: center bottom;
}

.popup, .popup_product {
  top: 10px !important;
  width: 600px;
  left: 50% !important;
  margin-left:-300px;
}

#right-red-arrow {
  height: 201px;
}

#tshirt.type-one #card-face-second, #tshirt.type-two #card-face-second, #tshirt.type-three #card-face-second, #tshirt.type-four #card-face-second {
  height: 53px;
}
}

/* This CSS for Medium Devices */
@media only screen and (min-width: 992px) and (max-width: 1199px) {
#tshirt {
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  display: block;
  height: 648px;
  left: 157px;
  position: absolute;
  top: 337px;
  width: 611px;
}

#add-to-cart #add-to-cart-button {
  left: 50%;
  margin-left: -165px;
  width: 330px;
}

#left-red-arrow {
  left: 30px;
  top: 330px;
}

#right-red-arrow {
  left: 445px;
  top: 383px;
  width: 488px;
}

#cart-button {
  right: 35px;
}

#right-arrow {
  left: 680px;
  top: 635px;
}

#left-arrow {
  left: 216px;
  top: 635px;
}

#wear-your-shirt > h2 {
  font-size: 30px;
}

#wear-your-shirt {
  top: 1130px;
}

.popup, .popup_product {
  top: 10px !important;
  width: 800px;
}
}

/* This CSS for Large Devices */
@media only screen and (min-width: 1200px) {

}