/**
* Template Name: Unifit - Gym & Fitness HTML5 Template 
* Version: 1.0.1
* Author: Unicoder
* Email: unicoder16@gmail.com
* Developed By: Unicoder
* Created: 1st May, 2018 
* Last Update: 1st May, 2018
* Author URL: www.unicoderbd.com
**/

/*======================= 
Fonts and Files 
=========================*/
/*	
	Google Fonts Documentation link
	https://developers.google.com/fonts/docs/getting_started 	
*/

@import url('https://fonts.googleapis.com/css?family=Montserrat:300,400,400i,500,500i,600,600i,700');
@import url('https://fonts.googleapis.com/css?family=Anton:300,400,400i,500,500i,600,600i,700');

/*======================= 
Import CSS Files 
========================*/
@import url('animate.min.css');
@import url('jquery.fancybox.css');
@import url('owl.css');

/*===================================================
Table of CSS Content arrage with every section name
=====================================================

	01.1 Default css
	01.2 Default Hexagon css
	01.3 Default padding and margin
	02.1 Page Banner Section css
	03.1 Header Top Section css
	04.1 Header Bottom Section css
	05.1 slider Section css
	05.2 slider2 Section css
	06.1 Training Section css
	06.2 Training2 Section css
	07.1 Our Classes Section css
	07.2 Our Classes2 Section css
	07.3 All Classes Section css
	07.4 Single Class Section css
	07.5 Class Shedule Section css
	08.1 All Possible Section css
	09.1 Popular Programs Section css
	09.2 Popular Programs2 Section css
	10.1 Pricing Section css
	10.2 Pricing2 Section css
	11.1 Trainers Section css
	11.2 Trainers2 Section css
	11.3 All Trainers Section css
	11.4 Trainer Profile Section css
	12.1 Achievement Section css
	13.1 Shop Section css
	13.2 Products Section css
	13.3 Single Product Section css
	14.1 Latest Post Section css
	14.2 Latest Post2 Section css
	14.3 All Blog Section css
	14.4 Single Blog Section css
	15.1 Why Choose Us Section css
	16.1 About Company Section css
	17.1 Our Experience Section css
	18.1 Testimonials Section css
	19.1 Location Section css
	19.2 Contact info Section css
	20.1 Our Events Section css
	20.2 Event Details Section css
	21.1 All Gellery Section css
	22.1 Error Page Section css
	23.1 Newsletter Section css
	24.1 Footer Section css
	24.2 Footer2 Section css
	24.3 Footer Main Section css
	25.1 Copyright Section css
	25.2 Copyright2 Section css

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

/*====================================================================
01.1 Default css
====================================================================*/
body {
    font-family: 'Montserrat', sans-serif;
    font-size: 14px;
    color: #616161;
    font-weight: 400
}
p {
	margin: 0 0 15px;
	line-height: 26px
}
img {
	width: 100%
}
ul {
	margin: 0;
	padding: 0
}
li {
	list-style: none
}
button{
	background: none
}
.head-color{
	background-color: rgba(35, 42, 53, 0.9);
	margin: 35px 0px;
}
.full-row{
	width: 100%;
	position: relative;
}
.overflow-hidden {
	overflow: hidden;
	display: block
}
.text-area{
	padding: 15px 0
}
.flex-box{
	display:flex
}
.opening_hours li{
	line-height: 26px
}
.social_media li {
    margin-right: 5px;
    margin-bottom: 5px;
    display: block;
    float: left
}
.social_media li a {
	text-align: center;
	display:block
}
.social_media li i{
	line-height:36px;
	width: 36px;
	height: 36px
}
.media_dark li a {
	color: #fff
}
.flaticon-large [class^="flaticon-"]::before{
	font-size: 54px
}
.btn {
	font-family: 'Montserrat', sans-serif;
	display: inline-block;
	border: 2px solid transparent;
	line-height: 40px;
	padding: 0 25px;
	font-size: 14px;
	font-weight: 600;
	text-align: center;
	text-transform: uppercase
}
.btn-primary i, .btn-secondary i {
	margin-left: 10px
}
.btn_double .btn-primary {
	margin-right: 10px;
	float: left
}
.btn-link, .btn-link:hover, .btn-link:focus, .btn-link:active {
    border-color: transparent;
    font-weight: 500;
}
h1 {
	font-size: 42px
}
h2 {
	font-size: 36px
}
h3 {
	font-size: 30px
}
h4 {
	font-size: 24px
}
h5 {
	font-size: 18px;
	font-weight: 700;
	padding: 10px 0 15px 0;
	margin: 0;
}
h6 {
	font-size: 16px;
	font-weight: 600
}
h1, h2, h3, h4 {
	font-family: 'Anton', sans-serif;
	font-weight: 400;
	padding: 10px 0 15px 0;
	margin: 0;
	text-transform: uppercase
}
h6 {
	padding: 5px 0 10px 0;
	margin: 0;
	font-family: 'Montserrat', sans-serif;
	text-transform: uppercase
}
section{
	padding: 30px 0;
}
.paragraph{
	color: #fff;
	font-weight:400;
	letter-spacing:1px;

}
/*=== title ===*/
.section_title {
	width: 100%;
	padding-bottom: 30px
}
.title_center {
	margin: 0 auto;
	text-align: center;
}
.title_left {
	text-align: left;
}
.title_right {
	text-align: right
}
.box_title{
	width: 65%;
}
.title span {
	display: table;
	font-family: 'Montserrat', sans-serif;
	font-size: 16px;
	font-weight: 600
}

