@media screen and (max-width: 768px) 
{
.content-section-loading
{
      width: 100%;
      height: auto;
}
.content-section-loading
.loading-background
{     
      top: 20%;      
      width: 100%;            
}
.content-section-loading
img
{           
      width: 250px;
      height: auto;                                   
}
.content-section-loading
.loading-article
{          
      top: 22%;      
      width: 100%;            
}
.content-section-loading
.loading-article
h5
{                         
      font-size: 22px;            
}
.content-section-loading
.loading-article
span
{          
      font-size: 22px;      
}
.content-section-loading
.loading-article
p
{                 
      font-size: 10px;       
      margin-top: 2px;        
      margin-left: 20%;          
}
.content-section-loading
.loading-span
{          
      top: 80%;      
      width: 25px;
      height: 25px;            
}
.content-section-loading
.loading-copyright
{          
      right: 0;      
}
.content-section-loading
.loading-copyright
p
{      
      padding: 15px;      
      font-size: 10px;      
}
}
@media (min-width: 768px) and (max-width: 1900px)
{
.content-section-loading
{
      width: 100%;
      height: auto;
}
.content-section-loading
img
{           
      width: 300px;
      height: 400px;            
}
.content-section-loading
.loading-span
{          
      top: 75%;            
}
}



@media screen and (max-width: 1000px) 
{
.content-section-carousel
{
      width: 100%;
      height: auto;
      padding: 20px 0;
}      
.content-section-carousel
.carousel-container
{    
      width: 95%;
      height: 80vh;   
      margin-top: 40px;               
      border-radius: 40px;   
}
.content-section-carousel
.carousel-box
{
      width: 100%;
      height: auto;        
}
.content-section-carousel
h5
{      
      font-size: 15px;       
      letter-spacing: 0;
      margin-bottom: 20px;
}
.content-section-carousel
h6
{      
      width: 60%;
      font-size: 20px;
      font-weight: 500; 
}
.swiper-button-next::after,
.swiper-button-prev::after 
{
      font-size: 10px;
      font-weight: 700;
}
}



@media screen and (max-width: 1000px) 
{
.content-section-navigate
{
	  width: 100%;
	  height: auto;      	              
}
.content-section-navigate
.navigate-container
{
      width: 95%;
      height: 3vh; 
      margin: 0 auto;      
}
.content-section-navigate
p
{          
      font-size: 12px;       
}
.content-section-navigate
span 
{
	  font-size: 12px;       
}
}



@media screen and (max-width: 1000px) 
{
.content-section-spam
{
	width: 100%;
	height: 30vh;	  
      margin-top: 0px;            
}
.content-section-spam
.spam-container
{
      width: 100%;
      height: 8vh;                  
      padding: 5% 10%;	    
      align-items: baseline;
      justify-content: flex-start;
}
.content-section-spam
p
{      
      font-size: 40px; 	  
}
.content-section-spam
span 
{
	font-size: 40px;       
}
}




@media screen and (max-width: 768px) 
{
.content-section-flexbox
{
      width: 100%;
      height: auto;
}
.content-section-flexbox
.flexbox-container
{
      width: 95%;   
      height: auto;                
}
.content-section-flexbox
.flexbox-article
{
      width: 100%; 
      height: auto;
      padding: 15px 40px;      
      border-radius: 35px;
      background-color: #f6f7f8;
}
.content-section-flexbox
.flexbox-article
h5
{     
      font-size: 12px; 
      padding-top: 10px;
}
.content-section-flexbox
.flexbox-article
span
{      
      width: 100%;       
      float: none;           
      font-size: 14px;  
      padding-top: 10px;      
}
.content-section-flexbox
.flexbox-box
{      
      gap: 0;
      height: 60vh;      
      margin-top: 10px;
      min-height: 10px;                         
}
.content-section-flexbox
.flexbox-item
{
      width: 85%; 
      height: 50vh;
}
.content-section-flexbox
.flexbox-background
{     
      width: 95%;
      height: 60vh;            
}
.content-section-flexbox
img 
{            
      width: 100%;
      height: auto;            
}
.content-section-flexbox
h6
{               
      font-size: 20px;      
}
.content-section-flexbox
.flexbox-context 
p 
{      
      font-size: 12px;      
}
}
@media (prefers-reduced-motion: reduce) 
{
.content-section-flexbox      
.flexbox-carousel
{
      scroll-behavior: auto;
}
}
@supports not (aspect-ratio: 1/1) 
{
.content-section-flexbox      
.flexbox-background
{
      padding-block-end: 0 !important;
}
.content-section-flexbox
image
{
      position: relative !important;
}
}
@supports not (aspect-ratio: 1/1) 
{
.content-section-flexbox      
.flexbox-background
{
      height: 100%;
      padding-block-end: calc(100% * (1 / 1));
}
.content-section-flexbox
.flexbox-rounded 
.flexbox-background
{
      padding-block-end: calc(100% * (1 / 1));
}
.content-section-flexbox
.flexbox-square
.flexbox-background
{
      padding-block-end: calc(100% * (3 / 4));
}
.content-section-flexbox
.flexbox-portrait
.flexbox-background
{
      padding-block-end: calc(100% * (4 / 3));
}
.content-section-flexbox
.flexbox-wide 
.flexbox-background
{
      padding-block-end: calc(100% * (9 / 16));
}
}
@media (min-width: 769px) and (max-width: 1260px)
{
.content-section-flexbox
.flexbox-box
{          
      height: 60vh;            
}
.content-section-flexbox
.flexbox-item
{
      width: 80%; 
      height: 60vh;
}
.content-section-flexbox
.flexbox-background
{     
      width: 100%;
      height: 60vh;            
}      
}




