﻿@media screen and (max-width: 320px) {
    @-ms-viewport { width: 320px; }
    @-webkit-viewport { width: 320px; }
    @-moz-viewport { width: 320px; }
    @-o-viewport { width: 320px; }
    @viewport { width: 320px; }
}


* {
    margin: 0;
    padding: 0;
}


html, body {
    margin : 0px;
    background-color : #ffffff;
    background-position: center;
    background-repeat: repeat-y;
    height: 100%;
}

.greybar {
        width:15%;
        height: 100%;
        background-color: #d0d0d0;
        align:right;
        float:left;
}

#mainpage {
    background-color: #ffffff;
    height:auto;
    width:70%;
    margin-left: auto ;
    margin-right: auto ;
    float:left;
}

.logo {
    padding-top: 18px;
    padding-left: 30px;
    z-index:999;
    border: 0px;
}

.time {
    background-color: #8b8b8c;
    text-align: center;
    height: 30px;
    float:right;
    padding-top:6px;
    padding-left:10px;
    padding-right:10px;
    padding-bottom:4px;
    margin-right: 30px;
    margin-top: 19px;
}
.timeTest {
    background-color: #8b8b8c;
    text-align: center;
    height: 430px;
    float:right;
    padding-top:6px;
    padding-left:10px;
    padding-right:10px;
    padding-bottom:4px;
    margin-right: 30px;
    margin-top: 19px;
}

#timetext{
    font-family: Helvetica, Arial, san-serif;

    font-size: 1.1em;

    line-height: 0.8em;
    color: #ffffff;
}
.timeletters{
    font-family: Helvetica, Arial, san-serif;

    font-size: 1.1em;

    line-height: 0.8em;
    color: #ffffff;
}

#localoffset{
    font-family: Helvetica, Arial, san-serif;

    font-size: 1.1em;

    line-height: 0.8em;
    padding-top:4px;
    color: #ffffff;
}

#hours{
    font-family: Helvetica, Arial, san-serif;

    font-size: 1.1em;

    line-height: 0.8em;
    padding-top:4px;
    color: #ffffff;
}

#minutes{
    font-family: Helvetica, Arial, san-serif;

    font-size: 1.1em;

    line-height: 0.8em;
    padding-top:4px;
    color: #ffffff;
}
.timesmall{
    font-family: Helvetica, Arial, san-serif;

    font-size: 0.7em;

    padding-top:2px;
    color: #ffffff;
}


.nav {
    padding-top: 14px;
    padding-left: 30px;
    z-index:999;
}

.navitem {
	font-family: Helvetica, Arial, san-serif;

	color: #000000;
	font-size: 0.85em;

    	padding-right: 15px;
	text-decoration: none;
}

.navitem:visited {
	color: #000000;
}

.navitem:hover {
	color: #990033;
}

.colorbar {
    margin-top: 8px;
    padding-top:38px;
    background-color: #69b2e5;
    width:100%;
    height:348px;
}


#home_engine{
    background-image: url('../images/ia_engine_home.gif');
    background-position: right;
    background-repeat: no-repeat;
    background-color: #69b2e5;
}

#home_map{
    background-image: url('../images/ia_engine_home.gif');
    background-color: #85c441;
    background-position: center;
    background-repeat: no-repeat;
    visibility: hidden;
}

#company{
    background-image: url('../images/home_engine.gif');
    background-position: right;
    background-repeat: no-repeat;
    background-color: #69b2e5;
}

#products{
    background-image: url('../images/product_illustration.gif');
    background-position: right;
    background-repeat: no-repeat;
    background-color: #ababac;
}

#services{
    background-image: url('../images/services_illustration.gif');
    background-position: right;
    background-repeat: no-repeat;
    background-color: #ababac;
}

#contacts{
    background-image: url('../images/contacts_map.gif');
    background-position: center;
    background-repeat: no-repeat;
    background-color: #69b2e5;
}

.floating{
    position:absolute;
    z-index:15;
    width:580px;
    height:100%;
}
.floating2 {
    position:absolute;
    z-index:15;
    width:100%;
    height:100%;
}

#floating_home {
    background-color: #224d6d;
    filter:alpha(opacity=50); opacity:0.5;
    height:44%;
    width:400px;
}

#floating_home2 {
    background-color: #336633;
    filter:alpha(opacity=50); opacity:0.5;
    height:36%;
}

#floating_company {
    background-color: #224d6d;
    filter:alpha(opacity=50); opacity:0.5;
}

#floating_contacts {
    background-color: #224d6d;
    filter:alpha(opacity=50); opacity:0.5;
    height:90%;
    width:100%;
}

#floating_products {
    background-color: #575757;
    filter:alpha(opacity=50); opacity:0.5;
    height:90%;
    width:100%;
}

#floating_services {
    background-color: #575757;
    filter:alpha(opacity=50); opacity:0.5;
    height:60%;
}


