
   .welcome{ 
		 
	 margin: 30px auto;
	 text-align: center;
	 }

  .index-row{
	border: solid thin transparent;
	  display: flex;
      flex-direction: row;	
      max-height: 100%;
      padding: 0px;
      width: 85%;
      margin: 0 auto; 	  
	}

    .index-row > .index-top{	
	  width: 70%;	
	  padding: 0px 40px;	 
	}
	
	.index-row > .index-cxcpast{	    
	  /*width: 30%;*/
	  width: 43%;
      /*padding: 9px 8px 4px 22px;*/  
	}

 .index-container{
	 border: solid thin transparent;
	 display: flex;
     height: 100%;
     padding: 0px 61px;
	  
 } 
 


 .index-row > .index-cxcpast {
    width: 35%;
    padding: 9px 8px 4px 22px;   
    border: solid thin transparent;
}		
	
	
 .logged-out-subjects-left-bar {
    height: 100%;
    width: 27%;
    border: solid 2px transparent;
    position: relative;
    left: -13px;
    padding: 0px 2px;
   }	
  	
   .index-row > .index-top {
      width: 99%;     
      padding: 6px 5px;
      border: solid thin transparent;
  }	
  	
  
  
  .index-sign-up {
      position: relative;
      border: solid thin #0066cc;
      padding: 2px;    
      margin: 0px auto;
      width: 45%;
      border-radius: 3px;
      color: #fff;
      background-color: #0066cc;
      left: -35px;
  }		
	
	
 .sign-up-links {
     display: block;
     position: relative;      
     margin: 0px auto;
     top: 85px;    
     width: 90%;
     left: 11px;
}

  .every-student{
	  left: -8px;      
      font-size: 19px;      
      position: relative;
      top: 130px;
      font-weight: bold;         
      font-style: italic;
      display: block;
	  top: 80px;
  }	  
  
  
  .index-top p{
	   margin-top: 0;
       margin-bottom: 5rem;
	}
	
  
  .index-row-learning-style{
	  display: flex;
      flex-direction: row;	
      height: 100%;
      padding: 0px 61px;
      top: 112px;	  
      	  
	}
  
     .index-row-learning-style > .index-learning-style-text{	
	  width: 70%;	  
	  padding: 0px 40px
	}
  
  
    .index-row-learning-style > .learning-style{
	  width: 30%;
      padding: 9px 8px 4px 22px;
	}
  
  
    
	.index-row-get-started{
	  display: flex;
      flex-direction: row;	
      height: 100%;
      padding: 0px 61px;	  
	}
	
	
	button.get-started-signup { 
       position: relative;
       top: 348px;
	   color: #fff;
       padding: 4px 19px;
       border-radius: 5px;
	   background-color: #0066cc;
	   border: none;
       box-shadow: #D9E3EB 9px 9px;
	}    

  


 .index-learningstyle {
    border: solid thin transparent;
    height: 200px;
    display: block;
    position: absolute;
    top: 434px;
    
  }





 .potential-past-papers{
	 border: solid thin transparent;
     position: relative;
     top: -56px;	 
 }
 
 .discover-your-learning-style{
	 border: solid thin transparent;
     position: relative;
     top: -12px;	 
 }
 
.struggling{
	 border: solid thin transparent;
	 position: relative;
     top: -114px;
 }

.secButton{
    border: solid thin blue;
    border-radius: 5px;
    position: relative;
    bottom: -7px;
    font-size: small;
    color: #007bff;
    width: 100%;
    display: block;
    text-align-last: center;
}

.secButton:hover{	
	text-decoration: none;
	background-color: #007bff;
	color: #f2f2f2;
}


.secButtonD {
    border: solid thin blue;
    padding: 0px 4px;
    border-radius: 5px;
    position: relative;
    bottom: -3px;
    font-size: small;
    color: #007bff;
    margin: 4px auto;
    width: 100%;
    display: block;
	text-align-last: center;
}


