html {
  height: 100%;
  background: rgb(255, 255, 255);

}


body{
height: 100%;
/*background-image:url(oku.jpeg);*/
background-repeat:no-repeat;
background-size:cover;
background-position: 10% 50%;
}

.addposs{
  font-size:1.1em;
}

/* HTML Nav Styles */
/* HTML Nav Styles */
/* HTML Nav Styles */
nav menuitem {
  position:relative;
  display:block;
  opacity:0;
  cursor:pointer;
}

nav menuitem > menu {
  position: absolute;
  pointer-events:none;
}
nav > menu { display:flex;padding:0em;margin:0em; }

nav > menu > menuitem { pointer-events: all; opacity:1; }
menu menuitem a { white-space:nowrap; display:block; }

menuitem:hover > menu {
  pointer-events:initial;
}
menuitem:hover > menu > menuitem,
menu:hover > menuitem{
  opacity:1;
}
nav > menu > menuitem menuitem menu {
  transform:translateX(100%);
  top:0; right:0;
}
/* User Styles Below Not Required */
/* User Styles Below Not Required */
/* User Styles Below Not Required */

#population{
  background-color:rgb(0, 119, 255);
}

.blogGrid > div{
  border-radius:0.4em;
  }

  .blogGrid > div:hover{
    cursor:pointer;
  }

#fourDep{
  background-image: url("images/fourDep.png");
  background-repeat: no-repeat;
  background-size: contain;
}

#journBlogPic{
  background-image: url("images/journBlogPic.png");
  background-repeat: no-repeat;
  background-size: contain;
}
.blogGrid{
  display:grid;
  grid-template-columns:30% 30%;
  text-align:center;
  column-gap:6%;
  row-gap:10%;
  padding:4em;
  justify-content: center;
}

nav a {
  background:rgb(106, 175, 253);
  transition: background 0.5s, color 0.5s, transform 0.5s;
  margin:0px 6px 6px 0px;
  padding:1.5em 3em;
  box-sizing:border-box;

  position:relative;

}

nav a:hover:before {
  content: '';
  top:0;left:0;
  position:absolute;
  background:rgba(0, 0, 0, 0.2);
  width:100%;
  height:100%;
}

nav menuitem > menu > menuitem > a + menu:after{

}

nav > menu > menuitem > menu > menuitem{
  transition: transform 0.6s, opacity 0.6s;
  transform:translateY(100%);
  opacity:0;
}
nav > menu > menuitem:hover > menu > menuitem,
nav > menu > menuitem.hover > menu > menuitem{
  transform:translateY(-80%);
  opacity: 1;
}

menuitem > menu > menuitem > menu > menuitem{
  transition: transform 0.6s, opacity 0.6s;
  transform:translateX(0%) translateY(0%);
  opacity: 0;
}
menuitem > menu > menuitem:hover > menu > menuitem,
menuitem > menu > menuitem.hover > menu > menuitem{
  transform:translateX(0%) translateY(0%);
  opacity: 1;
}
.header{
  font-size: 28px;
  color: white;
  text-align: center;
  text-decoration: none;
  margin-top: 3%;
  margin-bottom: 3%;

}
.nostylea{
  text-decoration: none;
  color:black;
}

.nostylea:hover{
  color:#021d36;

}

.headertitle{
  font-size:2.4em;
  text-align:center;
  color: #1890ff;
  font-family: 'Merriweather', serif;
  padding-left: 4em;
  font-weight:bold;
}

.headersubtitle{
  font-size:1.4em;
  text-align:left;
  color: #073561;
  font-family: 'Merriweather', serif;
  margin-left: 10em;
  margin-bottom: 1.4em;
}

.features2 > i{
  color:#cef4ff;
}

.features2 > input{
  visibility:hidden;
}

.features2:hover{
  background-color: rgb(0, 55, 128);
  cursor:pointer;
}

