
html {
  height:100%;
}
body {
  margin:0;
  padding:0;
  height:100%;
  
  font-family:"Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size:15px;
  color:#777;
  line-height:140%;
}

.wrap {
  background:#c00;
}

/*
  An adaptation of the CSS three column equal height technique as presented in:
   http://matthewjamestaylor.com/blog/equal-height-columns-cross-browser-css-no-hacks
  In my case, I'm only working with two equal height columns: [left] and [center].
  The height of the third column, [right], is functionally dependent to the height of
   the other two. Therefore [right] is simply positioned absolute top and bottom with
   regard to the last container.
*/
.contain {
  width:100%;
  position:relative;
}
.contain.left {
  background:#decdba url("../images/profile.jpg") top left no-repeat;
  overflow:hidden;
}
.contain.center {
  left:210px;
  background:#fff;
  box-shadow:0 0 25px 0 #333;
}
.col.left,
.col.center {
  position:relative;
  right:210px;
}
.col.aside {
  width:210px;
}
.col.left {
  float:left;
}
.col.center {
  margin:0 210px;
}
.col.center .header-background {
  height:80px;
  background:#f5f5f5 url("../images/fp7.jpg") top right no-repeat;
}
.col.right {
  position:absolute;
  top:0;
  right:210px;
  bottom:0;
  overflow:hidden;
}
.col.right .shadow {
  position:absolute;
  top:0;
  left:-30px;
  bottom:0;
  width:30px;
  box-shadow:0 0 25px 0 #333;
}



.homepage.lt-1100 .col.right,
.not-homepage.lt-1000 .col.right {
  display:none;
}
.homepage.lt-1100 .col.center,
.not-homepage.lt-1000 .col.center {
  margin-right:0 !important;
}



.homepage.lt-1200 .contain.center,
.not-homepage.lt-1100 .contain.center {
  left:180px;
}
.homepage.lt-1200 .col.aside,
.not-homepage.lt-1100 .col.aside {
  width:180px;
}
.homepage.lt-1200 .col.left,
.homepage.lt-1200 .col.center,
.homepage.lt-1200 .col.right,
.not-homepage.lt-1100 .col.left,
.not-homepage.lt-1100 .col.center,
.not-homepage.lt-1100 .col.right {
  right:180px;
}
.homepage.lt-1200 .col.center,
.not-homepage.lt-1100 .col.center {
  margin:0 180px;
}



.homepage.gt-1500 .contain.center,
.not-homepage.gt-1300 .contain.center {
  left:250px;
}
.homepage.gt-1500 .col.aside,
.not-homepage.gt-1300 .col.aside {
  width:250px;
}
.homepage.gt-1500 .col.left,
.homepage.gt-1500 .col.center,
.homepage.gt-1500 .col.right,
.not-homepage.gt-1300 .col.left,
.not-homepage.gt-1300 .col.center,
.not-homepage.gt-1300 .col.right {
  right:250px;
}
.homepage.gt-1500 .col.center,
.not-homepage.gt-1300 .col.center {
  margin:0 250px;
}



.homepage.gt-1700 .contain.center,
.not-homepage.gt-1500 .contain.center {
  left:300px;
}
.homepage.gt-1700 .col.aside,
.not-homepage.gt-1500 .col.aside {
  width:300px;
}
.homepage.gt-1700 .col.left,
.homepage.gt-1700 .col.center,
.homepage.gt-1700 .col.right,
.not-homepage.gt-1500 .col.left,
.not-homepage.gt-1500 .col.center,
.not-homepage.gt-1500 .col.right {
  right:300px;
}
.homepage.gt-1700 .col.center,
.not-homepage.gt-1500 .col.center {
  margin:0 300px;
}



.col .inner {
  margin-top:-5px;
  padding:5px 0; /* to break first and last margins within .col, so the height technique still holds */
}
.col.right img {
  width:100%;
  float:left;
}
.col.center .inner {
  margin-top:-85px;
}

.content {
  margin:0 20px;
}
.homepage .content {
  margin-right:290px;
}
.homepage.gt-1600 .content,
.not-homepage.gt-1400 .content {
  margin-left:50px;
}
.homepage.gt-1700 .content,
.not-homepage.gt-1500 .content {
  margin-left:100px;
  width:700px;
}
.content .inside {
  float:left;
  width:100%;
}
.partner-logos {
  margin:110px 20px 0 0;
  float:right;
  width:250px;
  overflow:hidden;
}
.partner-logos .partner-logos-inner {
  width:260px;
}
.partner-logos a {
  float:left;
  margin:0 10px 15px 0;
  position:relative;
  
  zoom:1;
  filter:alpha(opacity=50);
  opacity:0.5;
}
.partner-logos a:hover {
  background:none !important;
  
  zoom:1;
  filter:alpha(opacity=100);
  opacity:1;
}
.partner-logos a img {
  float:left;
  border:none;
}

