@charset "utf-8";
/* CSS Document 

font-family: 'Questrial', sans-serif;
font-family: 'Roboto Condensed', sans-serif;
*/

body {color: #282828; font-family: 'Questrial', sans-serif; font-size: 0.8em; background-color:#eeeeee; margin:0 auto; height:auto;}
h1 {font-size:3.6em; font-family:'Roboto Condensed'; color:#0e3455; width:80%; margin:25px auto 10px; text-align:center; text-transform:uppercase; line-height:100%;}
h2 {font-size:1.8em; font-family: 'Questrial', sans-serif; color:#36697e; margin:25px auto 10px; text-align:center; width:50%;}
h3 {font-size:2em; font-family:'Roboto Condensed', sans-serif; color:#282828; text-transform:uppercase; margin:0; padding:0;}
h4 {font-size:1em;}
.left {float:left;}
.right {float:right;}
.clr {clear:both;}
ul {list-style:none; padding:0; margin:0;}
p {font-size:1.4em;}
.btn {padding:10px 25px; background:#eb5a49; color:#FFFFFF; font-family:'Roboto Condensed', sans-serif; text-decoration:none; text-transform:uppercase; font-weight:700; font-size:1.2em; display:inline-block;}
.btn:hover {background:#d8402f;}
.coming-soon {border:1px dashed #ffffff; color:#ffffff; display:inline; font-size:0.6em; margin-left:10px; padding:5px 8px; opacity:0.5;}
img {border:0;}

/* CLEARFIX */
.clearfix:before, .clearfix:after {content: " "; display: table;}
.clearfix:after {clear: both;}
.clearfix {*zoom: 1;}

/* HEADER & NAV */
header {width:100%; height:40px;}
a.logo {background:url(../images/attentio-logo.png) no-repeat center center #FFFFFF; width:150px; padding:10px; margin:0 0 0 20px; display:block; float:left; height:46px; border-bottom:1px solid #74B2B2; padding-bottom:20px; z-index:999; position:relative;}
nav {height: 40px; width: 100%; background: #dbdbdb; position: relative; border-bottom: 1px solid #ffffff; z-index:1; display:block;}
nav ul {padding: 0; margin: 0 auto; height: 40px;}
nav li {display: inline; float: left;}
nav a {padding:10px 25px; color:#282828; text-decoration:none; text-transform:uppercase; font-family:'Roboto Condensed', sans-serif; font-weight:700; font-size:1.2em; display:inline-block;}
nav li a {box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;}
nav a:hover, nav a:active {background-color: #c9c9c9; color:#FFFFFF;}
nav ul li a.active {background:#ededed; color: #282828;}
nav a#pull {display: none;}

/* SECTIONS */
.container {height: auto; margin: 0; padding: 0; width: auto;}
.inner {height: auto; margin: 0 auto; max-width: 1170px; padding: 35px 0 50px; position: relative; width: 100%; text-align:center;}
.inner:after, .inner:before {clear: both;}

section {border-bottom:1px solid #FFFFFF; height:100%; display:block;}
section#intro {background:#86cccc; padding:25px; text-align:center;}
section#intro.home {border-bottom:none;}
section#home {background:url(../images/home_bg.png) no-repeat center center #86cccc; padding:0 25px 25px; text-align:center; min-height: 400px;}
section#info {background:#36697e; padding:25px;}
section#footer {color:#999; width:100%; bottom:0; border-bottom:none; height:auto;}
section#products {background:#4b8192; padding:15px 0 50px; min-height:413px; color:#FFFFFF;}
section#consulting {background:#eb5949; color:#FFFFFF;}
section#gray {background:#eeeeee; position:relative; top:0px; padding-top:50px; border-bottom:1px solid #bababa;}
section#monitoring {background:#ffffff; color:#666666;}
section#customers {background:#e4e4e4;}
section#about {background:#00bbaa; color:#FFFFFF;}
section#technology {background:#d4d4d4; position:relative; border-bottom:1px solid #dddddd;}
section#map {background:#DFD2BB;}
section#contact {background:#f4b244;}

/* HOMEPAGE */
section#info .inner {max-width:1380px;}
section#intro p {color:#36697e; font-weight:700;}
section#intro p a {color:#36697e;}
section#home .inner {padding-top:0;}
section#home .inner .btn {padding:10px 25px; background:#eb5a49; color:#FFFFFF; font-family:'Roboto Condensed', sans-serif; text-decoration:none; text-transform:uppercase; font-weight:700; font-size:2.2em; display:inline-block;}
section#home .inner .btn:hover {background:#d8402f;}
section#home .inner .btn i.fa-chevron-right {float: right; font-size: 0.6em; margin-left: 15px; margin-top: 11px;}
section#info .inner {padding-top: 10px; text-align: left;}
section#info .left{width:80%; color:#FFFFFF; margin:0 auto; float:none;}
section#info .right{width:30%; border-left:1px solid #284f5f; padding-left:40px; margin-left:20px;}
section#info .right .press{background:#FFFFFF; border:1px solid #284f5f; padding:10px;}
section#info .right .press h3 {background:#f4b400; padding:10px; margin:-10px -10px 10px -10px; font-size:1.6em;}
section#info .right .press ul li {margin-bottom:10px; background:url(../images/press_icon.png) no-repeat top left; min-height:20px; padding:0 30px 5px; color:#36697e; font-size:1.25em;}
section#info .right .press ul li i {font-size:0.8em; color:#a4a5a9; display:block; margin-top:5px;}
section#info .left .about {float: left; margin-left: 10px; width: 35%; margin-top:40px;}
section#info .left h3 {color:#FFFFFF; line-height:115%;}
section#info .image {background: url(../images/info-image.png) no-repeat left top; float: left; height: 344px; width: 570px;}

/* PRODUCTS */
section#intro.products {border-bottom:none;}
section#intro.products .inner{padding:0;}
section#products .inner {margin: 0 auto; width: 60%;}
select.tinynav {border:0; border-radius:0;  padding:10px 45px 10px 10px;}
.tinynav {display: none; background:url(../images/arrow-down.png) no-repeat center right #4b8192; color:#FFFFFF; text-align:center; margin: 0 auto;text-decoration:none; text-transform:uppercase; font-family: 'Roboto Condensed', sans-serif; font-weight:700; font-size:1.2em; border:0;}
.tinynav option{background:#0e3455; padding:10px 25px; border:0;}
ul.products-nav{margin:50px auto -25px; text-align:center; }
ul.products-nav li {display:inline;}
ul.products-nav li a {background:#0e3455; color:#FFFFFF; padding:10px 25px; display:inline-block; text-align:center; margin: 0 5px;text-decoration:none; text-transform:uppercase; font-family: 'Roboto Condensed', sans-serif; font-weight:700; font-size:1.2em;}
ul.products-nav li a:hover {opacity:0.7;}
ul.products-nav li.active a {background:#4B8192; color:#FFFFFF;}
section#products .desc {float: left; margin-left: 30px; text-align: left; width: 50%; color:#FFFFFF;}
section#products .desc h3 {color:#FFFFFF;}
section#products .desc p {margin-bottom: 25px;}
section#products .img {display: block; float: left; width: 44%;}
section#products .img img {vertical-align: bottom; float:left; width:100%;}
section#products ul {list-style:square; margin-bottom:25px;}
section#products ul li {list-style:square; margin:10px 10px 10px 15px; font-size:1.4em;}

/* SERVICES */
section#consulting .three {width:24%; display:inline-block; text-align:center; vertical-align:top; position:relative; float:none;}
section#consulting .three img {left: 0; margin: 0 auto; position: absolute; right: 0; top: -15px;  z-index:999; width:265px;}
section#consulting .three.left h2, section#consulting .three.left p {text-align:left;}
section#consulting .three.left h2, section#consulting .three.right h2 {margin-top:0; line-height:100%; font-family:'Roboto Condensed'; text-transform:uppercase;}
section#consulting .three.right h2, section#consulting .three.right p {text-align:right;}
section#consulting h2, section#consulting h3, section#consulting p {color:#FFFFFF; padding:0; width:100%;}
section#consulting .inner {max-width:1314px; padding:35px 0;}
section#gray .inner {padding:105px 0 30px;}
section#gray .stat {padding:10px 0 0; width:100%; text-align:center; margin:0 auto; color:#666666;}
section#gray h2 {color: #666666; font-size: 1.7em; font-weight: normal; width: 40%;}
section#gray p, section#gray b {font-weight:700; float:left; font-size:2em; width:39%; text-align:left; margin-top:9px; margin-bottom:0;}
section#gray b {font-size:6em; width:22%; text-align:center; margin-top:0;}
section#gray p.left {text-align:right;}
section#monitoring .inner {max-width:1314px;}
section#monitoring .three {width:33%; display:inline-block; text-align:center; vertical-align:top; margin-top:20px; position:relative;}
section#monitoring .three .monitor {width:350px; height:265px; margin:10px auto 0; position:relative;}
section#monitoring .three .monitor.industry-websites {background:url(../images/odometer_industry-websites_bg.png) no-repeat center center;}
section#monitoring .three .monitor.articles-daily {background:url(../images/odometer_articles-daily_bg.png) no-repeat center center;}
section#monitoring .three .monitor.social-opinions {background:url(../images/odometer_social-opinions_bg.png) no-repeat center center;}
section#monitoring .three .monitor b {bottom: 45px; color: #0e3455; font-size: 1.6em; font-weight: 700; margin: 0 auto; position: absolute; right: 53px; text-transform: uppercase;}
section#monitoring .three i {font-weight:700; font-size:1.7em; margin-top:10px; font-style:normal; display:block;}
section#monitoring .two {width:33%; display:inline-block; text-align:center; vertical-align:top; margin-top:20px; position:relative;}
section#monitoring .two .monitor {width:350px; height:265px; margin:10px auto 0; position:relative;}
section#monitoring .two .monitor.industry-websites {background:url(../images/odometer_industry-websites_bg.png) no-repeat center center;}
section#monitoring .two .monitor.articles-daily {background:url(../images/odometer_articles-daily_bg.png) no-repeat center center;}
section#monitoring .two .monitor.social-opinions {background:url(../images/odometer_social-opinions_bg.png) no-repeat center center;}
section#monitoring .two .monitor b {bottom: 55px; color: #0e3455; font-size: 1.3em; font-weight: 700; margin: 0 auto; position: absolute; right: 46px; text-transform: uppercase;}
section#monitoring .two i {font-weight:700; font-size:1.7em; margin-top:10px; font-style:normal; display:block;}
section#monitoring h2 {color:#282828; padding:0; width:100%; text-transform:uppercase; font-family:'Roboto Condensed', sans-serif; font-size:2.6em; margin-top:5px;}
section#monitoring h3, section#monitoring p {color:#666666; padding:0; width:100%;}
section#monitoring h3 {font-size:1.8em;}

/* CUSTOMERS */
section#customers .inner {min-height:520px;}
section#customers .three {width:31%; display:inline-block; text-align:center; margin-bottom:15px; padding:10px;}
section#customers .three a.customer-logo {background:#ffffff; border: 1px solid #d5d5d5; display: block; height: 180px; position: relative; text-align: center; width: 100%; margin-bottom:15px;}
section#customers .three a.customer-logo:hover {opacity:0.7;}
section#customers .three a.customer-logo img {bottom: 0; left: 0; margin: auto; position: absolute; right: 0; top: 0;}
section#customers .three h2 {font-size:1.2em; font-family:'Roboto Condensed', sans-serif; color:#666666; text-transform:uppercase; margin:0; padding:0; width:100%;}
section#customers .three a {color:#eb5a49; font-size:1em;}
section#customers .three a:hover {color:#d8402f;}

/* ABOUT */
section#intro .inner.about {padding:0 50px;}
section#about .inner {max-width:900px; padding-bottom:15px;}
section#about h4 {font-size:2em; margin:0 0 20px;}
section#about b {font-weight:400; font-size:1.3em;}
section#technology .inner {max-width:1380px; padding-bottom: 10px; top:-100px; padding-top: 70px;}
section#technology p {margin-top:0; text-align:left;}

/* CONTACT */
#googleMap iframe {width: 100%;}
#googleMap {height: 350px;}
#googleMap img { max-width: none; }
section#contact h3 {text-align:left;}
section#contact p {text-align:left; margin:5px 0;}
section#contact a {color:#282828; font-weight:700;}

section#contact .three {width:30%; float:left; text-align:left; margin-right:50px;}
section#contact .three.message {width:30%; margin-right:0px;}
section#contact .three.message iframe, section#contact .three.uptodate iframe {margin:5px 0 0 0; padding:0; min-height:280px;}
section#contact .three.address {margin-left:50px; margin-right:0;}

/*section#contact .left, section#contact .right {width:49%;}
section#contact input[type="text"], section#contact textarea {padding:5px; margin-bottom:5px; width:95%; display:inline-block; font-family:'Roboto Condensed', sans-serif; font-size:1.2em; text-transform:uppercase;}
section#contact input[type="submit"] {background:#282828; color:#FFFFFF; padding:5px 25px; text-decoration:none; font-family:'Roboto Condensed', sans-serif; font-size:1.2em; text-transform:uppercase; border:0; font-weight:700; cursor:pointer;}
section#contact input[type="submit"]:hover {opacity:0.7;}
section#contact input[type="submit"]:focus {opacity:1;}

section#contact .three.uptodate form {margin-top:18px;}
section#contact .three.uptodate input[type="text"] {width:80%; float:left;}
section#contact .three.uptodate input[type="submit"] {width:16.5%; float:left;}
*/


/* FOOTER */
section#footer .inner {text-align:left; max-width:100%; padding:20px 0;}
section#footer .left {width:70%; padding:0 20px;}
section#footer .right {padding:0 20px;}
section#footer .logo {background: url(../images/attentio-logo-footer.png) no-repeat scroll 0 0 / contain rgba(0, 0, 0, 0); border-bottom: none; display: block; float: left; height: 25px; margin-right: 0; width: 120px;}
section#footer a.fa {text-decoration:none;}
section#footer .fa {font-size:2em; margin-right:5px; opacity:0.5; cursor:pointer; margin-top:5px; color:#BBBBBB;}
section#footer .fa-facebook-square:hover {color:#3c5193!important; opacity:1!important;}
section#footer .fa-twitter-square:hover {color:#3aa8e0!important; opacity:1!important;}
section#footer .fa-vimeo-square:hover {color:#35b5e9!important; opacity:1!important;}
section#footer .fa-tumblr-square:hover {color:#344c6b!important; opacity:1!important;}
section#footer .copyright, section#footer ul {float:left; display:inline-block; width:80%; margin:0px 0 0 10px; color:#bbbbbb; font-size:0.9em;}
section#footer ul li a{margin:5px 10px 0 0; float:left; color:#999999; text-decoration:none; border-right:1px solid #dddddd; padding-right:10px;}












































/* NUMBER ANIMATION */
.odometer-inside {color:#eb5949; font-family:'Roboto Condensed', sans-serif; position:absolute; top:111px; right:44px; }
.odometer.odometer-auto-theme {*display: inline;}

.odometer.odometer-auto-theme .odometer-digit,  .odometer-digit {
  display: -moz-inline-box;
  -moz-box-orient: vertical;
  display: inline-block;
  vertical-align: middle;
  *vertical-align: auto;
  position: relative;
}
.odometer.odometer-auto-theme .odometer-digit,  .odometer-digit {
	font-size: 7em;
  *display: inline;
   letter-spacing:-4px;
   line-height:80%;
}
.odometer.odometer-auto-theme .odometer-digit .odometer-digit-spacer,  .odometer-digit .odometer-digit-spacer {
  display: -moz-inline-box;
  -moz-box-orient: vertical;
  display: inline-block;
  vertical-align: middle;
  *vertical-align: auto;
  visibility: hidden;
}
.odometer.odometer-auto-theme .odometer-digit .odometer-digit-spacer,  .odometer-digit .odometer-digit-spacer {
  *display: inline;
}
.odometer.odometer-auto-theme .odometer-digit .odometer-digit-inner,  .odometer-digit .odometer-digit-inner {
  text-align: left;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  overflow: hidden;
}

.odometer.odometer-auto-theme .odometer-digit .odometer-ribbon-inner,  .odometer-digit .odometer-ribbon-inner {
  display: block;
  -webkit-backface-visibility: hidden;
}
.odometer.odometer-auto-theme .odometer-digit .odometer-value.odometer-last-value,  .odometer-digit .odometer-value.odometer-last-value {
  position: absolute;
}
.odometer.odometer-auto-theme.odometer-animating-up .odometer-ribbon-inner, .odometer-animating-up .odometer-ribbon-inner {
  -webkit-transition: -webkit-transform 2s;
  -moz-transition: -moz-transform 2s;
  -ms-transition: -ms-transform 2s;
  -o-transition: -o-transform 2s;
  transition: transform 2s;
}
.odometer.odometer-auto-theme.odometer-animating-up.odometer-animating .odometer-ribbon-inner, .odometer-animating-up.odometer-animating .odometer-ribbon-inner {
  -webkit-transform: translateY(-100%);
  -moz-transform: translateY(-100%);
  -ms-transform: translateY(-100%);
  -o-transform: translateY(-100%);
  transform: translateY(-100%);
}











