/******************************
* connex.io Template Main CSS *
******************************/

/****** 
* Elements 
******/
html {height:100%; font-family: Helvetica, Arial, sans-serif;}
body {height:100%; background-color:#dcdcdc;}
div {}
h1 {font-size:18pt; line-height:22pt; color:#104c81; padding:20px 0px 10px 0px;}
h2 {font-size:14pt; line-height:19pt; color:#104c81; padding:10px 0px 10px 0px;}
h3 {font-size:13pt; line-height:17pt; color:#4f4f4f; font-weight:normal; text-transform:uppercase;}
h4 {font-size:13pt; line-height:17pt; color:#4f4f4f; font-weight:normal; padding:20px 0px 0px 0px;}
p, ul, ol, li, table, tr, td {font-size:11.5pt; line-height:16pt; color:#4f4f4f; padding:0px 0px 10px 0px;}
li {}
ul {margin:10px 0px 0px 40px;}
ul li {list-style-type:square;}
ol {margin:10px 0px 0px 40px;}
ol li{list-style-type:decimal;}
hr {width:100%; height:1px; color:#4f4f4f; background-color:#4f4f4f; border:0px; margin:0px 0px 20px 0px;}

a {color:#104c81; text-decoration:none;}
a:hover {color:#f04100; border-bottom:1px #f04100 dotted;}

/****** 
* IDs 
******/
#main {min-height:100%; width:900px; margin:0px auto 0px auto; border: solid #b8c7d6; border-width:0px 2px 0px 2px; background-color:#ffffff;}
#container {width:900px; overflow:visible; padding:0px 0px 201px 0px;}

/* Header */
#head {position:relative; height:123px; width:900px; background:#ffffff; z-index:10;} 
#logo {float:left; padding:16px 14px 16px 54px;}
	#logo a:hover {border-bottom:0px;}
#topNavigation {position:absolute; top:53px; right:67px;}
#topNavigation a {color: #999999;}
#topNavigation a:hover {color: #f04100;}

/* Content Area*/
#content{padding:0px 67px 55px 67px; position:relative; overflow:visible; z-index:5;}

/* Footer */
#footerBackground {width:100%; height:201px; position:relative; bottom:0px; background:url('../img/footerBG2.png') repeat-x; background-position:bottom; margin:-201px 0px 0px 0px;}
#footer {width:900px; height:201px; background:url('../img/footerBG.png') repeat-x; color:#ffffff; font-size:13px;margin: 0px auto 0px auto;}
#footerLeft {float:left; width:335px; height:160px; padding:40px 0px 0px 100px;}
#footerRight {float:left; width:565px;}
#footerNavigation {}
#serviceNavigation {padding:40px 0px 0px 0px;}
#description {padding:30px 67px 0px 0px;}
#share {padding:15px 0px 0px 0px;}
#share a {color:#ffffff;}
#share a:hover {color:#f04100;}
#copyright {padding:25px 0px 0px 0px;}

/* Swoosh */
#swooshMiddle {position:relative; z-index:15; top:92px; width:850px; height:51px; background:url('../img/swooshMiddle.png') no-repeat left top; margin:0px 0px 0px -3px;}
#swooshMiddleRight {position:absolute; z-index:15; top:92px; right:0px; width:56px; height:151px; background:url('../img/swooshMiddle.png') no-repeat right top; margin:0px -3px 0px 0px;}
#swooshBackground{width:100%; height:163px; background:url('../img/swooshGrey.png') no-repeat center; position:absolute; left:0px; top:84px; z-index:-1;}
#swooshLeft {width:50%; height:26px; position:absolute; left:0px; top:110px; background-color:#0d3c80; z-index:-2;}
#swooshRight {width:50%; height:25px; position:absolute; right:0px; top:84px; background-color:#0d3c80; z-index:-2;}

/* Illustration */
#teaser {width:766px; margin:0px 0px 10px 0px; padding:30px 0px 0px 0px; text-align:center;}
#illustration {width:766px; height:317px; background:url('../img/illustration.png') no-repeat;}
#slogan {margin:37px 0px 0px 0px;}
#catchPhrase {font-size:15pt; line-height:17pt; font-family: Georgia, "Times New Roman", Times, serif; color: #104c81; margin:0px 0px 0px 0px; padding:0px 0px 0px 0px; font-weight:normal;}
#ccu {font-size:30pt; line-height:40pt; font-family: Georgia, "Times New Roman", Times, serif; color: #104c81; margin:0px 0px 0px 0px; padding:0px 0px 0px 0px; font-weight:normal;}
#explanation {font-size:13pt; line-height:17pt; text-transform:none; font-family: Georgia, "Times New Roman", Times, serif; color: #4f4f4f; margin:0px 0px 0px 0px; padding:15px 0px 0px 0px; font-weight:normal;}

/* Call to Action*/
#orangeBoxLong{width:766px; background:url('../img/orangeBoxLong.png') no-repeat; margin:30px 0px 0px 0px; padding: 15px 0px 15px 0px; text-align:center;}
#ctoLine1 {}
	#ctoLine1 p {float:left; padding:4px 10px 0px 115px; color:#ffffff; font-size:14pt; }
#ctoLine2 {clear:both;}
	#ctoLine2 p{font-size:8pt; line-height:8pt; color:#ffffff; padding:5px 0px 0px 0px;}
	#ctoLine2 a:hover {color:#ffffff;}


/* Propositions */
#propositions {width:766px; height:210px; margin:30px 0px 0px 0px;}
#time {}
#mind {}
#security {}

/****** 
* Classes 
******/
.small {font-size:8pt; line-height:10pt;}
.italic {font-style:italic;}
.left {float:left; width:520px; padding:0px 20px 10px 0px; margin:0px 20px 0px 0px; border-right: 1px solid #a8bbcd;}
.right {color:#00396d; font-style:italic; font-size:12.5pt;}
.clear {clear:both; width:0px; height:0px;}
.ten {padding:10px 0px 0px 0px;}
.twenty {padding:20px 0px 0px 0px;}
.thirty {padding:30px 0px 0px 0px;}
.forty {padding:40px 0px 0px 0px;}
.spacing10 {padding:0px 10px 0px 10px;}
.indent {padding:0px 0px 0px 15px;}
.middle {vertical-align:middle;}

/* Buttons */
.buttonTable{}
.buttonLeft {width:3px; height:32px; background:url('../img/buttonGoLeft.png') no-repeat; padding:0px;}
.buttonMiddle {width: 130px; height:32px; background:url('../img/buttonGoMiddle.png') repeat-x; vertical-align:middle; text-align:center; padding:0px;}
.buttonRight {width:3px; height:32px; background:url('../img/buttonGoRight.png') no-repeat; padding:0px;}
.buttonLink {color:#ffffff; font-size:14pt;}
.buttonLink:hover {border:0px;}

/* Illustration */
.illustrationTextBox {float:left; width:165px; margin:0px 0px 0px 5px; padding:27px 15px 10px 15px;}
.illustrationTitle {font-size:14pt; font-weight:bold; color:#104c81; padding:0px 0px 10px 0px;}
.illustrationText {font-size:10pt; line-height:14pt;}

/* Propositions */
.icon {float:left; padding:0px 10px 0px 20px;}
.iconDescription {font-size: 26px; font-weight:normal; color:#104c81; line-height:39px; height:45px; padding: 0px 0px 0px 0px;}
.propositionBox {float:left; width:242px; margin:0px 20px 0px 0px; padding:20px 0px 0px 0px; height:190px; background:url('../img/greyBoxLong.png') no-repeat;}
.propositionBoxRight {float:left; width:242px; margin:0px 0px 0px 0px; padding:20px 0px 0px 0px; height:190px; background:url('../img/greyBoxLong.png') no-repeat;}
.propositionText {padding:10px 25px 15px 25px; font-size:11.5pt; }
.propositionLink {color:#104c81; text-decoration:none; margin:0px 5px 0px 25px;}
.propositionLink:hover {color:#f04100; border-bottom:1px #f04100 dotted;}

/* Top Navigation */
.topNavigationList {margin:0px; padding:0px;}
.topNavigationItem {float:left; padding:0px 0px 0px 10px; margin:0px 0px 0px 0px; list-style-type: none; font-size: 16px; color: #a6a6a6; text-transform:uppercase;}

/* Footer Navigation */
.footerNavigationTopList {margin:0px; padding:0px;}
.footerNavigationTopItem {float:left; margin:0px 0px 0px 0px; list-style-type: none;}
.footerNavigationList {margin:0px; padding:0px;}
.footerNavigationItem {padding:0px 40px 10px 0px; margin:0px 0px 0px 0px; list-style-type: none; font-size:10pt; line-height:1; color:#ffffff;}
.footerNavigationItem  a {color:#ffffff; text-transform:uppercase; border-bottom:1px #ffffff dotted;}
.footerNavigationItem  a:hover {color:#f04100; border-bottom:1px #f04100 dotted;}

/* Service Navigation*/
.serviceNavigationList{margin:0px; padding:0px;}
.serviceNavigationItem {float:left; padding:0px 10px 0px 0px; margin:0px 0px 0px 0px; list-style-type: none; font-size:10pt; line-height:1; color:#ffffff;}
.serviceNavigationItem  a {color:#ffffff; text-transform:uppercase; border-bottom:1px #ffffff dotted;}
.serviceNavigationItem a:hover {color:#f04100; border-bottom:1px #f04100 dotted;}