.headerdesc{
  font-size:1.2em;
  padding-left:8em;
  text-align:center;
}

.headerdesca{
  font-size:2em;
  margin-left:4.4em;
}


.getstartednow{
  font-size:2em;
  padding-left: 4em;

}

.getstartednow:hover{
  cursor:pointer;
  color:rgb(0, 195, 255);
}

.logo {
  position:absolute;
  background-image: url("images/cover.png");
  background-repeat: no-repeat;
  background-size: contain;
  margin: 0px;
  width: 12em;
  height: 11em;
  top:0;
}


#catSpace {
  position:absolute;
  background-image: url("images/catInSpace.jpg");
  background-repeat: no-repeat;
  background-size: contain;
  margin-top:5em;
  width:100%;
  height: 100%;
  top:0;
}


.mindfulnesspic{
  background-image: url("images/mindfulness.png");
  background-repeat: no-repeat;
  background-size: contain;
  margin: 0px;
  width: 10em;
  height: 9em;
}


.writer {
  background-image: url("images/writer.jpg");
  background-repeat: no-repeat;
  background-size: contain;
  margin: 0px;
  width: 12em;
  height: 11em;
}

.brain {
  background-image: url("images/mind.jpg");
  background-repeat: no-repeat;
  background-size: contain;
  margin: 0px;
  width: 10em;
  height: 10em;
}
.homeheadercontainer{
  display:grid;
  grid-template-columns: 40em 50em;
  text-align:center;
  margin-top:6%;
  background-color: #eaf7ff;
  height: 34em;
  text-align: left;
  margin-left: 2%;
  margin-right: 2%;
  padding:1em;
}


.questions{
  font-size:1.2em;
  text-align:left;
  margin-left: 12em;
}

.Introcontainer{
  display:grid;
  grid-template-columns: 60em 20em;
  text-align:center;
  margin-top:6%;
  background-color: #eaf7ff;
  height: 24em;
  margin-left: 2%;
  margin-right: 2%;
}
i{
  font-size:2em;
  color:#2379ca;
}

.features{
  font-size:1.3em;
  text-align:center;
  border:0.1px solid #dae5ee;
  color:#021d36;
  font-family: 'Nunito Sans', sans-serif;
  padding:1em;
  font-weight:bold;
}

.features2{
  font-size:1.3em;
  text-align:center;
  border:0.1px solid #dae4ee;
  color:white;
  font-family: 'Nunito Sans', sans-serif;
  padding:1em;
  font-weight:bold;
  background-color:rgb(99, 164, 238);
}

.features3{
  font-size:1.3em;
  text-align:center;
  color:white;
  font-family: 'Nunito Sans', sans-serif;
  padding:1em;
  font-weight:bold;
  background-color: rgb(0, 55, 128);
}

.mentalhealth{
  width:4em;
}


.homebit{
  font-size:1.6em;
  margin-top:6%;
  text-align:center;
  font-family: 'Raleway', sans-serif;
Color:cornflowerblue;
  padding:1em;

  -webkit-transition : all 0.8s ease-in-out;
  -moz-transition : all 0.8s ease-in-out;
  -o-transition : all 0.8s ease-in-out;
  transition : all 0.8s ease-in-out;
  opacity:0;
font-size:3em;font-weight:bold;


}

#page-mask{
  background: rgba(0, 0, 0, 0.5);
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index:10;
  -webkit-transition : all 0.4s ease-in-out;
-moz-transition : all 0.4s ease-in-out;
-o-transition : all 0.4s ease-in-out;
transition : all 0.4s ease-in-out;

}

#newusercontent > label{
  font-weight:bold;
  font-size:1.2em;
  color:rgb(0, 132, 255);
}

#understand{
  color:rgb(0, 132, 255);
  font-weight:bold;
}

#understand:hover{
  color:rgb(0, 30, 54);
  cursor:pointer;
}

#newuserplan{
  width:40em;
  position:fixed;
  margin-left:23em;