input[type="number"] {
    -moz-appearance: textfield;
}
.copy_right {
	font-size: 13px
}
.owl-theme .owl-controls {
	margin-top: 20px
}
/*======= border =======*/
button, .search-box input, 
.class_tab_menu li,
.single_product_quantity .quantity input,
.post_comment ul li:last-child,
.post_comment ul li:last-child ul.children li,
.product_category li:last-child,
.product_brand li:last-child{
	border: none
}
/*====================================================================
01.2 Default Hexagon css
====================================================================*/
.hexagon {
	width: 50px;
	height: 28.87px;
	margin: 14.43px 0;
	position: absolute;
	left: 0;
	top: 0;
	text-align: center
}
.hexagon [class^="flaticon-"]::before, 
.hexagon [class*=" flaticon-"]::before, 
.hexagon [class^="flaticon-"]::after, 
.hexagon [class*=" flaticon-"]::after {
	line-height: 28px
}
.hexagon:before, .hexagon:after {
	content: "";
	position: absolute;
	width: 0;
	border-left: 25px solid transparent;
	border-right: 25px solid transparent;
	left: inherit
}
.hexagon:before {
	bottom: 100%;
	border-bottom: 14.43px solid #EAC449;
}
.hexagon:after {
	top: 100%;
	width: 0;
	border-top: 14.43px solid #EAC449;
}
/*====================================================================
01.3 Default padding and margin
====================================================================*/
.no-padding{
	padding: 0
}
.padding30{
	padding: 30px
}
.padding15{
	padding: 15px
}
.padding20{
	padding: 20px
}
.padding_20{
	padding: 0 20px
}
.padding-15{
	padding: 15px 0
}
.padding-30{
	padding-top: 30px;
	padding-bottom: 30px
}
.padding-50{
	padding-top: 50px;
	padding-bottom: 50px
}
.padding-80{
	padding: 80px 0
}
.padding-30-15{
	padding: 30px 15px
}
.padding-bottom-15{
	padding-bottom: 15px
}
.padding-bottom-30{
	padding-bottom: 30px
}
.padding-left-70{
	padding-left: 70px
}
.margin-auto {
	display: table;
	margin: 0 auto
}
.no-margin{
	margin: 0
}
.margin-top-15{
	margin-top: 15px
}
.margin-top-50{
	margin-top: 50px
}
.margin-20{
	margin: 20px 0
}
.margin-15{
	margin: 15px 0
}
.margin-30{
	margin: 30px 0
}
.margin-right-20{
	margin-right: 20px
}
.margin-bottom-5{
	margin-bottom: 5px
}
.margin-bottom-30{
	margin-bottom: 30px
}
/*====================================================================
02.1 All Background Image Here
====================================================================*/
.background-1{
	background: rgba(0, 0, 0, 0) url("../images/woman/woman1.png") no-repeat scroll;
	background-position: left 22% bottom
}
.background-2{
	background: rgba(0, 0, 0, 0) url("../images/backg-2.jpg") no-repeat scroll 0 0 / cover
}
.background-3{
	background: rgba(0, 0, 0, 0) url("../images/awards.jpg") no-repeat fixed center center / cover
}
.background-4 {
	background: url(../images/bg/banner_bg.jpg) no-repeat fixed 0 0 / cover
}
.background-5 {
	background: url(../images/bg/footer_bg.jpg) no-repeat fixed 0 0 / cover
}
.background-6 {
	background: rgba(0, 0, 0, 0) url("../images/bg/woman1_bg.png") no-repeat scroll;
	background-position: right -5% top
}
.background-7 {
	background: rgba(0, 0, 0, 0) url("../images/bg/testimonial_bg.jpg") no-repeat fixed center center / cover
}
.background-8 {
	background: url(../images/bg/fitness-bg.jpg) no-repeat center center / cover
}
.background-9 {
	background: url(../images/bg/fitness-bg.jpg) no-repeat 0 0 / cover
}
.background-10 {
	background-image: url(../images/back_gym.png) no-repeat center right;
	background: #fff;
}
.overlay, .overlay-2{
	position: relative
}
.overlay:before, .overlay-2:before{
	position: absolute;
	width: 100%;
	content: "";
	top: 0;
	bottom: 0;
	left: 0
}
/*====================================================================
02.1 Page Banner Section css
====================================================================*/
#page_banner {
	position: relative;
	background: url(../images/bg/banner_bg.jpg) no-repeat;
	background-attachment: fixed;
	padding: 180px 0 70px
}
#page_banner:before {
	content: "";
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	background: rgba(11, 13, 29, .7)
}
.page_link ul, .page_banner_title {
	display: table-cell;
	height: 80px;
	vertical-align: middle
}
.page_link li {
	float: left;
	font-size: 13px;
	font-weight: 500;
	text-transform: uppercase
}
.page_link li i {
	padding: 0 10px
}
/*====================================================================
03.1 Header Top Section css
====================================================================*/
.header_top {
	padding: 15px 0;
	font-size: 13px
}
.top_header_phone i{
	margin-top: 2px
}
.top_header_phone span{
	margin-left: 10px
}
.portrait_liner {
	padding: 0 15px
}
.register_login li {
	padding-left: 20px
}
.free-signup li{
	padding: 16px 0 16px 18px
}
.free-signup li div{
	cursor: pointer
}
.register_login a {
	font-weight: 500
}
.or {
	font-family: 'Exo 2', sans-serif;
	font-weight: 600
}
.top_header_shopping_cart sup {
	font-weight: 500;
	font-size: 12px
}
.owl-nav i{
	line-height: 40px
}
.modal-dialog{
	width: 390px
}
.modal-dialog {
	top: 10%
}
/*====================================================================
04.1 Header Bottom Section css
====================================================================*/
.header {
	animation-fill-mode: both;
    left: 0;
    margin: 0;
    padding: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 999;
}
.navbar-toggle {
	margin-right: 0;
	margin-top: 12px
}
}
/*---- Header Fixed CSS ----*/
#header_bottom.bg-black{
	z-index:2
}
@keyframes menu_sticky {
0% {
    margin-top: -100px
}
50% {
    margin-top: -90px
}
100% {
    margin-top: 0
}
}
@keyframes menu_sticky {
0% {
    margin-top: -100px
}
50% {
    margin-top: -90px
}
100% {
    margin-top: 0
}
}
#header_bottom.fixed-header {
  box-shadow: 0 1px 8px 0 rgba(255, 255, 255, 0.2)
}
#header_bottom.fixed-header {
	animation-duration: 1s;
	animation-name: menu_sticky;
	animation-timing-function: ease-out;
	left: 0;
	margin: 0;
	position: fixed;
	top: 0;
	z-index: 99
}
#header_bottom.fixed-header .main-nav {
	width: 100%
}
#header_bottom.fixed-header .navbar-right {
	padding: 0
}
.navbar-brand img:nth-child(2) {
	display:none
}
#header_bottomr.fixed-header .navbar-brand img:nth-child(1) {
	display:none
}
#header_bottom.fixed-header .navbar-brand img:nth-child(2) {
	display:block
}
.navbar-brand {
	height: auto;
	padding-top: 16px
}
/*---- main nav CSS ----*/
.navbar-nav li a {
	font-weight: 500;
	text-transform: uppercase;
	font-size: 13px;
	padding: 30px 18px;
	display: block
}
.navbar-nav li:last-child a{
	padding-right: 0
}
.dropdown-menu {
	position: absolute;
	background: #fff;
	top: 100%;
	left: 0;
	z-index: 1000;
	float: left;
	min-width: 180px;
	font-size: 13px;
	text-align: left;
	list-style: none
}
.dropdown-menu ul {
	position: absolute;
	z-index: 1000;
	left: 100%;
	top: 100%;
	float: left;
	min-width: 200px;
	display: none;
	padding: 0;
	font-size: 14px;
	text-align: left;
	list-style: none
}
.navbar-nav .dropdown-menu > li > a{
  display: block;
  padding: 7px 20px;
  clear: both;
  font-weight: normal;
  line-height: 2;
  white-space: nowrap;
  font-weight: 500;
  text-transform:uppercase
}
.dropdown-menu > li > a {
	display: block;
	padding: 3px 20px;
	clear: both;
	font-weight: 500;
	line-height: 1.42857143;
	white-space: nowrap;
	text-transform:uppercase
}
.dropdown-menu > li > a:hover, 
.dropdown-menu > li > a:focus{
	color: #fff;
	text-decoration: none;
	outline: 0
}
/*-------annimation dropdown---------*/
.navbar-default .navbar-nav > .active > a, 
.navbar-default .navbar-nav > .active:hover > a, 
.navbar-default .navbar-nav > .active > a:focus {
	background-color: transparent;
	-moz-transition: all 300ms ease-in-out 0s;
	-ms-transition: all 300ms ease-in-out 0s;
	-o-transition: all 300ms ease-in-out 0s;
	-webkit-transition: all 300ms ease-in-out 0s;
	transition: all 300ms ease-in-out 0s
}
.navbar-default .navbar-nav li a,
.navbar-default .navbar-nav li ul.dropdown-menu {
	-moz-transition: all 300ms ease-in-out 0s;
	-ms-transition: all 300ms ease-in-out 0s;
	-o-transition: all 300ms ease-in-out 0s;
	-webkit-transition: all 300ms ease-in-out 0s;
	transition: all 300ms ease-in-out 0s
}
.navbar-default .navbar-nav li > ul.dropdown-menu {
	visibility: hidden;
	padding: 10px 0;
	opacity: 0;
	-ms-transform: scale(0.9);
	-o-transform: scale(0.9);
	-webkit-transform: scale(0.9);
	-moz-transform: scale(0.9);
	transform: scale(0.9)
}
.navbar-default .navbar-nav li:hover > ul.dropdown-menu {
	visibility: visible;
	opacity: 1
}
.navbar-nav .dropdown-menu ul {
	left: 100%;
	top:0
}
/*search option css*/
.hvr-src li a{
	line-height: 72px;
    padding-left: 10px
}
.search-form {
    height: 50px;
    position: absolute;
    width: 300px;
    z-index: 1;
    animation-name:slideInUp;
    animation-duration: 0.3s;
    animation-fill-mode: both;
    top: -200px;
    right: 0
}
.search-form.visible{
	animation-name:slideInDown;
	animation-duration:0.3s;
	animation-fill-mode: both;
	top:69px
}
.search-box input {
    width: 100%;
    line-height: 48px;
	outline: none
}
.search-box > .src-close {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    border: 2px solid;
    cursor: pointer;
    line-height: 12px;
    padding: 5px 7px;
    position: absolute;
    right: -6px;
    top: 23%;
    z-index: 999
}
/*====================================================================
05.1 slider Section css
====================================================================*/
#slider::before {
	bottom: -83px;
	content: "";
	height: 150px;
	left: 0;
	position: absolute;
	transform: skew(0deg, 8deg);
	width: 50%;
	z-index: 1
}
#slider::after {
	bottom: -83px;
	content: "";
	height: 150px;
	position: absolute;
	right: 0;
	transform: skew(0deg, -8deg);
	width: 50%;
	z-index: 1
}
.slider_caption {
	width: 560px;
	float: left
}
.slider_caption .thumb-title:after {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 150px;
	height: 3px;
	content: ""
}
.signup_form_trial {
	position: absolute;
	right: 5%;
	top: 50%;
	width: 360px;
	z-index: 1
}
.signup_form li:last-child, .send_meaasge_form li:last-child {
	display: table-cell;
	margin-bottom: 0
}
.signup_form textarea, .send_meaasge_form textarea {
	min-height: 80px;
	resize: none
}
.send_meaasge_form textarea {
	height: 150px
}
.signup_form .btn-secondary {
	float: left
}
/*====================================================================
05.2 slider2 Section css
====================================================================*/
#slider2::before {
	bottom: -415px;
	content: "";
	height: 475px;
	left: 0;
	position: absolute;
	transform: skew(0deg, -5deg);
	width: 100%;
	z-index: 1
}
#slider2 .carousel-indicators {
	left: 90%;
	top: 50%;
	transform: translateY(-50%)
}
#slider2 .carousel-indicators li {
	display: block;
	margin-bottom: 10px
}
/**/
.magnn{
	margin: 0px 0px 10px 0px;
}

