html 
{
    margin:    0 auto;
    min-height:100%;
} 

body 
{
	 height:100%;
	 margin:0 auto;
	 color:#000000;
     font-size:1.0em; 
	 letter-spacing:0px;
	 line-height:1.0em;
	 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

h1,h2,h3,h4{
color:#000000;font-size:1.0em; line-height:1.5em;font-weight:bold;
}

img,div { border-radius: 10px;}

#pcontainer
{
 height:100%;
 width:100%;
 margin:auto;
 position:relative;
}

#mpop_menu
{
	display: block; height: auto;padding: 2px;border: 0px solid #ccc;background-color: #ffffff; z-index:1002;overflow: auto; 	
}

a{TEXT-DECORATION:none}a:hover{TEXT-DECORATION:none}.STYLE2 {color: #000000}

p{
	 font-size:1.0em; 
	 line-height:1.5em;
   font-weight:normal;
   word-break : word-wrap; 
   overflow:hidden; 
}

::placeholder {
  color: #ccc;
  opacity: 1; /* Firefox */
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
 color: #ccc;
}

::-ms-input-placeholder { /* Microsoft Edge */
 color: #ccc;
}

#FloatNav{
     width:auto;
     height:auto;
     margin-top:10px;
     position:fixed;    
     right:10px;
     bottom:10px;        
 }
#FloatNav #FloatNavList{
      width:100%;
      height:auto;
      position:relative;
      border:1px solid #000000;
    background-color:#ffffff;
	  -moz-opacity: 0.8; 
  	opacity:.80; 
  	filter: alpha(opacity=80); 

}

#FloatNav #FloatNavList ul{
      margin-top:5px;
      margin-bottom:5px;
      padding-left: 0;
      
}

#FloatNav #FloatNavList   ul li {
            margin-bottom: 5px;
        }
        
#FloatNav #FloatNavList  ul li:before {
            content: "";
        }
        

#FloatNav #FloatNavList ul li a{
    display:block;
    width:100%;
    height:2.0em;
    margin-top:10px;
    margin-left:5px;
    color:#000000;
    font-size:1.0em;                    
    line-height:1.5em;
    font-weight:bold;
    text-align:left;
    text-decoration:none;
}

        
        


.div_lefttop_pc
{
	position:relative;
    display:block;
    _display:block;
    *display:block;
    margin-left:15px;
    zoom:1;
}

.div_lefttop_mobile
{
		position:relative;
    display:none;
    _display:none;
    *display:none;
    margin:0;
    zoom:1;
    
}

#div_nav_search {
	display:  block;
	width:100%;
	float:left;
	margin-left:5px;
	height:30px;
	background-color:#ffffff;
}

form.prosearch input[type=text] {
	margin-top:6px;
  font-size: 1.0em;
  line-height:1.2em;
  letter-spacing:1px;
  border: 1px solid #ccc;
  float: left;
  width: 70%;
  background: #ffffff;
  border-radius: 5px;
}

form.prosearch input[type=submit] {
	margin-top:6px;
	margin-left:2px;
  font-size: 1.0em;
  line-height:1.2em;
  letter-spacing:1px;
  border: 1px solid #ccc;
  float: left;
  width: 24%;
  background: #ffffff;
  border-radius: 5px;
}

hr 
{
	width: 100%;
	margin-left: 0;
	margin-right: 0;
	margin-top:10px;
	margin-bottom:10px;
	height: 1px;
}

#homepage
{
	position:absolute;
	display: block;
	left: 26%;
	top:60px;
  width:74%;
	min-height:auto;
	line-height: 20px;     
	overflow:hidden;   

}

#homepage img
{
	width:100%;
	border:0;
}

#leftbar_menu
{
    display:  block;
    position:   relative; 
    text-align: left;
    width:25%;
    height:auto;
    top:38px;
    margin-top:2px;
    margin-right: auto;
    border: 1px solid;
   border-color:#ccc;
    overflow:hidden;
    padding-bottom:10px;
}

#leftbar_top
{
    display:  block;
    position:   relative; 
    text-align: left;
    width:25%;
    height:auto;
    top:30px;
    margin-top:2px;
    margin-right: auto;
    border: 0px solid;
   border-color:#ccc;
    overflow:hidden;
    padding-bottom:10px;
}

   .top-menu {
       position: fixed;
       top: 0;
       left: 0;
       width: 100%;
       height: 30px;
       background:#ccc ;
       color: black;
       display: flex;
       align-items: center;
       padding-right:20px;
       z-index: 2000;
       box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
   }
   
   .top-menu-left {
       display: flex;
       width:35%;
       align-items: center;
       gap: 10px;
   }
   
   .top-menu-right {
       margin-left: auto;
       display: flex;
       align-items: center;
       gap: 10px;
   }
   
   .top-menu-item {
       display: flex;
       align-items: center;
       gap: 8px;
       padding: 8px 8px;
       border-radius: 4px;
       cursor: pointer;
       transition: var(--transition);
       font-size: 0.9rem;
       white-space: nowrap;
   }
   
   .top-menu-item:hover {
       background-color: rgba(255, 255, 255, 0.1);
   }
   
   .top-menu-item i {
       font-size: 1rem;
   }
   
   .top-menu-divider {
       height: 20px;
       width: 1px;
       background-color: rgba(255, 255, 255, 0.5);
       margin: 0 5px;
   }
        
