html, body {
max-width: 100%;
margin: 0;
height: 100%;
font-family: Poppins,sans-serif;
background-color: #F9F9F9;
}
label#errMsg {
margin-bottom: 23px;
font-size: 12px;
color: red;
text-align: center;
}
#preloader{
position:fixed;
width:100%;
background:#fff url('../res/a.gif') no-repeat center;
height:100vh;
z-index:9999;
}
/*about styling*/
/*cloud*/
#box{
width: 20%;
margin: 0 auto;
margin-top: 70px;
}
#base{
background: white;
height:60px;
width:150px;
border-radius: 60px;
}
/*ends*/
#icons {
display: flex;
margin: 0 auto;
width: 50%;
justify-content: center;
margin-top:20%;
}
#icons div:hover {
background-color:
#222f43;
font-size: 20px;
}
#icons a{
color:
white !important;
text-decoration: none !important;
}
#icons div {
color:
white;
border-radius: 20px;
background-color:
lightcoral;
width: 30px;
height: 100%;
margin-right: 10px;
box-shadow: 3px 3px lightgray;
transition: all 0.3s ease-in-out;
}
#icons i {
display: flex;
padding: 7px;
justify-content: center;
}
#about {
display: flex;
width: 100%;
height: 90vh;
}
#imgAbt {
width: 50%;
}
#paraAbt {
width: 50%;
}
#cntnAbt p {
font-size: 15px;
line-height: 32px;
padding: 0px 50px;
}
#headAbt p {
font-size: 30px;
font-weight: 400;
padding: 15px 50px;
text-align: center;
border-bottom: 4px double
lightcoral;
border-radius: 42px;
}
#headAbt {
margin: 0 auto;
width: 36%;
padding: 60px 0px;
}
#imgAbt img {
width: 100%;
height: 100%;
max-width: 100%;
}
/*ends here*/
header {
position: fixed;
width: 100%;
left: 0;
top: 0;
z-index: 9998;
transition: all 0.3s ease-out;
}
.nav-colored{
background-color:#222f43;
height:51px!important;
}
nav-transparent{
background-color:transparent;
}
/*
.navbar-toggle {
display: none;
}
*/
#home {
height: 100%;
width: 100%;
}
ul {
list-style: none;
float: right;
}
#profile {
float: left;
margin: 4px 0px;
width: 25%;
}
#profile img {
height: 40px;
width: 40px;
border-radius: 50%;
max-width:100%;
cursor: pointer;
border: 1px solid lightgray;
}
.headerDiv {
margin: 0 auto;
width: 90%;
}
.headerDiv nav{
float:left;
width: 75%;
}
.headerDiv nav li {
padding: 1px 11px;
float: left;
}
#pnlMask {
opacity: 0.5;
position: absolute;
width: 100%;
height: 100%;
background-color:black;
z-index: 1001;
left: 0;
top: 0;
}
nav li a {
text-decoration: none;
color: white;
text-transform: uppercase;
font-size: 12px;
font-family: sans-serif;
font-family: poppins;
font-weight: 1000;
transition: 0.3s font-size ease-in;
}
nav li a:hover {
font-size: 14px;
border-bottom: 2px solid lightcoral;
}
.auto-write {
margin: 0 auto;
position: absolute;
z-index: 9997;
transform: translate(-50%,-50%);
top: 50%;
left: 50%;
width: 70%;
text-align: center;
}
.auto-write p {
color: white;
font-size: 1rem;
letter-spacing: 4px;
text-align: center;
}
#innerTyping {
color:
white;
letter-spacing: 5px;
font-size: 50px;
line-height: 55px;
font-weight: 500;
}
.typed-cursor,.typed-cursor--blink{
color:white;
font-size: 50px;
}
.home-section{
background: url("../res/bg_1398.jpg") no-repeat;
height: 100vh;
width:100vw;
max-width: 100%;
background-size: cover;
}
/* Education Styles*/
#education{
width: 100%;
height:100%;
padding: 100px 0px;
}
#education > div {
display: flex;
}
#headEd {
padding-top: 55px;
margin-bottom: 60px;
margin-left: 0!important;
}
#headEd p img {
width: 38px;
height: 35px;
transform: rotate(14deg);
}
#education > div > div:nth-child(2) p {
letter-spacing: 1px;
}
#education > div {
display: flex;
margin-left: 24%;
}
#education > div > div {
width: 50%;
}
#headEd p {
text-align: center;
border-bottom: 4px double
lightcoral;
width: 20%;
align-self: center;
margin: 0 auto;
padding: 3px;
border-radius: 45px;
font-size:2rem;
}
#pg div:first-child p {
font-weight: 506;
letter-spacing: 2px;
}
#ug div:first-child p {
font-weight: 506;
letter-spacing: 2px;
}
#hs div:first-child p {
font-weight: 506;
letter-spacing: 2px;
}
#intrmdte div:first-child p {
font-weight: 506;
letter-spacing: 2px;
}
/*ends here*/
/* skills styling*/
#skills {
width: 100%;
margin-top: 70px;
padding:100px 0px;
}
#headSkills p{
text-align: center;
border-bottom: 4px double
lightcoral;
width: 20%;
align-self: center;
margin: 0 auto;
padding: 3px;
border-radius: 45px;
font-size:2rem;
margin-bottom: 100px;
}
#headSkills p img {
width: 25px;
height: 29px;
margin-left: 20px;
}
.ionic {
font-size: 42px;
}
hr {
width: 42px;
margin: 0;
border: none;
height: 2px;
background-color: lightcoral;
}
.color-6
{
color: #08a6f3;
}
#skillset div {
width: 23%;
height: 122px;
background-color:
white;
border-bottom-right-radius: 20%;
margin-bottom: 36px;
padding: 60px 40px;
margin-right: 20px;
box-shadow: 0px 1px 2px 0px
rgba(90,91,95,0.15);
transition: all 0.3s ease-in-out;
}
#skillset div:hover {
border-bottom-right-radius: 4px;
box-shadow: 0px 16px 22px 0px rgba(90, 91, 95, 0.3);
top: -5px;
}
#skillset {
width: 90%;
margin: 0 auto;
display: flex;
flex-wrap: wrap;
}
#skillset div img{
width: 50px;
height: 50px;
}
/*ends here*/
/*experience styling*/
#experience{
width: 100%;
clear:both;
padding: 100px 0px;
}
#headExp {
margin-bottom: 60px;
margin-left: 0!important;
}
#headExp p img {
width: 38px;
height: 35px;
transform: rotate(14deg);
}
#arrow-left {
border-width: 10px 15px 10px 0;
border-color: transparent #222f43 transparent transparent;
/* left: 0;*/
/* margin-left: 30px;*/
margin-right: 30px;
}
#arrow-right {
border-width: 10px 0px 10px 15px;
border-color: transparent #222f43;
/* left: 0;*/
/* margin-left: 30px;*/
}
.displayNone{
display: none!important;
}
.arrow {
cursor: pointer;
position: relative;
/* top: 50%;*/
width: 0;
height: 0;
border-style: solid;
}
.wrap {
width: 80%;
height: 200px;
margin: 0 auto;
background-color: white;
padding: 20px;
display: flex;
justify-content: center;
flex-direction: column;
}
.wrap:hover {
box-shadow: 0px 16px 22px 0px
rgba(90, 91, 95, 0.3);
}
#slide {
display: flex;
justify-content: center;
height: 100%;
}
.carousel_slide {
/* position: absolute;*/
height: 100%;
top: 0px;
left: 0px;
}
div#innerContent {
max-height: 200px;
overflow: hidden;
width: 240px;
position: relative;
}
.arrow-container {
display: flex;
justify-content: center;
align-items: center;
flex-direction: row;
}
.carousel_slide > div > div {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
h3 {
color: #222f43;
padding: 0px;
margin: 0px;
}
h4 {
color: lightcoral;
}
#slide p {
margin-top: 1px;
font-size: 14px;
color: teal;
}
#slide img {
width: 240px;
height: 40px;
/* border: 0.5px solid lightcoral; */
}
#mainTrack{
position: relative;
display: flex;
}
/*
@keyframes slider{
0%{
margin-left:0;
}
100%{
margin-left:-300px;
}
25%{
margin-left:-100%;
}
45%{
margin-left:-100%;
}
50%{
margin-left:-200%;
}
70%{
margin-left:-200%;
}
75%{
margin-left:-300%;
}
95%{
margin-left:-300%;
}
100%{
margin-left:-300%;
}
}
*/
.fa-reply::before {
font-size: 30px;
}
#email-id a {
width: 73px;
height: 66px;
background-color:
white;
border-radius: 50%;
display: flex;
text-decoration: none;
justify-content: center;
align-items: center;
box-shadow: 0px 2px 2px 0px
rgba(90, 91, 95, 0.15);
transition: all 0.3s ease-in-out;
}
#email-id a:hover{
box-shadow: 0px 18px 25px 0px
rgba(90, 91, 95, 0.33);
margin-top: -5px;
}
#subdetails div {
width: 50%;
}
#formData {
display: flex;
width: 100%;
margin-top: 6%;
}
.fa.fa-mobile.color-6 {
background-color:
white;
height: 66px;
width: 73px;
border-radius: 50%;
display: flex;
align-items: center;
box-shadow: 0px 2px 2px 0px
rgba(90, 91, 95, 0.15);
transition: all 0.3s ease-in-out;
}
#contactForm {
width: 50%;
}
iframe{
width: 100%;
}
textarea {
width: 100%;
resize: none;
border: 1px solid transparent;
height: 122px;
padding: 6px;
font-size: 16px;
font-weight: normal;
color:#999;
margin-bottom: 30px;
border-radius: 2px;
box-shadow: 1px 1px 5px 2px lightgray;
}
textarea:hover, input:hover{
border: 1.5px solid lightcoral;
color:unset;
}
button {
width: 20%;
height: 40px;
background-color:white;
border-radius: 20px;
border: 1px solid lightcoral;
box-shadow: 1px 1px 6px 2px lightgray;
}
button:hover {
background-color:
lightcoral;
cursor: pointer;
color:
white;
}
#subBtn{
display: flex;
justify-content: center
}
input {
width: 100%;
height: 50px;
padding: 4px 6px;
font-size: 14px;
font-weight: normal;
color: #999;
border-radius: 2px;
border:white 1px solid;
box-shadow: 1px 1px 5px 2px lightgray;
margin-bottom: 25px;
}
.scroll-to-top {
position: fixed;
bottom: 5px;
right: 5px;
background-color:
lightcoral;
cursor: pointer;
color:
white;
width: 51px;
height: 40px;
font-size: 30px;
text-align: center;
padding-top: 7px;
}
form {
display: flex;
flex-direction: column;
padding-left: 20px;
padding-right: 40px;
}
#Map {
border: 2px solid
lightcoral;
margin-bottom: 20px;
width: 50%;
margin-left: 42px;
margin-right: 20px;
}
.fa.fa-mobile.color-6:hover {
box-shadow: 0px 18px 25px 0px
rgba(90, 91, 95, 0.33);
margin-top: -5px;
}
#phoneNo, #email-id {
height: 133px;
width: 137px;
display: flex;
flex-direction: column;
align-items: center;
}
.fa.fa-mobile.color-6::before {
margin: 0 auto;
font-size: 30px;
}
#phoneNo {
height: 133px;
width: 137px;
display: flex;
flex-direction: column;
align-items: center;
}
.color-5 {
color:
lightcoral;
}
#subdetails {
height: 28vh;
display: flex;
margin: 0 auto;
width: 100%;
}
#details {
display: flex;
flex-direction: column;
}
#contact {
width: 90%;
height: 90vh;
margin: 0 auto;
}
#headExp p {
text-align: center;
border-bottom: 4px double
lightcoral;
width: 20%;
align-self: center;
margin: 0 auto;
padding: 3px;
border-radius: 45px;
font-size:2rem;
}
/*experience ends here*/
///////////////*mobile styles*////////////////////////////////////
@media only screen and (max-width:1367px){
#innerTyping{
color: white;
letter-spacing: 3px;
font-size: 33px;
}
.home-section{
background: url("../res/bg_1367.jpg") no-repeat;
height: 100vh;
width:100vw;
max-width: 100%;
/* background-size: 100vw 100vh;*/
background-size: cover;
background-position: 50% 50%;
}
}
@media only screen and (max-width:1080px){
#innerTyping{
color: white;
letter-spacing: 3px;
font-size: 33px;
}
.home-section{
background: url("../res/bg_1086.jpg") no-repeat;
height: 100vh;
width:100vw;
max-width: 100%;
/* background-size: 100vw 100vh;*/
background-size: cover;
background-position: 50% 50%;
}
#skillset div {
width: 21%;
padding: 60px 43px;
}
#headAbt p {
font-size: 20px;
font-weight: 400;
padding: 9px 50px;
}
#headEd p {
width: 25%;
font-size: 1.5rem;
}
#headSkills p {
width: 21%;
font-size: 1.5rem;
}
#headExp p img {
width: 30px;
height: 22px;
}
#headExp p {
width: 25%;
font-size: 1.5rem;
}
.auto-write p {
font-size: 12px;
}
#headAbt {
margin: 0 auto;
width: 40%;
padding: 60px 0px;
}
#education > div {
margin-left: 17%;
}
}
@media only screen and (max-width:970px){
#skillset div {
width: 20%;
}
}
@media only screen and (max-width:867px){
.home-section{
background: url("../res/bg_846.jpg") no-repeat;
height: 100vh;
width:100vw;
max-width: 100%;
/* background-size: 100vw 100vh;*/
background-size: cover;
background-position: 50% 50%;
}
#innerTyping{
color: white;
letter-spacing: 3px;
font-size: 25px;
}
.typed-cursor,.typed-cursor--blink{
color:white;
font-size: 25px;
}
/*Queries for Mobiles*/
#icon
{
margin-top:3px;
position: absolute;
width:100%;
}
#icon-group {
width: 25px;
height: 35px;
z-index: 9999;
cursor: pointer;
margin-top: 21px;
float: right;
position: relative;
}
.center{
height:2px;
width:100%;
background: white;
margin-top: 4px;
transition: all 0.3s ease-in;
}
.after{
height:2px;
background: white;
margin-top:4px;
transition: all 0.2s ease-in;
}
.before{
height:2px;
background: white;
width: 100%;
transition: all 0.2s ease-in;
}
.beforeNext{
transform: rotate(45deg);
transition: all 0.2s ease-in;
}
.centerNext{
height:0px;
width:0px;
transition: all 0.3s ease-in;
}
.afterNext{
margin-top:-2px;
transform: rotate(-45deg);
transition: all 0.3s ease-in;
}
nav ul{
padding: 0px!important;
overflow: hidden;
height:0;
}
.backClass{
background: black;
}
.liopen {
float: none !important;
}
.liopen:hover {
border-bottom: none !important;
}
nav ul.open {
overflow: hidden;
height: 500px;
width: 137%;
background-color:
black;
position: relative;
z-index: 9999 !important;
transition:height 0.5s ease-in;
}
#icon
{
margin-top:3px;
position: absolute;
width:100%;
}
#icons {
display: flex;
margin: 0 auto;
width: 50%;
justify-content: center;
margin-top: 7%;
margin-bottom: 5%;
}
#icon-group {
width: 25px;
height: 35px;
z-index: 9999;
cursor: pointer;
margin-top: 21px;
float: right;
position: relative;
}
.center{
height:2px;
width:100%;
background: white;
margin-top: 4px;
transition: all 0.3s ease-in;
}
.after{
height:2px;
background: white;
margin-top:4px;
transition: all 0.2s ease-in;
}
.before{
height:2px;
background: white;
width: 100%;
transition: all 0.2s ease-in;
}
.beforeNext{
transform: rotate(45deg);
transition: all 0.2s ease-in;
}
.centerNext{
height:0px;
width:0px;
transition: all 0.3s ease-in;
}
.afterNext{
margin-top:-2px;
transform: rotate(-45deg);
transition: all 0.2s ease-in;
}
nav ul{
overflow: hidden;
height: 0px;
width: 137%;
background-color:
#222f43;
position: relative;
z-index: 9999 !important;
transition:height 0.5s ease-in;
}
.liopen {
float: none !important;
}
.liopen:hover {
background-color:
teal;
border-bottom: none !important;
}
.headerDiv nav li{
padding:7px 11px;
float:none;
}
nav ul.open {
transition:height 0.5s ease-in;
height: 250px;
background-color:
#222f43;
}
#contact #headEd {
padding-top: 100px;
}
.auto-write p {
color: white;
font-size: 12px;
letter-spacing: 4px;
text-align: center;
}
#headAbt {
width: 50%;
}
#headAbt p {
font-size: 20px;
}
#education > div {
margin-left: 15%;
}
#skillset div {
width: 19%;
}
#Map {
border: 2px solid
lightcoral;
width: 100%;
margin: 42px auto;
}
#contactForm {
width: 100%;
}
#formData {
flex-direction: column;
}
}
@media only screen and (max-width:800px){
#skillset div {
width: 15%;
}
#skillset {
width: 90%;
margin: 8px auto;
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: center;
}
}
@media only screen and (max-width:700px){
#innerTyping{
color: white;
letter-spacing: 3px;
font-size: 19px;
}
.typed-cursor,.typed-cursor--blink{
color:white;
font-size: 19px;
}
.home-section{
background: url("../res/bg_760.jpg") no-repeat;
height: 100vh;
width:100vw;
max-width: 100%;
background-size: cover;
background-position: center;
}
#headAbt p {
font-size: 19px;
}
#education > div {
margin-left: 11%;
}
#skillset div {
width: 18%;
}
}
@media only screen and (max-width:700px){
#innerTyping{
color: white;
letter-spacing: 3px;
font-size: 19px;
}
.typed-cursor,.typed-cursor--blink{
color:white;
font-size: 19px;
}
.home-section{
background: url("../res/bg_700.jpg") no-repeat;
height: 100vh;
width:100vw;
max-width: 100%;
/* background-size: 100vw 100vh;*/
background-size: cover;
background-position: 50% 50%;
}
/*
.navbar-toggle {
position: relative;
float: right;
padding: 9px 10px;
margin-top: 12px;
background-color: transparent;
background-image: none;
border: 1px solid transparent;
border-radius: 4px;
display: block;
cursor:pointer;
}
*/
/*
.navbar-toggle .icon-bar {
background: #f8f8f8;
display: block;
width: 22px;
height: 2px;
border-radius: 1px;
margin-bottom: 4px;
}
*/
#icon
{
margin-top:3px;
position: absolute;
width:100%;
}
#icon-group {
width: 25px;
height: 35px;
z-index: 9999;
cursor: pointer;
margin-top: 21px;
float: right;
position: relative;
}
.center{
height:2px;
width:100%;
background: white;
margin-top: 4px;
transition: all 0.3s ease-in;
}
.after{
height:2px;
background: white;
margin-top:4px;
transition: all 0.2s ease-in;
}
.before{
height:2px;
background: white;
width: 100%;
transition: all 0.2s ease-in;
}
.beforeNext{
transform: rotate(45deg);
transition: all 0.2s ease-in;
}
.centerNext{
height:0px;
width:0px;
transition: all 0.3s ease-in;
}
.afterNext{
margin-top:-2px;
transform: rotate(-45deg);
transition: all 0.3s ease-in;
}
nav ul{
padding: 0px!important;
overflow: hidden;
height:0;
}
.liopen {
float: none !important;
}
.liopen:hover {
background-color:
teal;
border-bottom: none !important;
}
nav ul.open {
overflow: hidden;
height: 500px;
width: 137%;
background-color:
black;
position: relative;
z-index: 9999 !important;
transition:height 0.5s ease-in;
}
.auto-write p {
color: white;
font-size: 10px;
letter-spacing: 4px;
text-align: center;
}
#skillset div {
width: 21%;
}
}
@media only screen and (max-width:480px){
.home-section{
background: url("../res/bg_Res.jpg") no-repeat center;
height: 100vh;
width:100vw;
/* background-size: 100vw 100vh;*/
max-width: 100%;
background-size: cover;
background-position: 50% 50%;
}
#icon
{
margin-top:3px;
position: absolute;
width:100%;
}
#icons {
display: flex;
margin: 0 auto;
width: 50%;
justify-content: center;
margin-top: 7%;
margin-bottom: 5%;
}
#icon-group {
width: 25px;
height: 35px;
z-index: 9999;
cursor: pointer;
margin-top: 21px;
float: right;
position: relative;
}
.center{
height:2px;
width:100%;
background: white;
margin-top: 4px;
transition: all 0.3s ease-in;
}
.after{
height:2px;
background: white;
margin-top:4px;
transition: all 0.2s ease-in;
}
.before{
height:2px;
background: white;
width: 100%;
transition: all 0.2s ease-in;
}
.beforeNext{
transform: rotate(45deg);
transition: all 0.2s ease-in;
}
.centerNext{
height:0px;
width:0px;
transition: all 0.3s ease-in;
}
.afterNext{
margin-top:-2px;
transform: rotate(-45deg);
transition: all 0.2s ease-in;
}
nav ul{
overflow: hidden;
height: 0px;
width: 137%;
background-color:
#222f43;
position: relative;
z-index: 9999 !important;
transition:height 0.5s ease-in;
}
.liopen {
float: none !important;
}
.liopen:hover {
background-color:
teal;
border-bottom: none !important;
}
.headerDiv nav li{
padding:7px 11px;
float:none;
}
nav ul.open {
transition:height 0.5s ease-in;
height: 250px;
background-color:
#222f43;
}
#contact #headEd {
padding-top: 100px;
}
.auto-write p {
color: white;
font-size: 10px;
letter-spacing: 4px;
text-align: center;
}
#innerTyping{
color: white;
letter-spacing: 2px;
font-size: 15px;
}
/*
.navbar-toggle {
position: relative;
float: right;
padding: 9px 10px;
margin-top: 12px;
background-color: transparent;
background-image: none;
border: 1px solid transparent;
border-radius: 4px;
display: block;
}
.navbar-toggle .icon-bar {
background: #f8f8f8;
display: block;
width: 22px;
height: 2px;
border-radius: 1px;
margin-bottom: 4px;
}
*/
/*Queries for Mobiles*/
#about {
display: flex;
width: 100%;
height: 100vh;
flex-direction: column;
}
#imgAbt {
height: 70%;
width:100%;
}
#imgAbt img {
width: 100%;
height: 100%;
max-width: 100%;
}
#paraAbt {
height: auto;
width:100%;
}
#cntnAbt p {
font-size: 12px;
line-height: 32px;
padding: 0px 50px;
}.scroll-to-top {
position: fixed;
bottom: 5px;
right: 5px;
background-color: lightcoral;
cursor: pointer;
color: white;
width: 30px;
height: 30px;
font-size: 19px;
text-align: center;
padding-top: 5px;
}
#subdetails {
height: 45vh;
display: flex;
width: 100%;
flex-direction: column;
align-items: center;
}
#headAbt {
margin: 0 auto;
width: 50%;
padding: 26px 0px;
padding-bottom: 0px;
}
.ionic {
font-size: 35px;
}#formData {
display: flex;
width: 100%;
margin-top: 6%;
flex-direction: column;
}
#Map {
width: 100%;
margin-left: 0px
}
#headExp p {
width: 50%;
font-size: 16px;
}
#contactForm {
width: 100%;
margin-bottom: 20px;
}
#skillset div {
width: 80%;
height: 75px;
padding-top: 10px;
padding-bottom: 55px;
padding-left: 38px;
font-size: 12px;
}
#headExp p img {
width: 25px;
height: 25px;
}
#headAbt p {
font-size:16px;
font-weight: 400;
padding:0px;
}
#headSkills p {
width: 50%;
font-size: 16px;
}
#education > div {
margin-left: 2%;
padding-left: 5px;
}
#headEd{
padding-top:60px;
}
#headEd p {
width: 50%;
font-size: 16px;
}
#headEd p img {
width: 25px;
height: 26px;
}
#cntnAbt {
margin-top: 10%;
}
#innerTyping{
color: white;
letter-spacing: 3px;
font-size: 15px;
}
.typed-cursor,.typed-cursor--blink{
color:white;
font-size: 15px;
}
.auto-write {
width: 74%;
}
#education {
font-size: 13px;
}
#subdetails div {
font-size: 12px;
}
button {
width: 35%;
height:28px;
}
.ionic {
font-size: 30px;
}
}
@media only screen and (max-width:480px){
#icons {
margin-top: 4%;
}
#imgAbt {
height: 55%;
}
#headAbt {
padding: 0px 0px;
}
#innerTyping {
letter-spacing: 2px;
font-size: 14px;
}
#education {
padding: 16px 0px;
}
}
@media only screen and (max-width:340px){
#cntnAbt p {
font-size: 10px;
}
#imgAbt {
height: 50%;
}
button {
width: 42%;
height: 26px;
}
#education {
font-size: 10px;
}
.auto-write p {
letter-spacing: 3px;
}
#innerTyping {
letter-spacing: 1px;
font-size: 13px;
}
}