
/*--------------------------------------------------Font-family------------------------------------------------------------------*/



@font-face {
font-family: 'JosefinSans Light';
font-style: normal;
font-weight: normal;
src: url(../fonts/JosefinSans-Light.ttf);

}

@font-face {
font-family: 'JosefinSans Bold';
font-style: normal;
font-weight: normal;
src: url(../fonts/JosefinSans-SemiBold.ttf);
}

@font-face {
  font-family: 'JosefinSans Regular';
  font-style: normal;
  font-weight: normal;
  src: url(../fonts/JosefinSans-Regular.ttf);
  }




/*------------------------------------------------------------------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------------------------------------------------------------------*/
/*--------------------------------------------------------------Index Page------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------------------------------------------------------------------*/






/*--------------------------------------------------First fold------------------------------------------------------------------*/



@media screen and (max-width: 1224px)  {
        .mobile-break { 
            
        display: none;
        text-align: justify;
    }
    }

img { 
    max-width: 100%;
    height: auto;

}


body, html{
    margin:0;
   
}
body{
    margin:0;
    font-family: JosefinSans Regular;
}



/*---------------------------------------------------Logo-----------------------------------------------------*/

.logo{
   /* margin: 10px;*/
   float: left;
}


@media screen and (min-width: 1224px)  {
        .logo { 
            
               /* margin-left: 40px;*/
    			margin-top: 20px;
            
    }
    }

@media screen and (max-width: 700px)  {
        .logo 
    {   
        width: 60%;
        height: auto !important;
    
    }
    }

@media screen and (max-width: 320px)  {
        .logo 
    {   
        width: 60%;
        height: auto !important;
    
    }
    }


/*-----------------------------------------------------------Header-------------------------------------------------------------------------*/
header{
    
    position: relative;
    width:100%;
    z-index: 3000;
    top:0;
    background-color: transparent;
    
}

.active
{ 
    background-color: #6400f8;
}


.nav-toggle{
    display:none;
}

.nav-toggle-label{
    position: absolute;
    top:0;
    right:0;
    margin-right: 1em;
    height: 100%;
    display: flex;
    align-items: center;
}

/*.nav-toggle-label span,
.nav-toggle-label span::before,
.nav-toggle-label span::after{
    display: block;
    background: white;
    height:2px;
    width: 1.5em;
    border-radius: 2px;
    position: relative;
}

.nav-toggle-label span::before,
.nav-toggle-label span::after{
    
    content:'';
    position: absolute;
    
}

.nav-toggle-label span::before
{
    bottom: 7px;
}
.nav-toggle-label span::after
{
    top:7px;
}*/


nav{
    position: absolute;
    text-align: right;
    top:100%;
    right:0;
    width: 100%;
    transform: scale(1,0);
    transform-origin: top;
    transition: transform 400ms ease-in-out;
}                    



nav ul{
    list-style: none;
}


nav li{
    margin-bottom: 0.4em;
    margin-top: 10px;
   /* margin-right: 4em;*/
    margin-left:8em;
    text-align: center;

}

@media screen and (min-width: 1224px)  {
        nav li
    {   
     margin-bottom: 0.4em;
    margin-top: -50px;
   /* margin-right: 8em;
    margin-left:-3em;*/
        float: right;
    }
    }




nav a {
    text-decoration:none;
    color:#fffimportant;  
    font-family: 'JosefinSans Regular';
    font-size:1.2em;
    opacity: 0;
    text-align: center;
    transition:opacity 150ms ease-in-out;
}

nav a:hover{
    color:#fff!important;
   
    text-decoration:none;
}


.nav-toggle:checked ~ nav {
    
    transform: scale(1,1);
    
}

.nav-toggle:checked ~ nav a {
    opacity: 1;
    transition: :opacity 250ms ease-in-out 250ms;  
}

*, *::before, *::after{
    box-sizing: border-box;
}


@media screen and (min-width:800px){
    .nav-toggle-label {
        display: none;

    }

    header{
        display: grid;
        grid-template-columns: 1fr auto minmax(600px, 1fr) 1fr;

    }

    
    
    nav {
        all:unset;
        grid-column:1/5;
        display: flex;
        justify-content: flex-end;
        align-items: center;

        
    }
    nav a {
        opacity: 1;
        position: relative;
    }
    
    nav ul{
        display: flex;

    }
    
  
    nav a::before{
        content:'';
        display: block;
        height: 5px;
        background: #00e8ff;
        position: absolute;
        top:-.75em;
        left:0;
        right:0;
        transform: scale(0,1);
        transition: transform ease-in-out 250ms;
        
    }

    nav a:hover::before{
        transform: scale(1,1);
    }

}




