@charset "UTF-8";
/* CSS Document */
@font-face
{
font-family: myArial;
src: url('Arial-Normal.ttf')
, url('Arial-Normal.otf')
, url('arial-normal-webfont.eot');
}
body{
	margin:0px;
	padding:0px;
	font-family:myArial;
}
.container {
	opacity:0.2;
	font-family:myArial;
	margin: auto;
	padding: 0px;
	height: 700px;
	width: 1000px;
	position: absolute;
	top: 0; left: 0; bottom: 0; right: 0;
	
}
.title {
	letter-spacing:1px;
	font-size:30px;
	height: 18px;
	text-align:center;
	width: 100%;
	position:absolute;
	top: 120px; left: 0px; bottom: 0; right: 0;
	-moz-transition: all .3s linear;
     -webkit-transition: all .3s linear;
     transition: all .3s linear;
	
}
.smallTitle {
	color:#999;
	text-align:center;
	letter-spacing:0px;
	font-size:8px;
	height: 18px;
	width: 100px;
	position:absolute;
	top: 0px; left: 0px; bottom: 0; right: 0;
}
.smallTitle:first-line {
	letter-spacing:0px;
	font-size:13px;
}
.subTitle {
	font-size:16px;
	height: 20px;
	text-align:center;
	width: 100%;
	position:absolute;
	top: 160px; left: 0px; bottom: 0; right: 0;

}
.homeimgContainer{
	height: 144px;
	width: 775px;
	position:absolute;
	top: 280px; 
	left:11%;
	-moz-transition: all .3s linear;
     -webkit-transition: all .3s linear;
     transition: all .3s linear;
	
}
.homeimg{
	width:144px;
	height:144px;
	margin-left:5px;
	margin-right:5px;
	display:inline-block;
	-moz-transition: all .3s linear;
     -webkit-transition: all .3s linear;
     transition: all .3s linear;
	
	}
.imgMenu{
	color:#000;
	letter-spacing:0px;
	font-size:16px;
	height: 16px;
	text-align:center;
	width: 800px;
	position:absolute;
	bottom: 55px; left:6%;
	
}
.menuWeddings{
	color:#000;
	letter-spacing:0px;
	font-size:14px;
	height: 32px;
	text-align:center;
	width: 100px;
	position:absolute;
	bottom: 19px; left:142px;
	-moz-transition: all .3s linear;
     -webkit-transition: all .3s linear;
     transition: all .3s linear;
	
}
.imgMenu span{
	margin-left:30px;
	margin-right:30px;
}
.menu{
	letter-spacing:1px;
	font-size:12px;
	color:#CCC;
	height: 12px;
	text-align:center;
	width: 340px;
	position:absolute;
	bottom: 26px; left:33%;
	-moz-transition: all .3s linear;
     -webkit-transition: all .3s linear;
     transition: all .3s linear;
}
.menu span{
	margin-left:25px;
	margin-right:25px;
}
.black{
	color:#000;
}

.copyright{
	font-size:10px;
	color:#999;
	height: 12px;
	text-align:center;
	width: 100%;
	position:absolute;
	bottom: 0px;
	
}
a{
	text-decoration:none;
	color:#999;
	-moz-transition: all .5s linear;
     -webkit-transition: all .5s linear;
     transition: all .5s linear;
}
a:hover{
	color:#000;
	
}
.meImg{
	height: 200px;
	width: 108px;
	position: absolute;
	top: 220px;
	left: 22%;
	font-size: 22px;
	letter-spacing: 2px;
	-moz-transition: all .3s linear;
     -webkit-transition: all .3s linear;
     transition: all .3s linear;
}

