/* http://fonts.googleapis.com/css?family=Kameron:400,700|Montserrat:700,400' */
html,body {height:100%;}
body {font-family: 'Kameron', sans-serif; background:#fff;}
body.about {background:url("../img/hero-berlin-1.jpg") fixed no-repeat top center;background-size: cover;}

p { font-size:14px;font-family: 'Kameron', sans-serif; font-weight: 100; } 
h1, h2, h3, h4, h5, h6 {font-family: 'Montserrat',Helvetica, Arial, sans-serif !important; font-weight:700;}

.fa {width:13px;}

a:focus {outline:none;}
input {border:none;}
form {margin:0;}
::-webkit-input-placeholder {font-style:italic;}
:-moz-placeholder {font-style:italic; }
::-moz-placeholder {font-style:italic;}
:-ms-input-placeholder {font-style:italic;}

a.anchor {margin-top: -70px;
position: absolute}

.show {display:block !important;}
.pull-left {float:left;}
.pull-right {float:right;}
.fa-right {margin-left:10px;}
.fa-left {margin-right:10px;}
.clearfix {clear:both;}

.fixed {position:fixed;}

.text-center {text-align:center !important;}


.row {width:100%; margin:auto;max-width:1600px; min-width:750px; margin:auto;}
.span13 {float:left; width:230px; margin-right:20px;}
.span14 {float:left; width: 22.33%; padding: 0px 2.33% 0px 0px;}

.yellow {color:#dac90f;}
.green {color:#8ac663;}
.orange {color:#ea9c4e;}
.blue {color:#6cbdc4;}

/* later .. */
@media (max-width: 700px) {
  .row-full {
    max-width:500px;

}
}

@media (max-width: 1000px) {
  
#content.services .copy .text {padding:60px 100px !important;}
#content.services .copy {width:70% !important; }
#content.services .bg {width:30% !important;}

#content.products .copy .text {padding:60px 100px !important;}
#content.products .copy {width:70% !important; }
#content.products .bg {width:30% !important;}
}


@media (max-width: 1300px) {
#content.services .copy p {font-size:15px;}
#content.products .copy p {font-size:15px;}
}



#box {width:100%;height:100%; min-width:750px; margin:auto; position: relative; display:block;}

#navbar .row-full { position:fixed; z-index:5000; width:100%; max-width: 1600px;
min-width: 750px;margin:auto; height:70px;}
#navbar .bg {display:none; background:rgba(255,255,255,0.98);box-shadow:0px 3px 10px rgba(0,0,0,0.1); position: fixed; z-index: 500; width: 100%;height:70px;}
#navbar ul.main-nav { margin:0px 35px; font-size:18px; }
#navbar ul.main-nav li.logo a img {margin:13px 10px 7px -20px; width:180px; height:auto;}
#navbar ul.main-nav li a {line-height:70px; margin-left:20px; color:#919191; font-size:15px;}
#navbar ul.main-nav li.cta a {background:#ea9c4e; border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;-o-border-radius:5px; color:#FFF !important; padding:5px 10px;}
#navbar ul.main-nav li a:hover {color:#676767;}
#navbar ul.main-nav li a.active {color:#676767;}
#navbar ul.main-nav li.cta a:hover {background:#f47f0a;}



.cta-box {  border-bottom-left-radius:5px; border-bottom-right-radius:5px;
 -moz-border-bottom-left-radius:5px; -moz-border-bottom-right-radius:5px;
 -o-border-bottom-right-radius:5px; -o-border-bottom-left-radius:5px;
 -webkit-border-bottom-left-radius:5px; -webkit-border-bottom-right-radius:5px;
 width:100%; min-width: 700px; margin:auto; padding:50px 0px; background:url("../img/services-image.jpg") no-repeat center center; background-size:cover; text-align:center;
}
a.cta {background:#ea9c4e; border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;-o-border-radius:5px; color:#FFF !important; padding:10px 20px;
 font-size:18px; font-family: 'Montserrat',Helvetica, Arial, sans-serif; font-weight:700;
}
a.cta:hover {background:#f47f0a;}

a.cta-light {border:1px solid #FFF; border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;-o-border-radius:5px; color:#FFF !important; padding:10px 20px;
 font-size:18px; font-family: 'Montserrat',Helvetica, Arial, sans-serif; font-weight:700;
margin-right:20px;}


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

#navbar ul.main-nav { margin:0px 20px; }
#navbar ul.main-nav li.logo a img {margin:13px 5px 7px 0px;}
#navbar ul.main-nav li a { margin:0px 5px;}

#footer {text-align:center; min-width:600px;}
#footer ul.footer-nav li img {display:none;}
#footer ul.footer-nav li a {margin-left:15px; font-size:14px;}

#footer ul.footer-nav li.pull-right a {margin-right:0px !important;}

}


#solid-white  {background:rgba(255,255,255,0.9);width:100%; height:70px; position:fixed; z-index:300; box-shadow:0px 0px 20px rgba(0,0,0,0.1);}


#hero.contact {  background:#eee; width:100%; height:100%;text-shadow:none; }
#hero.offer { background:url("../img/hero-berlin-0.jpg") no-repeat top center; width:100%; height:100%; background-size:cover; }



#hero.homepage {position: relative;  background:url("../img/hero-berlin-0.jpg") no-repeat top center; width:100%; max-width:none; height:100%; background-size:cover; border-radius:5px;-o-border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;}
#layer { display:none; top:0px; background:url("../img/hero-berlin-1.png") no-repeat top center; width:100%; height:100%; background-size:cover; position:absolute;}

@media all and (max-height: 500px){
#hero .specs {margin-top:-100px !important;}
}

@media all and (max-width: 750px){
#hero .specs {margin-left:0px !important;left:0px !important;}
}


#hero {text-shadow:0px 1px 1px rgba(0,0,0,0.9)}
#hero a {text-shadow:none}

#hero .specs {text-align: center; max-width: 750px; min-width:750px; position: absolute; left: 50%; width: 100%; margin-left: -375px; top: 50%; margin-top:-160px;}
#hero .specs .items span {color:#FFF; }
#hero .specs .items span.text {font-size:20px; line-height:18px;}
#hero .specs .items span.highlight {font-size:40px; display:block;font-family: 'Montserrat',Helvetica, Arial, sans-serif;font-weight:700; line-height:32px; margin-bottom:7px;}

#hero .specs .items .bar {width:30%; height:5px; background:#FFF; margin:60px auto 20px auto }

#hero .cta-box {background:none; padding:0; display:none;top: 90px;
position: absolute;}
#hero .cta-box h1 {color:#FFF; padding-bottom:50px; font-size:34px;line-height:40px; }





#content {position:relative;
min-width: 700px;
margin: auto;
padding: 0px 35px;
}

#content .bar {width:20%; height:5px; background:#FFF; margin:30px auto; }



#content.how .bg { background:#6cbdc4;padding: 70px 0px 1px 0px; margin-top:2.5%;
 border-top-left-radius:5px; border-top-right-radius:5px;
 -moz-border-top-left-radius:5px; -moz-border-top-right-radius:5px;
 -o-border-top-right-radius:5px; -o-border-top-left-radius:5px;
 -webkit-border-top-left-radius:5px; -webkit-border-top-right-radius:5px;
 }
#content.how .copy {text-align:center; margin:auto; width:50%; min-width:650px; position:relative; z-index:200;}

#content.how .span13.arrow-left {background:url("../img/how-arrow-left.png") no-repeat; height:150px; margin-left:-20px;}
#content.how .span13.arrow-top {background: url("../img/how-arrow-up.png") no-repeat 82px 2px;padding-top: 60px;}

#content.how .info .span14.arrow {background:#FFF;}

#content.how .copy h1{color:#fff;}
#content.how .copy h2{font-family: 'Kameron', sans-serif;  color:#fff;  font-size:28px;}
#content.how .copy p{ color:#FFF; margin: 0px auto 20px; font-size:16px; line-height:21px;}
#content.how .copy h3{font-family: 'Kameron', sans-serif; color:#fff; margin: 20px 100px 20px 80px; font-size:21px;}


#content.how .row {min-width: 600px !important;}

#content.how .info {padding:10px 50px 50px 50px; background:#6cbdc4; }
#content.how .cta-box {background:#6cbdc4; margin-top: -100px;
padding-bottom: 100px;}