/*-------------------------background image (first-fold)--------------------------*/

.background {
 
    background-image: url("../images/bg.png");
    text-align: center;
    background-repeat: no-repeat;
    background-size:cover;
    background-position: center bottom;
    height: auto;
    position: relative;
    width: 100%;
    float: left;
}


/*------------------------------------Main Heading------------------------------------*/

.heading-1{
    
    font-size:36px;
    letter-spacing: 1px;
    line-height: 1.4;
    position:relative;
    float: left;
    text-align:left;
    z-index:1;
    padding-top: 150px;
    margin-left: auto;
    margin-right: auto;
       
}


.heading-1 h1{
    color:white; 
    padding-bottom: 10px;
    font-family: 'JosefinSans Light';

    
}
.heading-1 span{
    color: #00ebff;
    font-family: 'JosefinSans Bold';

    

}

.para-1 p
{
    color:white;
    font-family: 'JosefinSans Light';
    font-size:18px;
    padding-top:30px;
    letter-spacing: 0.7px;
    line-height: 1.5;
    position:relative;
    float:left;
    padding-left: 0;


}



@media screen and (min-width: 320px)  {
    .heading-1 h1, .para-1 p{
 
        /*padding-left:30px;
       padding-right: 30px;*/
    }
    }


@media screen and (min-width: 1224px)  {
    .heading-1 h1{
 
      /*  padding-left: 160px;*/
    	font-size: 57px;
    	line-height: 1.1;
    	margin-top: 25px;
    }
    }

@media screen and (min-width: 1224px)  {
    .para-1 p{
 
        padding-left:160px;
        font-size:20px;
    }
    }


/*--------------------------------Tilted Mobile Image------------------------*/
.device-1 img
{
    height:auto;
    float: right;
    
}


.device-1{
        width: 100%;

}




/*-------------------------------Scroll down Image-----------------------------*/


.scrolldown img{
    text-align: center;
    height: 45px;
    margin-bottom: 20px;

}
.scrolldown {
        width: 100%;
        float: left;

}


/*--------------------------------------------------Second fold------------------------------------------------------------------*/


/*----------------------------------------White Pattern Image------------------------------------------*/
.pattern{
    
    position: absolute;
    z-index:-1;
}

/*-------------------------------------------Purple Box------------------------------------------------*/

* {
  box-sizing: border-box;
}

.column {
  float: left;
  width: 50%;
    margin-top: 20px;
    
}

.column img{
   /* padding-right:30px;
    padding-left:30px;*/
    padding-bottom: 0;
    z-index:5000;
}


@media screen and (min-width: 1200px) {
    .column img{
    
 /*   padding-right:90px;
    padding-left:90px;*/
    padding-bottom: 0;
    padding-top:30px;
        
    
  }
}
@media screen and (max-width: 800px) {
    .column {
    width: 100%;
        
    
  }
}

.row
{
   /* position: absolute;*/
    width:100%;
    float: left;
    z-index:2000;
    left: 0;
}


.row:after {
  content: "";
  display: table;
  clear: both;
}


/*---------------------------------------About Gameville---------------------------*/

.column h1 
{
    font-size:36px;
    text-align: left;
    line-height: 1.3;
    font-family: 'JosefinSans Light';
    padding-left:30px;
    padding-right:30px;
    padding-bottom: 10px;
   
    color:black;

}
.column h1 span
{
    color: #00ebff;
    font-family: 'JosefinSans Bold';
    letter-spacing: 1px;

    
}


@media screen and (min-width: 1224px) {
    .column h1{
 

  }
}


.column p
{
    text-align: justify;
    padding-left: 30px;
    padding-right: 30px;
    font-size:18px;
    color:#aeaeae;
    padding-top:15px;
    line-height: 1.4;
    font-weight: 100;
    font-family: JosefinSans Regular;

}

@media screen and (min-width: 1224px) {
    .column h1, p{
    
    padding-right:90px;
    padding-left:30px;
    padding-bottom: 0;
        
    
  }
}



/*--------------------------------Three Icons Category--------------------------------------*/
.col-4 {
    float: left;
    width: 33.33%;
    padding: 0 10px;
    overflow:hidden;
    position: relative;
   /* top:480px;*/

   
}