.meImg img{
	width: 108px;
	height: 108px;
	position:absolute;
	top:48px;
}
.aboutContainer{
	height: 370px;
	width: 500px;;
	position:absolute;
	top: 220px; 
	left:41%;
	line-height:21px;
	-moz-transition: all .3s linear;
     -webkit-transition: all .3s linear;
     transition: all .3s linear;
	
}
.contactContainer{
	height: 370px;
	width: 500px;;
	position:absolute;
	top: 220px; 
	left:41%;
	line-height:21px;
	-moz-transition: all .3s linear;
     -webkit-transition: all .3s linear;
     transition: all .3s linear;
	
}
#thumbnail{
	height: 60px;
	width: 900px;
	position: absolute;
	display:block;
	top: 550px;
	left: 50px;
	background-color: #FFF;
	float: left;
	overflow:hidden;
	-moz-transition: all .1s linear;
     -webkit-transition: all .1s linear;
     transition: all .1s linear;
	
}
#thumbnail img{
	width:100px;
	height:60px;
	overflow:hidden;
	float:left;
	cursor:pointer;
	position:relative;
	top:0px;
	opacity:1;
	-moz-transition: all .3s linear;
     -webkit-transition: all .3s linear;
     transition: all .3s linear;
	
}
#thumbnail img:hover{
	opacity:0.5;
	
}
#arrowL{
	height: 60px;
	width: 50px;
	position: absolute;
	top: 550px;
	left: 0px;
	background-image:url(../web_images/img/arrow.jpg);
	cursor:pointer;
	-moz-transition: all .3s linear;
     -webkit-transition: all .3s linear;
     transition: all .3s linear;
}
#arrowR{
	height: 60px;
	width: 50px;
	position: absolute;
	top: 550px;
	right: 0px;
	background-image:url(../web_images/img/arrow.jpg);
	cursor:pointer;
	transform:rotate(180deg);
	-ms-transform:rotate(180deg); /* IE 9 */
	-webkit-transform:rotate(180deg); /* Safari and Chrome */
	-moz-transition: all .3s linear;
     -webkit-transition: all .3s linear;
     transition: all .3s linear;
}

#arrowL:hover, #arrowR:hover{
	opacity:0.3;
}
#thNum{
	height: 60px;
	width: 50px;
	position: absolute;
	top: 616px;
	right: 52px;
	color:#666;
	text-align:right;
	font-size:10px;
	letter-spacing:1px;
	
}
#showImg{
	width:786px;
	height:524px;
	position: absolute;
	left:107px;
	background-color:#FFF;
	

}
#bigBack{
	height: 33px;
	width: 22px;
	position: absolute;
	top: 260px;
	right: 50px;
	opacity:1;
	background-image:url(../web_images/img/sarrow.jpg);
	cursor:pointer;
	-moz-transition: all .3s linear;
     -webkit-transition: all .3s linear;
     transition: all .3s linear;
}
#bigNext{
	height: 33px;
	width: 22px;
	position: absolute;
	top: 210px;
	right: 50px;
	opacity:1;
	background-image:url(../web_images/img/sarrow.jpg);
	cursor:pointer;
	transform:rotate(180deg);
	-ms-transform:rotate(180deg); /* IE 9 */
	-webkit-transform:rotate(180deg); /* Safari and Chrome */
	-moz-transition: all .3s linear;
     -webkit-transition: all .3s linear;
     transition: all .3s linear;

}
#bigBack:hover, #bigNext:hover{
	opacity:0.3;
}
#showImg img{
	
}
p{
	display:none;
}

@media (min-width: 2001px) and (max-width: 2400px)  {

}
@media (min-width: 1501px) and (max-width: 2000px)  {
	
}
@media (min-width: 1101px) and (max-width: 1500px)  {
}

@media (min-width: 901px) and (max-width: 1100px) {

.smallTitle {
	
	top: 20px; 
	left: 40px; 
}
.container {
	
	height:600px;
	width: 900px;
}

#showImg{
	width:600px;
	height:400px;
	position: absolute;
	top:20px;
	left:150px;
	background-color:#FFF;
	

}
#showImg img{
	width:100%;
	width:100%;
}
#thumbnail{
	height: 55px;
	width: 810px;
	position: absolute;
	top: 435px;
	left: 45px;
}
#thumbnail img{
	width:90px;
	height:55px;
	
}
#arrowL{
	height: 55px;
	width: 45px;
	position: absolute;
	top: 435px;
	left: 0px;

}#arrowR{
	height: 55px;
	width: 45px;
	position: absolute;
	top: 435px;
	right: 0px;
	
}
.imgMenu{
	
	bottom: 70px; left:6%;
}
.imgMenu span{
	margin-left:30px;
	margin-right:30px;
}