@media screen and (max-width: 768px)
{
.content-section-flexbase
{
      width: 100%;
      height: auto;      
}
.content-section-flexbase
.flexbase-container
{
      width: 100%;
      height: auto;            
}
.content-section-flexbase
.flexbase-box
{         
      width: 90%;
      height: auto;
      grid-template-columns: repeat(2, 1fr);
}
.content-section-flexbase
.flexbase-item
{                
      width: 100%;     
      height: auto;   
}
.content-section-flexbase
h6
{          
      font-size: 14px;                  
}
.content-section-flexbase
img
{
      width: 100px;       
      height: 100px;
}
}
@media (min-width: 768px) and (max-width: 1440px) 
{
.content-section-flexbase
.flexbase-box
{         
      width: 90%;
      height: auto;
      grid-template-columns: repeat(3, 1fr);
}      
}
@media (min-width: 1440px) and (max-width: 1900px) 
{
.content-section-flexbase
.flexbase-box
{         
      width: 90%;
      height: auto;
      grid-template-columns: repeat(6, 1fr);
}      
}



@media screen and (max-width: 750px)
{
.content-section-mapping
{
      width: 100%;
      height: auto;
}
.content-section-mapping
.mapping-container
{          
      width: 100%;
      height: auto;
}    
.content-section-mapping
.mapping-a
{      
      width: 100%;         
      height: 25vh;              
}
.content-section-mapping
.mapping-b
{      
      width: 100%;         
      height: auto;         
}
.content-section-mapping
.mapping-article
{
      width: 80%;
      height: auto;
      padding: 5% 10%; 
}
.content-section-mapping
h5
{      
      font-size: 45px;   
      padding: 10px 10px;     
}
.content-section-mapping
h6
{     
      font-size: 15px;      
      padding: 5px 10px;      
}
.content-section-mapping
.mapping-box
{
      width: 95%;
      height: auto;
      margin: 0 auto;    
}
.content-section-mapping
.box-a
{
      width: 100%;
      height: auto;      
}
.content-section-mapping
.box-b
{
      width: 100%;
      height: auto;      
}
.content-section-mapping
.box-c
{
      width: 100%;
      height: auto;      
}
.content-section-mapping
.mapping-box > * 
{      
      padding: 5px;     
      width: calc(150% / 1);
}
.content-section-mapping
img
{
      width: 100%;
      height: 60%;
}
.content-section-mapping
.box-a
img
{
      margin-top: 40%;    
}
.content-section-mapping
.box-b
img
{
      margin-top: 50%;
}
.content-section-mapping
.box-c
img
{
      margin-top: 40%;
}
}
@media only screen and (min-width: 750px) and (max-width: 1000px)
{
.content-section-mapping
{
      width: 100%;
      height: auto;
}
.content-section-mapping
.mapping-container
{          
      width: 100%;
      height: auto;
}    
.content-section-mapping
.mapping-a
{      
      width: 100%;         
      height: 20vh;              
}
.content-section-mapping
.mapping-b
{      
      width: 100%;         
      height: auto;         
}
.content-section-mapping
.mapping-article
{
      width: 60%;
      height: auto;
      padding: 2% 8%; 
}
.content-section-mapping
h5
{      
      font-size: 45px;   
      padding: 10px 10px;     
}
.content-section-mapping
h6
{     
      font-size: 15px;      
      padding: 5px 10px;      
}
.content-section-mapping
.mapping-box
{
      width: 95%;
      height: auto;
      margin: 0 auto;    
}
.content-section-mapping
.box-a
{
      width: 100%;
      height: auto;      
}
.content-section-mapping
.box-b
{
      width: 100%;
      height: auto;      
}
.content-section-mapping
.box-c
{
      width: 100%;
      height: auto;      
}
.content-section-mapping
.mapping-box > * 
{      
      padding: 5px;     
      width: calc(150% / 1);
}
.content-section-mapping
img
{
      width: 100%;
      height: 60%;
}
.content-section-mapping
.box-a
img
{
      margin-top: 40%;    
}
.content-section-mapping
.box-b
img
{
      margin-top: 50%;
}
.content-section-mapping
.box-c
img
{
      margin-top: 40%;
}    
}
@media only screen and (min-width: 1000px) and (max-width: 1500px)
{
.content-section-mapping
.mapping-article
{
      width: 100%;            
}   
.content-section-mapping
h5
{      
      font-size: 60px;
      padding: 15px 5px;           
}       
}