.row-1
{
    font-family: 'CustomFont', 'JosefinSans Light';
    width: 100%;
    position: relative;
    float:left;
    left: 0;
    z-index:2000;
    text-align: center;
}

.row-1:after {
    content: "";
    display: table;
    clear: both;
}

/*--------------------------------------Headings-------------------------------------------------------*/

.col-4 h2 {
    font-size:25px;
    padding-bottom: 20px;
    line-height: 1.2;
    font-family: 'CustomFont', 'JosefinSans Regular';
	margin-top: 25px;
    padding-left:45px;padding-right: 45px;
}


@media screen and (min-width: 360px) {
    .column-1 {
    width: 100%;
    display: block;
    top:550px;

  }
}

   
@media screen and (min-width: 340px) {
    .column-1 {
    width: 100%;
    display: block;
    top:550px;

  }
}


@media screen and (min-width: 320px) {
    .column-1 {
    width: 100%;
    display:block;
    top:820px;

  }
}


@media screen and (min-width: 1024px) {
    .column-1 {
    width: 100%;
    display:block;
    top:450px;

  }
}


@media screen and (min-width: 1224px) {
    .column-1 {
    width: 100%;
    display:block;
    top:810px;

  }
}



@media screen and (min-width: 1224px) {
    .row-1 {
    width: 100%;
    display:flex;
    top:-260px;
    padding-right: 70px;
    padding-left: 70px;

  }
}

/*----------------------------------Paragraphs---------------------------------------------------*/
.column-1 p
{
    color:#b7b6b7;
    font-size:18px;
    line-height: 1.5;
    text-align: center;
    padding-bottom: 10px;
    font-family: 'JosefinSans Light';

}


/*------------------------------------------Third-fold----------------------------------------------------*/
/*------------------------------------------Purple background----------------------------------------------------*/

.purple-bg{ 
    /*position: relative;
    top:600px;*/
    background-repeat: no-repeat;
    background-size:cover;
    background-position: center;
    height: auto;
    position: inherit!important;

    
}



@media screen and (min-width: 360px) {
    .purple-bg {
    width: 100%;
        top:900px;

  }
}


@media screen and (min-width: 320px) {
    .purple-bg {
    width: 100%;
    top:1000px;

  }
}


@media screen and (min-width: 375px) {
    .purple-bg {
    width: 100%;
    top:900px;

  }
}


@media screen and (min-width: 1224px) {
    .purple-bg {
    width: 100%;
    top:840px;

  }
}



/*--------------------------------------Purple background color-----------------------------------------------------*/

.bg-2{
    /*height:2600px;*/
    background-color: #3411b0;
    /*margin-top:570px;*/
    border-radius:50% 50% 0 0 / 30px;
     
}



@media screen and (min-width: 375px) {
  .bg-2 {
      height:2680px;
  }
}
@media screen and (min-width: 360px) {
  .bg-2 {
      
      height: 2850px; 

    }
}


@media screen and (min-width:320px) {
  .bg-2 {
      height:2950px;
    
    }
}


@media screen and (min-width:1224px) {
  .bg-2 {
      /*margin-top:80px; */
      height:3090px;
    
    }
}

@media screen and (min-width:768px) {
  .bg-2 {
      height:2500px;
    
    }
}

@media screen and (min-width:411px) {
  .bg-2 {
      height:3400px;
    
    }
}



/*-----------------------------------------Sneek-peek Heading----------------------------------------------------------------*/

.screenshots h2{
    font-size:50px;
    color:white;
    letter-spacing: 1px;
    line-height: 1.4;
   /* position:absolute;*/
    font-family: 'JosefinSans Light';
    z-index:14;
   /* top: 50%;
    left: 50%;
    transform: translate( -50%, -50% );*/
    text-align: center;
    padding:20px;
}
    

.screenshots span{
    color:#00ebff;
    font-family: 'JosefinSans Bold';

    
}

@media screen and (min-width: 320px) {
    .screenshots h2{
    width: 100%;
    top:100px;
        font-size:32px;

  }
}

@media screen and (min-width: 1224px) {
    .screenshots h2{
    width: 100%;
        font-size:44px;

  }
}

@media screen and (min-width: 360px) {
    .screenshots h2{
    width: 100%;
    top:100px;

  }
}


.screenshots p{
    font-size:28px;
   /* position: absolute;*/
    color:white;
    top:590px;
    padding:12px;
    font-family: 'JosefinSans Light';
    text-align: center;
    line-height: 1.6;
    
}



@media screen and (max-width: 320px) {
    .screenshots p{
    width: 100%;
    top:120px;
    font-size:18px;

  }
}



