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

*, *:after, *:before {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}

body, body * {
  position: absolute;
  vertical-align: baseline;
  border: 0 none;
  outline: 0;
  padding: 0;
  margin: 0;
  cursor: pointer;
}

#main_wrapper {
	position: absolute;
	display: block;
	width: 300px;
	height: 600px;
	overflow: hidden;
	background-color: #fff;
	opacity: 0;
}

.active#main_wrapper {				
	opacity: 1;				
}

#frame {
	content: "";
	border: 1px solid #ccc;
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0px;	
    left: 0px;
    z-index: 100;
}

#logo {
    position: absolute;
    right: 15px;
    bottom: 15px;
    z-index: 20;
    filter: blur(0px);
}

#frame_1 {
}
#frame_2 {
    left: 395px;
}
#frame_3 {
    left: 790px;
}
#frame_4 {
    left: 1185px;
}
#window_1 {
    position: absolute;
    background-image: url(img/window_frame.png);
    background-size: 400px 600px;
    width: 400px;
    height: 600px;
    z-index: 7;
    /*filter: blur(1.2px);*/
    transform: scale(1.05);
    outline: 1px solid transparent;
}
#img_1 {
    position: absolute;
    background-image: url(img/img1.jpg);
    background-size: 300px 600px;
    width: 300px;
    height: 600px;
    z-index: 5;
    filter: blur(3px);
    transform: scale(1.05);
}
#window_2 {
    position: absolute;
    background-image: url(img/window_frame.png);
    background-size: 400px 600px;
    width: 400px;
    height: 600px;
    z-index: 7;
}
#img_2 {
    position: absolute;
    background-image: url(img/img2.jpg);
    background-size: 300px 600px;
    width: 300px;
    height: 600px;
    z-index: 5;
}
#window_3 {
    position: absolute;
    background-image: url(img/window_frame.png);
    background-size: 400px 600px;
    width: 400px;
    height: 600px;
    z-index: 7;
}
#img_3 {
    position: absolute;
    background-image: url(img/img3.jpg);
    background-size: 300px 600px;
    width: 300px;
    height: 600px;
    z-index: 5;
}
#window_4 {
    position: absolute;
    background-image: url(img/window_frame.png);
    background-size: 400px 600px;
    width: 400px;
    height: 600px;
    z-index: 7;
}
#img_4 {
    position: absolute;
    background-image: url(img/img4.jpg);
    background-size: 300px 600px;
    width: 300px;
    height: 600px;
    z-index: 5;
    filter: blur(0px);
}

#snowSparkle {
    position: absolute;
    left: 50%;
    top: 20px;
    transform: translateX(-50%);

}

#message {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: 146px;
}

#shopNow {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: 260px;
    width: 125px;
    height: auto;
}

#message2 {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: 352px;
}

#message3 {
    position: absolute;
    left: 0;
    top: 0;
}

#ctaButton {
    position: absolute;
    left: 90px;
    top: 327px;
    background: url(img/cta.svg) no-repeat;
    background-size: 120px 35px;
    width: 120px;
    height: 35px;
}


#lockup {
    z-index: 15;
    position: absolute;
    width: 100%;
    height: 100%;
}

#hide_all {
    position: absolute;
    background-color: #fff;
	width: 100%;
	height: 100%;
    z-index: 100;
}

.dark_frame {
    position: absolute;
    width: 254px;
    height: 476px;
    background-color: #000000;
    opacity: 0.3;
    top: 65px;
    left: 21px;
}

.copyEnd {
    position: absolute;
    top: 190px;
    left: 0px;
}