/* CSS Document */

@font-face {font-family:'Erass'; src: url(../fonts/ERASMD.TTF);}
@font-face {font-family:'Poppins'; src: url(../fonts/Poppins-Light.TTF);}
@font-face {font-family:'WorkSans'; src: url(../fonts/WorkSans-Light.TTF);}
@font-face {font-family:'Lobster'; src: url(../fonts/Lobster-Regular.ttf);}
@font-face {font-family:'Codec'; src: url(../fonts/Codec-Warm-Bold.ttf);}

h1{ font-size:34px; line-height:40px; float:none; text-align:none;}
h2{  font-family:'WorkSans'; font-size:22px; line-height:28px; }

 

#maincontainer{width:100%;  height:auto; margin:0px auto; padding:0px auto; overflow:hidden; display:block;}

#home_title_separator{width:100%; height:80px; margin:0px auto; padding:0px auto; float:left;  }

#homepage_topframe{width:100%; height:auto;  float:left;}
#top_left_title{width:39.5%; height:auto; float:left;   xbackground-color:#066; padding-left:1.5%; margin-bottom:20px;}
#top_left_title_top{width:100%; height:auto; float:left;  xbackground-color:linen;}
#top_left_title_bottom{width:90%; height:auto; float:left;  xbackground-color:lime;}


 

#top_right_content{width:96%; max-width:1400px; margin:0px auto; padding:0px auto; float:none;
  height:auto; max-height:626px;} 
#top_right_content_inner{width:100%; max-width:770px; height:auto; margin:0px auto; padding:0px auto;    xbackground:url(../images/fluid_1.jpg) right 0px top 80px no-repeat, url(../images/fluid_2.jpg) left 0px bottom 90px no-repeat}




#top_left_content{width:41%; xheight:373px; height:auto; float:left;  xbackground-color:blue;}


#top_left_inner{width:96%; height:auto; margin:0px auto; padding:0px auto;   font-family:'Poppins';   font-size:18px; font-weight:300; padding-left:4%;}

#top_button_holder{width:250px; height:120px; margin:0px auto; padding:0px auto; xbackground-color:#096;}
#top_button{width:180px; height:50px; margin:0px auto; padding:0px auto;  background-color:#09F; font-family:Arial, Helvetica, sans-serif; font-size:18px; font-weight:700; color:#FFF; line-height:48px; text-align:center;}
#button_bottom_frame{width:90px; height:auto; margin:0px auto; padding:0px auto;  xbackground-color:#FC0; text-align:center; font-family:'Lobster'; font-size:26px; color:#F60; margin-top:8px;}


.container_title{width:84%;   height:30px; margin:0px auto; padding:0px auto;  font-family:'Erass';  font-size:18px; font-weight:300;}
.title_left{width:auto; height:30px; float:left;  xbackground-color:pink;}
.title_right{width:auto; height:30px; float:right; text-align:right;  xbackground-color:lightpink;}
.image_container_frame{display:block; width:84%;   margin:0px auto; padding:0px auto;  padding-bottom:30px; object-fit:contain;}
.image_container_frame_3{display:block; width:84%; margin:0px auto; padding:0px auto; padding-bottom:80px;}


#homepage_midframe{width:100%; height:auto; margin:0px auto; padding:0px auto; float:left; margin-top:40px;}

#midframe_title{width:450px; height:60px; float:right;}



#midframe_left{width:58%;  xheight:433px;  height:auto; margin-top:12px; float:left;  Xbackground:url(../images/fluid_1.jpg) right 0px bottom 60px no-repeat, url(../images/fluid_2.jpg) left 0px bottom 170px no-repeat;}
#midframe_left_inner{width:100%; max-width:770px; height:auto;  margin:0px auto;  padding:0px auto;   background-color:orange; xfloat:left;      background:url(../images/fluid_4.jpg) right 0px top 20% no-repeat, url(../images/fluid_5.jpg) left 0px bottom 90px no-repeat}




#midframe_right{width:39%; height:auto; float:right; xbackground-color:#3F6; }

