/*============================================================================*/
/*= Edit = */
/*============================================================================*/
#header-space{height:85px;}
#header-space.sticky{height:61px;}
#header-wrapper{position:fixed;top:0;left:0;z-index:10;width:100%;color:#fff}
#header-wrapper header{}
#header-wrapper header a{color:#fff}
#header-wrapper #search-wrapper{display:none;}

/*= Logo
==========================================*/
.header-logo #logo{font-size:2.7em;padding:18px 0 0 0;margin:0;display:block;color:#fff;transition:all .4s;-webkit-transition:all .4s;line-height:35px;}
.header-logo #logo:hover{color:#95D7FF;text-decoration:none;}
.site-slogan{letter-spacing:1px;color:#999;transition:all .6s;-webkit-transition:all .6s;}
.stickey .header-logo #logo{font-size:2em;padding:15px 0 0 0;line-height:25px;}
.stickey .site-slogan{font-size:0.7065em;}

/*= Menu
==========================================*/
header{ background-color:rgba(0,0,0,0.7);}
#nav-wrapper{text-align:right;}
#main-nav{margin:0;padding:0;font-size:0;list-style:none;}
#main-nav li{margin:0;padding:0;font-size:16px;display:inline-block;}
#main-nav li:before{content:' ';display:block;width:0;height:3px;background:#000;transition:all .3s;-webkit-transition:all .3s;}
#main-nav li:hover:before,#main-nav li.current:before{background:#79A100;width:100%;}
#main-nav li.current:before{background:#007CC8}
#main-nav li a{display:block;padding:30px 15px;transition:all .5s;-webkit-transition:all .5s;}
#main-nav li a:hover{text-decoration:none;color:#A7CB00}
#main-nav li.current a{color:#39A5E7}
#main-nav li#site-search{}
#main-nav li#site-search:before{content:none;}
.stickey #main-nav li a{padding:18px 15px;}

#toggle-nav,#toggle-search{position:absolute;top:17px;font-size:2em;border-radius:4px;padding:3px 12px;transition:all .4s;-webkit-transition:all .4s;}
#toggle-nav:hover,#toggle-search:hover{background:rgba(255,255,255,.25)}
#toggle-nav{left:15px;font-size:2.2em;}
#toggle-search{right:15px;}
.stickey #toggle-nav,.stickey #toggle-search{top:8px;}

/*= Mobile Menu
==========================================*/
#mobile-nav-wrapper{background:#333;position:fixed;left:-270px;top:0;height:100%;width:270px;z-index:9999;overflow:scroll;padding:50px 25px 30px 25px;}
#mobile-nav-wrapper.active{}
#mobile-nav-wrapper::-webkit-scrollbar{width:0!important;}
a#close-mobile-nav{color:#fff;position:absolute;left:15px;top:15px;border:2px solid #fff;border-radius:100px;padding:4px 9px 1px 9px;font-size:14px;font-family:'quark';line-height:20px;text-decoration:none;transition:all .4s;-webkit-transition:all .4s;}
a#close-mobile-nav:hover{color:#e74c3c;border:2px solid #e74c3c;}

#mobile-nav{margin:0;padding:0;list-style:none;font-family:'Helvetica','Tahoma';}
#mobile-nav ul{margin:0;padding:0;list-style:none;}
#mobile-nav li{}
#mobile-nav li a{color:#bbb;font-size:1.13em;text-decoration:none;padding:0;display:block;}
#mobile-nav li a:before{content:'\f101';font-family:'FontAwesome';margin-right:5px;font-size:12px;}
#mobile-nav li a:hover{}
#mobile-nav>li{border-bottom:1px solid #565656;padding:7px 0;overflow:hidden;}
#mobile-nav li{position:relative;}
#mobile-nav>li>a{}
#mobile-nav>li>ul{}
#mobile-nav>li>ul>li{padding-left:20px;margin-bottom:5px;}
#mobile-nav>li>ul>li>a{padding:0 15px 0 0;}
#mobile-nav>li a span{position:absolute;right:10px;top:12px;}
#mobile-nav>li a span.mobile-bullet{top:7px;}
#mobile-nav>li>ul>li>a span{top:5px;}
#mobile-nav>li>ul>li>a span.mobile-bullet{top:0px;}
#mobile-nav>li>ul>li>ul{}
#mobile-nav>li>ul>li>ul>li{padding-left:20px}
#mobile-nav>li>ul>li>ul>li>a{}
.mobile-sub-nav,.mobile-sub2-nav{display:none;}

#mobile-nav li.current>a,#mobile-nav>li.current a span.mobile-bullet{color:#8BC906;}

/*= Featured
==========================================*/
#featured{ position:absolute;top:0;left:0;z-index:9}
/*---featured text---*/
.sub-headline{color:#fff; letter-spacing:1px; } /*.headline,.sub-headline{color:#fff;}*/
.headline{font-size:6em;}
.sub-headline{ font-family:'wdbbangna'; font-size:1.5em; text-align:center; }

.headline{
	font-family:'arial';font-size:6.5em;
	font-weight:bold;
	color:rgba(255,255,255,0.4);
	-webkit-text-stroke:1px rgba(232,238,240,0.5);
}


/*edit materslide*/
.ms-view{ background-image:url(../../../data/mainpic/l/main_bg.jpg);}
/*
.headline{
	color:#fff;
	background: url(../../../data/mainpic/l/msk_bg.jpg) no-repeat;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}
*/

/*= Content
==========================================*/
#wrapper{height:auto!important;height:600px;min-height:600px;}

/*= Footer
==========================================*/


footer{position:relative;z-index:5;}
footer .h-line{ height:3px; background-color:#D8DDDE; -moz-border-top-left-radius:2px;	-webkit-border-top-left-radius:2px; border-top-left-radius:2px; -moz-border-top-right-radius:2px;	-webkit-border-top-right-radius:2px; border-top-right-radius:2px;  }
.footer-wrapper{display:block;width:100%;position:relative;margin:0;padding:15px 0 15px 0; background-color:#606973; border-top:2px solid #C9CAD1; font-family:'tahoma';}

.footer-wrapper h5{margin:10px 0 5px 0; font-family:'DB Adman X';font-size:1.9em; color:rgba(201,205,214,0.9);}/*text-shadow:1px 1px 1px #555555;*/
.footer-wrapper h5:before{font-family:'FontAwesome';font-size:.6em;margin-right:10px;}
.footer-wrapper h5 span{color:#BDCAD5;font-size:0.75em;}
.footer-wrapper h5 span:before{ content:'//';margin:0 6px;color:#40CFFF; }


.footer-nav{}
.footer-nav h5{color:#C2C7D1;margin:10px 0 5px 0;  }/*text-shadow:1px 1px 1px #DDDDDD;*/
/*.footer-nav h5:before{content:'\f0c9';color:#00468C;}*/
#footer-nav{margin:0;padding:0;}
#footer-nav>li{display:block;float:left;width:31%;margin:0 2.3% 11px 0;line-height:17px;padding:0 0 0 10px;}
#footer-nav> li.current a{color:#FFFF99; }
#footer-nav>li>a:before{content:'\f101';font-family:'FontAwesome';font-size:0.9em; margin:0 5px 0 -10px;}
#footer-nav>li>a{/*color:#b69200;*/color:#CCE6FF;outline:none;text-decoration:none;font-size:1em; transition:color .3s;-webkit-transition:color .3s;}/*text-shadow:1px 1px 1px #444444;*/
#footer-nav>li>a:hover{text-decoration:none;color:#FFFFFF;}

.footer-contact{}/*max_pinjohn*/
.footer-contact-addr{ font-family:'thaisansneue'; font-size:1.35em; letter-spacing:0.04em; width:100%;margin:0 0 5px 0;color:rgba(255,255,255,0.45); line-height:18px;}/*text-shadow:1px 1px 1px #EEEEEE;*/
.footer-contact-addr a{ color:#88C4FF;}

.footer-credit{background:#31393f;font-size:1.167em;color:#999;padding:15px 0;}
.footer-credit-text{padding-top:3px;font-size:0.7em;}

/*---back to top---*/
#back-to-top,#mobile-back-to-top{position:fixed;right:0;bottom:0;z-index:9000;display:block;width:90px;height:85px;background:url(../images/main/back-to-top-bg.png?v=1.0) no-repeat 0 0;}
#mobile-back-to-top{width:50px;background:none;z-index:9999;}
a.back-to-top{position:absolute;bottom:15px;right:20px;width:52px;height:50px;display:block;background:url(../images/main/back-to-top.png?v=1.0) no-repeat left top;color:#fff;font-size:25px;text-shadow:1px 1px 1px #D96C00; padding:0px 0 0 17px;}
a.back-to-top:hover,a.back-to-top:active{color:#fff;outline:none;}
#mobile-back-to-top a.back-to-top{bottom:15px;right:15px;width:38px;height:36px;background-size:100% auto;padding:0px 0 0 11px;}





/*= Portfolio
==========================================*/
/*#section-portfolio{ margin-top:50px;}*/

#portfolio h1{margin:30px 0 0 0; font-family:'DB Adman X';font-size:5em; color:#77B500;  letter-spacing:0.025em;text-align:center;}
#portfolio h5{margin:-10px 0 10px 0; font-family:'DB Adman X';font-size:2em; color:#a0a0a0; letter-spacing:0.2em;text-align:center; }

#portfolio .portfolio-item{ margin-top:15px; }
#portfolio .portfolio-item h2{margin:0; font-family:'nithan';font-size:2.7em; font-weight:bold; color:#444444; letter-spacing:0.02em; }
#portfolio .portfolio-item h3{margin:10px 10px 10px 0; font-family:'wdbbangna';font-size:1.5em; font-weight:bold; color:#847368; letter-spacing:0.02em; }

#portfolio .portfolio-item .portfolio-desc{ font-size:1.4rem; color:#777777; line-height:1.5; }



#portfolio .portfolio-item .portfolio-viewmore{
	margin-top:30px;
	font-family:'wdbbangna';font-size:1.1em; letter-spacing:0.025em;
}

#portfolio .portfolio-item .portfolio-viewmore a{
	transition: all .2s ease-in-out;
}
#portfolio .portfolio-item .portfolio-viewmore a:hover{
	text-decoration:none;
	opacity:0.7; filter:alpha(opacity=70);
	transform: scale(1.1);
}

#portfolio .portfolio-item .portfolio-img img{
	/*transition: all .2s ease-in-out;*/

}

#portfolio img:hover{
	transform: scale(1.1);
}


/*= Divided
==========================================*/
.divided{display:block;width:100%;height:13px;margin:15px auto;}
.divided.heart-dotted{background:url(../images/main/divided.png) no-repeat;}
.divided.heart-dotted.violet{background-position:center 0;}
.divided.heart-dotted.blue{background-position:center -13px;}
.divided.heart-dotted.sky{background-position:center -26px;}
.divided.heart-dotted.mint{background-position:center -39px;}
.divided.heart-dotted.green{background-position:center -52px;}
.divided.heart-dotted.light-green{background-position:center -65px;}
.divided.heart-dotted.yellow{background-position:center -78px;}
.divided.heart-dotted.orange{background-position:center -91px;}
.divided.heart-dotted.red{background-position:center -104px;}































/*= Badge
==========================================*/
.badge-green{
   position:relative;
}
.badge-green[data-badge]:after {
   content:attr(data-badge);
   position:absolute;
   top:-30px;
   right:-30px;
   font-size:.7em;
   background:rgba(0,179,0,0.65);
   color:white;
   width:40px;height:40px;
   text-align:center;
   line-height:40px;
   border-radius:50%;
   box-shadow:0 0 1px #333;
}


/*= Bootstrap Css Adder  callout
=========================================*/
.bs-callout {
  margin: 0 0 20px 0;
  padding: 10px 30px 10px 15px;
  border-left: 5px solid #eee;
}
.bs-callout h4 {
  margin-top: 0;
}
.bs-callout p:last-child {
  margin-bottom: 0;
}
.bs-callout code,
.bs-callout .highlight {
  background-color: #fff;
}

/* Themes for different contexts */
.bs-callout-danger {
  background-color: #fcf2f2;
  border-color: #dFb5b4;
}
.bs-callout-warning {
  background-color: #fefbed;
  border-color: #f1e7bc;
}
.bs-callout-info {
  background-color: #f0f7fd;
  border-color: #d0e3f0;
}

.bs-callout-normal {
  background-color: #F9F9F9;
  border-color: #A3D900;
}




/*============================================================================*/
/*= Fixed = */
/*============================================================================*/


/*= Image Mask
==========================================*/
.img-right-chevron{
	-webkit-clip-path: polygon(75% 0%, 100% 50%, 75% 100%, 10% 100%, 25% 50%, 10% 10%);
	clip-path: polygon(75% 10%, 100% 50%, 75% 100%, 10% 100%, 25% 50%, 10% 10%);
}

.img-left-chevron{
	-webkit-clip-path: polygon(100% 0%, 75% 50%, 100% 100%, 25% 100%, 0% 50%, 25% 0%);
	clip-path: polygon(100% 0%, 75% 50%, 100% 100%, 25% 100%, 0% 50%, 25% 0%);
}

.img-parallelogram{
	-webkit-clip-path: polygon(25% 0%, 100% 0%, 75% 100%, 0% 100%);
	clip-path: polygon(25% 0%, 100% 0%, 75% 100%, 0% 100%);
}

.img-circle{
	-webkit-clip-path: circle(50% at 50% 50%);
	clip-path: circle(50% at 50% 50%);
}

.img-heptagon{
	-webkit-clip-path: polygon(50% 0%, 90% 20%, 100% 60%, 75% 100%, 25% 100%, 0% 60%, 10% 20%);
	clip-path: polygon(50% 0%, 90% 20%, 100% 60%, 75% 100%, 25% 100%, 0% 60%, 10% 20%);
}

.img-rhombus{
	-webkit-clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
	clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
}





/*= Align
==========================================*/
.hcenter{ text-align:center; }
.hright{ text-align:right; }

.vmiddle{ vertical-align:middle; }


/*= Font
==========================================*/
.font-1.2em{ font-size:1.2em;}
.font-2em{ font-size:2em;}
.font-3em{ font-size:3em;}
.font-4em{ font-size:4em;}

.font-gray{ color:#BBBBBB; }
.font-orange{ color:#FF8000; }

.font-white{ color:#FFFFFF !important; } .font-white-70{ color:rgba(255,255,255,0.7) !important; }
.font-red{ color:#D90000 !important; } .font-b-red{ font-weight:bold !important; color:#D90000 !important; }
.font-blue{ color:#006CD9 !important; } .font-b-blue{ font-weight:bold !important; color:#007FFF !important; }

.font-green{ color:#00B300; }

.font-brown{ color:#B32D00; }
.font-white{ color:#FFFFFF; }

/*=Radius
==========================================*/
.border-r4{ -moz-border-radius:4px;	-webkit-border-radius:4px; border-radius:4px; }
.border-r6{ -moz-border-radius:6px;	-webkit-border-radius:6px; border-radius:6px; }
.border-r10{ -moz-border-radius:10px; -webkit-border-radius:10px; border-radius:10px; }
/*=Border
==========================================*/
.border-1-solid{ border:1px solid;}
.border-1-dotted{ border:1px dotted;}

.border-b1-dotted{ border-bottom:1px dotted;}

/*=Border
==========================================*/


/*= Background
==========================================*/
.bg-black-50{ background-color:rgba(0,0,0,0.5); }
.bg-black-30{ background-color:rgba(0,0,0,0.3); }
.bg-black-20{ background-color:rgba(0,0,0,0.2); }
.bg-black-10{ background-color:rgba(0,0,0,0.1); }

.bg-orange{ background-color:rgba(255,128,0,1); }
.bg-orange-50{ background-color:rgba(255,128,0,0.5); }
.bg-orange-20{ background-color:rgba(255,128,0,0.2); }
.bg-orange-10{ background-color:rgba(255,128,0,0.1); }

.bg-yellowdark-50{ background-color:rgba(217,163,0,0.5); }
.bg-yellowdark-20{ background-color:rgba(217,163,0,0.2); }
.bg-yellowdark-10{ background-color:rgba(217,163,0,0.1); }


/*= Width Height
==========================================*/
.w-100{ width:100px !important; margin:0 auto; }
.w-150{ width:150px !important; margin:0 auto; }

.w-96p{ width:96% !important; margin:0 auto; }
.w-98p{ width:98% !important; margin:0 auto; }
.w-100p{ width:100% !important; margin:0 auto; }

.w-100p{ width:100% !important; margin:0 auto; }

.h-100p{ height:100% !important; margin:0 auto; }

.h-50{ height:50px; margin:0 auto;}
.h-60{ height:60px; margin:0 auto;}
.h-80{ height:80px; margin:0 auto;}
.h-100{ height:100px; margin:0 auto;}
.h-500{ height:500px !important; margin:0 auto; }


/*= Margin
==========================================*/
.margin-5{ margin:5px; } .margin-5t{ margin-top:5px; } .margin-5b{ margin-bottom:5px; } .margin-5l{ margin-left:5px; } .padd-5r{ margin-right:5px; }
.margin-10{ margin:10px; } .margin-10t{ margin-top:10px; } .margin-10b{ margin-bottom:10px; } .padd-10l{ margin-left:10px; } .margin-10r{ margin-right:10px; }

.margin-40{ margin:40px; } .margin-40t{ margin-top:40px; } .margin-40b{ margin-bottom:40px; } .padd-40l{ margin-left:40px; } .margin-40r{ margin-right:40px; }
.margin-70{ margin:70px; } .margin-70t{ margin-top:70px; } .margin-70b{ margin-bottom:70px; } .padd-70l{ margin-left:70px; } .margin-70r{ margin-right:70px; }

/*= Padding
==========================================*/
.padd-3{ padding:3px; } .padd-3t{ padding-top:3px; } .padd-3b{ padding-bottom:3px; } .padd-3l{ padding-left:3px; } .padd-3r{ padding-right:3px; }
.padd-5{ padding:5px; } .padd-5t{ padding-top:5px; } .padd-5b{ padding-bottom:5px; } .padd-5l{ padding-left:5px; } .padd-5r{ padding-right:5px; }
.padd-10{ padding:10px; } .padd-10t{ padding-top:10px; } .padd-10b{ padding-bottom:10px; } .padd-10l{ padding-left:10px; } .padd-10r{ padding-right:10px; }
.padd-15{ padding:15px; } .padd-15t{ padding-top:15px; } .padd-15b{ padding-bottom:15px; } .padd-15l{ padding-left:15px; } .padd-15r{ padding-right:15px; }
.padd-20{ padding:20px; } .padd-20t{ padding-top:20px; } .padd-20b{ padding-bottom:20px; } .padd-20l{ padding-left:20px; } .padd-20r{ padding-right:20px; }



/*= General
==========================================*/
.hidden{ display:none;}
.clear-b{ clear:both;}

.relative{ position:relative !important;}
.absolute{ position:absolute !important;}


.top-50p{ top:50% !important;}





/*= Add : Edit
===================================================================================================================*/
#operation_id{
	margin:0 auto; margin-top:10px; padding:10px; width:100%;
	-moz-border-radius:6px;	-webkit-border-radius:6px; border-radius:6px;
	-moz-box-shadow:0px 0px 20px #666666; -webkit-box-shadow:0px 0px 20px #666666;	box-shadow:0px 0px 20px #CCC;

}


#operation_id ul{ margin:0 auto; padding:0; list-style:none; vertical-align:top;}
#operation_id ul li{ padding:6px;display:-moz-inline-stack; display:inline-block; zoom:1; *display:inline; vertical-align:top; }
#operation_id ul li div,label{ padding:1px;}
#operation_id ul li label{ color:#666; font-size:0.85em; }
#operation_id ul li div input,textarea{ font-size:14px !important; width:100% !important; line-height:1.5em !important; padding:5px !important; border:1px solid #CCC !important; -moz-border-radius:4px !important;	-webkit-border-radius:4px !important; border-radius:4px !important;}
#operation_id ul li div select{ font-size:14px; width:100%; line-height:1.5em; padding:6px; border:1px solid #CCC; -moz-border-radius:4px;	-webkit-border-radius:4px; border-radius:4px;}

#operation_id ul li div input.input_dt,#operation_id ul li div input.input-dt{ width:100px !important; cursor:pointer; z-index:999; }


#operation_id ul li div.div_dt::after{content:"\f073";font-family:"FontAwesome"; font-size:20px; margin:0 5px;color:#ccc; cursor:pointer; }
/*.title-data .nav-step li:first-child:before{content:none;}*/

#operation_id ul li div input.input_shortest,#operation_id ul li div input.input-shortest{ width:100px !important; }
#operation_id ul li div input.input_short,#operation_id ul li div input.input-short{ min-width:100px; }
#operation_id ul li div input.input_norm,#operation_id ul li div input.input-norm{ min-width:300px; }
#operation_id ul li div input.input_mid,#operation_id ul li div input.input-mid{ min-width:600px; }
#operation_id ul li div input.input_long,#operation_id ul li div input.input-long{ min-width:900px;}

#operation_id ul li label{ color:#79796A; font-weight:normal; }

#operation_id ul li div select.select_norm{ min-width:300px; }

#operation_id div.oper_panel{ padding:10px; margin:0;}
#operation_id div.oper_panel label{ color:#79796A; font-weight:normal; }
#operation_id div.oper_panel ul{ margin:0 auto; padding:0; list-style:none;}
#operation_id div.oper_panel ul li{padding:5px 20px 5px 3px;}
#operation_id div.oper_panel ul li input[type='text']{ font-size:14px; width:100%; line-height:1.5em; padding:2px; border:1px solid #F0F0E1; -moz-border-radius:4px;	-webkit-border-radius:4px; border-radius:4px; }
#operation_id div.oper_panel ul li input.input_shortest{ width:60px;}
#operation_id div.oper_panel ul li input.input_short{ width:150px;}
:checked + input {
   color:#0059B3; font-weight:bold;
}
:checked + span{
   color:#0059B3; font-weight:bold;
}
#err_container{
	margin:0 auto; margin-top:10px;  width:95%;
	-moz-border-radius:6px;	-webkit-border-radius:6px; border-radius:6px;
	-moz-box-shadow:0px 0px 20px #666666; -webkit-box-shadow:0px 0px 20px #666666;	box-shadow:0px 0px 20px #CCC;
}
#err_container ul{ margin:0 auto; padding:10px; vertical-align:top; list-style:none; }
#err_container ul li{ padding:3px; vertical-align:top; }
#err_container ul li label.chk-valid{ font-weight:normal; font-size:14px; color:#D90000; }
#err_container ul li label.chk-valid:before{content:"\f071";font-family:"FontAwesome"; font-size:15px; margin:0 5px; }
#err_container ul li label.chk-invalid{ color:#00D900; }
#err_container ul li label.chk-invalid:before{content:"\f14a";font-family:"FontAwesome"; font-size:15px; margin:0 5px; }




/*= Bootstrap Tab
===================================================================================================================*/
.nav-tabs{ font-size:1.05em; font-weight:bold;}

.nav-tabs.green li{ padding:5px 5px 5px 3px !important; }

.nav-tabs.green > li > a{ border: 1px solid #EEEEEE; border-bottom-color: transparent; background-image: linear-gradient( to top,rgba(255,255,255,0.6), #EEEEEE );  }
.nav-tabs.green > li.active > a,.nav-tabs.green > li.active > a:hover,.nav-tabs.green > li.active > a:focus {
	color: #8D8254;
	/*border: 0px solid #6CD900;	border-bottom-color: transparent;*/
	background-color: #E3DFD2;
	background-image: linear-gradient( to bottom,rgba(235,232,222,0.5), #BFB695 );
}
.nav-tabs.green > li.active > a:after,.nav-tabs.green > li.active > a:hover:after,.nav-tabs.green > li.active > a:focus:after {
	content:'';
	display:block;
	position:absolute;
	top:100%; /*should be set to 100% */
	left:20px;
	width:0;
	height:0;
	border-color: #ADA376 transparent transparent transparent; /*border color should be same as div div background color*/
	border-style: solid;
	border-width: 10px;
}

.tab-content{ padding:5px;}
.tab-content ul li input[type='text']{ border:1px solid !important; border-radius:0 !important; border-color:#CCCCCC !important;}





/*= Font Awesome Animation
================================================*/

@-webkit-keyframes wrench {
  0% {
    -webkit-transform: rotate(-12deg);
    transform: rotate(-12deg);
  }

  8% {
    -webkit-transform: rotate(12deg);
    transform: rotate(12deg);
  }

  10% {
    -webkit-transform: rotate(24deg);
    transform: rotate(24deg);
  }

  18% {
    -webkit-transform: rotate(-24deg);
    transform: rotate(-24deg);
  }

  20% {
    -webkit-transform: rotate(-24deg);
    transform: rotate(-24deg);
  }

  28% {
    -webkit-transform: rotate(24deg);
    transform: rotate(24deg);
  }

  30% {
    -webkit-transform: rotate(24deg);
    transform: rotate(24deg);
  }

  38% {
    -webkit-transform: rotate(-24deg);
    transform: rotate(-24deg);
  }

  40% {
    -webkit-transform: rotate(-24deg);
    transform: rotate(-24deg);
  }

  48% {
    -webkit-transform: rotate(24deg);
    transform: rotate(24deg);
  }

  50% {
    -webkit-transform: rotate(24deg);
    transform: rotate(24deg);
  }

  58% {
    -webkit-transform: rotate(-24deg);
    transform: rotate(-24deg);
  }

  60% {
    -webkit-transform: rotate(-24deg);
    transform: rotate(-24deg);
  }

  68% {
    -webkit-transform: rotate(24deg);
    transform: rotate(24deg);
  }

  75% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}

@keyframes wrench {
  0% {
    -webkit-transform: rotate(-12deg);
    -ms-transform: rotate(-12deg);
    transform: rotate(-12deg);
  }

  8% {
    -webkit-transform: rotate(12deg);
    -ms-transform: rotate(12deg);
    transform: rotate(12deg);
  }

  10% {
    -webkit-transform: rotate(24deg);
    -ms-transform: rotate(24deg);
    transform: rotate(24deg);
  }

  18% {
    -webkit-transform: rotate(-24deg);
    -ms-transform: rotate(-24deg);
    transform: rotate(-24deg);
  }

  20% {
    -webkit-transform: rotate(-24deg);
    -ms-transform: rotate(-24deg);
    transform: rotate(-24deg);
  }

  28% {
    -webkit-transform: rotate(24deg);
    -ms-transform: rotate(24deg);
    transform: rotate(24deg);
  }

  30% {
    -webkit-transform: rotate(24deg);
    -ms-transform: rotate(24deg);
    transform: rotate(24deg);
  }

  38% {
    -webkit-transform: rotate(-24deg);
    -ms-transform: rotate(-24deg);
    transform: rotate(-24deg);
  }

  40% {
    -webkit-transform: rotate(-24deg);
    -ms-transform: rotate(-24deg);
    transform: rotate(-24deg);
  }

  48% {
    -webkit-transform: rotate(24deg);
    -ms-transform: rotate(24deg);
    transform: rotate(24deg);
  }

  50% {
    -webkit-transform: rotate(24deg);
    -ms-transform: rotate(24deg);
    transform: rotate(24deg);
  }

  58% {
    -webkit-transform: rotate(-24deg);
    -ms-transform: rotate(-24deg);
    transform: rotate(-24deg);
  }

  60% {
    -webkit-transform: rotate(-24deg);
    -ms-transform: rotate(-24deg);
    transform: rotate(-24deg);
  }

  68% {
    -webkit-transform: rotate(24deg);
    -ms-transform: rotate(24deg);
    transform: rotate(24deg);
  }

  75% {
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}

.faa-wrench.animated,
.faa-wrench.animated-hover:hover,
.faa-parent.animated-hover:hover > .faa-wrench {
  -webkit-animation: wrench 2.5s ease infinite;
  animation: wrench 2.5s ease infinite;
  transform-origin-x: 90%;
  transform-origin-y: 35%;
  transform-origin-z: initial;
}

.faa-wrench.animated.faa-fast,
.faa-wrench.animated-hover.faa-fast:hover,
.faa-parent.animated-hover:hover > .faa-wrench.faa-fast {
  -webkit-animation: wrench 1.2s ease infinite;
  animation: wrench 1.2s ease infinite;
}

.faa-wrench.animated.faa-slow,
.faa-wrench.animated-hover.faa-slow:hover,
.faa-parent.animated-hover:hover > .faa-wrench.faa-slow {
  -webkit-animation: wrench 3.7s ease infinite;
  animation: wrench 3.7s ease infinite;
}

/* BELL */

@-webkit-keyframes ring {
  0% {
    -webkit-transform: rotate(-15deg);
    transform: rotate(-15deg);
  }

  2% {
    -webkit-transform: rotate(15deg);
    transform: rotate(15deg);
  }

  4% {
    -webkit-transform: rotate(-18deg);
    transform: rotate(-18deg);
  }

  6% {
    -webkit-transform: rotate(18deg);
    transform: rotate(18deg);
  }

  8% {
    -webkit-transform: rotate(-22deg);
    transform: rotate(-22deg);
  }

  10% {
    -webkit-transform: rotate(22deg);
    transform: rotate(22deg);
  }

  12% {
    -webkit-transform: rotate(-18deg);
    transform: rotate(-18deg);
  }

  14% {
    -webkit-transform: rotate(18deg);
    transform: rotate(18deg);
  }

  16% {
    -webkit-transform: rotate(-12deg);
    transform: rotate(-12deg);
  }

  18% {
    -webkit-transform: rotate(12deg);
    transform: rotate(12deg);
  }

  20% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}

@keyframes ring {
  0% {
    -webkit-transform: rotate(-15deg);
    -ms-transform: rotate(-15deg);
    transform: rotate(-15deg);
  }

  2% {
    -webkit-transform: rotate(15deg);
    -ms-transform: rotate(15deg);
    transform: rotate(15deg);
  }

  4% {
    -webkit-transform: rotate(-18deg);
    -ms-transform: rotate(-18deg);
    transform: rotate(-18deg);
  }

  6% {
    -webkit-transform: rotate(18deg);
    -ms-transform: rotate(18deg);
    transform: rotate(18deg);
  }

  8% {
    -webkit-transform: rotate(-22deg);
    -ms-transform: rotate(-22deg);
    transform: rotate(-22deg);
  }

  10% {
    -webkit-transform: rotate(22deg);
    -ms-transform: rotate(22deg);
    transform: rotate(22deg);
  }

  12% {
    -webkit-transform: rotate(-18deg);
    -ms-transform: rotate(-18deg);
    transform: rotate(-18deg);
  }

  14% {
    -webkit-transform: rotate(18deg);
    -ms-transform: rotate(18deg);
    transform: rotate(18deg);
  }

  16% {
    -webkit-transform: rotate(-12deg);
    -ms-transform: rotate(-12deg);
    transform: rotate(-12deg);
  }

  18% {
    -webkit-transform: rotate(12deg);
    -ms-transform: rotate(12deg);
    transform: rotate(12deg);
  }

  20% {
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}

.faa-ring.animated,
.faa-ring.animated-hover:hover,
.faa-parent.animated-hover:hover > .faa-ring {
  -webkit-animation: ring 2s ease infinite;
  animation: ring 2s ease infinite;
  transform-origin-x: 50%;
  transform-origin-y: 0px;
  transform-origin-z: initial;
}

.faa-ring.animated.faa-fast,
.faa-ring.animated-hover.faa-fast:hover,
.faa-parent.animated-hover:hover > .faa-ring.faa-fast {
  -webkit-animation: ring 1s ease infinite;
  animation: ring 1s ease infinite;
}

.faa-ring.animated.faa-slow,
.faa-ring.animated-hover.faa-slow:hover,
.faa-parent.animated-hover:hover > .faa-ring.faa-slow {
  -webkit-animation: ring 3s ease infinite;
  animation: ring 3s ease infinite;
}

/* VERTICAL */

@-webkit-keyframes vertical {
  0% {
    -webkit-transform: translate(0,-3px);
    transform: translate(0,-3px);
  }

  4% {
    -webkit-transform: translate(0,3px);
    transform: translate(0,3px);
  }

  8% {
    -webkit-transform: translate(0,-3px);
    transform: translate(0,-3px);
  }

  12% {
    -webkit-transform: translate(0,3px);
    transform: translate(0,3px);
  }

  16% {
    -webkit-transform: translate(0,-3px);
    transform: translate(0,-3px);
  }

  20% {
    -webkit-transform: translate(0,3px);
    transform: translate(0,3px);
  }

  22% {
    -webkit-transform: translate(0,0);
    transform: translate(0,0);
  }
}

@keyframes vertical {
  0% {
    -webkit-transform: translate(0,-3px);
    -ms-transform: translate(0,-3px);
    transform: translate(0,-3px);
  }

  4% {
    -webkit-transform: translate(0,3px);
    -ms-transform: translate(0,3px);
    transform: translate(0,3px);
  }

  8% {
    -webkit-transform: translate(0,-3px);
    -ms-transform: translate(0,-3px);
    transform: translate(0,-3px);
  }

  12% {
    -webkit-transform: translate(0,3px);
    -ms-transform: translate(0,3px);
    transform: translate(0,3px);
  }

  16% {
    -webkit-transform: translate(0,-3px);
    -ms-transform: translate(0,-3px);
    transform: translate(0,-3px);
  }

  20% {
    -webkit-transform: translate(0,3px);
    -ms-transform: translate(0,3px);
    transform: translate(0,3px);
  }

  22% {
    -webkit-transform: translate(0,0);
    -ms-transform: translate(0,0);
    transform: translate(0,0);
  }
}

.faa-vertical.animated,
.faa-vertical.animated-hover:hover,
.faa-parent.animated-hover:hover > .faa-vertical {
  -webkit-animation: vertical 2s ease infinite;
  animation: vertical 2s ease infinite;
}

.faa-vertical.animated.faa-fast,
.faa-vertical.animated-hover.faa-fast:hover,
.faa-parent.animated-hover:hover > .faa-vertical.faa-fast {
  -webkit-animation: vertical 1s ease infinite;
  animation: vertical 1s ease infinite;
}

.faa-vertical.animated.faa-slow,
.faa-vertical.animated-hover.faa-slow:hover,
.faa-parent.animated-hover:hover > .faa-vertical.faa-slow {
  -webkit-animation: vertical 4s ease infinite;
  animation: vertical 4s ease infinite;
}

/* HORIZONTAL */

@-webkit-keyframes horizontal {
  0% {
    -webkit-transform: translate(0,0);
    transform: translate(0,0);
  }

  6% {
    -webkit-transform: translate(5px,0);
    transform: translate(5px,0);
  }

  12% {
    -webkit-transform: translate(0,0);
    transform: translate(0,0);
  }

  18% {
    -webkit-transform: translate(5px,0);
    transform: translate(5px,0);
  }

  24% {
    -webkit-transform: translate(0,0);
    transform: translate(0,0);
  }

  30% {
    -webkit-transform: translate(5px,0);
    transform: translate(5px,0);
  }

  36% {
    -webkit-transform: translate(0,0);
    transform: translate(0,0);
  }
}

@keyframes horizontal {
  0% {
    -webkit-transform: translate(0,0);
    -ms-transform: translate(0,0);
    transform: translate(0,0);
  }

  6% {
    -webkit-transform: translate(5px,0);
    -ms-transform: translate(5px,0);
    transform: translate(5px,0);
  }

  12% {
    -webkit-transform: translate(0,0);
    -ms-transform: translate(0,0);
    transform: translate(0,0);
  }

  18% {
    -webkit-transform: translate(5px,0);
    -ms-transform: translate(5px,0);
    transform: translate(5px,0);
  }

  24% {
    -webkit-transform: translate(0,0);
    -ms-transform: translate(0,0);
    transform: translate(0,0);
  }

  30% {
    -webkit-transform: translate(5px,0);
    -ms-transform: translate(5px,0);
    transform: translate(5px,0);
  }

  36% {
    -webkit-transform: translate(0,0);
    -ms-transform: translate(0,0);
    transform: translate(0,0);
  }
}

.faa-horizontal.animated,
.faa-horizontal.animated-hover:hover,
.faa-parent.animated-hover:hover > .faa-horizontal {
  -webkit-animation: horizontal 2s ease infinite;
  animation: horizontal 2s ease infinite;
}

.faa-horizontal.animated.faa-fast,
.faa-horizontal.animated-hover.faa-fast:hover,
.faa-parent.animated-hover:hover > .faa-horizontal.faa-fast {
  -webkit-animation: horizontal 1s ease infinite;
  animation: horizontal 1s ease infinite;
}

.faa-horizontal.animated.faa-slow,
.faa-horizontal.animated-hover.faa-slow:hover,
.faa-parent.animated-hover:hover > .faa-horizontal.faa-slow {
  -webkit-animation: horizontal 3s ease infinite;
  animation: horizontal 3s ease infinite;
}

/* FLASHING */

@-webkit-keyframes flash {
  0%, 100%, 50% {
    opacity: 1;
  }

  25%, 75% {
    opacity: 0;
  }
}

@keyframes flash {
  0%, 100%, 50% {
    opacity: 1;
  }

  25%, 75% {
    opacity: 0;
  }
}

.faa-flash.animated,
.faa-flash.animated-hover:hover,
.faa-parent.animated-hover:hover > .faa-flash {
  -webkit-animation: flash 2s ease infinite;
  animation: flash 2s ease infinite;
}

.faa-flash.animated.faa-fast,
.faa-flash.animated-hover.faa-fast:hover,
.faa-parent.animated-hover:hover > .faa-flash.faa-fast {
  -webkit-animation: flash 1s ease infinite;
  animation: flash 1s ease infinite;
}

.faa-flash.animated.faa-slow,
.faa-flash.animated-hover.faa-slow:hover,
.faa-parent.animated-hover:hover > .faa-flash.faa-slow {
  -webkit-animation: flash 3s ease infinite;
  animation: flash 3s ease infinite;
}

/* BOUNCE */

@-webkit-keyframes bounce {
  0%, 10%, 20%, 50%, 80% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  40% {
    -webkit-transform: translateY(-15px);
    transform: translateY(-15px);
  }

  60% {
    -webkit-transform: translateY(-15px);
    transform: translateY(-15px);
  }
}

@keyframes bounce {
  0%, 10%, 20%, 50%, 80% {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }

  40% {
    -webkit-transform: translateY(-15px);
    -ms-transform: translateY(-15px);
    transform: translateY(-15px);
  }

  60% {
    -webkit-transform: translateY(-15px);
    -ms-transform: translateY(-15px);
    transform: translateY(-15px);
  }
}

.faa-bounce.animated,
.faa-bounce.animated-hover:hover,
.faa-parent.animated-hover:hover > .faa-bounce {
  -webkit-animation: bounce 2s ease infinite;
  animation: bounce 2s ease infinite;
}

.faa-bounce.animated.faa-fast,
.faa-bounce.animated-hover.faa-fast:hover,
.faa-parent.animated-hover:hover > .faa-bounce.faa-fast {
  -webkit-animation: bounce 1s ease infinite;
  animation: bounce 1s ease infinite;
}

.faa-bounce.animated.faa-slow,
.faa-bounce.animated-hover.faa-slow:hover,
.faa-parent.animated-hover:hover > .faa-bounce.faa-slow {
  -webkit-animation: bounce 3s ease infinite;
  animation: bounce 3s ease infinite;
}

/* SPIN */

@-webkit-keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  100% {
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}

@keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  100% {
    -webkit-transform: rotate(359deg);
    -ms-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}

.faa-spin.animated,
.faa-spin.animated-hover:hover,
.faa-parent.animated-hover:hover > .faa-spin {
  -webkit-animation: spin 1.5s linear infinite;
  animation: spin 1.5s linear infinite;
}

.faa-spin.animated.faa-fast,
.faa-spin.animated-hover.faa-fast:hover,
.faa-parent.animated-hover:hover > .faa-spin.faa-fast {
  -webkit-animation: spin 0.7s linear infinite;
  animation: spin 0.7s linear infinite;
}

.faa-spin.animated.faa-slow,
.faa-spin.animated-hover.faa-slow:hover,
.faa-parent.animated-hover:hover > .faa-spin.faa-slow {
  -webkit-animation: spin 2.2s linear infinite;
  animation: spin 2.2s linear infinite;
}

/* FLOAT */

@-webkit-keyframes float {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  50% {
    -webkit-transform: translateY(-6px);
    transform: translateY(-6px);
  }

  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes float {
  0% {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }

  50% {
    -webkit-transform: translateY(-6px);
    -ms-transform: translateY(-6px);
    transform: translateY(-6px);
  }

  100% {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.faa-float.animated,
.faa-float.animated-hover:hover,
.faa-parent.animated-hover:hover > .faa-float {
  -webkit-animation: float 2s linear infinite;
  animation: float 2s linear infinite;
}

.faa-float.animated.faa-fast,
.faa-float.animated-hover.faa-fast:hover,
.faa-parent.animated-hover:hover > .faa-float.faa-fast {
  -webkit-animation: float 1s linear infinite;
  animation: float 1s linear infinite;
}

.faa-float.animated.faa-slow,
.faa-float.animated-hover.faa-slow:hover,
.faa-parent.animated-hover:hover > .faa-float.faa-slow {
  -webkit-animation: float 3s linear infinite;
  animation: float 3s linear infinite;
}

/* PULSE */

@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
  }

  50% {
    -webkit-transform: scale(0.8);
    transform: scale(0.8);
  }

  100% {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
  }

  50% {
    -webkit-transform: scale(0.8);
    -ms-transform: scale(0.8);
    transform: scale(0.8);
  }

  100% {
    -webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
  }
}

.faa-pulse.animated,
.faa-pulse.animated-hover:hover,
.faa-parent.animated-hover:hover > .faa-pulse {
  -webkit-animation: pulse 2s linear infinite;
  animation: pulse 2s linear infinite;
}

.faa-pulse.animated.faa-fast,
.faa-pulse.animated-hover.faa-fast:hover,
.faa-parent.animated-hover:hover > .faa-pulse.faa-fast {
  -webkit-animation: pulse 1s linear infinite;
  animation: pulse 1s linear infinite;
}

.faa-pulse.animated.faa-slow,
.faa-pulse.animated-hover.faa-slow:hover,
.faa-parent.animated-hover:hover > .faa-pulse.faa-slow {
  -webkit-animation: pulse 3s linear infinite;
  animation: pulse 3s linear infinite;
}

/* SHAKE */

.faa-shake.animated,
.faa-shake.animated-hover:hover,
.faa-parent.animated-hover:hover > .faa-shake {
  -webkit-animation: wrench 2.5s ease infinite;
  animation: wrench 2.5s ease infinite;
}

.faa-shake.animated.faa-fast,
.faa-shake.animated-hover.faa-fast:hover,
.faa-parent.animated-hover:hover > .faa-shake.faa-fast {
  -webkit-animation: wrench 1.2s ease infinite;
  animation: wrench 1.2s ease infinite;
}

.faa-shake.animated.faa-slow,
.faa-shake.animated-hover.faa-slow:hover,
.faa-parent.animated-hover:hover > .faa-shake.faa-slow {
  -webkit-animation: wrench 3.7s ease infinite;
  animation: wrench 3.7s ease infinite;
}

/* TADA */

@-webkit-keyframes tada {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }

  10%, 20% {
    -webkit-transform: scale(.9) rotate(-8deg);
    transform: scale(.9) rotate(-8deg);
  }

  30%, 50%, 70% {
    -webkit-transform: scale(1.3) rotate(8deg);
    transform: scale(1.3) rotate(8deg);
  }

  40%, 60% {
    -webkit-transform: scale(1.3) rotate(-8deg);
    transform: scale(1.3) rotate(-8deg);
  }

  80% {
    -webkit-transform: scale(1) rotate(0);
    transform: scale(1) rotate(0);
  }
}

@keyframes tada {
  0% {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
  }

  10%, 20% {
    -webkit-transform: scale(.9) rotate(-8deg);
    -ms-transform: scale(.9) rotate(-8deg);
    transform: scale(.9) rotate(-8deg);
  }

  30%, 50%, 70% {
    -webkit-transform: scale(1.3) rotate(8deg);
    -ms-transform: scale(1.3) rotate(8deg);
    transform: scale(1.3) rotate(8deg);
  }

  40%, 60% {
    -webkit-transform: scale(1.3) rotate(-8deg);
    -ms-transform: scale(1.3) rotate(-8deg);
    transform: scale(1.3) rotate(-8deg);
  }

  80% {
    -webkit-transform: scale(1) rotate(0);
    -ms-transform: scale(1) rotate(0);
    transform: scale(1) rotate(0);
  }
}

.faa-tada.animated,
.faa-tada.animated-hover:hover,
.faa-parent.animated-hover:hover > .faa-tada {
  -webkit-animation: tada 2s linear infinite;
  animation: tada 2s linear infinite;
}

.faa-tada.animated.faa-fast,
.faa-tada.animated-hover.faa-fast:hover,
.faa-parent.animated-hover:hover > .faa-tada.faa-fast {
  -webkit-animation: tada 1s linear infinite;
  animation: tada 1s linear infinite;
}

.faa-tada.animated.faa-slow,
.faa-tada.animated-hover.faa-slow:hover,
.faa-parent.animated-hover:hover > .faa-tada.faa-slow {
  -webkit-animation: tada 3s linear infinite;
  animation: tada 3s linear infinite;
}

/* PASSING */

@-webkit-keyframes passing {
  0% {
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    opacity: 0;
  }

  50% {
    -webkit-transform: translateX(0%);
    transform: translateX(0%);
    opacity: 1;
  }

  100% {
    -webkit-transform: translateX(50%);
    transform: translateX(50%);
    opacity: 0;
  }
}

@keyframes passing {
  0% {
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    opacity: 0;
  }

  50% {
    -webkit-transform: translateX(0%);
    -ms-transform: translateX(0%);
    transform: translateX(0%);
    opacity: 1;
  }

  100% {
    -webkit-transform: translateX(50%);
    -ms-transform: translateX(50%);
    transform: translateX(50%);
    opacity: 0;
  }
}

.faa-passing.animated,
.faa-passing.animated-hover:hover,
.faa-parent.animated-hover:hover > .faa-passing {
  -webkit-animation: passing 2s linear infinite;
  animation: passing 2s linear infinite;
}

.faa-passing.animated.faa-fast,
.faa-passing.animated-hover.faa-fast:hover,
.faa-parent.animated-hover:hover > .faa-passing.faa-fast {
  -webkit-animation: passing 1s linear infinite;
  animation: passing 1s linear infinite;
}

.faa-passing.animated.faa-slow,
.faa-passing.animated-hover.faa-slow:hover,
.faa-parent.animated-hover:hover > .faa-passing.faa-slow {
  -webkit-animation: passing 3s linear infinite;
  animation: passing 3s linear infinite;
}

/* WAVE */

@-webkit-keyframes burst {
  0% {
    opacity: .6;
  }

  50% {
    -webkit-transform: scale(1.8);
    transform: scale(1.8);
    opacity: 0;
  }

  100% {
    opacity: 0;
  }
}

@keyframes burst {
  0% {
    opacity: .6;
  }

  50% {
    -webkit-transform: scale(1.8);
    -ms-transform: scale(1.8);
    transform: scale(1.8);
    opacity: 0;
  }

  100% {
    opacity: 0;
  }
}

.faa-burst.animated,
.faa-burst.animated-hover:hover,
.faa-parent.animated-hover:hover > .faa-burst {
  -webkit-animation: burst 2s infinite linear;
  animation: burst 2s infinite linear;
}

.faa-burst.animated.faa-fast,
.faa-burst.animated-hover.faa-fast:hover,
.faa-parent.animated-hover:hover > .faa-burst.faa-fast {
  -webkit-animation: burst 1s infinite linear;
  animation: burst 1s infinite linear;
}

.faa-burst.animated.faa-slow,
.faa-burst.animated-hover.faa-slow:hover,
.faa-parent.animated-hover:hover > .faa-burst.faa-slow {
  -webkit-animation: burst 3s infinite linear;
  animation: burst 3s infinite linear;
}



/*=Checkbox Radio Style
===================================================================================================================*/
.checkbox {
  padding-left: 20px;
}
.checkbox label {
  display: inline-block;
  vertical-align: middle;
  position: relative;
  padding-left: 5px;
  /*cursor:default;*/
}
.checkbox label::before {
  content: "";
  display: inline-block;
  position: absolute;
  width: 17px;
  height: 17px;
  left: 0;
  margin-left: -20px;
  border: 1px solid #cccccc;
  border-radius: 3px;
  background-color: #fff;
  -webkit-transition: border 0.15s ease-in-out, color 0.15s ease-in-out;
  -o-transition: border 0.15s ease-in-out, color 0.15s ease-in-out;
  transition: border 0.15s ease-in-out, color 0.15s ease-in-out;
}
.checkbox label::after {
  display: inline-block;
  position: absolute;
  width: 16px;
  height: 16px;
  left: 0;
  top: 0;
  margin-left: -20px;
  padding-left: 3px;
  padding-top: 1px;
  font-size: 11px;
  color: #555555;
}
.checkbox input[type="checkbox"],
.checkbox input[type="radio"] {
  opacity: 0;
  z-index: 1;
}
.checkbox input[type="checkbox"]:focus + label::before,
.checkbox input[type="radio"]:focus + label::before {
  outline: thin dotted;
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px;
}
.checkbox input[type="checkbox"]:checked + label::after,
.checkbox input[type="radio"]:checked + label::after {
  font-family: "FontAwesome";
  content: "\f00c";
  line-height:1.5em !important;
}
.checkbox input[type="checkbox"]:disabled + label,
.checkbox input[type="radio"]:disabled + label {
  opacity: 0.65;
}
.checkbox input[type="checkbox"]:disabled + label::before,
.checkbox input[type="radio"]:disabled + label::before {
  background-color: #eeeeee;
  cursor: not-allowed;
}
.checkbox.checkbox-circle label::before {
  border-radius: 50%;
}
.checkbox.checkbox-inline {
  margin-top: 0;
}

.checkbox-primary input[type="checkbox"]:checked + label::before,
.checkbox-primary input[type="radio"]:checked + label::before {
  background-color: #337ab7;
  border-color: #337ab7;
}
.checkbox-primary input[type="checkbox"]:checked + label::after,
.checkbox-primary input[type="radio"]:checked + label::after {
  color: #fff;
}

.checkbox-danger input[type="checkbox"]:checked + label::before,
.checkbox-danger input[type="radio"]:checked + label::before {
  background-color: #d9534f;
  border-color: #d9534f;
}
.checkbox-danger input[type="checkbox"]:checked + label::after,
.checkbox-danger input[type="radio"]:checked + label::after {
  color: #fff;
}

.checkbox-info input[type="checkbox"]:checked + label::before,
.checkbox-info input[type="radio"]:checked + label::before {
  background-color: #5bc0de;
  border-color: #5bc0de;
}
.checkbox-info input[type="checkbox"]:checked + label::after,
.checkbox-info input[type="radio"]:checked + label::after {
  color: #fff;
}

.checkbox-warning input[type="checkbox"]:checked + label::before,
.checkbox-warning input[type="radio"]:checked + label::before {
  background-color: #f0ad4e;
  border-color: #f0ad4e;
}
.checkbox-warning input[type="checkbox"]:checked + label::after,
.checkbox-warning input[type="radio"]:checked + label::after {
  color: #fff;
}

.checkbox-success input[type="checkbox"]:checked + label::before,
.checkbox-success input[type="radio"]:checked + label::before {
  background-color: #5cb85c;
  border-color: #5cb85c;
}
.checkbox-success input[type="checkbox"]:checked + label::after,
.checkbox-success input[type="radio"]:checked + label::after {
  color: #fff;
}

.radio {
  padding-left: 20px;
}
.radio label {
  display: inline-block;
  vertical-align: middle;
  position: relative;
  padding-left: 5px;
}
.radio label::before {
  content: "";
  display: inline-block;
  position: absolute;
  width: 17px;
  height: 17px;
  left: 0;
  margin-left: -20px;
  border: 1px solid #cccccc;
  border-radius: 50%;
  background-color: #fff;
  -webkit-transition: border 0.15s ease-in-out;
  -o-transition: border 0.15s ease-in-out;
  transition: border 0.15s ease-in-out;
}
.radio label::after {
  display: inline-block;
  position: absolute;
  content: " ";
  width: 11px;
  height: 11px;
  left: 3px;
  top: 3px;
  margin-left: -20px;
  border-radius: 50%;
  background-color: #555555;
  -webkit-transform: scale(0, 0);
  -ms-transform: scale(0, 0);
  -o-transform: scale(0, 0);
  transform: scale(0, 0);
  -webkit-transition: -webkit-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33);
  -moz-transition: -moz-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33);
  -o-transition: -o-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33);
  transition: transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33);
}
.radio input[type="radio"] {
  opacity: 0;
  z-index: 1;
}
.radio input[type="radio"]:focus + label::before {
  outline: thin dotted;
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px;
}
.radio input[type="radio"]:checked + label::after {
  -webkit-transform: scale(1, 1);
  -ms-transform: scale(1, 1);
  -o-transform: scale(1, 1);
  transform: scale(1, 1);
}
.radio input[type="radio"]:disabled + label {
  opacity: 0.65;
}
.radio input[type="radio"]:disabled + label::before {
  cursor: not-allowed;
}
.radio.radio-inline {
  margin-top: 0;
}

.radio-primary input[type="radio"] + label::after {
  background-color: #337ab7;
}
.radio-primary input[type="radio"]:checked + label::before {
  border-color: #337ab7;
}
.radio-primary input[type="radio"]:checked + label::after {
  background-color: #337ab7;
}

.radio-danger input[type="radio"] + label::after {
  background-color: #d9534f;
}
.radio-danger input[type="radio"]:checked + label::before {
  border-color: #d9534f;
}
.radio-danger input[type="radio"]:checked + label::after {
  background-color: #d9534f;
}

.radio-info input[type="radio"] + label::after {
  background-color: #5bc0de;
}
.radio-info input[type="radio"]:checked + label::before {
  border-color: #5bc0de;
}
.radio-info input[type="radio"]:checked + label::after {
  background-color: #5bc0de;
}

.radio-warning input[type="radio"] + label::after {
  background-color: #f0ad4e;
}
.radio-warning input[type="radio"]:checked + label::before {
  border-color: #f0ad4e;
}
.radio-warning input[type="radio"]:checked + label::after {
  background-color: #f0ad4e;
}

.radio-success input[type="radio"] + label::after {
  background-color: #5cb85c;
}
.radio-success input[type="radio"]:checked + label::before {
  border-color: #5cb85c;
}
.radio-success input[type="radio"]:checked + label::after {
  background-color: #5cb85c;
}

input[type="checkbox"].styled:checked + label:after,
input[type="radio"].styled:checked + label:after {
  font-family: 'FontAwesome';
  content: "\f00c";
}
input[type="checkbox"] .styled:checked + label::before,
input[type="radio"] .styled:checked + label::before {
  color: #fff;
}
input[type="checkbox"] .styled:checked + label::after,
input[type="radio"] .styled:checked + label::after {
  color: #fff;
}


/*=
============================================================*/




/*==========  Media Query  ==========*/

	/* Custom, iPhone Retina */
	@media only screen and (min-width : 320px) {
		.header-logo{text-align:center;padding:0 0 10px 0;font-size:13px;}
		.header-logo #logo{display:inline-block}
		/*.header-logo #logo:hover{color:#95D7FF;text-decoration:none;}
		.site-slogan{letter-spacing:1px;color:#999;transition:all .6s;-webkit-transition:all .6s;}
		.stickey .header-logo #logo{font-size:2em;padding:15px 0 0 0;line-height:25px;}
		.stickey .site-slogan{font-size:0.7065em;}*/


	}

	/* Extra Small Devices, Phones */
	@media only screen and (min-width : 480px) {
		.ul-list{ text-align:center; margin:0 auto;}
		.ul-list li{display:inline-block;margin:0; text-align:center;}

		.title-data,.footer-data{ text-align:center; clear:both;}
		.title-data .title-left,.footer-data .title-left{ float:none;  margin:0 auto; padding:0px;}
		.title-data .title-right,.footer-data .title-right{ float:none; margin:0 auto; padding:0px; }

		#operation_id ul li div input.input_mid,#operation_id ul li div input.input-mid{ min-width:100%; }
		#operation_id ul li div input.input_long,#operation_id ul li div input.input-long{ min-width:100%; }

		.table tbody tr td input.input_mid,.table tbody tr td input.input-mid{ width:100%;}
	}

	/* iPhones Landscape */
	@media only screen and (min-width : 640px) {}

	/* Small Devices, Tablets */
	@media only screen and (min-width : 768px) {
		.table-data{ width:768px; }

		#operation_id ul li div input.input_long,#operation_id ul li div input.input-long{ min-width:100%; }
		#operation_id ul li div input.input_mid,#operation_id ul li div input.input-mid{ min-width:100%; }

		.table tbody tr td input.input_mid,.table tbody tr td input.input-mid{ width:100%;}

		.w-300{ width:100%; }

	}

	/* Medium Devices, Desktops */
	@media only screen and (min-width : 992px) {
		.header-logo{text-align:left;padding:0;font-size:14px;
		#operation_id ul li div input.input_long,#operation_id ul li div input.input-long{ min-width:600px; }

		.table tbody tr td input.input_mid,.table tbody tr td input.input-mid{ width:100%;}
	}
		.header-logo #logo{display:block}}

	/* Large Devices, Wide Screens */
	@media only screen and (min-width : 1200px) {}

	/* Very Large Devices, Wide Screens */
	@media only screen and (min-width : 1400px) {}



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

	}


	@media screen and (max-width:768px) {
		a.back-to-top span{ position:relative; top:-5px;}
	}