/* CSSTerm.com Flyout CSS menu */
@media only screen and (min-width: 1025px){
	

#flyout_menu {
	font-weight: 600;
	width: 100%;
	float:right; }

#flyout_menu ul, li {
  list-style: none;
  margin: 0;
  padding: 0; 
}

#flyout_menu ul li.hover,
#flyout_menu ul li:hover { position: relative; z-index: 599; }

#flyout_menu ul ul{
	visibility: collapse;
	position: absolute;
	top: 100px;
	left: 0;
	z-index: 598;
}

#flyout_menu ul li:hover > ul { visibility: visible; }

#flyout_menu ul ul { top: 0px; left: 235px; }

#flyout_menu span, #flyout_menu a {
	display: inline-block;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1em;
	text-decoration: none; }

#flyout_menu li { background: #444444;border-bottom:2px solid #ffffff; }
#flyout_menu li:hover, #flyout_menu li.active { background: #000000; }

#flyout_menu a {
    color: #ffffff;
    line-height: 100%;
    padding: 16px 8px 16px 28px;
    width: 164px; }

#flyout_menu ul ul li {
	background: #444444;
	border-bottom: 1px solid #007171; }

#flyout_menu ul ul li:hover { background: #000000; }


/* -----------------------------
IN PAGE CSS NOT MENU 
------------------------------------*/
.gmenucol {float:left;width:25%;margin:75px 50px 0px 0px;}
.gmenucol768 {display:none}
.gmediacol {float:left;width:65%;}

/*----------------------------
FLY_OUT DISPLAY or SELECT MENU DISPLAY
------------------------------*/
#flyout_menu {}
#select_menu {display:none}


/*================================================
* #div for each thumbnail                                        
================================================== */ 
.imgbox {float:left;text-align:center;width:30%;min-width:197px;border:0px #e0e0e0 solid}

}

/* ================================

At MEDIA 769 to 1024
===================================*/
@media only screen and (min-width: 769px) and (max-width: 1024px){
	
#flyout_menu {
	font-weight: 600;
	
	float:right; }

#flyout_menu ul, li {
  list-style: none;
  margin: 0;
  padding: 0; 
}

#flyout_menu ul li.hover,
#flyout_menu ul li:hover { position: relative; z-index: 599; }

#flyout_menu ul ul{
	visibility: collapse;
	position: absolute;
	top: 100px;
	left: 0;
	z-index: 598;
}

#flyout_menu ul li:hover > ul { visibility: visible; }

#flyout_menu ul ul { top: 0px; left: 135px; }

#flyout_menu span, #flyout_menu a {
	display: inline-block;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	text-decoration: none; }

#flyout_menu li { background: #2c2f70; }
#flyout_menu li:hover, #flyout_menu li.active { background: #000000; }

#flyout_menu a {
    color: #ffffff;
    line-height: 100%;
    padding: 16px 8px 16px 28px;
    width: 164px; }

#flyout_menu ul ul li {
	background: #2c2f70;
	border-bottom: 1px solid #007171; }

#flyout_menu ul ul li:hover { background: #000000; }

/* -----------------------------
IN PAGE CSS NOT MENU 
------------------------------------*/
.gmenucol {float:left;width:25%;margin:75px 5px 0px 25px;border:0px solid red;}
.gmenucol768 {display:none}
.gmediacol {float:left;width:70%;border:0px solid lime}

/*----------------------------
FLY_OUT DISPLAY or SELECT MENU DISPLAY
------------------------------*/
#flyout_menu {}
#select_menu {display:none}

/*================================================
* #div for each thumbnail                                        
================================================== */ 
.imgbox {float:left;text-align:center;width:30%;min-width:145px;border:1px #e0e0e0 solid}

}

/* ================================

At MEDIA 601 to 768
===================================*/
@media only screen and (min-width: 601px) and (max-width: 768px){
	

/* -----------------------------
IN PAGE CSS NOT MENU 
------------------------------------*/
.gmenucol {}
.gmenucol768 {border:0px solid red}
.gmediacol {float:none;}

/*----------------------------
FLY_OUT DISPLAY or SELECT MENU DISPLAY
------------------------------*/
#flyout_menu {display:none}
#select_menu {}

/*================================================
* #div for each thumbnail                                        
================================================== */ 
.imgbox {float:left;text-align:center;width:30%;min-width:150px;border:1px #e0e0e0 solid}

}

/* ================================

At MEDIA 0 to 600
===================================*/
@media only screen and (min-width: 0px) and (max-width: 600px){
	

/* -----------------------------
IN PAGE CSS NOT MENU 
------------------------------------*/
.gmenucol {}
.gmenucol768 {border:0px solid blue}
.gmediacol {float:none;}

/*----------------------------
FLY_OUT DISPLAY or SELECT MENU DISPLAY
------------------------------*/
#flyout_menu {display:none}
#select_menu {}

/*----------------------------------
* #div for each thumbnail                                        
------------------------------------ */ 
.imgbox {text-align:center;width:90%;border:1px #e0e0e0 solid;margin:auto}

}
/* GALLERY */

/*================================================
* #div that wraps around each set thumbnails                                        
================================================== */ 
.TNwrap {
	margin: auto;
   border:0px #D0D5D2 solid ;
   padding:5px;
   
   }
   
   
/* SELECT MENU STYLES */
select{
    background:#ffffff;
    width: 100%;
    padding: 2px;
    font-family:Arial, Helvetica, sans-serif;
    font-size:1.5em;
    font-weight:200;
    color:#000000;
    /*line-height: 2.5;*/
    border: 0;
    border-radius: 0;
    height: 40px;
    -webkit-appearance: none;
	border: 1px #2c2f70 solid

    }



select > option {
   background: transparent; /* Or an hexadecimal value */
   
}
/*================================================
* IMAGE_COVER SAME SIZE THUMBNAILS
=================================================*/
.image-cover {object-fit: cover;
object-position: center;
height: 200px;
width: 200px;}