/* popSlide script css (This css controls the functionality of the slider and hence should be edited extremely carefully and backed up before doing so) */

.slider-trigger:hover { cursor: pointer; text-decoration: underline; }
.slider-info { display: none; }

#slideFrame { position: fixed; top: 0; left: 0; right: 0; z-index: 10000; -webkit-transition: background-color 0.15s ease; -o-transition: background-color 0.15s ease; transition: background-color 0.15s ease; height: 100vh; }
#slideFrame.open { background-color: rgba(51,51,51,0.5); -webkit-transition: background-color 0.3s ease; -o-transition: background-color 0.3s ease; transition: background-color 0.3s ease; }
.slideWrapper { width: 100%; height: 100%; position: relative; display: -webkit-box; display: flex; display: -ms-flexbox; }
.sliderCover { height: 100%; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; }
.sliderContent { display: none; background: #fff; width: 700px; position: relative; -webkit-box-shadow: 0 25px 60px rgba(0,0,0,.15); box-shadow: 0 25px 60px rgba(0,0,0,.15); }
.slider-scroll { overflow-y: auto; height: 100%; overflow-x: unset; padding: 85px 40px 110px 75px; }

#slideFrame .sliderClose {
	width: 50px;
	height: 50px;
	display: -webkit-box;
	display: flex;
	display: -ms-flexbox;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	border-radius: 25px;
	background: #036DC2;
	position: absolute;
	left: -25px;
	top: 85px;
	z-index: 100;
	-webkit-box-shadow: 0 10px 20px rgba(0,0,0,.15);
	        box-shadow: 0 10px 20px rgba(0,0,0,.15);
	opacity: 0;
    -webkit-transition: opacity .2s ease-in;
    -o-transition: opacity .2s ease-in;
    transition: opacity .2s ease-in;
}

.sliderClose svg { fill: #fff; stroke: #fff; stroke-width: 1px; }

#slideFrame.open .sliderClose { opacity: 1; }

#slideFrame.left .slider-scroll { padding: 85px 75px 110px 40px; }
#slideFrame.left .sliderClose { left: unset; right: -25px; -webkit-box-shadow: 0 10px 20px rgba(0,0,0,.15); box-shadow: 0 10px 20px rgba(0,0,0,.15); }

/* popSlide content css */

#slideFrame ul { padding-left: 25px; }
#slideFrame li { list-style-type: disc; color: #656565; margin-bottom: 20px; }
#slideFrame li p { display: inline; line-height: 25px; font-size: 16px; }

#slideFrame h2 { margin-bottom: 30px; }
#slideFrame h3 { margin-bottom: 20px; }
#slideFrame h4 { font-size: 16px; }
#slideFrame p { font-weight: 200 !important; margin-bottom: 15px; font-size: 16px; }
#slideFrame .note { font-size: 13px; font-weight: 100; font-style: italic; }
#slideFrame a { color: #036DC2; display: inline-block; margin: 0; }
#slideFrame a:hover { text-decoration: underline; }

#slideFrame .image { margin: 50px 0; display: -webkit-box; display: flex; display: -ms-flexbox; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }
#slideFrame img { display: block; max-width: 100%; max-height: 100%; margin: 0 auto; width: 100%; height: auto; }

#slideFrame .videoratio { height: 0; position: relative; margin: 50px 0; }
#slideFrame .videoratio.two-one { padding-top: 50%; }
#slideFrame iframe { width: 100%; height: 100%; display: block; position: absolute; top: 0; left: 0; }

#slideFrame table { border: 1px solid #ccc; margin: 30px 0 5px; font-size: 14px; }
#slideFrame tr { border-bottom: 1px solid #ccc; }
#slideFrame tr:last-child { border-bottom: none; }
#slideFrame th { font-weight: 400;  color: #505050; padding: 5px; text-align: left; }
#slideFrame td { font-weight: 200; padding: 5px; color: #036DC2; }


@media all and (max-width: 750px) {
	#slideFrame .sliderContent { width: 85%; }
	#slideFrame .slider-scroll { padding: 100px 15px 40px 40px; }
}

@media all and (max-width: 480px) {
	#slideFrame p { font-size: 14px; }
	#slideFrame .note { font-size: 12px; }
	#slideFrame th { font-size: 12px; }
	#slideFrame td { font-size: 12px; }
}