#midframe_inner{width:100%; height:auto; margin:0px auto; padding:0px auto; padding-bottom:50px;  font-family:'Poppins';   font-size:18px; font-weight:300; xbackground-color:#F90; }


#homepage_bottomframe{width:100%; height:auto; margin:0px auto; padding:0px auto; float:left; xbackground-color:yellow; margin-top:40px;}
#bottomframe_title{width:450px; height:60px; float:left; xbackground-color:orange; text-align:center;}
#bottomframe_left{width:41%; xheight:433px; height:auto; float:left;  xbackground-color:lawngreen;  } 
#bottomframe_inner{font-family:'Poppins';   font-size:18px; font-weight:300; padding-bottom:50px; xbackground-color:aqua;}
#bottomframe_right{width:58%; height:auto; float:right; xbackground-color:blue;  xbackground-color:orange;  }
#bottomframe_right_inner{width:100%; max-width:770px; height:auto; margin:0px auto; padding:0px auto;    background:url(../images/fluid_6.jpg) right 0px top 60px no-repeat, url(../images/fluid_3.jpg) left 0px bottom 90px no-repeat }


#aboutus_text_frame{width:92%; height:auto;     xbackground-color:lawngreen; font-family:'Poppins';   font-size:18px; font-weight:300; color:#222; line-height:34px; margin:0px auto; padding:0px auto;}
 




#text_content_frame{width:86%; max-width:1400px; height:auto; margin:0px auto; padding:0px auto;   xbackground-color:#900; font-family:'Codec'; font-size:40px; font-weight:300; color:#06C; line-height:52px; padding-top:80px; padding-bottom:14px;  }
#text_description_frame{width:90%; max-width:1400px; height:1800px; margin:0px auto; padding:0px auto; xbackground-color:palegreen;}
#text_description_inner{width:100%; height:500px; float:left;  background-color:lime;}