.menuWeddings{
	
	bottom: 35px; left:142px;
}
#thNum{
	top: 500px;
	right: 52px;

}
.menu{
	bottom: 40px; 
	
}
.copyright{
	
	bottom: 10px;
}
#bigBack{
	height: 33px;
	width: 22px;
	
	top: 230px;
	right: 80px;
}
#bigNext{
	height: 33px;
	width: 22px;
	
	top: 180px;
	right: 80px;
}
.title {

	top: 80px; 
}
.subTitle {

	top: 120px; 
}
.homeimgContainer{
	top: 220px; 
	left:70px;
}
.aboutContainer{
	height: 350px;
	width: 590px;;
	position:absolute;
	top: 180px; 
	left:230px;
	line-height:19px;
}
.meImg{
	height: 200px;
	width: 108px;
	position: absolute;
	top: 180px;
	left: 90px;
	font-size: 22px;
	
}
.contactContainer{
	height: 350px;
	width: 590px;;
	position:absolute;
	top: 180px; 
	left:350px;
	line-height:19px;
}

  }
  @media (min-width: 601px) and (max-width: 900px) {
	  
.smallTitle {
	
	top: 20px; 
	left: 40px; 
}
.container {
	
	height:650px;
	width: 600px;
}

#showImg{
	width:500px;
	height:400px;
	position: absolute;
	top:50px;
	left:50px;
	background-color:#FFF;
	

}
#showImg img{
	width:100%;
}
#thumbnail{
	height: 110px;
	width: 500px;
	position: absolute;
	top: 400px;
	left: 50px;
}
#thumbnail img{
	height: 55px;
	width: 100px;
	
	
}
#arrowL{
	height: 55px;
	width: 45px;
	position: absolute;
	top: 425px;
	left: 0px;

}#arrowR{
	height: 55px;
	width: 45px;
	position: absolute;
	top: 430px;
	right: 0px;
	
}
.imgMenu{
	
	bottom: 90px; left:0px;
	width:600px;
}
.imgMenu span{
	margin-left:10px;
	margin-right:10px;
}

.menuWeddings{
	
	bottom: 53px; left:65px;
}
#thNum{
	top: 515px;
	right: 52px;

}
.menu{
	bottom: 50px; 
	 left:27%;
}
.copyright{
	
	bottom: 10px;
}
#bigBack{
	height: 78px;
	width: 50px;
	background-image:url(../web_images/img/bigA.jpg);
	top: 178px;
	left: 0px;
}
#bigNext{
	height: 78px;
	width:50px;
	background-image:url(../web_images/img/bigA.jpg);
	
	top: 180px;
	right:0px;
}
.title {

	top: 80px; 
}
.subTitle {

	top: 120px; 
}
.homeimgContainer{
	top: 220px; 
	left:70px;
}
.aboutContainer{
	height: 350px;
	width: 590px;;
	position:absolute;
	top: 180px; 
	left:230px;
	line-height:19px;
}
.meImg{
	height: 200px;
	width: 108px;
	position: absolute;
	top: 180px;
	left: 90px;
	font-size: 22px;
	
}
.contactContainer{
	height: 350px;
	width: 590px;;
	position:absolute;
	top: 180px; 
	left:350px;
	line-height:19px;
}
  }
@media (min-width: 300px) and (max-width: 600px) {
 
.smallTitle {
	display:none;
}
.container {
	height:450px;
	width: 500px;
	background-color:#FFF;

}

#showImg{
	width:100%;
	position: absolute;
	top:0px;
	left:0px;
	background-color:#FFF;
}
#showImg img{
	width:100%;
}
#thumbnail{
	display:none;

}

