html{
    background-color: #171717;
}

:root {
  --topMenuBarHeight: 36px;
  --maxPageWidth: 960px;
  --pageFont: 'Roboto', sans-serif;
  --backgroundImage: url(https://www.phfx.com/phfx_backgrounds/phfx_grainBG_2022B.jpg) no-repeat left center fixed;
  --menuIconSize: 20px;
  --menuIconTopSpace: 2px;
  --pageContentTopSpacing: 42px;
  --menuBottomBorderColor: #FF0000;
  --mainHRColor: linear-gradient(to right, #541414, #541414, #541414);
  --menuLink: #e1e1e1;
  --menuLinkHover: #FFFF6B;
  --linkColor: #6bffff;
  --linkHoverColor: #FFFF6B;
  --chapterHighlightColor: #FFFF6B;
}

body {
	font-family: var(--pageFont);
	font-size: 16px; 
	font-weight: 300; 
	color: #e1e1e1;
	padding: 0px 0px 0px;
	text-align: left;
	background: #1a1a1a;
	background: var(--backgroundImage);
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	background-attachment: fixed;
    }
    
body:after{
    content:"";
    position:fixed; /* stretch a fixed position to the whole screen */
    top:0px;
    height:100vh; /* fix for mobile browser address bar appearing disappearing */
    left:0;
    right:0;
    z-index:-1; /* needed to keep in the background */
	background: #1a1a1a;
    background: var(--backgroundImage);
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}





#menuContainer {
    display: table;
    width: 100%;
}
#menuLeft {
    display: table-cell;
    width:256px;
}
#menuRight {
    display: table-cell;
	text-align:right;
}




/* phfx containers */




#galleryContentBox {
	position:relative;
	min-width:var(--maxPageWidth);
	border:0px;
	padding:0px;
	margin:0px;
	top:16px;
}

/* phfx menu */

#iconLocation {
    display: table-cell;
	text-align:right;
}

#contactLocation {

    
	!important;z-index:2001;

}

#equipmentLocation {

    
	!important;z-index:2001;

}

#instagramLocation {

      
	!important;z-index:2001;

}

#twitterLocation {

    
	!important;z-index:2001;

}

#youtubeLocation {

    
	!important;z-index:2001;

}

#vimeoLocation {

    
	!important;z-index:2001;
}

#loginLocation {

    
	!important;z-index:2001;

}

.thumbnailGhost img{
border: 0px solid transparent;
background-color: transparent;
opacity:0.6;filter:alpha(opacity=60);
    -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
    filter: grayscale(100%);
margin: 0px 0px 0px 0;
padding-left:4px;
padding-right:4px;

}

.thumbnailGhost:hover{
border: 0px solid transparent;
background-color: transparent;
opacity:1.0;filter:alpha(opacity=100);
    -webkit-filter: grayscale(0%); /* Safari 6.0 - 9.0 */
    filter: grayscale(0%);
}

.thumbnailGhost:hover img{
border: 0px solid transparent;
opacity:1.0;filter:alpha(opacity=100);
    -webkit-filter: grayscale(0%); /* Safari 6.0 - 9.0 */
    filter: grayscale(0%);
}

thumbnailGhost:active, thumbnailGhost:visited, .thumbnailGhost:visited, .thumbnailGhost:active, thumbnailGhost:focus, .thumbnailGhost:focus, thumbnailGhost:hover, .thumbnailGhost:hover{
    border:none !important;
    outline:none !important;

}

.iconGhost img{
position:relative;
top:var(--menuIconTopSpace);
border: 0px solid transparent;
background-color: transparent;
opacity:0.6;filter:alpha(opacity=60);
    -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
    filter: grayscale(100%);
margin: 0px 0px 0px 0;
padding-left:4px;
padding-right:4px;
width: var(--menuIconSize);
height: var(--menuIconSize);
}

.iconGhost:hover{
border: 0px solid transparent;
background-color: transparent;
opacity:1.0;filter:alpha(opacity=100);
    -webkit-filter: grayscale(0%); /* Safari 6.0 - 9.0 */
    filter: grayscale(0%);
}

.iconGhost:hover img{
border: 0px solid transparent;
opacity:1.0;filter:alpha(opacity=100);
    -webkit-filter: grayscale(0%); /* Safari 6.0 - 9.0 */
    filter: grayscale(0%);
}