/*====================================================================
4. Slider Animation css
====================================================================*/
.slider .carousel-caption h1 {
	-moz-animation-delay: 0.2s;
	-ms-animation-delay: 0.2s;
	-o-animation-delay: 0.2s;
	-webkit-animation-delay: 0.2s;
	animation-delay: 0.2s;
	-moz-animation-duration: 1s;
	-ms-animation-duration: 1s;
	-o-animation-duration: 1s;
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
	opacity: 0
}
.slider .carousel-caption p {
	-moz-animation-delay: 0.6s;
	-ms-animation-delay: 0.6s;
	-o-animation-delay: 0.6s;
	-webkit-animation-delay: 0.6s;
	animation-delay: 0.6s;
	-moz-animation-duration: 1s;
	-ms-animation-duration: 1s;
	-o-animation-duration: 1s;
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
	opacity: 0;
	font-size: 21px;
}
.slider .carousel-caption .btn_double {
	-moz-animation-delay: 1s;
	-ms-animation-delay: 1s;
	-o-animation-delay: 1s;
	-webkit-animation-delay: 1s;
	animation-delay: 1s;
	-moz-animation-duration: 1s;
	-ms-animation-duration: 1s;
	-o-animation-duration: 1s;
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
	opacity: 0
}
.carousel-caption li {
	opacity: 0;
	padding-bottom: 10px
}
.carousel-caption li:nth-child(1) {
	animation-delay: 1s;
	animation-duration: 1s
}
.carousel-caption li:nth-child(2) {
	animation-delay: 1.1s;
	animation-duration: 1s
}
.carousel-caption li:nth-child(3) {
	animation-delay: 1.2s;
	animation-duration: 1s
}
.carousel-caption .btn_double {
	animation-delay: 1.5s;
	animation-duration: 1s
}
.slider .item.active .carousel-caption p, 
.slider .item.active .carousel-caption .thumb-title, 
.slider .item.active .carousel-caption li:nth-child(1), 
.slider .item.active .carousel-caption li:nth-child(2), 
.slider .item.active .carousel-caption li:nth-child(3) {
	animation-name: fadeInUp
}
.slider .item.active .carousel-caption p, 
.slider .item.active .carousel-caption .thumb-title, 
.slider .item.active .carousel-caption li:nth-child(1), 
.slider .item.active .carousel-caption li:nth-child(2), 
.slider .item.active .carousel-caption li:nth-child(3) {
	animation-duration: 1s;
	animation-fill-mode: both;
	opacity: 1
}
.slider .item.active .carousel-caption .btn_double {
	animation-name: fadeInUp
}
.slider .item.active .carousel-caption .btn_double {
	animation-duration: 1s;
	animation-fill-mode: both;
	opacity: 1
}
/*====================================================================
06.2 Training2 Section css
====================================================================*/
.padding-bottom-80 {
	padding: 0 0 80px 0
}
.signup_form_trial2 {
	position: relative
}
.signup_form_trial2 .signup_form_trial {
	right: 0;
	transform: translate(0px, -120px);
	width: 100%;
	z-index: 1
}
.signup_form_trial2 .signup_trial_title h5 {
	font-size: 15px
}
.signup_form_trial2 .signup_trial_title {
	padding-top: 25px
}
.signup_form_trial2 .signup_form textarea {
	min-height: 175px
}
/*====================================================================
07.1 Our Classes Section css
====================================================================*/    
.class_item {
	height: 398px
}
.class_item_hover {
	bottom: -200px;
	height: 100%;
	left: 0;
	position: absolute;
	width: 100%;
	z-index: 1
}
.class_item_hover tr td {
	font-weight: 500;
	font-size: 13px;
	text-transform: uppercase;
	line-height: 26px
}
.class_item_hover tr td:first-child {
	float: left
}
.class_item_hover tr td:last-child {
	float: right
}
.class_item:hover .class_item_hover {
	opacity: 1;
	top: 0
}
.class-msg {
	visibility: hidden
}
.class_item:hover .class_item_hover .thumb-title {
	margin-bottom: 20px
}
.class_item:hover .class_item_hover .class-msg {
	visibility: visible
}

