﻿.bodyStyle {font-family:Arial, Helvetica, sans-serif; font-size:16px; color:#555; /*background-image:url('images/greenBKG5.jpg');*/ background-color:#ECFCFC; margin:auto;}
.container {width:95%; margin:auto; /*background-image:url(images/NilesMackrellBKG1200.jpg);*/ background-size:100%; margin-top:2em;}
#topFrame{/*vertical-align:top; width:100%;*/ display:none;}
#bottomFrame{/*vertical-align:bottom; width:100%;*/ display:none;}

#topImage {width:100%;box-shadow: -10px 12px 5px #d6d6d6; border-bottom:1px #b5b5b5 solid;}
#header { width:95%; margin:.5em auto 0; display:block;}
#headerSmall {display:none;}
#main {width:100%; overflow:hidden; padding-top:40px;}
#leftNav {width:12%; margin:1em 0 0 1em; float:left; /*border:2px #c2c2c2 solid;*/}
#cssmenu {display:none;}
#banner1 {display:block;}
#banner2 {display:none;}

#leftNav2 {width:12%; height:500px; float:left; display:block;}
.navBkgd {background-color:aquamarine; display:block; margin:0px; opacity:0; position:absolute; width:100%; z-index:1; float:left; overflow:hidden;}
.navBkgd:hover {opacity:.6;}
#leftNav2 .button {display:block; opacity:1; position:absolute; top:0; left:0; z-index:5; width:100%; height:100%;}

.animate {	width: 100px;
    height: 100px;
    font-size: 20px;
    left: 0px;
    top: 0px;
    position:absolute;
    -webkit-transition-property: width height background-color font-size left top transform -webkit-transform color;
    -webkit-transition-duration: 0.5s;
    -webkit-transition-timing-function: ease-in-out;
    transition-property: width height background-color font-size left top transform -webkit-transform color;
    transition-duration: 0.5s;
    transition-timing-function: ease-in-out;

}
.nail {top:6%; left:73.5%; width:40px; padding:0px; background-color:transparent;  
	width: 100px;
    height: 100px;
    position:absolute;
    -webkit-transition-property: width height background-color font-size left top transform -webkit-transform color;
    -webkit-transition-duration: 0.5s;
    -webkit-transition-timing-function: ease-in-out;
    transition-property: width height background-color font-size left top transform -webkit-transform color;
    transition-duration: 0.5s;
    transition-timing-function: ease-in-out;
}
}

/*  ========== new navigation  ======= */

#topnav {list-style:none; padding:1em 0 0 2%;}
#topnav li {display:block; padding:18px; width: 80px; height:22px; box-shadow:0px 0px 0px 0px #fff; transition:box-shadow 1s, linear; /*margin:2em 0; */}

#topnav li a {
	float:left;
	color: #777;
	font-family: 'Quicksand', sans-serif;
	font-size: 1.0em;
	font-weight:300;
	line-height:1em;
	text-decoration:none;
}

#topnav li a::first-letter {font-size:130%;}

#topnav li:hover { box-shadow:1px 4px 6px 2px #dadada;}
#topnav li a:hover {color:#333;}

#topnav li a.current {color:#333; font-size:1.2em;}

/*  ============ end navigation  ========*/

/* =============== main content ===========*/

.mainContentLeft {width: 45%; float:left; margin: 40px 0 0 4em;}
.mainContentRight {margin:20px 0 0 0px; width:40%; float:left;}
/*.mainContentLeft img {margin-top:2em;}*/

#img1 {
   -webkit-animation: fadein 6s; /* Safari, Chrome and Opera > 12.1 */
       -moz-animation: fadein 6s; /* Firefox < 16 */
        -ms-animation: fadein 6s; /* Internet Explorer */
         -o-animation: fadein 6s; /* Opera < 12.1 */
            animation: fadein 6s;	
}
@keyframes fadein {
    0% { opacity:0; }
    20% { opacity:0; }
    100% { opacity:1; }}

/* Firefox < 16 */
@-moz-keyframes fadein {
    0% { opacity:0; }
    20% { opacity:0; }
    100% { opacity:1; }}


/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadein {
    0% { opacity:0; }
    20% { opacity:0; }
    100% { opacity:1; }}