top: 1em;
text-align:center;
font-size:1em;
background-color:white;
box-shadow: 0.8em 0 1.2em -0.6em  #001d3052, -0.8em 0 0.7em -0.4em  #001d3052;
font-family: 'Libre Franklin', sans-serif;
z-index:100;
border: solid 1px rgb(131, 171, 223);
padding: 4em;
overflow:hidden;
}
.homeheadercontainer2{
  display:grid;
  grid-template-columns: 10em 20em 20em 20em 10em;
  text-align:center;
  margin-top:2%;
  height: 50em;
  text-align: left;
  margin-left: 2%;
  margin-right: 2%;
  row-gap:2em;
  column-gap: 2em;
  padding: 1em;

}

.doingpic{
font-size:2em;
margin-top:1em;
font-family: 'Caveat', cursive;
}

.dobinput{
  font-size:0.9em;
  background-color:white;
}



.background {
  background-image: url("images/hopeforreal.jpg");
  background-repeat: no-repeat;
  background-size: contain;
  margin-left:8em;
  margin-bottom:1em;


}

.contactCont{
  margin-top:8em;
  text-align:center;
}
.invalid{
  color:red;
  font-weight:bold;
}

.hometable{
  display:grid;
  width:100%;grid-template-columns: 36% 16% 36%; padding:10%;
  font-size:1.2vw;
}

.hometable > div > h2{
font-weight:lighter;
font-size:1.2em;}
.color2{
  padding-left:10em;
  padding-right:10em;
  background-color:cornflowerblue;color:rgb(255, 246, 241);margin-bottom:0em;height:auto;font-size:2vw;


}
.hometable > div{
  border-bottom:solid 0.1em rgba(1, 78, 114, 0.377);padding:1em;
}
.valid{
  color:green;
  font-weight:bold;
}

.passwordhelp{
  text-align:Center;
  width: 30em;
margin-left:10em;
display:none;

}
.emailhome{
  font-size:1em;
  width: 18em;
  margin-left: 15em;
  text-align:center;
  margin-bottom: 1em;
  background-color:rgb(255, 255, 255);
}

.emailhome2{
  background-color:rgb(255, 255, 255);
}



input[type=password] {
  font-size:1em;
  width: 18.4em;
  height:2.3em;
  margin-left: 15em;
  text-align:center;
  margin-bottom: 1em;
}

.container > input[type=password] {
  font-size:1em;
  width: 100%;
  margin: 0em;
  margin-bottom:1em;

}

.topnavCont{
  height:4em;
  position:fixed;
  top:0;
  width:100%;
  background-color:rgb(0, 119, 255);
  box-shadow: 0 0.3em 1em rgba(0, 149, 255, 0.7);
  left:0;
  padding-left:6em;
  z-index:100;

}


.topnav {
  background-color: transparent;
  text-align: center;
  height: 3em;
  display: grid;
  padding:0.3em;
  grid-template-columns: 2fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;

}

.topnav > div{
  max-height:3em;
}

.fa-cat{
  color:rgb(193, 235, 255);
  font-size:1em;
}

.signuperror{
  text-align:center;
}

/* Style the links inside the navigation bar */
.topnav a {
  color:rgb(255, 255, 255);
  text-align: center;
  padding: 1em;
  text-decoration: none;
  font-size: 1em;
  font-family: 'Raleway', sans-serif;

}

/* Change the color of links on hover */
.topnav a:hover {
  background-color: rgb(0, 195, 255);
  color: rgb(255, 255, 255);
  cursor: pointer;
  font-weight:bold;
}



/* Add a color to the active/current link */
.topnav a.active {
  color: rgb(6, 14, 22);
  text-decoration: underline;

}

.topnav a.register{
  font-size: 1em;
  text-align: center;
  display: grid;


}


