/* Font */
@font-face {
font-family: 'FontAwesome';
src: url('../fonts/fontawesome-webfont.eot'); /* IE9 Compat Modes */
src: url('../fonts/fontawesome-webfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
     url('../fonts/fontawesome-webfont.woff') format('woff'), /* Modern Browsers */
     url('../fonts/fontawesome-webfont.ttf')  format('truetype'), /* Safari, Android, iOS */
     url('../fonts/fontawesome-webfont.svg#svgFontName') format('svg') /* Legacy iOS */
}
@font-face {
    font-family: 'tupperprobold';
    src: url('../fonts/tupperpro-bold-webfont.eot');
    src: url('../fonts/tupperpro-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/tupperpro-bold-webfont.woff2') format('woff2'),
         url('../fonts/tupperpro-bold-webfont.woff') format('woff'),
         url('../fonts/tupperpro-bold-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'tupperprolight';
    src: url('../fonts/tupperpro-light-webfont.eot');
    src: url('../fonts/tupperpro-light-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/tupperpro-light-webfont.woff2') format('woff2'),
         url('../fonts/tupperpro-light-webfont.woff') format('woff'),
         url('../fonts/tupperpro-light-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'tupperpromedium';
    src: url('../fonts/tupperpro-medium-webfont.eot');
    src: url('../fonts/tupperpro-medium-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/tupperpro-medium-webfont.woff2') format('woff2'),
         url('../fonts/tupperpro-medium-webfont.woff') format('woff'),
         url('../fonts/tupperpro-medium-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'tupperpronormal';
    src: url('../fonts/tupperpro-normal-webfont.eot');
    src: url('../fonts/tupperpro-normal-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/tupperpro-normal-webfont.woff2') format('woff2'),
         url('../fonts/tupperpro-normal-webfont.woff') format('woff'),
         url('../fonts/tupperpro-normal-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'tupperproultralight';
    src: url('../fonts/tupperpro-ultralight-webfont.eot');
    src: url('../fonts/tupperpro-ultralight-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/tupperpro-ultralight-webfont.woff2') format('woff2'),
         url('../fonts/tupperpro-ultralight-webfont.woff') format('woff'),
         url('../fonts/tupperpro-ultralight-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}


/* ------------------------------------
   CSS Prefix
   -----------------------
   <div> - layer
   <table> - table
   <tr> - row
   <td> -column
   <h1>~<h6> - header
   <span> - style
   <a> - link
   <ul>/<ol> - listing
   <li> - list
   <img> - img
   <p> - panel
---------------------------------------*/

@media all{
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, input, textarea,
table, caption, tbody, tfoot, thead, tr, th, td {
	border:0;
	outline:0;
	font-family: 'tupperprolight', Arial, sans-serif;
	font-size: 15px;
	text-wrap:normal;
	color:#555555;
}
a {
	color: #a927fc;
	text-decoration:none;
	-webkit-transition: color .25s ease-out;
	-moz-transition: color .25s ease-out;
	-ms-transition: color .25s ease-out;
	transition: color .25s ease-out;
	-webkit-user-modify: read-only;
	-moz-user-modify: read-only;
}
a:hover{
	color: #3794d3;
	text-decoration:none!important;
    -webkit-transition: all 1.0s;
    -o-transition: all 1.0s;
    transition: all 1.0s;
}

b{ font-family: 'tupperpromedium';}

hr{height:1px; background:#ccc;margin:5px 0;padding:0;}

a.toggle{
  -webkit-transition: height 0.3s;
  -moz-transition: height 0.3s;
  -ms-transition: height 0.3s;
  -o-transition: height 0.3s;
  transition: height 0.3s;
}

.layer-container h1{
    font-family: 'tupperpromedium', sans-serif;
    font-size: 28px;
    color: #555555;
	letter-spacing:1px;
	margin:0 0 20px;
}
.layer-container h2{
	font-family: 'tupperpronormal', sans-serif;
    font-size: 22px;
    color: #555555;
	letter-spacing:1px;
	margin:0 0 20px;
}
.layer-container .text-large, .layer-container .text-large a{
	font-size:45px;
	color:#555555;
	display:block;
}
.layer-container .text-large a:hover{
	color: #a927fc;
	text-decoration:none!important;
    -webkit-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s;
}
.layer-container .text-large span{
	font-size: 45px;
    color: white;
    background: #a927fc;
    width: 70px;
    height: 70px;
    display: inline-block;
    border-radius: 50%;
    vertical-align: middle;
    padding: 20px 0 0;
}
.layer-container .text-large span:hover{
	background:black;
	-webkit-transition: all 1.0s;
    -o-transition: all 1.0s;
    transition: all 1.0s;
}
.icon-down{
	font-size: 45px;
    color: #a927fc;
    background: white;
    width: 70px;
    height: 70px;
    display: inline-block;
    border-radius: 50%;
    vertical-align: middle;
    padding: 10px 0 0;
	-webkit-box-shadow: 0px 0px 5px 1px #999;
    -moz-box-shadow: 0px 0px 5px 1px #999;
    -ms-box-shadow: 0px 0px 5px 1px #999;
    -o-box-shadow: 0px 0px 5px 1px #999;
    box-shadow: 0px 0px 5px 1px #999;
	z-index:110;
	position: absolute;
    bottom: 5px;
    right: 0;
    left: 0;
    text-align: center;
    margin: 0 auto;
}

/* Text Style*/
.red {color:#ee4848;}
.dark-red {color:#c1292e;}
.orange {color:#f5ac1c;}
.grey {color:#666666;}
.green {color:#1e9b97;}
.blue {color:#0069b3;}
.black {color:#000000!important;}
.blackbold {color:#000000; font-weight:bold;}
.white {color:#ffffff!important;}
.gold {color:#b8a252;}
.bgRed {background:#FF0000;}
.bgOrange {background:#FF6600;}
.bgGrey {background:#666666;}
.bgGreen {background:#73AD00;}
.bgBlue {background:#2d95d1;}
.bgBlack {background:#000000;}
.bgWhite {background:#ffffff;}
.style-greentext {display:block;color:#005f27;margin:0 0 20px;}
.grey-remark{font-size:13px;color:#999999;}

/* reusable classes */
.floatLeft {float:left;width:auto;}
.floatRight {float:right;width:auto;}
.right {text-align:right;}
.left {text-align:left}
.center {text-align:center;margin: 0 auto;}
.justify {text-align:justify}
.blank {border:1px solid #bbb;padding:0;margin:0;}
.subtitle {color:#000000;padding:15px 15px 0 15px;}
.caption {font-family:arial,verdana;font-size:10px;font-style:normal;font-weight:bold;color:#999999;}
.alert {color:#CC0000;font-size:15px;}
.spacer {line-height:1px;}
small {color:#999;font-size:80%;}
.line {border-top: 1px solid #999999;height: 1px;margin-top:6px;margin-bottom:6px;padding:0px;clear:both;}
.dotted {border-top: 1px dotted #999999;height: 1px;margin-top:3px;margin-bottom:3px;padding:0px;}
.imgFloatLeft {float:left;padding:0 20px 20px 0;display:block;}
.imgFloatRight {float:right;padding:0 0 20px 20px;display:block;width:auto;}
.img-responsive {max-width:100%;}
select{
	font-size:14px;
	padding:5px 10px;
	background:white;
}
.bg-orange{background: #ff5000!important;}
.btn-viewmore a{font-size:16px;font-weight:300;color:white;text-transform:uppercase;border:1px solid white;padding:15px 25px;margin:30px 0 0;    display: inline-block;}
.btn-viewmore a:hover{color:#2a334a;background:white;border-color:#2a334a;}
.btn-send{background:#27b1fc;color:white;padding:14px 50px;border-radius:45px;border:none; letter-spacing:1px;}

/*general*/
.clear{clear:both;}

.clearfloat:after {
    clear: both;
    content: ".";
    display: block;
    height: 0;
    visibility: hidden;
}
* html .clearfloat {
    height: 1%;
}

.clearfix:after {
    clear: both;
    content: ".";
    display: block;
    height: 0;
    visibility: hidden;
}
* html .clearfix {
    height: 1%;
}
.clearfix {
    display: block;
}

.hide {
	display: none;
}

.divider-medium-h{height:50px;}

.center{
		text-align: center;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }


input, textarea {
  -webkit-font-smoothing: antialiased;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  outline: none;
}

[placeholder]:focus::-webkit-input-placeholder {
  color: transparent;
}
[placeholder]:focus::-webkit-input-placeholder {
  transition: opacity 0.5s 0.5s ease;
  opacity: 0;
}

.input-placeholder{
	color:#aaaaaa;
}

table { border-collapse: collapse; border-spacing: 0; }

.bg-white{background:white;}
.bg-grey{background:#eaeaea;}
.bg-green{background:#93a8a3;}


ol li{
	margin-bottom:15px;
}

ul.list-tick{
   padding-left: 20px;
   text-indent: 2px;
   list-style: none;
   list-style-position: outside;
   margin-bottom:10px;
}
ul.list-tick li:before{
    content: '✔';
    margin-right: 10px;
}
.btn-more a{
	font-size:18px;
	color:#1e9b97;
	border:1px solid #1e9b97;
	padding:10px 15px;
	margin:5px auto;
	display:inline-block;
}
.btn-more a:hover{
	background:#1e9b97;
	color:white;
	border:1px solid #1e9b97;
	text-decoration:none;
}
ul.list-social{
	list-style-type:none;
	margin:30px auto 0;
	padding:0;
	clear:both;
	display:inline-block;
}
	ul.list-social li{
		float:left;
		margin:0 10px;
	}
	ul.list-social li i{
	    font-size: 24px;
    	color: #93a8a3;
	}
	ul.list-social li a:hover i{
		opacity:0.6;
	}

/*Controls Section*/
.wrapper{
	width:100%;
	margin:0 auto;
	padding:0;
}
.layer-container{
	max-width:1300px;
	margin:0 auto!important;
	padding:0;
}

/* Home Section */

section {
	line-height:24px;
}

/* Home Slider */
.slider-bg{
background: #27b1fc; /* Old browsers */
background: -moz-linear-gradient(45deg, #27b1fc 0%, #a927fc 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(45deg, #27b1fc 0%,#a927fc 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(45deg, #27b1fc 0%,#a927fc 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#27b1fc', endColorstr='#a927fc',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}

/* Home Section */
.section-latex{
	max-width:100%;
	margin:0 auto;
	text-align:center;
	padding:60px 5%;
}
.section-about{
	max-width:100%;
	margin:0 auto;
	background:#eeeeee;
	padding:80px 5%;
}
.section-pro{
	max-width:100%;
	margin:0 auto;
	background:white;
	padding:80px 5%;
	text-align:center;
}

.section-pro ul{
	list-style-type:none;
	margin:0!important;
	padding:0!important;
}
	.section-pro ul li{
	    text-align: center;
		margin: 10px 0;
	}
	/* .section-pro ul li{
		text-align:center;
		background:white;
		box-shadow: 0px 2px 8px 0px #ccc;
		padding:40px 15px;
	} */

	.section-pro ul li .item{
		background: #bbbbbb;
		padding: 40px 15px;
		border-radius: 50%!important;
		width: 190px;
		height: 190px;
		display:inline-block;
	}

	.section-pro ul li i{
	    font-size: 70px;
    	color: white;
		margin-bottom:15px;
	}
	/*.section-pro ul li i{
		font-size:70px;
		background: #27b1fc;
		background: -moz-linear-gradient(45deg, #27b1fc 0%, #a927fc 100%);
		background: -webkit-linear-gradient(45deg, #27b1fc 0%,#a927fc 100%);
		background: linear-gradient(45deg, #27b1fc 0%,#a927fc 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#27b1fc', endColorstr='#a927fc',GradientType=1 );
		-webkit-background-clip: text;
  		-webkit-text-fill-color: transparent;
		margin-bottom:15px;
	} */
	.section-pro ul li label{
		font-size:20px;
		display:block;
		width:100%;
		color:white;
	}
.section-form{
	font-size: 20px;
    font-weight: 300;
    display: block;
    width: 100%;
    background: #333333;
    color: white;
}
	.layer-form{
		background:white;
		border-radius:10px;
		padding:35px;
		margin-top:20px;
	}
	.layer-form input, .layer-form textarea{
		background:#f2f2f2;
		padding:15px 20px;
		border-radius:45px;
		margin-bottom:15px;
		width:100%;
	}
	.layer-getintouch{
		color:white;
		border-radius:10px;
		padding:35px;
		background: #27b1fc; /* Old browsers */
		background: -moz-linear-gradient(45deg, #27b1fc 0%, #a927fc 100%); /* FF3.6-15 */
		background: -webkit-linear-gradient(45deg, #27b1fc 0%,#a927fc 100%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(45deg, #27b1fc 0%,#a927fc 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#27b1fc', endColorstr='#a927fc',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
		margin-top:20px;
	}
	.layer-getintouch h1{
		color:white;
	}
	.layer-getintouch ul{
		list-style-type:none;
		margin:0;
		padding:0;
	}
	.layer-getintouch ul.list-getintouch li{
		color:white;
		clear:both;
		margin-bottom:40px;
	}
	.layer-getintouch ul.list-getintouch li i{
		font-size:20px;
		width:20px;
		float:left;
		margin-right:5px;
	}
	.layer-getintouch ul.list-getintouch li label{
		color:white;
		float:left;
		width: 90%;
		margin-bottom:40px
	}
	.layer-getintouch ul.list-getintouch li label a{
		color:white;
	}
	.layer-getintouch ul.list-getintouch li ul.list-social li{
		float: none!important;
		display: inline-block;
		text-align: center;
	}
	.layer-getintouch ul.list-getintouch li ul.list-social li i{
		text-align:center!important;
		float: none!important;
		margin:0;
	}

 ul.list-social{
	list-style-type:none;
}
	 ul.list-social li{
		float:left;
		margin-right:15px;
	}
	 ul.list-social li a{
		width:45px;
		height:45px;
		background:#27b1fc;
		font-size:20px;
		display:inline-block;
		border-radius:50%;
		text-align:center;
		padding:10px 0 0;
	}
	ul.list-social li a i{
		color:white;
	}
/*** Google Map ***/

/*** Inside Page ***/
.layer-banner{
	width: 100%;
    height: 700px;
    position: relative;
    text-align: center;
}
	.banner-article01{
		background: url(../img/banner-article01.jpg) no-repeat;
		background-size:cover;
	}
	.banner-article02{
		background: url(../img/banner-article02.jpg) no-repeat;
		background-size:cover;
	}
	.banner-contactus{
		background: url(../img/banner-contactus.jpg) no-repeat;
		background-size:cover;
	}
	.banner-aboutus{
		background: url(../img/banner-aboutus.jpg) no-repeat;
		background-size:cover;
	}
	.banner-products{
		background: url(../img/banner-products.jpg) no-repeat;
		background-size:cover;
	}
	.banner-article01 .banner-deco, .banner-article02 .banner-deco{
		position: absolute;
		bottom: 0;
		right: 12%;
		z-index: 3;
		zoom: 70%;
	}
	.layer-overlay{
		width:100%;
		height: 100%;
		background:rgba(0,0,0,0.50);
		z-index:2;
	}
	.layer-slogan{
		position: absolute;
    	top: 50%;
    	left: 50%;
    	margin-right: -50%;
    	transform: translate(-50%, -50%) ;
		z-index: 4;
	}
	.layer-slogan p{
		font-family: 'tupperproultralight', Arial, sans-serif;
		font-size:18px;
		padding:0 10%;
		color:white;
		line-height:30px;
		margin-top:20px;
	}

	.table-style1{
		border:1px solid white;
		margin-bottom:15px;
	}
	.table-style1 tr td{
    padding: 8px 5px;
    border: 1px solid #dddddd;
    font-size: 13px;
    color:#444;
	}


/****Footer****/
footer{
	width: 100%;
    background: #333333;
    padding: 50px 0 100px;
    color: white;
    font-size: 14px;
    margin-top: -160px;
    display: inline-block;
}
	ul.list-fnav{
		list-style-type:none;
		text-align: center;
    	display: inline-block;
		margin:0;
		padding: 0;
	}
	ul.list-fnav li{
		float:left;
		margin-left:15px;
		margin-bottom: 15px;
	}
	ul.list-fnav li a{
		color:white;
		font-size:14px;
	}
	ul.list-fnav li a:hover{
		opacity:0.4;
		text-decoration:none!important;
    	-webkit-transition: all 0.5s;
    	-o-transition: all 0.5s;
    	transition: all 0.5s;
	}


}
@media (max-width: 1300px){
}



@media (max-width: 768px){
	ul.list-fnav li{
		float:none;
}
}

@media (max-width: 550px){
.img-responsive{
  width:95%;
  height: auto;
}
}

@media (max-width: 480px){
.layer-container h1{
    font-size: 22px;
	margin:0 0 10px;
}
.layer-container h2{
    font-size: 18px;
	margin:0 0 15px;
}
.layer-container .text-large a{
	font-size:28px;

}
.layer-container .text-large span{
	font-size: 28px;
}
.section-pro ul li{
	padding:0px 10px;
}
.section-pro ul li i{
		font-size:50px;
		margin-bottom:10px;
	}
	.section-pro ul li label{
		font-size:16px;

	}

	.section-pro ul li .item{
		background: #bbbbbb;
		padding: 30px 10px;
		border-radius: 50%!important;
		width: 140px;
		height: 140px;
		display:inline-block;
	}
}

@media (max-width: 479px){
}