body {
    font-family: "Helvetica Neue", Helvetica, Arial, "微軟正黑體", "LiHei Pro", sans-serif;
	font-family:Arial, Helvetica, sans-serif;/*fallback for fucking IE*/
    font-size: 1em;
    line-height: 1.4;
}

/*
 * Remove the gap between images and the bottom of their containers: h5bp.com/i/440
 */

img {
    vertical-align: middle;
}

/*
 * Allow only vertical resizing of textareas.
 */

textarea {
    resize: vertical;
}

/* ==========================================================================
   Chrome Frame prompt
   ========================================================================== */

.chromeframe {
    margin: 0.2em 0;
    background: #ccc;
    color: #000;
    padding: 0.2em 0;
}

/* ==========================================================================
   Author's custom styles
   ========================================================================== */

html,
body{
    height:100%;
    background:#f7f7f7;
}
.fl{
  display: inline-block;
  vertical-align: top;
}
.lt-ie9 .container{
	display:none;
}

.container{ width: 100%; height: 100%; overflow: hidden; 
}

.leftCol{
	position: absolute;
	bottom: 0;
	width: 250px;
	background: #f7f7f7;
	background: -moz-linear-gradient(top, #e3e3e3 1%,#f7f7f7 15%,#f7f7f7 85%, #e3e3e3 100%);
	background: -webkit-gradient(linear, top, bottom, color-stop(1%,#e3e3e3), color-stop(15%,#f7f7f7), color-stop(85%,#f7f7f7), color-stop(100%,#e3e3e3));
	background: -webkit-linear-gradient(top, #e3e3e3 1%,#f7f7f7 15%,#f7f7f7 85%,#e3e3e3 100%);
	background: -o-linear-gradient(top #e3e3e3 1%,#f7f7f7 15%,#f7f7f7 85%,#e3e3e3 100%);
	background: -ms-linear-gradient(top, #e3e3e3 1%,#f7f7f7 15%,#f7f7f7 85%,#e3e3e3 100%);
	background: linear-gradient(top, #e3e3e3 1%,#f7f7f7 15%,#f7f7f7 85%,#e3e3e3 100%);
	background-image:url(../images/leftbg.jpg) \9;
	box-shadow:0 0 5px 0 rgba(100,100,100,.3),inset -1px 0 20px rgba(100,100,100,0.2);
	z-index:9999;
	height: 100%;
	overflow:hidden;
	-moz-text-shadow: 1px 1px 1px rgba(255,255,255,.8);
	-webkit-text-shadow: 1px 1px 1px rgba(255,255,255,.8);
	text-shadow: 1px 1px 1px rgba(255,255,255,.8);
}

.rightCol{ width: 100%; height: 100%; background:#f7f7f7; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; /*The rest of the browsers support this now*/ box-sizing: border-box; margin: 0; padding: 0; 
}
.web.rightCol{overflow-y: scroll;}
.fb{
	position:absolute;
	left:60px;
	bottom:25%;
	text-align:center;
}
.btm{
	position:absolute;
	left:60px;
	bottom:20px;
	text-align:center;
}

.spImg{
	text-indent:-9999px;
	background:url(../images/reliisImg.png) no-repeat;
}

.logo{ width:143px; height:60px; background-position:0 -160px; margin:50px auto 20px; 
}

.language a{
	display: inline-block;
  vertical-align: top;
	color: #999;
}

.language a.on,.language a.on:hover{
  color: #333;
}

.language a:first-child:after,.language a:nth-child(2):after{
	content:"";
	margin:0 5px;
	border-right:1px  solid #333;
}

.copyright{
	margin:15px 0 0 0;
	font-size:0.7em;
}
/*
 *ac-menu
 */
#accordian {
	width: 220px;
	margin: 0 auto;
}

.leftCol h3 {
	color:#333;
	font-weight:normal;
	font-size: 1.2em;
	line-height: 40px;
	padding: 0 10px;
	cursor: pointer;
}
.active h3{
	color: #F29600;
	-webkit-box-sizing: border-box;
  -moz-box-sizing: border-box; 
  box-sizing: border-box;
	background: #f7f7f7;
  background: -moz-linear-gradient(right, #f7f7f7 1%,#fdfdfd 50%, #f7f7f7 100%);
  background: -webkit-gradient(linear, left, right, color-stop(1%,#f7f7f7), color-stop(50%,#fdfdfd), color-stop(100%,#f7f7f7));
  background: -webkit-linear-gradient(right, #f7f7f7 1%,#fdfdfd 50%,#f7f7f7 100%);
  background: -o-linear-gradient(right #f7f7f7 1%,#fdfdfd 50%,#f7f7f7 100%);
  background: -ms-linear-gradient(right, #f7f7f7 1%,#fdfdfd 50%,#f7f7f7 100%);
  background: linear-gradient(right, #f7f7f7 1%,#fdfdfd 50%,#f7f7f7 100%);
	background-image:url(../images/ie9bg.jpg) \9;
	box-shadow:0 15px  20px  -18px rgba(100,100,100,.5),0 -15px  20px  -18px rgba(100,100,100,.5);
}
h3 a{
	width:100%;
	height:100%;
	display:block;	
}

.leftCol li {
	text-align:center;
	list-style-type: none;
}

ul.checked{
	-moz-box-shadow:0 15px  20px  -17px rgba(0,0,0,0.1);
	-webkit-box-shadow:0 15px  20px  -17px rgba(0,0,0,0.1);
	box-shadow:0 15px  20px  -17px rgba(0,0,0,0.1);
}

ul.checked a {
	text-decoration: none;
	font-size: 0.8em;
	line-height: 1.8em;
	display: block;
	padding: 0 15px;
	transition: all 0.15s;
}
.leftCol li a{
	color: #333;
}
.leftCol li a:hover,.language a:hover {
	color: #F29600;
}

h3 + ul .active {
	color: #F29600;
	font-weight:bold;
}

.leftCol ul ul {
	display: none;
	padding:10px; 0;
}

.leftCol li.active ul{
	display:block;
}
/*index*/
.indexImg{
	width: 88%;
	width: calc(90% -200px);
	height: 100%;
	-moz-background-size:cover;
	-webkit-background-size:cover;
	-o-background-size:cover;
	background-size:cover;
	background-image: url(../images/index.jpg);
	background-repeat: no-repeat;
	background-position: left;
	margin-left: 230px;
}

.uiImg{
	width: 88%;
	width: calc(100% - 250px);
	height: 100%;
	position: absolute;
	right: 0px;
	background: url(../images/wait.jpg) no-repeat;
	-moz-background-size:cover;
	-webkit-background-size:cover;
	-o-background-size:cover;
	background-size:cover;
}


/*map*/
.infolist{
	position:absolute;
	left:256px;
	min-width:296px;
	width:350px;
	height:100%;
	z-index:9999;
	background:#f7f7f7;
}
.map{
	position:absolute;
	left:40%;
	min-width:300px;
	width:60%;
	height:100%;
	overflow:hidden;
}

.list{
	position:absolute;
	top:60px;
	left:60px;
	width:210px;
	font-size:small;
}

.list h5{
	font-size:1.8em;
	color:#333;
	height:40px;
	-moz-box-shadow:0 15px  15px  -17px rgba(0,0,0,0.5);
	-webkit-box-shadow:0 15px  15px  -17px rgba(0,0,0,0.5);
	box-shadow:0 15px  15px  -17px rgba(0,0,0,0.5);
	margin:0 0 10px -20px;
	padding:0 0 0 20px;
}

.list > li{
	margin:0 0 35px 0;
}

.list span{
	display:inline-block;
	margin:3px 5px 3px 0;
	vertical-align:middle;
}

.list a{
	color:#333;
	text-decoration:underline;
}

.listxt{
	width:180px;
	display:inline-block;
	vertical-align:top;
}

.tel{
	width:17px;
	height:14px;
	background-position:0 -79px;
}

.address{
	width:17px;
	height:14px;
	background-position:0 -93px;
}

.mail{
	width:17px;
	height:14px;
	background-position:0 -109px;
}

.mobile{
	width:17px;
	height:21px;
	background-position:0 -123px;
}

.map iframe{
	width:100%;
 	height:100%;
}

/*photo*/
.fotorama__nav,
.fotorama__nav__frame {
  margin: 0;
  padding: 3px;
}

.info{
	opacity:0;
	position:absolute;
	left:0;
	-webkit-transition:all linear 0.3s;
	-moz-transition:all linear 0.3s;
	transition:all linear 0.3s;
	z-index:5000;
}

#ccc.info{
	top:50px;
	left:310px;
}

.fotorama__active .info{
	opacity:1;
}

.info h4,.info h5{
	font-weight:normal;
}
.info h4{
	font-size:28px;
	padding:0 10px 0 8px;
}
.info h5{ width:100%; max-width: 100%; display:block; 
	-moz-box-shadow:;
	-webkit-box-shadow:;
box-shadow:0 3px 15px -8px rgba(0,0,0,0.5);
padding:0 10px 5px; margin:0 0 15px 0; 
}
.info .threed{
	background-position:-27px 0;
}
.info .link{	
	background-position:0 0;
}

.info a:hover .threed{	
	background-position:-27px -27px;
}

.info a:hover .link{	
	background-position:0 -27px;
}
.info div{
	width:27px;
	height:27px;
	display:block;
	display: inline-block;
  vertical-align: top;
	-moz-box-shadow:0 0  5px  0 rgba(0,0,0,0.3);
	-webkit-box-shadow:0 0  5px  0 rgba(0,0,0,0.3);
	box-shadow:0 0  5px 0 rgba(0,0,0,0.3);
	margin:0 0 0 10px;
}
/*ID的小圖*/
.fotorama__nav-wrap{
	position:absolute;
	top:170px;
	left:310px;
	width:60px;
	overflow:hidden;
  z-index: 9000;
}
/*UI WEB的小圖*/
.webrama .fotorama__nav-wrap{
  position:absolute;
  top:200px;
  left:310px;
  width:60px;
  overflow:hidden;
  z-index: 9000;

}
.fotorama__nav__shaft,.fotorama__nav{
	width:60px;
}
.fotorama__nav__frame.fotorama__active{
	pointer-events: none;
	cursor: default;
	-moz-box-shadow:0 0  5px  0 rgba(0,0,0,0.5);
	-webkit-box-shadow:0 0  5px  0 rgba(0,0,0,0.5);
	box-shadow:0 0  5px 0 rgba(0,0,0,0.5);
}
.fotorama__nav__frame--thumb:hover{
	-moz-box-shadow:0 0  5px  0 rgba(0,0,0,0.2);
	-webkit-box-shadow:0 0  5px  0 rgba(0,0,0,0.2);
	box-shadow:0 0  5px 0 rgba(0,0,0,0.2);
}

.fotorama__stage__shaft,
.fotorama__stage__frame,
.fotorama__html,
.fotorama__video iframe {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
}

.fotorama--fullscreen,
.fotorama__img {
  max-width: 99999px !important;
  max-height: 99999px !important;
  min-width: 0 !important;
  min-height: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}

.fotorama__wrap .fotorama__grab {
  cursor: move;
  cursor: -webkit-grab;
  cursor: -moz-grab;
  cursor: -o-grab;
  cursor: -ms-grab;
  cursor: grab;
}

.fotorama__grabbing * {
  cursor: move;
  cursor: -webkit-grabbing;
  cursor: -moz-grabbing;
  cursor: -o-grabbing;
  cursor: -ms-grabbing;
  cursor: grabbing;
}

.fotorama__img,
.fotorama__oooo {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
}

.fotorama__img {
  margin: -50% 0 0 -50%;
  width: 100%;
  height: 100%;
}

.fotorama__wrap--css3 .fotorama__stage__shaft,
.fotorama__wrap--css3 .fotorama__nav__shaft,
.fotorama__wrap--css3 .fotorama__arr,
.fotorama__wrap--css3
.fotorama__fullscreen-icon,
.fotorama__wrap--css3
.fotorama__video-play,
.fotorama__wrap--css3
.fotorama__video-close {
  -webkit-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}

.fotorama__oooo,
.fotorama__oooo:before,
.fotorama__oooo:after,
.fotorama__wrap--css3 .fotorama__stage,
.fotorama__wrap--css3 .fotorama__nav,
.fotorama__wrap--css3 .fotorama__stage__frame,
.fotorama__wrap--css3 .fotorama__stage__frame .fotorama__img,
.fotorama__wrap--css3 .fotorama__html,
.fotorama__wrap--css3 .fotorama__caption,
.fotorama__stage:before,
.fotorama__stage:after,
.fotorama__nav:before,
.fotorama__nav:after {
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
}

.fotorama__wrap--video .fotorama__stage__shaft,
.fotorama__wrap--video .fotorama__stage__frame--video {
  -webkit-transform: none !important;
  -ms-transform: none !important;
  transform: none !important;
}

.fotorama__wrap--css3 .fotorama__stage__shaft,
.fotorama__wrap--css3 .fotorama__nav__shaft {
  -webkit-transition-property: -webkit-transform;
  transition-property: transform;
  -webkit-transition-timing-function: cubic-bezier(0.1, 0, 0.25, 1);
  transition-timing-function: cubic-bezier(0.1, 0, 0.25, 1);
  -webkit-transition-duration: 0ms;
  transition-duration: 0ms;
}

.fotorama__wrap,
.fotorama__no-select,
.fotorama__arr,
.fotorama__fullscreen-icon,
.fotorama__video-play,
.fotorama__video-close {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.fotorama__wrap * {
  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
}

.fotorama--hidden,
.fotorama__load {
  position: absolute;
  left: -99999px;
  top: -99999px;
  z-index: -1;
}

.fotorama__stage__shaft,
.fotorama__stage__frame,
.fotorama__nav,
.fotorama__nav__shaft,
.fotorama__nav__frame,
.fotorama__arr,
.fotorama__fullscreen-icon,
.fotorama__video-play,
.fotorama__video-close {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.fotorama {
  min-width: 1px;
}

.fotorama > .fotorama__wrap {
  visibility: visible;
}

.fotorama--hidden-before-ready > * {
  visibility: hidden;
}

.fotorama__wrap {
  -webkit-text-size-adjust: 100%;
  position: relative;
  direction: ltr;
}

.fotorama__wrap--rtl .fotorama__stage__frame {
  direction: rtl;
}

.fotorama__stage,
.fotorama__nav {
  overflow: hidden;
  position: relative;
}

.fotorama__wrap--pan-y {
  -ms-touch-action: pan-y;
}

.fotorama__wrap .fotorama__pointer {
  cursor: pointer;
}

.fotorama__wrap--slide .fotorama__stage__frame {
  opacity: 1 !important;
}

.fotorama__stage__frame {
  overflow: hidden;
}

.fotorama__stage__frame.fotorama__active {
  z-index: 8;
}

.fotorama__wrap--fade .fotorama__stage__frame {
  display: none;
}

.fotorama__wrap--fade .fotorama__stage__frame.fotorama__active {
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  filter: alpha(opacity=100);
  opacity: 1;
}

.fotorama__wrap--fade .fotorama__stage__frame.fotorama__active,
.fotorama__wrap--fade .fotorama__fade-front,
.fotorama__wrap--fade .fotorama__fade-rear {
  display: block;
  left: 0;
  top: 0;
}

.fotorama__wrap--fade .fotorama__fade-front {
  z-index: 8;
}

.fotorama__wrap--fade .fotorama__fade-rear {
  z-index: 7;
}

.fotorama__wrap--fade .fotorama__fade-rear.fotorama__active {
  z-index: 9;
}

.fotorama__wrap--fade .fotorama__stage .fotorama__shadow {
  display: none;
}

.fotorama__wrap--video .fotorama__stage__frame--video .fotorama__img,
.fotorama__wrap--video .fotorama__stage__frame--video .fotorama__html {
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  filter: alpha(opacity=0);
  opacity: 0;
}

.fotorama__img {
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  filter: alpha(opacity=0);
  opacity: 0;
  border: none !important;
}

.fotorama__loaded .fotorama__img,
.fotorama__error .fotorama__img {
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  filter: alpha(opacity=100);
  opacity: 1;
}

.fotorama__img--full {
  display: none;
}

.fotorama--fullscreen .fotorama__loaded--full .fotorama__img {
  display: none;
}

.fotorama--fullscreen .fotorama__loaded--full .fotorama__img--full {
  display: block;
}

.fotorama__stage--only-active .fotorama__stage__frame {
  visibility: hidden;
}

.fotorama__stage--only-active .fotorama__stage__frame.fotorama__active {
  visibility: visible;
}

.fotorama__nav {
  font-size: 0;
  line-height: 0;
  text-align: center;
  display: none;
  white-space: nowrap;
  z-index: 5;
}

.fotorama__nav__shaft {
  position: relative;
  left: 0;
  top: 0;
  text-align: left;
}

.fotorama__nav__frame {
  position: relative;
  cursor: pointer;
}

.fotorama__nav__frame--thumb{
	margin:0 0 10px 0;
}

.fotorama__nav--dots .fotorama__nav__frame--thumb,
.fotorama__nav--dots .fotorama__thumb-border {
  display: none;
}
.fotorama__thumb-border{
	position:absolute;
}
.fotorama__nav--thumbs {
  display: block;
}

.fotorama__nav--thumbs .fotorama__nav__frame {
  padding-left: 0 !important;
}

.fotorama__nav--thumbs .fotorama__nav__frame:last-child {
  padding-right: 0 !important;
}

.fotorama__nav--thumbs .fotorama__nav__frame--dot {
  display: none;
}

.fotorama__thumb {
  overflow: hidden;
  position: relative;
  width: 100%;
  height: 100%;
}

.fotorama__wrap--rtl .fotorama__caption {
  left: auto;
  right: 0;
}

.fotorama__wrap--css3 .fotorama__stage .fotorama__img,
.fotorama__wrap--css3 .fotorama__html,
.fotorama__wrap--css3 .fotorama__caption {
  -webkit-transition-property: opacity;
  transition-property: opacity;
  -webkit-transition-timing-function: linear;
  transition-timing-function: linear;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
}

/* Strange fix of the #66 issue (Firefox bug while sliding backwards) */

@-moz-document url-prefix()  {
  .fotorama__active {
    box-shadow: 0 0 0 transparent;
  }
}

.fotorama__arr--disabled {
  pointer-events: none;
  cursor: default;
  *display: none;
  opacity: .1;
}

.fotorama__stage:before,
.fotorama__stage:after,
.fotorama__nav:before,
.fotorama__nav:after {
  content: "";
  display: block;
  position: absolute;
  text-decoration: none;
  top: 0;
  bottom: 0;
  width: 10px;
  height: auto;
  z-index: 10;
  pointer-events: none;
  background-repeat: no-repeat;
}

.fotorama__stage:before,
.fotorama__nav:before {
  background-image: -webkit-linear-gradient(transparent, rgba(0, 0, 0, 0.2) 25%, rgba(0, 0, 0, 0.3) 75%, transparent), -webkit-radial-gradient(0 50%, farthest-side, rgba(0, 0, 0, 0.4), transparent);
  background-image: linear-gradient(transparent, rgba(0, 0, 0, 0.2) 25%, rgba(0, 0, 0, 0.3) 75%, transparent), radial-gradient(farthest-side at 0 50%, rgba(0, 0, 0, 0.4), transparent);
  background-position: 0 0, 0 0;
  left: -10px;
}

.fotorama__stage.fotorama__shadows--left:before,
.fotorama__nav.fotorama__shadows--left:before {
  left: 0;
}

.fotorama__stage:after,
.fotorama__nav:after {
  background-image: -webkit-linear-gradient(transparent, rgba(0, 0, 0, 0.2) 25%, rgba(0, 0, 0, 0.3) 75%, transparent), -webkit-radial-gradient(100% 50%, farthest-side, rgba(0, 0, 0, 0.4), transparent);
  background-image: linear-gradient(transparent, rgba(0, 0, 0, 0.2) 25%, rgba(0, 0, 0, 0.3) 75%, transparent), radial-gradient(farthest-side at 100% 50%, rgba(0, 0, 0, 0.4), transparent);
  background-position: 100% 0, 100% 0;
  right: -10px;
}

.fotorama__stage.fotorama__shadows--right:after,
.fotorama__nav.fotorama__shadows--right:after {
  right: 0;
}

.fotorama--fullscreen .fotorama__stage:before,
.fotorama--fullscreen .fotorama__stage:after,
.fotorama--fullscreen .fotorama__nav:before,
.fotorama--fullscreen .fotorama__nav:after,
.fotorama__wrap--no-shadows .fotorama__stage:before,
.fotorama__wrap--no-shadows .fotorama__stage:after,
.fotorama__wrap--no-shadows .fotorama__nav:before,
.fotorama__wrap--no-shadows .fotorama__nav:after,
.fotorama__wrap--fade .fotorama__stage:before,
.fotorama__wrap--fade .fotorama__stage:after {
  display: none;
}
/*Web*/
.holder{
	position: absolute;
	top: 60px;
	left: 296px;
	width: 85%;
	min-width: 1000px;
}
.upper{
	padding: 0 0 3% 15%;
	-moz-box-shadow:0 15px  20px  -20px rgba(0,0,0,0.3),0 -15px  20px  -20px rgba(0,0,0,0.3);
/*  -webkit-box-shadow:0 15px  20px  -20px rgba(0,0,0,0.3),0 -15px  20px  -20px rgba(0,0,0,0.3);
  box-shadow:0 15px  20px  -20px rgba(0,0,0,0.3),0 -15px  20px  -20px rgba(0,0,0,0.3);*/
}
.upper img{
  width: 70%;
  min-width: 585px;
  height: auto;
  opacity: 0;
}

.fotorama__active .upper img{
  opacity: 100;
  -webkit-transition-property: opacity;
  transition-property: opacity;
  -webkit-transition-timing-function: linear;
  transition-timing-function: linear;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
}

.bottom{
	display: block;
	-moz-box-shadow:0 15px  20px  -20px rgba(0,0,0,0.3),0 -15px  20px  -20px rgba(0,0,0,0.3);
	/*  -webkit-box-shadow:0 15px  20px  -20px rgba(0,0,0,0.3),0 -15px  20px  -20px rgba(0,0,0,0.3);*/
  box-shadow:0 15px  20px  -20px rgba(0,0,0,0.3),0 -15px  20px  -20px rgba(0,0,0,0.3);






\  
  width: 100%;
	padding-left: 15%;
}
.bottom img{
  cursor: wait;
  opacity: 0;
}
.fotorama__active .bottom img{
  cursor: pointer;
  opacity: 100;
  -webkit-transition-property: opacity;
  transition-property: opacity;
  -webkit-transition-timing-function: linear;
  transition-timing-function: linear;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
}
.fxbox2 img{
  margin: 0 15px 0 0;
  width: 34%;
  min-width: 285px;
  height: auto;
}
.fxbox3 img{
  margin: 0 10px 0 0;
  width: 23%;
  min-width: 190px;
  height: auto;
}
.bottom img:last-child{
  margin: 0 -100px 0 0;
}
/*contact*/
.contactImg{ width: 65%; height: 100%; position: absolute; right: 0; background: url(../images/contactImg.jpg) no-repeat; -moz-background-size:cover; -webkit-background-size:cover; -o-background-size:cover; background-size:cover; 
}
/*
 * iPad
 */

@media screen and (orientation: portrait) and (max-device-width: 768px) {

}

@media screen and (orientation: landscape) and (max-width: 1024px){
   
}
@media screen and (orientation: landscape) and (max-device-width: 1024px){

}
/*
 * retina
 */
@media only screen and (-webkit-min-device-pixel-ratio:2),only screen and (min--moz-device-pixel-ratio: 2),only screen and (-o-min-device-pixel-ratio: 2/1),only screen and (min-device-pixel-ratio: 2),only screen and (min-resolution: 192dpi),only screen and (min-resolution: 2dppx){

}

/* ==========================================================================
   Helper classes
   ========================================================================== */

/*
 * Image replacement
 */

.ir {
    background-color: transparent;
    border: 0;
    overflow: hidden;
    /* IE 6/7 fallback */
    *text-indent: -9999px;
}

.ir:before {
    content: "";
    display: block;
    width: 0;
    height: 150%;
}

/*
 * Hide from both screenreaders and browsers: h5bp.com/u
 */

.hidden {
    display: none !important;
    visibility: hidden;
}

/*
 * Hide only visually, but have it available for screenreaders: h5bp.com/v
 */
.transparent {
    zoom: 1;
    filter: alpha(opacity=0);
    opacity: 0;
    -webkit-transition: opacity 0.3s linear;
    -moz-transition: opacity 0.3s linear;
    -o-transition: opacity 0.3s linear;
    -ms-transition: opacity 0.3s linear;
    transition: opacity 0.3s linear;
}

.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

/*
 * Extends the .visuallyhidden class to allow the element to be focusable
 * when navigated to via the keyboard: h5bp.com/p
 */

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}

/*
 * Hide visually and from screenreaders, but maintain layout
 */

.invisible {
    visibility: hidden;
}

/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    `contenteditable` attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */

.clearfix:before,
.clearfix:after {
  content: " "; /* 1 */
  display: table; /* 2 */
}

.clearfix:after {
  clear: both;
}

/*
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */

.clearfix {
  *zoom: 1;
}

/* ==========================================================================
   EXAMPLE Media Queries for Responsive Design.
   These examples override the primary ('mobile first') styles.
   Modify as content requires.
   ========================================================================== */

@media only screen and (min-width: 35em) {
    /* Style adjustments for viewports that meet the condition */
}

@media print,(-o-min-device-pixel-ratio: 5/4),(-webkit-min-device-pixel-ratio: 1.25),(min-resolution: 120dpi) {
    /* Style adjustments for high resolution devices */
}

/* ==========================================================================
   Print styles.
   Inlined to avoid required HTTP connection: h5bp.com/r
   ========================================================================== */

@media print {
    * {
        background: transparent !important;
        color: #000 !important; /* Black prints faster: h5bp.com/s */
        box-shadow: none !important;
        text-shadow: none !important;
    }

    a,
    a:visited {
        text-decoration: underline;
    }

    a[href]:after {
        content: " (" attr(href) ")";
    }

    abbr[title]:after {
        content: " (" attr(title) ")";
    }

    /*
     * Don't show links for images, or javascript/internal links
     */

    .ir a:after,
    a[href^="javascript:"]:after,
    a[href^="#"]:after {
        content: "";
    }

    pre,
    blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }

    thead {
        display: table-header-group; /* h5bp.com/t */
    }

    tr,
    img {
        page-break-inside: avoid;
    }

    img {
        max-width: 100% !important;
    }

    @page {
        margin: 0.5cm;
    }

    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3;
    }

    h2,
    h3 {
        page-break-after: avoid;
    }
}

a.BTN { width:109px; height:46px;	position:absolute;left:70px;bottom:25%;; text-indent:-9999px; background-image:url(../images/fb.png); background-position: 0px 0px; display: block; z-index: 99; }
a:hover.BTN{background-position:0 -42px;}

/*service*/
.serviceImg{
	width: 20%;
	height: 100%;
	position: absolute;
	right: 0;
	-moz-background-size:cover;
	-webkit-background-size:cover;
	-o-background-size:cover;
	background-size:cover;
	background-image: url(../images/serviceImg.jpg);
	background-repeat: no-repeat;
	background-position: right;
}
.list2{
	position:absolute;
	top:60px;
	left:60px;
	width:400px;
	font-size:small;
	font-family: Verdana, Geneva, sans-serif;
}
.list3{
	position:absolute;
	top:300px;
	left:60px;
	width:450px;
	font-size:small;
	font-family: Verdana, Geneva, sans-serif;
}
.t1{
	font-size:14px;
	margin:10px 10px 0px 10px;
	width:120px;
	float: left;
	font-family: Verdana, Geneva, sans-serif;
}
.testImg{ width: calc(100% - 300px); height: 100%; right: 0; -moz-background-size:cover; -webkit-background-size:cover; -o-background-size:cover; background-size:cover; background-image: url(../images/index.jpg); background-repeat: no-repeat; background-position: left; float: right; 
}
.t2{
	font-size:2em;
	color:#333;
}
.s_img{
	width:33px;
	height:33px;
	float:left;
	margin-right: 10px;
}