.homegrid{
  display: grid;
  height: 100%;
  font-family: 'Montserrat', sans-serif;
  grid-template-rows: 26% 40% 50%;
  color: white;
}

.homegrid1{
text-align: center;
margin: auto;
font-size: 2em;
color: #fff800;
}

.homegridabout{
  text-align: center;
  margin:auto;
  font-size:3em;
}

.homegridsubdiv{
  display:grid;
  grid-template-columns: 33% 33% 33%;
  height: 100%;
}

.homegridsub{
  text-align: center;
  margin: auto;

}

.author{
  font-size: 16px;
}

.cancelbtn{
  background-color:transparent;
}

.categories{
  text-decoration: none;
  color: black;
  font-family: 'Montserrat', sans-serif;
  font-weight:bold;
  font-size: 16px;
}

.categories.hover{
  cursor:pointer;
}

.getstarted{
  text-decoration: none;
  color:white;
  font-size: 34px;

}

.getstarted.hover{
  background-color: rgb(0, 195, 255);
}


.getstartedgrid{
  display:grid;
  height: 60%;
  row-gap: 30px;
  grid-template-columns: 80%;
  text-align: center;
}
.gslist{
  font-size: 20px;
  color: white;


}

/* Style the video: 100% width and height to cover the entire window */
#myVideo {
  position: fixed;
  right: 0;
  bottom: 0;
  min-width: 100%;
  min-height: 100%;
  z-index: -1;
}

/* Add some content at the bottom of the video/page */
.content {
  position: absolute;
  top: 0px;
  bottom: 0px;
  left: 0px;
  right: -20px;
  overflow: auto;



}

.contentcontainer{
  height: 60%;
  width: 80%;
  left: 8%;
  overflow: hidden;
  position: relative;
  text-align: center;
  color: rgb(51, 87, 185);
  font-size: 16px;
  font-family: 'Merriweather', serif;

}

/* Style the button used to pause/play the video */
#myBtn {
  width: 200px;
  font-size: 18px;
  padding: 10px;
  border: none;
  background: #000;
  color: #fff;
  cursor: pointer;
}

#myBtn:hover {
  background: #ddd;
  color: black;
}

ul {
  position:relative;
  top: 20%;
  height: 110px;
  list-style-type: none;


}

.first{
  font-size: 34px;
  opacity: 1;
  transition: 0.5s;
  padding: 1.4%;
  font-family: 'Merriweather', serif;
}

.second{
  font-size: 34px;
  opacity: 0.7;
  transition: 0.5s;
  padding: 1.4%;
  font-family: 'Merriweather', serif;
}

.third{
  font-size: 34px;
  opacity: 0.4;
  transition: 0.5s;
  padding: 1.4%;
  font-family: 'Merriweather', serif;
}

.fourth{
  font-size: 34px;
  opacity: 0.1;
  transition: 0.5s;
  padding: 1.4%;
  font-family: 'Merriweather', serif;
}

.author{
  font-size: 20px;
  font-weight: bold;
  font-style: italic;
  opacity: 0.1;
  transition: 0.5s;
  padding: 1.4%;
  font-family: 'Merriweather', serif;
}


.first2{
  font-size: 34px;
  opacity: 0.1;
  transition: 0.5s;
  padding: 1.4%;
  font-family: 'Merriweather', serif;
}

.second2{
  font-size: 34px;
  opacity: 0.1;
  transition: 0.5s;
  padding: 1.4%;
  font-family: 'Merriweather', serif;
}

.third2{
  font-size: 34px;
  opacity: 0.1;
  transition: 0.5s;
  padding: 1.4%;
  font-family: 'Merriweather', serif;
}

.author2{
  font-size: 34px;
  opacity: 0.1;
  transition: 0.5s;
  padding: 1.4%;
  font-family: 'Merriweather', serif;
}
.test33{
  color:white;
  font-size:34px;
  position: relative;
}