.scroll-container {
    width: 100%;   
    height: 100%;   
    flex: 1;            
    overflow: hidden;
    white-space: nowrap;
    position: relative;
    border:0;
}

.scroll-text {
    display: inline-block;
    min-width: 100px; 
    padding-left: 100%;
    animation: scroll 10s linear infinite;
    height: 100%;     
    display: flex;
    color:#ff409f;
    align-items: center; 
}

@keyframes scroll {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(-100%);
    }
}        
        
        @media (max-width: 950px) {
			 #leftbar_top
			{
			    display:  block;
			    position:   relative; 
			    text-align: left;
			    width:100%;
			    height:auto;
			    top:38px;
			    margin-top:2px;
			    margin-right: auto;
			    border: 0px solid;
			   border-color:#ccc;
			    overflow:hidden;
			    padding-bottom:10px;
			}
			
			#leftbar_menu
			{
			    display:  none;
			    position:   relative; 
			    text-align: left;
			    width:40%;
			    height:auto;
			    top:30px;
			    margin-top:4px;
			    margin-right: auto;
			    border: 1px solid;
				  border-color:#ccc;
			    overflow:hidden;
			    padding-bottom:10px;
				z-index:1002;overflow: auto; 				 
			}			

			#homepage
			{
				position:absolute;
				display: block;
				left: 0;
				top:160px;
			  width:100%;
				min-height:auto;
				line-height: 20px;     
				overflow:hidden;   
			
			}			
			
			.div_lefttop_mobile
			{
					position:relative;
			    display:block;
			    _display:block;
			    *display:block;
			    margin:0;
			    zoom:1;
			    
			}
			
			.div_lefttop_pc
			{
					position:relative;
			    display:none;
			    _display:none;
			    *display:none;
			    margin:0;
			    zoom:1;
			    
			}
        }
        
        @media (max-width: 480px) {
			 #leftbar_top
			{
			    display:  block;
			    position:   relative; 
			    text-align: left;
			    width:100%;
			    height:auto;
			    top:38px;
			    margin-top:2px;
			    margin-right: auto;
			    border: 0px solid;
			   border-color:#ccc;
			    overflow:hidden;
			    padding-bottom:10px;
			}
			
			#leftbar_menu
			{
			    display:  none;
			    position:   relative; 
			    text-align: left;
			    width:80%;
			    height:auto;
			    top:30px;
			    margin-top:4px;
			    margin-right: auto;
			    border: 1px solid;
				  border-color:#ccc;
			    overflow:hidden;
			    padding-bottom:10px;
				z-index:1002;overflow: auto; 				    
				
			}			

	            .top-menu-right {
		                gap: 0px;
	            }			
	
			   .top-menu-item {
			       gap: 4px;
			       font-size: 0.8rem;
			   }		            

				.scroll-container {
					display:none;
				}

				.scroll-text {
				    font-size: 0.8rem;
				}

        }
        
        
		@media (max-width: 320px) {
			 #leftbar_top
			{
			    display:  block;
			    position:   relative; 
			    text-align: left;
			    width:100%;
			    height:auto;
			    top:38px;
			    margin-top:2px;
			    margin-right: auto;
			    border: 0px solid;
			   border-color:#ccc;
			    overflow:hidden;
			    padding-bottom:10px;
			}
			
			#leftbar_menu
			{
			    display:  none;
			    position:   relative; 
			    text-align: left;
			    width:80%;
			    height:auto;
			    top:30px;
			    margin-top:4px;
			    margin-right: auto;
			    border: 1px solid;
				  border-color:#ccc;
			    overflow:hidden;
			    padding-bottom:10px;
				z-index:1002;overflow: auto; 				    
				
			}		
				
			#homepage
			{
				position:absolute;
				display: block;
				left: 0;
				top:240px;
			  width:100%;
				min-height:auto;
				line-height: 20px;     
				overflow:hidden;   
			
			}					

        }

#homeabt
{
	position:relative;
	display: block;
  margin-top: auto;
  width:100%;
	min-height:auto;
	overflow:hidden;   
}


#footer
{
  position:relative;
	display: block;
	width:100%;
  margin-left: 0px;
  margin-top:20px;
  margin-right: auto;
  line-height: 1.0em;        
  overflow:hidden;
 }
 