#content.how .info .item {float:left; width:22%; margin:0px 1.5%;color:#FFF; text-align:center; }
#content.how .info .item h5 {margin: auto;font-size: 30px;line-height: 50px;border-bottom: 4px solid#FFF;width: 20%;margin-top: 30px;}
#content.how .info .item span {font-weight: 700; padding-top:10px;font-size:17px;font-family: 'Montserrat',Helvetica, Arial, sans-serif; }
#content.how .info .item p {font-size:16px;}
#content.how .info .item .image {margin-top:10px;}
#content.how .info .item .image img {width:100%;}



#content.services .main-bg {width:100%; max-width:1600px; min-width:750px; margin:auto;text-align:center; height:200px;}
#content.services .main-bg .copy { max-width:700px; margin:auto; width:100%; float:none; height:200px;}
#content.services .main-bg .copy h1{color:#b3b3b3; line-height:200px;}

#content.services {color:#FFF;}
#content.services p {font-size:18px; line-height:25px;}
#content.services h1 {color:#FFF; }
#content.services h2 {font-family: 'Kameron', sans-serif; color:#FFF; font-size:28px;}

#content.services .bg {float:left; height:400px;}
#content.services .copy {float:left; height:400px;}

#content.services .copy.a {background:#ea9c4e; width:50%;
border-top-left-radius:5px; 
 -moz-top-top-left-radius:5px;
 -o-border-top-left-radius:5px; 
 -webkit-border-top-left-radius:5px;
  }
