/* Template features */

/* Back to Top Button */
#topcontrol {z-index: 1000 !important;}	


/* hide element  */
.hide{ display: none;	visibility: hidden; }  


/* option available  for the TOP toolbar  */
.fixed{ position: fixed !important;	margin: auto !important; display: block !important;	}  


/*  ------ RESPONSIVE A-B-C-boxes CSS - EXTEND COTNENT AT 700PX AND 1200PX ------ */
@media screen and (max-width: 1200px) {
.extend{
margin-right: auto !important;
margin-left: auto !important;
padding-left: 5% !important;
padding-right: 5% !important;
width: 90% !important;
clear: none !important;
overflow:auto !important;
margin:0 !important;
left:0 !important;
right:0! important;
overflow:visible !important;
 }
}

@media screen and (max-width: 700px) {
.extend{
padding-top: 20px !important;
padding-bottom: 5px !important; 
 }
}

@media screen and (max-width: 650px) {
.extend2{
margin-right: auto !important;
margin-left: auto !important;
padding-left: 5% !important;
padding-right: 5% !important;
width: 90% !important;
clear: none !important;
overflow:auto !important;
margin:0 !important;
left:0 !important;
right:0! important;
overflow:visible !important;
 }
}

/*  A-B-C- Font reduction at 650px only */
@media screen and (max-width: 650px) {
.font_reduction {
font-size: 86% !important;
line-height: 1.2em !important;
 }
}
/*  ------ END RESPONSIVE A-B-C-boxes  ------ */

 /* ------   RESPONSIVE CSS - SHOW-HIDE ELEMENTS AT 650PX ------  */
 /* Important note: in the project the responsive menu is hidden by default. you can see the menu only at 650PX, also in the HYPE preview in your monitor  */
@media screen and (max-width: 650px) {
.toolbar_hide_at { display: none !important;  visibility: hidden  !important;}
.toolbar_show_at { display: block !important; visibility: visible !important;}}
 /* ------  END RESPONSIVE CSS - SHOW-HIDE ELEMENTS AT 650PX ------  */


/*  POPUP PANELS - responsive behavior in iPad Portrait - vertical and horizontal */
@media screen and (max-width: 768px) {  /* width detection only */
.box_fit {
height:auto !important;
overflow:auto !important;
width:auto !important;
margin-left:13px !important;
margin-right:13px !important; 
margin-top:0 !important; 
margin-bottom:13px !important;
left:0 !important;
right:0 !important;
 }
}
@media screen and (max-height: 768px) {  /* height detection only */
.box_fit {
height:auto !important;
overflow:auto !important;
width:auto !important;
margin-left:13px !important;
margin-right:13px !important; 
margin-top:0 !important; 
margin-bottom:13px !important;
left:0 !important;
right:0 !important;
 }
}
@media screen and (max-width: 768px) {  /* width detection only */
.box_fit_content {
position: absolute !important;
overflow:auto !important;
float: left !important;
margin:0 !important;
padding:0 !important;
left:0 !important;
right:0! important;
top:0 !important;
bottom:0 !important;
height:100% !important;
width:100% !important;
 }
}
@media screen and (max-height: 768px) {  /* height detection only */
.box_fit_content {
position: absolute !important;
overflow:auto !important;
float: left !important;
margin:0 !important;
padding:0 !important;
left:0 !important;
right:0! important;
top:0 !important;
bottom:0 !important;
height:100% !important;
width:100% !important;
 }
} 
/* END  POPUP PANELS  */


/*  --------------------- ARCHIVE CSS */

/*  Footer Fixed at the bottom of th page   */
/*.footer_fixed {
	display: block !important;
	position: absolute !important;
	bottom: 0 !important;
	margin-right: auto !important;
	margin-left: auto !important;	
	clear: none !important;
	margin-bottom: 0 !important;
}*/


/*  RESPONSIVE CSS - LOGO with absolute position  */
/*.logo_responsive {	  
	padding: 0 !important;
	display: block !important;
	position: absolute !important;
	left: 25px !important;
	right: 0 !important;	
}*/

/*body {	position:relative !important;	display: block !important;	overflow: auto !important;}*/

/*.max{	max-width:1200px !important;	width: auto !important;	overflow: auto !important;}*/

/*.absolute{	position: absolute !important;	margin: auto !important;	display: block !important;}*/

/*
.box_fit_button_bottom {display: none !important;}	
@media screen and (max-width: 768px) {.box_fit_button_bottom { display: block !important; position: fixed !important; left: 48% !important; top: 90% !important; display:inline-block !important; z-index: 10000 !important; margin: 0!important; padding: 0 !important; } }
	
@media screen and (max-height: 600px){.box_fit_button_bottom { display: block !important; position: fixed !important; left: 48% !important; top: 90% !important; display:inline-block !important; z-index: 10000 !important; margin: 0!important; padding: 0 !important; } }
*/