@font-face {
    font-family: 'ITCErasStdBd';
    src: url('./font/ITCErasStd-Bold.eot');
    src: url('./font/ITCErasStd-Bold.eot?#iefix') format('embedded-opentype'),
      
         url('./font/ITCErasStd-Bold.woff') format('woff'),
         url('./font/ITCErasStd-Bold.ttf') format('truetype'),
         url('./font/ITCErasStd-Bold.svg#ITCErasStdBd') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'ITCErasStdLight';
    src: url('./font/ITCErasStd-Light.eot');
    src: url('./font/ITCErasStd-Light.eot?#iefix') format('embedded-opentype'),
      
         url('./font/ITCErasStd-Light.woff') format('woff'),
         url('./font/ITCErasStd-Light.ttf') format('truetype'),
         url('./font/ITCErasStd-Light.svg#ITCErasStdLight') format('svg');
    font-weight: normal;
    font-style: normal;
}


@font-face {
    font-family: 'AngsanaNew';
    src: url('./font/AngsanaNew.eot');
    src: url('./font/AngsanaNew.eot?#iefix') format('embedded-opentype'),
      
         url('./font/AngsanaNew.woff') format('woff'),
         url('./font/AngsanaNew.ttf') format('truetype'),
         url('./font/AngsanaNew.svg#AngsanaNew') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'AvantGarde';
    src: url('./font/AvantGarde-Demi.eot');
    src: url('./font/AvantGarde-Demi.eot?#iefix') format('embedded-opentype'),
      
         url('./font/AvantGarde-Demi.woff') format('woff'),
         url('./font/AvantGarde-Demi.ttf') format('truetype'),
         url('./font/AvantGarde-Demi.svg#AvantGarde') format('svg');
    font-weight: normal;
    font-style: normal;
}
 
@font-face {
    font-family: 'DBHelvethaicaX';
    src: url('./font/DBHelvethaicaX-55Regular.eot');
    src: url('./font/DBHelvethaicaX-55Regular.eot?#iefix') format('embedded-opentype'),
      
         url('./font/DBHelvethaicaX-55Regular.woff') format('woff'),
         url('./font/DBHelvethaicaX-55Regular.ttf') format('truetype'),
         url('./font/DBHelvethaicaX-55Regular.svg#DBHelvethaicaX') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'DBHelvethaicaXCond';
    src: url('./font/DBHelvethaicaX-Cond.eot');
    src: url('./font/DBHelvethaicaX-Cond.eot?#iefix') format('embedded-opentype'),
      
         url('./font/DBHelvethaicaX-Cond.woff') format('woff'),
         url('./font/DBHelvethaicaX-Cond.ttf') format('truetype'),
         url('./font/DBHelvethaicaX-Cond.svg#DBHelvethaicaXCond') format('svg');
    font-weight: normal;
    font-style: normal;
}



div#loadPage,div#loadPage_content{position:fixed;margin:auto;left:0;top:0;width:100%;height:100%;color:#000;background-color:#FFF;z-index:500000000;text-align:center;opacity:.7;padding-top:200px;vertical-align:middle;filter:alpha(opacity=70);display:none}

/* ====== preload ========== */

img{
	max-width: 100%;
}

html{
  width:100%; height: 100%;
}

body{
  margin: 0;
  padding: 0;
  width:100%; height: 100%;
 font-family: 'DBHelvethaicaX'; font-size: 22px; line-height: 120%;
	 background-color: #073c5c;
 color: #010101;
}
 

a{
	text-decoration: none;
	 color: #242428;
}

a:hover{
	 color: #666666;
}

h1{
	margin:0; padding:0;
	font-size:36px;	 line-height: 120%;
	font-weight:normal;   font-family: 'AvantGarde';
	letter-spacing: 2px;  
}

 h2{
	margin:0; padding:0;
	font-size:30px;	 line-height: 120%;
	font-weight:normal;   font-family: 'AvantGarde';
	letter-spacing: 2px;  
}
 

a ,a:hover ,a:link{
  text-decoration: none;
}
 


.bull{
	font-family: "sans-serif";
	width: 20px;
}