#floatingCopy{
    position:absolute;
    z-index:15;
    width:580px;
    height:298px;
}

#floatingCopy_contacts{
    position:absolute;
    z-index:15;
    width:642px;
    height:298px;
}

#floatingCopy_products{
    position:absolute;
    z-index:15;
    width:642px;
    height:348px
}

#floatingText {
    position:absolute;
    z-index:40;
    width:580px;
}



#floatingTextWide {
    position:absolute;
    z-index:45;
    width:100%;
}

#floatingText2 {
    position:absolute;
    padding-left:200px;
    z-index:45;
    width:430px;
}

#floatingText3 {
    position:absolute;
    margin-left:425px;
    z-index:45;
}

#floatingText4 {
    position:absolute;
    padding-left:320px;
    z-index:45;
}
.product_header {
	font-size: 0.4em;

        line-height: 0.2em;
}

.copyTitle {
    margin-top: 16px;
    margin-bottom: 4px;
    margin-left: 30px;
    margin-right: 30px;
    font-family: Helvetica, Arial, san-serif;

	color: #ffffff;
	font-size: 1.05em;

	text-decoration: none;
}

.copy {
    margin-bottom: 20px;
    margin-left: 30px;
    margin-right: 30px;
	font-family: Helvetica, Arial, san-serif;
    color: #ffffff;
	font-size: 0.8em;
    line-height: 1.4em;
	text-decoration: none;
}

.email {
	font-family: Helvetica, Arial, san-serif;
    color: #ffffff;
    text-decoration: underline;
}

.email:visited {
	color: #ffffff;
}

.email:hover {
	color: #acddfa;
}

.copy2 {
    margin-left: 30px;
    margin-right: 30px;
	font-family: Helvetica, Arial, san-serif;
	color: #ffffff;
	font-size: 0.8em;
    line-height: 1.4em;
	text-decoration: none;
}

#copy3 {
    margin-top: 7px;
    line-height: 1.4em;
    margin-bottom: 1px;
}
#copy3b {
    margin-top: 7px;
    line-height: 1.4em;
    margin-bottom: 1px;
}
#copy3c {
    margin-top: 7px;
    line-height: 1.4em;
    margin-bottom: 1px;
}
#copy3d {
    margin-top: 7px;
    line-height: 1.4em;
    margin-bottom: 1px;
}

#copy5 {
    margin-top: 2px;
    line-height: 1.4em;
    margin-bottom: 1px;
}
#copy5b {
    margin-top: 2px;
    line-height: 1.4em;
    margin-bottom: 0px;
}
#copy5c {
    margin-top: 2px;
    line-height: 1.4em;
    margin-bottom: 1px;
}
#copy5d {
    margin-top: 2px;
    line-height: 1.4em;
    margin-bottom: 0px;
}

#copy6 {
    margin-top: 2px;
    line-height: 1.4em;
    margin-bottom: 0px;
}

.copy4 {
    margin-top: 7px;
    margin-bottom: 20px;
    margin-left: 30px;
    margin-right: 30px;
	font-family: Helvetica, Arial, san-serif;

	color: #ffffff;
	font-size: 0.8em;

        line-height: 1.4em;
	text-decoration: none;
}

.footer {
	font-family: Helvetica, Arial, san-serif;

	color: #9c9e9d;
	font-size: 0.7em;
    line-height: 1.6em;
    margin-top: 20px;
    padding-bottom: 100px;
    margin-left: 30px;
    width: 321px;
}

.footer2 {
	font-family: Helvetica, Arial, san-serif;
    color: #9c9e9d;
	font-size: 0.7em;
    line-height: 1.6em;
    margin-top: 20px;
    padding-bottom: 0px;
    margin-left: 30px;


}


#copyright {
    text-align: right;
    float:right;
    margin-bottom: 20px;
    margin-right: 30px;
}

/* Additions by Optanalysis February 2019 */

#quality .copy a {
  color: #fff;
}

#quality ul.copy {
  margin-left: 60px;
}

#quality .no-bottom {
  margin-bottom: 0;
}

#quality #floatingCopy, #quality #floating_company {
  width: 760px;
}

@media all and (max-width: 1000px) and (min-width: 714px) {
    .greybar {
        width:5%;
        height: 100%;
        background-color: #d0d0d0;
        float:left;
}


    #mainpage {
    background-color: #ffffff;
    height:auto;
    width:90%;
    margin-left: auto ;
    margin-right: auto ;
    float:left;
}

}


@media all and (max-width: 714px) {

.greybar {
     visibility: hidden;
        width:0px;
        height: 0px;
        background-color: #d0d0d0;
}


#mainpage {
    background-color: #ffffff;
    height:auto;
    width: 720px;
    margin-left: auto ;
    margin-right: auto ;
}

}
