/*
Theme Name:         Katana IT
Theme URI:          http://themefortress.com/
Description:        Katana IT is a versatile HTML5 responsive WordPress framework based on ZURB's Foundation.
Version:            1.0.0
Author:             Infinithium
Author URI:         http://infinithium.com/
*/

/* ==================================================
	GENERAL
================================================== */
body {
	background-color: #fff;
}
p {
	font-size: 0.875rem;
}
a {
    text-decoration: none;
    line-height: inherit;
}
a:hover,
a:focus {
    color: #d01820;
}
.clear {
	clear: both;
}
.contain-to-grid .top-bar {
    max-width: 1200px;
}
.row {
	max-width: 1200px;
}
.no-margin {
	margin: 0;
}
button {
    color: #d01820;
    background-color: #fafafa;
}
button:hover {
    background-color: #D01820;
    color: #FFF;
}
/* ==================================================
	HEADER
================================================== */
body > header.contain-to-grid {
    margin-bottom: 5px;
}
.contain-to-grid {
	background-color: transparent;
}
.header-contacts {
	text-align: right;
	background-color: #FFFFFF;
}
.header-contacts ul {
    margin: 5px 15px;
}
.header-contacts ul li {
    display: inline;
    font-size: 14px;
    color: #999;
    padding-left: 20px;
}
.header-contacts ul li a {
    color: #999;
}
.header-contacts ul li a:hover {
    color: #d01820;
}
.header-contacts ul li i.fa{
	font-size: 16px;
	color: #d01820;
    padding-right: 2px;
}
.logo {
    margin-top: -33px;
    display: inline-block;
}
.logo img {
    max-height: 100px;
}
.top-bar-section {
	display: inline-block;
    float: right;
    padding-top: 10px;
}
.top-bar-section ul li {
	background-color: transparent;
}
.top-bar-section ul li > a {
	color: #999;
	text-transform: uppercase;
}
.top-bar-section ul li.active > a:hover {
	color: #fff !important;
}
.myfixed .logo {
	margin: 0;
	padding: 5px;
}
.myfixed .logo img {
    height: 50px;
    width: auto;
    content: url(img/long.jpg);
}
.myfixed .top-bar-section {
    padding-top: 0;
    padding-bottom: 20px;
}
.wrapfixed {
    box-shadow: 0px 3px 5px rgba(120,120,120,0.3);
    -webkit-box-shadow: 0px 3px 5px rgba(120,120,120,0.3);
    -moz-box-shadow: 0px 3px 5px rgba(120,120,120,0.3);
    -o-box-shadow: 0px 3px 5px rgba(120,120,120,0.3);
}
#mega-menu-wrap-primary {
    clear: none;
    float: right;
    background: transparent;
}
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item > a.mega-menu-link {
	color: #999;
	padding: 0;
    height: 34px;
}
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-item li.mega-menu-item > a.mega-menu-link {
	font-size: 12px;
    text-indent: 10px;
}
#mega-menu-wrap-primary #mega-menu-primary li.mega-menu-flyout.mega-menu-item-has-children > a.mega-menu-link:after,
#mega-menu-wrap-primary #mega-menu-primary li.mega-menu-flyout li.mega-menu-item-has-children > a.mega-menu-link:after,
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item-has-children > a.mega-menu-link:after {
    content: "\f078";
    font-family: "FontAwesome";
    position: absolute;
    top: 25px;
    left: 0;
    right: 0;
    width: 14px;
    margin: 0 auto;
    color: #d01820;
}
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item.mega-toggle-on > a.mega-menu-link,
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item > a.mega-menu-link:hover,
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item > a.mega-menu-link:focus {
	background: transparent;
    color: #999;
}
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item.mega-toggle-on > a.mega-menu-link,
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item > a.mega-menu-link:hover,
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item > a.mega-menu-link:focus,
#mega-menu-wrap-primary #mega-menu-primary > li.mega-current-menu-ancestor > a.mega-menu-link,
#mega-menu-wrap-primary #mega-menu-primary > li.mega-current-menu-item > a.mega-menu-link {
	border-bottom: 3px solid #d01820;
	margin-bottom: -3px;
}
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item.mega-toggle-on.mega-red > a.mega-menu-link,
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item.mega-red > a.mega-menu-link:hover,
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item.mega-red > a.mega-menu-link:focus,
#mega-menu-wrap-primary #mega-menu-primary > li.mega-current-menu-ancestor.mega-red > a.mega-menu-link,
#mega-menu-wrap-primary #mega-menu-primary > li.mega-current-menu-item.mega-red > a.mega-menu-link {
	border-bottom: 3px solid #d01820;
	margin-bottom: -3px;
}
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item.mega-toggle-on.mega-orange > a.mega-menu-link,
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item.mega-orange > a.mega-menu-link:hover,
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item.mega-orange > a.mega-menu-link:focus,
#mega-menu-wrap-primary #mega-menu-primary > li.mega-current-menu-ancestor.mega-orange > a.mega-menu-link,
#mega-menu-wrap-primary #mega-menu-primary > li.mega-current-menu-item.mega-orange > a.mega-menu-link {
	border-bottom: 3px solid #ffaf42;
	margin-bottom: -3px;
}
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item.mega-toggle-on.mega-green > a.mega-menu-link,
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item.mega-green > a.mega-menu-link:hover,
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item.mega-green > a.mega-menu-link:focus,
#mega-menu-wrap-primary #mega-menu-primary > li.mega-current-menu-ancestor.mega-green > a.mega-menu-link,
#mega-menu-wrap-primary #mega-menu-primary > li.mega-current-menu-item.mega-green > a.mega-menu-link {
	border-bottom: 3px solid #89b32f;
	margin-bottom: -3px;
}
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item.mega-toggle-on.mega-blue > a.mega-menu-link,
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item.mega-blue > a.mega-menu-link:hover,
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item.mega-blue > a.mega-menu-link:focus,
#mega-menu-wrap-primary #mega-menu-primary > li.mega-current-menu-ancestor.mega-blue > a.mega-menu-link,
#mega-menu-wrap-primary #mega-menu-primary > li.mega-current-menu-item.mega-blue > a.mega-menu-link {
	border-bottom: 3px solid #2f8693;
	margin-bottom: -3px;
}
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-flyout ul.mega-sub-menu li.mega-menu-item a.mega-menu-link:hover,
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-flyout ul.mega-sub-menu li.mega-menu-item a.mega-menu-link:focus {
    color: #d01820;
}
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-item.mega-red > a.mega-menu-link,
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-item.mega-red li.mega-menu-item > a.mega-menu-link {
    color: #d01820;
}
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-item.mega-orange > a.mega-menu-link,
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-item.mega-orange li.mega-menu-item > a.mega-menu-link {
    color: #ffaf42;
}
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-item.mega-green > a.mega-menu-link,
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-item.mega-green li.mega-menu-item > a.mega-menu-link {
    color: #89b32f;
}
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-item.mega-blue > a.mega-menu-link,
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-item.mega-blue li.mega-menu-item > a.mega-menu-link {
    color: #2f8693;
}
.mega-current-menu-item,
.mega-current-menu-parent {

}
.mega-current-menu-item a,
.mega-current-menu-parent a {
    color: #999 !important;
}
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-item:hover > a.mega-menu-link, 
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-item li.mega-menu-item:hover > a.mega-menu-link,
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-item:active > a.mega-menu-link, 
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-item li.mega-menu-item:active > a.mega-menu-link {
    color: #333;
}
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-megamenu > ul.mega-sub-menu,
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-flyout ul.mega-sub-menu,
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-flyout ul.mega-sub-menu li.mega-menu-item a.mega-menu-link,
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-flyout ul.mega-sub-menu li.mega-menu-item a.mega-menu-link:hover,
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-flyout ul.mega-sub-menu li.mega-menu-item a.mega-menu-link:focus {
    background: #FFF;
}
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-megamenu > ul.mega-sub-menu,
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-flyout ul.mega-sub-menu {
	top: 40px;
}
#mega-menu-wrap-primary #mega-menu-primary li.mega-menu-item {
	padding: 0 10px 0 10px;
}
/* ==================================================
	HOMEPAGE
================================================== */
.homepage-hero {
    min-height: 485px;
}
.homepage-items {
    padding-bottom: 40px;
    border-bottom: 1px solid #EAEAEA;
    box-shadow: 0px 1px 3px #EAEAEA;
}
.homepage-title,
.client-title {
	text-align: center;
}
.homepage-title h3,
.client-title h4 {
	text-transform: uppercase;
    margin-top: 25px;
    margin-bottom: 35px;
}
.homepage-title span,
.client-title span {
	color: #d01820;
}
.item {
    background-color: #eaeaea;
    background-image: url(img/filler.png);
    background-repeat: no-repeat;
    background-size: 100%;
    padding: 10px;
    border-radius: 0 10px;
    margin: 15px 0 40px;
    border: 1px solid #FFF;
}
.item h4 {
	text-transform: uppercase;
	margin: 0;
}
.item .columns {
    padding: 0;
}
.item p {
	font-size: 14px;
}
.item img {
    float: right;
}
.item h4 {
    color: #CFCFCF;
}
.item.hover.red h4 {
	color: #d01820;
}
.item.hover.orange h4 {
	color: #ffaf42;
}
.item.hover.green h4 {
	color: #89b32f;
}
.item.hover.blue h4 {
	color: #2f8693;
}
.item.hover.red {
    background-color: #d01820;
}
.item.hover.orange {
    background-color: #ffaf42;
}
.item.hover.green {
    background-color: #89b32f;
}
.item.hover.blue {
    background-color: #2f8693;
}
.homepage-items .tabs .item {
    cursor: pointer;
}
.item img {
  filter: gray; /* IE6-9 */
  filter: grayscale(1); /* Firefox 35+ */
  -webkit-filter: grayscale(1); /* Google Chrome, Safari 6+ & Opera 15+ */
}

