/*------------------------------------------------------------------
[TABLE OF CONTENTS]

	1. Global Styles
	2. Header Styles
		- 2.1. Logo
		- 2.2. Navmenu
		- 2.3. Hidden Content 
	3. Main Styles
	4. Intro Slider
	5. Welcome Styles
	6. Services
	7. Tab Styles
	8. Portfolio
	9. Blog Styles
	10. Pricing Table 
	11. Testimonial 
	12. Icons Wrap
	13. Vertical Tab
	14. Timeline Styles
	15. Shop Styles
	16. Promo Content
	17. Footer
		- 17.1. Contact form 
		- 17.2. Contact Info 
		- 17.3. Flickrfeed
		- 17.4. Copyright Info
	18. Subpages
		- 18.1. Page header
			18.1.1 Breadcrumbs 
		- 18.2 Extras 
	19 Team Styles
	20. Skills Styles
	21. Clients
	22. Blog - Single Page
		- 22.1. Comments
	23. Contact Page
		- 23.1. Map Styles
	24. Sidebar Styles

-------------------------------------------------------------------*/

/*------------------------------------------------- 
                1. Global Styles
-------------------------------------------------*/

html {
	overflow-y:scroll;
}

body {
	overflow-x: hidden;
	font-family: 'EB Garamond', 'Palatino Linotype', serif;
	padding-top: 50px;
	padding-bottom: 70px;
	background: url(../img/background.jpg) no-repeat center center fixed #eaeaea;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='.img/background.png', sizingMethod='scale');
	-ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='img/background.png', sizingMethod='scale')";
}

dl,dt,dd,ul,ol,li {
	margin: 0;
	padding: 0;
}

.text-muted {
	color: #777;
}

.text-primary {
	color: #fed136;
}

p {
	font-size: 14px;
	line-height: 1.75;
        text-align: justify;
}

p.large {
	font-size: 16px;
}

a,
a:hover,
a:focus,
a:active,
a.active {
	outline: 0;
	text-decoration: none;
	transition: 0.3s;
}

a {
	color: #fed136;
	transition: 0.3s;
}

a:hover,
a:focus,
a:active,
a.active {
	color: #fff;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: 'EB Garamond', 'Palatino Linotype', serif;
	font-weight: 400;
}

/*------------------------------------------------- 
                2. Header Styles
-------------------------------------------------*/

header {
	width: 300px;
	position:fixed;
	top:50px;
}
header.relative {
position:relative;
top:0;
}
/* 2.1. Logo */

.navbar-brand {
	height: auto;
	width: 100%;
	background: rgba(255, 255, 255, 0.85) !important;
}

.navbar-brand img {
	display: table;
        padding: 10px 5px 0 5px;
	margin-bottom: -6px;
}

/* 2.2. Navmenu */

.navbar-default {
	border-color: transparent;
	background-color: #222;
}

.navbar-default .navbar-brand {
	font-family: 'EB Garamond', 'Palatino Linotype', serif;
	color: #fed136;
}

.navbar-default .navbar-brand:hover,
.navbar-default .navbar-brand:focus,
.navbar-default .navbar-brand:active,
.navbar-default .navbar-brand.active {
	color: #fec503;
}

.navbar-default .navbar-collapse {
	border-color: rgba(255,255,255,.02);
}

.navbar-default .navbar-toggle {
	border-color: #fed136;
	background-color: #fed136;
}

.navbar-default .navbar-toggle .icon-bar {
	background-color: #fff;
}

.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus {
	background-color: #fed136;
}

.navbar-default .nav li a:hover,
.navbar-default .nav li a:focus {
	outline: 0;
	color: #fed136;
}

.navbar-default .navbar-nav > .active > a {
	border-radius: 0;
	color: #fff;
	background-color: #fed136;
}

.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus {
	color: #fff;
	background-color: #fec503;
}

@media(min-width:768px) {
	.navbar-default {
		padding: 25px 0;
		border: 0;
		background-color: transparent;
		-webkit-transition: padding .3s;
		-moz-transition: padding .3s;
		transition: padding .3s;
	}

	.navbar-default .navbar-brand {
		font-size: 2em;
		-webkit-transition: all .3s;
		-moz-transition: all .3s;
		transition: all .3s;
	}

	.navbar-default .navbar-nav>.active>a {
		border-radius: 3px;
	}

	.navbar-default.navbar-shrink {
		padding: 10px 0;
		background-color: #222;
	}

	.navbar-default.navbar-shrink .navbar-brand {
		font-size: 1.5em;
	}
}

.navbar {
	padding: 0px;
	margin: 0px;
}

.navbar-header {
	float: none;
}

.navbar-collapse {
	padding: 0px;
}

.nav {
	background: #005511;
	display: table;
	margin: 0px auto;
	width: 100%;
	padding: 10px 0 30px;
}

.nav li {
	margin: 0px;
	float: none;
	font-family: 'EB Garamond', 'Palatino Linotype', serif;
}

.navbar-default .nav li a {
	text-align: center;
	font-size: 16px;
	text-transform: uppercase;
	border-bottom: 1px solid rgba(0,0,0,0.5);
	color: rgba(255,255,255,0.7);
	display: table;
	margin: 0 auto;
	padding: 16px 0;
	position: relative;
}

.nav li a:hover,
.nav li a:focus {
	outline: 0;
	color: rgba(255,255,255,0.5) !important;
}

.navbar-default .nav li .current a {
	border-bottom:1px solid #fff;
}
.navbar-default .nav li.current a {
border-bottom: 1px solid #fff;
color: #fff;
}
.navbar-default .nav li .current a :before{
	content:"";
	position:absolute;
	bottom:0px;
	height:100%;
	width:100%;
	border-bottom:1px solid #fff;
}

.navbar-nav.navbar-right:last-child {
	margin-right: 0px;
}

.dropdown {
	cursor:pointer;
}
.v-dropdown {
    background: rgba(0,0,0,0.7);
    display:none;
}

.v-dropdown li {
	list-style:none;
	border-bottom:1px solid rgba(0,0,0,0.1);
}

.v-dropdown li a {
	color: rgba(255,255,255,0.5) !important;
	border-bottom: 1px solid rgba(0,0,0,0.5) !important;
}
/* 2.3. Hidden Content */

.m-header {
	padding: 30px 0;
	background: rgba(255, 255, 255, 0.85);
	display: none;
}

.mh-social {
	display: table;
	margin: 0 auto 27px;
	padding: 0px;
}

.mh-social li {
	float: left;
	margin: 0 12px;
	list-style: none;
}

.mh-social li a {
	color: #0e0e0e;
	position: relative;
	width: 32px;
	height: 32px;
	display: table;
	text-align: center;
	line-height: 32px;
}

.mh-social li a i {
	position: relative;
	z-index: 9999;
}

.mh-social li a:before {
	content: "";
	width: 100%;
	height: 100%;
	border: 1px solid rgba(0,0,0,0.18);
	transform: rotate(45deg);
	position: absolute;
	top: 0px;
	right: 0px;
	left: 0px;
	transition: .3s;
}

.mh-social li a:hover {
	color: #fff;
}

.mh-social li a:hover:before {
	content: "";
	border: 1px solid #000;
	background: #000;
	transition: .3s;
}

.mh-copy {
	font-size: 13px;
	color: #566473;
	margin: 0px;
	font-weight: 300;
	text-align: center;
}

.m-hide {
	position: relative;
}

.m-hide:after {
	content: '';
	position: absolute;
	border-style: solid;
	border-width: 80px 150px 0;
	border-color: #005511 transparent;
	display: block;
	width: 0;
	z-index: 1;
	bottom: -80px;
	left: 0px;
	right: 0px;
	margin: 0 auto;
}

.m-hide i {
	font-size: 34px;
	text-transform: uppercase;
	color: #fff;
	position: absolute;
	margin: 0px auto;
	left: 0px;
	right: 0px;
	display: table;
	z-index: 999;
	top: 20px;
	cursor: pointer;
	transition: .3s;
	width: 30px;
}

.m-hide i:hover {
	color: #000;
	transition: .3s;
}

/*------------------------------------------------- 
                3. Main styles
-------------------------------------------------*/

.m-left {
	width: 330px;
	margin: 0px;
}

.m-right {
	width: 870px;
}

.no-padding {
	padding: 0px !important;
}

.container {
	max-width: 1230px;
	width: 100%;
}

/*------------------------------------------------- 
                4. Intro Slider
-------------------------------------------------*/

#intro {
	margin-bottom: 30px;
	background: rgba(255, 255, 255, 0.85);
	padding: 30px;
}

#intro-slider .owl-buttons {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0px;
	right: 0px;
	left: 0px;
	margin: 0px;
}