table{
        font-family: 'DBHelvethaicaX'; font-size: 22px; line-height: 120%;
}

.table td{
	padding: 2px 0; border: 0 !important;
}

.table tr{
	border: 0 !important;
}




 
ul, li {
    
    
}

 
.bg_header ul,.bg_header li {
	margin:0; 
    padding:0; 
    list-style:none;
}

.left{
	float: left;
}

.right{
	float: right;
}


.clear{
	clear:both;	
}

.bold{
	 font-family: 'MontserratBd'; 
}

.top5{
	padding-top:5px;	
}	

.top10{
	padding-top:10px;	
}	

.top20{
	margin-top: 20px;
}

.top30{
	margin-top: 30px;
}
	
	
.top40{
	margin-top: 40px;
}

	
.top60{
	margin-top: 60px;
}

 

.style1{
	color: #fff !important;
}

.style2{
	color: #CE2129 !important;
}
 
 	.webshow{
		
	}

	.mobileshow{
		display: none;
	}

.popup{
	width: 100%; height: 100%; 	z-index: 999999;
	top: 0; bottom: 0;
	position: fixed; background: url("../../img/tp/shadow.png"); 
	padding: 20px 0 100px 0;  overflow: scroll;
	text-align: center;   display: none;
}


.popup_form{
	width: 100%; height: 100%; 	z-index: 999999;
	top: 0; bottom: 0;
	position: fixed; background: #CE2129; 
	background-size: 100%;
	padding: 20px 40px 100px ;  overflow: scroll;
	text-align: center;   display: none;  
}

.popupclose{
	background: url("../../img/tp/close.png") top center no-repeat;
	width: 36px; height: 36px; opacity: 1;
	
	text-align: right;
}
 

#load_popup img{
/*	width: 100%;*/
}

area:focus {
outline:0;
}

.popup_area{
	 width:90%;  margin-left: auto; margin-right: auto;
	 
	min-height: 400px;
	 position: relative;
	margin-top: 10px;
	  text-align: left;
	padding: 30px 0; color: #fff;
    
}

.pop_padding{
	margin-top: 30px;
    background: #fff; padding: 40px;
}

.pop_img{
	height: 400px;
}

.popup_close{
	text-align: right; position:relative; right:0;
	margin: 0 0px 0 0; z-index:5;
}

.pop_thank{
	padding: 100px 0; text-align: center;
}

.web{
	width: 100%; max-width: 1400px;
	margin-left: auto; margin-right: auto;
	position: relative;
}

.area_content{
	width:80%;  margin-left: auto; margin-right: auto;
	 position: relative;   max-width: 1280px;
	border: 0px #000 solid; text-align: left;
}

.area_profile{
	width:75%;  margin-left: auto; margin-right: auto;
	 position: relative;   max-width: 1280px;
	border: 0px #000 solid; text-align: left;
}


 
.padding_page{
	padding: 60px 0;
}
 

.page{
	position: relative;
	height: 95%; width: 100%;
}

.logo{
	position: absolute; width: 10%;
	margin-top: 20px;
}

.linkweb{
	float: left; margin-top: 20px;
}


 
.banner_bg{
	background: url("../../img/home/banner/mycooper.jpg") center center;
	height: 100%;

  /* Center and scale the image nicely */
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
	font-family: 'DBHelvethaicaX'; font-size: 24px; line-height: 120%;
}

 

 

.area_banner{
	width:70%;  margin-left: auto; margin-right: auto;
	 position: relative;   max-width: 1280px; height: 100%;
	border: 0px #000 solid; text-align: left;
}
 
.area_banner_mobile{
	display: none;
}
 
.banner_text_area{
	background: url("../../img/home/banner/shadow.png"); width: 25%; height: 100%; position: absolute; right: 0;
	text-align: center; color: #fff; padding: 20px 0;
}

.banner_text_area a{
	color: #fff; 
}

.banner_text_area h3{
	font-size: 30px; line-height: 100%;
}

.banner_text_area img{
	max-width: 70%;
}

.social{
	 margin-top:30px;
}

.social img{
	 width: 45px;
}