/*====================================================================
07.3 All Classes Section css
====================================================================*/
.filter-list .mix {
	display: none
}
.gallery-section .filters {
	font-family: 'Raleway', sans-serif
}
.gallery-section .filters li {
	cursor: pointer;
	display: inline-block;
	font-size: 24px;
	margin: 0 15px;
	padding: 10px 0;
	text-transform: uppercase;
	position: relative;
	font-family: 'Anton', sans-serif
}
/*====================================================================
07.4 Single Class Section css
====================================================================*/
.white_line::after {
	bottom: 0;
	content: "";
	height: 3px;
	left: 0;
	position: absolute;
	width: 30px
}
.class_pricing tr td {
	padding: 10px 0;
	font-weight: 500;
	font-size: 14px;
	vertical-align: middle
}
.class_pricing tr td:last-child {
	padding-left: 20px
}
.next_coming_event .title {
	font-weight: 700
}
.next_event_time{
	display: table
}
.next_event_time li {
	float: left;
	padding-right: 20px;
	text-align: center
}
.next_event_time li:last-child {
	padding-right: 0
}
.trainer_list .trainer_item{
	height: 345px
}
.trainer_list .trainer_item_hover{
	top: 245px
}
.class_tab_menu li {
	padding: 0
}
.class_tab_menu .nav.nav-tabs a {
	padding: 10px 25px;
	border-top: 2px solid transparent
}
.class_tab_menu h6{
	font-size: 14px;
	font-weight: 500
}
.day_class_details p:first-child {
	font-size: 14px;
	font-weight: 500
}
.day_class_details p:last-child ,
.vacancy a, .no_vacancy{
	font-size: 13px;
	padding: 0 10px
}
.vacancy a, .no_vacancy {
	display: block
}
/*======== Owl Carousel ========*/
.class_detail .owl-controls {
    position: absolute;
    z-index: 11;
    bottom: 40px;
    left: 50%;
    transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -o-transform: translateX(-50%);
}
.class_detail .owl-dots .owl-dot span {
	width: 5px;
	height: 5px
}
.class_detail .owl-dots .owl-dot.active span{
	position: relative
}
.class_detail .owl-dots .owl-dot.active span::before {
	position: absolute;
	content: "";
	width: 17px;
	height: 17px;
	border-radius: 50%;
	background: rgba(124, 185, 8, .30);
	left: -6px;
	top: -6px
}
/*====================================================================
07.5 Class Shedule Section css
====================================================================*/
.shedule_table td, .shedule_table th {
	padding: 15px;
	text-align: center;
	width: 12.5%
}
.shedule_table th{
	margin: 0;
	text-transform: uppercase;
	font-weight: 500
}
.shedule_table td span, .shedule_table th span {
	font-size: 13px;
	display: block
}
.shedule_table th span:nth-child(2){
	margin: 15px 0
}