@media screen and (max-width: 767px) 
{
.content-section-tier
{
      width: 100%;
      height: auto;   
      margin-top: 10px;
}    
.content-section-tier
.tier-container
{      
      width: 100%;
      height: auto;
      display: inline;
}    
.content-section-tier
.tier-a
{
      width: 100%;
      height: auto;
}
.content-section-tier
.tier-article
{      
      width: 80%;        
      float: none;
      height: auto;      
      padding: 20px;
      margin-left: 5%;
}
.content-section-tier
h4
{         
      font-size: 25px;
      margin-top: 10px;      
}
.content-section-tier
.tier-article
p
{          
      padding: 5px 0;
      font-size: 14px;            
}
.content-section-tier
.tier-b
{
      width: 100%;
      height: auto;
}  
.content-section-tier
img
{
      width: 100%;
      height: auto;            
}
.content-section-tier
.tier-c
{
      width: 100%;
      height: auto;
}  
.content-section-tier
.tier-conext
{
      top: 25%;
      width: 80%;                  
      height: auto;
      padding: 20px;
      margin-left: 5%;
}
}
@media (min-width: 766px) and (max-width: 1200px) 
{
.content-section-tier
{
      width: 100%;
      height: auto;
      margin-top: 20px;
}    
.content-section-tier
h3
{      
      font-size: 50px;            
      padding-bottom: 30px;                
}
.content-section-tier
h3
span
{
      font-size: 40px;      
}
.content-section-tier
.tier-container
{      
      width: 100%;
      height: 35vh;      
}     
.content-section-tier
.tier-a
{                 
      height: auto;                             
}    
.content-section-tier
.tier-article
{
      top: 5%;
      width: 80%;                 
}    
.content-section-tier
h4
{          
      font-size: 15px;      
}    
.content-section-tier
.tier-article
p
{                 
      font-size: 13px;      
}
.content-section-tier
.tier-b
{                 
      height: auto;                             
}    
.content-section-tier
img
{
      width: 90%;
      height: auto;            
}
.content-section-tier
.tier-heading
{        
      top: 25%;            
      width: 50%;
      font-size: 20px;            
      text-align: center;
}
.content-section-tier
.tier-c
{                 
      height: auto;                             
}    
.content-section-tier
.tier-conext
{
      top: 5%;
      width: 80%;                 
}
.content-section-tier
.tier-conext
p
{                 
      font-size: 13px;      
}
}
@media (min-width: 1200px) and (max-width: 1900px) 
{
.content-section-tier
{
      width: 100%;
      height: auto;
}    
.content-section-tier
.tier-container
{      
      width: 100%;
      height: auto;      
}    
.content-section-tier
.tier-a
{                 
      height: auto;                             
}    
.content-section-tier
h4
{          
      font-size: 30px;      
}    
.content-section-tier
.tier-b
{                 
      height: auto;                             
}    
.content-section-tier
.tier-background
{
      width: 100%;
      height: auto;
      margin: 0 auto;
}
.content-section-tier
img
{
      width: 80%;
      height: auto;            
}
.content-section-tier
.tier-heading
{        
      top: 40%;      
      left: none;
      width: 60%;
      text-align: center;                       
}
.content-section-tier
.tier-c
{                 
      height: auto;                             
}    
}