iconGhost:active, iconGhost:visited, .iconGhost:visited, .iconGhost:active, iconGhost:focus, .iconGhost:focus, iconGhost:hover, .iconGhost:hover{
    border:none !important;
    outline:none !important;

}


/* phfx titles */

#menuTitle{
	position:relative;
    display: inline;
    font-family: var(--pageFont);
    font-size: 24px; 
    font-weight: 300;
    color: #FFFFFF;
	padding: 0px 0px 0px 0px;
	text-align: left;
    }
	
h1 {
    font-family: var(--pageFont);
    font-size: 24px; 
    font-weight: 300;
    margin-top: 0.0em; 
	margin-bottom: 0.4em;

  }

h2 {
    font-family: var(--pageFont);
    font-size: 24px; 
    font-weight: 300;
    margin-top: 0.0em; 
	margin-bottom: 0.2em;
	text-align:center;
  }

h3 {
    font-family: var(--pageFont);
    font-size: 24px; 
    font-weight: 300;
    margin-top: 0.0em; 
	margin-bottom: 0.2em;
	text-align:center;
  }
  
h4 {
    font-family: var(--pageFont);
    font-size: 16px; 
    font-weight: 300;
    margin-top: 0.0em; 
	margin-bottom: 0.2em;
	text-align:center;
  }
	
hr {
    border: 0;
    height: 1px;
    background: #1e1e1e;
    background-image: var(--mainHRColor);
}

strong {
	font-size:18px;
	font-weight: 300;
	color: var(--chapterHighlightColor);
}

p{
    margin-top: 0.0em; 
	margin-bottom: 0.6em;
}

br{
  content: "";
  margin: 4em;
  display: block;
  font-size: 24%;
  outline: red;
}