/**/
.sect-back{
	background:#000;
}
/*====================================================================
09.1 Popular Programs Section css
====================================================================*/
.popular_programs {
	min-height: 95px;
	background-attachment: fixed
}
.popular_programs::before {
	content: "";
	height: 244px;
	left: 0;
	position: absolute;
	top: -93px;
	transform: skew(0deg, 9deg);
	width: 50.1%;
	z-index: 1
}
.popular_programs::after {
	content: "";
	height: 244px;
	position: absolute;
	right: 0;
	top: -93px;
	transform: skew(0deg, -9deg);
	width: 50%;
	z-index: 1
}
.popular_programs .section_title {
	position: absolute;
	width: 100%;
	z-index: 2
}
.popular_program_items {
	display: inline-block;
	margin-top: 210px;
	padding: 150px 0 80px;
	position: relative
}
.popular_program_for {
	position: absolute;
	top: 220px;
	left: 50%
}
.popular_program_for .thumb-title {
	float: left;
	margin-right: 100px;
	width: 150px
}
.popular_program_for .thumb-title:last-child {
	margin-right: 0
}
.per_program_item {
	display: inline-block;
	padding: 35px 0;
	width: 100%;
	position: relative
}
.program_item_info {
	width: 510px
}
.per_program_item:nth-child(odd) .program_item_info {
	float: left;
	text-align: right
}
.per_program_item:nth-child(even) .program_item_info {
	float: right;
	text-align: left
}
.program_item_info .program_type {
	font-size: 16px;
	font-weight: 700;
	position: absolute;
	top: -30px
}
.program_item_info .thumb-title{
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
	width: 100%
}
.per_program_item:nth-child(odd) .program_item_info .program_type {
	right: 0
}
.per_program_item:nth-child(even) .program_item_info .program_type {
	left: 0
}
.about_program_item {
	width: 250px
}
.per_program_item:nth-child(odd) .about_program_item {
	float: left
}
.per_program_item:nth-child(even) .about_program_item {
	float: right
}
.per_program_item::after {
	content: "";
	height: 100%;
	position: absolute;
	width: 1px;
	left: 50%;
	transform: translateX(-1px);
	-ms-transform: translateX(-1px);
	-moz-transform: translateX(-1px);
	-webkit-transform: translateX(-1px);
	-o-transform: translateX(-1px)
}
.per_program_item:nth-child(odd) .about_program_item::after {
	bottom: -229px;
	left: 58px
}
.per_program_item:nth-child(even) .about_program_item::after {
	left: 187px;
	top: 57px
}
.per_program_item:first-child .about_program_item::before {
	content: "";
	height: 200px;
	left: 57px;
	position: absolute;
	top: -195px;
	width: 1px
}
.about_program_item .hexagon {
	position: absolute;
	z-index: 10
}
.per_program_item:nth-child(odd) .about_program_item .hexagon {
	left: 33px;
	top: 0
}
.per_program_item:nth-child(even) .about_program_item .hexagon {
	left: 163px
}
.about_program_item .hexagon:before, .about_program_item .hexagon:after {
	left: 0
}
.about_program_item .monthly_price {
	font-size: 26px;
	font-weight: 700
}
.per_program_item:nth-child(odd) .about_program_item .monthly_price {
	float: right
}
.per_program_item:nth-child(even) .about_program_item .monthly_price {
	float: left
}
.program_item_info::after {
	border-bottom: 20px solid transparent;
	border-top: 20px solid transparent;
	content: "";
	height: 0;
	position: absolute;
	top: 10px;
	width: 0
}
.per_program_item:nth-child(odd) .program_item_info::after {
	border-left: 20px solid #EAC449;
	right: -20px
}
.per_program_item:nth-child(even) .program_item_info::after {
	border-right: 20px solid #EAC449;
	left: -20px
}
.course-fees {
	font-weight: 700;
	font-size: 16px
}
/*====================================================================
09.2 Popular Programs2 Section css
====================================================================*/
#popular_programs2 .popular_program_items {
	margin-top: 0;
	padding-top: 0;
	width: 100%
}
#popular_programs2 .program_item_info .program_type {
	position: static
}
.popular_program_for2 .title, #popular_programs2 .per_program_item:nth-child(even) .btn-link,
#popular_programs2 .per_program_item:nth-child(even) .program_item_info .thumb-title {
	float: left
}
.popular_program_for2 .title:last-child,
#popular_programs2 .program_item_info .thumb-title,
#popular_programs2 .per_program_item .btn-link {
	float: right
}
#popular_programs2 .per_program_item:nth-child(odd) .program_item_info::after, 
#popular_programs2 .per_program_item:nth-child(even) .program_item_info::after {
	display: none
}
#popular_programs2 .per_program_item:nth-child(odd) .program_item_info::before, 
#popular_programs2 .per_program_item:nth-child(even) .program_item_info::before {
	content: "";
	height: 430px;
	position: absolute;
	top: -70px;
	width: 2px
}
#popular_programs2 .per_program_item:nth-child(odd) .program_item_info::before {
	right: -1px
}
#popular_programs2 .per_program_item:nth-child(even) .program_item_info::before {
	left: -1px
}
#popular_programs2 .program_item_info {
	width: 50%;
	display: inline-block
}
#popular_programs2 .per_program_item:first-child .about_program_item::before {
	height: 60px;
	left: -1px;
	top: -60px
}
#popular_programs2 .per_program_item:nth-child(odd) .about_program_item::after {
	left: -1px;
	bottom: -220px;
	height: 120px
}
#popular_programs2 .per_program_item:nth-child(even) .about_program_item::after {
	height: 100px;
	left: 150px;
	top: 185px
}
#popular_programs2 .about_program_item {
	width: 150px;
	text-align: center;
	padding: 20px;
	display: none
}
/*====================================================================
10.1 Pricing Section css
====================================================================*/
.pricing_item .duration, .pricing_item .price {
	font-weight: 700;
	text-transform: uppercase;
	color: #fff;
}
.pricing_item .price {
	font-size: 21px
}
.pricing_item .price sup {
	font-size: 12px;
	font-weight: 700
}
.pricing_info li {
	margin-bottom: 15px;
	color: #fff;
}
.pricing_info li:last-child {
	margin-bottom: 0
}
/*====================================================================
11.1 Trainers Section css
====================================================================*/
.trainer_name {
	font-size: 16px;
	font-weight: 700;
	margin-bottom: 5px;
	text-transform: uppercase
}
.trainer_title {
	font-weight: 500
}
.trainer_item {
	padding-bottom: 100px
}
.trainer_item_hover {
  left: 0;
  padding: 20px 20px 50px;
  position: absolute;
  top: 275px;
  width: 100%;
  z-index: 1
}
.trainer_item_hover::after {
	content: "";
	height: 130px;
	left: 0;
	position: absolute;
	top: -27px;
	transform: rotate(-9deg);
	width: 130%;
	z-index: -1
}
.trainer_item_hover p{
	margin: 30px 0
}
.trainer_item:hover .trainer_item_hover{
	padding: 47px 20px
}
.trainer_item:hover .trainer_item_hover{
	top: 0;
	bottom:0
}
.social_media.trainer_social_media {
	margin: 0 auto;
	display: table
}
/*====================================================================
11.2 Trainers2 Section css
====================================================================*/
#trainers2 .trainer_item_hover::after {
	display: none
}
#trainers2 .text {
	padding-top: 30px
}
/*====================================================================
11.4 Trainer Profile Section css
====================================================================*/
.about_trainer_info{
	border-bottom: 1px solid #a2a2a2;
	display: block
}
.about_trainer_info tr td {
	padding-bottom: 10px;
	font-weight: 500;
	font-size: 14px
}
.about_trainer_info tr td:last-child {
	padding-left: 30px
}
.trainer_profile_acquire li {
	float: left;
	text-align: left;
	width: 25%
}
.trainer_profile_acquire [class^="flaticon-"]::before {
	font-size: 28px
}
.trainer_profile_media li {
	margin-right: 5px
}
/*====================================================================
13.1 Shop Section css
====================================================================*/
.btn_cart {
	font-family: 'Montserrat', sans-serif;
	display: inline-block;
	border: 2px solid transparent;
	line-height: 35px;
	padding: 0 20px;
	font-size: 14px;
	font-weight: 500;
	text-align: center;
	text-transform: uppercase;
}
.popular_product_item,
.popular_product_info {
	display: table;
	margin-bottom: 10px
}
.popular_product_img {
	width: 60px;
	float: left
}
.product_title {
	font-size: 14px;
	white-space: nowrap;
	width: 100%;
	overflow: hidden;
	text-overflow: ellipsis
}
.popular_product_title,
.widget_popular_product .price_value{
	font-size: 13px;
	font-weight: 500
}
.price_value del, .popular_product_img,
.product_show_per_page label {
	margin-right: 10px
}
.product_show_per_page {
	padding: 5px 20px
}
.product_show_per_page select option {
	font-size: 13px;
	font-weight: 400
}
#slider-range, .price_range_amount{
	margin: 10px 0
}
.price_range_amount .thumb-title {
	font-size: 14px;
	width: 30%;
	float: left
}
#amount {
	width: 55%;
	margin: 10px 0;
	text-align: center;
	font-size: 13px;
	border: none;
	padding: 5px 0
}
.woocommerce ul.cart_list li img, 
.woocommerce ul.product_list_widget li img {
    float: left;
    margin-left: 0;
    width: 60px;
    margin-right: 10px;
    margin-top: 0;
}
.widget.woocommerce ul.product_list_widget li a{
	display: block
}
.widget.woocommerce ul.product_list_widget li .stars {
	margin: 0 0 5px 65px
}
.widget.woocommerce ul.product_list_widget li del span,
.widget.woocommerce ul.product_list_widget li ins span,
.widget.woocommerce ul.product_list_widget li span{
	color: #5a5a5a
}
.owl-theme .owl-dots .owl-dot span {
    background: #f2f2f2;
    border-radius: 50%;
    display: inline-block;
    height: 12px;
    margin: 20px 5px 0;
    width: 12px;
}
/*===================== 
8.	Popular Question Section 
======================*/
.according_title {
  cursor: pointer;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap
}
.according_details.active{
	display: block
}
.according_details {
	display: none
}
.according_details li {
	padding: 0 15px
}
.product_category li a,
.product_brand li a{
	padding: 10px 0;
	display: block
}
.stars {
	margin: 7px 0;
	font-size: 12px
}
.product_name a, .amount {
	font-weight: 500;
	text-transform: capitalize
}
.product_brand li a span:last-child {
	float: right
}
/*====================================================================
13.3 Single Product Section css
====================================================================*/
.product_tab_menu .nav-tabs {
	position: absolute;
	left: 0;
	top: 0
}
.product_tab_menu ul li {
	float: none;
	display: table;
	padding: 0
}
.product_tab_menu .nav-tabs li a {
	margin-bottom: 3px;
	width: 170px;
	line-height: 44px;
	font-weight: 500
}
.product_tab_menu .nav-tabs > li.active > a {
	border-top: none;
	border-right: none;
	width: 174px;
	margin-right: 0
}
.product_tab_menu .tab-content {
	margin-left: 173px
}
.product_quality {
	counter-reset: item
}
.product_quality li {
	margin-bottom: 15px
}
.product_quality li:before {
  content: counters(item, ".")". ";
  counter-increment: item;
  margin-right: 5px
}
.product_quality li:last-child {
	margin-bottom: 0
}
.single_product_categories label, 
.single_product_stock label, 
.single_product_quantity .quantity label {
	font-weight: 500;
	margin-right: 10px
}
.woocommerce-product-rating {
	margin-bottom: 15px
}
.single_product_quantity .quantity {
	position: relative
}
.single_product_quantity .quantity input {
	line-height: 44px;
	width: 70px
}
.single_product_quantity .quantity .plus, 
.single_product_quantity .quantity .minus {
	position: absolute;
	right: 10px
}
.single_product_quantity .quantity .plus {
	top: 5px
}
.single_product_quantity .quantity .minus {
	bottom: 5px
}
/***====================================================================
38.	Cart
====================================================================***/
.cart_form_main tr img{
	width: 60px
}
.cart_form_main tr td, .cart_form_main tr th{
	padding: 15px
}
.cart_page select{
	padding:12px 20px;
	width:100%
}
.quantity-nav {
	float: right;
	position: relative;
	height: 42px;
}
.quantity-button {
	cursor: pointer;
	line-height: 20px;
	transform: translateX(-100%);
	width: 20px;
}
.quantity-button.quantity-up {
	position: absolute;
	height: 50%;
	top: 0;
}
.quantity-button.quantity-down {
	position: absolute;
	bottom: -1px;
	height: 50%;
}
.cart_page .cupon input[type="text"]{
	width:200px
}
.cart_page .calculating_amount{
	margin-top:50px
}
.cart_total td{
	border:1px solid #ecefe7;
	padding:15px 30px
}
.cart_page a.checkout{
	margin-top:20px
}
/*====================================================================
14.1 Latest Post Section css
====================================================================*/
.post_info {
	z-index: 1
}
.post_date {
	font-size: 13px;
	font-weight: 500;
	position: absolute;
	right: 20px;
	top: -15px
}
.post_title {
	white-space: nowrap;
    text-overflow: ellipsis;
    width: 100%;
    overflow: hidden;
    padding: 5px 0
}
.post_status {
	display: inline-block;
	padding-bottom: 20px
}
.post_info li, .post_status li {
    margin-right: 15px;
    font-size: 13px;
    display: inline-block;
}
.post_info li:last-child {
	margin-right: 0
}
.post_status li i {
	margin-right: 5px
}
.post_info::after {
	content: "";
	height: 200px;
	left: 0;
	position: absolute;
	top: -25px;
	transform: rotate(-6deg);
	width: 130%;
	z-index: -1
}
/*====================================================================
14.2 Latest Post2 Section css
====================================================================*/
#latest_post2 .post_info::after {
	display: none
}
#latest_post2 .post_date {
	display: table;
	left: 0;
	padding: 5px 10px;
	top: 30px
}
/*====================================================================
14.3 All Blog Section css
====================================================================*/
.submit_btn {
	position: absolute;
	right: 0;
	top: 0
}
.submit_btn button {
	padding: 14px
}
.categories ul li {
	border-bottom: 1px solid #5a5a5a;
	padding: 5px 0;
	margin-bottom: 10px
}
.categories ul li:last-child {
	margin-bottom: 0
}
.widget.category_item ul li {
	padding-bottom: 10px
}
.widget.category_item ul li span {
	color: inherit
}
.widget.category_item ul li a {
	color: #fff;
	display: inline-block;
	width: 100%;
	font-weight: 500
}
.blog_tag {
	display: inline-block;
	width: 100%
}
.widget ul li a {
	display: inline-block;
	width: 100%;
	padding: 5px 0 5px 0;
	font-weight: 500
}
.widget ul li {
	padding: 0 0 15px 0
}
.widget ul li span{
	padding-right: 5px;
	font-size: 13px
}
.blog_tag li a {
	font-size: 13px
}
.blog_tag li {
	float: left;
	margin: 0 5px 5px 0
}
.blog_tag li a {
	padding: 0 10px;
    text-transform: uppercase;
    font-weight: 500;
    line-height: 32px;
    display: block
}
.margin-bottom-50{
	margin-bottom: 50px
}
.margin-bottom-20 {
	margin-bottom: 20px
}
/*====================================================================
14.4 Single Blog Section css
====================================================================*/
.single_post_img {
	overflow: hidden
}
.single_post_img::after {
	content: "";
	height: 200px;
	left: 0;
	position: absolute;
	bottom: -150px;
	transform: rotate(-6deg);
	width: 130%
}
.single_post_date {
	font-size: 16px;
	position: absolute;
	right: 20px;
	top: -40px
}
.single_post_info li, .comment_info .replay a
.comment_info .comment_time {
	font-size: 13px
}
.single_post_info li:last-child {
	margin-right: 0
}
.single_post_info blockquote,
.single_post_date, .single_blog_media .share_name {
	font-weight: 500
}
.share_name{
	margin: 0 10px 0 0;
	line-height: 35px
}
.post_comment ul li {
	padding: 20px 0;
	border-bottom: 1px solid #f5f5f5;
	display: inline-block
}
.avatar {
	width: 70px;
	float: left
}
.comment_info {
	margin-left: 85px
}
.comment_info .title {
	text-transform: inherit;
	font-weight: 700;
	padding-top: 0
}
.comment_time {
	font-size: 13px;
	color: #a5a5a5;
	padding-bottom: 15px
}
.post_comment ul.children {
	padding-left: 50px
}
.post_comment ul.children li{
	border-bottom: 1px solid #f5f5f5;
}
.post_comment ul.children li:last-child{
	border-bottom: none;
	padding-bottom: 0
}
.post_comment ul.children li:first-child{
	padding-top: 0
}
.comment_form textarea {
	height: 180px
}
.blog-content blockquote {
	padding-left: 60px;
	font-style: italic
}
.blog-content blockquote sup{
	margin-left: 10px;
	margin-right: 10px
}
.single_blog_media {
    display: inline-block;
    width: 100%
}
.widget_title {
	padding-top: 10px;
	padding-bottom: 20px;
	margin: 0
}
/*====================================================================
15.1 Why Choose Us Section css
====================================================================*/
.list_style_one li {
	font-weight: 600;
    padding: 10px 0;
    list-style-type: square;
    list-style-position: inside;
}
/*====================================================================
16.1 About Company Section css
====================================================================*/
.play_video {
	position: absolute;
	left: 50%;
	top: 50%
}
.play_video span {
	font-weight: 600
}
.company_info {
	padding: 60px
}
/*====================================================================
17.1 Our Experience Section css
====================================================================*/
/*progress bar css start*/
.prfl-progress .progress {
  margin: 5px 0 30px
}
.skill-percent{
	position:absolute;
    right: 0;
    top: -25px;
	text-align:right
}
.skill-percent .count-num{
	display:initial;
	font-size: 14px
}
.progress {
	height: 15px;
	overflow: visible;
	position: relative 
}
.progress-bar{
	width:0%;
	height: 15px;
	transition: all 3000ms ease
}
.progress span {
  display: inline-block;
  margin-bottom: 7px;
  padding-left: 0;
  width: 100%
}
/*progress bar css end*/
.get_certificate .title_up {
	font-family: 'Anton', sans-serif
}
/*====================================================================
18.1 Testimonials Section css
====================================================================*/
.testimonial_item {
	padding: 80px 40px 40px;
}
.our_client .testimonial_item img {
	position: absolute;
	width: 100px;
	left: 50%;
	top: -50px;
	transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	-o-transform: translateX(-50%);
	-webkit-transform: translateX(-50%)
}
/*====================================================================
19.2 Contact Section css
====================================================================*/
#map, .send_meaasge {
	height: 600px
}
.contact_item .icon i{
	font-size: 20px;
	line-height: 60px;
	width: 60px;
	float: left
}
.contact_info span {
	display: block
}
label.error,
.error-handel {
	font-weight: 300;
	color: #fff;
	font-size: 13px
}
.error-handel {
	padding-top: 10px
}
#success,
#error {
	display: none
}
/*====================================================================
20.1 Our Events Section css
====================================================================*/
.event_item {
	margin-bottom: 50px;
}
.event_time_date {
	bottom: 0;
	position: absolute;
	width: 100%;
	left: 0
}
.event_time_date ul {
	display: table;
	margin: 0 auto;
}
.event_time_date ul li {
	font-family: 'Anton', sans-serif;
	font-size: 21px
}
.event_time_date ul li span i {
	font-size: 14px
}
.next_coming_event .event_time_date {
	position: static
}
.next_coming_event .event_time_date .time-count {
	position: static
}
.next_coming_event .event_time_date .time-count span{
	background: transparent;
	color: #fff;
	padding-top: 0;
	padding-bottom: 0
}
/*====================================================================
20.2 Event Details Section css
====================================================================*/
.single_event_location {
	width: 100%;
	line-height: 28px
}
.single_event_location span i,
.query_part a i, .query_part a i{
	padding-right: 7px
}
.single_event_img .date {
	left: 20px;
	position: absolute;
	top: 20px
}
.single_event_img .date span {
	font-size: 36px;
	font-weight: 700
}
.single_event_schdule li {
	display: inline-block;
	width: 100%;
	margin-bottom: 20px
}
.single_event_schdule li:last-child {
	margin-bottom: 0
}
.single_event_schdule .time span {
	font-weight: 700;
	text-transform: uppercase;
	display: block
}
.single_event_schdule .time span:nth-child(2){
	margin: 10px 0
}
.single_event_schdule .shedule_info {
	margin-left: 125px;
    min-height: 114px
}
.single_event_schdule .shedule_info .title {
	font-weight: 700;
    margin-bottom: 10px;
    padding: 0
}
.single_event_schdule .shedule_info p {
	margin: 0
}
.time-count {
	position: absolute;
	text-align: center;
	width: 100%;
	left: 0;
	bottom: 80px;
	z-index: 9
}
.time-count span {
	display: inline-block;
	padding: 15px;
	margin-right: 5px;
	width: 60px
}
.time-count span:last-child {
	margin: 0
}
.time-count span i {
	font-style: normal
}