#intro-slider .owl-prev {
	opacity: 1;
	font-size: 0px;
	width: 68px;
	height: 68px;
	background: url(../img/icons/intro-prev.png) no-repeat;
	border-radius: 0px;
	position: absolute;
	bottom: 0px;
	left: 0px;
	margin: 0px;
}

#intro-slider .owl-next {
	opacity: 1;
	font-size: 0px;
	width: 68px;
	height: 68px;
	background: url(../img/icons/intro-next.png) no-repeat;
	border-radius: 0px;
	position: absolute;
	top: 0px;
	right: 0px;
	margin: 0px;
}

#intro-slider .owl-prev:hover {
	background: url(../img/icons/intro-prev-hr.png) no-repeat;
}

#intro-slider .owl-next:hover {
	background: url(../img/icons/intro-next-hr.png) no-repeat;
}

#intro-slider .owl-prev ,
#intro-slider .owl-next ,
#intro-slider .owl-prev:hover ,
#intro-slider .owl-next:hover {
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
}
.text-slider {
    left: 0px;
    bottom: 20px;
    font-size: 27px;
    position: absolute;
    width: 80%;
    margin: 0 20%;
    text-align: center;
    line-height: 40px;
    padding-left: 20px;
    padding: 10px;
    padding-right: 20px;
    color: white;
    background: rgba(0, 85, 17, 0.7);
}

/*------------------------------------------------- 
                5. Welcome Styles
-------------------------------------------------*/

#welcome {
	background: rgba(255, 255, 255, 0.85);
	padding: 47px 30px 43px;
	margin-bottom: 30px;
}

#welcome h1 {
	font-size: 24px;
	text-transform: uppercase;
	color: #000;
	text-align: center;
	margin: 0 0 20px;
}

.btn-default {
	font-size: 14px;
	color: #fff;
	font-weight: 300;
	border: 1px solid #005511;
	background: #005511;
	padding: 10px 15px;
}

.btn-default:hover {
	color: #005511;
	border: 1px solid #005511;
	background: transparent;
}

.btn-center {
	display: table;
	margin: 0 auto;
}

/*------------------------------------------------- 
                  6. Services
-------------------------------------------------*/

#services {
	padding: 30px 30px 0;
	background: rgba(255, 255, 255, 0.85);
	display: table;
	width: 100%;
	margin-bottom: 30px;
}

#services ul {
	padding: 0px;
}

#services ul li {
	float: left;
	border: 1px solid #e2e2e2;
	border-left: none;
	margin: 0 0 30px;
	list-style: none;
	width: 33.3333%;
	text-align: center;
	padding: 45px 15px;
	transition: 0.4s;
}

#services ul li:first-child {
	border-left: 1px solid #e2e2e2;
}

#services i {
	font-size: 32px;
	color: #005511;
}

#services h4 {
	font-size: 14px;
	text-transform: uppercase;
	color: #000;
	margin: 20px 0 0;
}

#services h3 {
	font-size: 20px;
	text-transform: uppercase;
	color: #000;
	margin: 0 0 20px;
	text-align: center;
}

#services .dragmet {
	font-size: 24px;
	color: #000;
	margin: 20px 0 0;
	text-align: center;
}

#services ul li:hover {
	background: #005511;
	cursor: pointer;
	border-color: #005511;
	transition: 0.4s;
}

#services li:hover i,
#services li:hover h4,
#services li:hover h3,
#services li:hover p {
	color: #fff;
	transition: 0.4s;
}

/*------------------------------------------------- 
                  7. Tab Styles
-------------------------------------------------*/

#features-tab {
	background: rgba(255, 255, 255, 0.85);
	padding: 30px;
	margin-bottom: 30px;
}

.nav-tabs {
	padding: 0 35px 22px;
	border-bottom: 1px solid #005511;
	display: table;
	width: 100%;
}

.nav-tabs li {
	font-size: 15px;
	font-family: 'EB Garamond', 'Palatino Linotype', serif;
	font-weight: 400;
	color: #8d8d8d;
	float: left;
	list-style: none;
	margin: 0 34px;
	border: none;
	position: relative;
}

.nav-tabs li:after {
	content: "/";
	font-size: 15px;
	color: #e7e7e7;
	position: absolute;
	left: -34px;
	top: 0px;
	font-weight: 400;
}

.nav-tabs li:first-child:after {
	display: none;
}

.nav-tabs li a {
	color: #8d8d8d;
	border: none;
	padding: 0 0 15px !important;
	margin: 0px !important;
	padding-bottom: 15px;
	position: relative;
}

.nav-tabs li.active a, .nav-tabs li a:hover {
	color: #005511 !important;
	border: none !important;
	border-radius: 0px;
}

.nav-tabs li.active a:after {
	content: "";
	background: url(../img/icons/bubble.png);
	width: 15px;
	height: 9px;
	margin: 0 auto;
	position: absolute;
	left: 0;
	right: 0;
	bottom: -17px;
	z-index: 9999;
}

.tab-content {
	border: 1px solid #e2e2e2;
	border-top: 0px;
	margin-top: -10px;
	padding: 35px 30px 30px;
}

.tab-right-content {
	padding-left: 0px;
}

.tab-left-content {
	padding-right: 0px;
}

.tab-content h4 {
	font-size: 15px;
	font-weight: bold;
	text-transform: uppercase;
	color: #000;
	margin: 23px 0 12px;
}

.tab-content p {
	font-size: 15px;
	color: #272727;
	font-weight: 300;
	line-height: 21px;
	margin: 0 0 22px;
}

/*------------------------------------------------- 
                  8. Portfolio
-------------------------------------------------*/

#m-portfolio {
	padding: 30px 30px 0;
	background: rgba(255, 255, 255, 0.85);
	margin-bottom: 30px;
}

#m-portfolio h3 {
	font-size: 20px;
	text-transform: uppercase;
	color: #000;
	margin: 0 0 20px;
	text-align: center;
}

#m-portfolio .col-md-4 {
	margin-bottom: 30px;
}

.mp-thumb {
	position: relative;
	cursor: pointer;
	overflow: hidden;
}

.mp-thumb  img{
	width:100%;
}

.overlay1 {
	position: absolute;
	top: 0px;
	left: 0px;
	right: 0px;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,0.20);
	opacity: 1;
	visibility: visible;
	transition: 0.6s;
}

.overlay1 h4 {
	padding: 7px 10px;
	background: #005511;
	display: table;
	margin: 50% auto 0px;
	font-family: 'EB Garamond', 'Palatino Linotype', serif;
	font-size: 13px;
	color: #FFF;
	position: relative;
	top: -25%;
}

.overlay1-hr {
	position: absolute;
	top: 0px;
	left: 0px;
	right: 0px;
	width: 100%;
	height: 100%;
	opacity: 0;
	visibility: hidden;
	transition: 0.6s;
}

.zoom {
	color: #000;
	position: relative;
	width: 61px;
	height: 61px;
	position: absolute;
	bottom: -61px;
	left: -61px;
	transition: 0.4s;
}

.zoom:after {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	border-width: 0 61px 61px 0;
	border-style: solid;
	border-color: #fff transparent;
	transition: 0.4s;
}

.zoom i {
	position: relative;
	z-index: 999;
	padding: 36px 12px;
}

.link {
	color: #000;
	position: relative;
	width: 61px;
	height: 61px;
	position: absolute;
	top: -61px;
	right: -61px;
	transition: 0.4s;
}

.link:after {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	border-width: 0 61px 61px 0;
	border-style: solid;
	border-color: transparent #fff;
	transition: 0.4s;
}

.link i {
	position: relative;
	z-index: 999;
	padding: 11px 40px;
}

.mp-thumb:hover .overlay1-hr {
	opacity: 1;
	visibility: visible;
	transition: 0.6s;
}

.mp-thumb:hover .overlay1 {
	opacity: 0;
	visibility: hidden;
	transition: 0.6s;
}

.mp-thumb:hover .link {
	top: 0px;
	right: 0px;
	transition: 0.4s;
}

.mp-thumb:hover .zoom {
	bottom: 0px;
	left: 0px;
	transition: 0.4s;
}

.mp-thumb .link:hover, .mp-thumb .zoom:hover {
	color: #fff;
}

.zoom:hover:after {
	content: "";
	border-color: #005511 transparent;
	transition: 0.4s;
}

.link:hover:after {
	content: "";
	border-color: transparent #005511;
	transition: 0.4s;
}

/*------------------------------------------------- 
                  9. Blog Styles
-------------------------------------------------*/

#blog {
	padding: 30px 15px;
	background: rgba(255, 255, 255, 0.85);
	margin-bottom: 30px;
}

