/*
Welcome to Custom CSS!

To learn how this works, see http://wp.me/PEmnE-Bt
*/


/*
Controls the scroll to top button
*/


#ssttbutton {
	right: 20px !important;
	bottom: 20px !important;
}

@media (max-width: 767px) {
#ssttbutton {
	right: 0px !important;
	bottom: 0px !important;
}
}

/*
Controls the Content Views lightbox
*/
#cvpboxOverlay {
    background: #24282d !important;
    opacity: 0.75 !important;
}

#cvpboxLoadedContent {
    border: 5px solid #24282d !important;
}

/*
Controls Gtranslate floating menu
*/

.gt_switcher_wrapper {
  left:26px!important;
	top:26px!important;
	z-index:98!important;
	position: absolute!important;	
}

/*
Removes the down arrow
*/
.gt_switcher .gt_selected a:after {
	display:none!important;
}

/*
Controls the dropdown menu height to show all options
*/
.gt_option{
height:inherit!important;
max-height:inherit!important;
}

@media (max-width: 767px) {
.gt_switcher_wrapper {
  left:6px!important;
	top:6px!important;
}
}

/*
Removes the next and previous links from the bottom of Portfolios pages
*/
.single-jetpack-portfolio .nav-links {
  display: none;
}

/*
Controls the text you use for books to make it look like Content Views
*/
.booktext { 
  display: block;
  font-size: 18px;
	line-height: 1.1em;
  margin-left: .2em;
  margin-right: .2em;
  font-weight: bold;
	color: #25282c;
	text-decoration: none;
}

.booktext:hover { 
	color: #c0504e;
}

/*
Allows link to have normal color instead of red. Requires that you add it inside the a tag instead of using the advanced class option.
*/
.linktext { 
	color: #25282c;
	text-decoration: none;
}

.linktext:hover { 
	color: #c0504e;
}

/*
Permanently opens bottom widget & centers text
*/

.widgets-wrapper {
	display: block;
}

.widgets-area .widget {
	opacity: 1;
}

.widgets-trigger {
	display: none;
}

#secondary:after {
	display: none;
}


/*
Controls the line under the page title
*/
.page-header:after, .entry-header:after {
	content: '';
	display: block;
	position: absolute;
	bottom: 0;
	left: 50%;
	margin-left: -32.5%;
	width: 65%;
	height: 1px;
	background: #eeeeee;
}

/*
Removes categories below post titles
*/
.cat-links {
    display: none;
}

/*
Controls the page title
*/
h1.entry-title {
		font-size: 150%;
}

/*
Controls the main menu size and location
*/
.main-navigation  {
	font-size: 85%;
	clear: none;
  width: auto;
  float: center;
  margin-top: -15px;
	margin-left: 0px;
}


/*
Controls the embedded Excel iframe sizing

myExcelDiv controls desktop scaling, and myExcelDiv2 controls mobile scaling

The left attribute crops the right line, and top crops the bottom bar 
*/

#myExcelDiv {
	--extransform: 1;	
	--exscale: calc(1 / var(--extransform) * 100%);
	position: absolute;
	overflow: hidden;
	top: 1px;
  left: 1px;
	width: var(--exscale);
	height: var(--exscale);
	transform: scale(var(--extransform));
	transform-origin: top left;
}

#myExcelDiv2 {
	--extransform2: .975;	
	--exscale2: calc(1 / var(--extransform2) * 100%);
	position: absolute;
	overflow: hidden;
	top: 1px;
  left: 1px;
	width: var(--exscale2);
	height: var(--exscale2);
	transform: scale(var(--extransform2));
	transform-origin: top left;
}

@media (max-width: 960px) {
	#myExcelDiv { 	
		--extransform: 0.76;
	}
		#myExcelDiv2 { 	
		--extransform2: 0.745;
	}
}

/*
The left spaces half the breakpoint delta, also scaled, so that its more centered over every width
*/

@media (max-width: 767px) {
	#myExcelDiv { 	
		--extransform: 0.795;
			left: 10px;
	}
	#myExcelDiv2 { 	
		--extransform2: 0.780;
			left: 10px;
	}
}

@media (max-width: 725px) {
	#myExcelDiv { 	
		--extransform: 0.765;
			left: 10px;
	}
	#myExcelDiv2 { 	
		--extransform2: 0.750;
			left: 9px;
	}
}
	
@media (max-width: 700px) {
	#myExcelDiv { 	
		--extransform: 0.735;
			left: 9px;
	}
	#myExcelDiv2 { 	
		--extransform2: 0.720;
			left: 9px;
	}
}
	
@media (max-width: 675px) {
	#myExcelDiv { 	
		--extransform: 0.705;
			left: 9px;
	}
#myExcelDiv2 { 	
		--extransform2: 0.690;
			left: 9px;
	}
}
	
@media (max-width: 650px) {
	#myExcelDiv { 	
		--extransform: 0.675;
			left: 8px;
	}
	#myExcelDiv2 { 	
		--extransform2: 0.660;
			left: 8px;
	}
}
	
@media (max-width: 625px) {
	#myExcelDiv { 	
		--extransform: 0.645;
			left: 8px;
	}
	#myExcelDiv2 { 	
		--extransform2: 0.630;
			left: 8px;
	}
}
	