@media screen and (min-width: 360px) {
    .screenshots p{
    width: 100%;
    top:120px;
    font-size:18px;


  }
}

@media screen and (min-width: 1224px) {
    .screenshots p{
    width: 100%;
        font-size:28px;
        
  }
}



/*-----------------------------------------------------------Features---------------------------------------------------------------------*/

.features h2{
   font-size:38px;
   /* position: absolute;*/
    color:white;
    top:850px;
    padding:15px;
    font-family: 'JosefinSans Light';
    text-align: center;
    line-height: 1.4;
}


.features span{
    color:#00ebff;
    font-weight: 900;
    font-family: 'CustomFont', 'JosefinSans Light';

    
}

@media screen and (min-width: 320px) {
    .features h2{
    width: 100%;
    top:520px;
        font-size:28px;

  }
}



@media screen and (min-width: 360px) {
    .features h2{
    width: 100%;
    top:560px;

  }
}

@media screen and (min-width: 1224px) {
    .features h2{
    width: 100%;
    color:white;
    top:980px;
        font-size:44px;


  }
}



/*-----------------------------------------------------Three Mobile Devices----------------------------------------------------------------*/




.mobile-devices {
    text-align: center;
    margin: auto;
    padding:10px;
    z-index:2000;
}

.column-left{ 
    float: left; 
    width: 33.333%;
    padding-right:10px;
}

.column-right
{ float: right;
    width: 33.333%; 
    padding-left:10px;

}
.column-center{
    display: inline-block;
    width: 33.333%;
    margin-top:-10px;
}


@media screen and (min-width: 360px) {
   .mobile-devices {
    width: 100%;


  }
}


@media screen and (min-width: 320px) {
   .mobile-devices {
    width: 100%;


  }
}



@media screen and (min-width: 1200px) {
   .mobile-devices {
    width: 100%;
  
  }
}


@media screen and (min-width: 1200px) {
  .column-center{
    display: inline-block;
    width: 33.333%;
    margin-top:0;
}

}




@media screen and (min-width: 1224px)  {
        .column-left img
    {   
     width:90%;
    }
    }


@media screen and (min-width: 1224px)  {
        .column-right img
    {   
     width:90%;
    }
    }


@media screen and (min-width: 1224px)  {
        .column-center img
    {   
     width:100%;
        margin-top:-40px;
    }
    }


/*-----------------------------------------------------Feature 1---------------------------------------------------------------------------*/



.row-3
{
     /*  position: absolute;*/
        top:1150px;
        z-index:3000;
    width:100%;

}

.row-3:after {
  content: "";
  display: table;
  clear: both;
}


@media screen and (min-width: 320px) {
  .row-3{
    width: 100%;
      top:650px;
  }
}

@media screen and (min-width: 600px) {
  .column-3 {
    width: 100%;
      top:1000px;
  }
}


@media screen and (min-width: 122px) {
  .column-3 {
    width: 100%;
      top:2500px;
  }
}

.column-3 h2{
    font-size:30px;
    color:white;
 
    padding:15px;
    text-align: center;
    line-height: 1.4;
    font-family: 'CustomFont', 'JosefinSans Light';


}


.column-3 span{
    color:#f2b547;
    font-family: 'CustomFont', 'JosefinSans Light';

    
}

.column-3 p{
    text-align: justify;
    line-height: 1.4;
    color:white;
    padding-left:15px; 
    padding-right: 15px;
    padding-bottom:50px;
    font-size:16px;
    font-family: 'JosefinSans Light';

}



/*-----------------------------------------------------Container1---------------------------------------------------------------------------*/
.container1 {
  list-style:none;
  margin: 0;
  padding: 0;
    
}


.item {
  padding: 6px;
  width: 110px;
  height: 110px;
  margin: 10px;
    border-radius: 35px;
  line-height: 100px;
  color: white;
  font-weight: bold;
  font-size: 20px;
  text-align: center;
    font-family: 'CustomFont', 'JosefinSans Light';

}


@media screen and (min-width: 1224px) {
  .item {
margin-top:20px;    
    }
}




.flex {
  padding:0;
  margin:0;
    list-style-type:none;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display:flex;
      -webkit-flex-flow: row wrap;
    
    justify-content: center;

}

 @media screen and (min-width: 768px) {
      
        .break {
  flex-basis: 100%;
  height: 0;
}

      
    }


.box1
{
    background-color: #00d1e8;


}