#blog h3 {
	font-size: 20px;
	text-transform: uppercase;
	color: #000;
	margin: 0 0 20px;
	text-align: center;
}

#m-blog h4, #m-blog-content h4 {
	font-size: 16px;
	font-weight: bold;
	color: #000;
	margin: 15px 0;
	letter-spacing: 2px;
	line-height: 24px;
}

#m-blog h4 a, #m-blog-content h4 a {
	color: #000;
}

#m-blog h4 a:hover, #m-blog-content h4 a:hover {
	color: #999;
}

#m-blog .item {
	margin: 0 15px;
}

#m-blog-content .item {
	margin: 0 0px;
}

#m-blog .blog-meta, #m-blog-content .blog-meta {
	font-size: 13px;
	color: #000;
	font-weight: 300;
}

#m-blog .blog-meta span, #m-blog-content .blog-meta span {
	margin-right: 20px;
}

#m-blog .blog-meta i, #m-blog-content .blog-meta i {
	width: 38px;
	height: 38px;
	text-align: center;
	line-height: 36px;
	border: 1px solid #005511;
	border-radius: 50%;
	margin-right: 10px;
	color: #005511;
}

#m-blog p, #m-blog-content p {
	font-weight: 300;
	font-size: 15px;
	line-height: 22px;
	color: #272727;
	margin: 20px 0 30px;
}

.mb-thumb {
	position: relative;
}

.date {
	width: 62px;
	height: 62px;
	background: rgba(255, 255, 255, 0.85);
	position: absolute;
	top: 0px;
	right: 0px;
	font-family: 'EB Garamond', 'Palatino Linotype', serif;	
        font-size: 18px;
	font-weight: bold;
	text-transform: uppercase;
	color: #005511;
	text-align: center;
	line-height: 15px;
	padding: 14px 0 0;
	z-index: 50;
}

.date span {
	font-family: 'EB Garamond', 'Palatino Linotype', serif;
	font-size: 11px;
	color: #000;
	text-transform: none;
	display: block;
	font-weight: 400;
	letter-spacing: 1px;
}

#m-blog .owl-controls .owl-pagination {
	border: 1px solid #ebebeb;
	border-radius: 8px;
	display: table;
	margin: 0 auto;
	width: auto;
	padding: 0 3px;
}

#m-blog .owl-controls .owl-page span {
	display: block;
	width: 12px;
	height: 12px;
	margin: 7px 5px 4px;
	opacity: 1;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.85);
	border: 1px solid #d7d7d7;
}

#m-blog .owl-controls .owl-page.active span {
	background: #005511;
	border: 1px solid #005511;
}

.rmore {
	position: absolute;
	width: 0%;
	height: 0%;
	top: 42%;
	left: 50%;
	background: rgba(255,255,255,0.8);
	transition: 0.3s;
	z-index: 10;
	opacity: 0;
	visibility: hidden;
}

.rmore a {
	padding: 9px 18px;
	background: #005511;
	display: table;
	margin: 74% auto 0px;
	font-family: 'EB Garamond', 'Palatino Linotype', serif;
	font-size: 14px;
	color: #FFF;
	position: relative;
	top: -50%;
	font-weight: 300;
	border: 1px solid #005511;
}

.rmore a:hover {
	background: transparent;
	color: #005511;
	border-color: #005511;
}

#m-blog .item:hover .rmore {
	transition: 0.3s;
	opacity: 1;
	visibility: visible;
	width: 100%;
	height: 100%;
	top: 0%;
	left: 0%;
}

#m-blog-content .item:hover .rmore {
	transition: 0.3s;
	opacity: 1;
	visibility: visible;
	width: 100%;
	height: 100%;
	top: 0%;
	left: 0%;
}

/*------------------------------------------------- 
                 10. Pricing Table
-------------------------------------------------*/

#m-pricing {
	padding: 30px;
	background: rgba(255, 255, 255, 0.85);
	margin-bottom: 30px;
}

#m-pricing h3 {
	font-size: 20px;
	text-transform: uppercase;
	color: #000;
	margin: 0 0 35px;
	text-align: center;
}

.mp-icon {
	width: 53px;
	height: 53px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	background-color: #005511;
	border: 1px solid #005511;
	margin: 0 auto -17px;
	position: relative;
}

.mp-icon:before {
	content: "\f01a";
	color: #fff;
	font-family: 'FontAwesome';
	font-size: 24px;
	position: absolute;
	width: 100%;
	height: 100%;
	line-height: 51px;
	text-align: center;
	top: 0;
	left: 0;
	right: 0;
}

.pricing-table:hover .mp-icon {
	background-color: #fff;
	border: 1px solid #e5e5e5;
}

.pricing-table:hover .mp-icon:before {
	content: "\f0ab";
	color: #005511;
}

.mp-title {
	background: #005511;
	line-height: 60px;
	text-align: center;
	font-size: 21px;
	color: #fff;
	border: 1px solid #005511;
	border-bottom: 1px solid rgba(0,0,0,0.2);;
}

.mp-price {
	height: 74px;
	background: #005511;
	padding: 0px 20px;
	font-family: 'EB Garamond', 'Palatino Linotype', serif;
	font-size: 50px;
	font-weight: bold;
	color: #fff;
	text-align: center;
	border: 1px solid #005511;
	border-top: none;
}

.mp-price small {
	font-family: 'EB Garamond', 'Palatino Linotype', serif;
	font-size: 24px;
	color: #fff;
	font-weight: 400;
	margin-right: 5px;
	position: relative;
	top: -6px;
}

.mp-price span {
	font-family: 'EB Garamond', 'Palatino Linotype', serif;
	font-size: 16px;
	font-weight: bold;
	color: #fff;
	display: inline-block;
	line-height: 13px;
	position: relative;
	top: -13px;
	left: 5px;
	text-align: left;
}

.mp-price span em {
	font-style: normal;
	font-size: 11px;
	font-weight: bold;
	color: #fff;
	display: block;
}

.pricing-table {
	cursor: pointer;
}

.pricing-table:hover .mp-title ,
.pricing-table:hover .mp-price {
	background: rgba(255, 255, 255, 0.85);
	border-color: #e3e3e3;
	color: #005511;
}

.pricing-table:hover .mp-price ,
.pricing-table:hover .mp-price small ,
.pricing-table:hover .mp-price span,
.pricing-table:hover .mp-price span em {
	color: #005511;
}

.pricing-table ul {
	padding: 0px;
	margin: 0px;
}

.pricing-table ul li {
	list-style: none;
	line-height: 46px;
	border: 1px solid #e3e3e3;
	border-width: 0 1px 1px 1px;
	font-size: 13px;
	color: #000;
	font-weight: 300;
	width: 100%;
	display: table;
	padding: 0 15px;
}

.pricing-table:hover ul li, 
.pricing-table:hover .mp-btn {
	border-color: #e3e3e3;
}

.pricing-table ul li i {
	font-size: 15px;
	color: #000;
	margin-right: 10px;
}

.mp-btn {
	border: 1px solid #e3e3e3;
	border-width: 0 1px 1px 1px;
	padding: 20px;
}

.mp-btn a {
	background: transparent;
	border: solid 1px #e3e3e3;
	height: 45px;
	line-height: 45px;
	text-align: center;
	display: table;
	width: 100%;
	border-radius: 5px;
	font-size: 14px;
	text-transform: uppercase;
	color: #000;
}

.pricing-table:hover .mp-btn a {
	background: #005511;
	color: #fff;
}

.mp-title ,
.mp-price ,
.mp-price small ,
.mp-price span,
.mp-price span em ,
.mp-btn a
.pricing-table:hover .mp-title ,
.pricing-table:hover .mp-price ,
.pricing-table:hover .mp-price small ,
.pricing-table:hover .mp-price span,
.pricing-table:hover .mp-price span em ,
.pricing-table:hover .mp-btn a {
	transition: 0.3s;
}

/*------------------------------------------------- 
                 11. Testimonial
-------------------------------------------------*/

#m-testimonials {
	padding: 30px 30px 20px;
	margin-bottom: 30px;
	background: rgba(255, 255, 255, 0.85);
}

#m-testimonials h3 {
	font-size: 20px;
	text-transform: uppercase;
	color: #000;
	margin: 0 0 25px;
	text-align: center;
}

#testimonials img {
	-webkit-box-shadow: 0 0 0 2px #eee;
	-moz-box-shadow: 0 0 0 2px #eee;
	box-shadow: 0 0 0 2px #eee;
	border: solid 12px rgba(0,118,249,0);
	width: 163px;
	height: 163px;
	margin: 2px auto 13px;
	display: table;
	border-radius: 50%;
}

