@charset "utf-8";
/* CSS Document */
   

/* ---------------------------------------------
			IMPORT SECTION
--------------------------------------------- */

/*@import url("base.css");  /* 960 Grid + Media Query Layouts */ 



/* #Site Styles   */

.borderleftgreyjc { 
	border-left: 1px solid  #999; 
	border-color: #CCC;
    padding-right: 40px;
    padding-left: 20px;
	} 
 
.center { 
    text-align: center;
	}

  img {
  border-radius: 8px;
} 
  
  
.colored-bg-image-papnz2 {  
    background-image: url(../auckland-plein-air-painters-nz/images/images_background/57.jpg);
  
  /* Background image is centered vertically and horizontally at all times */
  background-position: center center;
  
  /* Background image doesn't tile */
  background-repeat: no-repeat;
  
  /* Background image is fixed in the viewport so that it doesn't move when 
     the content's height is greater than the image's height */
  background-attachment: fixed;
  
  /* This is what makes the background image rescale based
     on the container's size */
  background-size: cover;
  height: 800px; 
   
  background-color: #ffffff;
}
  
  
  
  
  
  
   

.colored-bg-image-papnz {  
    background:  url(../auckland-plein-air-painters-nz/images/images_background/57.jpg) no-repeat;
    background-size: 100%;
	height: auto;
}


.colored-bg-imagecontact {  
   background-image:url(../images/general/paint_2300x867-web2.jpg);
height: 180px; 
    background-repeat: no-repeat;
}

.banner-image-about { 
    background:  url(../images/2019_images/banners/banner-easelplants1300w.jpg) no-repeat center top fixed;
    background-size: cover;
    min-height: 200px; 
	font-family: 'Goudy Bookletter 1911', Georgia, Times, serif;
	font-size: 20px;  
	line-height: 20px;
	text-align: center; 
	vertical-align: middle; 
	color:#ffffff;
    border-radius: 0px;  
	margin-bottom: 35px;	
    background-color:#ffffff;  
}


.banner-image-column { 
    background:  url(../images/in_houses/in-orangeyellowbuegreenmauveblack496x496.jpg) no-repeat center top fixed;
    background-size: cover;
    min-height: 200px; 
	font-family: 'Goudy Bookletter 1911', Georgia, Times, serif;
	font-size: 20px;  
	line-height: 20px;
	text-align: center; 
	vertical-align: middle; 
	color:#ffffff;
    border-radius: 0px;  
	margin-bottom: 35px;	
    background-color:#ffffff;  
}

 
.colored-bg-image-line { 
    background:  url(../images/general/paint_2300x867-thinline.jpg) no-repeat;
    background-size: 100% ;
     height: 4px; 
}


.colored-bg-lmauve {
	background-color: #E8DAE5;
	height: 100%}

.colored-bg {
	background-color: #00CCFF;
} /**/

.colored-bg-index {  
   background: #4B3B80;
background: linear-gradient(0deg,  #4B3B80, #ffffff);
    background-size: 100%;
	height: 500px;
}

.colored-bg-index2 {
	background-color:  #4B3B80;
	height: 50px;
} 



.btop-1px {
	border-top: 0.5px solid #B51FE5;
	margin-top:1px; 
}
.bbottom-1px {
	border-bottom: 1px solid #e7e7e7;
	 margin-bottom:1px;
	 
	-webkit-box-shadow: 0 1px 2px 1px  #D1CCD5;
	-moz-box-shadow: 0 1px 2px 1px #D1CCD5;
	box-shadow: 0 1px 2px 1px  #D1CCD5;
}
.bbottom-1px-title {border-bottom: 1px solid #e7e7e7; padding-bottom:10px;
}
.divider-blog-1px { border-bottom: 1px dotted #e7e7e7; margin-top:36px; height: 1px;
}
.divider-page-1px { border-bottom: 1px dotted #e7e7e7; margin-top:50px; margin-bottom:50px;  height: 1px;
}
.divider-item-1px { border-bottom: 1px dotted #e7e7e7; margin-top:29px; margin-bottom: 3px; height: 1px;
}
p.last { margin-bottom:0; }

.fullwidth { width: 100% !important; }

.transition-effect {
	-webkit-transition: all 0.4s linear;
	-moz-transition: all 0.4s linear;
	-ms-transition: all 0.4s linear;
	-o-transition: all 0.4s linear;
	transition: all 0.4s linear;
}




/* ------------------------------------------------
				top control
------------------------------------------------ */

.resize {
	position: fixed;
	bottom: 0;
	right: 0;
	height: 80px;
	width: 80px;
	background: url('../images/resize.png');
}

#topcontrol > div {
	-webkit-transition: all 0.3s linear;
	-moz-transition: all 0.3s linear;
	-o-transition: all 0.3s linear;
	-transition: all 0.3s linear;
	bottom: 40px;
	cursor: pointer;
	height: 37px;
	position: absolute;
	right: 15px;
	width: 37px;
	-webkit-box-shadow: 2px 2px 0px 0px #e2e4e4;
	-moz-box-shadow: 2px 2px 0px 0#e2e4e4;
	box-shadow: 2px 2px 0px 0px #e2e4e4;	
	z-index:5;
}
.topcontrol-arrow-up {
	content: '';
	position: absolute;
	left: 11px;
	top: 15px;
	border-left: 7px solid transparent;
	border-right: 7px solid transparent;
	border-bottom: 7px solid white;
}
#top-panel {
	background-color: #Fffffff;
	border-bottom: 4px solid #7A12FB;
	position: relative;
	width: 100%;
	-webkit-box-shadow: inset 0px 0px;
	box-shadow: inset 0px 0px;
}
#top-panel .panel { display:none; padding:16px 0 30px 0; }
#top-panel .toggle {
	bottom:-30px;
	cursor:pointer;
	height:25px;	
	position:absolute;
	right:30px;
	width:37px;
	-webkit-box-shadow: 2px 2px 0px 0px #e2e4e4;
	-moz-box-shadow: 2px 2px 0px 0#e2e4e4;
	box-shadow: 2px 2px 0px 0px #e2e4e4;		
}
#top-panel .toggle a {
	content: '';
	position: absolute;
	left:11px;
	top: 9px;
	border-left: 7px solid transparent;
	border-right: 7px solid transparent;
	border-top: 7px solid #FFF;
}
#top-panel .hide-panel a {
	-webkit-transform: rotate(180deg);
	-moz-transform: rotate(180deg);
	-ms-transform: rotate(180deg);
	-o-transform: rotate(180deg);
	filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
}
#top-panel .toggle:hover a { top: 10px; }
#top-panel .toggle.hide-panel:hover a { top: 8px; }
#contact-info { margin-bottom:0; }
#contact-info li { background-image:url('../images/icons/sprites.png'); background-repeat:no-repeat; display:block;  padding-left:25px;  float:left; }
#top-panel .phone {
	background-position: 0 -489px;
	color: #666;
}
#top-panel .location {
	background-position: 0 -409px;
	color: #666;
}
#top-panel .email { background-position:0 -569px; }
#top-panel .skype { background-position:0 -649px; }

#top-panel h4 {	margin-bottom:17px;	font-size:18px; border-bottom: 1px solid #E7E7E7; line-height:46px }
#top-panel h6 {
	margin-bottom: 17px;
	font-size: 12px;
	font-weight: bold;
	border-bottom: 1px solid #E7E7E7;
	line-height: 30px;
}
#top-panel .location-map iframe { width:220px; height:200px;}
#top-panel .columns { position:relative; }


#slider-wrapper_pa { 
background-image:url(../auckland-plein-air-painters-nz/images/images_background/57.jpg)
	}
	


#slider-wrapper, #separator { 
background: linear-gradient(45deg, #FF1493, blue);
min-height: 100%; 
}
 


#slider-wrapperpaint2  {  
background-image:url(../images/general/paint_2300x867-web2.jpg);
height: 450px; 
    background-repeat: no-repeat;
 }
 
#slider-wrapperpaint2-small  {  
background-image:url(../images/general/paint_2300x867-web2.jpg);
height: 130px;
}
 
 
 #slider-wrapperpaint2-topbanner  {  
background-image:url(../images/general/paint_2300x867-web2.jpg);
height: 9px;
}
 
/******************* CTA BLOCK ****************/
#cta-block {
	padding:25px 0;
	text-align:center;
}
#cta-block h5 {
	color: #CCCCCC;
	font-family: 'Quicksand', sans-serif;
	font-size: 20px;
	line-height: 30px;
}

/******************* MENU ****************/
.fix-fish-menu { position:relative; z-index: 9000; }
#menu-wrapper { }
#menu {
	float: right;
	background: #FFF;
	margin-top: 40px;
	font-size: 13px;
}
.sf-menu, .sf-menu * { margin: 0; padding: 0; list-style: none; }
.sf-menu { float: right; }
.sf-menu ul { position: absolute; top: -999em; text-align:left; }
.sf-menu ul li {
	-webkit-box-shadow:  2px 2px 0px 0px #fff;
	-moz-box-shadow:  2px 2px 0px 0px #fff;
	box-shadow:  2px 2px 0px 0px #fff;   
}