#text_description_inner_left{width:52%; height:500px; float:left;  font-family:Arial, Helvetica, sans-serif; font-size:18px; font-weight:300; line-height:28px; color:#666;}
#text_description_inner_left_top{width:90%; height:auto; float:left; xbackground-color:#9F0; padding-right:10%}
.home_page_uploader_btn_frame{width:100%; height:40px; float:left; xbackground-color:#996; margin-top:80px;}
.home_page_upload_btn{width:220px; height:40px; margin:0px auto; padding:0px auto; background-color:#09F; text-align:center; font-family:Arial, Helvetica, sans-serif; font-size:20px; font-weight:700; color:#FFF; line-height:38px;}

#text_description_inner_right{width:48%; height:500px; float:left;}


#text_description_inner_mid{width:100%; height:500px; float:left; xbackground-color:#F9C;}
#text_description_inner_mid_left{width:48%; height:500px; float:left;   background-color:white;}
#text_description_inner_mid_right{width:45%; height:500px; float:left;   xbackground-color:pink; font-family:Arial, Helvetica, sans-serif; font-size:24px; font-weight:300; line-height:34px; color:#666;  padding-left:7%}
#text_description_inner_mid_right_title{width:100%; height:auto; xbackground-color:#999; float:right; font-size:30px; padding-bottom:20px;}
#text_description_inner_mid_right_content{width:100%; height:auto; xbackground-color:#CCC; float:right; font-size:18px; line-height:28px;}


#text_description_inner_mid_lower{width:100%; height:500px; float:left;  xbackground-color:#9CF;}
#text_description_inner_mid_lower_left{width:45%; height:500px; float:left;   sbackground-color:pink; font-family:Arial, Helvetica, sans-serif; font-size:24px; font-weight:300; line-height:34px; color:#666; x padding-left:7%}
#text_description_inner_mid_lower_left_title{width:100%; height:auto;  xbackground-color:#F90; float:left;  font-size:30px; padding-bottom:20px;}
#text_description_inner_mid_lower_left_content{width:100%; height:auto; xbackground-color:#CCC; float:left; font-size:18px; line-height:28px;}
#text_description_inner_mid_lower_right{width:48%; height:500px; float:right;   xbackground-color:violet;}





#text_description_inner_bottom{}


#pagenavigator{width:auto; height:60px; float:right;}


#header_outer{width:100%; height:60px; margin:0px auto; padding:0px auto; float:center;  background-color:#333; }
#header_frame{width:96%; max-width:1400px; height:60px; margin:0px auto; padding:0px auto;  background-color:#333;}
#titleholder{width:auto; height:58px; float:left; font-family:'Palatino Linotype', 'Book Antiqua', Palatino, serif; font-size:46px; color:#999;  xbackground-color:#333;  margin-top:0px;}



 

 
#home_page_frame{width:90%; height:auto; background-color:lime; margin:0px auto; padding:0px auto; }



/*  ################################################################################################  */
  
#textcontentframe_outer{width:96%; height:auto; margin:0px auto; padding:0px auto; margin-top:20px;}
#textcontentframe{width:100%; max-width:1400px; height:auto; margin:0px auto; padding:0px auto;}


#topcontentframe{width:100%; height:auto;  margin:0px auto; padding:0px auto; overflow:hidden; margin-top:90px; }
#topcontenttitle{width:100%; height:auto;     float:left; font-family:'Codec'; font-size:40px; padding-bottom:20px;}
#topcontenttitle_inner{width:46%; height:auto; }
#topcontentleft{width:50%; height:auto; float:left; }
#topcontentleft_inner{width:88%; height:auto; float:left;  font-family:Arial, Helvetica, sans-serif; font-size:18px; font-weight:300; line-height:28px; color:#666; padding-right:12%;}
#topcontentright{width:50%; height:auto; float:right; }



.mid_separator{width:100%; height:110px; xfloat:left; margin:0px auto; padding:0px auto;}


#midcontentframe{width:100%; height:auto; margin:0px auto; padding:0px auto; overflow:hidden;}
#midcontenttitle{width:90%; height:auto; float:right; font-family:Arial, Helvetica, sans-serif; font-size:32px; font-weight:300; padding-left:10%;}
#midcontentleft{width:50%;  xheight:400px;  height:auto; float:left;}
#midcontentright{width:50%; height:400px; float:right;}
#midcontentrighttexture{width:90%; height:auto; float:left;   font-size:18px; font-weight:300; line-height:28px; color:#666; padding-left:10%; padding-top:5%;}


#bottomcontentframe{width:100%; height:auto; margin:0px auto; padding:0px auto; overflow:hidden;}
#bottomcontentleft{width:45%; height:auto; float:left;  padding-right:5%;}
#bottomcontentright{width:50%; height:400px; float:right;}
#bottomcontenttitle{width:100%; height:auto; float:left; font-family:Arial, Helvetica, sans-serif; font-size:32px; font-weight:300;}
#bottomcontentlefttexture{width:100%; height:auto; float:left;  font-size:18px; font-weight:300; line-height:28px; color:#666; padding-top:5%;}
 


/*  ################################################################################################  */





@media screen and (max-width: 1260px) {
#top_right_content{ height:auto;}
#top_left_inner{font-family:'Poppins';  font-size:14px;}
#midframe_inner{font-family:'Poppins';  font-size:14px;}
#bottomframe_inner{width:95%; padding-left:4%; font-family:'Poppins';  font-size:14px;}

#text_content_frame{width:86%;  height:auto; margin:0px auto; padding:0px auto;  background-color:#fff; font-size:38px; line-height:48px; padding-top:30px; padding-bottom:28px;}



/* ###################################################################################################### */

}

@media screen and (max-width: 1114px) {

 
	
h1{ font-size:32px; line-height:30px;}

p{font-family:'Poppins'; font-size:18px;}	
#home_title_separator{ height:40px;}
#homepage_topframe{ height:auto;  }
#top_left_title{width:100%; text-align:center; float:left; padding-left:0px;}
#top_right_content{width:100%; height:auto; margin:0px auto; padding:0px auto; }
 
#top_left_title_top{ height:auto;  text-align:center; }
#top_left_title_bottom{width:100%;}
#top_left_content{width:100%;  height:auto;   float:left;   Xbackground-color:green;}
#top_left_inner{width:84%; max-width:650px; margin:0px auto; padding:0px auto;   font-size:18px;}
.image_container_frame{ max-width:650px; width:84%;  padding-bottom:30px;}
 
.image_container_frame_3{max-width:650px; display:block; width:84%; margin:0px auto; padding:0px auto; padding-bottom:80px;}

.container_title{max-width:650px;}

#midframe_left{width:100%;  height:auto;   float:left;   xbackground-color:lime; xmargin-bottom:10px; }
#midframe_inner{font-size:18px;}
#midframe_title{width:100%; height:auto; text-align:center; float:left;}
#midframe_right{width:100%;  height:auto;   float:left;   xbackground-color:blue;}
#midframe_inner{width:84%; max-width:650px; margin:0px auto; padding:0px auto;}

#bottomframe_title{width:100%; text-align:center;}
#bottomframe_left{ width:100%; float:left;}
#bottomframe_right{width:100%;   max-width:820px; height:auto; xmargin-left:calc((100% - 90%)/2);   xmargin:0px auto; xpadding:0px auto; float:left;}
#xbottomframe_right_inner{width:100%; max-width:770px; height:auto; margin:0px auto; padding:0px auto;    background:url(../images/fluid_1.jpg) right 0px bottom 180px no-repeat, url(../images/fluid_3.jpg) left 0px bottom 90px no-repeat }
#bottomframe_inner{width:84%; max-width:650px; margin:0px auto; padding:0px auto; font-size:18px;}






#header_outer{height:auto; }
#header_frame{height:49px;}
#titleholder{ height:auto; font-size:36px;}






#text_content_frame{max-width:660px; width:90%; height:340px; margin:0px auto; padding:0px auto;    font-size:28px; line-height:36px; padding-top:14px;}


#text_description_inner{max-width:660px; margin:0px auto; padding:0px auto; float:none;  height:400px;}
#text_description_inner_left{ width:100%; margin:0px auto; padding:0px auto;}
#text_description_inner_right{width:100%; height:0px; margin:0px auto; padding:0px auto;   visibility:hidden; margin-top:0px; background-color:#9C0;}
#topcomparison{visibility:hidden;}



#text_description_inner_mid{max-width:660px; width:100%; height:600px; margin:0px auto; padding:0px auto; float:none;}

#text_description_inner_mid_left{width:100%; height:auto; margin:0px auto; padding:0px auto; margin-top:0px;}
#midcomparison{width:100%; object-fit:cover;}



.home_page_uploader_btn_frame{ margin-top:40px;}


/*  ################################################################################################  */
  

#textcontentframe_outer{width:100%;}
#textcontentframe{width:100%; max-width:652px;}
#pagenavigator{ visibility:hidden; height:0px;}
 
 
 
 
 /*  ################################################################################################  */
  
 

#topcontenttitle_inner{width:100%; font-size:27px; padding-bottom:20px;  }
#topcontentleft{ width:100%; float:right;}
#topcontentleft_inner{}
#topcontentright{width:100%; height:0px; float:left; visibility:hidden;}
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
/*  ################################################################################################  */

#topcontentframe{}
#topcontenttitle{}
#topcontenttitle_inner{}
#topcontentleft{}
#topcontentleft_inner{}
#topcontentright{}



.mid_separator{}


#midcontentframe{ height:auto;}
#midcontenttitle{width:100%; float:left; margin-top:16px; padding-left:0%;}
#midcontentleft{width:100%;}
#midcontentright{width:100%; height:auto;}
#midcontentrighttexture{width:100%; padding-left:0%;}


#bottomcontentframe{}
#bottomcontentleft{width:100%; float:right; padding-right:0%;}
#bottomcontentright{width:100%; height:auto; float:left; }
#bottomcontenttitle{ margin-top:16px;  }
#bottomcontentlefttexture{}
 

/*  ################################################################################################  */















#pagenavigator{ visibility:hidden;}

.mobile-nav-button {
  position: absolute;
  margin: 2rem;
  right: 0;
  xtop: 0;
  margin-top:15px;
  z-index: 9999;
  cursor: pointer;
  width: 25px;
  height: 20px;
 
}
.mobile-nav-button .mobile-nav-button__line {
  width: 100%;
  height: 2px;
  background: #0e0e0e;
  position: relative;
  transition: 1s ease;
  background-color:#999;
 
 }
 
 
 
 
 
 
 
 
 
 
.mobile-nav-button .mobile-nav-button__line:nth-of-type(2) {
  margin: 0.4rem 0;
 }











.mobile-nav-button .mobile-nav-button__line--1 {
  transform: rotate(45deg);
  top: 8px;
  position: absolute;
  }
.mobile-nav-button .mobile-nav-button__line--2 {
  display: none;
}
.mobile-nav-button .mobile-nav-button__line--3 {
  transform: rotate(135deg);
  top: 8px;
  position: absolute;
}

 .mobile-menu {
   visibility:hidden;
   display: block;
   max-width: 100%;
   width: 100%;
   right: -100%;
   height: 100vh;
   position: fixed;
   z-index: 888;
   transition: 0.6s ease;
   top: 0;
   opacity: 0;
  }


.mobile_menu_inner {
   visibility:visible;
   display: block;
   max-width: 100%;
   width: 100%;
   right: -100%;
   height: 100vh;
   z-index: 899;
   transition: 0.6s ease;
   top: 0;
   opacity:1;
   background-color:#fff;
   float:right;
   overflow:hidden;
   
}


.mobile_btn{
  width:52%; 
  height:50px; 
  float:left;	
  font-family:Arial, Helvetica, sans-serif;
  font-size:16px;
  font-weight:700;
  text-align:left;
  margin-left:5.4%;
  border-top:1px solid;
  border-top-color:#eee;
  line-height:52px;
  xpadding-left:10%;
  visibility:visible;
  display:block;
 }
.mobile_btn:hover{
	background-color:#f5f5f5;
}
.inner_mobile_btn{
  width:100%; 
  height:50px; 
  float:left;	
  font-family:Arial, Helvetica, sans-serif;
  font-size:16px;
  font-weight:700;
  text-align:left;
  margin-left:16%;
  margin-top:2px;
  border-top:1px solid;
  border-top-color:#eee;
  line-height:52px;
  visibility:visible;
  display:block;
  xbackground-color:red;
 }
.inner_mobile_btn:hover{
	background-color:#f5f5f5;
}

.target{width:100%; height:0px; float:right;   overflow:hidden;}


.mobile-menu ul {
  position: relative;
  top: 50%;
  transform: translateY(-50%);
  padding: 0;
}
.mobile-menu ul li {
  list-style: none;
}
.mobile-menu ul li a {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  display: block;
  text-align: center;
  text-decoration: none;
  color: #0e0e0e;
  font-size: 3rem;
  font-weight: bold;
  overflow: hidden;
  position: relative;
  
}
.mobile-menu ul li a:after {
  content: "";
  background: #0e0e0e;
  width: 100%;
  height: 100%;
  position: absolute;
  right: -100%;
  top: 0;
  z-index: -1;
  transition: 0.4s ease;
  }
.mobile-menu ul li a:hover {
  color: #fff;
}
.mobile-menu ul li a:hover:after {
  right: 0;
}
.mobile-menu img {
  position: absolute;
  width: 150px;
  display: block;
  left: 50%;
  top: 3rem;
  transform: translatex(-50%);
  padding: 0;
  text-align: center;
}

.mobile-menu--open {
  right: 0;
  opacity: 1;
}
.mobile_menu_inner--open {
  right: 0;
  opacity: 1;
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          
}


#blog_categories_inner{ font-size:14px;}
h1{ font-size:36px;}
h2{ font-size:28px; line-height:36px;}





}




@media screen and (max-width: 844px) {
	
#top_right_content{ xbackground-color:#FF0; }
#imagecontainer{ }
}