#testimonials p {
	font-size: 19px;
	font-style: italic;
	color: #272727;
	font-weight: 300;
	text-align: center;
	line-height: 25px;
	padding: 0 11%;
}

#testimonials i {
	font-size: 20px;
	color: #005511;
	display: table;
	margin: 17px auto 13px;
	font-weight: 300;
}

#testimonials cite {
	font-size: 16px;
	color: #000;
	font-weight: 300;
	text-align: center;
	width: 100%;
	display: table;
}

#testimonials cite span {
	font-weight: 600;
}

#testimonials .owl-prev {
	width: 30px;
	height: 30px;
	border: 1px solid #e2e2e2;
	border-radius: 0px;
	opacity: 1;
	background: transparent;
	position: relative;
	float: left;
	font-size: 0px;
	right: 5px;
}

#testimonials .owl-next {
	width: 30px;
	height: 30px;
	border: 1px solid #e2e2e2;
	border-radius: 0px;
	opacity: 1;
	background: transparent;
	position: relative;
	float: right;
	font-size: 0px;
	right: -5px;
}

#testimonials .owl-prev:before {
	content: "\f104";
	font-family: FontAwesome;
	font-size: 18px;
	color: #000;
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0px;
	left: 0px;
}

#testimonials .owl-next:before {
	content: "\f105";
	font-family: FontAwesome;
	font-size: 18px;
	color: #000;
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0px;
	left: 0px;
}

#testimonials .owl-buttons {
	position: absolute;
	top: 40%;
	width: 100%;
	margin-top: -50px;
}

#testimonials .owl-prev:hover ,
#testimonials .owl-next:hover {
	background: #005511;
	color: #fff;
	border-color: #005511;
}

#testimonials .owl-prev:hover:before ,
#testimonials .owl-next:hover:before {
	color: #fff;
}

/*------------------------------------------------- 
                 12. Icons Wrap
-------------------------------------------------*/

#icons-wrap {
	padding: 30px;
	margin-bottom: 30px;
	background: rgba(255, 255, 255, 0.85);
}

#icons-wrap h3 {
	font-size: 20px;
	text-transform: uppercase;
	color: #000;
	margin: 0 0 25px;
	text-align: center;
}

#icons-wrap ul {
	padding: 0px;
	margin: 0 -2%;
}

#icons-wrap ul li {
	float: left;
	list-style: none;
	width: 29.33333%;
	font-family: 'EB Garamond', 'Palatino Linotype', serif;
	font-size: 15px;
	color: #a1a1a1;
	padding-left: 30px;
	position: relative;
	font-weight: 300;
	height: 45px;
	border-bottom: 1px solid #eee;
	border-top: 1px solid #eee;
	margin: 0 2% -1px;
	display: inline-block;
	line-height: 45px;
	transition: 0.3s;
}

#icons-wrap ul li i {
	font-size: 20px;
	color: #005511;
	position: absolute;
	top: 13px;
	left: 0px;
	transition: 0.3s;
}

#icons-wrap ul li:hover {
	padding-left: 45px;
	transition: 0.3s;
	background: #005511;
	border-color: #005511;
	color: #fff;
	cursor: pointer;
}

#icons-wrap ul li:hover i {
	left: 15px;
	transition: 0.5s;
	color: #fff;
}

/*------------------------------------------------- 
                 13. Vertical Tab
-------------------------------------------------*/

#vertical-tabs {
	background: rgba(255, 255, 255, 0.85);
	padding: 30px;
	margin-bottom: 30px;
}

#vertical-tabs h3 {
	font-size: 20px;
	text-transform: uppercase;
	color: #000;
	margin: 0 0 25px;
	text-align: center;
}

#verticalTab {
	border: 1px solid #e2e2e2;
	display: table !important;
	overflow: hidden !important;
}

#advert {
    background: rgba(255, 255, 255, 0.85);
	padding: 30px;
	margin-bottom: 30px;
}

#advert h3 {
	font-size: 20px;
	text-transform: uppercase;
	color: #005511;
	margin: 0 0 25px;
	text-align: center;
}

#advert_ad {
    border: 1px solid rgba(0, 85, 17, 0.7);
	display: table !important;
	overflow: hidden !important;
	padding: 24px;
}


/*------------------------------------------------- 
                14. Timeline Styles
-------------------------------------------------*/

#timeline-wrap {
	background: rgba(255, 255, 255, 0.85);
	padding: 30px;
	overflow: hidden;
	margin-bottom: 30px;
}

#timeline-wrap h3 {
	font-size: 20px;
	text-transform: uppercase;
	color: #000;
	margin: 0 0 25px;
	text-align: center;
}

#timeline {
	background: rgba(255, 255, 255, 0.85);
	width: 100%;
	overflow: hidden;
	list-style: none;
	position: relative;
	z-index:1;
}

#timeline:before {
	content: "";
	width: 23px;
	height: 23px;
	border: 1px solid #005511;
	position: absolute;
	bottom: 10px;
	right: 0;
	left: 0px;
	margin: 0 auto;
	transform: rotate(45deg);
	transition: 0.4s;
	background: rgba(255, 255, 255, 0.85);
	z-index: 999;
}

#timeline:after {
	content: "";
	width: 1px;
	height: 98%;
	background: #005511;
	position: absolute;
	bottom: 0px;
	top: 1%;
	right: 0;
	left: 0px;
	margin: 0 auto;
	z-index:-1;
}

#timeline li {
	position: relative;
	clear: both;
	float: left;
	width: 42.5%;
	padding: 20px 25px;
	background: rgba(255, 255, 255, 0.85);
	border: 1px solid #e5e5e5;
	text-align: right;
	margin: 0px 0px -53px !important;
	transition: 0.3s;
	cursor: pointer;
}

#timeline li:last-child {
	margin: 0px 0px 0px !important;
}

#timeline li:nth-of-type(odd),
#timeline li:nth-of-type(even) {
	margin: -10px 0 0 0;
}

#timeline li:nth-of-type(even) {
	float: right;
	text-align: left;
}

#timeline li:nth-of-type(even):after {
	background: -moz-linear-gradient(0,#f43059,#d8d566);
	background: -webkit-gradient(linear,left top,right top,from(#f43059),to(#d8d566));
	left: auto;
	right: 100%;
}

#timeline .t-time {
	font-size: 16px;
	color: #000;
	font-weight: 400;
	font-family: 'EB Garamond', 'Palatino Linotype', serif;
	position: relative;
}

#timeline .t-left .t-time:before {
	content: "";
	width: 30px;
	height: 2px;
	background: #005511;
	position: absolute;
	right: 0;
	bottom: -12px;
}

#timeline .t-right .t-time:before {
	content: "";
	width: 30px;
	height: 2px;
	background: #005511;
	position: absolute;
	left: 0;
	bottom: -12px;
}

#timeline .t-time span {
	font-family: 'EB Garamond', 'Palatino Linotype', serif;
	font-size: 13px;
	color: #000;
	display: block;
}

#timeline p {
	font-family: 'EB Garamond', 'Palatino Linotype', serif;
	font-size: 13px;
	color: #a6a6a6;
	font-weight: 300;
	margin: 0px;
	padding: 22px 0 0;
	line-height: 18px;
}

.t-left {
	position: relative;
}

.t-left:after {
	content: '';
	position: absolute;
	border-style: solid;
	border-width: 10px 0 11px 10px;
	border-color: transparent #005511;
	display: block;
	width: 0;
	z-index: 1;
	right: -10px;
	top: 13px;
}

.t-left:before {
	content: "";
	width: 25px;
	height: 25px;
	border: 1px solid #005511;
	position: absolute;
	top: 10px;
	right: -21.7%;
	transform: rotate(45deg);
	transition: 0.4s;
	background: rgba(255, 255, 255, 0.85);
	z-index: 999;
}

.t-right:before {
	content: "";
	width: 25px;
	height: 25px;
	border: 1px solid #005511;
	position: absolute;
	top: 10px;
	left: -21.7%;
	transform: rotate(45deg);
	transition: 0.4s;
	background: rgba(255, 255, 255, 0.85);
	z-index: 999;
}

.t-left:hover:before ,
.t-right:hover:before {
	content: "";
	width: 25px;
	height: 25px;
	border: 7px solid #005511;
	transition: 0.4s;
}

.t-right {
	position: relative;
}

.t-right:after {
	content: '';
	position: absolute;
	border-style: solid;
	border-width: 10px 11px 10px 0;
	border-color: transparent #005511;
	display: block;
	width: 0;
	z-index: 1;
	left: -10px;
	top: 13px;
}

#timeline li:hover {
	background: #005511;
	transition: 0.3s;
}