.learncontainer{
  display:grid;
  grid-template-columns: 33.3% 33.3% 33.3%;
  grid-template-rows: 200px;
  margin-top:5%;
  text-align: center;
  background-color: rgb(247, 247, 247);
}

.learntitle{
  border: solid 0.5px black;
  padding-top: 15%;
  font-family: 'Open Sans', sans-serif;
  font-size: 24px;
  color: rgb(0, 0, 0);
}

.learntitle.hover{
  background-color: rgb(124, 203, 206);
  cursor: pointer;
}

/* The sidebar menu */
.sidebar {
  height: 100%; /* 100% Full-height */
  width: 0; /* 0 width - change this with JavaScript */
  position: fixed; /* Stay in place */
  z-index: 1; /* Stay on top */
  top: 0;
  left: 0;
  background-color: rgb(58, 66, 70); /* Black*/
  overflow-x: hidden; /* Disable horizontal scroll */
  padding-top: 60px; /* Place content 60px from the top */
  transition: 0.5s; /* 0.5 second transition effect to slide in the sidebar */
  text-align: center;
}

.leftdash{
  height: 100%; /* 100% Full-height */
  width: 12em; /* 0 width - change this with JavaScript */
  position: fixed; /* Stay in place */
  z-index: 1; /* Stay on top */
  top: 0;
right: 0;
  background-color: rgb(33, 169, 236); /* Black*/
  overflow-x: hidden; /* Disable horizontal scroll */
  padding-top: 60px; /* Place content 60px from the top */
  transition: 0.5s; /* 0.5 second transition effect to slide in the sidebar */
  text-align: center;
}


/* The sidebar links */
.sidebar a, .leftdash a {
  padding: 8px 8px 8px 32px;
  text-decoration: none;
  font-size: 25px;
  color: #818181;
  display: block;
  transition: 0.3s;
}

/* When you mouse over the navigation links, change their color */
.sidebar a:hover, .leftdash a:hover {
  color: #f1f1f1;
}

/* Position and style the close button (top right corner) */
.sidebar .closebtn, .leftdash .closebtn {
  position: absolute;
  top: 0;
  right: 2em;
  font-size: 2em;
  margin-left: 3em;
}

/* The button used to open the sidebar */
.openbtn {
  font-size: 20px;
  cursor: pointer;
  color: white;
  padding: 10px 15px;
  border: none;
}

.openbtn:hover {
  background-color: #444;
}

.goodthingphp{
  font-size: 24px;
  color: white;
}

a.button2 {
  display: inline-block;
  padding:0.5em 3em;
  border:0.16em solid #1890ff;
  margin:0 0.3em 0.3em 0;
  box-sizing: border-box;
  text-decoration:none;
  text-transform:uppercase;
  font-family:'Roboto',sans-serif;

  font-weight:400;
  color:rgb(255, 255, 255);
  text-align:center;
  transition: all 0.15s;
  font-size: 1.1em;
  }

  .button2{
    display: inline-block;
    padding:0.5em 3em;
    border:0.16em solid #1890ff;
    margin:0 0.3em 0.3em 0;
    box-sizing: border-box;
    text-decoration:none;
    text-transform:uppercase;
    font-family:'Roboto',sans-serif;

    font-weight:400;
    color:rgb(0, 0, 0);
    text-align:center;
    transition: all 0.15s;
    font-size: 1.1em;
    width: 14em;
    }
  a.button2:hover{
  color:rgb(72, 133, 173);
  border-color:rgb(97, 211, 240);
  cursor: pointer;
  text-decoration: none;
  }

  .button2:hover{
    color:rgb(27, 141, 216);
    border-color:rgb(1, 7, 8);
    cursor: pointer;
    text-decoration: none;
    }

  a.button2:active, button2:active{
  color:rgb(114, 154, 230);
  border-color:rgb(64, 203, 238);
  }
  @media all and (max-width:30em){
   a.button2, .button2{
    display: block;
    margin: 0.4em auto;

  }
}