.box2{
        background-color:#eaad29;

}
.box3{
        background-color: #df317a;


}

.box4{
        background-color: #bb00e0;


}
.box5{
        background-color:#cb192d;


}
.box6{
        background-color:#1483d3;
    
}

.img1
{
       background-image: url('../images/sports.png');
        
}


.img2{
    
    
            background-image: url('../images/arcade.png');    

    
}


.img3
{
    background-image: url('../images/puzzle.png');

    
}


.img4 {
    
    background-image: url('../images/adventure.png');
    
}



.img5 {
    background-image: url('../images/action.png');

}



.img6 {
    
background-image: url('../images/family.png');
    
    
}


@media screen and (min-width: 800px) {
  .row-3  {
    width: 100%;
      top:1100px;
      float: left;    
    }
}

@media screen and (min-width: 800px) {
  .row-3  h2{
    
      text-align: left;
     
       
    }
}

@media screen and (min-width: 800px) {
  .container1  {
    
    
      
    }
}



@media screen and (min-width: 800px) {
    .column-3 h2{
    width: 100%;

    text-align: left;
        
        

  }
}


    @media screen and (min-width: 800px) {
      .column-3 img{
          padding-right: 100px;
        
      }
    }




    @media screen and (min-width: 800px) {
      .column-3 p{
       
          float: left;
       
          font-size:18px;

      }
    }



    


/*------------------------------------------------------Feature 2----------------------------------------------------------*/
.row-4
{
     /*  position: absolute;*/
        top:1850px;
        z-index:3000;

}

.row-4:after {
  content: "";
  display: table;
  clear: both;
}


@media screen and (min-width: 320px) {
  .row-4{
    width: 100%;
      top:1400px;
  }
}


@media screen and (min-width: 360px) {
  .row-4{
    width: 100%;
      top:1400px;
  }
}


@media screen and (min-width: 411px) {
  .row-4{
    width: 100%;
      top:1250px;
  }
}


@media screen and (min-width: 320px) {
  .screenshots p{
   font-size:18px;
    
      
  }
}



.flexFeature h2{
    
    font-size:30px;
    color:white;
    top:1750px;
    padding:15px;
    text-align: left!important;
    line-height: 1.4;
    font-family: 'CustomFont', 'JosefinSans Regular';
}


.flexFeature h2 span{
    color:greenyellow;
    font-family: 'CustomFont', 'JosefinSans Regular';

}

.flexFeature p{
   text-align: justify;
    line-height: 1.4;
    color:white;
    padding-left:15px; 
    padding-right: 15px;
    padding-bottom:50px;
    font-size:16px;
    max-width: 450px;
    font-weight: 100!important;
    font-family: 'JosefinSans Regular'!important;



}


.column-4 img{
    padding-top:10px;
}

.column-2, column-3, column-4{
    text-align: justify;
}


@media screen and (min-width: 800px) {
  .row-4 {
    width: 100%;
      top:1650px;
      float: left;    
    }
}

@media screen and (min-width: 800px) {
  .row-4 h2 {
    
      text-align: right;
      padding-right: 150px;
      
    }
}

@media screen and (min-width: 800px) {
  .row-4 img{
    
    }
}


@media screen and (min-width: 800px) {
    .column-4 h2{
        width:100%;
        top:1000px;
        text-align: right; 
        padding-right:442px;
    } 
}



    @media screen and (min-width: 800px) {
      .column-4 img{
        width: 50%;
          padding-left: 100px;
        



      }
    }




    @media screen and (min-width: 800px) {
      .column-4 p{
        width: 50%;
          top:1990px;
          float: right;
            padding-right: 50px;
          font-size:18px;

      }
    }







/*-------------------------------------------------------Feature 3-----------------------------------------------------------------------------------------------*/


.row-5
{
       /*position: absolute;*/
        top:2550px;
        z-index:3000;

}

.row-5:after {
  content: "";
  display:table;
  clear: both;
}


@media screen and (min-width: 320px) {
  .row-5{
    width: 100%;
          top:2210px;
  }
}


@media screen and (min-width: 360px) {
  .row-5{
    width: 100%;
      top:2200px;
  }
}


@media screen and (min-width: 411px) {
  .row-5{
    width: 100%;
      top:2050px;
  }
}


.column-5 h2{
    font-size:30px;
    color:white;
    top:1750px;
    padding:15px;
    text-align: center;
    line-height: 1.4;
    font-family: 'CustomFont', 'JosefinSans Light';


}