.secButtonD:hover{	
	text-decoration: none;
	background-color: #007bff;
	color: #f2f2f2;
}



 .past-papers {
    border: solid thin transparent;
    height: 236px;
    display: block;
    right: 63px;
    position: absolute;
    bottom: -323px;
   }  





 .struggling{
     position: relative;
     top: -61px;
 }


 .signupButon{
	
	color: #f2f2f2;
	bottom: -516px;
    position: absolute;
	width: 278px;
 }
 
 
 /**************** index live********************/
 
 
 
 .front-sections {
     
     border:solid thin transparent;
     display: flex;
     flex-direction: row;
     margin-top: 5px;
     padding: 5px 2px;
    
 }   
   
  .indexSections {
      
      border: solid thin transparent;
      width: 70%;
      position: relative;
      left: 0px;
      margin-right: 8px;
      
  }
   
  .index-learningstyleD {
      top: 442px;
      position: static;
    }
    
    
 .signupButon {
        bottom: -114px;
        right: -8px;
        position: relative;
    }  
    
 /**************** end index live********************/
   
    
 
 
 
 
 

   /* Styles for laptops */
   @media only screen and (min-width: 1280px) {
      .index-containerD {
        //padding: 0px 60px; 
        border: solid thin transparent;
      }
      
    .past-papersD {
        position: relative;
       }
      
    .index-learningstyleD {
      position: static;
    }
      
              
      
     .signupButon {
       bottom: -32px;
       right: 0px;
     }
 }







  /* Styles for desktops  Larger screens (Monitors) */
  @media only screen and (min-width: 1025px) {
      
      
      .index-containerD {
        //padding: 0px 60px; 
        border: solid thin transparent;
        display: flex;
      }
  
  
  .past-papers {
    top:  407px;
    position: relative;
    left: 2px;
  }
  
 .past-papersD {
   position: relative;
 }
  
  .index-row > .index-cxcpast {
    width: 48%;
  }
  
  .signupButon {
     bottom: -88px;
     right: 0px;
  }
  
  
  
  
  
}





   /* Styles for laptops */
   @media only screen and (min-width: 769px) and (max-width: 1024px) {
       
     .welcome {
        margin: 30px auto;
        text-align: center;
        border: solid thin transparent;
        width: 96%;
       }
       
    #welcome.welcome h1 { 
        text-align: left;  
           
       }
       
        
       .index-container {
           border: solid thin transparent;
           padding: 0px;
           
       }
       
       
       .index-containerD {
           border: solid thin transparent;
           padding: 0px;
           
       }
       
      
      .index-learningstyle {
          top: 468px;
      }
       
       
      
      .index-learningstyleD {
          top: 442px;
          position: static;
      }
         
       
     .past-papers {
        bottom: -360px;
        border: solid 1px transparent;
        right: 7px;
     }
     
        
     .past-papersD {
        //bottom: -435px;
        border: solid 1px transparent;
        position: relative;
     }
     
      
    .index-row > .index-cxcpast {
       width: 61%;
       border: solid 1px transparent;
       position: inherit;
   }
   
     
    
    .index-row > .index-cxcpastD {
       width: 41%;
       border: solid 1px transparent;
       position: inherit;
   }
   
  .signupButon {
    bottom: -622px;
    right: 1px;
  }
     
    
}



 
 
 
 /* Styles for tablets */
  @media only screen and (min-width: 481px) and (max-width: 768px) {
          body {
         display: block;
      }

       
      #welcome.welcome h1 {
         font-size: 27px;
         width: 97%;
         text-align: center;
       }
       
      .front-sections {
          display: flex;
          flex-direction: column;
          margin: 8px auto;
       }
       
      .indexSections {
        border: solid thin transparent;
        width: 100%;
        position: relative;
        text-align: justify;
        margin-top: 18px;
     }
     
    h2.discover-your-learning-style {
       border: solid thin transparent;
       position: relative;
       text-align: center;
     }
     
     span.index-learningstyleD img {
       vertical-align: middle;
       border-style: none;
       width: -webkit-fill-available;
     }
     
     
     .index-learningstyleD {
         position: static;
         margin-bottom: 16px;
      }
     
      
     
     .span.past-papersD {
         
         margin-bottom: 16px;
      }
     
     
      span.past-papersD img {
       vertical-align: middle;
       border-style: none;
       width: -webkit-fill-available;
     }
     
     
     
     .index-top p {
       margin-bottom: 3rem;
     }
     
    .signupButon {
      bottom: 52px;
      position: relative;
      width: 100%;
      margin-bottom: -34px;
    }
    
}

 
 

   /*  mobile phones */
   @media (max-width: 480px) {
       
       body {
         display: block;
      }

       
      #welcome.welcome h1 {
         font-size: 27px;
         padding: 0px 7px;
       }
       
      .front-sections {
          display: flex;
          flex-direction: column;
          margin: 8px auto;
       }
       
      .indexSections {
        border: solid thin transparent;
        width: 100%;
        position: relative;
        text-align: justify;
        margin-top: 18px;
     }
     
    h2.discover-your-learning-style {
       border: solid thin transparent;
       position: relative;
       text-align: center;
     }
     
     span.index-learningstyleD img {
       vertical-align: middle;
       border-style: none;
       width: -webkit-fill-available;
     }
     
     
     .index-learningstyleD {
         position: static;
         margin-bottom: 16px;
      }
     
      
     
     .span.past-papersD {
         
         margin-bottom: 16px;
      }
     
     
      span.past-papersD img {
       vertical-align: middle;
       border-style: none;
       width: -webkit-fill-available;
     }
     
     
     
     .index-top p {
       margin-bottom: 3rem;
     }
     
    .signupButon {
      bottom: 52px;
      position: relative;
      width: 100%;
      margin-bottom: -34px;
    }
    
    
    .index-row{
       width: 100%;
       border: solid thin transparent;
    }
}
 
 



  
  
  