.hpoffers{
  font-size:18px;
  text-align:center;
  margin-top:4%;
}

.homeoptions{
  display:grid;
  grid-template-columns: 27.5% 15% 15% 15% 27.5%;
  text-align:center;
  margin-top: 3%;
  font-family: 'Merriweather', serif;
}

.FeaturesHome{
  font-size: 26px;
  font-weight:bold;
  font-family: 'Merriweather', serif;
}

.emojimap{
  width:25%;
  text-align:center;
  height:5px;

}

.emojispan{
  font-size:1.6em;

}

.emojispan:hover{
  background-color:rgb(0, 247, 255);
  cursor:pointer;
}

.emojihome{
  width: 160px;
  font-family: 'Merriweather', serif;
}

.sleephome{
  width: 160px;
  font-family: 'Merriweather', serif;
}

.emojilabel{
  text-align:center;
  font-size:1em;
  font-weight:bold;
}

.basics{
  position:fixed;
  right:0.1em;
  top:50%;
  font-size:2em;
  z-index:1;
  color: black;
  font-weight:Bold;
}

.basics:hover{
  cursor:pointer;
}

.autocomplete {
  position: relative;
  display: inline-block;
}

input {
  border: 1px solid rgba(78, 155, 255, 0.479);
  background-color: #fffefe;
  padding: 0.4em;
  font-size: 1em;
}

input[type=text] {
  background-color: #f1f1f1;
  width: 100%;
}

input[type=submit] {
  background-color: DodgerBlue;
  color: #fff;
  cursor: pointer;
}

.autocomplete-items {
  position: absolute;
  border: 1px solid #d4d4d4;
  border-bottom: none;
  border-top: none;
  z-index: 99;
  /*position the autocomplete items to be the same width as the container:*/
  left: 0;
  right: 0;
}

.autocomplete-items div {
  padding: 1em;
  cursor: pointer;
  background-color: #fff;
  border-bottom: 1px solid #d4d4d4;
}

/*when hovering an item:*/
.autocomplete-items div:hover {
  background-color: #e9e9e9;
}

/*when navigating through the items using the arrow keys:*/
.autocomplete-active {
  background-color: DodgerBlue !important;
  color: #ffffff;
}

.moveon:hover{
  color:rgb(4, 14, 44);
  font-weight:bold;
  cursor:pointer;
}

.moveon{
text-align:Center;
}

.thescience{
  display:grid;
  text-align:center;
  font-size:2em;
  height:11em;
  margin-left:7em;
  margin-right:7em;
  grid-template-columns: 14em 14em;
  border:solid 1px rgb(182, 203, 223);
  margin-top:1em;

}

.thescience>div:nth-child(2n){
  margin-top:1.4em;
}
.thescience>div:nth-child(1){
  margin-left:2em;
}

.thescience2{
  display:grid;
  text-align:center;
  font-size:2em;
  height:11em;
  margin-left:7em;
  margin-right:7em;
  grid-template-columns: 16em 14em;
  border:solid 1px rgb(182, 203, 223);
  margin-top:1em;

}

.thescience2>div:nth-child(1){
  margin-top:1.4em;
  margin-left:2em;

}
.thescience2>div:nth-child(2){
  margin-top:1.4em;
  margin-left:2em;

}

.footer {
display:grid;
height:8em;
background-color:rgb(235, 243, 247);
  text-align: center;
  margin-top:3em;
}

.filtercontainer{
  font-size:1.2em;
display:grid;
text-align:center;
margin-left:14em;
margin-right:14em;
margin-top:6em;
row-gap:1em;

}

.goodthings{
  font-size:2em;
  margin-top:1em;

}