@media (max-width: 600px) {
	#myExcelDiv { 	
		--extransform: 0.615;
			left: 8px;
	}
	#myExcelDiv2 { 	
		--extransform2: 0.600;
			left: 8px;
	}
}
	
@media (max-width: 575px) {
	#myExcelDiv { 	
		--extransform: 0.585;
			left: 7px;
	}
	#myExcelDiv2 { 	
		--extransform2: 0.570;
			left: 7px;
	}
}
	
@media (max-width: 550px) {
	#myExcelDiv { 	
		--extransform: 0.555;
			left: 7px;
	}
	#myExcelDiv2 { 	
		--extransform2: 0.540;
			left: 7px;
	}
}
	
@media (max-width: 525px) {
	#myExcelDiv { 	
		--extransform: 0.525;
			left: 7px;
	}
	#myExcelDiv2 { 	
		--extransform2: 0.510;
			left: 6px;
	}
}
	
@media (max-width: 500px) {
	#myExcelDiv { 	
		--extransform: 0.495;
			left: 6px;
	}
	#myExcelDiv2 { 	
		--extransform2: 0.480;
			left: 6px;
	}
}
	
@media (max-width: 475px) {
	#myExcelDiv { 	
		--extransform: 0.465;
			left: 6px;
	}
	#myExcelDiv2 { 	
		--extransform2: 0.450;
			left: 6px;
	}
}
	
@media (max-width: 450px) {
	#myExcelDiv { 	
		--extransform: 0.435;
			left: 5px;
	}
	#myExcelDiv2 { 	
		--extransform2: 0.420;
			left: 5px;
	}
}
	
@media (max-width: 425px) {
	#myExcelDiv { 	
		--extransform: 0.405;
			left: 5px;
	}
	#myExcelDiv2 { 	
		--extransform2: 0.390;
			left: 5px;
	}
}
	
@media (max-width: 400px) {
	#myExcelDiv { 	
		--extransform: 0.375;
			left: 5px;
	}
	#myExcelDiv2 { 	
		--extransform2: 0.360;
			left: 5px;
	}
}
	
@media (max-width: 375px) {
	#myExcelDiv { 	
		--extransform: 0.345;
			left: 4px;
	}
	#myExcelDiv2 { 	
		--extransform2: 0.335;
			left: 4px;
	}
}
	
@media (max-width: 350px) {
	#myExcelDiv { 	
		--extransform: 0.315;
			left: 4px;
	}
	#myExcelDiv2 { 	
		--extransform2: 0.305;
			left: 4px;
	}
}
	
@media (max-width: 325px) {
	#myExcelDiv { 	
		--extransform: 0.285;
			left: 4px;
	}
	#myExcelDiv2 { 	
		--extransform2: 0.275;
			left: 3px;
	}
}
	

/*
Hide charts on mobile while showing the backup content. Accounts for crossover situations when a primary touchscreen has a secondary mouse.
*/
#HideDesktop {
  visibility: hidden;
  display: none;
  }

@media only screen and (hover: none) and (pointer: coarse) {
  #HideMobile {
    visibility: hidden;
		display: none;
  }
	#HideDesktop {
    visibility: visible;
		display: block;
  }
}

@media only screen and (hover: none) and
(any-pointer: fine) {
  #HideMobile {
    visibility: visible;
		display: block;
  }
	#HideDesktop {
    visibility: hidden;
    display: none;
  }
}


/* Control shopping cart icon. Works with Code Snippet.*/
#CartNavbar {
  background-color: clear; 
  position: absolute;
  top: 0;
	left: 0;
  width: 100%; 
	transition: top 0.1s;
}

#CartNavbar a {
  float:right;
	display: block;
	margin-right: 25px;
  padding-top: 20px;
	text-align: center;
	vertical-align: middle;
	color: #8a8a8a;
}
#CartNavbar a:hover {
	color: #333333;
}

@media (max-width: 767px) {
  #CartNavbar a {
	margin-right: 5px;
  padding-top: 5px;
  }

  .hide-supporter-mobile {
	visibility: hidden;
	}
}


/* Controls appearance of the Content Views search bar */
.cvp-live-reset {
	float: right;
	display: none;
}
.cvp-live-submit {
  display: none;
}
.cvp-search-box {
	width: 100%;
}


/* Controls the float-button-container class that displays a button over the My Portfolio image*/
.float-button-container {
  position: relative;
  width: 100%; /* Adjust the width as needed */
}

.float-button-container img {
  width: 100%;
  height: auto; /* Make the image responsive */
	cursor: default; /* Show normal mouse cursor */
}

.float-button-container .mp-btn {
  position: absolute;
  top: 85%;
  left: 50%;
	width: 30%;
  transform: translate(-50%, -50%);
  background-color: #e06d5e;
  color: white;
  font-size: 16px;
	font-weight: 600;
  padding: 14px 22px;
  border: none;
  cursor: pointer;
  border-radius: 15px;
	text-transform: none;
}

.float-button-container .mp-btn:hover {
  opacity: 0.75;
}

@media (max-width: 600px) {
  .float-button-container .mp-btn {
    width: 80%; /* Make the button wider on smaller screens */
  }
}