.col.left .logo {
  height:260px;
  background:url("../images/logo-h150.png") center 8px no-repeat;
  display:block;
  text-indent:-9999px;
}

ol.menu {
  margin:0 0 0 10px;
  padding:10px 0 40px 30px;
  background:url("../images/lat-tr.png") bottom left no-repeat;
}
.homepage.lt-1200 ol.menu,
.not-homepage.lt-1100 ol.menu {
  margin-left:5px;
}
.homepage.gt-1500 ol.menu,
.not-homepage.gt-1300 ol.menu {
  margin-left:25px;
}
.homepage.gt-1700 ol.menu,
.not-homepage.gt-1500 ol.menu {
  margin-left:45px;
}

ol.menu li {
  margin:0;
  padding:1px 0 1px 3px;
  
  color:#ddd;
  font-weight:bold;
  font-size:16px;
}
.homepage.lt-1200 ol.menu li,
.not-homepage.lt-1100 ol.menu li {
  padding:0 0 0 3px;
}

ol.menu li a,
ol.menu li a:hover {
  display:inline-block;
  padding:1px 3px;
  font-weight:bold;
  letter-spacing:-1px;
  font-family:Cabin, Helvetica, Arial, sans-serif;
  font-size:17px;
  text-transform:uppercase;
  color:#fff;
  text-decoration:none;
  background:none;
}
.homepage.lt-1200 ol.menu li a,
.homepage.lt-1200 ol.menu li a:hover,
.not-homepage.lt-1100 ol.menu li a,
.not-homepage.lt-1100 ol.menu li a:hover {
  font-size:15px;
}
body.modern ol.menu li a {
  text-shadow:1px 1px 2px #000;
}
body.ie9 ol.menu li a {
  color:#444;
  
  zoom: 1;
  background-color:#000;
  filter: progid:DXImageTransform.Microsoft.Chroma(color=#000000),
          progid:DXImageTransform.Microsoft.Blur(pixelradius=1);
}
body.ie9 ol.menu li a:before {
  /* color and width of the original text */
  color:white;
  width:230px;
  
  /* This is needed to place the text directly over the shadow. */
  position: absolute;
  
  /* This assumes that the data-innertext is the same as the text inside the element. */
  content: attr(data-innertext);
  
  /* Positions the text */
  margin-top:0px;
  margin-left:0px;
}
body.ie9 ol.menu li a:hover {
  color:#444;
}


h2 {
  margin:40px 0 30px 0;
  padding:0;
  font-family:Nobile, Helvetica, Arial, sans-serif;
  font-size:23px;
  line-height:26px;
  font-weight:bold;
  font-style:italic;
  color:#6d3a21;
}
h2 a,
h2 a:hover {
  color:#6d3a21;
  text-decoration:none;
  background:none;
}
h3 {
  margin:25px 0 20px 0;
  font-size:16px;
  font-weight:bold;
  line-height:20px;
  color:#007E1E;
}
h3 a,
h3 a:hover {
  color:#007E1E;
  text-decoration:none;
  background:none;
}
.blog-item p.meta.published {
  display:none;
}
p {
  margin:15px 0;
}
a {
  color:#03339A;
}
a:hover {
  background:#03339A;
  color:#fff;
  text-decoration:none;
}

p img {
  max-width:100%;
}


.intro.items {
  margin:0 -10px;
}
.intro.items .row .col {
  float:left;
}
.intro.items.columns-1 .row .col {
  width:100%;
}
.intro.items.columns-2 .row .col {
  width:50%;
}
.intro.items.columns-3 .row .col {
  width:33.33%;
}
.intro.items.columns-4 .row .col {
  width:25%;
}
.intro.items .row .col .item {
  padding:0 10px;
}


.contact.category .face img {
  max-width:100px;
  max-height:200px;
  float:right;
}

.contact p.address {
  padding-left:22px;
  background:url("../images/c-address.png") 0 3px no-repeat;
}

.contact p.telephone {
  padding-left:22px;
  background:url("../images/c-telephone.png") 0 3px no-repeat;
}

.contact p.email {
  padding-left:22px;
  background:url("../images/c-email.png") 0 3px no-repeat;
}