#timeline li:hover .t-time ,
#timeline li:hover .t-time span ,
#timeline li:hover p {
	color: #fff;
	transition: 0.3s;
}

#timeline .t-right:hover .t-time:before ,
#timeline .t-left:hover .t-time:before {
	background: rgba(255, 255, 255, 0.85);
	transition: 0.3s;
}

/*------------------------------------------------- 
                15. Shop Styles
-------------------------------------------------*/

#m-products {
	background: rgba(255, 255, 255, 0.85);
	padding: 30px;
	overflow: hidden;
	margin-bottom: 30px;
}

#m-products h3 {
	font-size: 20px;
	text-transform: uppercase;
	color: #000;
	margin: 0 0 25px;
	text-align: center;
}

.pw-inner {
	border: 1px solid #e5e5e5;
	border-top: none;
	padding: 22px 20px 33px;
}

.pw-inner h4 {
	font-family: 'EB Garamond', 'Palatino Linotype', serif;
	font-size: 17px;
	color: #000;
	font-weight: 300;
	margin: 0 0 25px;
	text-align: center;
}

.pw-inner ul {
	padding: 0px;
	margin: 0 auto;
	display: table;
}

.pw-inner ul li {
	float: left;
	margin: 0 12px;
	list-style: none;
}

.pw-inner ul li a {
	color: #005511;
	width: 35px;
	height: 35px;
	padding: 7px 9px;
	text-align: center;
	font-size: 14px;
	display: table;
	border: 1px solid #005511;
	transform: rotate(45deg);
}

.pw-inner ul li a span {
	transform: rotate(-45deg);
	display: table;
}

.product-wrap {
	position: relative;
	cursor: pointer;
	transition: 0.3s;
	margin-bottom:30px;
}

.product-wrap img {
	width:100%;
}

.pw-price {
	font-family: 'EB Garamond', 'Palatino Linotype', serif;
	font-size: 16px;
	text-transform: uppercase;
	color: #fff;
	background: #005511;
	position: absolute;
	top: 0px;
	right: 0px;
	display: table;
	padding: 3.5px 7px;
	transition: 0.3s;
}

.product-wrap:hover .pw-inner {
	background: #005511;
	border-color: #005511;
	transition: 0.3s;
}

.product-wrap:hover .pw-inner h4 {
	color: #fff;
	transition: 0.3s;
}

.product-wrap:hover .pw-inner ul a {
	color: #fff;
	border-color: #fff;
	transition: 0.3s;
}

.product-wrap:hover .pw-price {
	background: rgba(255, 255, 255, 0.85);
	color: #000;
	transition: 0.3s;
}

.pw-inner ul li a:hover {
	color: #005511 !important;
	border: 1px solid #fff;
	background: rgba(255, 255, 255, 0.85);
}

/*------------------------------------------------- 
                16. Promo Content
-------------------------------------------------*/

#m-promo {
	background: rgba(255, 255, 255, 0.85);
	padding: 30px 30px 20px;
	overflow: hidden;
	margin-bottom: 30px;
}

#m-promo h3 {
	font-size: 20px;
	text-transform: uppercase;
	color: #000;
	margin: 0 0 27px;
	text-align: center;
}

#m-promo img {
	display: table;
	margin: 0 auto;
}

/*------------------------------------------------- 
                   17. Footer
-------------------------------------------------*/

/* 17.1. Contact form */

#m-contact {
	background: rgba(0,0,0,0.8);
	padding: 30px;
}

#m-contact h3 {
	font-size: 16px;
	text-transform: uppercase;
	color: #fff;
	font-weight: 400;
	margin: 0 0 24px;
}

.mc-name ,
.mc-email ,
.mc-website {
	display: table;
	width: 100%;
	margin-bottom: 42px;
	position: relative;
}

.mc-name input ,
.mc-email input ,
.mc-website input {
	width: 100%;
	background: transparent;
	border: none;
	border-bottom: 1px solid rgba(255,255,255,0.3);
	font-size: 13px;
	color: #fff;
	padding-bottom: 11px;
	padding-left: 50px;
	margin: 0;
	position: relative;
	top: 0px;
}

.mc-name span ,
.mc-email span ,
.mc-website span {
	width: 36px;
	height: 38px;
	display: table;
	float: left;
	transform: rotate(45deg);
	border: 1px solid #fff;
	background: #005511;
	color: #fff;
	padding: 11px;
	position: absolute;
	top: 13px;
	z-index: 88;
}

.mc-name span i ,
.mc-email span i ,
.mc-website span i {
	display: table;
	transform: rotate(-45deg);
}

.mc-message {
	position: relative;
	margin-top: 30px;
}

.mc-message textarea {
	width: 100%;
	background: transparent;
	border: 1px solid rgba(255,255,255,0.3);
	height: 152px;
	padding: 12px 17px 17px;
	color: #fff;
	padding-right: 83px;
}

.mc-name input:focus ,
.mc-email input:focus ,
.mc-website input:focus {
	border-color: #fff;
	color: #fff;
	outline: none;
}

#m-contact form input::-webkit-input-placeholder {color: #bcbcbc !important;opacity: 1 !important;}
#m-contact form input:-moz-placeholder {color: #bcbcbc !important;opacity: 1 !important;}
#m-contact form input::-moz-placeholder {color: #bcbcbc !important;opacity: 1 !important;}
#m-contact form input:-ms-input-placeholder {color: #bcbcbc !important;opacity: 1 !important;}

#m-contact form textarea::-webkit-input-placeholder {color: #bcbcbc !important;opacity: 1 !important;}
#m-contact form textarea:-moz-placeholder {color: #bcbcbc !important;opacity: 1 !important;}
#m-contact form textarea::-moz-placeholder {color: #bcbcbc !important;opacity: 1 !important;}
#m-contact form textarea:-ms-input-placeholder {color: #bcbcbc !important;opacity: 1 !important;}

.mc-message textarea:focus {
	border: 2px solid #fff;
	color: #fff;
	outline: none;
}

.mc-name input:focus + span ,
.mc-email input:focus + span ,
.mc-website input:focus + span {
	background: rgba(255, 255, 255, 0.85);
	color: #005511;
	border-color: #fff;
}

.mc-message button {
	width: 59px;
	height: 128px;
	border: solid 2px #fff;
	background: transparent;
	transition: 0.3s;
	color: #fff;
	font-weight: bold;
	text-transform: uppercase;
	font-size: 17px;
	position: absolute;
	top: 12px;
	right: 12px;
}

.mc-message button:hover {
	border: solid 2px #fff;
	background: #fff;
	color: #005511;
}

.mc-message button span {
	display: table;
	transform: rotate(-90deg);
        margin-left: -30px;
}

.statusMessage,.successmessage,.errormessage {
	display: none;
	margin: auto;
	width: 100%;
	height: auto;
	background: rgba(255,255,255,0.1);
	margin: 0 auto 15px;
	padding: 20px;
	border-radius:5px;
}

.statusMessage p {
	margin: 0;
	color: #888;
}

.successmessage p {
	margin: 0;
	color: #888;
}

.success-ico {
	background: url(../img/success.png);
	width: 30px;
	height: 30px;
	float: left;
	margin-right: 15px;
	position: relative;
	top: -3px;
}

.error-ico {
	background: url(../img/error.png);
	width: 30px;
	height: 30px;
	float: left;
	margin-right: 15px;
	position: relative;
	top: -3px;
}

.errormessage p {
	margin: 0;
	color: #888;
}

#m-contact .product-wrap {
	background:#fff;
}
#m-contact .product-wrap h4{
	color:#a24dc6;
}
#m-contact .product-wrap:hover .pw-inner h4 {
	color: #fff;
	transition: 0.3s;
}

/* 17.2. Contact Info */

.contact-info {
	border-top: 1px solid rgba(0,0,0,0.2);
	border-bottom: 1px solid rgba(0,0,0,0.2);
	padding: 30px 0;
	margin-top: 10px;
	display: table;
	width: 100%;
}

#m-contact h4 {
	font-size: 16px;
	text-transform: uppercase;
	color: #fff;
	font-weight: 400;
	margin: 0 0 22px;
}

.contact-info ul {
	padding: 0px;
}

.contact-info ul li {
	float: left;
	list-style: none;
	width: 33.33333%;
	font-size: 15px;
	color: #fff;
}

.contact-info ul li i {
	font-size: 20px;
	color: #fff;
	margin-right: 12px;
	position: relative;
	top: 2px;
}

/* 17.3. Flickrfeed */

.flickr-widget {
	padding: 30px 0 0;
}

.thumbs {
	margin: 0px -13px -54px;
	padding: 0px;
	overflow: hidden;
	height: 200px;
}