.maincl{
font-size:1.3em;
line-height:2.0em;
font-weight:bold;
word-break : word-wrap; 
border:1px solid #ccc;
margin-left:2px;
border-radius:5px;
-webkit-border-radius:5px;
-moz-border-radius:5px;
}

.maincl a{
	margin-left:5px;	
}
 
.subcl{
font-size:1.1em;
line-height:2.2em;
margin-left:10px;
word-break : word-wrap; 
}
 
.endfooter{
font-size:0.8em;
color:#000000;
line-height:0.8em;
padding-top:10px;
margin-left:0em;
} 

.clear{
	clear:both;
}
td {  font-size: 1em; line-height: 1em; 	 
}

a {  color: #000000;}

ul { list-style:none; padding:0; margin:0;}    
img{
	max-width: 100%;
	 border:0px;
}

.mySlides {display: none;}
.mySlides img {vertical-align: middle;width:100%; border-radius: 10px;}

.slideshow-container {
  max-width: 100%;
  position: relative;
  margin: auto;
}

.prev, .next {
  cursor: pointer;
  position: absolute;
  top: 50%;
  width: auto;
  padding: 16px;
  margin-top: -22px;
  color: #000000;
  font-weight: normal;
  font-size: 2.5em;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
  user-select: none;
}

.next {
  right: 0;
}

.prev:hover, .next:hover {
  background-color: rgba(0,0,0,0);
      text-decoration:none;
}

.slider_text {
	display: none;
  color: #ffffff;
  font-size: 1.0em;
  font-weight:normal;
  padding: 8px 12px;
  margin-top:-35px;
  width: 99%;
  background-color: rgba(0,0,0,1);
  -moz-opacity: 0.6; 
  opacity:.60; 
  filter: alpha(opacity=60); 
  text-align: center;
  text-transform: capitalize;
}

.numbertext {
  color: #ff409f;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 50px;
}


.fade {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 0.5s;
  animation-name: fade;
  animation-duration: 0.5s;
}

@-webkit-keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}

@keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}

.indicators {
	display:block;
  text-align: center;
  margin-top: 10px;
}

.indicator {
  display: inline-block;
  position:relative;
  width: 10px;
  height: 10px;
  border: 1px solid;
  border-radius: 50%;
  margin: 0 5px;
  cursor: pointer;
}

.indicator.active {
  background-color: #000000;
}

@media only screen and (max-width: 300px) {
  .prev, .next,.slider_text {font-size: 11px}
}



#listlayout { width:100%; margin-left:0px;padding-bottom:1px; overflow:auto;}   
#listlayout ul{margin-left:0px;padding-left:1px;}         
#listlayout ul li {  float:left; margin:0px 10px 2px 2px; display:inline; text-align:center;overflow:hidden;height:240px;}   
#listlayout ul li a {font-size:0.9em; display:block;overflow:hidden;max-width:160px;margin-bottom:30px;line-height:1.2em;text-transform: capitalize;}                                                                     
#listlayout ul li a img { padding:0px;  border:1px solid #ccc; margin-bottom:3px; display:block;overflow:hidden;max-width:158px;}       

#listlayout320 { width:100%; margin-left:0px;padding-bottom:1px; overflow:auto; }   
#listlayout320 ul{margin-left:0px;padding-left:1px;}         
#listlayout320 ul li {  float:left; margin:2px 10px 2px 2px; display:inline; text-align:center;overflow:hidden;height:280px;}   
#listlayout320 ul li a { font-size:0.9em; display:block;overflow:hidden;max-width:324px;margin-bottom:30px;text-transform: capitalize;}                                                                     
#listlayout320 ul li a img { padding:0px;  border:1px solid #ccc;margin-bottom:3px; display:block;overflow:hidden;max-width:320px;}                         


#listlinks { width:100%; margin-left:0px;padding-bottom:1px; overflow:auto;}   
#listlinks ul{margin-left:0px;padding-left:1px;}         
#listlinks ul li {  float:left; margin:0px 10px 2px 2px; display:inline; text-align:left;overflow:hidden;height:50px;width:160px;}   
#listlinks ul li a { display:block;overflow:hidden;max-width:100%;margin-bottom:20px;line-height:1.4em;text-transform: capitalize;}                                                                     
#listlinks ul li a img { padding:1px;  border:1px solid #ccc; margin-bottom:3px; display:block;overflow:hidden;} 

.table, .table * {margin: 0 auto; padding: 0;font-size: 14px;}   
.table {display: table; width: 90%; border-collapse: collapse;margin-left:0px;}   
.table-tr {display: table-row; height: 30px;}   
.table-th {display: table-cell;font-weight: bold;width:20%;height: 100%;border: 1px solid gray;text-align: center;vertical-align: middle;}   
.table-td {display: table-cell; height: 100%;border: 1px solid gray; text-align: center;vertical-align: middle;}