.lineWhiteCenterGrad {
    border: 0;
    height: 1px;
    width: 100%;
    background: #1e1e1e;
    background-image: linear-gradient(to right, #1e1e1e, #e1e1e1, #1e1e1e);
}

.lineYellow {
    border: 0;
    height: 1px;
    background: #1e1e1e;
    background-image: linear-gradient(to right, transparent, #ffff6d, transparent);
}
	
	
.chapterLine {
    border: 0;
    height: 1px;
    background: #1e1e1e;
    background-image: linear-gradient(to right, #e1e1e1, #1e1e1e, #1e1e1e);
}


	
/* phfx links */

A:link  { color:var(--linkColor);	text-decoration: none; }
A:hover  { color:var(--linkHoverColor); text-decoration: none; }
A:visited { color: var(--linkColor); text-decoration:none; }
A:visited:hover  { color:var(--linkHoverColor); text-decoration:none; }
A:active  { color:var(--linkHoverColor); text-decoration: none; }

.mce-window-body img {
    max-width: 100%;
    height: auto;
}

/* phfx galaxy flex */



.flexContainer {
  display: flex;
  flex-flow: row wrap;
  position: relative;
  width: auto;
}

.flexItem {
  flex: 0 0 12%;
  height: auto;
  margin: 0px;
  padding: 0px 0;
  width: auto;

}

.thumbnail_flex img{
border: 0px solid transparent;
padding: 0;
background-color: transparent;
opacity:1;filter:alpha(opacity=100);
margin: 0 0px 0px 0;
max-width: 120px;

object-fit: cover;
aspect-ratio: 1 / 1;

  transition: opacity 0.6s;
  -webkit-transition: opacity 0.6s;
}

.thumbnail_flex:hover{
border: 0px solid transparent;
padding: 0;
background-color: transparent;
opacity:0.6;filter:alpha(opacity=60);
  transition: opacity 0.6s;
  -webkit-transition: opacity 0.6s;
}

.thumbnail_flex:hover img{
border: 0px solid transparent;
padding: 0;
opacity:0.6;filter:alpha(opacity=60);
  transition: opacity 0.6s;
  -webkit-transition: opacity 0.6s;
}

thumbnail_flex:active, thumbnail_flex:visited, .thumbnail_flex:visited, .thumbnail_flex:active, thumbnail_flex:focus, .thumbnail_flex:focus, thumbnail_flex:hover, .thumbnail_flex:hover{
    border:none !important;
    outline:none !important;
}

	.articleTitleImage {
	  /* force the div to properly contain the floated images: */
	  position:relative;

	  clear:none;
	  overflow:hidden;
	}
	.articleTitleImage img {
	  position:relative;
	  z-index:1;
    object-fit: cover;
	  width:100%;
 
	}
	.articleTitleImage .articleTitleLarge {
	  display:block;
	  position:absolute;
	  width:100%;
	  top:40%;
	  z-index:2;
	  text-align:center;
	}
	
	.articleTitleImage .articleTitleMedium {
	  display:block;
	  position:absolute;
	  width:100%;
	  top:40%;
	  z-index:2;
	  text-align:center;
	}
	
	.articleTitleImage .articleTitleSmall {
	  display:block;
	  position:absolute;
	  width:100%;
	  top:40%;
	  z-index:2;
	  text-align:center;
	}
	
	.articleTitleImage .articleTitleTiny {
	  display:block;
	  position:absolute;
	  width:100%;
	  top:40%;
	  z-index:2;
	  text-align:center;
	}

	.articleTitleImage .articleSubTitle {
	  display:block;
	  position:absolute;
	  width:100%;
	  top:70%;
	  z-index:2;
	  text-align:center;
	}


#filmContainer a {
    position: relative;
    display: inline-block;
	font-size:16px;
    transition: opacity 0.66s;
	
}

.filmCaption {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 50%; /* 50% from top */
    left: 50%; /* 50% from left */
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    opacity: 0;
    transform: translate(-50%, -50%) scale(1); /* to center the text, scale(0) to doesn't show text  */
    transform-origin: center;
    transition: 0.66s;
}

#filmContainer a:hover .filmCaption {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1); /* to center the text, scale(1) to show text  */
    transform-origin: center;
    transition: 0.66s;
	
}
#filmContainer img {
	  position:relative;
	  object-fit: cover;
	  	  width:320px;
	  height:152px;
	  aspect-ratio: 2 / 1;
     transition: opacity 0.6s;
     -webkit-transition: opacity 0.6s;
}
#filmContainer a:hover img {
    opacity: 0.5;
	transition: 0.66s;
}






	.wrapArticleThumb {
	  /* force the div to properly contain the floated images: */
	  position:relative;
	  clear:none;
	  overflow:hidden;
	  
	}
	.wrapArticleThumb img {
	  position:relative;
	  z-index:1;
	  width:1280px;
	  height:128px;
	  opacity:1;
	transition: 0.66s;
    object-fit: cover;
  -webkit-mask-image: linear-gradient(to right, transparent, black);

	}
	
	.wrapArticleThumb a:hover img {
	  position:relative;
	  z-index:1;
	  width:1280px;
	  height:128px;
	  opacity:0.5;
	transition: 0.66s;
    object-fit: cover;

	}
	
	.wrapArticleThumb .desc {
	  display:block;
	  position:absolute;
	  width:100%;
	  top:33%;
	  right:-8px;
	  z-index:2;
	  text-align:left;
	}
	
	.wrapArticleThumb .descSub {
	  display:block;
	  position:absolute;
	  width:100%;
	  top:66%;
	  right:-8px;
	  z-index:2;
	  text-align:left;
	}


	.wrapPanoThumb {
	  /* force the div to properly contain the floated images: */
	  position:relative;
	  float:left;
	  clear:none;
	  overflow:hidden;
	}
	.wrapPanoThumb img {
	  position:relative;
	  z-index:1;
    object-fit: cover;
	  width:320px;
	  height:150px;
	}
	.wrapPanoThumb .descPano {
	  display:block;
	  position:absolute;
	  width:100%;
	  top:35%;
	  right:0px;
	  z-index:2;
	  text-align:center;
	}



/* phfx copyright */

#copyrightText {
	opacity:.5;filter:alpha(opacity=50);
	height:20px;
}

#copyrightBottomRight
{
	position: fixed;
	bottom: 0;
	right: 0;
  text-align: center;
  width:100%;
  background: var(--backgroundImage);
    background-position:left center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background-attachment: fixed; 
}



	a img {border: none !important;} 	    

	img {
		     max-width: 100%;
		}
		
	img-responsive {
		     max-width: 100%;
		}

iframe {
	border:0px;
}
		
@keyframes slideInFromTop {
  0% {
    transform: translateY(-100%);
  }
  100% {
    transform: translateY(0);
  }
}