@media screen and (max-width: 768px) 
{
.content-section-flexcontainer
.flexcontainer-container
{
      width: 95%;            
      height: auto;
}
.content-section-flexcontainer
.flexcontainer-box
{      
      display: block;            
}
.content-section-flexcontainer
.flexcontainer-a
{
      width: 100%;
      height: auto;
}
.content-section-flexcontainer
.flexcontainer-b
{
      width: 100%;
      height: auto;
}
.content-section-flexcontainer
img 
{
      width: 100%;
      height: 60vh;             
}
}



@media screen and (max-width: 1000px)
{
.content-section-modal
{
      width: 100%;
      height: auto;      
      margin-top: 20px;
}
.content-section-modal
.modal-container
{      
      width: 90%;          
      height: auto;                        
}
.content-section-modal
.modal-container
h4
{           
      font-size: 40px;            
}
.content-section-modal
.modal-container
p
{          
      font-size: 12px;      
}
.content-section-modal
button
{	  	
	  width: 60%;	
      margin: 10px;      	
      padding: 15px;
}
.content-section-modal
.modal-article
{
      height: 10vh;            
      max-width: 95%;           
}
.content-section-modal
.modal-article
h5
{          
      font-size: 12px;      
}
.content-section-modal
.modal-article
h6
{                       
      font-size: 12px;            
}
.content-section-modal
.modal-article
hr
{
      margin: 10px 0;
}   
.content-section-modal
.modal-article
span
{           
      font-size: 10px;            
}  
.content-section-modal
.modal-box 
{          
      width: 100%;
      height: auto;            
}
.content-section-modal
.modal-context
{          
      width: 100%;
      height: 80vh;                  
} 
.content-section-modal
.modal-span 
{          
      font-size: 15px;           
      padding: 5px 10px;      
}
.content-section-modal
.modal-arrow
{     
      width: 25px;
      height: 25px;                      
}
.content-section-modal
.modal-body
{
      width: 100%;      
      height: auto;
      padding: 10px;      
}
.content-section-modal
.modal-info
{
      width: 100%;
      height: auto;            
}
.content-section-modal
.modal-box
h5
{          
      font-size: 15px; 
}
.content-section-modal
.modal-background
{
      width: 200px;   
      height: auto;             
      display: block;   
      margin: 0 auto;
      margin-top: 20px;                  
}
.content-section-modal
.modal-background
img 
{
      width: 100%;           
      height: auto;            
}
.content-section-modal
.modal-box
h6
{                      
      font-size: 12px;      
      margin-top: 10px;      
      padding: 2px 10px;      
}
.content-section-modal
.modal-box
p
{      
      width: 90%;
      margin: 0 auto;
      font-size: 12px;      
      line-height: 1.8;      
}
.content-section-modal
.modal-thumbnails
{      
      width: 90%;            
      height: auto;
      margin: 0 auto;
      display: block;  
      margin-top: 10px;          
}
.content-section-modal
.modal-thumbnails
img 
{
      width: 100%;
      margin: 5px;
      height: auto;                    
}
}
@media (min-width: 1200px) and (max-width: 1900px) 
{
.content-section-modal
{
      width: 100%;
      height: auto;
      margin-top: 100px;       
}    
.content-section-modal
.modal-container
{
      width: 100%;
      height: 25vh; 
}      
}


@media screen and (max-width: 768px)
{
.content-section-accordion
{
      width: 100%;
      height: auto;      
}
.content-section-accordion
.accordion-container
{
      width: 95%;
      height: auto;            
}
.content-section-accordion
h5 
{      
      font-size: 12px;      
}
.content-section-accordion
.accordion-list
{     
      padding: 5px 5px;      
}
.content-section-accordion
a 
{      
      font-size: 15px;  
      text-indent: 10px; 
}
.content-section-accordion 
a:after 
{
      
      width: 8px;      
      height: 8px;                        
}
.content-section-accordion
p 
{          
      width: 100%;
      font-size: 12px;
      padding: 5px 10px 10px;
}
}
@media (min-width: 768px) and (max-width: 1440px)
{
.content-section-accordion
.accordion-container
{
      width: 90%;
      height: 80vh;            
}   
.content-section-accordion
p 
{                            
      font-size: 13px;            
}   
}
@media (min-width: 1440px) and (max-width: 1900px)
{
.content-section-accordion
.accordion-container
{
      width: 95%;
      height: 60vh;            
}      
}