.thumbs li {
	list-style: none;
	float: left;
	margin: 25px 31px 0;
	width: 99px;
	height: 101px;
	transform: rotate(45deg);
	border: 1px solid rgba(0,0,0,0.2);
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
	position: relative;
	oerflow: hidden;
	transition: 0.3s;
	cursor: pointer;
}

.thumbs li:before {
	content: "";
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0px;
	left: 0px;
	border: 17px solid #005511;
	z-index: 999;
	transition: 0.3s;
}

.thumbs li a {
	display: table;
	overflow: hidden;
	border: 1px solid #005511;
}

.thumbs li img {
	display: block;
	width: 95px;
	height: 95px;
	transform: rotate(-45deg);
}

.thumbs li:hover ,
.thumbs li:hover:before {
	border-color: #fff;
	transition: 0.3s;
}

.thumbs li a img {
	border: none;
}

/* 17.4. Copyright Info */

footer {
	padding: 20px 25px 45px;
	background: rgba(255, 255, 255, 0.85);
	position: relative;
}

footer p {
	text-align: center;
	font-size: 15px;
	color: #000;
	font-weight: 300;
	margin: 0px;
}

.backtotop-icon {
	width: 44px;
	height: 45px;
	background-color: #005511;
	border: 1px solid #005511;
	margin: 0 auto;
	transform: rotate(45deg);
	position: absolute;
	transform: rotate(45deg);
	left: 0;
	right: 0;
	bottom: -22px;
}

.backtotop-icon:before {
	content: "\f01b";
	color: #fff;
	font-family: 'FontAwesome';
	font-size: 24px;
	position: absolute;
	width: 100%;
	height: 100%;
	line-height: 45px;
	text-align: center;
	top: 0;
	left: 0;
	right: 0;
	transform: rotate(-45deg);
}

.backtotop-icon:hover {
	background-color: #fff;
	border: 1px solid #e5e5e5;
}

.backtotop-icon:hover:before {
	content: "\f0aa";
	color: #005511;
}

/*------------------------------------------------- 
                   18. Subpages
-------------------------------------------------*/

/* 18.1. Page header */

#page-header {
	background: rgba(255, 255, 255, 0.85);
	padding: 14px 0 15px;
	margin-bottom: 30px;
}

#page-header h3 {
	border-bottom: 1px solid #e6e6e6;
	font-weight: 300;
	font-family: 'EB Garamond', 'Palatino Linotype', serif;
}

#page-header h3 span {
	font-size: 21px;
	color: #fff;
	background: #666666;
	line-height: 60px;
	display: table;
	margin: 0px auto -30px;
	padding: 0px 20px;
}

/* 18.1.1 Breadcrumbs */

.bread_crumbs {
	padding: 0px;
	margin: 40px auto 0;
	display: table;
}

.bread_crumbs li {
	float: left;
	list-style: none;
	margin: 0 15px;
	color: #000;
	font-weight: 300;
	position: relative;
}

.bread_crumbs li:before {
	content: "\f061";
	font-family: FontAwesome;
	font-size: 13px;
	position: absolute;
	top: 2px;
	left: -20px;
	color: #005511;
}

.bread_crumbs li a {
	color: #000;
}

.bread_crumbs li a:hover {
	color: #787878;
}

.bread_crumbs li:first-child:before {
	display: none;
}

/* 18.2 Extras */

#m-info {
	padding: 40px 30px 30px;
	background: rgba(255, 255, 255, 0.85);
	margin-bottom: 30px;
}

#m-info .tab-content {
	border-top: 1px solid #005511;
	padding: 30px 30px 30px;
}

.tab-content .col-md-4 {
	width: 31%;
}

.tab-content .col-md-8 {
	width: 69%;
}

.animated-out,.animated-in {
	-webkit-transition-timing-function: cubic-bezier(0.13,0.71,0.30,0.94);
	-moz-transition-timing-function: cubic-bezier(0.13,0.71,0.30,0.94);
	-o-transition-timing-function: cubic-bezier(0.13,0.71,0.30,0.94);
	transition-timing-function: cubic-bezier(0.13,0.71,0.30,0.94);
	-webkit-transition-duration: 1s;
	-moz-transition-duration: 1s;
	-o-transition-duration: 1s;
	transition-duration: 1s;
}

.animated-out {
	-webkit-transform: translateY(35px);
	-moz-transform: translateY(35px);
	-o-transform: translateY(35px);
	-ms-transform: translateY(35px);
	transform: translateY(35px);
	-webkit-opacity: 0;
	-moz-opacity: 0;
	opacity: 0;
}

.animated-in {
	-webkit-transform: translateY(0px);
	-moz-transform: translateY(0px);
	-o-transform: translateY(0px);
	-ms-transform: translateY(0px);
	transform: translateY(0px);
	-webkit-opacity: 1;
	-moz-opacity: 1;
	opacity: 1;
}

/*------------------------------------------------- 
                  19. Team Styles
-------------------------------------------------*/

.m-team {
	padding: 30px;
	margin-bottom: 30px;
	background: rgba(255, 255, 255, 0.85);
}

#m-team li img {
	width: 166px;
	float: left;
}

#m-team .staff-detail {
	margin-left: 200px;
}

.staff-detail h4 {
	font-size: 20px;
	color: #000;
	font-weight: 400;
	margin: 13px 0 10px;
}

.staff-detail p {
	font-size: 15px;
	color: #272727;
	font-weight: 300;
	line-height: 22px;
	margin: 0 0 20px;
}

.staff-social a {
	width: 38px;
	height: 38px;
	border: 1px solid #005511;
	background: rgba(255, 255, 255, 0.85);
	border-radius: 50%;
	line-height: 38px;
	text-align: center;
	color: #005511;
	font-size: 15px;
	margin-right: 10px;
	display: inline-block;
}

.staff-social a:hover {
	background: #005511;
	color: #fff;
	border-color: #005511;
}

.m-team h3 {
	font-size: 20px;
	text-transform: uppercase;
	color: #000;
	margin: 0 0 25px;
	text-align: center;
}

.mt-nav {
	padding: 0px;
	margin: 0 0 30px;
	display: table;
	width: 100%;
}

.mt-nav li {
	width: 25%;
	float: left;
	list-style: none;
	background: rgba(255, 255, 255, 0.85);
	margin: 0px;
	cursor: pointer;
}

.mt-nav li div {
	border: 1px solid #e2e2e2;
	border-left: none;
	padding: 23px 20px 20px;
}

.mt-nav li:first-child {
	border-left: 1px solid #e2e2e2;
}

.mt-nav li img {
	width: 74px;
	height: 74px;
	border: 10px solid #ededed;
	border-radius: 50%;
	margin: 0 auto 18px;
	display: table;
}

.mt-nav li h4 {
	font-family: 'EB Garamond', 'Palatino Linotype', serif;
	font-size: 14px;
	color: #7f7f7f;
	font-weight: 300;
	margin: 0;
	text-align: center;
}

.flex-active {
	background: #f3f3f3 !important;
}

.flex-active img {
	border-color: #dadada !important;
}

/*------------------------------------------------- 
                 20. Skills Styles
-------------------------------------------------*/

.m-skills {
	background: rgba(255, 255, 255, 0.85);
	padding: 30px 30px 11px;
	margin-bottom: 30px;
}

.m-skills h3 {
	font-size: 20px;
	text-transform: uppercase;
	color: #000;
	margin: 0 0 25px;
	text-align: center;
}

.jCProgress {
	position: relative;
	z-index: 99999999;
	margin:0 !important;
}

.jCProgress > div.percent {
	font-size: 34px;
	color: #005511;
	position: absolute;
	margin-top: 27px;
	margin-left: 28px;
	width: 147px;
	background: rgba(255, 255, 255, 0.85);
	height: 147px;
	border-radius: 50%;
	line-height: 142px;
	padding-left: 40.5px;
	font-weight: 300;
	border: 1px solid #fff;
	z-index: 99999;
}

.jCProgress > div.percent:before {
	content: "%";
	font-size: 34px;
	color: #005511;
	right: 40.5px;
	position: absolute;
	font-weight: 300;
	z-index: 9999;
}

canvas {

	position: relative;
	z-index: 9999;
}

.ms-wrap {
	padding: 5px 0px 0px;
}

.skill-wrap {
	width: 188px;
	height: 188px;
	border: 1px solid #e7e7e7;
	display: table;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.85);
	transition: .3s;
	margin:0 auto;	
}

#skill1, #skill2, #skill3 {
	margin: -18px -7px -5px;
	width: 188px;
	height: 188px;
	position: relative;
	top: 10px;
	display: table;
}