header {  
  /* This section calls the slideInFromLeft animation we defined above */
  animation: 1s ease-out 0s 1 slideInFromTop;
  background: #333;
  padding: 30px;
}



#phfxMenuContainer {
    position: fixed;
    height: var(--topMenuBarHeight);
    width: 100%;
    top: 0;
    left: 0;
	background: var(--backgroundImage);
    background-position:left center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background-attachment: fixed;
    !important;z-index:998;
}
 

.phfxInternalMenuBlock {
    width: var(--maxPageWidth);
	height: var(--topMenuBarHeight);
    margin: 0 auto;
    margin-bottom: 40px;
	z-index:999;
	border-top: 0px;
	border-left: 0px;
	border-right: 0px;
	border-bottom: 1px;
	border-style: solid;
	border-color: var(--menuBottomBorderColor);
}


#phfxPageContainer {
	position: relative;
	width: var(--maxPageWidth);
	height: auto;
    margin: auto;
	top:var(--pageContentTopSpacing);
	/* animation: 1s ease-out 0s 1 slideInFromTop; */

}

#phfxPageContent{
	display: inline-block;
	text-align: left;
    width:100%;
	height: auto;
	
}






/*   */
A.menuLink:link  { color: var(--menuLink);	text-decoration: none; display: inline-block; position: relative; z-index: 1; padding: 1em; margin: -1em; }
A.menuLink:hover  { color: var(--menuLinkHover); text-decoration: none; display: inline-block; position: relative; z-index: 1; padding: 1em; margin: -1em; }
A.menuLink:visited { color: var(--menuLink); text-decoration:none; display: inline-block; position: relative; z-index: 1; padding: 1em; margin: -1em; }
A.menuLink:visited:hover  { color: var(--menuLinkHover); text-decoration:none; display: inline-block; position: relative; z-index: 1; padding: 1em; margin: -1em; }
A.menuLink:active  { color: var(--menuLinkHover); text-decoration: none; display: inline-block; position: relative; z-index: 1; padding: 1em; margin: -1em; }


nav {
position:relative;
display:inline-block;
text-align:left;
}
nav ul {
   margin: 0;
   padding: 0px;
   
}
nav ul li {
   display: inline;
   position: relative;
   padding-right:8px;
   padding-bottom:5px;
   border-left:0px;
   border-right:0px;
   border-top:0px;
   border-bottom:0px;
   border-color:#FF0000;
   border-style:solid;
   
}
nav ul li div {
   position: absolute;
   left: -9999px;
   width:300px;
}

nav ul li:hover div {
   left: 0;
   
}



nav ul li ul li {

   display: list-item;
   list-style-type:disc;
   color: #eb5523;
   list-style-position: inside;
   top:12px;
   margin: 0;
   padding-left: 12px;
   padding-right: 12px;
   padding-top: 12px;
   padding-bottom: 12px;
	background: url(http://www.phfx.com/phfx_backgrounds/phfx_grainBG.jpg);
    background-position:left center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background-attachment: fixed;
   border-left:0px;
   border-right:0px;
   border-top:0px;
   border-bottom:0px;
   border-color:#FF0000;
   
}
nav ul li ul{
   display:inline-block;
   margin: 0;
   padding: 0;
}






#philHollandTitle{
	position:relative;
    display: inline;
    top:var(--menuIconTopSpace);
    padding: 0px 0px 0px;
    font-family: 'Roboto', sans-serif;
    font-size: 24px; 
    font-weight: 300; 
    text-align: left;
    opacity:1;filter:alpha(opacity=100);
    !important;z-index:3000;
    }
    
#phfxTitle{
	position:relative;
    display: inline;
    top:var(--menuIconTopSpace);
    padding: 0px 0px 0px;
    font-family: 'Roboto', sans-serif;
    font-size: 24px; 
    font-weight: 300;     text-align: left;
    opacity:1;filter:alpha(opacity=100);
    !important;z-index:1998;
    }
	
A.menuMeLink:link  { color: var(--menuLink);	text-decoration: none;}
A.menuMeLink:hover  { color: var(--menuLinkHover); text-decoration: none; }
A.menuMeLink:visited { color: var(--menuLink); text-decoration:none; }
A.menuMeLink:visited:hover  { color: var(--menuLinkHover); text-decoration:none; }
A.menuMeLink:active  { color: var(--menuLink); text-decoration: none; }