@media screen and (max-width: 760px)
{
.content-section-testimonial
{
      width: 100%;      
      height: auto;      
}
.content-section-testimonial
.testimonial-container
{
      width: 100%;
      height: auto;
}
.content-section-testimonial
h5 
{          
      font-size: 12px;         
      padding-top: 10px;          
}
.content-section-testimonial
.testimonial-box
{
      width: 100%;
      height: auto;
      margin: 0 auto;     
      margin-top: 10px;     
}
.content-section-testimonial
.testimonial-avatar
{
      padding: 15px 0;
}
.content-section-testimonial
img 
{
      width: 50px;
      height: 50px;              
}
.content-section-testimonial img:hover, 
.content-section-testimonial img.active 
{      
      width: 62px;
      height: 62px;      
}
.content-section-testimonial
.testimonial-article
{
      width: 60%;      
      height: 25vh;
      margin: 0 auto;
      padding: 10px 0;    
      text-align: justify;        
}
.content-section-testimonial
h6
{                
      padding: 10px 0;
      font-size: 12px;          
}
.content-section-testimonial
p 
{      
      padding: 5px 0;
      font-size: 14px;            
}
}
@media (min-width: 760px) and (max-width: 1900px)
{
.content-section-testimonial
h5 
{          
      padding-top: 40px;      
}    
.content-section-testimonial
.testimonial-article
{
      width: 80%;            
}      
}



@media screen and (max-width: 1000px) 
{
.content-section-brochure
{
      width: 100%;
      height: auto;      
}
.content-section-brochure
.brochure-container
{
      width: 100%;
      height: auto;            
}
.content-section-brochure
.brochure-background
{          
      height: auto;      
}
.content-section-brochure
img
{
      width: 180px;
      height: auto;        
}
.content-section-brochure
.brochure-article
{
      width: 100%;
      height: 10vh;     
}
.content-section-brochure
h5
{     
      padding-top: 0; 
      font-size: 15px;                  
}
.content-section-brochure
p
{      
      font-size: 12px;            
}
.content-section-brochure
.brochure-button
{
      width: 100%;
      height: 15vh;      
}
.content-section-brochure
li
{	  	      	  
      margin: 5px;
	  width: 100px;
	  height: 50px;	        
}
.content-section-brochure
.button-path
{	  
	  padding: 5px;   	          
	  font-size: 12px;	    	    
}
.content-section-brochure
i
{	  	        
      font-size: 10px;  	  	          
}
}
@media (min-width: 1000px) and (max-width: 1900px)
{
.content-section-brochure
.brochure-container
{
      width: 100%;
      height: 40vh;
      display: flex;
      align-items: center;
      justify-content: center;
      background-color: #f3f1ee;
}      
}


@media screen and (max-width: 1200px)
{
.content-section-banner
{
      width: 100%; 
      height: auto;      
}
.content-section-banner
.banner-container
{      
      width: 100%;           
      height: 35vh;      
}
.content-section-banner
.banner-article
{	  	  
	  width: 95%;
      height: auto;                          
      display: block;
}
.content-section-banner
.article-a
{          
      font-size: 14px;      
}
.content-section-banner
.article-b
{      
      font-size: 14px;      
}
.content-section-banner
img 
{
      width: 100%;
      height: 30vh;
      margin-top: 10px;
      object-fit: cover;      
} 
.content-section-banner
h6
{           
      padding: 10px;
      font-size: 15px;      
}
}
@media (min-width: 1200px) and (max-width: 1560px)
{
.content-section-banner
.banner-container
{      
      width: 100%;           
      height: 55vh;      
} 
.content-section-banner
.banner-article
{	  	  
	  width: 18%;      
}
.content-section-banner
.article-a
{          
      font-size: 18px;      
}
.content-section-banner
.article-b
{      
      font-size: 18px;      
}
.content-section-banner
img 
{
      width: 100%;
      max-width: 100%;
      max-height: 80vh;               
}     
}
@media (min-width: 1560px) and (max-width: 1900px)
{
.content-section-banner
.banner-container
{      
      width: 100%;           
      height: 65vh;      
} 
.content-section-banner
img 
{
      width: 100%;
      max-width: 100%;
      max-height: 80vh;                
}     
}