#arrowL{
	display:none;

}#arrowR{
	display:none;
	
}
.imgMenu{
	bottom: 60px; left:5%;
	width: 90%;
	text-align:center;
}
.imgMenu span{
	margin-left:0px;
	margin-right:10px;
}
.menuWeddings{
	
	bottom: 78px; left:15%;
}
#thNum{
	display:none;
}
.menu{
	bottom: 30px; left:0px; 
	width: 100%;
	
}
.copyright{
	
	bottom: 10px;
}
#bigBack{
	height: 78px;
	width:50px;
	background-image:url(../web_images/img/bigA.jpg);
	opacity:0.6;
	top: 130px;
	left: 0px;
}
#bigNext{
	height: 78px;
	width:50px;
	background-image:url(../web_images/img/bigA.jpg);
	opacity:0.6;
	top: 130px;
	right:0px;
}
.title {

	top: 80px; 
}
.subTitle {

	top: 120px; 
}
.homeimgContainer{
	top: 150px; 
	left:35%;
	width:144px;
	height:144px;
	overflow:hidden;
}
.aboutContainer{
	height: 100px;
	width: 90%;;
	position:absolute;
	top: 180px; 
	left:5%;
	overflow-y:scroll;
	line-height:19px;
}
.meImg{
	display:none;
	
}
.contactContainer{
	height: 350px;
	width: 90%;;
	position:absolute;
	top: 180px; 
	left:5%;
	line-height:19px;
}
 
}

 
@media all and (max-width: 320px) {
 
}
@media only screen and(min-width: 1101px) and (max-width: 1300px)  {
	
}
@media only screen and (min-device-width: 601px) and (max-device-width: 1100px) {

.smallTitle {
	
	top: 20px; 
	left: 40px; 
}
.container {
	
	height:600px;
	width: 900px;
}

#showImg{
	width:600px;
	height:400px;
	position: absolute;
	top:20px;
	left:150px;
	background-color:#FFF;
	

}
#showImg img{
	width:100%;
	width:100%;
}
#thumbnail{
	height: 55px;
	width: 810px;
	position: absolute;
	top: 435px;
	left: 45px;
}
#thumbnail img{
	width:90px;
	height:55px;
	
}
#arrowL{
	height: 55px;
	width: 45px;
	position: absolute;
	top: 435px;
	left: 0px;

}#arrowR{
	height: 55px;
	width: 45px;
	position: absolute;
	top: 435px;
	right: 0px;
	
}
.imgMenu{
	
	bottom: 70px; left:6%;
}
.imgMenu span{
	margin-left:30px;
	margin-right:30px;
}

.menuWeddings{
	
	bottom: 35px; left:142px;
}
#thNum{
	top: 500px;
	right: 52px;

}
.menu{
	bottom: 40px; 
}
.copyright{
	
	bottom: 10px;
}
#bigBack{
	height: 33px;
	width: 22px;
	
	top: 230px;
	right: 80px;
}
#bigNext{
	height: 33px;
	width: 22px;
	
	top: 180px;
	right: 80px;
}
.title {

	top: 80px; 
}
.subTitle {

	top: 120px; 
}
.homeimgContainer{
	top: 220px; 
	left:70px;
}
.aboutContainer{
	height: 350px;
	width: 590px;;
	position:absolute;
	top: 180px; 
	left:230px;
	line-height:19px;
}
.meImg{
	height: 200px;
	width: 108px;
	position: absolute;
	top: 180px;
	left: 90px;
	font-size: 22px;
	
}
.contactContainer{
	height: 350px;
	width: 590px;;
	position:absolute;
	top: 180px; 
	left:350px;
	line-height:19px;
}
}
  

 
@media only screen and (min-device-width: 321px) and (max-device-width: 600px) {

}
 
@media only screen and (max-device-width: 320px) {
 
 
}