/**
 * Mixins
 */
/***
AngularJS Basic Animations
***/
@-webkit-keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(15px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
  }
}
@-moz-keyframes fadeInUp {
  0% {
    opacity: 0;
    -moz-transform: translateY(15px);
  }
  100% {
    opacity: 1;
    -moz-transform: translateY(0);
  }
}
@-o-keyframes fadeInUp {
  0% {
    opacity: 0;
    -o-transform: translateY(15px);
  }
  100% {
    opacity: 1;
    -o-transform: translateY(0);
  }
}
@keyframes fadeInUp {
  0% {
    opacity: 0;
    transform: translateY(15px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
.fade-in-up {
  -webkit-animation: fadeInUp .5s;
  animation: fadeInUp .5s;
}
@-webkit-keyframes bounceDelay {
  0%,
  80%,
  100% {
    -webkit-transform: scale(0);
  }
  40% {
    -webkit-transform: scale(1);
  }
}
@keyframes bounceDelay {
  0%,
  80%,
  100% {
    transform: scale(0);
    -webkit-transform: scale(0);
  }
  40% {
    transform: scale(1);
    -webkit-transform: scale(1);
  }
}
@keyframes input-focus {
  0% {
    left: 20%;
    width: 20%;
  }
  99% {
    width: 0;
    left: 0;
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@-webkit-keyframes spinner {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@-moz-keyframes spinner {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@-o-keyframes spinner {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes spinner {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
/*==================================================
 * Parallax(¸óËÒ½Ó)
 *==================================================*/
.parallax {
  position: relative;
  background-attachment: fixed!important;
  background-position: center 0px;
  -webkit-background-size: cover !important;
  -moz-background-size: cover !important;
  -o-background-size: cover !important;
  background-size: cover !important;
  background-repeat: repeat-y;
  overflow: hidden;
  height: 15%;
  min-height: 10%;
}
.parallax:before {
  content: '';
  position: absolute;
  background: url('/assets/images/common/patterns/dotted.png') repeat;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.parallax.full {
  height: 100%;
  min-height: 100%;
}
.parallax.parallax-header > h2 {
  position: absolute;
  top: 25%;
  left: 50%;
  font-family: 'wklgoth','simfang';
  font-size: 36px;
  font-weight:bold;
  color: #fff;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
/* Global */
html,
body {
  width: 100%;
  height: 100%;
  font-family: 'open-sanslight', 'arial-regular', 'wklchbo','simsun', sans-serif;
  font-size: 14px;
  -webkit-font-smoothing: antialiased;
  /* Fix for webkit rendering */
  -webkit-text-size-adjust: 100%;
}
pre {
  background: transparent!important;
}
ul {
  list-style: none;
  
}
a {
  opacity: 1;
  filter: alpha(opacity=100);
  -webkit-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
a:hover {
  opacity: 0.8;
  filter: alpha(opacity=80);
}
a:focus {
  outline: none;
}
.btn {
  border-radius: 0;
}
/* Classes */
.page-header {
  padding: 0;
  margin: 0;
  top: 0px;
}
.logo {
  position: relative;
}
.alert {
  text-align: left;
  border-radius: 0;
  margin-bottom: 15px;
  padding: 8px;
}
.alert > i {
  margin-right: 5px;
}
.no-image {
  display: table;
  background-color: #ddd;
  color: white;
  text-align: center;
}
.no-image:before {
  display: table-cell;
  font-family: 'Simple-Line-Icons';
  content: '\e07c';
  vertical-align: middle;
}
.form-control {
  background-color: #fff;
  border: 1px solid #e5e5e5;
  color: #333;
  margin-bottom: 15px;
  box-shadow: none !important;
  border-radius: 0;
  -webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  -o-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
}
.form-control:focus {
  border-color: #aaaaaa;
  outline: 0;
  box-shadow: none;
}
.container,
.container-fluid {
  height: 100%;
}
.form {
  float: left;
  background-color: white;
  width: 100%;
}
.form-group {
  position: relative;
  margin-bottom: 0;
}
.form-group > i {
  position: absolute;
  display: block;
  margin: 11px 2px 4px 10px;
  color: #ccc;
  width: 16px;
  font-size: 14px;
  text-align: center;
  z-index: 3;
}
.form-group > .form-control {
  border-left: 2px solid #2ecc71;
  padding-left: 33px;
}
.form-group select.form-control {
  position: relative;
  padding-left: 4px;
}
/***************************
 * Pattern Background(²ÀÀ¹É°Ò)
 **************************/
.bg-pattern {
  background-repeat: repeat;
}
.bg-pattern.bg-pattern-1 {
  background-image: url('/assets/images/common/bgs/1.png');
}
.bg-pattern.bg-pattern-2 {
  background-image: url('/assets/images/common/bgs/2.png');
}
.bg-pattern.bg-pattern-3 {
  background-image: url('/assets/images/common/bgs/3.png');
}
.bg-pattern.bg-pattern-4 {
  background-image: url('/assets/images/common/bgs/4.png');
}
.bg-pattern.bg-pattern-5 {
  background-image: url('/assets/images/common/bgs/5.png');
}
.label {
  font-weight: normal;
}
.form-actions {
  display: block;
}
.dropdown .dropdown-toggle > i.fa-language {
  line-height: 30px;
  font-size: 22px;
}
.dropdown .dropdown-menu {
  font-family: 'arial-regular', 'wklchbo','simsun';
  background-color: rgba(20, 20, 20, 0.9);
  border-top: 2px solid #2ecc71;
  border-radius: 0;
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.5);
  color: white;
  padding: 15px;
}
.dropdown .dropdown-menu:before {
  position: absolute;
  content: '';
  top: -7px;
  right: 10px;
  border-right: 6px solid transparent;
  border-bottom: 6px solid #2ecc71;
  border-left: 6px solid transparent;
}
.dropdown .dropdown-menu:after {
  position: absolute;
  content: '';
  top: -6px;
  right: 10px;
  border-right: 6px solid transparent;
  border-bottom: 6px solid #2ecc71;
  border-left: 6px solid transparent;
}
.dropdown .dropdown-menu > h5 {
  margin-top: 0;
  font-family: 'myriadpro-regular', 'wklgm','simsun';
  font-size: 16px;
  font-weight: bold;
  color: #ddd;
}
.dropdown .dropdown-menu hr {
  margin: 10px 0;
  border-color: #333;
}
.dropdown .dropdown-menu ul.languages {
  padding: 0;
}
.dropdown .dropdown-menu ul.languages > li {
  position: relative;
  margin-bottom: 10px;
  padding: 3px 5px;
  opacity: 0.7;
  filter: alpha(opacity=70);
}
.dropdown .dropdown-menu ul.languages > li:last-child {
  margin-bottom: 0;
}
.dropdown .dropdown-menu ul.languages > li > a {
  font-size: 14px;
  color: white;
}
.dropdown .dropdown-menu ul.languages > li > a:hover,
.dropdown .dropdown-menu ul.languages > li > a:focus,
.dropdown .dropdown-menu ul.languages > li > a:active {
  text-decoration: none;
}
.dropdown .dropdown-menu ul.languages > li > a i {
  margin-right: 10px;
}
.dropdown .dropdown-menu ul.languages > li > a .code {
  background-color: #337ab7;
  padding: 2px;
  margin-right: 10px;
  font-size: 11px;
}
.dropdown .dropdown-menu ul.languages > li.active {
  background-color: rgba(255, 255, 255, 0.1);
}
.dropdown .dropdown-menu ul.languages > li.active:before {
  position: absolute;
  font-family: FontAwesome;
  font-size: 16px;
  content: '\f00c';
  color: #2ecc71;
  right: 5px;
  top: 1px;
}
/***********************************************
 * Modal(·º³âÂô»¥)
 **********************************************/
.modal {
  float: left;
}
.modal .modal-content {
  float: left;
  width: 100%;
  border-radius: 0;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
}
.modal .modal-content .modal-header {
  float: left;
  width: 100%;
  border-top: 3px solid #2ecc71;
  border-bottom: 1px dotted #2ecc71;
}

.modal .modal-content .modal-header .modal-title {
  color: #2ecc71;
  text-align:center;
  font-size:16px;
}

.modal .modal-content .modal-header .modal-title > i {
  margin-right: 5px;
}
.modal .modal-content .modal-body {
  font-size: 16px;
  float: left;
  width: 100%;
  text-align:justify;
}
.modal .modal-content .modal-body .top {
  display: block;
  margin: 0 auto 15px auto;
}
.modal .modal-content .modal-footer {
  float: left;
  width: 100%;
  border-bottom: 2px solid #2ecc71;
  border-top: 1px dotted #2ecc71;
}
.modal .modal-content .modal-footer .modal-title{
  float: left;
  color: #55BBB8;
  font-weight: bold;
  margin-right: 5px;
}

/***********************************************
 * BlockUI(¹¹µá¿ÍUI)
 **********************************************/
.spinner-bar > div {
  margin: 0 2px;
  width: 15px;
  height: 15px;
  background: #2ecc71;
  border-radius: 100% !important;
  display: inline-block;
  -webkit-animation: bounceDelay 1.4s infinite ease-in-out;
  animation: bounceDelay 1.4s infinite ease-in-out;
  /* Prevent first frame from flickering when animation starts */
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}
.spinner-bar .bounce1 {
  -webkit-animation-delay: -0.32s;
  animation-delay: -0.32s;
}
.spinner-bar .bounce2 {
  -webkit-animation-delay: -0.16s;
  animation-delay: -0.16s;
}
/***********************************************
 * Page Loader(¼¼è¹¦µÍÊﱨ)
 **********************************************/
.page-loader {
  position: fixed;
  display: block;
  background: black;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 100000;
}
.page-loader .blockPage {
  position: fixed;
  width: 30%;
  top: 50%;
  left: 35%;
  text-align: center;
}
.page-loader .blockPage .spinner {
  text-align: center;
}
.page-loader .blockPage .spinner > div {
  margin: 0 2px;
  width: 15px;
  height: 15px;
  background: #2ecc71;
  border-radius: 100% !important;
  display: inline-block;
  -webkit-animation: bounceDelay 1.4s infinite ease-in-out;
  animation: bounceDelay 1.4s infinite ease-in-out;
  /* Prevent first frame from flickering when animation starts */
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}
.page-loader .blockPage .spinner .bounce1 {
  -webkit-animation-delay: -0.32s;
  animation-delay: -0.32s;
}
.page-loader .blockPage .spinner .bounce2 {
  -webkit-animation-delay: -0.16s;
  animation-delay: -0.16s;
}

.pi-price:before {
  content: " ";
}
.pi-price:after {
  content: "";
}


.work-full-slider:hover .owl-prev,
.content-slider:hover .owl-prev{
	left: 10px;
}
.work-full-slider:hover .owl-next,
.content-slider:hover .owl-next{
	right: 10px;
}
.work-full-slider .owl-pagination,
.content-slider .owl-pagination{
	bottom: 15px;
}
.clearlist, .clearlist li {
    list-style: none;
    padding: 0;
    margin: 0;
    background: none;
}

/* ==============================
   Blog
   ============================== */

.blog-item{
	margin-bottom: 70px;
	position: relative;
}

.blog-item-date{
	width: 100px;
	padding: 10px;
	position: absolute;
	top: 0px;
	left: -130px;
	font-size: 13px;
	letter-spacing: 1px;
	line-height: 1.2;
	text-transform: uppercase;
	text-align: center;
	color: #222;
    border-right: 1px solid #eee;
	
}
.date-num{
	display: block;
	margin-bottom: 3px;
	font-family: Montserrat, arial, sans-serif;
	font-size: 18px;
    color: #111;
}
.blog-media{
	margin-bottom: 30px;
}
.blog-media img,
.blog-media .video,
.blog-media iframe{
	
}
.blog-item-title{
	margin-top: 0;
	padding-top: 0;
	font-size: 24px;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;

}
.blog-item-title a{
	color: #000;
	text-decoration: none;
}
.blog-item-title a:hover{
	color: #e41919;
	text-decoration: none;
}
.blog-item-data{
	margin-bottom: 30px;
	text-transform: uppercase;
	font-size: 11px;
    letter-spacing: 1px;
	color: #aaa;
}
.separator{
	margin: 0 5px;
}
.blog-item-data a{
	color: #aaa;
	text-decoration: none;
	-webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);  
    -moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); 
    -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
    -ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); 
    transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
}
.blog-item-data a:hover{
	color: #000;
	text-decoration: none;
}
.blog-post-data{
    margin-top: 10px;
	text-transform: uppercase;
	font-size: 11px;
    letter-spacing: 1px;
	color: #aaa;
}
.blog-item-body{
    font-size: 16px;
	font-weight: 300;
	color: #5f5f5f;
	line-height: 1.8;
}
.blog-item-body h1,
.blog-item-body h2,
.blog-item-body h3,
.blog-item-body h4,
.blog-item-body h5,
.blog-item-body h6{
	margin: 1.3em 0 0.5em 0;
	color: #000;
}

.blog-item-more{
    border: 1px solid #eaeaea;
    padding: 5px 10px;
	font-size: 12px;
    font-weight: 400;
    text-transform: uppercase;
	color: #777;
    letter-spacing: 1px;
	
	-webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);  
    -moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); 
    -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
    -ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); 
    transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
}
.blog-item-more:hover{
	text-decoration: none;
    border-color: #e41919;
}
a.blog-item-more{
	color: #777;
	text-decoration: none;
}
a.blog-item-more:hover{
	color: #e41919;
}

.blog-item-q{
	background: none;
	border: none;
	padding: 0;
    margin: 1em 0;
}
.blog-item-q p{
	position: relative;
	font-size: 20px;
    font-style: normal;
    letter-spacing: 0;
}
.blog-item-q p a{
	color: #000;
	text-decoration: none;
	-webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);  
    -moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); 
    -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
    -ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); 
    transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
}
.blog-item-q:hover a,
.blog-item-q p a:hover{
	text-decoration: none;
	color: #e41919;
}
.blog-item-q p:before,
.blog-item-q p:after{
	-webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);  
    -moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); 
    -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
    -ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); 
    transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
}
.blog-item-q p:before{
	content: '"';
	position: absolute;
	top: 0;
	left: -17px;
}
.blog-item-q p:after{
	content: '"';
}

.blog-item-q p:hover:before,
.blog-item-q p:hover:after{
	color: #e41919;
}
.blog-page-title{
	margin-bottom: 30px;
	padding-bottom: 10px;
	border-bottom: 1px solid #eee;
}