#content.services .copy.a .text {padding:100px; float:right;}
#content.services .bg.a {width:50%; background:url("../img/services-image-a.jpg") no-repeat center center;  background-size:cover;
border-top-right-radius:5px; 
 -moz-border-top-right-radius:5px;
 -o-border-top-right-radius:5px; 
 -webkit-border-top-right-radius:5px;
 }


#content.services .copy .text {
	 max-width: 660px;
}


#content.services .copy.b {background:#8ac663; width:50%; }
#content.services .copy.b .text {padding:80px 100px; float:left;}
#content.services .bg.b {width:50%; background:url("../img/services-image-b.jpg") no-repeat center center;  background-size:cover;}

#content.services .copy.c {background:#6cbdc4; width:50%; }
#content.services .copy.c .text {padding:40px 100px; float:right;}
#content.services .bg.c {width:50%; background:url("../img/services-image-c.jpg") no-repeat center center;  background-size:cover;}

#content.services .copy.d {background:#3e3e3e; width:50%;}
#content.services .copy.d .text {padding:80px 100px;  float:left;}
#content.services .bg.d {width:50%; background:url("../img/services-image-d.jpg") no-repeat center center;  background-size:cover;}

#content.services .copy.e {background:#cebd3f; width:50%; }
#content.services .copy.e .text {padding:80px 100px; float:right;}
#content.services .bg.e {width:50%; background:url("../img/services-image-e.jpg") no-repeat center center;  background-size:cover;}


#content.products .main-bg {width:100%; max-width:1600px; min-width:750px; margin:auto;text-align:center; height:200px;}
#content.products .main-bg .copy { max-width:700px; margin:auto; width:100%; float:none; height:200px;}
#content.products .main-bg .copy h1{color:#b3b3b3; line-height:200px;}