.sf-menu li:hover { 
	visibility:	inherit;
	border: 1px solid #cacbcb;
	-webkit-box-shadow:  2px 2px 0px 0px #e2e4e4;
	-moz-box-shadow:  2px 2px 0px 0px #e2e4e4;
	box-shadow:  2px 2px 0px 0px #e2e4e4;
}
.sf-menu li {
	float: left;
	position: relative; 
	border: 1px solid #fff;
	-webkit-box-shadow:  2px 2px 0px 0px #fff;
	-moz-box-shadow:  2px 2px 0px 0px #fff;
	box-shadow:  2px 2px 0px 0px #fff;
	margin-right: 5px;
	margin-bottom: 20px;	
}

.sf-menu a { display:block; text-decoration: none; 	position:relative; 	text-decoration: none; }
.sf-menu li:hover ul, .sf-menu li.sfHover ul { top: 35px; /* match top ul list item height */ z-index: 199; }
.sf-menu li a {	color: #999; padding: 5px 10px; text-decoration: none; }
.sf-menu li a:hover {  /*color:#bababa; */}
.sf-menu li:hover li ul, ul.sf-menu li.sfHover li ul { top:-999em;z-index: 9999; }
.sf-menu li li:hover ul, ul.sf-menu li li.sfHover ul { left:14.7em; top:-1.7em;  }
.sf-menu li li:hover li ul, ul.sf-menu li li.sfHover li ul { top: -999em; z-index:9999;}
.sf-menu li li li:hover ul, ul.sf-menu li li li.sfHover ul { left: 11.3em; top: 0;  }

ul.sf-menu li a:hover {
	color: #AA0F5D;
	text-decoration: none;
}
ul.sf-menu li.active a { color:#4d4c4c!important; }
ul.sf-menu li.active { border: 1px solid #cacbcb; -webkit-box-shadow:  2px 2px 0px 0px #e2e4e4; -moz-box-shadow:  2px 2px 0px 0px #e2e4e4; box-shadow:  2px 2px 0px 0px #e2e4e4; }
.sf-menu a, .sf-menu a:visited  { }
.sf-menu li ul li a {
	font-size: 11px !important; 
	text-transform:capitalize !important;
	width:140px;
}
.sf-menu li ul li {
}

.sf-menu ul li a:focus, .sf-menu ul li a:hover, .sf-menu ul li a:active {
	outline: 0;	
	color:#4D4C4C !important;
}

/*** shadows for all but IE6 ***/
.sf-shadow ul {
}

.sf-menu li ul li {
	background-color:white;
	border: 1px solid #CACBCB;
	-webkit-box-shadow: 2px 2px 0px 0px #e2e4e4;
	-moz-box-shadow: 2px 2px 0px 0px #e2e4e4;
	box-shadow: 2px 2px 0px 0px #e2e4e4;	
	margin-bottom:4px;
	padding: 5px 10px;	
	width:140px;
}
.sf-menu li ul li ul { margin-left:25px; margin-top:15px;}

.sf-menu li ul li:hover, .sf-menu li:hover { background-color:#FAFEFE; }
.sf-menu li ul li, .sf-menu li {
	-webkit-transition: all 0.2s linear;
	-moz-transition: all 0.2s linear;
	-ms-transition: all 0.2s linear;
	-o-transition: all 0.2s linear;
	transition: all 0.2s linear;
}
.sf-menu li ul li a { font-size:11px; color:#868787; padding: 0px; }


.fix-fish-menu select {
	display: none;
	width:  100%;
	height: 28px;
	margin: 21px 0;
}

/******************* BOTTOM MENU ****************/
#secondary-nav { border-bottom: 1px solid #e7e7e7; position: relative;  }
#secondary-nav li {	float: left; list-style-type: none;	margin-left: 7px; }
#secondary-nav ul {	float:right; margin-bottom: 0px; }
#secondary-nav li a { color:#898a8a; text-decoration:none; }
#secondary-nav li a:hover {
	color: #A30052;
	font-size: 14px;
}
.gray-dash-3px { border-bottom: 3px solid #b9b9b9; position:absolute; width:40px; height:3px; right: 0; bottom: -3px; }
#top-panel .gray-dash-3px { border-bottom: 3px solid #b9b9b9; position:absolute; width:40px; height:3px; right: 0; top: 27px; }


 
 
.cta-arrow {
	position:absolute;
	bottom:-1px;
	right: -1px;
	width:25px;
	height:25px;
}
.bg-arrow {
	position:absolute;
	bottom:-8px;
	right:-3px;
	z-index:1;
	width: 20px;
}
.container .columns.lp-header { margin-bottom:40px; }
.nav-projects { border-top: 1px solid #e2e5e6; position:absolute; width:inherit; top:10px;}
.header-block h6 { background-color: white; display: inline-block; padding-right: 15px; position:relative; z-index:1; }
.grey-line { border-top: 1px solid #686969; position:absolute; width: 15px; height: 1px; left:109px; top:-1px;}

#projects-carousel li, #posts-carousel li, #clients-carousel li {	margin-bottom:0; }


 
 

/******************* FOOTER ****************/
#footer {
	background-color: #ffffff;
	width: 100%;
	height: auto;
	border-top:  1px ridge #BBB0BD;
	border-bottom: 12px ridge #C99EDC;
}

#footer .copyright {
	color: #8D8A92; 
	text-align: right;
	}
	#footer .copyright_left {
	color: #8D8A92; 
	text-align: left;
	}
	
	
#footer .copyright a { color: #ababab; font-size:11px; 
}
#footer .copyright a:hover { color :#5D5D5D; 
}
#footer .copyright img { margin-bottom:10px; 
}
#footer .container { padding:30px 0; 
}


#footer-social li, #social-icons li {
	list-style-type:none;	
	background-image:url('../icons/social.png');
	background-repeat:no-repeat;
	-webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    -ms-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    transition: all 0.3s linear;
    margin-left:5px;
}
 