#introBox {
	max-width:960px;
    margin: auto;
	border:0px;
	padding:0px;
}

#caption{
    font-family: 'Roboto', sans-serif;
    font-weight: 300;
    font-size: 16px; 
    color: var(--chapterHighlightColor);
    padding:0px 0px 0px 0px;
    }
	
#pictureCaption{
    font-family: 'Roboto', sans-serif;
    font-weight: 300;
    font-size: 16px; 
    color: var(--chapterHighlightColor);
    padding:0px 0px 0px 0px;
    }


#galleryPictureCaption{
    font-family: 'Roboto', sans-serif;
    font-weight: 300;
    font-size: 16px; 
    color: var(--chapterHighlightColor);
    padding:0px 0px 0px 0px;
    }
	
	
	
#myTextarea {
overflow: scroll;
    }
	
/* Button STYLES */

.submitButton {
    background-color: #4CAF50; /* Green */
    border: none;
    color: white;
    padding: 8px 16px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 14px;
    margin: 4px 2px;
    outline: none !important;
    cursor: pointer;
}

.submitButtonFace {
    background-color: transparent;
    color: #6bffff;
    border: 1px solid #541414;
    outline: none !important;
}

.submitButtonFace:hover {
    background-color: transparent;
    color: var(--chapterHighlightColor);
    border: 1px solid #e43a3a;
    outline: none !important;
}

.submitButtonFace:active {
    background-color: transparent;
    color: var(--chapterHighlightColor);
    border: 1px solid #e43a3a;
    outline: none !important;
}

.submitButtonFace:visited {
    background-color: transparent;
    color: var(--chapterHighlightColor);
    border: 1px solid #e43a3a;
    outline: none !important;
}

.submitButtonFace:visited:hover {
    background-color: transparent;
    color: var(--chapterHighlightColor);
    border: 1px solid #e43a3a;
    outline: none !important;
}


.embed-container { 
	position: relative; 
	padding-bottom: 56.25%; 
	height: 0; 
	overflow: hidden; 
	max-width: 100%; 
} 
	
.embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%;}

#floatRightThird {
	float:right;
	width:33.33%;
}

#floatRightQuarter {
	float:right;
	width:25%;
}

#floatRightHalf {
	float:right;
	width:50%;
}

#floatLeftThird {
	float:left;
	width:33.33%;
}

#floatLeftQuarter {
	float:left;
	width:25%;
}

#floatLeftHalf {
	float:left;
	width:50%;
}

.thumbnailStore img{
display:inline-block;
border: 0px solid transparent;
padding: 0;
background-color: transparent;
opacity:0.6;filter:alpha(opacity=60);
margin: 0 0px 0px 0;
width:476px;
}

.thumbnailStore:hover{
border: 0px solid transparent;
padding: 0;
background-color: transparent;
opacity:1.0;filter:alpha(opacity=100);
}

.thumbnailStore:hover img{
border: 0px solid transparent;
padding: 0;
opacity:1.0;filter:alpha(opacity=100);
}


.articleSmallImage img{
border: 0px solid transparent;
padding: 0;
background-color: transparent;
opacity:1.0;filter:alpha(opacity=100);
margin: 0 0px 0px 0;
width:25%;
}

.articleSmallImage:hover{
border: 0px solid transparent;
padding: 0;
background-color: transparent;
opacity:1.0;filter:alpha(opacity=100);
}

.articleSmallImage:hover img{
border: 0px solid transparent;
padding: 0;
opacity:1.0;filter:alpha(opacity=100);
}

articleSmallImage:active, articleSmallImage:visited, .articleSmallImage:visited, .articleSmallImage:active, articleSmallImage:focus, .articleSmallImage:focus, articleSmallImage:hover, .articleSmallImage:hover{
    border:none !important;
    outline:none !important;
}


pre {
    font-family: 'Roboto', sans-serif;
    font-weight: 300;
    font-size: 16px;     
	color: #e1e1e1;
	padding: 0px 0px 0px;
	text-align: left;
	background: transparent;
	white-space: pre-line;
	white-space: pre-wrap;       /* css-3 */
	white-space: -moz-pre-wrap;  /* Mozilla, since 1999 */
	white-space: -pre-wrap;      /* Opera 4-6 */
	white-space: -o-pre-wrap;    /* Opera 7 */
	word-wrap: break-word;       /* Internet Explorer 5.5+ */
   }