/* BASIC STYLES FOR DISPLAYING THE AP EXAM CALCULATOR ON THE SITE WITH JUST THE SHORTCODE */


#ap-exam-calculator-container { 
	display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
 }


#ap-exam-calculator-container h1, .ap-exam-calculator-results h3 {
	font-size: 25px;
	line-height: normal;
	width: 100%;
	/*border-bottom: 3px solid #0063a7;*/
}

#ap-exam-calculator-container input[type="range"] {
	width:80%;
	padding: 1rem 0 !important;
}

#ap-exam-calculator-container .ap-exam-calculator-questions { 
	flex:0 0 70%;
}

.ap-exam-calculator-results {
	flex:0 0 30%;
}

span.slider-value {
	padding:1rem;
}

.ap-exam-calculator-questions select {
	width:80%;
	border-radius:30px;
	border:1px solid #3c9af8;
	outline:1px solid #3c9af8;
	padding:.5rem;
	margin:1rem 0;
}

/*input range styling*/
.ap-exam-calculator-questions input[type=range] {
	height: 25px;
	-webkit-appearance: none;
	margin: 10px 0;
	width: 100%;
	border:none !important;
	border-radius:30px;
  }
  .ap-exam-calculator-questions input[type=range]:focus {
	outline: none;
	border:none !important;
  }
  .ap-exam-calculator-questions input[type=range]::-webkit-slider-runnable-track {
	width: 100%;
	height: 8px;
	cursor: pointer;
	animate: 0.2s;
	box-shadow: 0px 0px 0px #000000;
	background: #3c9af8;
	border-radius: 30px;
	border: 0px solid #000000;
  }
  .ap-exam-calculator-questions input[type=range]::-webkit-slider-thumb {
	box-shadow: 0px 0px 0px #000000;
	height: 20px;
	width: 20px;
	border-radius: 30px;
	background: #001d36;
	cursor: pointer;
	-webkit-appearance: none;
	margin-top: -7px;
  }
  .ap-exam-calculator-questions input[type=range]:focus::-webkit-slider-runnable-track {
	background: #3c9af8;
  }
  .ap-exam-calculator-questions input[type=range]::-moz-range-track {
	width: 100%;
	height: 8px;
	cursor: pointer;
	animate: 0.2s;
	box-shadow: 0px 0px 0px #000000;
	background: #3c9af8;
	border-radius: 30px;
	border: 0px solid #000000;
  }
  .ap-exam-calculator-questions input[type=range]::-moz-range-thumb {
	box-shadow: 0px 0px 0px #000000;
	height: 20px;
	width: 20px;
	border-radius: 30px;
	background: #001d36;
	cursor: pointer;
  }
  .ap-exam-calculator-questions input[type=range]::-ms-track {
	width: 100%;
	height: 8px;
	cursor: pointer;
	animate: 0.2s;
	background: transparent;
	border-color: transparent;
	color: transparent;
  }
  .ap-exam-calculator-questions input[type=range]::-ms-fill-lower {
	background: #3c9af8;
	border: 0px solid #000000;
	border-radius: 2px;
	box-shadow: 0px 0px 0px #000000;
  }
  .ap-exam-calculator-questions input[type=range]::-ms-fill-upper {
	background: #3c9af8;
	border: 0px solid #000000;
	border-radius: 2px;
	box-shadow: 0px 0px 0px #000000;
  }
  .ap-exam-calculator-questions input[type=range]::-ms-thumb {
	margin-top: 1px;
	box-shadow: 0px 0px 0px #000000;
	height: 20px;
	width: 20px;
	border-radius: 30px;
	background: #001d36;
	cursor: pointer;
  }
  .ap-exam-calculator-questions input[type=range]:focus::-ms-fill-lower {
	background: #3c9af8;
  }
  .ap-exam-calculator-questions input[type=range]:focus::-ms-fill-upper {
	background: #3c9af8;
  }

#ap-exam-calculator-container .ap-exam-calculator-questions fieldset {
	border: none;
	font-size: 18px;
	line-height: normal;
	padding:1rem 0;
}

#ap-exam-calculator-container .ap-exam-calculator-questions fieldset label {
	font-weight: 500;
}

#ap-exam-calculator-container .ap-exam-calculator-questions input[type=text] {
	height: 25px; 
	padding: 8px;
}

#ap-exam-calculator-container .ap-exam-calculator-questions input[type=submit] {
	max-width: 150px;
	clear: both;
	align:right;
}

.result-container {
	padding:2rem;
	text-align:center;
	margin-bottom:2rem;
	background:#f2f7fb;
	border-radius:30px;
}

.result-container span#mcq,
.result-container span#frq,
.result-container span#apscore {
    background: #0063a7 !important;
    color: #fff !important;
    font: 600 1.8rem/2.4rem "Meta Pro Large", sans-serif !important;
    border-radius: 50px;
    margin: 2rem auto;
    padding: 0.5rem 3rem 1rem 3rem;
}

#totalCS {
    background: #0063a7 !important;
    display: inline-block;
    color: #fff !important;
    font: 600 1.8rem/2.4rem "Meta Pro Large", sans-serif !important;
    border-radius: 50px;
    margin: 2rem auto;
    padding: 0.5rem 3rem 1rem 3rem;
}

#totalCS span {
	color: #fff !important;
    font-weight: 600 !important;
    font-size: 1.8rem !important;
    line-height: 2.4rem !important;
    font-family: "Meta Pro Large", sans-serif !important;
}


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

	#ap-exam-calculator-container .ap-exam-calculator-questions { 
		flex:0 0 100%;
		padding:1.5rem;
	}
	
	.ap-exam-calculator-results {
		flex:0 0 100%;
		padding:1.5rem;
	}

}

input[type=submit] { display:none; }