/******************* JCAROUSEL ****************/
.jcarousel-skin-tango .jcarousel-container { /*    border: 1px solid #346F97;*/ }
.jcarousel-skin-tango .jcarousel-direction-rtl { direction: rtl; }
.jcarousel-skin-tango .jcarousel-container-horizontal { width: 100%; }
.jcarousel-skin-tango .jcarousel-clip { overflow: hidden; }
.jcarousel-skin-tango .jcarousel-clip-horizontal { width:  100%; }
.jcarousel-skin-tango .jcarousel-item { width: 230px; }
.jcarousel-skin-tango .jcarousel-item-horizontal { margin-left: 0; margin-right: 10px; }
.jcarousel-skin-tango .jcarousel-direction-rtl .jcarousel-item-horizontal { margin-left: 10px; margin-right: 0; }
.jcarousel-skin-tango .jcarousel-item-placeholder { background: #fff; color: #000; }

/* Horizontal Buttons */
.jcarousel-skin-tango .jcarousel-next-horizontal {
    position: absolute;
    top: -51px;
    right: 10px;
    width: 40px;
    height: 30px;
    cursor: pointer;
    background: transparent url('../images/icons/sprites.png') no-repeat -40px -25px;
	border-right: 1px solid #E2E5E6;
	border-bottom: 1px solid #E2E5E6;
	border-left: 1px solid #E2E5E6;		
	border-top: 3px solid #ff7e00;
}
.jcarousel-skin-tango .jcarousel-direction-rtl .jcarousel-next-horizontal { }
.jcarousel-skin-tango .jcarousel-next-horizontal:hover,
.jcarousel-skin-tango .jcarousel-next-horizontal:focus { background-color:#f5f5f5; }
.jcarousel-skin-tango .jcarousel-next-horizontal:active { }
.jcarousel-skin-tango .jcarousel-next-disabled-horizontal,
.jcarousel-skin-tango .jcarousel-next-disabled-horizontal:hover,
.jcarousel-skin-tango .jcarousel-next-disabled-horizontal:focus,
.jcarousel-skin-tango .jcarousel-next-disabled-horizontal:active { cursor: default; border-top: 3px solid #ffd6ae; }
.jcarousel-skin-tango .jcarousel-prev-horizontal {
    position: absolute;
	top: -51px;
	right: 53px;
    width: 40px;
    height: 30px;
    cursor: pointer;
    background: transparent url('../images/icons/sprites.png') no-repeat 0 -25px;
	border: 1px solid #E2E5E6;
	border-top: 3px solid #ff7e00;	
}
.jcarousel-skin-tango .jcarousel-direction-rtl .jcarousel-prev-horizontal { }
.jcarousel-skin-tango .jcarousel-prev-horizontal:hover, 
.jcarousel-skin-tango .jcarousel-prev-horizontal:focus { background-color:#f5f5f5; }
.jcarousel-skin-tango .jcarousel-prev-horizontal:active { }
.jcarousel-skin-tango .jcarousel-prev-disabled-horizontal,
.jcarousel-skin-tango .jcarousel-prev-disabled-horizontal:hover,
.jcarousel-skin-tango .jcarousel-prev-disabled-horizontal:focus,
.jcarousel-skin-tango .jcarousel-prev-disabled-horizontal:active { cursor: default; border-top: 3px solid #ffd6ae; }

 

/* #Page Styles
================================================== */

 

/******************* BLOG ****************/
#separator h4 { margin:20px 0;}
#main-content {	float: left; /*width: 100%;*/ }
.main-wrapper { margin-top: 50px; }

.info-post { top: 30px;	left: 0; position: absolute; }
.info-post .ribbon-wrapper { opacity: 1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha"(Opacity=100); filter: alpha(opacity=100); top:0;	}
.info-post .ribbon-front { background-color: #ff7e00; height: 30px; width: 30px; position: relative; left: 0; z-index: 2; }
.info-post .ribbon-edge-bottomleft { top: 30px; left: 0;}

.meta-post { position: absolute; bottom:0; left:15px; width:95.5%; font-size: 11px; padding: 9px 0; }
.meta-post > div { display: inline-block; padding-right:20px; background-image:url('../images/icons/sprites.png'); background-repeat:no-repeat; padding-left:20px; }
.tag-meta-post > div { display: inline-block; background-image:url('../images/icons/sprites.png'); background-repeat:no-repeat; padding-left:20px;}
.tag-meta-post .tags { background-position: -268px 0; }
.meta-post .date { background-position: -149px 0; }
.meta-post .tags { background-position: -268px 0; max-width: 200px; }
.meta-post .comments { background-position: -149px -22px; }
.meta-post .author { background-position: -380px -22px; }
.meta-post .tweets { background-position: -269px -22px; float: right; padding-right: 0; padding-left: 25px; }
.meta-post iframe { float: right; }

.text-post { padding: 15px 0 15px 15px; margin-top: 42px; }
.text-post .last { margin-bottom: 0; }

.title-post {  }
.title-post h6 { margin-bottom: 10px; font-weight: bold; }
.title-post a { text-decoration: none;}
.title-post a:hover { color:#000;}

.entry-post { /*width: 680px;*/ position: relative; margin-bottom: 50px; }
.entry-post .stack {
	background-color:#f5f5f5;
	border: 1px solid #E7E7E7;
	position: absolute;
	left: 12px;
	top: 40px;
	height: 320px;
	width: 656px;
	padding: 15px;
}
.single-post .tag-meta-post { width:100%; font-size: 11px; padding: 9px 0; border-bottom: 1px dotted #E7E7E7; border-top: 1px dotted #E7E7E7; }
.single-post .share-post { float: right; }

.format-video .stack { height: 363px; }

.image-post {
	padding: 6px;
	position:relative;
	background-color: white;
	border: 1px solid #E7E7E7;		
	width: 674px;
	margin-left: 9px;
	-webkit-transition: border 0.4s linear;
     -moz-transition: border 0.4s linear;
     -ms-transition: border 0.4s linear;
     -o-transition: border 0.4s linear;
     transition: border 0.4s linear; 	
}
.image-post img { display:block; width:100%; }
.image-post:hover { border-bottom: 1px solid #FF7E00; }
.format-image .image-post img {
	-webkit-transition: all 0.4s linear;
     -moz-transition: all 0.4s linear;
     -ms-transition: all 0.4s linear;
     -o-transition: all 0.4s linear;
     transition: all 0.4s linear;	
}
.format-image .image-post img:hover { opacity: 0.8; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha"(Opacity=80);filter: alpha(opacity=80);  }
.single-post .image-post:hover { border-bottom: 1px solid #E7E7E7; }
.image-post iframe { display: block; width: 100%; height: 380px; }

.format-gallery .image-post { height: 337px; }
.format-gallery img { width:674px; }

.format-quote .image-post { height: 140px; }
.format-quote .stack { height: 123px; top: 40px; }
.format-quote .quote-text { margin: 15px; height: 100px; }
.format-quote .divider-blog-1px { margin-top:24px; }
.format-quote blockquote { border-left: 0; margin: 0; }
.format-quote .quote-text span { margin-left:20px; color:#ABABAB; }

.format-link .stack { height: 73px; top: 40px; }
.format-link .divider-blog-1px { margin-top:34px; }
.format-link .image-post { height: 90px; }
.format-link .link-text { margin: 15px; height: 60px; }
.format-link .link-text a { padding-left: 20px; padding-top: 10px; font-size: 17px;  text-decoration: none; display: inline-block; }
.format-link .link-text span { padding-left:20px; color:#ABABAB; display:block; }

.format-audio .image-post { height: 78px; }
.format-audio .stack { height: 61px;}
.format-audio .audio-wrapper { width:606px; padding:24px 34px; }
.format-audio .mejs-container {
/*	position: absolute !important;
	left: 0;
	top: 30px;*/
	margin-bottom: 0 !important;
/*	margin-left:40px;*/
}

.format-aside .image-post { height: 78px; }
.format-aside .stack  { height: 61px; }
.format-aside .aside-text { padding: 30px 34px; }
.format-aside .divider-blog-1px { margin-top:89px; }

#sidebar, #sidebar-left { float: left; /*width: 220px;*/ }
#sidebar .widget {
	position: relative;
	margin-bottom: 50px;
	padding-left: 10px;
	color: #333;
}
#sidebar-left .widget { position: relative; margin-bottom: 50px; padding-right: 10px;	}
#sidebar .widget li a, #sidebar-left .widget li a { text-decoration: none; }
.widget h6 {
	margin-bottom: 17px;
	font-size: 18px;
	font-weight: bold;
	border-bottom: 1px solid #E7E7E7;
	line-height: 30px;
	color: #893CC3;
}
.widget .gray-dash-3px {
	border-bottom: 3px solid #B9B9B9;
	position: absolute;
	width: 40px;
	height: 3px;
	right: 0;
	top: 27px;
}

#sidebar-left .widget .gray-dash-3px {
	border-bottom: 3px solid #B9B9B9;
	position: absolute;
	width: 40px;
	height: 3px;
	right: 10px;
	top: 27px;
}

 
 
/* #Media Queries
================================================== */

	/* Smaller than standard 960 (devices and browsers) */
	@media only screen and (max-width: 959px) {
		#info-block ul li > div { height: 65px; width: 478px; }
		.resize { display: none; }	
		
/* Force table to not be like tables anymore */
		table, thead, tbody, th, td, tr { 
			display: block; 
		}
		
		/* Hide table headers (but not display: none;, for accessibility) */
		thead tr { 
			position: absolute;
			top: -9999px;
			left: -9999px;
		}
		
		tr { border: 1px solid #ccc; }
		
		td { 
			/* Behave  like a "row" */
			border: none;
			border-bottom: 1px solid #eee; 
			position: relative;
			padding-left: 50%; 
		}
		
		td:before { 
			/* Now like a table header */
			position: absolute;
			/* Top/left values mimic padding */
			top: 6px;
			left: 6px;
			width: 45%; 
			padding-right: 10px; 
			white-space: nowrap;
		}
		
		/*
		Label the data
		*/
		td:nth-of-type(1):before { content: "First Name"; }
		td:nth-of-type(2):before { content: "Last Name"; }
		td:nth-of-type(3):before { content: "Job Title"; }
		td:nth-of-type(4):before { content: "Favorite Color"; }
		td:nth-of-type(5):before { content: "Wars of Trek?"; }
		td:nth-of-type(6):before { content: "Nick Name"; }
		td:nth-of-type(7):before { content: "Date of Birth"; }
		td:nth-of-type(8):before { content: "Dream Vacation City"; }
		td:nth-of-type(9):before { content: "GPA"; }
		td:nth-of-type(10):before { content: "Arbitrary Data"; }	
		
		.resize	{ display: none; }
	}

	/* Tablet Portrait size to standard 960 (devices and browsers) */
	@media only screen and (min-width: 768px) and (max-width: 959px) {
		#latest-projects .block, #latest-posts .block, .portfolio-4 .block { width:167px; height:155px; }
		#latest-projects .stack, #latest-posts .stack, .portfolio-4 .stack { width:167px; height:155px; }
		#latest-projects .block img, #latest-posts .block img, .portfolio-4 .block img { width:155px; height:143px }
		#latest-projects .block .mask, #latest-posts .block .mask, .portfolio-4 .block .mask { width:155px; height:143px; }

		.portfolio-3 .block, .portfolio-3 .stack { width:231px; height:215px; }
		.portfolio-3 .block img, .portfolio-3 .block .mask, .portfolio-3 .block iframe { width:219px; height:203px }
		
		.jcarousel-skin-tango .jcarousel-item { width: 172px !important; }
		.jcarousel-skin-tango .jcarousel-item-horizontal {margin-right: 20px;}
		#clients .block { width:170px;}
		#clients .block img { width:170px;}
		#latest-projects .block iframe, #latest-posts .block iframe, .portfolio-4 .block iframe { width:155px; height:143px; }
		#top-panel .location-map iframe { width:172px; height:200px;}		
		#contacts-form input[type=text], #contacts-form input[type=password], #contacts-form input[type=email] { width:162px;}
		#contacts-form textarea { width: 354px; }
		#latest-posts .mejs-container {width:137px !important;}
		#latest-posts .block .text { height: 80px;}
		.image-post { width: 530px; }
		.entry-post { /*width: 536px;*/ }
		.entry-post .stack { width: 512px; height: 248px; }
		.meta-post .tags { display: none; }		
		.meta-post { width: 94%; }
		.image-post iframe { height: 295px; }
		.format-video .stack { height: 278px; }		
		.format-audio .stack { height: 61px; }
		.format-quote .stack { height: 122px; }
		.format-link .stack { height: 72px; }
		.format-aside .stack { height: 60px; }		
		.format-audio .audio-wrapper { width: 462px; }	
		.format-quote .image-post { height: 165px; }
		.format-quote .stack { height: 148px; }
		.format-aside .image-post { height: 95px; }		
		.format-aside .stack { height: 78px; }		
		 #slidesjs-container img {	height: 265px; }		
		 #slidesjs-container, .slides_container { height: 265px; }		 
		.format-gallery img { width: 530px; }
		.format-gallery .image-post { height: 265px; }
		.thumbs li img { width: 66px; height: 66px; }	
		#searchform input[type=text] { padding-right: 0; width: 162px; background-position: 141px -759px;}
		.four-column img { width: 236px; }
		.portfolio-4 .mask .link-icon { top: 117px; left: 129px; }
		.portfolio-3 .mask .link-icon { top: 177px; left: 193px; }		
		.portfolio-4 .columns:hover .mask .zoom-icon { top: 58px; left: 56px; }
		.portfolio-4 .columns:hover .mask .link-icon { top: 58px; left: 88px; }
		.portfolio-3 .column:hover .mask .zoom-icon { top: 88px; left: 80px; }
		.portfolio-3 .column:hover .mask .link-icon { top: 88px; left: 112px; }		
		.portfolio-4 .stack .title { width: 140px; }
		.portfolio-3 .stack .title { width: 205px; }
		.image-item { width: 542px; }
		.format-video .image-item { height: 302px; }
		.format-gallery .image-item img { width: 542px; }
		.items-info { width: 116px; }
		.format-gallery .image-item { height: 265px; }
		.text-item { padding-right: 0; }
		.divider-item-1px { margin-top: 50px !important; }		
		.google-map iframe { width: 542px; }
		#contacts-form-main input[type=text], #contacts-form-main input[type=password], #contacts-form-main input[type=email] { width: 258px; }
		#contacts-form-main textarea { width: 547px; }
		#products .slides_container { width:555px;	height: 292px; }
		#products .slides_control img {	height: 278px; width: 541px; }
		#products a.prev, #products a.next { top: 255px; }
		#products a.prev { left: 477px; }
		#products a.next { left: 510px; }
		#products .pagination { padding-left: 0px; }	
		#products .pagination li a { width:170px; }
		#products .pagination li img { width: 170px; }

	}

	/* All Mobile Sizes (devices and browser) */
	@media only screen and (max-width: 767px) { 
	
	
	}

	/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
	@media only screen and (min-width: 480px) and (max-width: 767px) {

		#latest-projects .block, #latest-posts .block, .portfolio-4 .block  { width:195px; height:inherit; }
		#latest-projects .stack, #latest-posts .stack, .portfolio-4 .stack { width:195px; height:181px; }
		#latest-projects .block img, #latest-posts .block img, .portfolio-4 .block img { width:183px; height:169px; }
		#latest-projects .block .mask, #latest-posts .block .mask, .portfolio-4 .block .mask { width:183px; height:169px; }
		
		.portfolio-4 .block, .portfolio-3 .block { width:185px; height:inherit; }
		.portfolio-4 .stack, .portfolio-3 .stack { width:185px; height:172px; }
		.portfolio-4 .block img, .portfolio-3 .block img { width:173px; height:160px; }
		.portfolio-4 .block .mask, .portfolio-3 .block .mask { width:173px; height:160px; }
		.portfolio-4 .block iframe, .portfolio-3 .block iframe { width:173px; height:160px;}
		.item-block { width: 190px !important; margin: 0 10px 30px 10px !important; }
		
		#clients .block { width:198px; height:inherit;}
		#clients .block img { width:198px;}		
		.jcarousel-skin-tango .jcarousel-item { width: 200px !important; }
		.jcarousel-skin-tango .jcarousel-item-horizontal {margin-right: 20px;}
		#nav { display:none;}
		#secondary-nav { display:none; }
		#footer-social { float:left; }
		.jcarousel-skin-tango .jcarousel-next-horizontal { right:0; }
		.jcarousel-skin-tango .jcarousel-prev-horizontal { right: 43px;}
		#info-block ul li > div { height: 65px; width: 420px; }	
		#latest-projects .block iframe, #latest-posts .block iframe { width:183px; height:169px; }	
		.fix-fish-menu select {	display:block; }
		#menu { float: none; }
		.ribbon-front { left: 1px; }
		.ribbon-edge-topleft, .ribbon-edge-bottomleft { display:none; }
		#footer-social li { margin-right: 5px; margin-left: 0px; }
		#top-panel .columns { margin-bottom:20px;}
		#top-panel .location-map iframe { width:420px; height:200px;}		
		#contacts-form input[type=text], #contacts-form input[type=password], #contacts-form input[type=email] { width:190px;}
		#contacts-form textarea { width: 410px; }
		#contact-info li { width:165px; padding-right:20px; }
		#latest-posts .mejs-container {width:165px !important;}
		#latest-posts .block .text { height: 110px;}
		#latest-posts .block { width:195px; height:181px; }
		.image-post { width: 394px; }
		.entry-post { width: 420px; }
		.entry-post .stack { width: 376px; height: 180px; }
		.meta-post .tags { display: none; }		
		.meta-post { width: 92%; }
		.image-post iframe { height: 225px; }
		.format-audio .stack { height: 60px; }
		.format-quote .stack { height: 122px; }
		.format-link .stack { height: 72px; }
		.format-aside .stack { height: 60px; }
		#sidebar, #sidebar-left  { margin-top: 50px; }
		.format-video .stack { height: 208px; }
		.format-audio .audio-wrapper { width: 326px; }	
		.format-quote .image-post { height: 190px; }
		.format-quote .stack { height: 172px; }
		.format-aside .image-post { height: 95px; }		
		.format-aside .stack { height: 77px; }		
		 #slidesjs-container img {	height: 197px; }		
		 #slidesjs-container, .slides_container {	height: 197px; }		 
		.format-gallery img { width: 394px; }
		.format-gallery .image-post { height: 197px; }
		.thumbs li img { width: 67px; height: 67px; }		
		#searchform input[type=text] {  width: 379px; background-position: 383px -759px;}
		.widget.video iframe { height: 200px; }
		.four-column img { width: 168px; }
		#comments-block { width: 420px; }
		#comments-form { width: 420px; }				
		#comments-form textarea { width: 410px; }
		.portfolio-4 .mask .link-icon, .portfolio-3 .mask .link-icon { top: 134px; left: 147px; }
		.portfolio-4 .columns:hover .mask .zoom-icon, .portfolio-3 .column:hover .mask .zoom-icon { top: 67px; left: 57px; }
		.portfolio-4 .columns:hover .mask .link-icon, .portfolio-3 .column:hover .mask .link-icon { top: 67px; left: 89px; }	
		.portfolio-4 .stack .title { width: 160px; }
		.portfolio-3 .stack .title { width: 160px; }	
		
		.image-item { width: 406px; }
		.image-item .mask { width: 406px; height: 203px; }		
		.format-video .image-item { height: 235px; }
		.format-gallery .image-item img { width: 406px; }
		.format-gallery .image-item { height: 197px; }
		.items-info { width: 364px; }
		.text-item { padding-right: 0; }
		.divider-item-1px { margin-top: 50px !important; }
		
		#menu { margin-top: 0px; }
		#topcontrol	{ display: none; }
		.google-map iframe { width: 406px; }
		#contacts-form-main input[type=text], #contacts-form-main input[type=password], #contacts-form-main input[type=email] { width: 190px; }
		#contacts-form-main textarea { width: 410px; }	
		
		#products .slides_container { width:420px;	height: 221px; }
		#products .slides_control img {	height: 207px; width: 406px; }
		#products a.prev, #products a.next { top: 185px; }
		#products a.prev { left: 342px; }
		#products a.next { left: 375px; }
		#products .pagination { padding-left: 0px; }	
		#products .pagination li a { width:203px; }
		#products .pagination li img { width: 203px; }
		#products .pagination { margin-top: 20px; }		
	}

	/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
	@media only screen and (max-width: 479px) {		
		
		#nav { display:none;}
		#secondary-nav { display:none; }
		#footer-social { float:left; }
		.jcarousel-skin-tango .jcarousel-next-horizontal { right:0; }
		.jcarousel-skin-tango .jcarousel-prev-horizontal { right: 43px;}
		.jcarousel-skin-tango .jcarousel-item { width: 300px !important; }
		.jcarousel-skin-tango .jcarousel-item-horizontal {margin-right: 20px;}				
		#latest-projects .block, #latest-posts .block, .portfolio-4 .block { width:295px; height:inherit; }
		#latest-projects .stack, #latest-posts .stack, .portfolio-4 .stack { width:295px; height:274px; }
		#latest-projects .block img, #latest-posts .block img, .portfolio-4 .block img { width:283px; height:262px; }
		#latest-projects .block .mask, #latest-posts .block .mask, .portfolio-4 .block .mask { width:283px; height:261px; }
		.nav-projects .viewall { display:none;}
		#clients .block { width:298px;}
		#clients .block img { width:298px;}
		#info-block ul li > div { height: 85px; width: 270px; }
		#latest-projects .block iframe, #latest-posts .block iframe, .portfolio-4 .block iframe { width:283px; height:262px; }
		.fix-fish-menu select {	display:block; }
		#menu { float: none; }
		#clients .columns { padding-bottom:20px; }
		.ribbon-front { left: 1px; }
		.ribbon-edge-topleft, .ribbon-edge-bottomleft { display:none; }
		#footer-social li { margin-right: 5px; margin-left: 0px; }
		#top-panel .columns { margin-bottom:20px;}		
		#contacts-form input[type=text], #contacts-form input[type=password], #contacts-form input[type=email] { width:130px;}
		#contacts-form textarea { width: 290px; }
		#contact-info li { width:275px; }
		#latest-posts .mejs-container {width:265px !important;}
		#latest-posts .block .text { height: 200px;}
		#latest-posts .block { width:295px; height:274px; }
		
		.image-post { width: 274px; }
		.entry-post { width: 300px; }
		.entry-post .stack { width: 256px; height: 120px; }
		.meta-post .tags, .meta-post .comments, .meta-post .author { display: none; }	
		.meta-post { width: 90%; }
		.image-post iframe { height: 159px; }
		.format-audio .stack { height: 60px; }
		.format-link .stack { height: 72px; }
		.format-aside .stack { height: 60px; }
		#sidebar, #sidebar-left { margin-top: 50px; }
		.format-video .stack { height: 144px; }
		.format-audio .audio-wrapper { width: 206px; }	
		.format-quote .image-post { height: 265px; }
		.format-quote .stack { height: 247px; }
		.format-aside .image-post { height: 116px; }		
		.format-aside .stack { height: 98px; }				
		 #slidesjs-container img {	height: 137px; }		
		 #slidesjs-container, .slides_container {	height: 137px; }		 
		.format-gallery .image-post { height: 137px; }
		.format-gallery img { width: 274px; }		
		ul.nav-pagination li { margin-right: 4px; }
		ul.nav-pagination li.last { margin-right: 0 !important; }		
		#searchform input[type=text] {  width: 270px; background-position: 270px -759px;}
		.widget.video iframe { height: 200px; }	
		.four-column img { width: 270px; }
		#comments-block { width: 300px; }
		#comments-form { width: 300px; }				
		#comments-form textarea { width: 290px; }
		.portfolio-4 .mask .link-icon, .portfolio-3 .mask .link-icon { top: 236px; left: 257px; }		
		.portfolio-4 .columns:hover .mask .zoom-icon, .portfolio-3 .column:hover .mask .zoom-icon { top: 117px; left: 113px; }
		.portfolio-4 .columns:hover .mask .link-icon, .portfolio-3 .column:hover .mask .link-icon { top: 117px; left: 145px; }
		.item-block { margin-bottom: 30px !important; }
		.portfolio-4 .stack .title { width: 265px; }
		.portfolio-3 .stack .title { width: 265px; }	
		
		.image-item { width: 286px; }
		.image-item .mask { width: 286px; height: 143px; }		
		.format-video .image-item { height: 165px; }
		.format-gallery .image-item img { width: 286px; }
		.format-gallery .image-item { height: 137px; }
		.items-info { width: 244px; }
		.text-item { padding-right: 0; }
		.divider-item-1px { margin-top: 50px !important; }
		
		#menu { margin-top: 0px; }
		#topcontrol	{ display: none; }
		.google-map iframe { width: 286px; }
		#contacts-form-main input[type=text], #contacts-form-main input[type=password], #contacts-form-main input[type=email] { width: 290px; }
		#contacts-form-main textarea { width: 290px; }	
		
		#products .slides_container { width:300px;	height: 158px; }
		#products .slides_control img {	height: 144px; width: 286px; }
		#products a.prev, #products a.next { top: 122px; }
		#products a.prev { left: 222px; }
		#products a.next { left: 255px; }
		#products .pagination { padding-left: 0px; }	
		#products .pagination li a { width:143px; }
		#products .pagination li img { width: 143px; }
		#products .pagination { margin-top: 20px; }		
	
		}


/* #Font-Face
================================================== */
/* 	This is the proper syntax for an @font-face file
		Just create a "fonts" folder at the root,
		copy your FontName into code below and remove
		comment brackets */

/*	@font-face {
	    font-family: 'FontName';
	    src: url('../fonts/FontName.eot');
	    src: url('../fonts/FontName.eot?iefix') format('eot'),
	         url('../fonts/FontName.woff') format('woff'),
	         url('../fonts/FontName.ttf') format('truetype'),
	         url('../fonts/FontName.svg#webfontZam02nTh') format('svg');
	    font-weight: normal;
	    font-style: normal; }
*/

#options {width:457px; margin:20px auto; text-align:right; color:#9ac1c9}
#options a {text-decoration:none; color:#9ac1c9}
#options a:hover {color:#033}

#acc {width:457px; list-style:none; color:#033; margin:0 auto 40px}
#acc h3 {width:443px; border:1px solid #9ac1c9; padding:6px 6px 8px; font-weight:bold; margin-top:5px; cursor:pointer; background:url(images/header.gif)}
#acc h3:hover {background:url(images/header_over.gif)}
#acc .acc-section {overflow:hidden; background:#fff}
#acc .acc-content {width:425px; padding:15px; border:1px solid #9ac1c9; border-top:none; background:#fff}

#nested {width:425px; list-style:none; color:#033; margin-bottom:15px}
#nested h3 {width:411px; border:1px solid #9ac1c9; padding:6px 6px 8px; font-weight:bold; margin-top:5px; cursor:pointer; background:url(images/header.gif)}
#nested h3:hover {background:url(images/header_over.gif)}
#nested .acc-section {overflow:hidden; background:#fff}
#nested .acc-content {width:393px; padding:15px; border:1px solid #9ac1c9; border-top:none; background:#fff}
#nested .acc-selected {background:url(images/header_over.gif)}




/* ------------------------------------------------
				Stupid IE
------------------------------------------------ */
.ie.ie8 .jcarousel-item .ribbon-wrapper, .ie.ie7 .jcarousel-item .ribbon-wrapper { display: none; }
.ie.ie8 .columns:hover .ribbon-wrapper, .ie.ie7 .columns:hover .ribbon-wrapper { display:block; }
.ie.ie8 .portfolio-4 .mask .zoom-icon,
.ie.ie8 .portfolio-4 .mask .link-icon,
.ie.ie8 .portfolio-3 .mask .zoom-icon,
.ie.ie8 .portfolio-3 .mask .link-icon,
.ie.ie8 .image-item .zoom-icon {	display: none; }

.ie.ie8 .portfolio-4 .columns:hover .mask .zoom-icon, 
.ie.ie8 .portfolio-4 .columns:hover .mask .link-icon,
.ie.ie8 .portfolio-3 .column:hover .mask .zoom-icon, 
.ie.ie8 .portfolio-3 .column:hover .mask .link-icon, 
.ie.ie8 .image-item:hover .zoom-icon { display:block; }



 

/* shadow boxes or images ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

.container {padding-left:10px;}
.shadow {float:left;}
.frame {
	position: relative;
	background: #fff;
	padding: 10px;
	display: block;
	-moz-box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.6);
	-webkit-box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.6);
	box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.6);
	width: 150;
	height: 150;
}



.shadowtext {
	font-family: Verdana, Geneva, sans-serif;
	font-size: 100%;
}

		   

.title {
	position: center;
	color: #666;
}


.floatleft2 {
  float: left;
  margin-right: 10px;
}

.floatright2 { 
	text-align:center;
  margin-left: 10px;
	padding-left: 20px;
}
 
	.subheading {
	font-family: Verdana, Geneva, sans-serif;
	font-size: 1.2em;
	font-style: normal;
	line-height: normal;
	color: #630;
}





/* JC css    ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */



.indexpgh {
	position: center;
	color: #938AA0; 
	font-size:20px;
	font-weight: 100;
}

.colored-bgjc {
	background-color: #CCFF00;
}
.mntn-bgjc {
	background-image: url(../gallery-banners/snowmountain-studio1200w_webcr-thintop.jpg) ;
	 height: 400px; 
     background-attachment: fixed;
     background-repeat: no-repeat;      
     background-size: 100%;  
 }
 
 /**/

.pjc {
 	color: #fff;
	font-size: 45px;
}

.whitetextcenter {
	font-size: 18px;
	color: #ffffff;
	font-weight: bolder;
	text-align: center; 
	padding-top: 1%;
}
.greytextcenter {
	font-size: 14px;
	color: #b4b4b4;
	font-weight: bolder;
	text-align: center; 
	padding-top: 1%;
}

.copyright2 {
	color: #666666;
	font-size: 12px;
	text-align: right;
}

.copyright3 {
	color: #666666;
	font-size: 10px;
	text-align: center;
}

.siteupdate {
	color: #747172;
	font-size: 12px;
	text-align: left;
}

.pageheading {
	font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", serif;
	font-size: 20px;
	font-style: normal;
	color: #ffffff;
	font-weight: normal;
	text-align: left;
	padding-top: 10px;
	padding-bottom: 10px;
	}


 
 
.image_jccover{
    width: auto;
	 height: 100%;
	 background:url(../gallery-banners/snowmountain-studio1200w_webcr-thintop.jpg);
     background-attachment: fixed;
     background-repeat: no-repeat;      
     background-size: cover;  
 }
 
 
 
 .textfoot {
	padding-top: 1em;
	color: #414040;
	text-align: left;
	font-size: 15px;
	font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, sans-serif;
	line-height: 1.5em;
	font-style: normal;
	font-weight: 400;
	}  


 .textfootblue {
	padding-top: 1em;
	color:  #3634A7;
	text-align: left;
	font-size: 14px;
	font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, sans-serif;
	line-height: 1.5em;
	font-style: normal;
	font-weight: 400;
	}  



/*  3 scrolls  */

.scroll   {
	background-color: #EDEAFF;
	width: 100%;
	height: 325px;
	overflow: scroll;
	margin-bottom: 30px;
	padding-left: 10px;
	padding-right: 10px;
	font-family: Verdana, Geneva, sans-serif;
	font-size: 100%;
}
  
  
.scrollprints   {
	background-color: #EDEAFF;
	width: 100%;
	height:525px;
	overflow: scroll;
	margin-bottom: 30px;
	padding-left: 10px;
	padding-right: 10px;
	font-family: Verdana, Geneva, sans-serif;
	font-size: 100%;
}
 
.scrollnews  {
background-color:#ffffff;
width:100%;
height: 450px; 
overflow:scroll;
border-left: medium;
border-color: blue;

 }
 
   
 
  
    /* begin gradient transp nav styling */
	
.main-nav {
	border-top: 3px ridge #B51FE5;
	border-bottom: 2px ridge #B51FE5;
	background: #fffff;
	background: linear-gradient(85deg, #EFEFEF, #ffffff, #ffffff, #ffffff, #EFEFEF);
	opacity: 0.7;
	filter: alpha(opacity=50); /* For IE8 and earlier */
	height: 35px;
	z-index: 170;
	margin: 0 auto;
	width: 100%;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	text-align: center;
	word-spacing: 1em;
	padding-top: 5px;
	padding-bottom: 1px;
	-webkit-box-shadow: 0 4px 8px 7px #E8E7E9;
	-moz-box-shadow: 0 4px 8px 7px #E8E7E9;
	box-shadow: 0 4px 8px 7px #E8E7E9;
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 1.1em;
	color: #5D447E;
	font-variant: small-caps;
	font-style: normal;
	font-weight: 600;
	 }
	 

.hovergallery img
{ 
    display: block;
    margin: auto;
-webkit-transform:scale(0.9); /*Webkit: Scale down image to 0.8x original size*/
-moz-transform:scale(0.9); /*Mozilla scale version*/
-o-transform:scale(0.9); /*Opera scale version*/
-webkit-transition-duration: 0.5s; /*Webkit: Animation duration*/
-moz-transition-duration: 0.5s; /*Mozilla duration version*/
-o-transition-duration: 0.5s; /*Opera duration version*/
opacity: 0.6; /*initial opacity of images*/
}
.hovergallery img:hover{
-webkit-transform:scale(1.1); /*Webkit: Scale up image to 3x original size*/
-moz-transform:scale(1.1); /*Mozilla scale version*/
-o-transform:scale(1.1); /*Opera scale version*/
box-shadow:0px 0px 30px gray; /*CSS3 shadow: 30px blurred shadow all around image*/
-webkit-box-shadow:0px 0px 30px gray; /*Safari shadow version*/
-moz-box-shadow:0px 0px 30px gray; /*Mozilla shadow version*/
opacity: 1;
}




/* w3c go to top button*/
 




/* START FLIP SQUARE PICT FRAME BACK AND PICT FRONT 3d */
		.square-flip{
		-webkit-perspective: 1000;
		-moz-perspective: 1000;
		-ms-perspective: 1000;
		perspective: 1000;

		-webkit-transform: perspective(1000px);
		-moz-transform: perspective(1000px);
		-ms-transform: perspective(1000px);
		transform: perspective(1000px);

		-webkit-transform-style: preserve-3d; 
		-moz-transform-style: preserve-3d; 
		-ms-transform-style: preserve-3d; 
		transform-style: preserve-3d; 

		/*border:1px solid #efefef;*/
		
		position:relative;
		float:center;
		margin:20px;

		}
		.square-flip{
			width:200px;
			height:200px;
		}
		.square,.square2{
			width:100%;
			height:100%;
		}
		.square{

			background-size: cover;
			background-position:center center;

			-ms-transition: transform 0.60s cubic-bezier(.5,.3,.3,1);
			    transition: transform 0.60s cubic-bezier(.5,.3,.3,1);
			    -webkit-transition: transform 0.60s cubic-bezier(.5,.3,.3,1);
			overflow: hidden;

			position:absolute;
			top:0;


			-webkit-backface-visibility: hidden; 
			backface-visibility: hidden;
		}
		.square-flip .square{
			-webkit-transform: rotateY(0deg);
			-moz-transform: rotateY(0deg);
			-o-transform: rotateY(0deg);
			-ms-transform: rotateY(0deg);
			transform: rotateY(0deg);
			transform-style: preserve-3d;
			z-index:1;
		}
		.square-flip:hover .square{
			-webkit-transform: rotateY(-180deg);
			-moz-transform: rotateY(-180deg);
			-o-transform: rotateY(-180deg);
			-ms-transform: rotateY(-180deg);
			transform: rotateY(-180deg);
			transform-style: preserve-3d;
		}


		.square2{

			background-size: cover;
			background-position:center center;

			-ms-transition: transform 0.60s cubic-bezier(.5,.3,.3,1);
			    transition: transform 0.60s cubic-bezier(.5,.3,.3,1);
			    -webkit-transition: transform 0.60s cubic-bezier(.5,.3,.3,1);
			overflow: hidden;

			position:absolute;
			top:0;

			-webkit-backface-visibility: hidden; 
			backface-visibility: hidden;
		}
		.square-flip .square2{
			-webkit-transform: rotateY(180deg);
			-moz-transform: rotateY(180deg);
			-o-transform: rotateY(180deg);
			-ms-transform: rotateY(180deg);
			transform: rotateY(180deg);
			transform-style: preserve-3d;
			z-index:1;
		}
		.square-flip:hover .square2{
			-webkit-transform: rotateY(0deg);
			-moz-transform: rotateY(0deg);
			-o-transform: rotateY(0deg);
			-ms-transform: rotateY(0deg);
			transform: rotateY(0deg);
			transform-style: preserve-3d;
		}

		/*Square content*/
		.square-container{
			padding:40px;
			text-align:center;
			position:relative;
			top:50%;

			-ms-transition: transform 0.60s cubic-bezier(.5,.3,.3,1);
			    transition: transform 0.60s cubic-bezier(.5,.3,.3,1);
			    -webkit-transition: transform 0.60s cubic-bezier(.5,.3,.3,1);

		
			-webkit-transform: translateY(-50%) translateX(0px)  scale(1);
			-ms-transform: translateY(-50%) translateX(0px)  scale(1);
	transform: translateY(-50%) translateX(0px)  scale(1);
			transform-style: preserve-3d;
			z-index:2;
		}
		.square-flip:hover .square-container{
			
			-webkit-transform: translateY(-50%) translateX(-650px)  scale(.88);
			-ms-transform: translateY(-50%) translateX(-650px)  scale(.88);
      transform: translateY(-50%) translateX(-650px)  scale(.88);
			transform-style: preserve-3d;

		}

		.square-container2{
			padding:40px;
			text-align:center;
			position:relative;
			top:50%;

			-ms-transition: transform 0.60s cubic-bezier(.5,.3,.3,1);
			    transition: transform 0.60s cubic-bezier(.5,.3,.3,1);
			    -webkit-transition: transform 0.60s cubic-bezier(.5,.3,.3,1);

			
			-webkit-transform: translateY(-50%) translateX(650px) translateZ(60px) scale(.88);
			-ms-transform: translateY(-50%) translateX(650px) translateZ(60px) scale(.88);
      transform: translateY(-50%) translateX(650px) translateZ(60px) scale(.88);

			transform-style: preserve-3d;
			z-index:2;
		}
		.square-flip:hover .square-container2{
			
			-webkit-transform: translateY(-50%) translateX(0px) translateZ(0px) scale(1);
			-ms-transform: translateY(-50%) translateX(0px) translateZ(0px) scale(1);
			transform: translateY(-50%) translateX(0px) translateZ(0px) scale(1);
      transform-style: preserve-3d;
		}



		/*Style text*/
		.square-flip h2{
			color:white;
			font-family: "Open Sans";
			font-weight:700;
			font-size:22px;
		}
		.square-flip h3{
			color:blue;
			font-family: "Open Sans";
			font-weight:500;
			font-size:16px;
			line-height:26px;
		}
		/*Elements*/
		.flip-overlay{
			display:block;  
			/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#e0f3fa+0,d8f0fc+50,b8e2f6+51,b6dffd+100;Shape+2+Style */
background: #e0f3fa; /* Old browsers */
background: -moz-linear-gradient(45deg, #e0f3fa 0%, #d8f0fc 50%, #b8e2f6 51%, #b6dffd 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(45deg, #e0f3fa 0%,#d8f0fc 50%,#b8e2f6 51%,#b6dffd 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(45deg, #e0f3fa 0%,#d8f0fc 50%,#b8e2f6 51%,#b6dffd 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e0f3fa', endColorstr='#b6dffd',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */	width:100%;
			height:100%;
			position:absolute;
			top:0;
		}
		.align-center{
			margin:0 auto;
		}
		.kallyas-button{
			display:block;
			width:160px;
			padding:18px 30px;
			font-family:"Open Sans";
			font-weight:600;
			color:#fff;
			background:#FF2024;
			margin:0 auto;
			border-radius:2px;
			text-decoration:none;

			/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffa067+0,ff2959+49,ff2024+100 */
			background: #ffa067; /* Old browsers */
			background: -moz-linear-gradient(-45deg,  #ffa067 0%, #ff2959 49%, #ff2024 100%); /* FF3.6-15 */
			background: -webkit-linear-gradient(-45deg,  #ffa067 0%,#ff2959 49%,#ff2024 100%); /* Chrome10-25,Safari5.1-6 */
			background: linear-gradient(135deg,  #ffa067 0%,#ff2959 49%,#ff2024 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
			filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffa067', endColorstr='#ff2024',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
		}


		/*ADD SHADOWS OPTIONAL*/
		.square-flip .square .boxshadow, .square-flip .square .textshadow, .square-flip .square2 .boxshadow, .square-flip .square2 .textshadow{
			-ms-transition: 0.60s;
			    transition: 0.60s;
			    -webkit-transition: 0.60s;
		}

		.square-flip .square .boxshadow{
			-webkit-box-shadow: 24px 42px 58px -8px rgba(0,0,0,0.3);
			-moz-box-shadow: 24px 42px 58px -8px rgba(0,0,0,0.3);
			box-shadow: 24px 42px 58px -8px rgba(0,0,0,0.3);
		}
		.square-flip .square .textshadow{
			-webkit-text-shadow: 24px 42px 58px -8px rgba(0,0,0,0.3);
			-moz-text-shadow: 24px 42px 58px -8px rgba(0,0,0,0.3);
			text-shadow: 24px 42px 58px -8px rgba(0,0,0,0.3);
		}
		.square-flip:hover .square .boxshadow, .square-flip:hover .square .textshadow{
			-webkit-box-shadow: 240px 42px 58px -8px rgba(0,0,0,0.0);
			-moz-box-shadow: 240px 42px 58px -8px rgba(0,0,0,0.0);
			box-shadow: 240px 42px 58px -8px rgba(0,0,0,0.0);
		}


		.square-flip .square2 .boxshadow{
			-webkit-box-shadow: 240px 42px 58px -8px rgba(0,0,0,0.0);
			-moz-box-shadow: 240px 42px 58px -8px rgba(0,0,0,0.0);
			box-shadow: 240px 42px 58px -8px rgba(0,0,0,0.0);
		}
		.square-flip .square2 .textshadow{
			-webkit-text-shadow: 240px 42px 58px -8px rgba(0,0,0,0.0);
			-moz-text-shadow: 240px 42px 58px -8px rgba(0,0,0,0.0);
			text-shadow: 240px 42px 58px -8px rgba(0,0,0,0.0);
		}
		.square-flip:hover .square2 .boxshadow, .square-flip:hover .square2 .textshadow{
			-webkit-box-shadow: 24px 42px 58px -8px rgba(0,0,0,0.3);
			-moz-box-shadow: 24px 42px 58px -8px rgba(0,0,0,0.3);
			box-shadow: 24px 42px 58px -8px rgba(0,0,0,0.3);
		}

		
		/*You can delete this style*/
		.centerflipcards{
      display:block;
			width:auto;
      height:440px;
			text-align:center;
			margin:0 auto;
			margin-top:25px;
		}
.clearfix{clear:both;}
.centerflipcards p{
      font-family:"Open Sans";
      font-size:13px;
      margin-top:10px;
      font-weight:700;
}
/* -- end flip 3d -- */

  
	#topbanner {
    height: 200px; 
    background:  url(../gallery-banners/snowmountain-studio1200w_webcr-thintop.jpg) no-repeat;
    background-size: 100% ;	 
	border-bottom:  #9D35D1;
	border-bottom-style:groove;
	border-bottom-width: thin;
	}
	
	  
	  

/* --   modal window   

=====================================*/
 .black_overlay {
display: none;
position: fixed;
top: 0%;
left: 2%;
width: 100%;
height: 100%;
background-color: black;
z-index:1001;
-moz-opacity: 0.8;
opacity:.60;
filter: alpha(opacity=80);
}
.white_content {
display: none;
position: fixed;
top: 1.5%;
right:15%;
width:70%;
padding: 16px;
border: 0;
background-color: white;
z-index:2002;
border-radius:10px;
overflow:auto;
/*height: 40%;*/
-webkit-box-shadow:0px 0px 15px black;/*Safari shadow version*/
-moz-box-shadow:0px 0px 15px black;/* Mozilla shadow version*/
box-shadow:0px 0px 15px black;/*CSS3 shadow: 30px blurred shadow all around form*/
}

.close_lightbox {
display:none;
position:fixed;
top:13%;
right:14%;
/*border-radius:100%;*/
z-index:8000;
background-color:none;
/*border:3px solid white;*/
width:30px;
height:30px;
margin:5px;
color:white;
text-align:center;
font-size:1.5em;
-webkit-box-shadow:0px 0px 0px black;/*Safari shadow version*/
-moz-box-shadow:0px 0px 0px black;/* Mozilla shadow version*/
box-shadow:0px 0px 0px black;/*CSS3 shadow: 30px blurred shadow all around form*/
border:none;

}

.close_lightbox:hover {

position:fixed;
top:13%;
right:14%;
/*border-radius:100%;*/
z-index:3000;
/*background-color:black;
border:3px solid white;*/
width:30px;
height:30px;
margin:5px; 
color:white;
cursor:pointer;
text-align:center;
filter:alpha(opacity=100);
border:none;

-webkit-box-shadow:0px 0px 0px black;/*Safari shadow version*/
-moz-box-shadow:0px 0px 0px black;/* Mozilla shadow version*/
box-shadow:0px 0px 0px black;/*CSS3 shadow: 30px blurred shadow all around form*/
/* CSS3 standard */
opacity:1.0;
}



/* --   line across
=====================================*/

.btop-1px {
	border-top: 1px solid #BDA0BC;
	margin-top:1px; 
}

 .midline-1pxacross {
	border-top: 1px solid Violet;
}

 .midline-1px {
	border-top: 1px solid Violet;
}


/* --   centre imge in box shadowed
=====================================*/

  

div.polaroid {
  width: 100%;
  background-color: white;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  margin-bottom: 25px;
}
 
/* --  text indent 
=====================================*/


.textindent {
  text-indent: 50px;
}

 
 

/* --  triangle notches code pen
=====================================*/

.clear {
  clear: both;
  height: 30px;
  background: purple;
  display: block;
}


.hero {
  display: block;
  position: relative;
  width: 100%;
  height: 200px;
  background-color: black; // fallback bg color
  // background: linear-gradient(rgba(0, 0, 0, 0.45), rgba(0, 0, 0, 0.8)),
  //   url(http://i.imgur.com/k8BtMvj.jpg) no-repeat;
  background-size: cover;
  background-position: top center;
  
  display: flex;
  text-align: center;
  justify-content: center; /* align horizontal */
  align-items: center; /* align vertical */
  color: white;
}
.hero p {
  font-size: 2em;
}

// hfa PNG down arrow
// The image is inserted at it's exact dimensions and cannot be resized.
// Use media query if needed to swap out image for smaller version.
.arrow {
  background: transparent; // transparent notch
  height: 6px; // height of border height
  top: 0;
  position: relative;

  // higher than index of the next row underneath it
  // z-index: 10; 
}
.arrow-divider {
  position: relative;
  margin: 0 auto; // center element
  width: 100%; // fullwidth
}
// arrow image
.arrow-divider:after {
  content: "";
  display: inline-block;
  background: url("https://s3-us-west-2.amazonaws.com/s.cdpn.io/158072/arrow-down-yellow.png")
    no-repeat;
  width: 120px; // width of image
  height: 66px; // width of image
  position: absolute;
  margin-left: -60px; /* Modify so PNG centered */
  left: 50%; /* Centers element */
  top: -30px; // move up or down to show desired location

  z-index: 3;
}
// Yellow divider lines
.arrow-divider span.yellow:before,
.arrow-divider span.yellow:after {
  content: "";
  position: absolute;
  width: 50%;
  height: 0; // position the dividing lines to the top
  border-bottom: 6px solid #ffe900; // dividing lines
  top: -30px; // move up or down to show desired location

  z-index: 2;
}
.arrow-divider span.yellow:before {
  left: -2em; // left dividing line
}
.arrow-divider span.yellow:after {
  right: -2em; // right dividing line
}
// Black divider lines
.arrow-divider span.yellow span:before,
.arrow-divider span.yellow span:after {
  content: "";
  position: absolute;
  width: 50%;
  height: 0; // position the dividing lines to the top
  border-bottom: 30px solid black; // 30px for solid color; 6px for image below
  top: -30px; // move up or down to show desired location

  z-index: 1;
}
.arrow-divider span.yellow span.black:before {
  left: -2em; // left dividing line
}
.arrow-divider span.yellow span.black:after {
  right: -2em; // right dividing line
}

//  Element
.element {
  display: block;
  position: relative;
  width: 100%;
  height: 400px;
  background: linear-gradient(
      -164deg,
      transparent 75%,
      #2a80b9 75%,
      #2a80b9 100%
    ),
    linear-gradient(164deg, transparent 75%, #2a80b9 75%, #2a80b9 100%),
    url(http://i.imgur.com/k8BtMvj.jpg);
  background-size: auto, auto, cover;
  overflow: hidden;
}

// Splash Divider
// Background
.splash {
  overflow: hidden;
  height: 200px;
  background: linear-gradient(rgba(255, 0, 0, 0.45), rgba(255, 0, 0, 0.45)),
    url(http://i.imgur.com/k8BtMvj.jpg) no-repeat;
  background-size: cover;
  background-position: top center;
}
// Divider Lines
.splash-divider {
  position: relative;
  // margin: 20px auto 0 auto;
  margin: 0 auto;
  width: 100%;
  // height: 20px;
  border-bottom: 30px solid transparent;
}
// V-Notch
.splash-divider:after {
  content: "";
  position: absolute;

  top: -25px; // vertical position
  left: 51%; // center the element

  width: 50px; // size of notch same as height
  height: 50px; // size of notch same as width;

  border-left: 2px solid #ffffff; // v-left; notch thickness
  border-bottom: 2px solid #ffffff; // v-right; notch thickness
  box-shadow: -2px 2px 0 rgba(0, 0, 0, 0.15);

  transform: rotate(-45deg) translate(-50%, -50%);
  -webkit-transform: rotate(-45deg) translate(-50%, -50%);
  -ms-transform: rotate(-45deg) translate(-50%, -50%);
  -moz-transform: rotate(-45deg) translate(-50%, -50%);
  -o-transform: rotate(-45deg) translate(-50%, -50%);
}
// Divider lines left and right
.splash-divider span:before,
.splash-divider span:after {
  content: "";
  position: absolute;

  top: 0;

  display: block;

  width: 50%; // center the element
  height: 0; // vertical position; 0 = flush to top

  border-bottom: 2px solid #fff; // thickness of line; match notch thickness
  box-shadow: 0px 2px 0px rgba(0, 0, 0, 0.25);
}
.splash-divider span:before {
  left: -15px; // v-left width relative to notch size
}
.splash-divider span:after {
  right: -15px; // v-right width relative to notch size
}

// Pure CSS Notch (instantly scalable)
.black {
  background: black;
  height: 200px; /*10rem;*/
  color: white;
  display: flex;
  text-align: center;
  justify-content: center; /* align horizontal */
  align-items: center; /* align vertical */
}
// .row2:after {
//   content: "";
//   display: inline-block;
//   height: 400px;
// }
.notch2 {
  position: relative; /* Element position must be relative to absolutely position :after */
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#f6f8f9+0,d7dee3+0,d7dee3+0,e5ebee+32,ffffff+96 */
background: rgb(246,248,249); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(246,248,249,1) 0%, rgba(215,222,227,1) 0%, rgba(215,222,227,1) 0%, rgba(229,235,238,1) 32%, rgba(255,255,255,1) 96%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(246,248,249,1) 0%,rgba(215,222,227,1) 0%,rgba(215,222,227,1) 0%,rgba(229,235,238,1) 32%,rgba(255,255,255,1) 96%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(246,248,249,1) 0%,rgba(215,222,227,1) 0%,rgba(215,222,227,1) 0%,rgba(229,235,238,1) 32%,rgba(255,255,255,1) 96%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f6f8f9', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */

/* above permalink blend Background color to show effect */
  color: white;
  height: 90px;
  max-width: 100%;
  text-align: center;
  display: flex;
  justify-content: center; /* align horizontal */
  align-items: center; /* align vertical */
}
.notch2:after {
  content: ""; /* Required to display content */
  position: absolute; /* Sets the position absolute to the top div */
  top: 0;
  left: 50%; /* Centers element */
  margin-left: -50px; /* Set margin equal to border px so it centers */
  width: 0;
  z-index: 1;
  height: 0;
  border-top: solid 50px #AB79B0; /* Creates the notch */
  border-left: solid 50px transparent; /* Creates triangle effect */
  border-right: solid 50px transparent; /* Creates triangle effect */
#AB79B0}
.notch2 p {
  position: relative;
  top: 0;
  left: 0;
  margin: 50% auto;
}



/*  image slider goes in CP A v i */ 

.slides {
    padding: 0;
    width: 370px;
    height: 300px;
    display: block;
    margin: 0 auto;
    position: relative;
}

.slides * {
    user-select: none;
    -ms-user-select: none;
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    -webkit-touch-callout: none;
}

.slides input { display: none; }

.slide-container { display: block; }

.slide {
    top: 0;
    opacity: 0;
    width: 370px;
    height: 300px;
    display: block;
    position: absolute;

    transform: scale(0);

    transition: all .7s ease-in-out;
}

.slide img {
    width: 100%;
    height: 100%;
}

.nav label {
    width: 200px;
    height: 100%;
    display: none;
    position: absolute;

	  opacity: 0;
    z-index: 9;
    cursor: pointer;

    transition: opacity .2s;

    color: #FFF;
    font-size: 90pt;
    text-align: center;
    line-height: 380px;
    font-family: "Varela Round", sans-serif;
    background-color: rgba(255, 255, 255, .3);
    text-shadow: 0px 0px 15px rgb(119, 119, 119);
}

.slide:hover + .nav label { opacity: 0.5; }

.nav label:hover { opacity: 1; }

.nav .next { right: 0; }

input:checked + .slide-container  .slide {
    opacity: 1;

    transform: scale(1);

    transition: opacity 1s ease-in-out;
}

input:checked + .slide-container .nav label { display: block; }

.nav-dots {
	width: 100%;
	bottom: 9px;
	height: 11px;
	display: block;
	position: absolute;
	text-align: center;
}

.nav-dots .nav-dot {
	top: -5px;
	width: 11px;
	height: 11px;
	margin: 0 4px;
	position: relative;
	border-radius: 100%;
	display: inline-block;
	background-color: rgba(0, 0, 0, 0.6);
}

.nav-dots .nav-dot:hover {
	cursor: pointer;
	background-color: rgba(0, 0, 0, 0.8);
}

input#img-1:checked ~ .nav-dots label#img-dot-1,
input#img-2:checked ~ .nav-dots label#img-dot-2,
input#img-3:checked ~ .nav-dots label#img-dot-3,
input#img-4:checked ~ .nav-dots label#img-dot-4,
input#img-5:checked ~ .nav-dots label#img-dot-5,
input#img-6:checked ~ .nav-dots label#img-dot-6 {
	background: rgba(0, 0, 0, 0.8);
}