/* Disable grayscale on hover */
.item.hover img {
  filter: none;
  -webkit-filter: grayscale(0);
}
.item:hover:after,
.item.hover:after {
    content: '';
    position: absolute;
    bottom: -1px;
    left: 50%;
    margin-left: -30px;
    width: 0;
    height: 0;
    border-bottom: solid 30px #EAEAEA;
    border-left: solid 30px transparent;
    border-right: solid 30px transparent;
}
.tabs-content {
    background: #EAEAEA;
    padding: 10px 20px;
    border-radius: 0 10px;
}
.client-items {
    text-align: center;
}
.client-items .row {
    max-width: 60rem;
}
.client-item {
    text-align: center;
    padding: 25px 0;
}
.client-items button.more-clients {
    color: #d01820;
    background-color: #fafafa;
    border: 1px solid #f0f0f0;
    border-radius: 5px;
}
.client-items button.more-clients:hover {
    background-color: #D01820;
    color: #FFF;
}
/* ==================================================
	PAGES
================================================== */
.entry-title {
	text-transform: uppercase;
	color: #FFF;
    margin-top: 0;
    margin-bottom: 5px;
}
.breadcrumbs {
    background-color: #d01820;
    border-radius: 0;
    border: none;
    padding: 10px 0 15px;
    margin-bottom: 0px;
    background-position: center;
    background-size: cover;
    box-shadow: 0px 3px 5px rgba(120,120,120,0.9);
    -webkit-box-shadow: 0px 3px 5px rgba(120,120,120,0.9);
    -moz-box-shadow: 0px 3px 5px rgba(120,120,120,0.9);
    -o-box-shadow: 0px 3px 5px rgba(120,120,120,0.9);
}
.breadcrumbs > * {
    margin: 0 auto;
    color: #FFF;
    float: none;
    text-transform: inherit;
}
.breadcrumbs .row {
    padding: 0 15px;
}
.breadcrumbs > *:hover a, .breadcrumbs > *:focus a {
    text-decoration: none;
}
.breadcrumbs .trail {
	color: #FFF;
	text-decoration: none;
}
.breadcrumbs .current {
	color: #f3eaa3;
}
.wpb_row.row {
    margin: 0 auto;
}
.team {
    padding-bottom: 10px;
    padding-top: 10px;
}
/* ==================================================
	TEMP
================================================== */
.item-rec .dropcap {
    position: relative;
    display: block;
    float: left;
    overflow: hidden;
    margin: 0 20px 20px 0;
    width: 50px;
    height: 50px;
    background: #3A87AD;
    color: #ffffff;
    text-align: center;
    text-transform: uppercase;
    font-weight: bold;
    font-size: 36px;
    line-height: 50px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}
