@charset "utf-8";
/* CSS Document */
/* Start intro video pages */
/* The Modal (background) */
.loginmodal {
display: none; /* Hidden by default */
position: fixed; /* Stay in place */
z-index: 1; /* Sit on top */
padding-top: 100px; /* Location of the box */
left: 0;
top: 0;
width: 100%; /* Full width */
height: 100%; /* Full height */
overflow: auto; /* Enable scroll if needed */
background-color: rgb(0,0,0); /* Fallback color */
background-color: rgba(0,0,0,0.6); /* Black w/ opacity */
}
/* Modal Content */
.loginmodal-content {
position: relative;
background-color: #ccc;
margin: auto;
padding: 0;
/* border: 1px solid #888; */
max-width: 80%;
max-height: 100%;
box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
-webkit-animation-name: animatetop;
-webkit-animation-duration: 0.4s;
animation-name: animatetop;
animation-duration: 0.4s
}
/* Add Animation */
@-webkit-keyframes animatetop {
from {top:-300px; opacity:0}
to {top:0; opacity:1}
}
@keyframes animatetop {
from {top:-300px; opacity:0}
to {top:0; opacity:1}
}
//The Close Button
.close {
color: #fff;
float: right;
font-size: 28px;
font-weight: bold;
cursor: pointer;
}
.close:hover{
color: #f44336;
cursor: pointer;
}
.close:focus {
color: red;
text-decoration: none;
cursor: pointer;
}
.loginmodal-header {
padding: 2px 16px;
background-color: #333;
color: white;
}
.loginmodal-header h4 {
color: #fff;
}
.loginmodal-body {
background-color: #fff;
min-height: 226px;
padding: 2px auto;
/* border: solid thin blue; */
width: 100%;
}
.loginmodal-body span video{
width: 70%;
height: 500px;
/* padding: 8px 12px; */
margin: 6px auto;
float: left;
border: solid thin green;
}
.loginmodal-footer {
padding: 2px 16px;
background-color: #333;
color: white;
height: 90px;
}
.loginmodal-footer h3 {
color: #fff;
}
.preview-desc{
border: solid thin red;
height: 500px;
min-width: 305px;
float: left;
}
.author-dur{
height: 100px;
min-width: 50%;
border: solid thin #ccc;
float:left;
}
#introVidrow.row {
border: solid thin #ccc;
width: 100%;
margin: 0px auto;
}
.loginmodal-body h5{
padding: 50px;
}
#physics{
/* border: solid thin green; */
height: 100%;
width: 100%;
z-index: 5;
background-color: rgb(0,0,0);
background-color: rgba(0,0,0,0.2);
left: 0;
top: 0;
overflow: auto;
position: fixed;
display: none;
}
#it{
/* border: solid thin green; */
height: 100%;
width: 100%;
z-index: 5;
background-color: rgb(0,0,0);
background-color: rgba(0,0,0,0.2);
left: 0;
top: 0;
overflow: auto;
position: fixed;
display: none;
}
#maths{
/* border: solid thin green; */
height: 100%;
width: 100%;
z-index: 5;
background-color: rgb(0,0,0);
background-color: rgba(0,0,0,0.2);
left: 0;
top: 0;
overflow: auto;
position: fixed;
display: none;
}
#english{
/* border: solid thin green; */
height: 100%;
width: 100%;
z-index: 5;
background-color: rgb(0,0,0);
background-color: rgba(0,0,0,0.2);
left: 0;
top: 0;
overflow: auto;
position: fixed;
display: none;
}
#alenglish{
/* border: solid thin green; */
height: 100%;
width: 100%;
z-index: 5;
background-color: rgb(0,0,0);
background-color: rgba(0,0,0,0.2);
left: 0;
top: 0;
overflow: auto;
position: fixed;
display: none;
}
#capeEcon{
/* border: solid thin green; */
height: 100%;
width: 100%;
z-index: 5;
background-color: rgb(0,0,0);
background-color: rgba(0,0,0,0.2);
left: 0;
top: 0;
overflow: auto;
position: fixed;
display: none;
}
#capeLaw{
/* border: solid thin green; */
height: 100%;
width: 100%;
z-index: 5;
background-color: rgb(0,0,0);
background-color: rgba(0,0,0,0.2);
left: 0;
top: 0;
overflow: auto;
position: fixed;
display: none;
}
#alMaths{
/* border: solid thin green; */
height: 100%;
width: 100%;
z-index: 5;
background-color: rgb(0,0,0);
background-color: rgba(0,0,0,0.2);
left: 0;
top: 0;
overflow: auto;
position: fixed;
display: none;
}
#close{
float: right;
color: #666;
padding-top: 0px;
padding-right:5px;
font-size: 50px;
cursor: pointer;
}
#close:hover{
color: red;
}
.showcontent{
background-color: #E8E8E8;
height: 91%;
width: 60%;
border: solid thin yellow;
margin: auto;
margin-top: 20px;
left: 70px;
}
@media screen and (max-width: 366px){
.showcontent{
max-height: 50%;
width: 100%;
margin-top: 0px;
border: none;
}
video#videoPlayerB{
width: 100%;
}
span#closeB.closed{
z-index: 1;
position: absolute;
right: 2px;
top: 5px;
}
}
@media screen and (min-width: 751px){
.showcontent{
max-height: 98%;
width: 100%;
margin-top: 0px;
border: none;
}
video#videoPlayerB{
width: 100%;
}
span#closeB.closed{
z-index: 1;
position: absolute;
right: 2px;
top: 5px;
}
}
.videospan{
margin-top: 140px;
border: solid thin red;
}
.videos{
width: 100%;
height: 92%;
margin-top: -30px;
margin-bottom: 8px;
/* border: solid thin red; */
}
.signupsuccess{
margin-top: 8px;
background-color: #80ff80;
border: solid thin #80ff80;
}
.form{
padding-top: 15px;
background-color: #80ff80;
width: 100%;
height: 110px;
}
.notloggedin{
/* background-color: #80ff80;
border: solid thin red;*/
color: red;
}
.notloggedin h5{
color: red;
padding-top: 10px;
}
#instructorTop{
/*background-image: url(../images/learning.png);*/
background-image: url(https://chromestudy.s3.amazonaws.com/images/images/learning.png);
min-height: 260px;
width: 100%;
margin: 0px auto;
padding: 12px 40px;
/*border: solid thin blue;*/
text-align: center;
/* background-image:url(./images/learning5.png); */
background-repeat: no-repeat;
background-size: cover;
}
#instructorTop h1{
width: 100%;
margin: 0px auto;
text-align: center;
color: #663d00;
}
#instructorTop h4{
width: 50%;
margin: 40px auto 0px auto;
text-align: center;
color: #000;
}
#instructorTop h3{
width: 50%;
margin: -80px auto 0px auto;
text-align: center;
color: #333;
}
#formtop{
min-height: 80px;
background-color: f1f1f1;
/* border: solid thin blue; */
padding-top: 10px;
width: 100%;
margin: 0px auto;
}
#discover{
min-height: 180px;
background-color: f1f1f1;
border-bottom: solid thin #ccc;
padding-top: 10px;
width: 100%;
margin: 0px auto;
color: #804d00;
}
#potential{
min-height: 184px;
/* border: solid thin green; */
padding: 6px auto;
}
#potential.col-sm-4 img{
/* border: solid thin yellow; */
width: 40px;
display: block;
margin-right: auto;
margin-left: auto;
}
#potential.col-sm-4 h5{
width: 40%;
margin: 2px auto;
text-align: center;
}
hr.formline{
border-top: 3px solid #666;
width: 10%;
margin: 20px auto;
}
#formsection{
margin: 0px auto;
}
#form{
margin: 0px auto;
background-color: #ccc;
}
form#application_form{
background-color: #ccc;
padding:2px 10px;
}
.input{
width: 100%;
/* border: solid thin green; */
}
#input{
width: 100%;
/* border: solid thin green; */
}
#inputs{
background-color: #666;
width: 100%;
/* border: solid thin blue; */
height:50px;
margin-top: 20px;
margin-bottom: 10px;
}
#success{
width: 100%;
height: 60px;
margin-top: 4px;
padding: 12px;
background-color: #1aff1a;
}
form#payform2{
width: 80%;
border: solid thin f1f1f1;
margin: 2px auto;
padding: 4px 0px;
}