.memory{
	background-image: url("../../img/home/edit/memory-bg1.png") , url("../../img/home/edit/memory-bg2.png");
	background-position: left center, right center;
	background-size: 21% , 36%;
	background-repeat: no-repeat, no-repeat;
	background-color: #fff;   padding: 80px 0;
}

.memory h1{
	  font-family: 'ITCErasStdBd';   
}
 
.ceo{
	background-color: #ebc149; color: #000;
	padding:70px 0 100px;
}

.ceo h2{
	font-family: 'ITCErasStdBd';  letter-spacing: 0px;
	font-size:24px;	 line-height: 120%; color: #333333;
}

.ceo-box{
	float: left; width: 33%; text-align: center;
	margin-top: 50px;
}

.ceo-text{
	margin-top: 30px;
}

.ceo-area{
	padding: 30px 30px 0; 
}

.ceo-border{
	border-left: 2px #8c732c solid; border-right: 2px #8c732c solid; 
	padding-bottom: 200px;
}

.ceo-line{
	border-bottom: 2px #8c732c solid; margin-top: 40px;
}


.box_partner{
	 font-family: 'AngsanaNew'; font-weight: bold;
	margin-top: 40px; display: inline-block; vertical-align: top; width: 45%;
	margin-left: 1%; margin-right: 1%;
}

.box_partner img{
	 border-radius: 75px;
}


.review{
	background: #0cc3d8;color: #fff;
	padding:70px 0 ;
}

.box_review{
	margin: 50px 0.7% 0 ;
	display: inline-block; vertical-align: top; width: 18%;
	color: #010101; text-align: left;  
}

.title_at{
	margin-top: 10px; font-size: 24px;
}


.area_load {
	text-align: center;
	border-top:1px #fff solid;
	margin-top: 80px; padding: 50px 0 30px;
}

.loadmore{
	display: inline-block; vertical-align: top;
	background: url("../../img/home/icon-load.png") center right no-repeat;
	background-size: 30px;
	padding-right: 40px;
	font-size:26px;	 line-height: 120%;
	font-weight:normal;   font-family: 'AvantGarde'; color: #fff;
}

.footer{
	font-family: 'AngsanaNew'; color: #cccccc; letter-spacing: 2px;
	padding: 20px; text-align: center;
}

.profile{
	padding:70px 0 100px; color: #333333;	
	background: linear-gradient(
    to right,
    #d4d9c8 0%,
    #d4d9c8 50%,
    #cab9ae 50%,
    #cab9ae 100%
  );	
}


.profile2{
	padding:70px 0 100px; color: #333333;	
	background: linear-gradient(
    to right,
    #f0d8c0 0%,
    #f0d8c0 50%,
    #d9cbc8 50%,
    #d9cbc8 100%
  ) !important;	
}



.profile h1 ,.profile2 h1{
	font-family: 'ITCErasStdBd';
	font-size: 34px; letter-spacing: 0;
}

.profile h2 ,.profile2 h2{
	font-family: 'ITCErasStdLight';
	font-size: 30px; letter-spacing: 0;
}

.profile_box{
	display: inline-block; vertical-align: top;
	width: 49.5%; padding: 0 60px;
	border: 0px #fff solid;
}

.profile_line{
	background-image: url("../../img/home/line.png") , url("../../img/home/line.png") ;
	background-position: top left , top right;
	background-repeat: repeat-y, repeat-y;
}

.profile_title2{
		padding-top: 20px !important;
	}	
	

.profile_boxL{
	display: inline-block; vertical-align: top;
	width: 30%;
}

.profile_boxR{
	display: inline-block; vertical-align: top;
	font-size: 30px; line-height: 100%;
	font-family: 'AvantGarde'; padding: 30px 0 0 20px;
}


@media screen and (max-width: 1400px) {
 


	
}

@media screen and (max-width: 1250px) {
.banner_bg{
	background: url("../../img/home/banner/mycooper-ipad.jpg") center center;
	height: 100%;

  /* Center and scale the image nicely */
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
	font-family: 'DBHelvethaicaX'; font-size: 24px; line-height: 120%;
}
 
.area_banner{
	width:94%;  
}
 
	 
}


