
/*******************************
 * ALERT POPUP 2
 *******************************/

.alertpopup-wrap.alertP2 {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 9899;/*maybe too high???depends on the site so set it high*/
	transition: .2s;
}

.alertP2 .alertpopup {
	position: relative;
	width: 90%;
	max-width: 600px;
	margin: 4rem auto 0 auto;
	text-align: center;
	transition: .2s;
}

@media only screen and (min-width: 960px) {
	.alertP2 .alertpopup {
		margin-top: 12rem;
	}
}

.alertP2 .alertpopup-inner {
	padding: 3rem 2rem;
	border: 10px solid;
}

.alertP2 .alertpopup-inner p:last-of-type {
	margin-bottom: 0;
}

.alertP2 .alertpopup-toggle {
	display: block;
	position: absolute;
	top: 0;
	right: 0;
	width: 24px;
	height: 24px;
	margin-top: 1rem;
	margin-right: 1rem;
	border: 2px solid;
	border-radius: 50%;
	text-align: center;
	overflow: hidden;
	transition: .3s;
}

.alertP2 .alertpopup-toggle i {
	display: block;
	position: relative;
	font-size: 14px;
	top: 50%;
  	-webkit-transform: translateY(-50%);
  	-ms-transform: translateY(-50%);
  	transform: translateY(-50%);
}

.alertP2 .button-alert {
	display: inline-block;
	padding: .65rem 1.25rem;
	font-weight: 700;
	transition: .3s;
}



 /*******************************
 * SVG ICONS
 	- may need to change url for location...or better yet update to match the site
 *********************************************************************************/
 
 @font-face {
  font-family: 'alerticonfont';
  src:
    url('icons/fonts/alerticonfont.ttf?8ikuau') format('truetype'),
    url('icons/fonts/alerticonfont.woff?8ikuau') format('woff'),
    url('icons/fonts/alerticonfont.svg?8ikuau#alerticonfont') format('svg');
  font-weight: normal;
  font-style: normal;
}

[class^="alerticon-"], [class*=" alerticon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'alerticonfont' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.alerticon-bell:before {
  content: "\ea57";
}
.alerticon-bell2:before {
  content: "\ea58";
}
.alerticon-bell3:before {
  content: "\ea59";
}
.alerticon-bubble-notification:before {
  content: "\eaca";
}
.alerticon-bubble-notification2:before {
  content: "\eaee";
}
.alerticon-shield-notice:before {
  content: "\ec33";
}
.alerticon-cloud:before {
  content: "\ec75";
}
.alerticon-cloud-download:before {
  content: "\ec76";
}
.alerticon-cloud-upload:before {
  content: "\ec77";
}
.alerticon-cloud-check:before {
  content: "\ec78";
}
.alerticon-cloud2:before {
  content: "\ec79";
}
.alerticon-cloud-download2:before {
  content: "\ec7a";
}
.alerticon-cloud-upload2:before {
  content: "\ec7b";
}
.alerticon-cloud-check2:before {
  content: "\ec7c";
}
.alerticon-snowflake:before {
  content: "\ecbd";
}
.alerticon-temperature:before {
  content: "\ecbe";
}
.alerticon-temperature2:before {
  content: "\ecbf";
}
.alerticon-weather-lightning:before {
  content: "\ecc0";
}
.alerticon-weather-lightning2:before {
  content: "\ecc1";
}
.alerticon-weather-rain:before {
  content: "\ecc2";
}
.alerticon-weather-rain2:before {
  content: "\ecc3";
}
.alerticon-weather-snow:before {
  content: "\ecc4";
}
.alerticon-weather-snow2:before {
  content: "\ecc5";
}
.alerticon-weather-cloud-wind:before {
  content: "\ecc6";
}
.alerticon-weather-cloud-wind2:before {
  content: "\ecc7";
}
.alerticon-weather-cloud-sun:before {
  content: "\ecc8";
}
.alerticon-weather-cloud-sun2:before {
  content: "\ecc9";
}
.alerticon-weather-cloudy:before {
  content: "\ecca";
}
.alerticon-weather-cloudy2:before {
  content: "\eccb";
}
.alerticon-weather-sun-wind:before {
  content: "\eccc";
}
.alerticon-weather-sun-wind2:before {
  content: "\eccd";
}
.alerticon-sun:before {
  content: "\ecce";
}
.alerticon-sun2:before {
  content: "\eccf";
}
.alerticon-weather-windy:before {
  content: "\ecd3";
}
.alerticon-umbrella:before {
  content: "\ecd5";
}
.alerticon-warning:before {
  content: "\ed4f";
}
.alerticon-warning2:before {
  content: "\ed50";
}
.alerticon-notification:before {
  content: "\ed51";
}
.alerticon-notification2:before {
  content: "\ed52";
}
.alerticon-cancel-circle:before {
  content: "\ed65";
}
.alerticon-spam:before {
  content: "\ed6b";
}
.alerticon-cross:before {
  content: "\ed6c";
}
.alerticon-cross3:before {
  content: "\ed6e";
}
.alerticon-soundcloud:before {
  content: "\ef22";
}
.alerticon-soundcloud2:before {
  content: "\ef23";
}