/* Internet Explorer */
@-ms-keyframes fadein {
    0% { opacity:0; }
    20% { opacity:0; }
    100% { opacity:1; }}


/* Opera < 12.1 */
@-o-keyframes fadein {
    0% { opacity:0; }
    20% { opacity:0; }
    100% { opacity:1; }}



#img2 {
   -webkit-animation: fadein 6s; /* Safari, Chrome and Opera > 12.1 */
       -moz-animation: fadein 6s; /* Firefox < 16 */
        -ms-animation: fadein 6s; /* Internet Explorer */
         -o-animation: fadein 6s; /* Opera < 12.1 */
            animation: fadein 6s;	
}
@keyframes fadein {
    0% { opacity:0; }
    70% { opacity:0; }
    100% { opacity:1; }}

/* Firefox < 16 */
@-moz-keyframes fadein {
    0% { opacity:0; }
    70% { opacity:0; }
    100% { opacity:1; }}


/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadein {
    0% { opacity:0; }
    70% { opacity:0; }
    100% { opacity:1; }}


/* Internet Explorer */
@-ms-keyframes fadein {
    0% { opacity:0; }
    70% { opacity:0; }
    100% { opacity:1; }}


/* Opera < 12.1 */
@-o-keyframes fadein {
    0% { opacity:0; }
    70% { opacity:0; }
    100% { opacity:1; }}


#img3 {
margin:auto;
width:100%;
   -webkit-animation: fadein 4s; /* Safari, Chrome and Opera > 12.1 */
       -moz-animation: fadein 4s; /* Firefox < 16 */
        -ms-animation: fadein 4s; /* Internet Explorer */
         -o-animation: fadein 4s; /* Opera < 12.1 */
            animation: fadein 4s;	
}
@keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}
/* Firefox < 16 */
@-moz-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Internet Explorer */
@-ms-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Opera < 12.1 */
@-o-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}
	
/* =============== end main content ===========*/


.content {width:84%; padding:3em 0 1em; float:left;}
.indexContent {width: 80%; padding:2em 0; float:left; margin-left:5%}