@media screen and (max-width: 70em) {
	body{
	 
}
	
	
	
	.banner_bg{
background: #073c5c; padding: 10px 0 40px; height: auto !important;
}	
	
.webshow{
		display: none;
	}

	.mobileshow{
		display: block;
	}
	
	
.page{
	position: relative;
	height: auto; width: 100%;
}

.logo{
	position: relative; width: 100%;
	margin-top: 20px; text-align: center;
}
	
	 

.linkweb{
	margin-top: 0;
	margin-left: 10px;
}

 

	
.text{
	position: relative;  
	margin-top: 40px; margin-left:15%;
	width: 70%; text-align: center;
	 
}

.btn_shop{
	margin-top: 70px;
}


 
.area_banner{
	display: none;
}	
	
	.area_banner_mobile{
		display: block; width: 100%;
	}	
	
	
.banner_text_area{
	 width: 90%; height: auto; position: relative; 
	margin: 30px auto 0;
	text-align: center; color: #fff; padding: 40px 0;  
	
}

.area_profile{
		width: 100%;
	}
 	
	
.profile ,.profile2{
	 padding:40px 0;  
}	
	
 	
	
.profile_box{
	display: inline-block; vertical-align: top;
	width: 49.5%; padding: 0 30px;
	border: 0px #fff solid;
}	
 
.area_content{
	width:94%;  
}
	
.ceo-area{
	padding: 30px 10px;
}	
	
.ceo-area br{
	display: none;
}
 
}

@media screen and (max-width: 50em) {
 
	
 
	 
	
	
 
	
.social img{
 
}

	


 
	

 
.ceo{
	 padding:70px 0  ;
}

 

.ceo-box{
	float: left; width: 100%; text-align: center;
	margin-top: 50px; border-bottom: 2px #8c732c solid;
	padding-bottom: 50px !important;
}

 
.ceo-area{
	padding: 0px 0px 0; 
}

.ceo-border{
	border-left: 0px #8c732c solid; border-right: 0px #8c732c solid; 
	padding-bottom: 0px;
}

.ceo-line{
	border-bottom: 2px #8c732c solid; margin-top: 40px;  margin-bottom: 40px;
}	
	
.box_partner{
	margin: 20px 1% 0;
	 width: 45%;
}
	
	 
	
.box_review{
	margin: 50px 5% 0 ;
	width: 90%;
}
	
	.box_review br{
		display: none;
	}
	
.profile ,.profile2{
	 padding:0; color: #333333;
	background: none;
}	
	
 	
	.profile_bg1{
		background-color: #d4d9c8; 
	}	
	
	.profile_bg2{
		background-color: #cab9ae;
	}
	
	.profile_bg3{
		background-color: #f0d8c0; 
	}	
	
	.profile_bg4{
		background-color: #d9cbc8;
	}
	
	 
	
.profile_box{
	position: relative;
	width: 100%; left: 0; right: 0;
	 
	padding: 40px 8%;
	 
}

	.profile_title2{
		padding-top: 20px !important;
	}	
	
.profile_line{
	background: none;
}	

.profile_boxL{
	display: inline-block; vertical-align: top;
	width: 30%;
}

.profile_boxR{
	display: inline-block; vertical-align: top;
	font-size: 28px; line-height: 100%;
	font-family: 'AvantGarde'; padding: 10px 0 0 20px;
}	
	

.memory{
	background-image: url("../../img/home/edit/memory-bg1.png") , url("../../img/home/edit/memory-bg2.png");
	background-position: left bottom,right 65%;
	background-size: 21% , 36%;
	background-repeat: no-repeat, no-repeat;
	background-color: #fff;   padding: 80px 0;
}
	
	.memory-text{
		margin-top: 40px;
	}	

.memory br{
	display: none;
}	
	
	
}

@media screen and (max-width: 40em) {
	table br{
		display: none;
	}
    
	
	.profile_boxL{
	 width: 100%; text-align: center;
}

.profile_boxR{
	width: 100%; text-align: center;
	padding: 10px 0 0 0;
}	
	
	
	
	
}