.column-5 span{
    color:#ff0000;
    font-family: 'CustomFont', 'JosefinSans Light';

}

.column-5 p{
   text-align: justify;
    line-height: 1.4;
    color:white;
    padding-left:15px; 
    padding-right: 15px;
    padding-bottom:50px;
    font-size:16px;
    font-family: 'JosefinSans Light';


}



@media screen and (min-width: 1224px) {
    .column-5 h2{
    width: 100%;
   margin-top:200px;
    text-align: left;
        padding-left: 100px;
        
        

  }
}


    @media screen and (min-width: 800px) {
      .column-5 p{
        width: 50%;
          top:1990px;
          float: left;
        padding-left: 100px;
          font-size:18px;

      }
    }


@media screen and (min-width: 800px) {
  .row-5  {
    width: 100%;
      top:2200px;
      text-align: left;    }
}

@media screen and (min-width: 800px) {
  .row-5 h2{
    
      text-align: left;
    }
}

@media screen and (min-width: 800px) {
  .row-5 img{
    
      float: right;
      margin-top:-50px;
    }
}

.column-5 img{
    width:100%;
    padding-left:20px;  
        padding-right:20px;  

    padding-top:5px;

}

    @media screen and (min-width: 1224px) {
      .column-5 img{
        width: 50%;
          margin-top:-150px;
          padding-right:100px;
        
      }
    }

 @media screen and (min-width: 1024px) {
      .column-5 img{
        width: 80%;
          margin-top:-250px;
          padding-right:100px;
        
      }
    }

 
 @media screen and (min-width: 768px) {
      .column-5 img{
        width: 40%;
          margin-top:-150px;
          padding-right:100px;
        
      }
    }

 
 @media screen and (min-width: 600px) {
      .column-5 img{
        width: 40%;
          margin-top:-150px;
          padding-right:100px;
        
      }
    }

 


/*---------------------------------------------------Last Fold(Footer)-----------------------------------------*/


.last-fold{
    background-color: #5710fe;
    height:650px;
  /*  position: relative;*/
    bottom:0;
    width: 100%;
    text-align: center;
    z-index:3000;

}



@media only screen
and (min-device-width : 320px)
and (max-device-width : 360px) {
    
     .last-fold{
    width: 100%;
      top:980px;
}
}

@media only screen
and (min-device-width : 375px) {
    
     .last-fold{
    width: 100%;
      top:840px;
}

}
    
 @media only screen
and (min-device-width : 411px)
{
     .last-fold{
    width: 100%;
      top:280px;
}

}

    
 @media only screen
and (min-device-width : 414px)
{
     .last-fold{
    width: 100%;
      top:260px;
}

}

  @media only screen
and (min-device-width : 768px) 
  {
      .last-fold{
        width: 100%;
      top:100px;
}
}   
  @media only screen
and (min-device-width : 1024px) 
  {
      .last-fold{
        width: 100%;
      top:200px;
}
}
    


    
  @media only screen
and (min-device-width : 1224px) 
  {
      .last-fold{
        width: 100%;
      top:350px;
}
}

@media only screen
and (min-device-width : 320px) 
 {
    

     .last-fold{
         height:690px;
        
     }}


@media only screen
and (min-device-width : 360px) 
 {
    

     .last-fold{
         height:640px;
        
     }}

@media only screen
and (min-device-width : 768px) 
 {
    

     .last-fold{
         height:560px;
        
     }}

@media only screen
and (min-device-width : 1224px) 
 {
    

     .last-fold{
         height:500px;
        
     }}

/*-------------------------------------Footer Logo Image----------------------------------------------------------------------------*/
 
.footer img{
   /* position: relative;*/
    top:40px;
}



/*-------------------------------------Footer Heading----------------------------------------------------------------------------*/


.footer h2{
    font-size: 40px;
    /*position: relative;*/
    top:60px;
    line-height: 1.4;
    color:white;
    font-family: 'CustomFont', 'JosefinSans Light';
    -webkit-font-smoothing: antialiased;
    
   
}

.footer span {
    color:#11e8ff;
    font-family: 'CustomFont', 'JosefinSans Bold';

}




/*---------------------------------------------------------Footer links----------------------------------------------------------------------------*/

.row-6
{
       /*position: relative;*/
        top:100px;
        width:100%;
}

.row-6:after {
  content: "";
  display: table;
  clear: both;
}

.column-6 {
    text-align: center;
    font-size:18px;
    height: 35px;
    width:100%;

    
}