#content.products {color:#FFF;}
#content.products p {font-size:18px; line-height:25px;}
#content.products h1 {color:#FFF; }
#content.products h2 {font-family: 'Kameron', sans-serif; color:#FFF; font-size:28px;}

#content.products .bg {float:left; height:400px;}
#content.products .copy {float:left; height:400px;}


#content.products .copy.a {background:#ea9c4e; width:50%;
border-top-left-radius:5px; 
 -moz-top-top-left-radius:5px;
 -o-border-top-left-radius:5px; 
 -webkit-border-top-left-radius:5px;
  }
#content.products .copy.a .text {padding:100px; float:right;}
#content.products .bg.a {width:50%; background:url("../img/mapidea_enterprise.png") no-repeat left top;  background-size:cover;
border-top-right-radius:5px; 
 -moz-border-top-right-radius:5px;
 -o-border-top-right-radius:5px; 
 -webkit-border-top-right-radius:5px;
 }


#content.products .copy.b {background:#8ac663; width:50%; }
#content.products .copy.b .text {padding:80px 100px; float:left;}
#content.products .bg.b {width:50%; background:url("../img/mapinfo_3.png") no-repeat left top;  background-size:cover;}

#content.products .copy.c {background:#3e3e3e; width:50%;}
#content.products .copy.c .text {padding:80px 100px;  float:right;}
#content.products .bg.c {width:50%; background:url("../img/mapidea_dashboard.png") no-repeat left top;  background-size:cover;}

#content.products .copy.d {background:#6cbdc4; width:50%; }
#content.products .copy.d .text {padding:40px 100px; float:left;}
#content.products .bg.d {width:50%; background:url("../img/SpectrumSpatial_for_BI.jpg") no-repeat left top;  background-size:cover;}



#about{
margin-left: 80px;
padding-top: 120px;
margin-bottom: 250px;
padding-bottom: 120px;
color: #FFF;
width: 50%;
}

#about h1 {text-shadow:none; color:#555; margin-bottom:50px;}
#about p,#about a {text-shadow:none; color:#555; font-size:18px;}


#contact {position:absolute; top: 50%; margin-top:-120px; margin-left: 110px;color:#FFF;z-index:100;}
#contact i {text-align: center; width:20px;}
#contact h1,#offer h1 {background:rgba(0,0,0,0.6); padding:15px; float:left; margin-bottom:10px; color:#FFF;}
#contact p,#offer p {background:rgba(0,0,0,0.6); padding:15px; float:left; margin:0px; color:#FFF; font-size:18px;}
#contact a {color:#fff; text-decoration:underline;}
#map {width:100%; height:100%; position:absolute;  }

#offer {position:absolute; top: 50%; margin-top:-200px; margin-left: 110px;}
#offer a {color:#fff; text-decoration:none; margin:20px 0px;}

#offer form {width:550px;background:rgba(0,0,0,0.6); }
#offer input {margin:0px 0px 15px 15px; border-radius:5px; -o-border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; background:#FFF; border:1px solid #ddd; padding:10px; width:240px; display:inline-block;  font-family:helvetica,arial,sans-serif; color:#888;}


@media all and (max-width: 950px){
  #offer {margin-left:2.5%;}
  #contact {margin-left:2.5%;}
  #animation .item .text {margin-left:80px !important; width:600px !important;}
  #about, #product {margin-left:40px !important; width:600px !important;}
  #footer.about, #footer.product {padding:20px 40px !important;}

#content {
padding: 0px 25px !important;}



#content.services .bg.a,#content.services .bg.b,#content.services .bg.c,#content.services .bg.d,#content.services .bg.e {background-position:center !important;}

}



#footer {
background: #3e3e3e;
padding: 20px;
height: 30px;
margin-top: 20px;
max-width: 100%;
margin: auto;
margin-top: 40px;
}

.inner-footer {max-width:1595px; margin:auto;}

#footer.single {
bottom: 0px;
z-index: 5000;
position: fixed;
width: 100%;
}



