@charset "utf-8";
/* CSS Document */
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, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  display: block;
}
body {
  line-height: 1;
  background:#ccc;
  font-family:Arial, Helvetica, sans-serif;
}
ol, ul {
  list-style: none;
}
blockquote, q {
  quotes: none;
}
blockquote:before, blockquote:after, q:before, q:after {
  content: '';
  content: none;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
a:hover {
  text-decoration:none;
}
/* --------------------------Reset css End -------------------------*/

.maintop{display:inline-block;width:100%;position:relative;}
.extera {
  background: #fff none repeat scroll 0 0;
  border-radius: 5px;
  margin-bottom: 20px;
  position: relative;
}
.content_title {
	height: auto;
	width: 100%;
}
.content_title h3 {
  color: #fff;
  font-size: 18px;
  font-weight: bold;
  padding: 15px 5px;
  text-align: center;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#4c4c4c+0,000000+49,131313+100 */
background: rgb(76,76,76); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(76,76,76,1) 0%, rgba(0,0,0,1) 49%, rgba(19,19,19,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(76,76,76,1) 0%,rgba(0,0,0,1) 49%,rgba(19,19,19,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(76,76,76,1) 0%,rgba(0,0,0,1) 49%,rgba(19,19,19,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4c4c4c', endColorstr='#131313',GradientType=0 ); /* IE6-9 */

}
.content_img img {
	width:100%;
}
.content_img p {
  font-size: 16px;
  font-weight: 600;
  line-height: 30px;
  text-align: center;
}
.content_info h4 {
  background: #fff none repeat scroll 0 0;
  color: #135796;
  font-size: 18px;
  height: 40px;
  line-height: 20px;
  margin: 10px 5px;
  overflow: hidden;
  text-align: center;
}
.content_info p {
	color: #088a08;
	font-size: 16px;
	padding: 12px 5px;
	text-align: center;
}
.caption p {
	font-size: 20px;
	font-weight: bold;
	padding: 55% 2% 0;
}
.content_info > a {
  background: #135796 none repeat scroll 0 0;
  color: #fff;
  display: inline-block;
  margin: 0 auto;
  padding: 10px 0;
  position: relative;
  text-align: center;
  width: 100%;
}
.extera:hover .caption {
	display:block !important;
}
.cp-services-item2 .cp-caption::before {
	border-bottom: 1px solid #fff;
	border-top: 1px solid #fff;
	content: "";
	height: 91%;
	left: 13px;
	position: absolute;
	top: 15px;
	width: 0;
	z-index: -1;
}
.cp-services-item2:hover .cp-caption::before {
	width: 91%;
}
.cp-services-item2 .cp-caption .inner-holder {
	left: 0;
	padding: 20px 25px;
	position: absolute;
	right: 0;
	top: 30%;
}
.cp-services-item2 .cp-caption::after {
 border-left: 1px solid #fff;
 border-right: 1px solid #fff;
 content: "";
 height: 0;
 left: 13px;
 position: absolute;
 top: 15px;
 width: 91%;
 z-index: -1;
}
.cp-services-item2:hover .cp-caption::after {
 height: 91%;
}
.cp-services-item2 .cp-caption h3::after {
 border-bottom: 1px solid #fff;
 bottom: 0;
 content: "";
 left: 0;
 margin: 0 auto;
 position: absolute;
 right: 0;
 width: 70px;
}
.cp-services-item2 .cp-caption {
	height: 100%;
	left: 0;
	position: absolute;
	opacity:0;
	text-align: center;
	top: 0;
	width: 100%;
	z-index: 99;
}
.cp-services-item2:hover .cp-caption {
	background:rgba(0, 0, 0, 0.8);
	opacity:1;
}
.cp-services-item2:hover .cp-caption p, .cp-services-item2:hover .cp-caption h3 {
	opacity: 1;
	transform: translateY(0px);
}
.cp-services-item2 .cp-caption h3 {
	color: #fff;
	font-size: 24px;
	margin: 0 0 30px;
	padding-bottom: 15px;
	position: relative;
	transform: translateY(30px);
}
.cp-services-item2 .cp-caption h3 a {
	color: #fff;
}
.cp-navigation-row, .cp-nav-holder .navbar-nav li a, a, a.cp-btn-style1::before, a.cp-btn-style1::after, a.cp-btn-style2::before, a.cp-btn-style2::after, .btn-started::before, .cp-upcoming-box .caption, .cp-upcoming-box::before, .cp-nav-holder .navbar-nav li ul, .cp-nav-holder .navbar-nav > li ul li::before, .cp-thumb, .cp-thumb::before, .cp-thumb::after, .cp-thumb img, .cp-sports-box .caption .shop-title .fa, .cp-sports-box .caption, .cp-sports-box .caption strong, .cp-sports-box .caption strong, ul.cp_social-links li a, ul.cp_social-links li a::after, .cp-games-box .thumb .caption h3::after, .thumb .caption, .icon-holder .fa, .cp_search-bar .cp-inner-search-bar, .cp_meta-listed li, .cp-news-box .text-holder .btn-more::after, .cp-product-item .pro-listed li span, .cp-product-item .caption, .cp-product-item .pro-listed, .cp-product-item .thumb .caption .new, .cp-services-item .icon-holder, .cp-services-item .icon-holder .fa, .cp-team-box .thumb .caption h3::after, .cp-sale-item .caption, .cp-sale-item .caption, .cp-sale-item .caption::before, .cp-sale-item .caption::after, .cp_banner .owl-carousel .owl-controls .owl-nav div, .cp-sale-item > img, .cp-services-item .icon-holder .micon, .cp-services-item .text-holder h3, .cp_side-navigation li a, .cp-courses-box .thumb img, .cp-why-we-listed .cp-inner-holder .cp-text-holder::before, .cp-why-we-listed .cp-inner-holder .icon-holder, p, .icon-holder .fa, .cp-price-item, .cp-price-item::before, .icon-holder, .btn-more::after, .cp-classes-item .cp-top-holder::before, .cp_sidebar-box > ul > li, .cp_sidebar-box > ul > li::after, #cp_blog-slider .owl-controls .owl-nav div, .cp-flickr-side-listed li img, .cp-rotate-thumb img, .cp-form-box .inner-holder .btn-submit, .cp-form-box .inner-holder .btn-submit::after, .cp-event-item .cp-caption, .cp_meta-listed, .date-box, .cp-event-item img, .cp-caption::before, .cp-caption::after, .cp_gallery-item img, .cp-caption, .cp-caption h3, .cp-caption span, .cp-caption .cp-zoom .fa, .cp-caption .inner-holder, .cp-caption p, .cp-pro-banner-item img, .cp-caption .strong, .btn-submit, .cp-events-listing .panel-default > .panel-heading, .extera, .cp-caption {
 transition: all 0.3s ease-in-out 0s;
}



.fcImgli {
  box-shadow: 3px 3px 5px #454d5a;
  display: inline-block;width:100%;
  position: relative;margin-bottom:30px;
}
.fcImgli .tag-hot {
  background: rgba(0, 0, 0, 0) url("../img/tag_hot.png") no-repeat scroll 0 0;
  height: 93px;
  left: 0;
  position: absolute;
  top: 0;
  width: 93px;
  z-index: 100;
}
.fc-link {
  cursor: pointer;
  display: block;
  height: 100%;
  position: relative;
  text-decoration: none;
  width: 100%;color:#666;overflow: hidden;
}
.fc-bg, .fc-img-bt, .fc-info {
  left: 0;
  position: absolute;
  width: 100%;
}
.fcImgli .fc-img img {
  background-color: #ccc;
  display: block;width:100%;
}
.fc-bg {
  background: #000 none repeat scroll 0 0;
  bottom: 0;
  height: 36px;
  opacity: 0.6;transition: all 0.5s ease-in-out 0s;
  z-index: 2;
}
.fc-img-bt {
  bottom: 0;
  color: #f5f5f5;
  font-size: 12px;
  height: 36px;
  line-height: 36px;
  z-index: 3;
}
.fc-tg-icon {
  background-color: #29599b;
  color: #fff;
  display: inline-block;
  font-size: 12px;
  height: 16px;
  line-height: 16px;
  overflow: hidden;
  text-align: center;
  text-indent: 0;
  width: 100px;
}
.fc-img-bt .fc-tg-icon {
  left: 12px;
  position: absolute;
  top: 10px;
}
.fc-bt-right {
  margin: 0 10px 0 120px;
  overflow: hidden;
  position: relative;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.fc-info {
  bottom: 50%;
  color: #f5f5f5;
  font-size: 11px;
  height: 110px;
  line-height: 20px;
  margin: auto 50px -45px;
  opacity: 0;transition: all 0.5s ease-in-out 0s;
  position: absolute;
  z-index: 4;
}
.fc-info-tit {
  font-size: 12px;
  line-height: 22px;
  margin: 0 12px;
  max-height: 44px;
  overflow: hidden;
  text-indent: 41px;
  word-break: break-all;
}
.fc-info-tit .fc-tg-icon {
  left: 12px;
  position: absolute;
  text-indent: 0;
  top: 3px;
}
.fc-tit-txt {
  text-decoration: underline;margin-left:70px;
}
.fc-info-abs {
  display: block;
  line-height: 18px;
  margin: 9px 12px 5px;
  max-height: 36px;
  overflow: hidden;
  word-break: break-all;
}
.fc-info-host {
  color: #00a800;
  display: block;
  height: 22px;
  line-height: 22px;
  margin: 0 12px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.fc-logo {
  bottom: 20px;
  height: 50px;
  opacity: 0;
  position: absolute;
  right: 30px;
  width: 50px;
  z-index: 4;
}
.fc-logo img {
  height: 100%;
  width: 100%;
}
.fc-link:hover .fc-bg {
  height: 100%;
  opacity: 0.8;
}
.fc-link:hover .fc-img-bt {
  display: none;
}
.fc-link:hover .fc-info, .fc-link:hover .fc-logo {
  opacity: 1;
}
.footer {
  background: #000 none repeat scroll 0 0;
  color: #fff;
  float:left;text-align:center;
  margin-top: 30px;
  padding: 20px 0;
  width: 100%;
}
.footer p{font-size:14px;}


@media screen and (max-width:480px){
.fc-info-tit .fc-tg-icon {
  left: 65px;
  width: 70px;
}
.fc-info {
  margin: auto 0 -45px;
}
.fc-info-tit {
  margin: 0 35px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.fc-info-abs {margin: 9px 33px;}
.fc-info-host{margin:0 auto;}
}










.btn-default, .btn-default:hover, .btn-default:focus {
  background-color: #fff;
  border: 1px solid #fff;
  color: #333;
  text-shadow: none;
}
.inner {
    padding: 10px;display:inline-block;width:100%;
}
.masthead-brand {
    margin-bottom: 10px;color:#fff;font-size:20px;
    margin-top: 10px;
}
.masthead-nav > li {
  display: inline-block;
  float: left;
}
.masthead-nav li:last-child {margin-left:9px;}
.masthead-nav > li + li {
    margin-left: 20px;
}
.masthead-nav > li > a {
   border-bottom: 2px solid transparent;
   color: #fff;
   font-size: 16px;
   font-weight: bold;
   padding-left: 0;
   padding-right: 0;
}
.masthead-nav > li > a:last-child:hover{border:none !important;}
.masthead-nav > li > a:hover, .masthead-nav > li > a:focus {
   background-color: transparent;
   border-bottom-color: rgba(255, 255, 255, 0.25);
}
.masthead-nav > .active > a, .masthead-nav > .active > a:hover, .masthead-nav > .active > a:focus {
   border-bottom-color: #fff;
   color: #fff;
}
@media (min-width: 768px) {
.masthead-brand {
   float: left;
}
.masthead-nav {
   float: right;
}
}
.main-header {
  margin-bottom: 50px;
  /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#4c4c4c+0,000000+49,131313+100 */
background: rgb(76,76,76); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(76,76,76,1) 0%, rgba(0,0,0,1) 49%, rgba(19,19,19,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(76,76,76,1) 0%,rgba(0,0,0,1) 49%,rgba(19,19,19,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(76,76,76,1) 0%,rgba(0,0,0,1) 49%,rgba(19,19,19,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4c4c4c', endColorstr='#131313',GradientType=0 ); /* IE6-9 */

}
.masthead-brand > a {
  color: #fff;
}
.cp-caption > a {
  height: 100%;
  left: 0;
  position: absolute;
  width: 100%;
}

@media screen and (max-width:767px){
.inner{text-align:center !important;}	
.imghvr-zoom-out-flip-vert, .imghvr-zoom-out-flip-horiz, .imghvr-hinge-left, .imghvr-flip-diag-1 {width: 100%;}
}