.skill-wrap:hover {
	transition: .3s;
	border: 1px solid #005511;
	background: #005511;
	cursor: pointer;
}

.skill-wrap:hover div.percent {
	font-size: 34px;
	color: #fff;
	background: #005511;
	border-color: #005511;
}

.skill-wrap:hover div.percent:before {
	content: "%";
	color: #fff;
}

.round-skills  h4 {
	font-family: 'EB Garamond', 'Palatino Linotype', serif;
	font-size: 18px;
	color: #919191;
	font-weight: 300;
	text-align: center;
	margin: 20px auto 40px;
	display:table;
}

.ms-wrap h4 {
	font-family: 'EB Garamond', 'Palatino Linotype', serif;
	font-size: 18px;
	color: #919191;
	font-weight: 300;
	text-align: center;
	margin: 20px auto 0;
	display:table;
}

.ms-wrap1 {
	padding-top: 55px;
}

.fs-wrap {
	margin-bottom: 19px;
}

.fs-wrap h4 {
	margin: 0 0 10px;
	font-family: 'EB Garamond', 'Palatino Linotype', serif;
	font-size: 14px;
	color: #000;
	font-weight: 300;
}

.fs-wrap h4 span {
	float: right;
}

.fs-bar {
	padding: 7px;
	border: 1px solid #e5e5e5;
	display: table;
	width: 100%;
}

.fs-bar span {
	background: #005511;
	height: 4px;
	display: table;
	width:0px;
	transition: 1s;
}

/*------------------------------------------------- 
                   21. Clients
-------------------------------------------------*/

.m-clients {
	padding: 30px 20px;
	margin-bottom: 30px;
	background: rgba(255, 255, 255, 0.85);
}

#m-clients .item {
	border: 1px solid #e2e2e2;
	height: 110px;
	margin: 0 10px;
	transition: .3s;
	cursor: pointer;
}

#m-clients .item img {
	display: table;
	margin: 0 auto;
	padding: 45px 0;
	opacity: 0.1;
	transition: .3s;
}

#m-clients .item:hover {
	border: 1px solid #005511;
	transition: .3s;
}

#m-clients .item:hover img {
	opacity: 1;
	transition: .3s;
}

.m-clients h3 {
	font-size: 20px;
	text-transform: uppercase;
	color: #000;
	margin: 0 0 20px;
	text-align: center;
}

#m-clients .owl-prev {
	width: 30px;
	height: 30px;
	border: 1px solid #e2e2e2;
	border-radius: 0px;
	opacity: 1;
	background: transparent;
	position: relative;
	float: left;
	font-size: 0px;
	right: -5px;
}

#m-clients .owl-next {
	width: 30px;
	height: 30px;
	border: 1px solid #e2e2e2;
	border-radius: 0px;
	opacity: 1;
	background: transparent;
	position: relative;
	float: right;
	font-size: 0px;
	right: 5px;
}

#m-clients .owl-prev:before {
	content: "\f104";
	font-family: FontAwesome;
	font-size: 18px;
	color: #000;
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0px;
	left: 0px;
}

#m-clients .owl-next:before {
	content: "\f105";
	font-family: FontAwesome;
	font-size: 18px;
	color: #000;
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0px;
	left: 0px;
}

#m-clients .owl-buttons {
	position: absolute;
	top: 0%;
	width: 100%;
	margin-top: -48px;
}

#m-clients .owl-prev:hover ,
#m-clients .owl-next:hover {
	background: #005511;
	color: #fff;
	border-color: #005511;
}

#m-clients .owl-prev:hover:before ,
#m-clients .owl-next:hover:before {
	color: #fff;
}

/*------------------------------------------------- 
               22. Blog - Single Page
-------------------------------------------------*/

#m-blog-content {
	padding: 30px;
	margin-bottom: 30px;
	background: rgba(255, 255, 255, 0.85);
}

.page-nav {
	display: table;
	padding: 35px 0 0;
	width: 100%;
	border-top: 1px solid #e6e6e6;
	margin: 0 15px;
}

.page-nav ul {
	padding: 0;
	margin: 0 auto;
	display: table;
}

.page-nav ul li {
	float: left;
	list-style: none;
	margin: 0 13px;
}

.page-nav ul li a {
	width: 31px;
	height: 33px;
	border: 1px solid #d6d6d6;
	transform: rotate(45deg);
	color: #000;
	display: table;
}

.page-nav ul li a span {
	transform: rotate(-45deg);
	display: table;
	padding: 5px;
	text-align: center;
	margin: 0 auto;
	font-weight: 300;
}

.page-nav ul li a:hover, .page-nav ul li.active a {
	border: 1px solid #005511;
	color: #fff;
	background: #005511;
}

article h4 {
	font-size: 20px !important;
	margin: 20px 0 15px !important;
}

article p {
	margin: 10px 0px 23px !important;
}

/* 22.1. Comments */

.sub-comment1 {
	padding-left: 100px;
}

.sub-comment2 {
	padding-left: 200px;
}

.sub-comment3 {
	padding-left: 300px;
}

.comments-wrap h5 {
	font-family: 'EB Garamond', 'Palatino Linotype', serif;
	font-size: 22px;
	color: #000;
	margin: 25px 0 25px;
}

.comments-wrap ul {
	padding: 0px;
}

.comments-wrap ul li {
	list-style: none;
	margin: 0 0 35px;
	display: table;
	width: 100%;
	position: relative;
}

.comments-wrap ul li img {
	float: left;
}

.comments-inner {
	margin-left: 100px;
}

.comment-author {
	font-family: 'EB Garamond', 'Palatino Linotype', serif;
	font-size: 14px;
	color: #3c3c3c;
	font-weight: 400;
	border-bottom: 1px solid #e5e5e5;
	padding-bottom: 10px;
	display: table;
	margin-bottom: -4px;
}

.comment-author span {
	color: #d1d1d1;
	margin-left: 10px;
	position: relative;
}

.comment-author span:before {
	content: "/";
	color: #d1d1d1;
	position: relative;
	left: -5px;
	font-size: 16px;
}

.comments-inner {
	position: relative;
}

.comments-inner p {
	font-size: 15px;
	color: #a3a3a3;
	line-height: 18px;
}

.sub-comment1 .comments-inner:before, 
.sub-comment2 .comments-inner:before,
.sub-comment3 .comments-inner:before {
	content: "";
	width: 40px;
	height: 40px;
	border: 1px solid #dddddd;
	border-width: 0 0 1px 1px;
	position: absolute;
	left: -160px;
}

.article-comment-form h5 {
	font-family: 'EB Garamond', 'Palatino Linotype', serif;
	font-size: 22px;
	color: #000;
	margin: 25px 0 25px;
}

.article-comment-form form input {
	height: 60px;
	border: 1px solid #eaeaea;
	width: 100%;
	padding: 15px 20px;
	padding-left: 77px;
	color: #555;
	margin-bottom: 10px;
}

.article-comment-form form span {
	height: 60px;
	border-right: 1px solid #eaeaea;
	width: 60px;
	text-align: center;
	display: table;
	margin: 0px 0px -60px;
	position: relative;
	padding: 16px 14px 0;
}

.article-comment-form form span i {
	height: 30px;
	border: 1px solid #005511;
	width: 30px;
	text-align: center;
	line-height: 28px;
	color: #005511;
	font-size: 12px;
	border-radius: 50%;
}

.article-comment-form form textarea {
	height: 130px;
	border: 1px solid #eaeaea;
	width: 100%;
	padding: 12px 17px;
	color: #555;
	margin-bottom: 10px;
}

.article-comment-form button {
	height: 60px;
	line-height: 60px;
	text-align: center;
	font-size: 14px;
	text-transform: uppercase;
	color: #fff;
	border: 2px solid #005511;
	background: #005511;
	transition: 0.3s;
	width: 100%;
}

.article-comment-form button:hover {
	color: #005511;
	border: 2px solid #005511;
	background: #fff;
	transition: 0.3s;
}
/*Custom*/

.doc1, .doc2, .doc3{
    background: rgba(255, 255, 255, 0.85);
	padding: 30px;
	margin-bottom: 30px; 
}
.doc1 img{
    width: 49%;
}

.doc1 h3{
    text-align: center;   
}    