#footer ul.footer-nav li img {width:100px; height:auto; margin:0px 20px 0px -10px;}
#footer ul.footer-nav li {color:#FFF;}
#footer ul.footer-nav li a {color:#b4b4b4; margin-left:25px;}
#footer ul.footer-nav li.pull-right a {color:#f4e418; margin-right:40px;}









#slideshow {margin:auto; width:100%;height:100%;}

#animation .item {clear:both; width:100%; height:100%;}
#animation .item.a {background:red;}
#animation .item.b {background:blue;}
#animation .item.c {background:green;}

#animation .item a {color:#FFF; text-decoration:underline;}

#animation .item .text {width:700px; margin-left:120px; position:absolute; top:50%; margin-top: -170px; color:#FFF; text-align:left;}
#animation .item .text h1{background:rgba(0,0,0,0.6); padding:5px 15px; float:left;}
#animation .item .text h5 {background:rgba(0,0,0,0.6); padding:5px 15px; float:left; margin-bottom:5px; }
#animation .item .text p {background:rgba(0,0,0,0.6); padding:10px 15px; float:left; margin:0px; line-height:26px; font-size:16px;}
#animation .item .text .contact {background:rgba(0,0,0,0.6); clear:both;float: left;margin-top: 7px; padding:5px 0px;}
#animation .item .text .contact span {font-size:13px; line-height:18px; font-style: italic;}
#animation .item .text .contact p {background:none; padding:0px 15px; float:none; margin:0px 0px;}
#animation .item .text h5 {font-size:40px; line-height:70px;}
#animation .item .text h4 {padding-right:50px; font-size:30px; line-height:30px;}
#animation .item img {margin-top:10px;}
#animation #nav-arrows {width: 100%;text-align: center;position: absolute;min-width: 750px;top: 50%;margin-top: -30px;}

#animation #nav-arrows #next {position:absolute; height:60px; width:60px;right:20px; background:url("../img/arrow-right-action.png") no-repeat center center; z-index:2000;}
#animation #nav-arrows #prev {margin-left:20px; position:absolute;  height:60px; width:60px;left:0px; background:url("../img/arrow-left-action.png") no-repeat center center; z-index:2000;}

#animation #nav {text-align: center;top: 100%;position: absolute;width: 100px;left: 50%;margin-left: -50px;margin-top: -100px;z-index: 3000;}
#animation #nav a{font-size:0px; width:10px; height:10px; margin-right:10px; display:inline-block; background:url("../img/bullet.png") no-repeat center center; opacity:0.5; }
#animation #nav a.activeSlide { opacity:1;  }

a 
{
	color: White;
}

#img_col
{
	width: 50%;
	border: 0px solid green;
}

#itm_col
{
	padding-left: 20px;
	border: 0px solid green;
}

.product_image
{
	min-width: 400px;
}

.product_characteristics
{
}

.product_characteristics li
{
	list-style-type:disc;	
	color: white;
	margin: 0 0 10px 0;
	margin-left: 30px;
}

#product  {
	margin-left: 80px;
	padding-top: 120px;
	padding-bottom: 120px;
	color: #FFF;
	width: 50%;
	text-align: center;
	color: #555;
	width: calc(100% - 160px) !important;
}

#prod_mla
{
	background-color: #ea9c4e;
	height: 100%;
	margin-left: 35px;
	margin-right: 35px;
	width: calc(100% - 70px)
}

#prod_mla, #prod_mla h1, #prod_mla p
{
	color: white;
}


#imgdiv {
	position: relative;
	width: calc(50% - 2px);
	min-width: 400px;
	text-align: center;
	float: left;
	border: 1px solid green;
	display: inline-table;
}

#txtdiv {	
	position: relative;
	width: calc(50% - 2px);
	min-width: 400px;
	text-align: left;
	float: left;
	border: 1px solid red;
	display: inline-table;
}