.schedtxtarea{

  -moz-border-bottom-colors: none;
  -moz-border-left-colors: none;
  -moz-border-right-colors: none;
  -moz-border-top-colors: none;
  background: none repeat scroll 0 0 rgba(206, 214, 221, 0.26);
  border-color: -moz-use-text-color #FFFFFF #FFFFFF -moz-use-text-color;
  border-image: none;
  border-style: none solid solid none;
  border-width: medium 1px 1px medium;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12) inset;
  color: #555555;
  font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
  font-size: 1em;
  line-height: 1.4em;
  padding: 1em 2em;
  transition: background-color 0.2s ease 0s;
}

.schedtxtarea:focus{

    background: none repeat scroll 0 0 #FFFFFF;
    outline-width: 0;

}


.aboutcontok{
  display:grid;
  grid-template-columns:30em 50em;
  margin-left:16%;
  column-gap:0em;
  text-align:left;
  grid-template-rows:24em;
  row-gap:4em;
  margin-bottom:10em;
  -webkit-transition : all 0.8s ease-in-out;
  -moz-transition : all 0.8s ease-in-out;
  -o-transition : all 0.8s ease-in-out;
  transition : all 0.8s ease-in-out;
  opacity:0;

}

.aboutcontok > div > span > div > h2{
  font-size:1.1em;
}


.aboutcontok2 > div > span > div > h2{
  font-size:1.1em;
}
a:hover{
  cursor:pointer;
}

.terms{
  width:50em;
  height:40em;
  position:fixed;
  margin-left:19em;
top: 1em;
text-align:left;
font-size:1em;
background-color:white;
box-shadow: 0.8em 0 1.2em -0.6em  #001d3052, -0.8em 0 0.7em -0.4em  #001d3052;
font-family: 'Libre Franklin', sans-serif;
z-index:100;
border: solid 1px rgb(131, 171, 223);
padding: 4em;
overflow:auto;

}

.terms > div{
  padding-bottom:2em;
}
.aboutcontok2{
  display:grid;
  grid-template-columns:50em 30em;
  margin-left:8%;
  column-gap:0em;
  row-gap:2em;
  text-align:left;
  grid-template-rows:24em;
  margin-bottom:2em;
  margin-bottom:10em;
  -webkit-transition : all 0.8s ease-in-out;
  -moz-transition : all 0.8s ease-in-out;
  -o-transition : all 0.8s ease-in-out;
  transition : all 0.8s ease-in-out;
  opacity:0;

}


.aboutcontok3 > div{
  border:solid 0.1em rgb(0, 132, 255);
}
.aboutcontok > :nth-child(1){
  height:17em;

}
.aboutcontok > :nth-child(4){
  height:17em;

}

.actionplanpic{
  background-image: url("images/actionplan.png");
  background-repeat: no-repeat;
  background-size: contain;
  margin-left:3em;


}

.trackingLists{
  background-image: url("images/goals.webp");
  background-repeat: no-repeat;
  background-size: contain;
  width: 40em;
  height:32em;
  margin-left:4em;

}

.fearpic{
  background-image: url("images/fear.png");
  background-repeat: no-repeat;
  background-size: contain;
  width: 34em;
  margin-top:4em;
  margin-left:10em;

}


.meditationHome{
  background-image: url("images/meditation.png");
  background-repeat: no-repeat;
  background-size: contain;
  width: 40em;
  height:30em;
  margin-top:4em;

}

.headerSubtitle{
  text-align:center;
  margin-left:6em;
  color:rgb(29, 29, 29);
}

.exposureHome{
  background-image: url("images/exposures.png");
  background-repeat: no-repeat;
  background-size: contain;
  width: 24em;
  height:24em;
  margin-top:4em;
  margin-left:12em;

}



.journalingpic{
  background-image: url("images/journaling.png");
  background-repeat: no-repeat;
  background-size: contain;
}



.aboutheader{
  font-size:1.6em;
  font-family: 'Libre Franklin', sans-serif;
  color: #1D1E2C;
}

.aboutheader2{
  font-size:1.3em;
  font-family: 'Libre Franklin', sans-serif;
  color: #1D1E2C;
  text-align:center;
}