/*=================================================
20.3 right sidebar of events details page css
===================================================*/
.timing, 
.register_form .radio_type {
	display: inline-block;
	width: 100%
}
.timing li span {
	margin-right: 10px;
	text-align: center;
	display: inline-block;
	padding: 15px
}
.timing li span i {
	font-style: normal;
	font-size: 16px
}
.timing li:last-child {
	margin-right: 0
}
.timing li span {
	font-size: 21px;
	font-family: 'Anton', sans-serif
}
.radio_type label {
	font-weight: 400
}
.register_form textarea {
	height: 150px
}
.timing .time-count {
	position: relative;
	bottom: 0px
}
/*====================================================================
21.1 All Gellery Section css
====================================================================*/
.default-portfolio-item .inner-box {
	position: relative
}
.default-portfolio-item .overlay-box {
	position: absolute;
	bottom: 0px;
	top: 0px;
	width: 100%
}
.overlay-box [class^="flaticon-"]::before{
	font-size: 45px;
	position: absolute;
	top: 50%;
	left: 50%;
	cursor: pointer
}
/*====================================================================
22.1 Error Page Section css
====================================================================*/
.page-error {
	font-size: 70px;
	font-family: 'Anton', sans-serif
}
.not_found {
	font-family: "Anton", sans-serif;
	font-size: 40px;
	padding: 10px 0 20px
}
/*====================================================================
23.1 Newsletter Section css    24.1 Footer Section css
====================================================================*/
#newsletter {
	position: absolute;
	width: 100%;
	z-index: 1;
	top: -55px
}
.newsletter {
	padding: 35px 40px
}
.newsletter_info .join {
	font-weight: 500
}
.newsletter_info .thumb-title {
	font-weight: 700;
	font-size: 24px
}
.newsletter_form input {
	width: 73%;
	float: left
}
/*====================================================================
24.3 Footer Main Section css
====================================================================*/
.footer{
	font-size: 13px
}
.footer-widget {
	padding-bottom: 30px
}
.footer .title {
    line-height: 26px;
    font-size: 14px;
	padding: 0
}
.footer_widgets_title, .footer_logo {
	height: 50px;
    line-height: 23px;
    margin: 0;
    padding: 0
}
.footer_social_media li a {
	display: block
}
.footer_logo img {
	width: auto
}
.upcomming_event li {
	display: flex
}
.latest_tweets li i,
.contact_info li i {
    width: 20px;
    line-height: 26px;
    text-align: left;
    float: left;
}
.tweets_time,
.latest_tweets li a div,
.contact_info li div {
	margin-left: 25px
}
.upcomming_event_img{
	margin: 1px 10px 0 0
}
.upcomming_event li a img{
	margin: 5px 0
}
.latest_tweets li {
	margin-bottom: 20px;
	line-height: 26px
}
.tweets_time {
	font-size: 12px;
	line-height: 26px
}
.upcomming_event li{
	padding-bottom: 10px
}
.opening_hours .title {
	padding: 10px 0 0
}
/*====================================================================
24.3 Sign Up Page css
====================================================================*/
.modal-body {
	padding: 30px
}
.toggle_area{
	width: 450px;
	margin: 0 auto
}
.radio_option > label{
  padding-right:20px;
  padding-left:5px
}
.modal-body .sign-in a{
	margin-left: 7px
}
.modal-footer > span{
	font-size:13px
}


/*Video Background*/
video { 
    position: fixed;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    z-index: -100;
    transform: translateX(-50%) translateY(-50%);
    background: url('//demosthenes.info/assets/images/polina.jpg') no-repeat;
  background-size: cover;
  transition: 1s opacity;
}
.stopfade { 
   opacity: .5;
}

/*Media screen css*/
@media only screen and (max-width:480px) {
    .navbar-toggle{ margin-top: 37px; }
}