                                                                /*
*	Layout CSS Adroy
*/
@font-face {
  font-family: Pluto;
  src: url("../webfont/OTF/PlutoSansRegular.otf") format("opentype");
}

@font-face {
  font-family: PlutoLight;
  src: url("../webfont/OTF/PlutoSansLight.otf") format("opentype");
}

* {padding: 0; margin: 0;}
html, body {height: 100%;}
body {font-family: 'PlutoLight', sans-serif; font-size: 12px; line-height: 23px; color: #555;}
.clear {clear:both;}
.left {float:left;}
.right {float:right;}
.center {text-align: center;}
.white {color: #FFF !important;}
a {text-decoration: none; color: #555;}
p a:hover {color:#231F20;}
h1, h2 {display: inline-block; font-size: 32px; line-height: 42px; font-weight: 400; /* padding: 0 30px 10px 0; */ /* margin: 0 0 30px 0; */ text-transform: uppercase; color: #404040;}
h3 {font-size: 20px; line-height: 25px; font-weight: 400; padding: 0 0 15px 0; color: #444;}
p + h3 {margin-top: 15px;}
h4 {display: inline-block; font-size: 32px; line-height: 32px; text-transform: uppercase; border-top: 1px solid #A77959; border-bottom: 1px solid #A77959; padding: 14px 10px 12px 10px; 
	margin: 0 0 15px 0; color: #A77959;}
p {padding: 0 0 15px 0; line-height: 24px;}
a img {border: 0;}
p img {width:auto; max-width:95%; height:auto;}
table {max-width:100% !important;}

/*	Header & Backgrounds:
--------------------------------------------------*/
#home { position: relative; z-index: 1;}
.slideImage { position: relative; z-index: -1; }
#headerWrap {position:fixed; width:100%; z-index:999;}
#header {height: 100px;background-color: #FFF; position:relative; width: 100%; padding:20px 0;border-bottom: 1px solid #666666;}
#header .container {position:relative;}
#logo {position:relative;top:20px;left:0;}
#social {float:right; margin:0px; color: #D0B8A8;}
#social img {vertical-align: -4px; padding: 0 0 0 8px; opacity: 0.5;}
#social img:hover {opacity: 1;}
#banner {overflow: hidden;}
#banner .logoImage {display:inline-block; margin-right: 30px; padding-right: 30px; border-right: 1px solid #666666;}
#banner-text {position: absolute; top: 26%; right: calc(50% - 490px); width: 980px; z-index: 99; font-size: 18px; color: #fff;}
#inner-text {width: 470px;}
#banner-text h1 {font-size: 42px; line-height: 42px; color: #fff;}
#banner-text a {
  width: 145px;
  color: #000000;
  display: block;
  height: 50px;
  line-height: 52px;
  margin-top: 25px;
  padding-left: 50px;
  text-transform: uppercase;
  border: 1px solid #000000;
  background: url("../images/logoSmall-hov.png") no-repeat scroll 15px center #FFFFFF;
  -webkit-transition: all 0.6s;
  -moz-transition: all 0.6s;
  -o-transition: all 0.6s;
  transition: all 0.6s;
}
#banner-text a:hover {
  color: #FFF;
  background: url('../images/logoSmall.png') #404040 15px no-repeat;
  border: 1px solid #FFF;
  -webkit-transition: all 0.6s;
  -moz-transition: all 0.6s;
  -o-transition: all 0.6s;
  transition: all 0.6s;
}
.background {background: url(../images/white-bg.png); border-bottom: 1px solid #404040;}
.background.alt {background: url(../images/bg.png);}
.background.eol {border: 0;}
.container {width:980px; margin:0 auto;}
.content {padding: 60px 0 60px 0;}
#login {padding: 200px 0 20px 0;}
.hide {display: none;}
#UserDefinedForm {padding: 0 5%;}

#download { 
  width: 360px; 
  position: relative; 
  bottom: 100px; 
  left: calc(50% - 180px);
  height: 48px; 
  font-size: 15px; 
  background: url(../images/pdf.png) left center no-repeat;
  padding-left: 60px;
}
#download a { color: #FFF; display: block;}
#download a:hover { text-decoration: underline; } 

@media all and (max-width:1240px){
}

/*	Nav:
--------------------------------------------------*/
#nav  {padding:47px 0 0 0; float:right; clear:right;list-style: none;}
#menuHolder {display:none;}
#nav li {position: relative; float: left; padding: 1px 15px; border-right: 1px solid #404040;}
#nav li.eol {padding-right: 0; border: 0;}
#nav li a {display:block; font-size:14px; line-height: 17px; text-transform: uppercase; color: #404040;}
#nav li.current a {color: #000;}
#nav li a:hover {color: #000;}
#scrollTo {position: fixed;right: 80px;bottom: 80px;z-index: 1000;}

/*	Footer:
--------------------------------------------------*/
#footer {background: #404040; padding: 15px 0;font-size: 16px; line-height: 18px; color: #fff;}
#footer a {color: #fff; text-decoration: none;}
#footer a:hover {text-decoration: underline;}
#footer .footer-content {width:980px;margin: 0 auto;}
#footer .foot-name {font-weight: bold; margin-bottom: 5%;display: block;}
#footer .footer-div {width:20%;height:60px;display: inline-block;background:url(../images/logoSmall.png) center no-repeat;}
#footer .footer-inner {width: 19%;display: inline-block;}
#footer .foot-info {padding-right: 10px;}
#footer #foot-bottom, #footer #foot-copy {text-align: center;display: block;padding-top: 10px;font-size: 14px;}
.UserPage #footer {width: 100%;position: absolute; bottom: 0;}

/*  Adroy page  */
.adroyImg { padding-bottom: 30px; }
.leftContent .eol { padding-top: 46px; }
.rightContent .eol { padding-top: 46px; }
.adroyTable {width:100%;height: 100%;font-size:12px;line-height:18px;}
.adroyTable .leftContent {padding-bottom: 25px;}
.adroyTable .rightContent {padding-bottom: 25px;}
.adroyTable .introText {font-size:14pt;line-height:20pt;}
.adroyTable td {width:50%;padding: 10px 5%; vertical-align:top;}
.adroyTable tr:first-of-type {border-top:1px solid #D3D3D3;}
.adroyTable td:first-child {border-right:1px solid #D3D3D3;}
.adroyTable .alt {border-right: 1px solid #666666 !important;}
.adroyTable img {display:block;margin: 0 auto}
.adroyFooter {background-color: #404040;color:#FFF;}
.adroyFooter > td {border-top:1px solid #808080;}
.smallLogo {background:url(../images/logoSmall.png) 90% 50% no-repeat;}
.adroyFooter img {display:inline-block;}
.adroyTable table td {padding:0;}
.adroyTable table td:nth-child(odd) {padding-right:5%;width:45%;border:none;}
.adroyTable table td:nth-child(even) {padding-left:5%;width:45%;border:none;}
.adroyTable .teamBG {background:url(../images/teamBG.jpg) top left no-repeat;background-size: 100%;}
.adroyTable #introText {position:relative;left:15%;top:100%;font-size:30px;line-height:38px;text-align:center;}
.adroyTable .nopad {padding:0;}
.adroyTableInner {width:100%;table-layout: fixed;padding:0 5%;}
.adroyTableInner td {width:50%;padding:10px 5%; vertical-align:top;}
.smoothH2 {padding: 30px 30px 30px 5%;border-bottom: none; font-size: 32px;color: #000000;}
.whatHidden, .teamHidden {width:90%;margin: 15px auto;display:none;border-bottom: 1px solid #666666;}
.whatHidden .smoothH2, .teamHidden .smoothH2 {width:90%;text-align:center;}
.whatHidden img, .teamHidden img {display:block;margin: 0 auto;}
.aboutA {padding-bottom: 0;}
.aboutB {padding-top: 0;}
#about div  {padding-top:50px;}

@media all and (max-width:1020px){
	.container {display:block; padding:0px 20px 0px 20px; width:auto;}
	#banner {/* height:auto; */}
        #banner .logoImage {display: none;}
        #banner-text {width: 500px; left: calc(50% - 250px)}
        #inner-text {width: 500px;}
	.content {padding:120px 20px 60px 20px;}
	#photos img {width:30%; margin:20px 1.5%;}
	#contact {height:auto; padding:220px 20px 140px;}
	#contact-details tr td {width:50%; padding:0px !important;}
	#contact-details tr td iframe {width:98%;}
        #footer .footer-div {width:10%;}
        #footer .footer-content {width:100%;text-align:center;font-size:12px;}
        #footer .foot-name, #footer .foot-info {font-size:12px;}
        #footer .foot-info {display:inline-block;}
        #footer .foot-name {padding-top:10px;}
        #footer .footer-inner {width:180px;}
        #footer #foot-copy {font-size:10px;}
        #banner .logoImage { left: calc(50% - 220px); top: 20%; border: none; }
}

@media all and (max-width:920px){
	#nav li a {font-size:13px; line-height:16px;}
}

@media all and (max-width:850px){
	#social {margin:45px 0px 0px 0px;}
	#logo {margin:0px 0px 25px 13px;}	
	#nav {float:left; clear:both; padding: 0px;}
	#banner-text {right: 10%;}
	#contact {background: url(../images/contact-bg.png) no-repeat bottom right;}
        #footer .footer-div {display:none;}
}

@media all and (max-width:750px){
	input.action {padding: 5px 20%;}
}

@media all and (max-width:630px){
        body, .adroyTable {font-size: 12px;}
	#header {padding: 0px 0px 40px 0px;}
	#logo {/* margin:0px; */ float: none; width: 70%; margin: 0px auto 10px auto;/* height:auto; */}
	#nav {clear:none; position:relative; background: url(../images/mainMenuDropLines.png) 95% 12px no-repeat, #FFF; float:left; width: 97%; padding: 4px 10px 0px 7px; margin: 10px 0px 10px 0px;border: 1px solid #404040;display: block;}
	#nav li {display:none; float:none; border:none; padding:0px; margin:0px;border-bottom: 1px solid #ccc;}
	#nav li.current {display:block;}
	#nav:hover li {display:block;}
	#nav li a {padding: 7px 10px 10px 10px; font-size:15px; line-height:17px;}
	#nav #menuHolder {z-index:10; display:block; top:0px; left:0px; height:38px; position:absolute; width:100%;}
	#nav:hover #menuHolder {display:none;}
	#contact-details {width:95%; margin:0px auto;}
	#contact-details tr td {display:block !important; width:100% !important; padding:0px 0px 20px 0px !important;}
	#banner-text {font-size:14px; line-height:20px; width: 90%; /* right: 0; */left: 0;padding: 20px;}
        #inner-text {width: 100%;}
	#banner-text h2 {font-size:40px; line-height:44px;}
	.content {padding:75px 20px 60px 20px;}
	#contact {padding:75px 20px 140px 20px;}
        .adroyTable .teamBG, .WhatPage, .firstTeam  {display:none;}
        .whatHidden, .teamHidden {display:block;}
        #footer .foot-name {display:block;}
        #footer .footer-inner { padding-left: 5%; }
        #footer .footer-inner:first-child { padding-left: 0; }
        #scrollTo {right: 0;bottom: 20px;}
        .adroyImg {width: 80%;}

@media all and (max-width:630px) and (max-height:550px){
	#banner-text {top:16%;}
}

@media all and (max-width:550px){
	#photos img {width:90%; margin:20px 5%;}
        #banner .logoImage { display: none; }
}

@media all and (max-width:420px){
	#logo {float:none; margin:0px auto 25px auto; display:block; width:60%;}
	#nav {/* margin:10px 0px 0px 0px; */ float:none; display:block; clear:both; background: url(../images/mainMenuDropLines.png) 95% 13px no-repeat, #fff;z-index: 2;position: relative; padding: 0px 0 0 15px; }

ul#nav {}
	#nav li a {font-size:17px; line-height:18px; padding:10px 15px 10px 15px;z-index: 999;color: #000;}
	#header {padding:10px 0px 0px 0px;}
	#card {width:auto; display:block;}
	#card a {display:block; font-size:14px;}
	#card a  img {width:73%; height:auto;}
	#banner-text {/* top:30%; */}
	#banner-text h2 {font-size:35px; line-height:37px;}
	.content {padding:100px 20px 60px 20px;}
	#contact {padding:100px 20px 140px 20px;}
	#header.lower #logo {display:none;}
	#header.lower #nav {margin:0px;}
        #footer .footer-inner {padding-left: 0;}
}
       