﻿/*general css*/
body{font-family:Verdana,Arial,Helvetica,sans-serif;font-size:12px;color:#606060;text-align:center}
img{border:none;border:none}

/*This makes sure that the padding and border are included in the total width and height of the elements.*/
*{box-sizing:border-box}
a{text-decoration:none;color:#606060}
a:hover{color:red}
a:hover h1{color:red}
a:hover h2{color:red}
h1{font-size:13px;font-weight:700;display:inline;color:#606060}
h2{font-size:12px;font-weight:700;display:inline;color:#606060}
input{font-family:Verdana,Arial,Helvetica,sans-serif;font-size:12px;color:#606060}
input:hover{color:red}
textarea{font-family:Verdana,Arial,Helvetica,sans-serif;font-size:12px;color:#606060}
option{font-family:Verdana,Arial,Helvetica,sans-serif;font-size:12px;color:#606060}
div{float:left;border:0px dotted red;padding:0;text-align:left}

input.w200{width:200px;}

/*page structure*/
div[class*="head"]{height:66px}
div[class*="1"]{width:150px}
div[class*="2"]{width:650px}
div[class*="3"]{width:200px}
div[class*="4"]{width:150px}
div[class*="5"]{width:150px}
div.head{width:1300px;border-bottom:1px solid #A3C7E3}
div[class*="head"]{}
div.head1{position:relative}
div.head2{position:relative}
div.head3{text-align:left;position:relative}
div.head4{position:relative}
div[class*="mid"]{border-bottom:0 solid #A3C7E3;padding:5px 5px 0 0}
div[class*="mid"]{}
div.mid{width:1300px}
div.mid2{width:655px;min-height:600px}
div.midcolspan2{width:850px;min-height:600px}
div[class*="foot"]{height:200px;text-align:center;padding:5px 5px 0 0}
div[class*="foot"]{}
div.foot{width:1300px;height:200px;border-top:1px solid #A3C7E3}
div.foot1{text-align:left}
div.foot2{text-align:center;border:0 solid red}


/*master specific*/
.logo{font-size:40px;font-weight:300;color:#606060;position:absolute;bottom:3px}
div.topmenu{width:100%;border:0px dotted;height:66px;}
div.toplink{border:0px dotted red;width:12%;height:66px;display:table}
.toplink a {display:table-cell;vertical-align:bottom;padding-bottom:5px;}
.flag{width:25px;height:15px}
.langmenu{position:absolute;bottom:3px}
div.fthumbs{width:100%;border:0 dotted}
div.userticker{text-align:center;border:0 solid #e0e0e0;font-size:10px;color:red;display:inline;width:100%}
input.searchbox{width:95px;display:inline;}
input.searchbutton{padding-left:3px;width:65px;display:inline;border-style:none;background:#fff;}
span.boxticker{text-align:left;border:0px solid #e0e0e0;width:120px;font-size:10px;color:#f00;display:inline}
div.topsearch{border:0 dotted;height:66px;}
div.panelsearch{height:66px;border:0 dotted red;padding-top:35px;}

/*photopage specific*/
img.smallhoriz{width:71px;height:54px}
img.smallverti{width:54px;height:71px}
input.slideshowbutton{width:35px;height:30px;display:inline;border:1px solid #A3C7E3;background:#fff;font-size:10px;text-align:left;padding:5px}
input.lightboxbutton{width:140px;height:40px;display:inline;border:2px solid #A3C7E3;background:#fff;font-size:12px;text-align:left;padding:2px 5px 5px 2px;border-radius:4px}
.lightboxbutton:hover{border:2px solid red;box-shadow:0 12px 16px 0 rgba(0,0,0,0.24),0 17px 50px 0 rgba(0,0,0,0.19)}
div.zoomlink{width:140px;height:90px;border:2px solid #A3C7E3;background:#fff;font-size:12px;text-align:left;padding:2px 5px 5px 2px;border-radius:4px}
.zoomlink:hover{border:2px solid red;box-shadow:0 12px 16px 0 rgba(0,0,0,0.24),0 17px 50px 0 rgba(0,0,0,0.19)}
div.midhead{border:0px dotted;height:auto;width:655px}
div.midphoto{border:0 dotted;width:655px}
div.midbyline{border:0 dotted;width:655px;text-align:right;padding:10px 15px 0 0}
div.midclickinfo{border:0 dotted;width:655px;padding:30px 0 0 0}
div.miduseinfo{border:0 dotted;width:655px;padding:30px 0 0 0}
div.mthumbs{width:100%;border:0 dotted;width:655px;padding:10px 0 0}
div.midthumb{border:0 dotted red;height:80px}
div.midthumblarge{border:0px dotted red;height:180px;font-size:10px;}
div.midnotes{border:0 dotted;width:655px}
div.midclickinfomob{visibility:hidden}
div.midlocationmob {visibility:hidden}
div.midinfolinks{width:655px;height:auto}
div.speciesdescription{width:655px;height:auto}

/*genus page specific*/
table.familythumbs{border-collapse:collapse;width:auto;display:inline;}
td.thtext{font-weight:bold;padding-left:3px;border-bottom:1px solid #A3C7E3;background-color:#fff;text-align:left;vertical-align:middle;height:20px;}
td.data{height:15px;border:1px solid #e0e0e0;font-weight:normal;font-size:11px;background-color:#fff;text-align:left;vertical-align:bottom;padding:0px 3px 0px 2px;}
td.datanumber{height:15px;border:1px solid #e0e0e0;font-weight:normal;font-size:11px;background-color:#fff;text-align:right;vertical-align:bottom;padding:0px 3px 0px 2px;}

/*family page specific*/
table.familydata{border-collapse:collapse;width:auto;display:inline;}
/*zoom page specific*/
#container {width: 800px;height: 600px;background-color: white;border: 0px dotted black;color: white; /* text color for messages */display: inline-block;}

/*default page specific*/
div.controlsbutton{width:140px;height:160px;display:inline;border:0px dotted red;padding-top:30px}
input.controlsbutton{width:140px;height:25px;display:inline;border:1px solid #A3C7E3;background:#fff;font-size:10px;text-align:left;padding:2px 5px 5px 2px;}

div.midslideshow{width:850px;height:auto;border:0px dotted black;}
.gallerylayer{background-color:#fff!important;background-color:red;border:0px dotted green;height:800px}
#fadeshow2,#fadeshow2{background-color:#fff!important;background-color:red;border:0px dotted red;height:640px;width:800px;}
.fadeslidedescdiv{text-align:left;border:0px dotted black;top:600px;}
.descpanelfg{top:500px;border:0px dotted blue;}
img.ssimg{height:auto;width:100%;}
div.inline{display:inline}
select{border:1px solid #A3C7E3;-webkit-appearance:none;-moz-appearance:none;background:url(graphics/Dropdown.png) no-repeat;background-position:82px 7px;width:140px;text-overflow: ""; font-family:Verdana,Arial,Helvetica,sans-serif;font-size:12px;color:#606060}
div.mobileinfo{visibility:hidden;}
div.mobilelangmenu{visibility:hidden;}

/*companyinfo page specific*/
table.companyinfo td {height:40px;vertical-align:top;padding-left:5px;}

/*lightbox page specific*/

div.midspan2{width:850px}

.midspan2 div {border:0px dotted black;}

div.boxLiteralMobileInfo{padding-top:20px;font-size:1.0em;display:none;}
div.boxLabelMid2Head{padding-top:0px}
div.boxLiteralMid2{padding-top:20px;border:0px dotted red}
div.boxLiteralMid2Table{padding-top:20px;}
div.boxButtonOrder {padding-top:20px;width:auto;border:0;}
input.orderbutton {font-size:1.0em;width:auto;}
div.boxLiteralOrder{padding-top:20px;padding-bottom:20px}
div.boxLiteralPhotographer{padding-top:20px}
div.boxLiteralAdm{padding-top:20px}
table.boxAdmtable{padding-top:20px;padding-bottom:20px;}
td.familynames {font-size:10px}
    div.boxthumbs{width:100%;border:0 dotted;max-width:100%;height:auto}
div.boxthumb{width:160px;height:200px;border:0;}

/*userlogin, get pw, new user specific*/
table.newuser {width:auto;}
input.sendbutton {font-size:1.0em;}

/*left side navigation*/
div.leftsidenavicon {
    visibility:hidden;
    position: fixed;
    top: 250px;
    background: #A3C7E3;
    height: 100px;
    width: 25px;
    border-top-right-radius: 25px;
    border-bottom-right-radius: 25px;
    opacity: .8;
    vertical-align: middle;
    padding-top: 25px;
    z-index:1010;
}

span.leftsideopenarrow{font-size: 30px; cursor: pointer;border:0;display:block;height:100px;width:25px;line-height:86px;position:fixed;top:250px;outline:0;border:0;border-top-right-radius: 25px;border-bottom-right-radius: 25px;background-color:transparent;-webkit-tap-highlight-color: transparent;}

.leftsidenav div{border:0 dotted;color:#606060;width:100%;padding-top:5px;}
div.boxbutton{font-size:1em}
.leftsidenav{width:0;min-height:1000px;position:absolute;z-index:1020;top:50px;left:0;background-color:#fff;overflow-x:hidden;/*transition:.5s;*/padding-top:40px;border:0 dotted #000;box-shadow:0 12px 16px 0 rgba(0,0,0,0.24),0 17px 50px 0 rgba(0,0,0,0.19);border-top-right-radius: 15px;border-bottom-right-radius: 15px;}
.leftsidenav a{color:#606060;text-decoration:none;display:block;transition:.3s}
.leftsidenav a:hover{color:red}
.leftsidenav .closebtn{position:absolute;top:0;right:25px;font-size:36px;margin-left:50px}

/*navbar*/
div.navbarbox{width:655px;border:solid 5px red;height:60px;padding-top:30px;}
.navbar{width:100%;border-bottom:0px solid #A3C7E3;height:60px;position:relative;border:solid 0 red;float:left;margin-top:35px;visibility:hidden;}
.navbar a{border:solid 0 red;display:inline-block;width:72px}
.navbar .icon{display:none;text-decoration:none}

/*for mobile phones*/
@media screen and (max-width: 600px) {

body{font-size:1.8em}
h1{font-size:1em;font-weight:700;display:inline;color:#606060}
h2{font-size:1em;font-weight:700;display:inline;color:#606060}


input.w200{height:35px;font-size:1em;}

/*master page specific*/
    div.topmenu {display:none;}

/*photo page specific*/
div.midhead{border:0 dotted;height:auto;width:100%}
div.midphoto{width:100%;height:auto;border:0 dotted green}
img.midphotoimg{max-width:100%;height:auto}
div.midbyline{border:5px dotted red;max-width:100%;height:auto}
div.midclickinfo{border:0 dotted;width:350px;padding:10px 0 0}
div.miduseinfo{border:0 dotted;width:350px;height:0;padding:10px 0 0;visibility:hidden}
div.mthumbs{width:100%;border:0 dotted;max-width:100%;height:auto}
div.midthumb{height:100px}
div.midinfolinks{max-width:100%;height:auto}
div.speciesdescription{max-width:100%;height:auto}
div.midnotes{border:0 dotted;width:520px;visibility:hidden}
div.ContentPlaceholder1_PanelControlbutton{visibility:hidden}
    div.midlocationmob {width:100%;height:auto;visibility:visible}

 /*genus and family page specific*/
div.genustable {visibility :hidden;}
table.familydata{visibility :hidden;}
div.midthumblarge{border:0px dotted red;height:180px;font-size:0.8em;}

/*default page specific*/
div.mid2head{width:100%;height:auto;}
div.midslideshow{width:100%;height: auto;}
.gallerylayer{width: 100%;height: auto;}
#fadeshow2{width:100%;height:400px;border:0px dotted red;}
img.ssimg{height:auto;max-width:100%;border:0px dotted blue;}
div.ssimgdiv{border:0px dotted blue;}
.fadeslidedescdiv{text-align:left;border:0px dotted yellow;bottom:5px;top:400px;width:310px;visibility:hidden;}
div.descpanelfg{visibility:hidden;}
input.controlsbutton {visibility:hidden;height:0px}
div.controlsbutton {visibility:hidden;height:0px;padding:0 0 0 0;}
div.mobileinfo{visibility:visible;}
div.mobilelangmenu{border:0;width:100%;padding-top:20px;visibility:visible;}
img.mobileflag{height:15px;width:25px;border:0px solid white;}
div.mobileflagdiv {padding:12px;border:0;    }

/*lightbox page specific*/
div.boxLiteralMobileInfo{display:block;width:100%;}
    div.boxLiteralMid2Table {display:none;}
    div.boxLiteralOrder {display:none;}

/*zoom page specific*/
div.midcolspan2{width:100%;height:auto;border:0px dotted blue}
table.photonav{width:100%;height:auto;border:0px dotted green}
div.photomid{width:100%;height:auto;border:0px dotted blue}
#container {width: 100%;height: 300px;border: 0px dotted black;}
div.midbyline{width:100%;height:auto;border:0px dotted blue}

/*left side navigation*/
div.leftsidenavicon{visibility:initial;}

/*top navigation*/
.navbar a{display:none}
.navbar a.icon{float:right;display:block;}
.navbar{border:solid 0px blue;width:100%;height:66px;margin-top:unset;text-align:right;padding:0 10px 0 0;visibility:visible;}

.logo{font-weight:300;color:#606060;position:absolute;bottom:3px}

div.head{width:100%;height:auto;border:0 dotted green}
div.head1{width:50%;height:40px;visibility:visible;border:0 dotted red}
div.head2{width:50%;height:40px;visibility:visible;border:0 dotted #000;padding-top:0}
div.head3{width:100%;height:0;visibility:hidden;}
div.head4{width:100%;height:0;visibility:hidden;}
div.head5{width:100%;height:0;visibility:hidden}
div.mid{width:100%;border:0 dotted red;height:auto}
div.mid1{width:0;height:0;display:none}
div.mid2{width:100%;border:0 dotted blue;visibility:visible}
div.mid3{width:100%;height:0;visibility:hidden}
div.mid4{width:100%;height:0;visibility:hidden}
div.mid5{width:100%;height:0;visibility:hidden}
div.foot{width:100px;height:100px;border:solid 0 #000;float:left}
div.foot1{width:0;height:0;visibility:hidden}
div.foot2{width:0;height:0;float:left;visibility:hidden}
div.foot3{width:100%;height:0;visibility:hidden}
div.foot4{width:100%;height:0;visibility:hidden}
div.foot5{width:100%;height:0;visibility:hidden}

div.speciesdescription{visibility:hidden}
div.clickinfo{visibility:hidden}


/*left side navigation*/
div .zoomlink{font-size:1em;height:auto;border:2px solid #A3C7E3}
div.boxbutton{font-size:1em;height:auto;padding-bottom:5px}
input.lightboxbutton{padding-bottom:5px;height:45px}
div.midclickinfomob{visibility:visible;width:100%}
div.midclickinfo{visibility:hidden;height:0}

/*this all happens after click on the burger*/

/*entire menu bar*/
.navbar.responsive{border:solid 0 #000;width:100%;height:400px;z-index:1100;background-color:#fff;text-align:right;box-shadow:0 12px 16px 0 rgba(0,0,0,0.24),0 17px 50px 0 rgba(0,0,0,0.19);border-top-left-radius: 15px;border-bottom-left-radius: 15px;}
/*burger icon*/
.navbar.responsive .icon{font-size:1em;text-decoration:none}
    /*menu elements*/
    .navbar.responsive a {
        font-size: 1em;
        /*stacker menuen i en søjle*/
        float: none;
        width: 100%;
        /*a block element fills the entire line*/
        display: block;
        text-align: right;
        padding: 0;
        border: solid 0 #000;
    }
        /*first menu element*/
.navbar.responsive a:first-child{padding:0}
}


/*for mobile phones*/
@media screen and (max-width: 500px) {
#fadeshow2{width:100%;height:350px;border:0px dotted red;}

}

/*for mobile phones*/
@media screen and (max-width: 400px) {
#fadeshow2{width:100%;height:300px;border:0px dotted red;}
}