.doc2 p{
    font-size: 16px;
}
.doc2 a{
    color: #005511;    
}
.doc3 h3{
    text-align: center;   
}
.doc3 .item{
    display: inline-block;
    width: 49.5%;
}
.doc3 .mb-thumb{
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 80%;
}
.doc3 img{
    width: 100%;
}
.doc3 .rmore a {
    padding: 9px 18px;
    background: #005511;
    display: table;
    margin: 70% auto 0px;
    font-family: 'EB Garamond', 'Palatino Linotype', serif;
    font-size: 18px;
    color: #FFF;
    position: relative;
    top: -10%;
    font-weight: 300;
    border: 1px solid #005511;
}
.doc3 img:hover {
    transition: 0.3s;
    opacity: 1;
    visibility: visible;
    width: 100%;
    height: 100%;
    top: 0%;
    left: 0%;
}
.doc3 .item:hover .rmore {
    transition: 0.3s;
    opacity: 1;
    visibility: visible;
    width: 100%;
    height: 100%;
    top: 0%;
    left: 0%;
}
/*------------------------------------------------- 
               23. Contact Page
-------------------------------------------------*/

#contact-form {
	background: rgba(255, 255, 255, 0.85);
	padding: 30px;
	margin-bottom: 30px;
}

#contact-form h3 {
	font-size: 16px;
	text-transform: uppercase;
	color: #000;
	font-weight: 400;
	margin: 0 0 24px;
}

#contact-form .mc-name input ,
#contact-form .mc-email input ,
#contact-form .mc-website input {
	border-bottom: 2px solid #005511;
	color: #bcbcbc;
}

#contact-form form input::-webkit-input-placeholder {color: #b8b8b8 !important;opacity: 1 !important;}
#contact-form form input:-moz-placeholder {color: #b8b8b8 !important;opacity: 1 !important;}
#contact-form form input::-moz-placeholder {color: #b8b8b8 !important;opacity: 1 !important;}
#contact-form form input:-ms-input-placeholder {color: #b8b8b8 !important;opacity: 1 !important;}

#contact-form form textarea::-webkit-input-placeholder {color: #b8b8b8 !important;opacity: 1 !important;}
#contact-form form textarea:-moz-placeholder {color: #b8b8b8 !important;opacity: 1 !important;}
#contact-form form textarea::-moz-placeholder {color: #b8b8b8 !important;opacity: 1 !important;}
#contact-form form textarea:-ms-input-placeholder {color: #b8b8b8 !important;opacity: 1 !important;}

#contact-form .mc-name span ,
#contact-form .mc-email span ,
#contact-form .mc-website span {
	border: 2px solid #005511;
	background: rgba(255, 255, 255, 0.85);
	color: #005511;
}

#contact-form .mc-message textarea {
	border: 2px solid #005511;
	color: #666;
}

#contact-form .mc-name input:focus ,
#contact-form .mc-email input:focus ,
#contact-form .mc-website input:focus {
	border-color: #000000;
	color: #000;
	outline: none;
}

#contact-form .mc-message textarea:focus {
	border: 2px solid #000000;
	color: #000;
	outline: none;
}

#contact-form .mc-name input:focus + span ,
#contact-form .mc-email input:focus + span ,
#contact-form .mc-website input:focus + span {
	background: #005511;
	color: #fff;
	border-color: #005511;
}

#contact-form .mc-message button {
	width: 59px;
	height: 128px;
	border: solid 2px #005511;
	background: transparent;
	transition: 0.3s;
	color: #005511;
	font-weight: bold;
	text-transform: uppercase;
	font-size: 17px;
	position: absolute;
	top: 12px;
	right: 12px;
}

#contact-form .mc-message button:hover {
	border: solid 2px #005511;
	background: #005511;
	color: #fff;
}

/* 23.1. Map Styles */

.gmap {
	padding: 0px;
	height: 400;
}

.gmap div {
	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
	box-sizing: content-box;
}

#map {
	display: block;
	width: 100%;
	height: 417px;
	margin: 0 auto;
}

#map.large {
	height: 417px;
}

#map img {
	max-width: none !important;
	height: auto;
}

.cf-info {
	margin: 30px 0 0;
	padding: 25px 0 0;
	border-top: 1px solid #e8e8e8;
}

.cf-info h3 {
	font-size: 16px;
	text-transform: uppercase;
	color: #000;
	font-weight: 400;
	margin: 0 0 15px !important;
}

.cf-info p {
	font-size: 15px;
	color: #272727;
	font-weight: 300;
	line-height: 22px;
	margin: 0 0 25px;
}

.cf-info ul {
	padding: 0px;
	margin: 0 -2%;
}

.cf-info ul li {
	padding: 35px 25px 30px;
	color: #005511;
	border: 2px solid #005511;
	margin: 0 2%;
	list-style: none;
	float: left;
	width: 29.333333%;
	transition: .3s;
	cursor: pointer;
}

.cf-info ul li span {
	width: 36px;
	height: 38px;
	transform: rotate(45deg);
	background: #005511;
	color: #FFF;
	display: table;
	padding: 10px;
	margin: 0 auto 20px;
	transition: .3s;
}

.cf-info ul li span i {
	transform: rotate(-45deg);
	display: table;
	font-size: 18px;
}

.cf-info ul li h5 {
	font-family: 'EB Garamond', 'Palatino Linotype', serif;
	font-size: 15px;
	color: #005511;
	margin: 0;
	font-weight: 400;
	text-align: center;
	transition: .3s;
}

.cf-info ul li:hover {
	border: 2px solid #005511;
	background: #005511;
	transition: .3s;
}

.cf-info ul li:hover  span {
	background: rgba(255, 255, 255, 0.85);
	color: #005511;
	display: table;
	padding: 10px;
	margin: 0 auto 20px;
	transition: .3s;
}

.cf-info ul li:hover h5 {
	color: #fff;
	transition: .3s;
}

/*------------------------------------------------- 
               24. Sidebar Styles
-------------------------------------------------*/

.r-posts {
	border-bottom: 1px solid #1a1a1a;
}

.r-posts ul {
	padding: 0;
	margin: 0;
}

.r-posts ul li {
	list-style: none;
	display: table;
	margin-bottom: 20px;
}

.r-posts ul li img {
	width: 60px;
	float: left;
}

.r-posts ul li h4 {
	font-family: 'EB Garamond', 'Palatino Linotype', serif;
	font-size: 12px;
	color: #fff;
	font-weight: 400;
	margin: 0 0 5px;
	margin-left: 80px;
	line-height: 15px;
	letter-spacing: 1px;
}

.r-posts ul li h4 a {
	color: #fff;
}

.r-posts ul li h4 a:hover {
	color: #585858;
}

.r-posts h5 {
	font-size: 16px;
	text-transform: uppercase;
	color: #fff;
	font-weight: 400;
	margin: 0 0 25px;
}

aside {
	background: #000000;
	padding: 20px;
	margin: -30px 0 30px;
	display: table;
	width: 100%;
}

.rp-meta {
	font-size: 11px;
	color: #585858;
	margin-left: 80px;
}

.rp-meta i {
	font-size: 13px;
	margin-right: 8px;
}

.m-tags h5 {
	font-size: 16px;
	color: #fff;
	font-weight: 400;
	margin: 17px 0 20px;
}

.m-about h5 {
	font-size: 16px;
	color: #fff;
	font-weight: 400;
	margin: 17px 0 15px;
}

.m-tags {
	border-bottom: 1px solid #1a1a1a;
	padding-bottom: 10px;
	display: table;
}

.m-tags ul {
	padding: 0;
	margin: 0 -5px;
}

.m-tags ul li {
	float: left;
	list-style: none;
	margin: 0 5px 10px;
}

.m-tags ul li a {
	font-size: 12px;
	color: #fff;
	padding: 5px 10px;
	border: 1px solid #333333;
	display: table;
}

.m-tags ul li a:hover {
	color: #fff;
	background: #333;
}

.m-about p {
	font-size: 15px;
	color: #4b4b4b;
	line-height: 22px;
} 

.menu-effect a::before {
	position: absolute;
	top: 6px;
	left: 0;
	overflow: hidden;
	padding: 10px 0 15px;
	max-width: 0;
	width:0%;
	border-bottom: 2px solid #fff;
	color: #fff;
	content: attr(data-hover);
	-webkit-transition: max-width 0.5s;
	-moz-transition: max-width 0.5s;
	transition: max-width 0.5s;
}

.menu-effect a:hover::before,
.menu-effect a:focus::before {
	max-width: 100%;
	width:100%;
}
.contactMe .msg {display:none;padding:12px 20px 12px 40px;font-size:12px;line-height:16px;text-transform:uppercase;word-break:break-word;margin:20px 0 10px 0;background-repeat:no-repeat;background-size:20px 20px;background-position:left 12px top 12px;}
.contactMe .msg.error {color:#FFF;background-color:#FFA12A;background-image:url(../imgs/x.png);}
.contactMe .msg.success {color:#FFF;background-color:#00D466;background-image:url(../imgs/tick.png);}
.contactMe .msg strong {color:inherit;}