/* TABLE OF CONTENTS
	1. Header
	2. Cards
	3. Card - About
	4. Card - Resume
	5. Card - Works
	6. Card - Blog
	7. Card - Contacts
	8. Popups
*/

/*
	1. Header
*/
.header { position: fixed; top: 0; left: 0; width: 44px; height: 100%; z-index: 113; text-align: center; background: #181818; }
.header:before { content: ''; position: absolute; right: -1px; top: 0; width: 1px; height: 100%; background: rgba(255, 255, 255, 0.05); }
.header .logo { position: relative; padding: 0; background: #5ac24e; text-align: center; }
.header .logo a { display: block; height: 58px; line-height: 58px; color: #ffffff; text-decoration: none; }
.header .logo a:before { content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: linear-gradient(135deg, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0) 100%); }
.header .logo a img { position: relative; font-family: 'Cormorant Garamond'; font-size: 28px; font-weight: 700; text-transform: uppercase; padding-top: 14px; z-index: 2; }
.header .top-menu { margin-top: 12px; width: 100%; font-size: 0; }
.header .top-menu ul li { display: block; }
.header .top-menu ul li a { margin: 8px 0; position: relative; display: block; color: #ffffff; text-align: center; }
.header .top-menu ul li a .icon { margin: 0; display: block; height: 32px; line-height: 32px; font-size: 21px; color: #a9a9a9; border-radius: 30px; -moz-border-radius: 30px; -webkit-border-radius: 30px; -khtml-border-radius: 30px; transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; }
.header .top-menu ul li a .link { margin: -11px 0 0 0; padding: 0 8px; position: absolute; left: 120%; top: 50%; height: 22px; line-height: 22px; font-size: 12px; color: #ffffff; font-weight: 300; background: #181818; opacity: 0; visibility: hidden; pointer-events: none; border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; transform: translateX(-10px); -webkit-transform: translateX(-10px); -moz-transform: translateX(-10px); -o-transform: translateX(-10px); }
.header .top-menu ul li a .link:before { margin-top: -5px; content: ''; position: absolute; left: -10px; top: 50%; border: 5px solid transparent; border-right: 5px solid #111; }
 @media (max-width: 560px) {
.header .top-menu ul li a .link { display: none; }
}
.header .top-menu ul li:hover a { color: #ffffff; }
.header .top-menu ul li:hover a .icon { color: #ffffff; }
.header .top-menu ul li:hover a .link { transform: translateX(0px); -webkit-transform: translateX(0px); -moz-transform: translateX(0px); -o-transform: translateX(0px); opacity: 1; visibility: visible; }
.header .top-menu ul li.active a { color: #5ac24e; }
.header .top-menu ul li.active a .icon { color: #5ac24e; }
.header .social { position: absolute; left: 0; bottom: 10px; width: 100%; }
.header .social a { margin: 6px 0; display: block; }
.header .social a .icon { margin: 0; display: block; height: 26px; line-height: 26px; font-size: 17px; color: #a9a9a9; transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; }
.header .social a:hover .icon { color: #5ac24e; }
 @media (max-width: 1023px) {
.header { top: 0; left: 0; width: 100%; height: 58px; background: #181818; }
.header.opened .top-menu { opacity: 1; visibility: visible; }
.header.opened .menu-btn .m-line { background: none; }
.header.opened .menu-btn .m-line:before { top: 0; bottom: auto; transform: rotate(45deg); -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); }
.header.opened .menu-btn .m-line:after { top: auto; bottom: 0; transform: rotate(-45deg); -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -o-transform: rotate(-45deg); }
.header:before { display: none; }
.header .logo { width: 50px; float: left; }
.header .top-menu { position: absolute; left: 0; top: 58px; margin-top: 0; width: 100%; background: #202020; opacity: 0; visibility: hidden; transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; }
.header .top-menu ul li { display: inline-block; }
.header .top-menu ul li a { margin: 0; }
.header .top-menu ul li a .icon { margin: 0; display: block; width: 50px; height: 58px; line-height: 56px; }
.header .social { position: absolute; left: auto; right: 70px; bottom: auto; top: 0; width: auto; }
.header .social a { margin: 0; display: inline-block; }
.header .social a .icon { margin: 0; width: 30px; height: 58px; line-height: 56px; }
.header .menu-btn { position: absolute; top: 0; right: 0; width: 58px; height: 58px; background: #202020; cursor: pointer; }
.header .menu-btn .m-line { margin: -1px 0 0 -10px; position: absolute; left: 50%; top: 50%; width: 22px; height: 2px; background: #a9a9a9; }
.header .menu-btn .m-line:before,  .header .menu-btn .m-line:after { content: ''; position: absolute; left: 0; top: -7px; width: 100%; height: 2px; background: #a9a9a9; transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; }
.header .menu-btn .m-line:after { top: auto; bottom: -7px; }
.header .top-menu ul li a .link { display: none; }
.header .top-menu ul li:hover a .link { transform: none; -webkit-transform: none; -moz-transform: none; -o-transform: none; opacity: 0; visibility: hidden; }
}
/*
	2. Cards
*/
.card-inner { padding-left: 44px; position: absolute; overflow: hidden; left: 0; top: 0; width: 100%; height: 100%; z-index: 111; visibility: hidden; opacity: 0; }
.card-inner.active { visibility: visible; opacity: 1; z-index: 112; }
.card-inner.card-started { text-align: center; }
.card-inner.card-started .slide { position: absolute; overflow: hidden; left: 0; top: 0; width: 100%; height: 100%; background-color: #262628; background-repeat: no-repeat; background-position: center center; background-size: cover; }
.card-inner.card-started .slide:after { content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: #181818; opacity: 0.6; }
.card-inner.card-started .title { font-family: 'Monoton', cursive; margin: 0 0 50px 0; font-size: 155px; line-height: 160px; font-weight: 400; letter-spacing: 10px; color: #5ac24e; }
.card-inner.card-started .title span { padding-right: 15px; opacity: 0.4; }
.card-inner.card-started .subtitle { margin: 0; font-size: 20px; line-height: 20px; font-weight: 200; }
.card-inner.card-started .subtitle p { margin: 0; }
.card-inner.card-started .subtitle strong { color: #ffffff; }
 @media (max-width: 560px) {
.card-inner.card-started { text-align: center; }
.card-inner.card-started .title span { padding-right: 0; }
.card-inner.card-started .subtitle { margin: 0 0 0 0; font-size: 18px; line-height: 18px; }
}
.card-inner .card-container { height: 100%; }
.card-inner .card-container .card-wrap { background: linear-gradient(135deg, #1d1e21 0%, #3e4246 100%); }
.card-inner .card-container .card-wrap .simplebar-scroll-content { max-height: 100%!important; }
.card-inner .card-wrap { position: relative; overflow-x: hidden; overflow: hidden; -webkit-overflow-scrolling: touch; height: 100%; display: block; }
.card-inner .card-wrap .simplebar-content { overflow: hidden; padding: 30px 0!important; }
.card-inner .card-wrap .title { margin: 0; position: relative; font-size: 24px; line-height: 30px; color: #ffffff; font-weight: 700; }
.card-inner .card-wrap .title span { color: #5ac24e; }
.card-inner .card-wrap .pricetitle { margin: 0; position: relative; font-size: 24px; line-height: 30px; color: #ffffff; font-weight: 700; text-align: center; }
.card-inner .card-wrap .pricetitle2 { margin: 0; position: relative; font-size: 24px; line-height: 30px; color: #ffffff; font-weight: 700; text-align: center; }
.card-inner .card-wrap .pricetitle span, .card-inner .card-wrap .pricetitle2 span { color: #5ac24e; }
 @media (max-width: 560px) {
.card-inner .card-wrap .title { text-align: center; font-size: 19px; line-height: 24px; padding-top: 20px; }
.card-inner .card-wrap .pricetitle { font-size: 19px; line-height: 24px; text-align: center; }
.card-inner .card-wrap .pricetitle2 { font-size: 19px; line-height: 24px; text-align: center; padding-top: 20px; }
.lnk, .button { font-size: 14px; }
}
.card-inner .card-image { position: fixed; overflow: hidden; right: -22px; top: 0; width: 100%; height: 100%; background-color: #262628; background-repeat: no-repeat; background-position: top center; background-size: cover; }
.card-inner .card-image:before { content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: #181818; opacity: 0.15; }
 @media (max-width: 1330px) {
.card-inner .card-image { right: -16px; }
}
 @media (max-width: 1023px) {
.card-inner .card-image { position: relative; top: -30px; right: 0; height: 50vh; }
.card-inner.card-started .title { font-size: 46px !important; line-height: 50px !important; }
.service-items .service-item .name { font-size: 16px; color: #ffffff; font-weight: 700; }
}
 @media (max-width: 560px) {
.card-inner .card-image { height: 50vh; }
.card-inner.card-started .title { font-size: 46px !important; line-height: 50px !important; }
}
 @media screen and (orientation: landscape) and (max-width: 820px) {
.card-inner .card-image { height: 100vh; }
}
.card-inner .card-box { position: relative; padding: 30px; background: rgba(255, 255, 255, 0.05); box-shadow: 0 0 50px rgba(0, 0, 0, 0.2); -moz-box-shadow: 0 0 50px rgba(0, 0, 0, 0.2); -webkit-box-shadow: 0 0 50px rgba(0, 0, 0, 0.2); -khtml-box-shadow: 0 0 50px rgba(0, 0, 0, 0.2); border-radius: 18px; -moz-border-radius: 18px; -webkit-border-radius: 18px; -khtml-border-radius: 18px; transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; }
.card-inner .card-box:hover { box-shadow: 0 15px 55px rgba(0, 0, 0, 0.3); -moz-box-shadow: 0 15px 55px rgba(0, 0, 0, 0.3); -webkit-box-shadow: 0 15px 55px rgba(0, 0, 0, 0.3); -khtml-box-shadow: 0 15px 55px rgba(0, 0, 0, 0.3); }
 @media (max-width: 1023px) {
.card-inner { padding-left: 0; }
}
/* content */
.content { margin: 0; padding: 70px 0 0 0; position: relative; }
.content.pricing.pt1 { margin: 0; padding: 0; position: relative; }
 @media (max-width: 560px) {
.content { padding: 0; }
.content.inner-top { padding-top: 15px; }
}
/*
	3. Card - About
*/
/* 3.1 Inner Top */
.content.inner-top { text-align: center; }
.content.inner-top .title-bg { position: absolute; overflow: hidden; left: 0; top: -50px; width: 100%; font-size: 120px; line-height: 120px; color: #ffffff; text-transform: uppercase; font-weight: 700; letter-spacing: 0.04em; text-align: center; white-space: nowrap; pointer-events: none; opacity: 0.05; }
.content.inner-top .text p { margin: 0 0 30px 0; font-size: 23px; font-weight: 200; }
.content.inner-top .text p strong { color: #5ac24e; }
.content.inner-top .circle-bts a { margin: 0 8px; display: inline-block; vertical-align: top; min-width: 44px; height: 44px; background: rgba(255, 255, 255, 0.05); text-align: center; box-shadow: 0 0 25px rgba(0, 0, 0, 0.2); -moz-box-shadow: 0 0 25px rgba(0, 0, 0, 0.2); -webkit-box-shadow: 0 0 25px rgba(0, 0, 0, 0.2); -khtml-box-shadow: 0 0 25px rgba(0, 0, 0, 0.2); border-radius: 44px; -moz-border-radius: 44px; -webkit-border-radius: 44px; -khtml-border-radius: 44px; transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; }
.content.inner-top .circle-bts a .icon { position: relative; display: inline-block; vertical-align: middle; font-size: 22px; line-height: 42px; color: #fff; transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; }
.content.inner-top .circle-bts a span { padding: 0 24px; display: inline-block; vertical-align: top; line-height: 44px; font-size: 14px; color: #ffffff; font-weight: 700; transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; }
.content.inner-top .circle-bts a span .icon { top: -2px; margin-right: 5px; }
.content.inner-top .circle-bts a:hover { box-shadow: 0 5px 35px rgba(0, 0, 0, 0.2); -moz-box-shadow: 0 5px 35px rgba(0, 0, 0, 0.2); -webkit-box-shadow: 0 5px 35px rgba(0, 0, 0, 0.2); -khtml-box-shadow: 0 5px 35px rgba(0, 0, 0, 0.2); }
.content.inner-top .circle-bts a:hover .icon { color: #5ac24e; }
.content.inner-top .circle-bts a:hover span { color: #5ac24e; }
.middle { padding: 12px 0px; }
@media (max-width: 560px) {
.middle { padding: 0px; }
.brk { display: block; }
.content.inner-top .title-bg { top: -30px; font-size: 60px; line-height: 140px; }
.content.inner-top .text { padding-top: 15px; }
.content.inner-top .text p { margin: 0 0 30px 0; font-size: 19px; }
.content.inner-top .text p br.hide { display: none; }
.content.inner-top .circle-bts a:first-child { margin-bottom: 15px; }
}
/* 3.2 Services */
.service-items { font-size: 0; }
.service-items .service-item { text-align: left; }
.service-items .service-item .icon { margin: 0; width: auto; height: 50px; line-height: 50px; font-size: 50px; color: #5ac24e; vertical-align: middle; }
.service-items .service-item .icon span { margin: 0; width: 20px; font-size: 30px; color: #5ac24e; }
.service-items .service-item .name { margin: 10px 0 10px 0; font-size: 18px; color: #ffffff; font-weight: 700; }
.service-items .service-item p { margin: 0; }
/* 3.3 Pricing */
@media (max-width: 560px) {
.service-items .service-item .name { font-size: 16px; }
.pricing-items .pricing-item .name { font-size: 16px; }
}
.pricing-items { font-size: 0; }
.pricing-items .pricing-item { text-align: center; }
.pricing-items .pricing-item .icon { margin: 0 auto; width: auto; height: 60px; line-height: 60px; font-size: 60px; color: #5ac24e; text-align: center; }
.pricing-items .pricing-item .icon .plus-sign { padding-bottom: 6px; }
.pricing-items .pricing-item .name { margin: 10px 0 30px 0; font-size: 18px; color: #ffffff; font-weight: 700; text-transform: uppercase; }
.pricing-items .pricing-item .amount { margin: 0 0 30px 0; }
.pricing-items .pricing-item .amount .number { margin: 0; position: relative; display: inline-block; vertical-align: middle; font-size: 42px; line-height: 26px; font-weight: 600; color: #ffffff; }
.pricing-items .pricing-item .amount .dollar, .pricing-items .pricing-item .amount .period { margin: 0 3px; position: relative; bottom: 7px; display: inline-block; vertical-align: top; font-size: 20px; font-weight: 400; }
.pricing-items .pricing-item .amount .period { bottom: auto; top: 4px; vertical-align: bottom; font-size: 14px; }
.pricing-items .pricing-item .feature-list ul li { padding: 5px 0; font-size: 15px; color: #ffffff; }
.pricing-items .pricing-item .feature-list ul li:last-child { border-bottom: none; }
.pricing-items .pricing-item .feature-list ul li.disable { text-decoration: line-through; color: rgba(153, 153, 153, 0.5); }
.pricing-items .pricing-item .feature-list ul li.disable strong { opacity: 0.5; }
.pricing-items .pricing-item .feature-list ul li strong { margin: 0 0 0 5px; padding: 0 5px; display: inline-block; vertical-align: middle; font-size: 12px; color: #181818; background: #5ac24e; font-weight: 300; border-radius: 2px; -moz-border-radius: 2px; -webkit-border-radius: 2px; -khtml-border-radius: 2px; }
.pricing-items .pricing-item .lnks .lnk { float: none; width: 100%; display: block; }
.pricing-items .pricing-item .lnks .lnk span { color: #5ac24e; }
/* 3.4 Fun Fact */
.fuct-items { font-size: 0; }
.fuct-items .fuct-item { padding: 12px; position: relative; text-align: center; min-height: 124px; }
.fuct-items .fuct-item .icon { margin: 5px auto; width: 40px; height: 40px; line-height: 40px; font-size: 40px; color: #5ac24e; text-align: center; }
.fuct-items .fuct-item .name { margin: 5px 0 0 0; font-size: 14px; color: #ffffff; font-weight: 700; }
/* 3.5 Clients */
.client-items { font-size: 0; }
.client-items .client-item { padding: 14px; font-size: 0; text-align: center; }
.client-items .client-item img { max-width: 100%; opacity: 0.6; transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; }
.client-items .client-item:hover img { opacity: 1; }
/*
	4. Card - Resume
*/
.content.resume { margin-top: 0; padding-top: 70px; }
.content.resume .title { padding: 0 0 32px 0; }
 @media (max-width: 560px) {
.content.resume .row .col:first-child { margin-bottom: 20px; }
.content.resume { margin-top: 0; padding-top: 15px; }
.content.resume .title { padding: 15px 0 32px 0; }
}
/* 4.1 Resume */

.resume-items { font-size: 0; }
.resume-items .resume-item { position: relative; padding: 30px 0; }
.resume-items .resume-item:first-child { padding-top: 0; }
.resume-items .resume-item:first-child:before { display: none; }
.resume-items .resume-item:last-child { padding-bottom: 0; }
.resume-items .resume-item:before { content: ''; position: absolute; left: -30px; top: 0; right: -30px; height: 1px; background: rgba(255, 255, 255, 0.1); }
.resume-items .resume-item.active .date { color: #5ac24e; }
.resume-items .resume-item .name { margin: 0 0 5px 0; font-size: 18px; color: #ffffff; font-weight: 700; }
.resume-items .resume-item .date { margin: 0 0 15px 0; padding: 0; position: relative; display: inline-block; font-size: 12px; line-height: 12px; color: #777777; font-weight: 400; }
.resume-items .resume-item .date span { padding: 0 5px; display: inline-block; }
.resume-items .resume-item p { margin: 0; }
/* 4.2 Skills */
.content.skills .title { padding: 0 0 32px 0; }
 @media (max-width: 560px) {
.content.skills .row .col:first-child { margin-bottom: 20px; }
.resume-items .resume-item .name { font-size: 16px; }
}
.skills-list.card-box { padding: 0; }
.skills-list ul { margin: 0; padding: 0; list-style: none; }
.skills-list ul li { position: relative; padding: 20px 30px; border-bottom: 1px solid rgba(255, 255, 255, 0.1); }
.skills-list ul li:last-child { border: none; }
.skills-list ul li .name { margin: 0 0 10px 0; font-size: 14px; line-height: 14px; color: #ffffff; font-weight: 700; }
.skills-list ul li .progress { position: relative; display: block; width: 100%; height: 6px; background: rgba(255, 255, 255, 0.1); }
.skills-list ul li .progress .percentage { position: absolute; left: 0; top: 0; width: 0%; height: 100%; background: #5ac24e; transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; }
/*
	5. Card - Works
*/
.content.works { margin-top: -10px; padding-top: 0; }
.content.works .title { padding: 0 0 32px 0; }
.content.works .filter-menu { text-align: right; }
.content.works .filter-menu .f_btn { margin: 0 0 0 15px; padding: 0; position: relative; display: inline-block; vertical-align: top; height: 40px; font-size: 14px; color: #ffffff; font-weight: 700; cursor: pointer; border: none; }
.content.works .filter-menu .f_btn.active { color: #5ac24e; }
.content.works .filter-menu .f_btn label { cursor: pointer; }
 @media (max-width: 560px) {
.content.works .filter-menu { text-align: left; }
.content.works .filter-menu .f_btn { margin: 0 15px 0 0; height: 30px; width: 100%; }
.content.works .title { padding:0; }
}
/* 5.1 Box Items */
.box-item { position: relative; overflow: hidden; text-align: center; }
.box-item.card-box { padding: 0; }
.box-item .image { position: relative; overflow: hidden; }
.box-item .image a { display: block; font-size: 0; }
.box-item .image a img { position: relative; width: 100%; height: auto; border-radius: 18px 18px 0 0; -moz-border-radius: 18px 18px 0 0; -webkit-border-radius: 18px 18px 0 0; -khtml-border-radius: 18px 18px 0 0; transition: all 0.5s ease 0s; -moz-transition: all 0.5s ease 0s; -webkit-transition: all 0.5s ease 0s; -o-transition: all 0.5s ease 0s; }
.box-item .image .info { position: absolute; left: 0; top: 0; width: 100%; height: 100%; display: block; opacity: 0; text-align: center; transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; }
.box-item .image .info:before, .box-item .image .info:after { content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: #5ac24e; opacity: 0.4; transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; border-radius: 18px 18px 0 0; -moz-border-radius: 18px 18px 0 0; -webkit-border-radius: 18px 18px 0 0; -khtml-border-radius: 18px 18px 0 0; }
.box-item .image .info:after { background: linear-gradient(135deg, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0) 100%); }
.box-item .image .info .icon { margin: -16px 0 0 -16px; position: absolute; left: 50%; top: 50%; width: 50px; height: 50px; font-size: 50px; line-height: 50px; color: #ffffff; transition: all 0.1s ease-in 0.4s; -moz-transition: all 0.1s ease-in 0.4s; -webkit-transition: all 0.1s ease-in 0.4s; -o-transition: all 0.1s ease-in 0.4s; }
.box-item .desc { padding: 15px; position: relative; border-top: 1px solid rgba(255, 255, 255, 0.1); }
.box-item .desc .name { margin: 0; display: block; font-size: 16px; color: #ffffff; font-weight: 700; }
.box-item .desc .category { margin: 0; padding: 0; position: relative; display: inline-block; font-size: 12px; line-height: 12px; color: #777777; font-weight: 400; }
.box-item .date { padding: 10px 0 0 0; position: absolute; left: 20px; bottom: 20px; width: 50px; height: 50px; font-size: 11px; line-height: 11px; color: #181818; text-align: center; font-weight: 500; text-transform: uppercase; background: #ffffff; }
.box-item .date strong { display: block; font-size: 23px; line-height: 23px; color: #181818; font-weight: 700; }
.box-item:hover .image img { transform: scale(1.08); -webkit-transform: scale(1.08); -moz-transform: scale(1.08); -o-transform: scale(1.08); }
.box-item:hover .image .info { opacity: 1; }
/*
	6. Card - Blog
*/
.content.blog { margin-top: -10px; padding-top: 0; }
/*
	7. Card - Contacts
*/
.content.contacts-info { margin-top: -10px; padding-top: 0; }
.content.contacts-info .title { padding: 0 0 32px 0; }
.contacts-items { font-size: 0; }
.contacts-items .contacts-item { min-height: 87px; text-align: left; }
.contacts-items .contacts-item.card-box { padding: 20px 20px 20px 75px; }
.contacts-items .contacts-item .icon { margin: 0; position: absolute; left: 20px; top: 20px; width: 40px; height: 40px; line-height: 40px; font-size: 40px; color: #5ac24e; }
.contacts-items .contacts-item .name { margin: 0; font-size: 16px; line-height: 20px; color: #ffffff; font-weight: 700; }
.contacts-items .contacts-item p { margin: 0; }
 @media (max-width: 1023px) {
.contacts-items.card-box { padding: 20px 30px 20px 85px; }
.contacts-items .icon { left: 30px; }
}
@media (max-width: 720px) {
.contacts-items .contacts-item p { margin: 0; font-size: 12px; line-height: 14px; }
.contacts-items .contacts-item { min-height: auto; text-align: left; }
.content.contacts-info .title { padding: 0; }
}
.map { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.contact_form.card-box { padding: 15px 30px; margin-bottom: 0; }
.contact_form .row { margin: 0 -30px; }
 @media (max-width: 1023px) {
.contact_form.card-box { padding: 14px; margin-bottom: 0; }
.contact_form .row { margin: 0; }
.contact_form .button { margin: 0 16px; }
}
.alert-success, .alert-error { display: none; }
.alert-success p, .alert-error p { margin: 0; font-size: 20px; }
.questionnaire-form { font-size: 16px; line-height: 20px; }
.questionnaire-form a { color: #5ac24e; }
.questionnaire-form a:hover { text-decoration:underline; }
.element { float: left; width: 100%; font-size: 0; padding-bottom: 10px; }
.fileattachement input { border:0 !important; float: left; width: 30%; height: auto; }
.add { margin: 10px; height: 2.8rem; vertical-align: top;}
.remove { margin:10px; height: 2.8rem; vertical-align: top;}
.add-sign, .remove-sign { width: 18px; display: inline-block; height: 2.8rem; vertical-align: middle;  }
.submit-btn { display: inline-block; border: 0; width:auto ; text-align: left; height: auto; font-size: 16px; font-weight: bold; }
.submit-btn:hover { color: #5ac24e; }
.button { height: auto; line-height: normal; }
.submit-btn:focus { border-bottom: 0; }
.inputfile {  
    width: 0.1px;
    height: 0.1px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    z-index: -1;
    
}
.inputfile + label {
    max-width: calc(100% - 50px) !important;
    max-width: -webkit-calc(100% - 50px) !important;
    max-width: -moz-calc(100% - 50px) !important;
    border-radius: 4px;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
    cursor: pointer;
    display: inline-block;
    overflow: hidden;
    padding: 0.625rem 1.25rem;
    /* 10px 20px */
}
.inputfile:focus + label,
.inputfile.has-focus + label {
    outline: 1px dotted #000;
    outline: -webkit-focus-ring-color auto 5px;
}
.inputfile + label svg {
    width: 1em;
    height: 1em;
    vertical-align: middle;
    fill: currentColor;
    margin-top: -0.25em;
    /* 4px */
    margin-right: 0.25em;
    /* 4px */
    
}
.inputfile-6 + label {
    color: #5ac24e;
}

.inputfile-6 + label {
    border: 2px solid #5ac24e;
    background-color: transparent;
    padding: 0;
    width: 100%;
    float: left;
}
.inputfile-6:focus + label,
.inputfile-6.has-focus + label,
.inputfile-6 + label:hover {
    border-color: #5ac24e;
}

.inputfile-6 + label span,
.inputfile-6 + label strong {
    padding: 0.625rem 1.25rem;
}

.inputfile-6 + label span {
    max-width: calc(100% - 150px);
    max-width: -webkit-calc(100% - 150px);
    max-width: -moz-calc(100% - 150px);
    min-height: 2.8em;
    display: inline-block;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    vertical-align: top;
}

.inputfile-6 + label strong {
    height: 100%;
    color: #ffffff;
    background-color: #5ac24e;
    display: inline-block;
    float:left;
}

.inputfile-6:focus + label strong,
.inputfile-6.has-focus + label strong,
.inputfile-6 + label:hover strong {
    background-color: #5ac24e;
}
@media (max-width: 480px) {  
    .questionnaire-form { font-size: 13px; line-height: 18px; }
    .alert-success p, .alert-error p { margin: 0; font-size: 12px; }
    .add { margin: 8px; }
    .remove { margin:8px; }
    .add-sign, .remove-sign { width: 12px; }
    .submit-btn { font-size: 14px; }
    .upload { display: none; }
    .inputfile + label {
        max-width: calc(100% - 30px) !important;
        padding: 0.625rem 1.25rem;
        /* 10px 20px */
    }
    .inputfile-6 + label {
        padding: 0;
        font-size: 12px;
    }
    .inputfile-6:focus + label,
    .inputfile-6.has-focus + label,
    .inputfile-6 + label:hover {
        border-color: #5ac24e;
    }
    
    .inputfile-6 + label span,
    .inputfile-6 + label strong {
        padding: 0.625rem 1rem;
    }
    .send-message { padding-top: 0 !important; text-align: center; }
}


/*
	8. Popups
*/
.mfp-wrap.popup-box-inline { margin: 0 0 0 -360px; padding: 0; top: 0; left: 50%; overflow: auto; width: 720px; height: 100%; background: linear-gradient(135deg, #1d1e21 0%, #3e4246 100%); }
.mfp-wrap.popup-box-inline .mfp-container { padding: 0; position: relative; height: auto; }
.mfp-wrap.popup-box-inline .content { padding-top: 0; margin-bottom: 40px; }
.mfp-wrap.popup-box-inline .image { padding: 60px 40px 40px 40px; font-size: 0; }
.mfp-wrap.popup-box-inline .image img { width: 100%; height: auto; }
.mfp-wrap.popup-box-inline .desc { padding: 0 40px; }
.mfp-wrap.popup-box-inline .desc .post-box .blog-content { margin: 0; }
.mfp-wrap.popup-box-inline .desc .lnk, .mfp-wrap.popup-box-inline .desc .button { height: 30px; line-height: 30px; }
 @media (max-width: 720px) {
.mfp-wrap.popup-box-inline { left: 44px; right: 0; width: auto; margin: 0; padding: 0 10px; }
.mfp-wrap.popup-box-inline .image { padding: 60px 0 20px 0; }
.mfp-wrap.popup-box-inline .desc { padding: 0; }
}
.mfp-wrap.popup-box .mfp-close, .mfp-wrap.popup-box-inline .mfp-close { padding: 0; right: -54px; top: 0; width: 54px; height: 54px; line-height: 54px; font-family: 'Poppins'; color: #ffffff; font-size: 42px; font-weight: 300; text-align: center; opacity: 1; }
 @media (max-width: 720px) {
.mfp-wrap.popup-box .mfp-close,  .mfp-wrap.popup-box-inline .mfp-close { right: 0; top: -54px; }
}
.mfp-wrap.popup-box-inline .mfp-close { top: 0; right: 0; color: #ffffff; }
 @media (max-width: 720px) {
.mfp-wrap.popup-box-inline .mfp-close { right: 0; top: 0; }
}
.card-inner.blog-post { -webkit-animation: none; animation: none; }
/*demo panel*/

.theme_panel { position: fixed; right: -166px; top: 24%; width: 166px; background: #fff; text-align: center; z-index: 999; opacity: 1; -webkit-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; }
.theme_panel.left { left: -166px; right: auto; }
.theme_panel.left .toggle_bts { right: auto; left: 166px; }
.theme_panel.active { right: 0; }
.theme_panel.left.active { left: 0; right: auto; }
.toggle_bts { padding: 0; position: absolute; top: 0; right: 166px; height: 40px; line-height: 40px; -webkit-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; }
.toggle_bts a { float: left; display: block; width: 40px; height: 40px; font-size: 29px; color: #000; background: #fff; text-align: center; }
.toggle_bts a .icon { font-size: 26px; line-height: 40px; color: #222; animation-name: settings; animation-duration: 1.5s; animation-iteration-count: infinite; animation-timing-function: linear; }
.toggle_bts a.buy-this-template { color: #fff; background: green; }
.theme_menu h4 { margin: 30px 0 15px 0; padding: 0 15px; display: block; font-size: 13px; line-height: 16px; color: #222; background: #fff; text-transform: uppercase; font-weight: 500; }
.theme_menu .segment { padding: 0 12px; margin-bottom: 0; }
.theme_menu ul.theme { margin: 0 -5px; font-size: 0; }
.theme_menu ul.theme li a:hover { background: #f9f9f9; }
.theme_menu ul.theme li { margin: 0 5px 10px 5px; display: inline-block; list-style: none; }
.theme.layout_style li a { height: 28px; width: 28px; }
.theme_menu ul.theme li a { display: block; }
.theme_menu .theme.demo_list { margin: 5px -1px 0 0; }
.theme_menu .theme.demo_list li { margin: -1px 0 0 0; float: left; width: 100%; height: 34px; line-height: 34px; border-top: 1px solid #eee; border-bottom: 1px solid #eee; border-right: 1px solid #eee; text-align: center; font-size: 11px; text-transform: uppercase; }
.theme_panel.left .theme_menu .theme.demo_list li { margin: -1px 0 0 -1px; }
.theme_menu ul.theme li:nth-child(5), .theme_menu ul.theme li:nth-child(6) { border-bottom: none; }
.theme_menu .theme.demo_list li strong { font-weight: 500; color: #444; }
.theme_menu .buy-btn { margin: 15px 0 0 0; padding: 0 15px; display: block; height: 40px; line-height: 40px; font-size: 13px; color: #f9f9f9; background: green; text-transform: uppercase; text-decoration: none; font-weight: 500; }
.theme_menu .buy-btn .ion { margin: 0 10px 0 0; display: inline-block; vertical-align: middle; font-size: 20px; line-height: 40px; color: #fefefe; }
 @-webkit-keyframes settings {  0% {
 -webkit-transform: rotate(0deg);
}
 100% {
 -webkit-transform: rotate(360deg);
}
}
 @keyframes settings {  0% {
 transform: rotate(0deg);
 -webkit-transform: rotate(0deg);
}
 100% {
 transform: rotate(360deg);
 -webkit-transform: rotate(360deg);
}
}
/* 3.3 Pricing */
.price-btn { text-align: center; width: 100%; }
.price-btn img { text-align: center; width: 100%; max-width: 260px; height: auto; margin: 20px auto; border: 0;  }
.paypal-button , .paypal-button input{ width: 100%; max-width: 260px; height: auto; border: 0; margin:20px auto; text-align: center; }
@media (max-width: 560px) {
.price-btn { text-align: center; padding: 15px 0; margin: auto; }
.price-btn img { text-align: center; padding: 0; margin: 0 auto; }
.paypal-button , .paypal-button input{margin:0 auto;  }
}