input[type=number]{
  width:2em;
  height:0.8em;
}

#skip{
  font-size:1.4em;
  color:rgb(4, 29, 61);
  text-decoration:underline;
  margin-left:4em;
 padding-top:2em;
}

#skip:hover{
  cursor:pointer;
  color:rgb(0, 153, 255);
}

.choosePlans{
  font-size:2.6em;
  color:rgb(26, 141, 248);
  margin-bottom:0em;
}

.chooseSub{
  color:rgb(26, 141, 248);
  font-size:1.2em;
  text-align:center;
  margin-top:0.4em;
  margin-bottom:2em;
}

.choosePlanCont{
  display:grid;
  grid-template-columns: 20em 20em;
justify-content:center;
text-align:center;

}

.choosePlanCont >div{
  padding-top:3em;
  background-color:white;
}
.choosePlanCont >div{
border-right:solid 1px rgb(208, 238, 255);
border-left:solid 1px rgb(208, 238, 255);
border-top:solid 2px rgb(26, 141, 248);
border-bottom:solid 2px rgb(26, 141, 248);
box-shadow: 0 0.1em 1em rgba(0, 149, 255, 0.7);
border-radius:1em;
z-index:100;

}



.whatsinits{
  font-size:2.6em;
  text-align:center;

}
#plusinc{
  color:rgb(26, 141, 248);
  font-size:1.4em;
}

#guidedinc{
  color:rgb(4, 93, 177);
}



.planHead{
  font-size:2em;
  color:#2B4162;
  font-weight:bold;
  margin-top:1em;
}

.planDesc{
  font-size:0.9em;
  color:#2B4162;
  font-weight:lighter;
  padding-left: 2.3em;
  padding-right:2.3em;
  padding-top:1em;
}

.choosePlanContainer{
  position:absolute;
  top:6em;
  bottom:0;
  left:14em;
  right:12em;
  background-color:rgb(245, 249, 252);
}

.homelinksg{
  color:#1890ff;
  font-weight:bold;
  text-decoration:none;
  font-size:0.9em;
}

.homelinkg:hover{
  font-weight:bold;
  text-decoration:underline;
}

.aboutheader >span >div >i{
  font-size:1.2em;
}

.iconandheader{
  text-align:center;
  font-size:1.3em;
  margin-bottom:0.6em;
  margin-right:3.1em;
  color: #0E1C36;
  font-weight:bold;

}

.blurbdesc{
  color:#1890ff;
}

.fa-arrow-down:hover{
  color:rgb(0, 153, 255);
}

.getStartedHome{
  font-size: 1.2em;
  font-weight:bold;
  padding:0em;
  background-color:rgb(0, 148, 247);
}

.logso:hover{
  cursor:pointer;
}

.logso{
  position:absolute;left:3em;top:0.8em;font-family: 'Sigmar One', cursive;color:white;line-height:0.7;font-size:1.2em;
}

#forgotPassCont{
  display:grid;
  width:30em;
  height:30em;
  justify-content:center;
  margin-top:10em;
  margin-left:32em;
  text-align:center;
  box-shadow: 0 0.1em 1em rgba(0, 149, 255, 0.7);

}

#forgotPassCont > div{
  padding:3em;
}

#forgotPassCont > h1{
  color:rgb(26, 141, 248);
  font-size:2em;

}

.modal-content > h2{
  text-align:center;
}

.imagesBlog{
  background-repeat: no-repeat;
  background-size:contain;
}
.forgotpassLink{
  background-color:rgb(25, 40, 59);
  color:white;
  width:100%;
  margin-top:4em;
  height:3em;
}

.forgotpassLink:hover{
  cursor:pointer;
  color:rgb(11, 106, 196);
}

::-webkit-input-placeholder { /* Edge */
text-align:center;
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
  text-align:center;
}

::placeholder {
  text-align:center;
}