.tpop_token, .tpop_time, .tpop_priority, .tpop_fromstart, .tpop_repeat {
	border: 2px solid #888;
	padding:5px;
	box-shadow: #444 -20px 20px;
	margin-left: 20px;
    background-color: #ddd;
    color: #000;
}
.tpop_token:before {
    content: "Popup Token: ";
    color: #444;
}
.tpop_time:before {
    content: "Popup Delay: ";
    color: #444;
}
.tpop_time:after {
    content: " seconds";
    color: #444;
}
.tpop_priority:before {
    content: "Popup Priority: ";
    color: #444;
}
.tpop_fromstart:before {
    content: "Popup Delay From Start: ";
    color: #444;
}
.tpop_repeat:before {
    content: "Popup Repeat: ";
    color: #444;
}
.tpop_popup {
    display:none;
}
.tpop_show {
    display:block;
    width:40%;
    height:50%;
    position:fixed;
    background-color: #E5E5E5;
    color: black;
    border:5px solid #458ADE;
    left:30%;
    top:25%;
    z-index:1000;
    border-radius: 19px;
    border-top-right-radius:0px;
    box-shadow: #404040 0px 0px 50px 50px;
	Padding: 20px 20px;
}
.tpop_show p {
    color: black;
}
.tpop_close {
    border-radius:19px;
    width:38px;
    height:38px;
    font-size:20px;
    border: 2px solid black;
    background-color: white;
    position:absolute;
    top:-19px;
    right:-19px;
    text-align:center;
    cursor:pointer;
    color: black;
}
.tpop_close:hover {
    background-color: #E5E5E5;
}

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

@media screen and (max-width: 1100px) {
.tpop_show {
    display:block;
    width:80%;
    height:40%;
    position:fixed;
    background-color: #E5E5E5;
    color: black;
    border:3px solid #458ADE;
    left:10%;
    top:10%;
    z-index:1000;
    border-radius: 19px;
    border-top-right-radius:0px;
    box-shadow: #404040 0px 0px 50px 50px;
	Padding: 20px 20px;
}
}


@media screen and (max-width: 1023px) {
.tpop_show {
    display:block;
    width:80%;
    height:40%;
    position:fixed;
    background-color: #E5E5E5;
    color: black;
    border:3px solid #458ADE;
    left:10%;
    top:10%;
    z-index:1000;
    border-radius: 19px;
    border-top-right-radius:0px;
    box-shadow: #404040 0px 0px 50px 50px;
	Padding: 20px 20px;
}
	
		.h2, h2 {
    font-size: 1.4rem;
	
}
}


@media screen and (max-width: 768px) {
.tpop_show {
    display:block;
    width:80%;
    height:60%;
    position:fixed;
    background-color: #E5E5E5;
    color: black;
    border:3px solid #458ADE;
    left:10%;
    top:10%;
    z-index:1000;
    border-radius: 19px;
    border-top-right-radius:0px;
    box-shadow: #404040 0px 0px 50px 50px;
	Padding: 20px 20px;
}
	
	.h2, h2 {
    font-size: 1.4rem;
	
}
}


@media screen and (max-width: 500px) {

.tpop_show {
    display:block;
    width:80%;
    height:60%;
    position:fixed;
    background-color: #E5E5E5;
    color: black;
    border:3px solid #458ADE;
    left:10%;
    top:10%;
    z-index:1000;
    border-radius: 19px;
    border-top-right-radius:0px;
    box-shadow: #404040 0px 0px 50px 50px;
	Padding: 20px 20px;
}
		.h2, h2 {
    font-size: 1.2rem;
	
}
}