html,
body {
  font-size: 16px;
     margin:0;
   padding:0;
   height:100%;
   
   } 




body{font-family:serif,verdana,Helvetica, Arial, sans-serif;background-image: url('SDI_Br2.JPG');font-size:100%;color: black;}



 


.top-bar {background:transparent;}
.nav .top-bar {background:transparent;}

 .top-bar-section ul li {
 /* background: #b6bfd6; */
 background:white;
 background:rgba(255,255,255,0.9); 
 
 }


    

 /*.topmenu input[type=text] {margin:0px;margin-bottom:1rem;padding:5px;max-width:400px;height:2rem;float:right;border-radius:5px;}*/



     /*.top-bar-section .dropdown li:not(.has-form):not(.active) > a:not(.button)  {background:#fff333;position:fixed;top:0;} */

 /*   .top-bar-section li:not(.has-form) a:not(.button) { background: #ffffff;color: black;  font-size: .7rem; padding-top:0px;} */


    .top-bar-section li:not(.has-form) a:not(.button) { background: #ffffff;color: #114b95;  font-size: 1em;font-family:Verdana, Arial, Helvetica, sans-serif; }

      .top-bar-section .dropdown li:not(.has-form):not(.active) > a:not(.button) {
        color: black;
        
        
       background-color:#b6bfd6;
       background:rgba(20,73,132,.15); 
        
        
 /*    background:transparent; */
/*	background-color:rgba(20,73,132,.7); */

        font-size: .8em;
font-family:Verdana, Arial, Helvetica, sans-serif;
 padding-left:15px !important;padding-right:15px !important;
        }
        
       .top-bar-section .dropdown li label {
        white-space: nowrap;
        background: #ffffff; }       
 

       .top-bar-section .dropdown li:not(.has-form):not(.active):hover > a:not(.button) {

      
         background-color:transparent;

	 background:rgba(20,73,132,.1);
	 
	 
	 color: #144984;
        /*   font-weight:bold;*/
      /*  background: #c0c0c0; e1e9fd dae4ff b6bfd6*/
        }
 
       .top-bar-section li:not(.has-form) a:not(.button):hover {
         background-color: #b6bfd6;
         background:rgba(20,73,132,.1);
         
        /* background: #f0f0f0;*/
        }
        
        
     .top-bar-section ul li:hover:not(.has-form) > a {
      background-color: transparent;
	 color: #144984;
         /*   font-weight:bold;*/
      background:rgba(20,73,132,.1);
   }       
        
     .top-bar.expanded .title-area {
      background: transparent; 
 
      }       
        
  
  
   /* for back button in nav */      
         
    .back h5 > a {
    	height:2rem !important;line-height:2rem !important;
          font-size: .8rem !important;
  	font-family:helvetica !important;
          color: black !important;
   	background:rgba(20,73,132,.2) !important;
  	 padding-left:15px !important;
         }   
   
   
   
         
   .back h5:hover{
  
         background:rgba(20,73,132,.1) !important;
  
   
         }   
   
  
  .top-bar .toggle-topbar.menu-icon a { color:black;}     
        
 .top-bar .toggle-topbar.menu-icon a span::after {   
 box-shadow: 0 0px 0 1px black, 0 7px 0 1px black, 0 14px 0 1px black;
 }
 .top-bar .toggle-topbar.menu-icon a span:hover:after {
 box-shadow: 0 0px 0 1px gray, 0 7px 0 1px gray, 0 14px 0 1px gray; } 
  
 .logo {max-height:48px;height:auto;width:auto;padding:0;margin:0; z-index: 600;}   
 .orglogo {max-height:60px;height:auto;width:auto;padding:0;margin:0; }   
  
  
 .footer {background-color:#114b95;height:100px;width:100%;color:white;}    
  
  
  .bold {font-weight:bold;}
  
  
 
  
 
 hr {
 
 color: black;
 background-color: black;
height: 5px;
}
 
td {vertical-align:top;} 
 
.test { border:2px solid green;}

.heading {  font-family: Serif, Verdana, Arial, Helvetica, sans-serif; font-size: 3rem; font-style: normal; font-weight: bold; color: black; text-decoration: none;}

h1 {  font-family: Serif, Verdana, Arial, Helvetica, sans-serif; font-size: 3rem; font-style: normal; font-weight: bold; color: black; text-decoration: none;}
a:link { font-weight: normal; color: #114b95;} 
a:visited { font-weight: normal; color: #114b95;} 
a:hover { font-weight: bold; color: #B24500;} 

a {  color: #000;} 

/*a:link {  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; font-style: normal; font-weight: normal; color: #114b95}*/
/*a:hover {  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; font-style: normal; font-weight: normal; color: #B24500}*/

/*a:visited {  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; font-style: normal; font-weight: normal; color: #114b95}*/


 

h4 {
color:black;
font-family: Serif, Verdana;
font-size: 1rem;
font-weight: bold;
}

.surflogo {
max-height:60px;

}

 

.off {display:none;}  
.on {display:inline;}  


select {width:50%;}

.navtable {width:400px;}

.tarrow {text-align: right;width:30px;vertical-align: middle;}

.tlink {text-align: left;vertical-align: middle;}  
  
  
.navside {
width:135px;
vertical-align:top;
background-color:black;
color:#D8EBFC;
font-weight: bold;
line-height:1.25rem;
}  
  

.freelisp2 {

   border:.1rem black solid;
  /*   border-radius:.5rem;*/
   padding:.4rem 1rem .4rem 1rem;
   margin:1rem;
   width:100%;


   color:black;
  
   font-family:serif;
   font-size: 1.25rem;
 font-weight: bold !important;
   background:#d9eafa;
   white-space:nowrap;
 
     box-shadow:
         inset 0 0 2px 0 rgba(255,255,255,.4),
         inset 0 0 3px 0 rgba(0,0,0,.4),
         inset 0 0 3px 5px rgba(0,0,0,.05),
         2px 2px 4px 0 rgba(0,0,0,.25);

/*b2c2cf
 6f7c85
   font-family: 'times new roman';
 6c767f 108 118 127
 #BEE2F9
 
 #C8D6E1 */
 
 
}
  
.freelisp {
  font-family: serif;
  font-weight: 800 !important;
  color: #000 ;
  font-size: 1.25rem;
 text-shadow: .5px .5px 0px #000;
  box-shadow: 1px 1px 1px #BEE2F9;
  padding:.1rem .5rem .1rem .5rem;
  border: 4px outset #C8D6E1;
  background: #D9EAFA;
   width:110px; !important;
   margin:.5rem;
   white-space:nowrap;
   
} 
 
 
 
 
 
 
 
 
 
 
 
 
 

.freelisp:hover {background:#bcdaf9;} 
.freelisp:visited { color:black; font-weight: bold;} 



.lisp {

width:394px;
height:138px;

}

.lisptab {

width:400px;
 

}
  
  
  
  
  
  
 
.showphoto {
 /* color: #ffffff; #322e2b*/
 /*  border:.2rem #ffffff solid;*/
 /*  border-radius: 1rem;*/
  /* float: left;*/
  display: inline;
  background-color:black;
  background-color:rgba(0,0,0,.75);
  padding:1rem;

 /*   margin:0rem;*/
  z-index: 100; /* So you can see answer in IE8 */
 /*  margin: 0 10px 20px 10px;*/
  /* padding:30px;*/

  width:100%;
  position:fixed;
  top:0;
  left:0;
  height:100%;

  overflow:hidden;
  display:none;


}


.showphotoinner {
 /* color: #ffffff; #322e2b*/
 /*  border:.2rem #ffffff solid;*/
 /*  border-radius: 1rem;*/
  /* float: left;*/
  display: block;
 /*   background-color:black;*/
 /*   background-color:rgba(0,0,0,1);*/
margin:0rem;
padding:0rem;
 /*   margin:0rem;*/
  z-index: 101; /* So you can see answer in IE8 */
 /*  margin: 0 10px 20px 10px;*/
  /* padding:30px;*/

  width:auto;
  /*  position:fixed;*/

  /*  height:100%;*/

  overflow:hidden;
  display:none;


}



 

 
 
  .galimg {
  max-width:24%;
      width: auto;
     height: auto;
  max-height:250px;

  }  
  
  .photoframe {
  width: 100%;
  height: 90vh;
     max-height:90vh;
    max-width: 95vw;
  display: block;
  margin-left: auto;
  margin-right: auto; 
    /*   border:.2rem #ffffff solid;*/
     /*  border-radius: 1rem;*/
} 
  
  .photopage {
  background-color:#322e2b;
  padding-top:.5rem;
   
  }
  
  .photopage a {
  font-size:1.2rem;
   color: white;
}
  
  .galimglg{
  
      border:.2rem #ffffff solid;
    border-radius: 1rem;
    background-color:black;
  background-color:rgba(0,0,0,1);
   /*     min-height:50vh;*/
   
      width: auto;
     height: auto;   
 margin-left: auto; 
margin-right: auto;     
   
   max-height:89vh;
  max-width: 100%;
  /*    padding:2rem;*/

     
 display: block; 
   
  }
  
   .galimglg2{
  
      border:.2rem #ffffff solid;
    border-radius: 1rem;
    background-color:black;
  background-color:rgba(0,0,0,1);
   /*     min-height:50vh;*/
   
      width: auto;
     height: auto;   
 
margin-left: auto;   
margin-right: auto; 
   
   max-height:100%;
  max-width: 95vh;
 
/*padding-right: 4rem; */
     
 display: block; 
 
  position:fixed;  
  top:15%;
  left:10%
  } 
  
 
 

 
 
     .imgback {
        
    border:.1rem #ffffff solid;
    border-radius:.625rem;
    padding:.4rem .625rem .4rem .625rem;
    font-weight: bold;
    color:white !important;
    position:fixed;
    top:50%;
    font-size: 1.5rem;
    background:#322e2b;
     z-index: 150;
   }
   
     .imgback:hover {
     color:#aa0000;
      background:rgba(0,0,0,.9);
   }
 
 
      .imgnext {
         
     border:.1rem #ffffff solid;
     border-radius:.625rem;
     padding:.4rem .625rem .4rem .625rem;
     font-weight: bold;
     color:white !important;
     position:fixed;
     right:0;
     top:50%;
     font-size: 1.5rem;
     background:#322e2b;
      z-index: 900;
    }
    
      .imgnext:hover {
      color:#aa0000;
       background:rgba(0,0,0,.9);
   }
 
 
 
  
      .imgcancel {
         
     border:.1rem #ffffff solid;
     border-radius:.625rem;
     padding:.4rem .625rem .4rem .625rem;
     font-weight: bold;
     color:red;
    
     float:right;
  /*   position:fixed; */
     font-size: 1.5rem;
     background:#322e2b;
    }
    
      .imgcancel:hover {
      color:#aa0000;
    /*    border:.3rem #ff0000 solid;*/
       background:rgba(0,0,0,.5);
     }
  
  

       .imgrot {
         
     border:.1rem #ffffff solid;
     border-radius:.625rem;
     padding:.4rem .625rem .4rem .625rem;
     font-weight: bold;
     color:white;
    
     position:fixed;
     right:0;
     top:30%;

  /*   position:fixed; */
     font-size: 1.5rem;
     background:#322e2b;
    } 
  
  
 
  
  
  
  
  
  
  
  
  
  @media only screen and (max-width: 40em) {
  
  
   .galimg {
  max-width:49%;
      width: auto;
     height: auto;
  max-height:150px;

  } 
  
 .navtable {width:100%;}
 .tarrow {display:none;}
  select {width:100%;}
 h1 {font-size:2rem;}
 
.lisp {
min-width:135px;
width:auto;
height:auto;

}
 .lisptab {
 
 width:135px;
  
 
}
 
  }