.column-6 a:link{
    color:white;
    font-size:17px;
    text-decoration: none;
    font-family: 'JosefinSans Regular';
    -webkit-font-smoothing: antialiased;
    }

.column-6 h3 a{
    color: white;
    font-family: 'JosefinSans Light';

}

.column-6 h3 a:hover {
  background-color: #3400a2;
}
 




  @media only screen
and (min-device-width : 1224px) 
  {
      .row-6 {
  width: 100%;
font-size:20px;
margin-bottom:30px;
  height: 35px; 
    display:flex;
    text-align: center;
    margin-top:50px;


}
}


.footer h3{
    font-size: 16px;
   /* position: relative;*/
    top:380px;
    bottom:0;
    line-height: 1.9;
    float:left;
    margin-left:40px;
    margin-right:auto;
    color:white;
    font-family: 'JosefinSans Light';
}

   /*--------------------------------------------------Horizontal Rule------------------------------------------------------------*/


.hr-rule{
   /* position: relative;*/
    top:300px;
}

hr{
    background-color:#434769;
    height:1px;
    border:0px;
}


  @media only screen
and (min-device-width : 320px) 
  {
      
.hr-rule{
/*    position: relative;*/
    top:100px;
}
}


   /*--------------------------------------------------Copyright------------------------------------------------------------*/



.copyright{
    font-size: 16px;
 
  
    bottom:0;
    line-height: 1.9;
    
    color:white;
    font-family: 'JosefinSans Regular';}


 @media only screen
and (min-device-width : 320px) 
 {
     .copyright
     {
     
         top:130px;
         text-align: center;

     }}


@media only screen
and (min-device-width : 1224px) 
 {
     .copyright
     {
     
         top:130px;
         text-align: left;
         padding-left:30px; 

     }}





/*------------------------------------------------------------------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------------------------------------------------------------------*/
/*--------------------------------------------------------------Terms & Condition Page------------------------------------------------------------*/
/*------------------------------------------------------------------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------------------------------------------------------------------*/
.bold-text{
    font-weight:600;
    font-family: "JosefinSans Regular";
    font-size: 15px;
  /*  position: relative;*/
    line-height: 1.7;
    color: #353854;
    text-align: left;
}


.list-1 {
list-style-type:disc;
    font-family: 'JosefinSans Regular';
    font-size: 15px;
    /*position: relative;*/
    line-height: 1.7;
    color: #aeaeae;
    text-align: left;
}

.background-1{
    background-color: #7100ff;
     border-radius:0 0 190% 190% / 0 0 100% 100%;
    overflow:hidden;
   /* position: relative;*/
}






@media screen and (min-width: 320px) {
  .background-1{
    width: 100%;
    height: 300px;

      
  }
}


.heading-TC {
    font-size: 38px;
    position: relative;
    top: 95px;
    bottom: 20px;
    text-align: center;
    color: white;
    font-family: 'CustomFont', 'JosefinSans Light';
    -webkit-font-smoothing: antialiased;
    padding-left: 0px;
}



@media screen and (min-width: 320px){
.background-1{
    background-color: #5710fe;
     border-radius:0 0 70% 70% /20%;
    overflow:hidden;
    }}


@media screen and (min-width: 320px){
.sub-heading h2{
    
    font-size:24px;
    
    }
    .sub-heading h3{
    
    font-size:20px;
    
    }

}

@media screen and (min-width: 1024px){
.sub-heading h2{
    
    font-size:36px;
    }}


@media screen and (min-width: 1024px){
.heading-TC {
    
    font-size:40px;
    }}




/*.container{
    
    padding-left:130px;
    padding-right:130px;
}
*/


@media screen and (min-width: 320px) {
  /*.container 
    
    {
   
    padding-left:20px;
    padding-right:20px;
    margin-top:-80px;
    padding-top: 70px;

  }*/
}

@media screen and (min-width: 360px) {
  /*.container {
   
      padding-left:40px;
        padding-right:40px;
      margin-top:-80px;
      text-align: center;
      padding-top: 70px;
      
  }*/
}

@media screen and (min-width: 411px) {
  /*.container {
   
      padding-left:60px;
        padding-right:60px;
      margin-top:-80px;
      text-align: center;
      padding-top: 70px;
      
  }*/
}


@media screen and (min-width: 800px) {
  /*.container {
   
      padding-left:140px;
        padding-right:140px;
      margin-top:-80px;
      padding-top: 70px;
      
  }*/
}