.contentLeft {width:50%; padding:0 3em 0 3em; float:left;}
.contentRight {width:38%; padding:3em 0 1em; float:left; border-left:3px #e2e2e2 solid;}
.leftDiv {width:30%; float:left; padding-left:10%;}
.rightDiv {width:25%; float:left; line-height:2em; padding-bottom:1em;}
.border0 {border-style:none; border-width:0;}
#footer {clear:both; width:100%; height:40px; padding-top:1em; text-align:center; font-size:xx-small; font-style:italic; color:#777;}
#expertiseTable {clear:both; width:60%; /*border:2px solid #c2c2c2; */margin:2.5em auto 1.5em; text-align:center;}
#expertiseTop {/*background-image: url('buttons/listHeaderBkg.jpg'); background-size:100%; */padding:.7em 0; line-height:1.8em; border-bottom: 2px #c2c2c2 solid;}
.table {width:630px; text-align:left; background-color:#ecfcfb; float:right; margin-top:0px;}
.td200 {width:200px; text-align:left; vertical-align:top;}
.td220 {height:30px; width:220px; text-align:left; vertical-align:top;}
.samplesDivider {height:10px; width:80%; padding:1em 0 2em 10%; clear:both;}
p {line-height:1.6em;}
ul {line-height:1.4em;}
h1 { }
h2 {text-align:left; font-size:1.3em; color:#303080; font-weight:bold; font-style:italic; line-height:3em;}
h3 {font-size:1.6em; margin:.2em 0 1.5em; font-family: Quicksand, sans-serif; font-weight:300;}
h4 {font-size:1.3em; font-weight:200; font-style:italic;}
.caption {font-size: 80%; font-style: italic; text-align: center; margin-bottom: 1em; color: #777;}

.clear {clear:both;}
.arialSmLeft {font-size:small; text-align:left; line-height:1.2em;}
.arialxxSm {font-size:xx-small; font-style:italic; text-align:center; margin-bottom:1em; color:#777;}
li {margin-bottom:1em; list-style:square;}
.li411 {margin-bottom:1em; list-style:none;}
.listCenter {font-style:italic; text-align:center; /*background-color:#FEFEFe;*/ line-height:3em;}

a:link {text-decoration:none; color:#000080;}
a:visited {text-decoration:none; color:#666680;}
a:hover {text-decoration:underline; color:#000080;}
.subtitleFont {font-size:medium; font-weight:bold; color:#999999;}
.boldLink {font-size:small; font-family:Arial, Helvetica, sans-serif; font-weight:bold;}
.alignCenter {text-align:center;}
.alignLeft {text-align:left;}
.alignRight {text-align:right;}
.picleft {float:left; margin:0px 40px 10px 0px; text-align:center;}
.picright {float:left; text-align:center; padding-bottom:2em; width:100%; margin:auto;}
.picRightImage {box-shadow: 8px 6px 8px #b1b1b1; margin-bottom:.5em; /*border-top:5px #c0c0c0 solid; border-left:5px #888 solid; border-bottom:5px #888 solid; border-right:5px #c0c0c0 solid;*/}

/* ****** Denmark Page ******** */

.bodyDenmark {font-family:Arial, Helvetica, sans-serif; background-color:#6d271f; vertical-align:top;}
.containerDenmark {max-width:1200px; margin:auto; margin-top:10px;}
#bannerDenmark {float:left; width:20%; text-align:center;}
#titleDenmark {width:80%; background-color: #181818; float:left; text-align:center; padding:.5em 0;}
#mainDenmark {clear:both; width:100%; background-color:#f0f0f0;}
#leftNavDenmark {width:20%; float:left; background-color:#B0B0B0; height:inherit;}
.contentDenmark {width:74%; padding:2em; float:left; line-height:1.6em;}
.liDenmark {list-style:none; font-size:small; text-align:left; padding-left:1em;}
.fontXsmall {font-size:x-small;}
.TitleWhite {font-size:x-large; font-weight:bold; color:#FFFFFF; text-align:center;}
.Fontlarge {font-size:large; color:#FFFFFF; font-family:Arial, Helvetica, sans-serif;}
.boldLeftMedium {font-weight:bold; text-align:left; font-size:medium; font-family:Arial, Helvetica, sans-serif;}
.leftNavDivDenmark {width:80%; background-color:#dadada; margin:1.5em auto; padding:.7em; border:2px #999 solid;}
#footerDenmark {clear:both; width:100%; height:40px; padding-top:1em; text-align:center; font-size:xx-small; font-style:italic; color:#777;}

/* ******************************End Denmark ************************* */

#cssmenu {width:100%; line-height: 10px; text-transform: uppercase; text-align: left; clear: both;}
#cssmenu > ul {list-style-type: none; padding: 0 0 1em 3em; margin: 0; line-height:1.5em; border: 1px solid #c0c0c0; box-shadow: -3px 4px 6px #b6b6b6; -webkit-border-radius: 6px; -moz-border-radius: 6px; -o-border-radius: 6px; border-radius: 6px;}
#cssmenu > ul li#responsive-tab {display: none;  /* Hide for large screens */}
#cssmenu > ul li { display: inline-block; zoom: 1;}
#cssmenu > ul li.right {float: right;}
#cssmenu > ul li.has-sub {position: relative;}
#cssmenu > ul li.has-sub:hover ul {display: block;}
#cssmenu > ul li.has-sub ul {display: none;/* width: 140px; */ position: absolute; margin: 0; padding: 0 .4em; list-style-type: none; background: #ffffff; border: 1px solid #ece6e8; border-bottom: 3px solid #d9ced2; border-top: 0 none; z-index:9000;}
#cssmenu > ul li.has-sub ul li {display: block; font-size:95%;}
#cssmenu > ul li.has-sub > a {background-image: url('images/caret.png'); background-repeat: no-repeat; background-position: 90% -95%;}
#cssmenu > ul li.has-sub > a.active,
#cssmenu > ul li.has-sub > a:hover {background: /*#a13d3d*/90d8dd url('images/caret.png') no-repeat; background-position: 90% 90%;}
#cssmenu > ul li a {display: block; padding: 10px 18px; text-decoration: none; color:/* #960202; text-shadow: 0px 1px 0px #fff;*/ #3d868b; border-radius:.6em; -moz-border-radius:.6em; -webkit-border-radius:.6em;}
#cssmenu > ul li a.active, #cssmenu > ul li a:hover {/*background: #90d8dd; color: #fff; text-shadow: 0px 2px 2px #444;*/}

/* ------------------------------------------------  media   -------------------------------------*/

@media only screen and (min-width: 968px) and (max-width: 1060px) {

.content {width:88%; padding:1em 0;}
.indexContent {width:80%; margin-left:5%;}
.mainContentLeft {width:40%;}
#leftNav {width:10%}
.contentLeft {width:54%; padding:0 1.5em 0 2em;}
.contentRight {width:36%;}
#expertiseTop {padding:.3em 0;}
.contentDenmark {width:70%;}
h4 {font-size:1em}
p {font-size:14px;}
.arialxxSm {font-size:x-small;}
.picleft {margin:0px 20px 10px 0px;}
.listCenter {font-size: 16px; line-height: 2.2em; padding-top:1em;}
.caption {font-size: 75%;}
}


@media only screen and (max-width: 967px) {

#topImage {box-shadow:-8px 10px 10px #ccc;}
#leftNav {display:none;}
#cssmenu {display:block;}
#leftNavDenmark {display:none;}
#header {display:none;}
#headerSmall {display:block; width:95%; margin:0 auto;}

.mainContentLeft {width: 100%; float:left; margin: 20px 0 0 20px;}
.mainContentRight {margin:20px 0 0 0; width:100%; float:left; text-align:center;}
.content {width:100%; padding:0 0 0 1em;}
.indexContent {width:98%; margin-left:1%; padding:0 0;}
.contentLeft {width:52%; padding: 0 .5em 0 1em;}
.contentRight {width:41%;}
.contentDenmark	{width:96%; padding:0 0 0 1em; font-size:.8em;}
h2 {font-size:1em !important; line-height:1.5em;}
h4 {font-size:1em;}
.TitleWhite {font-size:1em; font-weight:bold; color:#FFF;}
.Fontlarge {font-size:.8em;}
.caption {font-size: 75%;}

#cssmenu {width:40%; margin:auto; font-size:1em; padding-top:.25em;}
#cssmenu ul {padding:0 .7em; margin:1em 0; line-height:.7em !important;}
#cssmenu ul li#responsive-tab {display: block; margin-top:0; margin-bottom:0; padding:.5em;}
#cssmenu ul li#responsive-tab a {/*background: url('images/menu.png') no-repeat; background-position: 90% 6px;*/}
#cssmenu ul li#responsive-tab a:hover {color:#555;}
#cssmenu ul li {display:none; list-style:none; margin-top:1em; padding-left:1em;}  
#cssmenu ul li ul {padding-left: .4em;}
#cssmenu ul li a {padding:0.4em;}
}  
  

@media only screen and (max-width: 450px) {
#banner1 {display:none;}
#banner2 {display:block; width:100%;}
#cssmenu {width:50%;}

p {line-height: 1.4em; font-size: 14px;}
.content {padding:.75em 0;}
.contentLeft {width:90%; padding :0 .5em}
.contentRight {width:60%; border-left-width: 0;}
.TitleWhite {font-size:.8em;}
.fontXsmall {font-size:xx-small;}

/* img {width:90% !important;} */
.leftDiv {width:80%; padding-left:2em; padding-top:1em;}
.leftDiv img {margin: 16px 0 0 0 !important; padding-left:0 !important;}
.rightDiv {clear:left; width:80%; margin:0 0 0 2em; padding-bottom:0;}
.samplesDivider {height:10px; padding:.5em 0 .5em 2em;}
#bannerDenmark {width:30%}
#titleDenmark {width:70%}
.contentDenmark {width:94%; padding:0 .8em 0 .8em;}

.listCenter { font-size:.9em;}
p #img3 {width:80%}

}

@media (min-width: 480px) {

  #cssmenu > ul > li.collapsed {
    display: block !important;
    *display: inline;
    zoom: 1;
    padding-left:1em;
  }
  #cssmenu > ul ul li.collapsed {
    display: block !important;
  }
}


