﻿
#maindiv {
    max-width:1024px;
    margin:0 auto;
    
}

.mydiv {
    position:fixed;
    top: 50%;
    left: 50%;
    width:340px;
    height:150px;
    margin-top: -75px; /*set to a negative number 1/2 of your height*/
    margin-left: -170px; /*set to a negative number 1/2 of your width*/
    
}

.assessstart{
    position:fixed;
    top: 50%;
    left: 50%;
    width:150px;
    height:150px;
    margin-top: -75px; /*set to a negative number 1/2 of your height*/
    margin-left: -75px; /*set to a negative number 1/2 of your width*/
    
}


.helpboxcss{
    position:fixed;
    top: 50%;
    left: 50%;
    width:400px;
    height:250px;
    margin-top: -125px; /*set to a negative number 1/2 of your height*/
    margin-left: -200px; /*set to a negative number 1/2 of your width*/
    
}

.newnumbutton {
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+0,f3f3f3+50,ededed+51,ffffff+100;White+Gloss+%232 */
background: #ffffff; /* Old browsers */
background: -moz-linear-gradient(-45deg,  #ffffff 0%, #f3f3f3 50%, #ededed 51%, #ffffff 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg,  #ffffff 0%,#f3f3f3 50%,#ededed 51%,#ffffff 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg,  #ffffff 0%,#f3f3f3 50%,#ededed 51%,#ffffff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ffffff',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */

border: 1px solid #000000;
text-align: center;
box-shadow: 1px 1px 1px #808080;
border-radius: 4px;
cursor: pointer;

}

.newfunctionbutton {
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#fceabb+0,fccd4d+50,f8b500+51,fbdf93+100;Orange+3D+%235 */
background: #fceabb; /* Old browsers */
background: -moz-linear-gradient(-45deg,  #fceabb 0%, #fccd4d 50%, #f8b500 51%, #fbdf93 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg,  #fceabb 0%,#fccd4d 50%,#f8b500 51%,#fbdf93 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg,  #fceabb 0%,#fccd4d 50%,#f8b500 51%,#fbdf93 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fceabb', endColorstr='#fbdf93',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
	
box-shadow: 1px 1px 1px #808080;
border-radius: 4px;
cursor: pointer;
border: 1px solid #000000;
text-align: center;

}

.sidebutton{
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#b8e1fc+0,a9d2f3+10,90bae4+25,90bcea+37,90bff0+50,6ba8e5+51,a2daf5+83,bdf3fd+100;Blue+Gloss+%231 */
background: #b8e1fc; /* Old browsers */
background: -moz-linear-gradient(-45deg,  #b8e1fc 0%, #a9d2f3 10%, #90bae4 25%, #90bcea 37%, #90bff0 50%, #6ba8e5 51%, #a2daf5 83%, #bdf3fd 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg,  #b8e1fc 0%,#a9d2f3 10%,#90bae4 25%,#90bcea 37%,#90bff0 50%,#6ba8e5 51%,#a2daf5 83%,#bdf3fd 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg,  #b8e1fc 0%,#a9d2f3 10%,#90bae4 25%,#90bcea 37%,#90bff0 50%,#6ba8e5 51%,#a2daf5 83%,#bdf3fd 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b8e1fc', endColorstr='#bdf3fd',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */

border: 1px solid #000000;
font-size: x-large;
text-align: center;
box-shadow: 1px 1px 1px #808080; 
border-radius: 4px;
cursor:pointer
}

.gobutton {
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#9dd53a+0,a1d54f+50,80c217+51,7cbc0a+100;Green+Gloss+%231 */
background: #9dd53a; /* Old browsers */
background: -moz-linear-gradient(-45deg,  #9dd53a 0%, #a1d54f 50%, #80c217 51%, #7cbc0a 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg,  #9dd53a 0%,#a1d54f 50%,#80c217 51%,#7cbc0a 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg,  #9dd53a 0%,#a1d54f 50%,#80c217 51%,#7cbc0a 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9dd53a', endColorstr='#7cbc0a',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */

border: 1px solid #000000;
text-align: center;
box-shadow: 1px 1px 1px #808080;
border-radius: 4px;
cursor: pointer;
}

.semitransparent{
  background:rgba(255,255,255,0.5);
}

.rotatemessage {
	background: black;
  height: 100%;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  }

.phone {
  height: 100px;
  width: 50px;
  border: 3px solid white;
  border-radius: 10px;
  animation: rotate 1.5s ease-in-out infinite alternate;
  /* display: none; */
}

.message {
  color: white;
  font-size: 1em;
  margin-top: 40px;
  /* display: none; */
}

@keyframes rotate {
  0% {
		transform: rotate(0deg)
	}
	50% {
		transform: rotate(-90deg)
	}
	100% {
		transform: rotate(-90deg)
	}
}

.assessstart{
    position:fixed;
    top: 50%;
    left: 50%;
    width:150px;
    height:150px;
    margin-top: -75px; /*set to a negative number 1/2 of your height*/
    margin-left: -75px; /*set to a negative number 1/2 of your width*/
    
}
.assessbuttoncss {
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,e1e1e1+50,f1f1f1+50,f6f6f6+100;White+Gloss+%231 */
background: #ffffff;
/* Old browsers */background: -moz-linear-gradient(-45deg, #ffffff 0%, #e1e1e1 50%, #f1f1f1 50%, #f6f6f6 100%); /* FF3.6-15 */;
	background: -webkit-linear-gradient(-45deg, #ffffff 0%,#e1e1e1 50%,#f1f1f1 50%,#f6f6f6 100%); /* Chrome10-25,Safari5.1-6 */;
	background: #FFCCCC; /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f6f6f6',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */;
	border: 1px solid #000000;
	font-size: large;
	text-align: center;
	box-shadow: 1px 1px 1px #808080;
	border-radius: 4px;
	cursor: pointer;
}
.assessstartcss {
	font-size: xx-large;
	color: #FFFFFF;
	background-color: #009933;
}
.answerbox {
	border: 1px solid #000000;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	-khtml-border-radius: 5px;
	background-color: #FFFFFF;
	text-align: center;
	font-size: 45px;
	vertical-align: middle;
	margin-bottom: 5px;
	}

.closeinfocss {
	text-align: center;
	font-size: x-large;
	background-color: #FFFFCC;
}

.pausebutton {
	border: 1px solid #000000;
	text-align: center;
	background-color: #FFCCCC;
	font-size: large;
}