.item-rec .dropcap {
    margin: 7px 20px 10px 0;
    width: 60px;
    height: 60px;
    border: 1px solid #31c1e4;
    background: none;
    color: #31c1e4;
    font-weight: 400;
    font-size: 24px;
    line-height: 60px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
}
.item-rec .extra-wrap {
    overflow: hidden;
}
.item-rec h5 {
    color: #31c1e4;
    text-transform: uppercase;
}
/* ==================================================
    CONTACT US
================================================== */
.ninja-forms-required-items {
    display: none;
}
.ninja-forms-all-fields-wrap {
    text-align: left;
}
.field-wrap {
    margin-bottom: 0 !important;
}
.name-field-wrap,
.email-field-wrap,
.phone-field-wrap {
    width: 32%;
    display: inline-block;
}
.name-field,
.email-field,
.phone-field {
    width: 99% !important;
}
.textarea-wrap {
    width: 97%;
    display: inline-block;
}
input[type="text"],
input[type="password"],
input[type="date"],
input[type="datetime"],
input[type="datetime-local"],
input[type="month"],
input[type="week"],
input[type="email"],
input[type="number"],
input[type="search"],
input[type="tel"],
input[type="time"],
input[type="url"],
textarea {
    border: none;
    background-color: #EAEAEA;
    box-shadow: none;
}
input[type="text"]:focus,
input[type="password"]:focus,
input[type="date"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="month"]:focus,
input[type="week"]:focus,
input[type="email"]:focus,
input[type="number"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="time"]:focus,
input[type="url"]:focus,
textarea:focus {
    border: 1px solid #ccc;
    background-color: #FFF;
    box-shadow: none;
}
.send-button {
    background: #D0171F;
    box-shadow: none;
    border: none;
    color: #FFF;
    padding: 10px 20px;
    border-radius: 5px;
}
/* ==================================================
	FOOTER
================================================== */
footer.full-width img {
    max-height: 60px;
}
footer.full-width {
    padding-top: 10px;
    padding-bottom: 20px;
    border: none;
}
.footer-menu {
    margin-top: 50px;
    padding-top: 35px;
    padding-bottom: 30px;
    background-repeat: no-repeat;
    background-size: cover;
}
.footer-menu h5 {
    color: #d01820;
}
.footer-menu ul {
    margin-left: 0.675rem;
}
.footer-menu ul li {
    list-style: none;
    color: #999;
    font-size: 14px;
    line-height: 28px;
}
.footer-menu ul li a {
    color: #999;
}
.footer-menu ul li a:hover,
.footer-menu ul li a:focus {
    color: #d01820;
}
@media only screen and (min-width: 40.063em) {
	.top-bar,
	.top-bar-section li:not(.has-form) a:not(.button),
	.top-bar-section li.active:not(.has-form) a:not(.button) {
		background-color: transparent;
	}
	.top-bar-section li.active:not(.has-form) a:not(.button):hover {
		background-color: #333;
	}
	.top-bar-section > ul > .divider, .top-bar-section > ul > [role="separator"] {
		display: none;
	}
	.top-bar-section li.active:not(.has-form) a:not(.button) {
		color: #999;
	}
	.contain-to-grid .top-bar {
	    margin-top: 25px;
	}
}
@media all and (max-width: 1024px) {
	.top-bar-section {
		display: inline-block;
	    float: right;
	    padding-top: 0;
	    padding-bottom: 25px;
	}
}
@media all and (max-width: 768px) {
	#mega-menu-wrap-primary {
	    width: 100%;
	}
	.top-bar-section {
	    width: 100%;
	}
	#mega-menu-wrap-primary #mega-menu-primary li.mega-menu-flyout.mega-menu-item-has-children > a.mega-menu-link:after,
	#mega-menu-wrap-primary #mega-menu-primary li.mega-menu-flyout li.mega-menu-item-has-children > a.mega-menu-link:after,
	#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item-has-children > a.mega-menu-link:after {
	     position: relative;
	     top: 0;
	}
	.top-bar-section {
	    display: inline-block;
	    float: right;
	    margin-top: -40px;
	    padding-top: 0;
	    padding-bottom: 0;
	}
	.header-contacts ul li {
	    font-size: 12px;
	}
}
@media all and (max-width: 640px) {
	.header-contacts ul li {
	    display: block;
	    text-align: center;
	}
	.row.main-nav {
	    text-align: center;
	}
}
@media all and (max-width: 360px) {
	.top-bar-section {
	    margin-top: 0px;
	    padding-top: 0;
	}
}