/*  
Theme Name: Fleischer Sports
*/

* { border:0; margin:0; padding:0; outline:none }
/*.sprite {background-image: url(images/sprite.png); background-repeat: no-repeat;}*/
html { position: relative; z-index: 1}
body { background:#fff; color:#151515; font:300 1em/1.4 "Helvetica Neue",Helvetica,Arial,sans-serif; position:relative; z-index: 1 }
p { margin-bottom:1em; }
iframe { background:transparent; border:none }
a { color:#0F2946; text-decoration:none; -webkit-transition:all 0.35s ease;-ms-transition:all 0.35s ease;-o-transition:all 0.35s ease;transition:all 0.35s ease; font-weight: bold }
a:hover { color:#1D3C5B }
a:active,a:focus { outline:none }
img.alignleft { margin:0 10px 10px 0 }img.alignright { margin:0 0 10px 10px }
input,select,textarea { background: transparent; color: #fff;font:normal .8em "Helvetica Neue",Helvetica,Arial,sans-serif; padding:2px }
input:focus::-webkit-input-placeholder {color:transparent;}
input:focus:-moz-placeholder {color:transparent;}
input:focus::-moz-placeholder {color:transparent;}
input:focus:-ms-input-placeholder {color:transparent;}
input[type="submit"] {-webkit-appearance: none; background: none}
select { box-shadow: 0px 0px 1px rgba(50, 50, 50, 0.75); border-radius: 5px; font-size: 20px; padding: 5px; background-image: url(images/arrow.png); background-repeat: no-repeat; background-color: #fff; background-position: right top; -webkit-appearance: none; }
ul li { list-style:none; }
h1,h2,h3 { line-height:1; font-weight: normal}
h1 { font-size:4em; margin-bottom: .5em; }
h2 { font-size:2.5em; margin-bottom: .5em }
h3 { font-size:1.66em; margin-bottom: .5em }
.row { clear:both; overflow:hidden }
.more, .feature-more,.contact, input[type="submit"]{ background: rgba(255,255,255,0.2); border-radius: 4px; border: 1px #fff solid;color: #fff;padding: .5em; text-transform: uppercase; display: inline-block; text-transform: uppercase; }
.more:hover, input[type="submit"]:hover {color: #fff}
.small {font-size: 65%}
.centered { width:76%; margin-left:auto; margin-right:auto; position:relative;}
.button {color: #DB4E27; padding: 1em; margin: 0 .5em; line-height: 1; border: 1px #DB4E27 solid; font-weight: 300; font-size: 14px; display: inline-block;text-transform: uppercase}
.button:hover {color: #F26949; border-color: #F26949}
#header {position: fixed; z-index:99999; height:40px; top: 0px; width:100%; left:0; background: rgba(43,43,43,0.69); box-shadow: 0 2px 4px rgba(0,0,0,0.25)}
#logo {position: absolute; right: 1em; top: 6px;margin: 0;height:51px; width: 250px;z-index:99;text-indent: -9999em;background: url(images/logo.png) no-repeat center center; background-size: 250px auto; transition: .5s} 

#logo.small {height: 26px; width: 125px; background-size: 125px auto;right: 6px;}

#mainmenu {float: left; margin-left: .75em}
	#mainmenu ul {}
	#mainmenu li { float:left; text-transform: uppercase; line-height: 40px; }
		#mainmenu li a { display:block; color: #fff; padding: 0 1em;position: relative}
		#mainmenu li a:after {position: absolute; content: ""; height: 6px; width: 0; background:#DB4E27; bottom: 0; left: 50%; margin-left: 0; transition: .33s}
		#mainmenu li a:hover:after,#mainmenu li.current a:after {width: 40px; margin-left: -20px}
	
	#menu-toggle {display: none; position: absolute; z-index: 999; top: 12px; left: 8px; width: 20px; height: 15px;}
		.bar {background: #fff; height: 2px; margin-bottom: 4px; transition: .33s; opacity: 1; border-radius: 1px}
	
/*home page features*/

@-webkit-keyframes slideRight
{
0%   {left: 0%;}
100% {left: 100%;}
}

@-moz-keyframes slideRight
{
0%   {left: 0%;}
100% {left: 100%;}
}

@keyframes slideRight
{
0%   {left: 0%;}
100% {left: 100%;}
}
@-webkit-keyframes slideLeft
{
0%   {left: 0%;}
100% {left: -100%;}
}

@-moz-keyframes slideLeft
{
0%   {left: 0%;}
100% {left: -100%;}
}

@keyframes slideLeft
{
0%   {left: 0%;}
100% {left: -100%;}
}
#features {clear: both; z-index: 1; width: 100%;overflow: hidden; position: relative}
.feature{position: relative; top: 0; left:0; opacity: 1; z-index: 1; width: 100%;height: 100%;-webkit-filter: saturate(100%); filter: saturate(100%); transition: filter .8s .3s ease; -webkit-transition: -webkit-filter .8s .3s ease; background-size: cover; background-position: center center; }
	.slideRight{position: absolute;z-index: 2;animation: slideRight .6s forwards;-webkit-animation: slideRight .6s forwards;-moz-animation: slideRight .6s forwards;-ms-animation: slideRight .6s forwards;}
	.slideLeft{position: absolute;z-index: 2;animation: slideLeft .6s forwards;-webkit-animation: slideLeft .6s forwards;-moz-animation: slideLeft .6s forwards;-ms-animation: slideLeft .6s forwards;}
	.feature.off {position:absolute; z-index: 0;}
	.feature.bw {-webkit-filter: saturate(0%); filter: saturate(0%)}


.edit {position: absolute; top: 10px; right: 10px; z-index: 4}
.edit a {}
.feature-img {height: 100%; width: auto; position: absolute; left: 50%; margin-left: -50%; z-index: 1}
.feature-meta { color:#fff;  position: absolute; z-index: 3; width: 33%; right: 10%; top: 50%; transform: translateY(-50%);-webkit-transform: translateY(-50%)}
.feature-title { color:#fff; font-weight: bold; font-size:6em; font-size: 6vw; margin: 0; text-transform: uppercase; text-shadow: 2px 2px 0 rgba(0,0,53,0.75)}
.feature-title a {color: #fff}
.feature-excerpt{ color: #fff; color: rgba(255,255,255,0.92); font-size: 1.5em; line-height: 1;margin: 0; text-shadow: 1px 1px 1px rgba(0,0,53,0.75)}
.contact{margin: 2em auto 0;}
.feature-more {margin: 8em auto 0}
.feature-more:hover, .contact:hover {text-shadow: 1px 1px 1px rgba(0,0,53,0.75); color: #fff}
#features-nav {position: relative;margin: -85px auto 0;border-radius: 10px 10px 0 0; height: 85px; overflow: hidden; background: rgba(255,255,255,0.43);	 z-index: 2; box-shadow: 0 0 5px rgba(0,0,0,0.18); width: 1024px;}
#features-nav {display: none}
.tab-nav {position: absolute; z-index: 999; height: 82px; width: 41px; top: 50%; margin-top: -41px; opacity: 0.8}
.tab-nav.next-tab {right: 0; background-position: -270px 0}
.tab-nav.prev-tab {left: 0; background-position: -229px 0}
.tab-nav:hover {opacity: 1}


section.page {position: relative; z-index: 99; text-align: center; }
.section-inner {padding: 8vw}
.section-title.default, .section-title.team {position: relative; display: inline-block; margin: 0 auto 1em; clear: both; text-transform: uppercase; font-weight: 300; text-align: center; letter-spacing: .1em}
	.section-title.default:before, .section-title.team:before {position: absolute; top: 50%; left: -69px; width: 43px; border-bottom: 1px #1D3C5B solid; content: "";}
	.section-title.default:after, .section-title.team:after {position: absolute; top: 50%; right: -69px; width: 43px; border-bottom: 1px #1D3C5B solid; content: "";}
.page.icons {max-height: 0; overflow: hidden; transition: .66s}
.page.icons.on {max-height: 800px; }
.section-title.icons, .section-title.clients, #plus {font-weight: 600; font-family: "adobe-garamond-pro", georgia, serif; font-style: italic; text-transform: none}
#plus {margin-top: 1em;clear: both; display: inline-block; margin-left: auto; margin-right: auto; background: rgba(51,122,193,0.1); padding: 1em; font-size: 125%; border-bottom: 1px solid rgba(255,255,255,0.69); box-shadow: inset 0 5px 10px rgba(29,60,91,0.1);color:  #1D3C5B}
.excerpt {font-size: 125%}
.page.page-1 {}
.page.navy {background-color: #1D3C5B; color: #fff}
	.navy a {color: #fff}
.page.white {background:#fff url(images/web.png) no-repeat center center}
.page.light {background: #ffffff;
background: -moz-radial-gradient(center, ellipse cover,  #ffffff 1%, #E6F2F4 100%);
background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(1%,#ffffff), color-stop(100%,#E6F2F4));
background: -webkit-radial-gradient(center, ellipse cover,  #ffffff 1%,#E6F2F4 100%);
background: -o-radial-gradient(center, ellipse cover,  #ffffff 1%,#E6F2F4 100%);
background: -ms-radial-gradient(center, ellipse cover,  #ffffff 1%,#E6F2F4 100%);
background: radial-gradient(ellipse at center,  #fdffff 1%,#E6F2F4 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fdffff', endColorstr='#E6F2F4',GradientType=1 );
}
.teamHeader, .teamBio {text-align: left}
.teamHeader {font-weight: bold; margin-top: 2em}
.teamBio {}
.jobTitle {font-weight: 600; font-family: "adobe-garamond-pro", georgia, serif; font-style: italic; opacity: 0.69; font-size: 110%}

/*single post*/

.post-content {font-size: 133%;}
.post-content p:first-child{position: relative; margin-top: 4em}
.post-content p:first-child:after {
	content: ""; position: absolute; top: -2em; left: 50%; width: 100px; border-top: 6px #DB4E27 solid; margin-left: -50px; 
}
.post-content p,.post-content li {}
.post-content p,.post-content ul,.post-content ol {}
.post-content ol { margin:0 0 0 20px }
.post-content ul { margin:0 0 0 12px }
.post-content p a,.post-content li a {}
.post-content img {max-width: 90%; height: auto}
.post-content blockquote {margin: .5em 1em 2em; position: relative; display: block; font-family: Georgia, serif; font-size: 110%}
blockquote p {display: inline}

.client-logos {position: relative}
.client-logo {display: block; float: left; margin: 2.5% 1%; width: 18%; height: auto;  }
.client-panel{transform: scale(0);transform-origin: center center; opacity: 0; position: relative; top: 0; left:0; opacity: 1; z-index: 1; transition: opacity .6s ease,transform .6s ease;}
	.client-panel.fade {opacity: 0}
	.client-panel.off {position:absolute; z-index: 0;}
	.client-panel.on {transform: scale(1);}

/*tree*/
.tree {position: relative; text-align: center; padding-top: 10vw; display: inline-block; margin: 0 auto; border-top: 1px #1d3c5b}
.tree:before {content: '';position: absolute; top: 0;left: 50%; width: 0; border-left: 1px #1D3C5B solid; height: 10vw}
.tree li {position: relative;font-weight: bold; text-transform: uppercase; font-size: 12px; width: 14.666%;padding: 0 1%; float: left; border-top: 1px #1d3c5b solid; padding-top: 6vw}
.tree li:before {content: '';position: absolute; top: 0;left: 50%; margin-left: -1px; width: 0; border-left: 1px #1D3C5B solid; height: 5vw}
.tree img {display: block; margin: 0 auto .5em; max-width: 50%; height: auto}
.tree li:first-child {border-top: none}
	.tree li:first-child:after {content: '';position: absolute; top: 0; width: 50%; border-top:1px #1D3C5B solid; left: 50%; }
.tree li:last-child {border-top: none}
	.tree li:last-child:after {content: '';position: absolute; top: 0; width: 50%; border-top:1px #1D3C5B solid; right: 50%;}
	
.navy .tree:before, .navy .tree li, .navy .tree li:before, .navy .tree li:first-child:after, .navy .tree li:last-child:after  {border-color: #fff}	
#contacts {display: inline-block; margin: 0 auto; text-align: left}
	#contact li {line-height: 50px; overflow: hidden; margin-bottom: 1em} 
	#contacts img {float: left; width: 50px; height: 50px; margin-right: 1em}
	
/* footer*/
#footer {font-size:12px; color:#ccc; padding:.5em; text-align:center; z-index:99; box-shadow: 0 0 10px rgba(0,0,0,0.5); background: #0F2946; position: relative; z-index: 5}
#footer a { color:#ccc; transition:color 1s; -webkit-transition:color 1s }
#footer a:hover { color:#ffb94a }
#footer p {float: left; margin: 0}
#lineage {background: url(images/sprite.png) no-repeat -126px -20px; width:25px; height:25px;float: right}

/*all-purpose*/
.w100 {width: 100%}
.h100 {height: 100%}
.h-auto {height: auto}
hr.clear { clear:both }

@media only screen and (max-width: 1024px) {
}

@media only screen and (max-width: 1023px) {

#footer p {float: none; text-align: center}
#footer {position: relative}
	
}

@media only screen and (max-width: 959px) {
.centered {width: 90%; }
	
#mainmenu {position: fixed; top: 40px; bottom: 0; left: -160px; width: 160px; transition: left .5s; float: none; margin: 0; background: #434343}
	.menu-on #mainmenu {left: 0}
	#mainmenu ul {float: none; width: 100%; margin: 0; text-align: left}
	#mainmenu li {float: none; font-size: 14px;display: block; border-bottom: 1px rgba(0,0,0,0.1) solid;line-height: 50px; position: relative;margin: 0}
	#menu-toggle {display: block}
	.menu-on #bar-1 {transform: rotate(39deg); transform-origin: top left;-webkit-transform: rotate(39deg); -webkit-transform-origin: top left}
	.menu-on #bar-2 {opacity: 0}
	.menu-on #bar-3 {transform: rotate(-39deg); transform-origin: bottom left;-webkit-transform: rotate(-39deg); -webkit-transform-origin: bottom left}
}
@media only screen and (max-width: 768px) {
	.section-inner {padding: 6vw}
	.icons .centered {width: 100%}
	.tree li {font-size: 11px}
}
/*portrait phones*/
@media only screen and (max-width: 767px) {

.tree:before, .tree li:before, .tree li:first-child:after, .tree li:last-child:after  {display: none}
.tree {padding-top: 0;}
.tree li {border-top: none; width: 100%; float: none; overflow: hidden; margin-bottom: 1em}
#features {padding-top: 40px}
#logo {height: 26px; width: 125px; background-size: 125px auto; right: 6px}
.section-inner {padding: 2em 0}
#header {background: #252525; height: 40px}
h1,h2, h3, .feature-title{font-size:6vw}
.menubar.left, .stuck .menubar.left {width: 1%; padding-left:51px}
.menubar.right, .stuck .menubar.right {right: -1%; background-position: 111px 0}
.feature-more {margin-top: 3em}
 .button {width: 200px; display: block; margin: 0 auto 1em}
 #contacts {font-size: 80%}
#contacts img {margin-right: .5em}
.feature-meta {max-width: 100%; width: 100%; text-align: center; right: 0;top: auto; bottom: 10%; transform: none; -webkit-transform: none; }
.post-content {font-size: 100%}
.page.icons.on {max-height: 1400px; }
	
}


@media only screen and (max-width: 480px) {
.grid-item.expanded{width:300px;}
}




@media only screen and (-webkit-min-device-pixel-ratio: 2),only screen and (-moz-min-device-pixel-ratio: 2),only screen and (-o-min-device-pixel-ratio: 21),only screen and (min-device-pixel-ratio: 2) { 
	.sprite { background-image:url(images/sprite@2x.png?v=2); background-size:224px 147px }

}