.onboard{
	position: fixed;
	display: inline-block;
	
	width:  calc(100% - 32px);
	height: calc(100% - 32px);

	max-width: 1200px;


	bottom: -110vh;

	background-color: $c-w;
	overflow: hidden;

	@include bs-1;
	@include align-center;
	
	z-index: 210;	
	//border: 5px solid red;               //←←←←←←←←←←←←←←←←←←←←
 

	& .illustration-onboard{ 
	        position: relative;
	        display: inline-block;
	        width: 100%;
	        height: auto;
	        //min-height: 180px;
	        
	        & img{
	          position: relative;
	          display: inline-block;
	          width: 100%;
	          height: auto;
	          // border: 0.4px solid green;            //←←←←←←←←←←←←←←←←←←←←
	        }

	       //border: 0.4px solid red;            //←←←←←←←←←←←←←←←←←←←←

	}/*illu-top*/




      & .title {  
        padding-left: 12px;
        padding-right: 12px;

        margin-top: 16px;
        font-size: 52px; 
        font-weight: 400;  
        color: #202124;
        

        //border: 0.3px solid purple;               //←←←←←←←←←←←←←←←←←←←←
      }


  
        & .subtitle  { 
        position: relative;
        display: block;

        margin-top: 12px;
        padding-left: 12px;
        padding-right: 12px;

        color: $c-fg;

        font-weight: 500;
        font-size: 16px;
        opacity: 0.54;


        //border: 0.3px solid red;               //←←←←←←←←←←←←←←←←←←←←
     }      

      



      & .des  { 
          padding-left: 12px;
          padding-right: 12px;
          font-size: 16px; 
          font-weight: 400;  
          color: $c-fg;
          line-height: 1.6;
          margin-top: 8px;
        //border: 0.3px solid red;               //←←←←←←←←←←←←←←←←←←←←
     } 






       & .logo  { 
         position: absolute;
         display: inline-block;
         width:  56px;
         height: 56px;
         bottom: 64px;
         left: 8px;


          background:          url('svg/illustrations/gosive-logo-gradiente.svg');
          background-size:     100% auto   !important;
          background-position: center !important;
          background-repeat:   no-repeat !important;


           @include centerTransform;

         // border: 0.3px solid red;               //←←←←←←←←←←←←←←←←←←←←

      }

       & .logo-gray  { 
         position: absolute;
         display: inline-block;
         width:  56px;
         height: 56px;
         top: 16px;
         left: 8px;


          background:          url('svg/illustrations/gosive-logo-gradiente.svg');
          background-size:     100% auto   !important;
          background-position: center !important;
          background-repeat:   no-repeat !important;
          opacity: 0.36;


           @include centerTransform;

         // border: 0.3px solid red;               //←←←←←←←←←←←←←←←←←←←←

      }




	
}