html,body  { height: 100%; width:100%;} 
#titleDesc {
     
    padding-top:10px;
}
#map-list {
   display: inline-block; 
   width:25%;
   height: 800px; 
   overflow:auto;
   float:left;
}
  
#map-canvas { 
 
  float:right;
  border-width: 1px;
  border-style:solid;
  border-color:gray;
  height: 800px; 
  width:72%;} 
 
#rovcol2 {  
  margin: 0px 0px 0px 0px;
  text-align: left;
  background-repeat: no-repeat;
  background-position: top right;
}
 
#dropbox_img{
	float:center;
	padding: 0px 5px 10px 10px;
	width:200px;
	height:200px;
}
#imptnotice {
 
	background-color: #003366;
	text-align: center;
	color: white;
	padding: 5px 5px 10px 10px;
	 
}
#imptnoticelink {
 
	color: white;
		 
}
 
 
 
 /* Style the buttons that are used to open and close the accordion panel */
.accordion {
    background-color: #fff;
    color: #444;
    cursor: pointer;
    padding: 5px;
    width: 100%;
    text-align: left;
    border:none;
    outline: none;
    transition: 0.4s;
    
}

.panelHeading    {
    font-weight: bold;
    padding-left:10px;
    letter-spacing: 2px;
    
}

 

.pinAddress1 {
   color:#0f6984;
   font-weight:bold;
    
}

.pinAddress2  {
    font-size:90%;
}

 

/* Add a background color to the button if it is clicked on (add the .active class with JS), and when you move the mouse over it (hover) */
.active, .accordion:hover {
    background-color: #cce6ff;
}

.panel {
   
    background-color: #ffffff;
    overflow: hidden;
    display:none;
    vertical-align: middle;
    border:none;
    box-shadow:none;
}
/* Style the buttons that are used to open and close the accordion panel */
.accordion:after {
    /*content: '\02795'; /* Unicode character for "plus" sign (+) */
    content:'\2BC8';
    color: #777;
    float: right;
    margin-left: 5px;
    vertical-align:middle;	
    font-size:90%;
}

.active:after {
    /*content: "\02796";   /*Unicode character for "minus" sign (-) */
    content:'\02BC6';
    vertical-align:middle;	
    font-size:90%; 
}


.panel > ul {
    padding:0px
}
.listItem{
     
    color: #444;
    cursor: pointer;
    word-wrap: break-word;
    text-align: left;
    border: none;
    outline: none;
    transition: 0.4s;
    list-style: none;
    vertical-align: middle;
    line-height:normal;
    background-color:#fff;
    width:100%;
    
}

.listItem button {
   border: none;
   background-color: #fff;
   width:100%;

}

 
.listItem:hover {
    width:100%;
}

 
.pinImg {
   display:flex;
   align-items:center;
   vertical-align: top;
   margin:5px;
}

.pinLabel {
  padding-left: 10px;
  margin:5px;
  display:inline;
  text-align:left;
} 

@media ( min-width: 481px) {  
     #adImg {
      display:block;
    }
    #adLink{
      display:none;
    }

} 
@media ( max-width: 480px) {  
     
      #map-list {
      	float:left;
      	width:100%;
    		-webkit-order: 1;
      	order:1; 
      	margin-right : 10px;
      	height:auto;  
      }
      #map-canvas { 
      	float:right;
    	width:100%;
    	height:380px;
    	-webkit-order: 2;
    	order:2;
	padding-bottom:5px;
     } 
     #map-info {
     	  padding:2px 2px 2px 2px; 
     	  font-size:8px;
     }
      
     
    #dropbox_img{
       padding: 0px 5px 10px 10px;
       width:200px;
       height:200px;
    }

    #adImg {
      display:none;
    }

    #adLink {
     
      color: #112E51;
      text-decoration: underline;
    }

    .accordion:after {
    content: '\02795'; /* Unicode character for "plus" sign (+) */
    color: #777;
    float: right;
    margin-left: 5px;
     
}

.active:after {
    content: "\02796";   /*Unicode character for "minus" sign (-) */
     
}