.sub-heading
{
   
    font-size: 40px;
  /*  position: relative;*/
    top:120px;
    bottom:20px;
    padding-top: 100px;
    line-height: 1.5;
    color:#353854;
    text-align: left;
    font-family: 'CustomFont', 'JosefinSans Light';
    -webkit-font-smoothing: antialiased;
}

.sub-heading span{
    color: #10e3fd;
    font-family: 'CustomFont', 'JosefinSans Bold';
    -webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;


}


.sub-heading p{
    font-family: 'JosefinSans Regular';
    font-size: 15px;
    line-height: 1.7;
    word-break:break-word;
    padding-left: 0px!important;
    padding-right: 0px!important;
    color: #aeaeae;
    text-align: left;
}




/*---------footer------------*/
.last-fold-1{
    background-color: #5710fe;
    height:650px;
    position: relative;
    bottom:0;
    width: 100%;
    text-align: center;

}
 
.footer-1 img{
    position: relative;
    top:40px;
}

.footer-1 h2{
    font-size: 40px;
    position: relative;
    top:60px;
    line-height: 1.4;
    color:white;
    font-family: 'CustomFont', 'JosefinSans Light';
    -webkit-font-smoothing: antialiased;
    
   
}

.footer-1 span {
    color:#11e8ff;
    font-family: 'CustomFont', 'JosefinSans Bold';

}


.row-6-1
{
       position: relative;
        top:100px;
        width:100%;
}

.row-6-1:after {
  content: "";
  display: table;
  clear: both;
}

.column-6-1 {
    width: 100%;
    text-align: center;
    font-size:18px;
    height: 35px; 
}


.column-6-1 a:link{
    color:white;
    font-size:17px;
    text-decoration: none;
    font-family: 'JosefinSans Regular';
    -webkit-font-smoothing: antialiased;
    }

.column-6-1 h3 a{
    color: white;
    font-family: 'JosefinSans Light';

}

.column-6-1 h3 a:hover {
  background-color: #3400a2;
}

.footer-1 h3{
    font-size: 16px;
    position: relative;
    top:380px;
    bottom:0;
    line-height: 1.9;
    float:left;
    margin-left:40px;
    margin-right:auto;
    color:white;
    font-family: 'JosefinSans Light';
}


@media only screen
and (min-device-width : 320px)
and (max-device-width : 360px) {
    
     .last-fold-1{
    width: 100%;
      top:150px;
}
}

@media only screen
and (min-device-width : 375px) {
    
     .last-fold-1{
    width: 100%;
      top:180px;
}

}
    
 @media only screen
and (min-device-width : 411px)
{
     .last-fold-1{
    width: 100%;
      top:180px;
}

}

    
 @media only screen
and (min-device-width : 414px)
{
     .last-fold-1{
    width: 100%;
      top:180px;
}

}

    
  @media only screen
and (min-device-width : 768px) 
  {
      .last-fold-1{
        width: 100%;
      top:200px;
}
}
    

    

    
  @media only screen
and (min-device-width : 1024px) 
  {
      .last-fold-1{
        width: 100%;
      top:200px;
}
}
    


  @media only screen
and (min-device-width : 1024px) 
  {
      .row-6-1 {
    width: 100%;
    font-size:20px;
    height: 35px; 
    display:flex;
    text-align: center;
    margin-top:50px;
            

}
}








.hr-rule{
    position: relative;
    top:300px;
}

hr{
    background-color:#434769;
    height:1px;
    border:0px;
    opacity: 0.2;
}


  @media only screen
and (min-device-width : 320px) 
  {
      
.hr-rule{
    position: relative;
    top:100px;
}
}




.copyright{
    font-size: 16px;
  
    line-height: 1.9;
    
    color:white;
    font-family: 'JosefinSans Regular';}


 @media only screen
and (min-device-width : 320px) 
 {
     .copyright
     {
     
         top:130px;
         text-align: center;

     }}



@media only screen
and (min-device-width : 320px) 
 {
    

     .last-fold-1{
         height:670px;
        
     }}


@media only screen
and (min-device-width : 360px) 
 {
    

     .last-fold-1{
         height:620px;
        
     }}

@media only screen
and (min-device-width : 768px) 
 {
    

     .last-fold-1{
         height:560px;
        
     }}

@media only screen
and (min-device-width : 1020px) 
 {
    

     .last-fold-1{
         height:470px;
        
     }}


@media only screen
and (min-device-width : 1000px) 
 {
     .copyright
     {
     
         top:130px;
         text-align: left;
         padding-left:30px; 

     }}






