html, body {
  margin: 0px;
  padding: 0px;
  width: 100%;
  height: 100%; }

li {
  list-style-type: none; }

form input[type="text"], button {
  width: 100%;
  border-radius: 0px; }

p {
  margin-bottom: 0px; }

a {
  text-decoration: none; }

.thanks {
  text-align: center;
  color: #888;
  width: 100%; }

.thanks p {
  font-size: 20px; }

.submit {
  display: inline; }

.submit h2 {
  color: white;
  display: inline-block; }

.fixedheader {
  position: fixed;
  z-index: 5;
  width: 100%;
  text-align: right; }

.fixedheader .img {
  width: 15%;
  float: left;
  padding: 30px 30px; }

.fixedheader i {
  font-size: 50px;
  color: #f6685e;
  padding: 30px;
  cursor: pointer; }

.menu {
  z-index: 200;
  position: fixed;
  width: 100%;
  background: rgba(0, 0, 0, 0.94);
  height: 0%;
  overflow-y: hidden;
  transition: 0.5s; }

.menu i {
  position: absolute;
  right: 0;
  color: #f6685e;
  padding: 30px;
  cursor: pointer;
  font-size: 50px; }

.menu-content {
  top: 10%;
  width: 100%;
  text-align: center;
  position: relative;
  color: #f6685e; }

.menu-content a {
  font-family: 'Raleway', sans-serif;
  letter-spacing: 2px;
  font-size: 22px;
  color: #f6685e;
  display: block;
  cursor: pointer;
  padding: 20px 0px; }

.menu-content a:hover {
  color: #f6685e;
  display: block; }

.overlay {
  background: rgba(0, 0, 0, 0.6);
  height: 100%; }

.contain-ui {
  width: 70%;
  margin-left: 20%;
  height: 100%;
  background-color: white; }

.dash-contain {
  width: 100%;
  background-color: #191919; }

.contain {
  width: 80%;
  margin-left: 20%; }

.addUsers form {
  width: 40%;
  margin: auto;
  color: #888;
  padding-top: 5%; }

.addUsers h3 {
  text-align: center; }

.addUsers form input, .addUsers form button {
  color: #888;
  border-radius: 0px; }

.dmediaHead {
  text-align: center; }

.dmediaHead button {
  width: 20%;
  display: inline-block;
  margin: 20px 5px;
  border-radius: 0px;
  padding: 0px; }

.dmedia form {
  width: 60%;
  margin: auto;
  color: #888;
  padding-top: 5%; }

.dmedia h3 {
  text-align: center; }

.dmedia form select {
  width: 100%; }

.dmedia form input, .media form button {
  color: #888;
  border-radius: 0px; }

.tour {
  width: 80%;
  margin: auto;
  color: #888;
  margin-top: 5%; }

tr:last-child th, tr:last-child td {
  border: 0px; }

.event form h3 {
  text-align: center; }

.event div {
  width: 40%;
  margin: 5% 30%;
  margin-top: 8%;
  color: #888;
  display: inline-block; }

.event form input, .event form button {
  border-radius: 0px;
  color: #888; }

.bookings table {
  width: 80%;
  margin: auto;
  color: #888;
  margin-top: 5%; }

.home {
  height: 100%;
  background: rgba(0, 0, 0, 0.3); }

.bgimg1 {
  animation: backgroundImage 25s infinite ease-in-out;
  background: url(./assets/five.jpeg);
  background-size: 100% 100%;
  background-repeat: no-repeat;
  height: 100vh; }

@keyframes backgroundImage {
  0% {
    background-image: url("https://storage.googleapis.com/ispace-website.appspot.com/one.jpeg");
    background-attachment: fixed;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat; }
  25% {
    background-image: url("https://storage.googleapis.com/ispace-website.appspot.com/two.jpeg");
    background-attachment: fixed;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat; }
  50% {
    background-image: url("https://storage.googleapis.com/ispace-website.appspot.com/three.jpeg");
    background-attachment: fixed;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat; }
  75% {
    background-image: url("https://storage.googleapis.com/ispace-website.appspot.com/four.jpeg");
    background-attachment: fixed;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat; }
  100% {
    background-image: url("https://storage.googleapis.com/ispace-website.appspot.com/one.jpeg");
    background-attachment: fixed;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat; } }

.bgimg2 {
  background-image: url("https://storage.googleapis.com/ispace-website.appspot.com/home.jpeg");
  text-align: center; }

.bgimg3 {
  background-image: url("https://storage.googleapis.com/ispace-website.appspot.com/uwatn.jpeg");
  text-align: center; }

.bgimg4 {
  background-image: url("https://storage.googleapis.com/ispace-website.appspot.com/event.jpeg");
  min-height: 300px;
  text-align: center; }

.bgimg5 {
  background-image: url("https://storage.googleapis.com/ispace-website.appspot.com/3d.jpeg");
  min-height: 300px;
  text-align: center; }

.bgPhk {
  background-image: url("https://storage.googleapis.com/phoenix-173316.appspot.com/slider/one.png");
  min-height: 300px;
  text-align: center; }

/*nav {
  text-align: right;
  padding: 0px 50px;
  display: inline-block;
  float: right;
  margin: 50px 0px;
}

nav li {
  display: inline-block;
  color: white;
  margin: 0px 10px;
  cursor: pointer;
  padding: 5px 0px;
  letter-spacing: 1px;
}

nav li:hover {
  border-bottom: 1px solid #fff;
}
*/
.bgimg2 h4, .bgimg3 h4, .bgimg4 h4, .bgimg5 h4, .bgPhk h4 {
  padding: 140px 0px;
  color: white;
  margin: 0px;
  letter-spacing: 2px;
  font-family: 'Montserrat', sans-serif; }

.bgimg1, .bgimg2, .bgimg3, .bgimg4, .bgimg5, .bgPhk, .subheaders {
  background-attachment: fixed;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat; }

.bgimg1 .logo .mainimg {
  text-align: left;
  color: white;
  margin: auto;
  display: inline-block;
  width: 200px;
  float: left;
  padding: 30px 30px; }

.bgimg1 .caption {
  width: 80%;
  padding: 20% 10%;
  color: white;
  text-align: center; }

.bgimg1 .caption h1 {
  letter-spacing: 5px;
  font-size: 50px;
  color: #f6685e; }

.bgimg1 .caption h2 {
  letter-spacing: 5px;
  font-size: 20px; }

.caption input {
  width: 30%;
  color: #222;
  transition: 13s;
  border-radius: 0px; }

.caption h1 {
  font-size: 50px;
  letter-spacing: 2px;
  font-family: 'Montserrat', sans-serif;
  color: #f6685e;
  font-weight: bold; }

.caption h5 {
  letter-spacing: 2px; }

.caption button {
  width: 20%;
  border: 0px;
  color: black;
  border-radius: 0px;
  padding: 0px;
  background: #fff; }

.caption button:focus {
  border: 1px solid white;
  color: white; }

.caption button:hover {
  border: 0px;
  background: #933e38;
  transition: 0.8s;
  color: white; }

.caption a:hover {
  border: 0px;
  background: #933e38;
  transition: 0.8s;
  color: white; }

.wine-button {
  text-decoration: none;
  padding: 10px 15px;
  border: 1px solid #f6685e;
  color: #f6685e;
  cursor: pointer; }

.wine-button:hover {
  color: #f6685e; }

.wine-button:focus {
  color: #f6685e; }

.caption a {
  display: inline-block;
  height: 38px;
  color: #000;
  text-align: center;
  font-size: 11px;
  font-weight: 600;
  line-height: 38px;
  letter-spacing: .1rem;
  text-transform: uppercase;
  text-decoration: none;
  white-space: nowrap;
  background-color: #fff;
  border: 0px;
  cursor: pointer;
  box-sizing: border-box;
  width: 20%;
  margin: 15px; }

#tourField {
  border-radius: 0px; }

.coworking div:first-child {
  background-color: #f6685e; }

.coworking div:last-child {
  background-color: #ac4841; }

.coworking div {
  width: 50%;
  height: 100%;
  display: inline-block;
  text-align: center;
  vertical-align: top;
  color: #fff; }

.coworking div h5 {
  margin-top: 100px;
  color: white;
  font-size: 30px;
  font-family: 'Montserrat', sans-serif; }

.coworking div p {
  margin: 40px 60px; }

.coworking div a {
  text-decoration: none;
  padding: 10px 15px;
  border: 1px solid #fff;
  color: #fff; }

.features {
  width: 90%;
  padding: 100px 5%;
  text-align: center; }

.features h5 {
  font-family: 'Montserrat', sans-serif; }

.features h3 {
  margin: 0px; }

.features .icons div {
  width: 33.3%;
  display: inline-block; }

.icons div i {
  font-size: 50px;
  padding: 50px 0px; }

.features .icons div, .list div h6 {
  padding: 10px 0px; }

.list {
  width: 100%;
  text-align: center; }

.list div {
  width: 30%;
  display: inline-block;
  margin: 20px 1%;
  text-align: center;
  vertical-align: text-top;
  word-break: break-all; }

.list .block {
  display: block;
  text-align: center;
  width: 100%; }

.list div p {
  text-align: justify;
  word-break: break-word;
  padding: 0px 10px; }

.list div h5 {
  text-align: center;
  font-size: 17px;
  word-break: break-word;
  font-weight: 800;
  letter-spacing: 1px; }

.list div img {
  margin: 0 auto;
  width: 150px;
  display: block;
  height: 150px;
  padding: 30px 0px; }

.list button {
  margin-top: 50px;
  border-radius: 0px; }

.logos div h3 {
  font-size: 20px;
  padding: 15px;
  color: #4c4c4c; }

.center {
  width: 90%;
  margin: 80px 5%;
  text-align: center; }

.list {
  width: 100%; }

.event {
  width: 90%;
  padding: 100px 5%;
  text-align: center; }

.event h3 {
  margin: 0px; }

.dual-width {
  width: 100%;
  text-align: center; }

.dual-width div {
  width: 46%;
  display: inline-block;
  margin: 0px 2%;
  text-align: center;
  vertical-align: text-top;
  padding: 50px 0px; }

.dual-width div .button {
  border-radius: 0px;
  border: 1px solid #f6685e;
  color: #f6685e; }

.prog-header1 {
  background: url("https://storage.googleapis.com/ispace-website.appspot.com/new2.jpeg"); }

.comm-header1 {
  background: url("https://storage.googleapis.com/ispace-website.appspot.com/ispaceghana5.jpeg"); }

.memb-header1 {
  background: url("https://storage.googleapis.com/ispace-website.appspot.com/home1.jpeg");
  background-size: 100% 100%;
  background-repeat: no-repeat; }

.event-header1 {
  background: url("https://storage.googleapis.com/ispace-website.appspot.com/event.jpeg"); }

.prog-header1, .comm-header1, .memb-header1, .event-header1 {
  height: 500px;
  text-align: center;
  background-attachment: fixed;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat; }

.subheaders .logo {
  width: 200px; }

.logo a {
  position: absolute;
  z-index: 3;
  left: 0;
  padding: 20px;
  cursor: pointer; }

.subheaders .logo img {
  width: 200px; }

.subheaders .caption {
  padding: 15% 0px;
  color: white; }

.subpage {
  width: 90%;
  padding: 0px 5%;
  text-align: center; }

.subpage h4 {
  margin: 50px 0px;
  color: #f6685e;
  font-family: 'Montserrat', sans-serif; }

.subpage .list {
  width: 100%;
  margin: 0px 0px; }

.subpage .list div {
  width: 21%;
  display: inline-block;
  margin: 50px 2%;
  text-align: center;
  vertical-align: text-top;
  padding: 0px 0px 20px 0px; }

.subpage .list div h3 {
  text-align: center;
  color: #f6685e;
  font-family: 'Montserrat', sans-serif;
  font-size: 30px;
  padding: 60px 0px 40px 0px;
  margin: 0px; }

.subpage .list div h5 {
  text-align: center;
  color: #f6685e;
  font-family: 'Montserrat', sans-serif;
  font-size: 20px;
  padding: 20px 0px;
  margin: 0px; }

.subpage .list div img {
  width: 100%;
  display: block;
  height: 300px;
  border-radius: 50%; }

.subpage .list div {
  text-align: center; }

.subpage .list div .details {
  width: 100%;
  padding: 20px 0px; }

.subpage button {
  width: 20%;
  color: #f6685e;
  border: 0px solid #f6685e;
  padding: 0px; }

.subpage button:last-child {
  width: 20%;
  border-left: 1px solid #f6685e;
  border-right: 0px;
  border-top: 0px;
  border-bottom: 0px;
  color: #f6685e; }

/*
==============================
PROGRAMS
==============================
*/
.programs {
  width: 100%; }

.programs .code-school-register {
  width: 100%; }

.programs .code-school-register p {
  width: 80%;
  margin: 0px auto; }

.programs .code-school-register h6 {
  margin: 30px 10%;
  border-bottom: 1px solid;
  display: inline-block; }

.programs .code-school-register form {
  width: 80%;
  margin: 20px 10% 80PX 10%; }

.programs .code-school-register form label {
  width: 48%;
  margin: 10px 1%;
  display: inline-block; }

.programs .code-school-register form .essay {
  width: 98%;
  margin: 10px 1%;
  display: inline-block; }

.programs .code-school-register form input {
  margin: 10px 0%; }

.programs .code-school-register form select {
  width: 100%;
  border-radius: 0px;
  margin: 10px 0%; }

.programs .code-school-register form input[type="email"], .programs .code-school-register form input[type="number"], .programs .code-school-register form textarea {
  width: 100%;
  border-radius: 0px;
  margin: 10px 0%; }

.programs .code-school-register form button {
  width: 100px;
  margin: 10px 1%;
  display: inline-block;
  border-radius: 0px;
  border: 1px solid #f6685e;
  color: #f6685e; }

.programs .code-school-register form button:hover {
  background: #f6685e;
  color: white; }

.team {
  width: 80%;
  margin: 50px auto;
  text-align: center; }

.team h4 {
  color: #f6685e;
  font-family: 'Montserrat', sans-serif; }

.team .list {
  width: 100%; }

.team .list div {
  width: 21%;
  display: inline-block;
  margin: 50px 2%;
  text-align: center;
  vertical-align: text-top;
  padding: 0px 0px 20px 0px;
  cursor: pointer; }

.team .list div img {
  width: 150px;
  height: 150px;
  display: block;
  border-radius: 50%; }

.team .list div h5 {
  font-family: 'Montserrat', sans-serif;
  margin: 10px;
  font-size: 16px; }

.team .list div a {
  font-size: 20px;
  margin: 0px 10px; }

.blog h3 {
  text-align: center; }

.blog form {
  width: 60%;
  margin: auto;
  color: #888;
  padding-top: 5%; }

.blog form label {
  margin: 40px 0px;
  color: #f6685e; }

.blog form input {
  color: #888;
  border-radius: 0px;
  border: 0px; }

.blog form textarea {
  width: 100%;
  border-radius: 0px; }

.blog form input[type='file'] {
  width: 100%;
  padding: 6px 10px; }

.blog form textarea {
  border: 0px; }

.blog form input, .blog form textarea {
  margin: 20px 0px; }

.blog form textarea {
  height: 200px; }

.blog button {
  width: initial; }

.blog form input:focus, .blog form textarea:focus {
  border: 0px; }

.blog form .add {
  padding: 20px 0px;
  margin: 40px 0px;
  cursor: pointer; }

.blog form .add i {
  vertical-align: middle;
  color: #f6685e; }

.blog #delete {
  margin: 20px 20%;
  background: #e66565;
  border: 0px;
  color: white; }

.link {
  width: 86%;
  text-align: right;
  margin: 0px auto;
  padding: 20px 0px; }

.link a {
  right: 0px;
  padding: 10px 20px;
  background-color: #0c4557;
  color: white;
  display: inline-block; }

.blog .list {
  width: 90%;
  padding: 0px;
  text-align: center;
  margin: 50px auto; }

.subpage .list {
  width: 100%;
  margin: 50px 0px; }

.blog .list .item {
  width: 29%;
  display: inline-block;
  margin: 20px 2%;
  text-align: center;
  position: relative;
  padding: 0px;
  transition: 1s;
  cursor: pointer;
  overflow: hidden;
  font-size: 0px;
  border: 1px solid #ccc;
  border-radius: 2px; }

.blog .list .item .image {
  width: 100%;
  height: 250px;
  overflow: hidden;
  margin: 0px; }

.blog .list .item .image img {
  width: 100%;
  height: 100%;
  border-radius: 0px;
  padding: 0px;
  transition: 0.6s ease; }

.blog .list .item:hover img {
  transform: scale(1.3); }

.blog .list .item .desc {
  width: 90%;
  margin: 0px auto;
  padding: 25px 0px; }

.blog .list .item .desc #title {
  margin: 0px auto;
  color: #2f2f2f;
  height: 80px;
  width: 96%;
  text-align: left; }

.blog .list .item .desc #title h4 {
  font-size: 16px;
  z-index: 1;
  margin: 0px;
  font-weight: bold;
  letter-spacing: 1.5px;
  overflow: hidden !important;
  width: 100%;
  margin: 0px auto;
  word-break: break-word;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  color: #323232; }

.blog .list .item .desc #editor {
  margin: 0px auto;
  color: #2f2f2f;
  width: 100%;
  text-align: left; }

.blog .list .item .desc #editor i {
  vertical-align: bottom;
  color: #f0665d; }

.blog .list .item .desc #editor span {
  font-size: 15px;
  margin: 0px 10px;
  color: #666666;
  text-transform: capitalize;
  display: inline-block; }

.blogPost {
  width: 100%;
  text-align: center; }

.blogPost .title {
  width: 70%;
  margin: 30px auto;
  margin-top: 0px; }

.blogPost .title #editor {
  margin: 15px auto;
  color: #2f2f2f;
  width: 100%;
  text-align: left; }

.blogPost .title #editor i {
  vertical-align: bottom;
  color: #f0665d; }

.blogPost .title #editor span {
  font-size: 15px;
  margin: 0px 10px;
  color: #666666;
  text-transform: capitalize;
  display: inline-block; }

.blogPost .title h1 {
  text-align: left;
  font-size: 36px;
  font-weight: bold; }

.blogPost .ispacelogo {
  width: 15%;
  padding: 30px; }

.blogPost .body {
  padding: 10px 0px 100px 0px; }

.blogPost .banner {
  width: 100%; }

.blogPost .banner img {
  width: 70%; }

.blogPost p {
  width: 70%;
  margin: 55px 15% 0px 15%;
  color: #4c4c4c;
  letter-spacing: 2px;
  word-break: break-word;
  text-align: left;
  font-size: 16px; }

.blogPost p a {
  color: #ce3e35;
  border-bottom: 2px solid;
  font-weight: bold; }

.goback {
  font-size: 50px;
  color: #f6685e;
  padding: 30px;
  cursor: pointer;
  position: absolute;
  z-index: 99; }

.media .subpage {
  width: 90%;
  padding: 0px 5%;
  text-align: center;
  margin-top: 40px; }

.media .subpage button:last-child {
  width: 20%;
  border-left: 1px solid #f6685e;
  color: #f6685e;
  border-radius: 0px; }

.media .images {
  width: 90%;
  margin: 20px 5%; }

.images .list div {
  width: 350px;
  margin: 0px;
  position: relative;
  margin: 3% 1%;
  text-align: center; }

.images .list div img {
  margin: 0px;
  width: 100%;
  height: 80%; }

.galleryview .pictures img {
  width: 31%;
  height: 250px;
  vertical-align: top;
  margin: 35px 1%; }

.galleryview .pictures {
  background: #e5e5e5; }

.galleryview h1 {
  font-size: 30px;
  margin: 40px;
  text-align: center;
  color: #f6685e; }

.images .list div p {
  text-align: center;
  font-size: 20px;
  cursor: pointer;
  padding: 15px; }

.media .videos {
  width: 90%;
  margin: 20px 5%; }

.videos .list div {
  width: 44%;
  margin: 20px 3%;
  height: 300px; }

.videos .list div iframe {
  margin: 0px;
  width: 100%;
  height: 90%; }

.videos .list div p {
  text-align: center; }

.profile h1 {
  font-size: 30px;
  margin: 40px;
  text-align: center;
  color: #f6685e; }

.profile .body {
  width: 80%;
  margin: 30px auto;
  padding: 0px 0px; }

.profile .body .pic {
  width: 100%;
  text-align: center;
  margin: 20px 0px; }

.profile .body .pic img {
  width: 300px;
  height: 300px;
  margin: 0px auto;
  border-radius: 50%; }

.profile .body .about h6 {
  color: #666666;
  font-size: 20px; }

.profile .body .about {
  width: 100%;
  vertical-align: top;
  text-align: center; }

.profile .body .about a {
  color: #f6685e; }

.profile .body .about i {
  font-size: 25px;
  text-align: center;
  padding: 5px; }

.profile .body .about p {
  width: 80%;
  margin: 50px auto;
  color: #7f7f7f; }

.eventpage .subpage span {
  display: block;
  font-size: 20px;
  padding: 10px 0px; }

.eventpage .subpage h4 {
  margin: 30px 0px; }

.eventpage .subpage a {
  width: 20%;
  border: 1px solid #f6685e;
  color: #f6685e;
  border-radius: 0px;
  padding: 10px 20px;
  text-decoration: none; }

.eventpage .list div {
  background: white; }

.eventpage .list div button {
  width: 50%;
  margin: 20px; }

.eventpage .list div p {
  text-align: center;
  margin: 0px 20px 20px 20px; }

.eventpage #layer {
  width: 90%;
  margin: 30px 5%; }

.eventpage #layer #image, .eventpage #layer #content {
  width: 50%;
  display: inline-block;
  vertical-align: middle; }

.eventpage .subpage .list div {
  width: 16%;
  display: inline-block;
  margin: 50px 2%;
  text-align: center;
  vertical-align: text-top;
  padding: 0px 0px 20px 0px; }

#layer #image img {
  width: 100%;
  display: inline-block; }

#layer #content div {
  padding: 0px 60px; }

#layer #content {
  text-align: center; }

#layer #content h3 {
  color: #f6685e;
  font-family: 'Montserrat', sans-serif;
  font-size: 30px; }

#layer #content p {
  color: #666666; }

.upcoming .list div {
  color: white;
  padding: 30px 0px;
  background: #f6685e; }

.upcoming .list div:hover {
  background: white;
  color: #f6685e; }

.upcoming .list div:hover #item {
  background: inherit;
  color: white; }
  .upcoming .list div:hover #item h5, .upcoming .list div:hover #item span {
    color: #f6685e; }

.upcoming .list div button {
  width: 50%;
  margin: 20px; }

.upcoming .list div h3 {
  font-family: 'Montserrat', sans-serif;
  color: #f6685e;
  border-bottom: 1px solid;
  margin: 0px 30px 0px 30px;
  padding: 10px 0px; }

.upcoming .list div p {
  text-align: center;
  margin: 20px; }

#active {
  background: #f6685e;
  color: white; }

#active #item {
  background: #f6685e; }

#active p {
  text-align: center;
  margin: 20px;
  color: #fff; }

#active h3, #active h5 {
  font-family: 'Montserrat', sans-serif;
  color: #fff; }

#item {
  width: 100%;
  border: 0px;
  margin: 0px;
  padding: 0px;
  cursor: pointer; }

#item h5 {
  display: inline-block;
  font-size: 60px;
  margin: 0px;
  padding: 0px;
  color: #fff; }

#item span {
  display: inline-block;
  color: #fff; }

#item p {
  margin: 30px;
  color: #666666; }

.month {
  margin: 50px 0px 0px 0px;
  width: 100%;
  color: #f6685e;
  font-family: 'Montserrat', sans-serif;
  text-align: center; }

.month p {
  margin: 0px; }

.month select {
  width: 40%;
  margin: 70px 30%;
  border: 1px solid #D1D1D1;
  border-radius: 0px;
  font-family: 'Montserrat', sans-serif;
  border-left: 0px;
  border-right: 0px;
  text-align-last: center;
  color: #666666; }

.month select:active {
  width: 40%;
  margin: 70px 30%;
  border: 1px solid #D1D1D1;
  border-radius: 0px;
  font-family: 'Montserrat', sans-serif;
  border-left: 0px;
  border-right: 0px;
  text-align-last: center;
  color: #666666; }

.eventpage .details {
  width: 80%;
  margin: 50px 10%; }

.eventpage .details p {
  width: 80%;
  margin: 0px auto;
  text-align: justify; }

.eventpage .details h3 {
  text-align: center; }

.eventpage .details .about {
  width: 70%;
  margin: 20px 0px;
  text-align: center;
  letter-spacing: 2px;
  display: inline-block;
  vertical-align: top;
  padding: 60px 0px; }

.eventpage .details .organizers {
  width: 29%;
  display: inline-block;
  text-align: center; }

.eventpage .details .organizers img {
  width: 200px;
  border-radius: 50%;
  display: inline-block;
  margin: 50px 0px; }

.eventpage .details .organizers a {
  width: 100%;
  display: block;
  width: 100%; }

.eventpage .details .organizers h4 {
  color: #f6685e; }

#submitbox {
  padding: 50px 0px;
  width: 40%;
  position: absolute;
  margin: 10% 30%;
  z-index: 2;
  background: white;
  text-align: center;
  border: 1px solid #888; }

#submitbox h4 {
  text-align: center;
  color: #f6685e;
  font-family: 'Montserrat', sans-serif;
  font-size: 25px; }

#submitbox a {
  font-size: 20px;
  font-family: 'Raleway', sans-serif;
  color: #f6685e;
  cursor: pointer;
  border-bottom: 1px solid #f6685e; }

#submitbox form {
  width: 80%;
  margin: 0px 10%; }

#submitbox form input {
  display: block;
  border-radius: 0px;
  width: 100%; }

#submitbox form select {
  width: 100%;
  color: #7f7f7f;
  border-radius: 0px; }

#submitbox form button {
  display: block;
  border-radius: 0px;
  width: 100%; }

.mem-descp {
  text-align: center;
  padding: 100px 50px;
  text-align: center; }

.mem-descp .sub {
  text-align: center;
  font-size: 25px;
  color: #f6685e; }

.mem-descp a {
  margin: 0px 20px;
  color: #f6685e;
  background: #fff;
  padding: 10px 15px;
  border: 1px solid;
  transition: 0.5s;
  cursor: pointer; }

.mem-descp a:hover {
  color: #fff;
  background: #f6685e; }

.mem-descp h2 {
  text-align: center;
  font-size: 35px;
  color: #f6685e;
  font-family: 'Montserrat', sans-serif;
  padding: 10px 0px; }

.mem-descp p {
  padding: 0px 10%;
  text-align: justify; }

.memberships .subpage .list div {
  margin: 0px 1% 30px 1%;
  height: 400px; }

.memberships .subpage .list div p {
  color: #7f7f7f;
  padding: 30px;
  font-size: 17px;
  text-align: center; }

.memberships .subpage #black {
  background-color: #191919; }

.subpage #black h3, .subpage #red h3 {
  color: white;
  display: inline-block;
  border-bottom: 1px solid; }

.subpage #white h3 {
  color: #666666; }

.memberships .subpage #red {
  background-color: #f6685e; }

.subpage #red p {
  color: white; }

.subpage #black p {
  color: white; }

.subpage #white p {
  color: #7f7f7f; }

.subpage #white h3 {
  display: inline-block;
  border-bottom: 1px solid #7f7f7f; }

/*
=============================================
PROJECTS
=============================================
*/
.projects {
  width: 90%;
  margin: 80px auto; }

.projects .item {
  margin: 50px 0px; }

.projects .item .logo {
  display: inline-block;
  width: 20%; }

.projects .item .about {
  display: inline-block;
  width: 50%;
  margin: 0px 5%;
  vertical-align: top;
  word-wrap: break-word;
  font-family: 'Raleway', sans-serif;
  color: #888;
  letter-spacing: 3px; }

.projects .item .about p {
  width: 100%;
  text-align: justify; }

.projects .item p h3 {
  color: #648880; }

.projects .item .team {
  width: 20%;
  display: inline-block;
  vertical-align: top;
  font-family: 'Raleway', sans-serif;
  color: #888;
  letter-spacing: 3px;
  text-align: center; }

.projects .item .team img {
  width: 80%;
  border-radius: 50%; }

.projects .item .team .fix {
  height: 200px;
  width: 200px; }

.subpage #white {
  border: 1px solid #999999; }

/*
=============================================
COMMUNITY
=============================================
*/
.community .logos {
  width: 80%;
  margin: 50px auto; }

.community .logos div {
  width: 21%;
  margin: 20px 2%;
  display: inline-block;
  vertical-align: top;
  text-align: center; }

.logos div img {
  width: 150px;
  margin: 20px 0px;
  display: inline-block;
  height: inherit; }

.community .logos div h3 {
  text-align: left; }

/*
=============================================
FOOTER
=============================================
*/
footer {
  width: 100%;
  background-color: #0c000c;
  color: white;
  font-family: 'Montserrat', sans-serif; }

footer div h5 {
  color: #f6685e;
  text-align: justify;
  font-size: 20px;
  letter-spacing: 2px; }

.layer1, .layer2 {
  width: 80%;
  margin: 0px 10%;
  letter-spacing: 4px;
  padding: 80px 0% 20px 0%; }

.feedback, .twitter-feeds {
  width: 40%;
  display: inline-block;
  vertical-align: top;
  padding: 0px 5% 0px 5%;
  color: white;
  display: block;
  display: inline-block; }

.feedback div {
  margin: 0px auto;
  width: 70%;
  text-align: left; }

.feedback form h6 {
  font-size: 18px;
  color: white;
  margin: 10px; }

.feedback form {
  width: 80%;
  margin: 0px auto;
  text-align: left; }

.feedback form input[type="text"] {
  vertical-align: top;
  color: black;
  width: 100%;
  border-radius: 0px;
  display: inline-block; }

.feedback form input[type="checkbox"] {
  margin: 15px; }

.feedback form button {
  color: white;
  border-radius: 0px;
  margin-top: 10px; }

.layer1 .about, .layer1 .contact {
  color: white;
  display: block;
  display: inline-block;
  text-align: justify; }

footer div .contact {
  width: 100%; }

footer div .contact span {
  display: block;
  font-size: 13px; }

footer .icons {
  padding: 20px 0px; }

footer .icons i {
  font-size: 20px;
  text-align: center;
  padding: 10px 20px;
  border-radius: 50%;
  color: white;
  transition: 1s;
  cursor: pointer; }

footer .icons i:hover {
  color: #f6685e; }

.icons a {
  color: #888; }

footer .layer2 {
  text-align: center;
  color: #666666;
  padding: 0px 0px 40px 0px;
  letter-spacing: 5px; }

footer .layer2 span {
  display: block; }

.Noevents {
  padding: 0px 60px 70px 60px; }

.loading {
  width: 100%;
  height: 100vh;
  text-align: center; }

.loading h1 {
  position: absolute;
  top: 40vh;
  text-align: center;
  width: 100%;
  font-size: 40px;
  letter-spacing: 1px; }

.loading2 {
  width: 50vw; }

.loading2 h1 {
  top: 40vh;
  text-align: center;
  font-size: 18px;
  letter-spacing: 1px;
  font-weight: bold;
  word-break: break-word; }

.loading3 {
  width: 80%;
  margin-left: 20%;
  position: relative; }

.loading3 h1 {
  top: 40vh;
  text-align: center;
  font-size: 40px;
  letter-spacing: 1px;
  padding: 250px 0px;
  word-break: break-word; }

.loading4 {
  width: 50vw;
  position: relative; }

.loading4 h1 {
  top: 40vh;
  text-align: center;
  font-size: 40px;
  letter-spacing: 1px;
  padding: 100px 0px;
  word-break: break-word; }

@media screen and (max-width: 600px) {
  .mem-descp .sub {
    padding: 100px 0px; }
  .team .list div {
    width: 92%;
    display: inline-block;
    margin: 50px 4%; }
  .projects .item img {
    display: inline-block;
    width: 100%; }
  .projects .item .about {
    display: inline-block;
    width: 90%;
    margin: 20px 5%; }
  .projects .item .team {
    display: inline-block;
    width: 50%;
    margin: 50px 25%; }
  .community .logos div {
    width: 90%;
    margin: 20px 5%;
    display: inline-block;
    vertical-align: top;
    text-align: center; }
  #submitbox {
    width: 90%;
    margin: 10% 5%;
    z-index: 100; }
  .eventpage .details .about {
    width: 100%;
    margin: 0px; }
  .eventpage .details .organizers {
    width: 100%;
    margin: 0px;
    text-align: center;
    margin: 20px 0px; }
  .fixedheader .img {
    width: 40%; }
  .subheaders .logo img {
    width: 150px;
    padding: 10px 0px; }
  .blogPost .ispacelogo {
    width: 40%;
    padding: 30px;
    display: inherit; }
  .blogPost .banner img {
    width: 80%; }
  .blogPost .title {
    width: 80%; }
  .blogPost .title h1 {
    font-size: 18px;
    letter-spacing: 2px; }
  .blogPost p {
    font-size: 14px;
    width: 80%;
    margin: 30px 10%; } }

@media screen and (min-width: 600px) {
  .team .list div {
    width: 44%;
    display: inline-block;
    margin: 50px 3%; }
  .community .logos div {
    width: 44%;
    margin: 20px 3%;
    display: inline-block;
    vertical-align: top;
    text-align: center; }
  .blog .list .item {
    width: 90%;
    margin: 15px auto; } }

@media screen and (min-width: 800px) {
  .mem-descp .sub {
    padding: 100px 0px; }
  .team .list div {
    width: 31%;
    display: inline-block;
    margin: 50px 1%; }
  .community .logos div {
    width: 21%;
    margin: 20px 2%;
    display: inline-block;
    vertical-align: top;
    text-align: center; }
  .blog .list .item {
    width: 29%;
    margin: 15px 2%; } }

@media screen and (min-width: 1000px) {
  .team .list div {
    width: 21%;
    display: inline-block;
    margin: 50px 2%; } }

@media screen and (max-width: 900px) {
  .bgimg1 .caption h1 {
    font-size: 40px; }
  .caption a {
    display: inline-block;
    height: 40%;
    padding: 5px 0px;
    color: #000;
    text-align: center;
    font-size: 10px;
    width: 30%;
    margin: 15px; }
  .caption input {
    height: 40%;
    font-size: 40px;
    padding: 20px 0px; }
  .caption button {
    width: 30%;
    color: black;
    font-size: 10px;
    padding: 5px 0px;
    padding-bottom: 5px;
    height: 40%; }
  .subpage .list div h5 {
    text-align: center;
    color: #f6685e;
    font-family: 'Montserrat', sans-serif;
    font-size: 15px;
    padding: 10px; }
  .blog .list .item {
    width: 90%;
    margin: 15px auto; } }

@media screen and (max-width: 800px) {
  .bgimg1 .caption h1 {
    font-size: 30px; }
  #tourField {
    padding: 0px;
    width: 90%;
    font-size: 20px;
    padding: 10px 5px; }
  .coworking div {
    width: 100%; }
  .dual-width div button {
    width: 50%;
    font-size: 10px;
    padding-left: 0px;
    padding-right: 0px; }
  .galleryview .pictures img {
    width: 100%; }
  .subpage .list div {
    width: 40%;
    display: inline-block;
    margin: 50px 5%;
    text-align: center;
    vertical-align: text-top;
    padding: 10px 0px; }
  .subpage .list div:last-child {
    width: 40%;
    display: block;
    margin: 50px 5%;
    text-align: center;
    vertical-align: text-top;
    padding: 10px 0px; }
  .images .list div, .videos .list div {
    width: 100%; }
  .feedback h6 {
    font-size: 20px; }
  footer div {
    text-align: center;
    width: 100%;
    display: block;
    vertical-align: top; }
  .features .icons div {
    width: 100%;
    display: block; }
  footer div h6 {
    text-align: center; }
  footer form input[type="text"], button {
    width: 100%;
    border-radius: 0px; }
  footer form button {
    width: 100%; } }

@media screen and (max-width: 600px) {
  .logo .mainimg {
    padding-top: 40%; }
  .bgimg1 .caption {
    width: 100%;
    padding: 50% 0%;
    color: white;
    text-align: center; }
  #tourField {
    padding: 0px;
    width: 90%;
    font-size: 20px;
    padding: 10px 5px; }
  .coworking div {
    width: 100%; }
  .subheaders .caption {
    padding: 45% 0px;
    color: white; }
  .caption h1 {
    font-size: 30px;
    letter-spacing: 2px;
    font-family: 'Montserrat', sans-serif; }
  .caption a {
    display: inline-block;
    height: 40%;
    padding: 5px 0px;
    color: #000;
    text-align: center;
    font-size: 13px;
    width: 90%;
    margin: 15px; }
  .caption input {
    height: 40%;
    font-size: 40px;
    padding: 20px 0px; }
  .caption button {
    width: 90%;
    margin: 15px;
    color: black;
    font-size: 13px;
    padding: 5px 0px;
    padding-bottom: 5px;
    height: 40%; }
  .images .list div, .videos .list div {
    width: 100%; }
  .galleryview .pictures img {
    width: 100%;
    vertical-align: top; }
  .bgimg1 .caption h1 {
    font-size: 15px; }
  .list div {
    display: block;
    width: 100%;
    text-align: center;
    vertical-align: text-top; }
  .programs .code-school-register form label {
    width: 98%;
    margin: 10px 1%;
    display: inline-block; }
  .list .block {
    display: block;
    text-align: center;
    width: 100%; }
  .subpage .list div {
    width: 100%;
    display: block; }
  .dual-width div {
    display: block;
    width: 100%;
    margin: 0px; }
  .dual-width div button {
    width: 70%; }
  .subpage .list div, .subpage .list div:last-child {
    width: 90%;
    display: inline-block;
    margin: 50px 5%;
    text-align: center;
    vertical-align: text-top;
    padding: 0px 0px 10px 0px; }
  .subpage .list div h5 {
    font-size: 20px; }
  .eventpage #reserve form {
    width: 70%;
    margin: 0px 15%; }
  .month select {
    width: 40%;
    margin: 70px 30%;
    border: 1px solid #D1D1D1;
    border-radius: 0px;
    font-family: 'Montserrat', sans-serif;
    border-left: 0px;
    border-right: 0px;
    text-align-last: center;
    color: #666666; }
  .feedback h6 {
    font-size: 20px; }
  footer div h6 {
    text-align: center; }
  footer div {
    text-align: center;
    width: 100%;
    display: block;
    vertical-align: top; }
  footer .layer div {
    text-align: center;
    width: 100%;
    display: block;
    vertical-align: top; }
  .feedback, .twitter-feeds {
    width: 100%;
    display: inline-block;
    padding: 0px;
    margin-bottom: 10px; }
  footer form input[type="text"] {
    width: 100%;
    border-radius: 0px; }
  footer form button {
    width: 100%; } }
html {
  font-family: sans-serif;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%; }

body {
  margin: 0; }

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
  display: block; }

audio,
canvas,
progress,
video {
  display: inline-block;
  vertical-align: baseline; }

audio:not([controls]) {
  display: none;
  height: 0; }

[hidden],
template {
  display: none; }

a {
  background-color: transparent; }

a:active,
a:hover {
  outline: 0; }

abbr[title] {
  border-bottom: 1px dotted; }

b,
strong {
  font-weight: bold; }

dfn {
  font-style: italic; }

h1 {
  font-size: 2em;
  margin: 0.67em 0; }

mark {
  background: #ff0;
  color: #000; }

small {
  font-size: 80%; }

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline; }

sup {
  top: -0.5em; }

sub {
  bottom: -0.25em; }

img {
  border: 0; }

svg:not(:root) {
  overflow: hidden; }

figure {
  margin: 1em 40px; }

hr {
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  height: 0; }

pre {
  overflow: auto; }

code,
kbd,
pre,
samp {
  font-family: monospace, monospace;
  font-size: 1em; }

button,
input,
optgroup,
select,
textarea {
  color: inherit;
  font: inherit;
  margin: 0; }

button {
  overflow: visible; }

button,
select {
  text-transform: none; }

button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
  -webkit-appearance: button;
  cursor: pointer; }

button[disabled],
html input[disabled] {
  cursor: default; }

button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0; }

input {
  line-height: normal; }

input[type="checkbox"],
input[type="radio"] {
  box-sizing: border-box;
  padding: 0; }

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  height: auto; }

input[type="search"] {
  -webkit-appearance: textfield;
  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box;
  box-sizing: content-box; }

input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none; }

fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em; }

legend {
  border: 0;
  padding: 0; }

textarea {
  overflow: auto; }

optgroup {
  font-weight: bold; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

td,
th {
  padding: 0; }
@charset "UTF-8";
.container {
  position: relative;
  width: 100%;
  max-width: 100%;
  margin: 0 auto;
  box-sizing: border-box; }

.column,
.columns {
  width: 100%;
  float: left;
  box-sizing: border-box; }

/* For devices larger than 400px */
@media (min-width: 400px) {
  .container {
    width: 100%;
    padding: 0; } }

/* For devices larger than 550px */
@media (min-width: 550px) {
  .container {
    width: 100%; }
  .column,
  .columns {
    margin-left: 4%; }
  .column:first-child,
  .columns:first-child {
    margin-left: 0; }
  .one.column,
  .one.columns {
    width: 4.66666666667%; }
  .two.columns {
    width: 13.3333333333%; }
  .three.columns {
    width: 22%; }
  .four.columns {
    width: 30.6666666667%; }
  .five.columns {
    width: 39.3333333333%; }
  .six.columns {
    width: 48%; }
  .seven.columns {
    width: 56.6666666667%; }
  .eight.columns {
    width: 65.3333333333%; }
  .nine.columns {
    width: 74.0%; }
  .ten.columns {
    width: 82.6666666667%; }
  .eleven.columns {
    width: 91.3333333333%; }
  .twelve.columns {
    width: 100%;
    margin-left: 0; }
  .one-third.column {
    width: 30.6666666667%; }
  .two-thirds.column {
    width: 65.3333333333%; }
  .one-half.column {
    width: 48%; }
  /* Offsets */
  .offset-by-one.column,
  .offset-by-one.columns {
    margin-left: 8.66666666667%; }
  .offset-by-two.column,
  .offset-by-two.columns {
    margin-left: 17.3333333333%; }
  .offset-by-three.column,
  .offset-by-three.columns {
    margin-left: 26%; }
  .offset-by-four.column,
  .offset-by-four.columns {
    margin-left: 34.6666666667%; }
  .offset-by-five.column,
  .offset-by-five.columns {
    margin-left: 43.3333333333%; }
  .offset-by-six.column,
  .offset-by-six.columns {
    margin-left: 52%; }
  .offset-by-seven.column,
  .offset-by-seven.columns {
    margin-left: 60.6666666667%; }
  .offset-by-eight.column,
  .offset-by-eight.columns {
    margin-left: 69.3333333333%; }
  .offset-by-nine.column,
  .offset-by-nine.columns {
    margin-left: 78.0%; }
  .offset-by-ten.column,
  .offset-by-ten.columns {
    margin-left: 86.6666666667%; }
  .offset-by-eleven.column,
  .offset-by-eleven.columns {
    margin-left: 95.3333333333%; }
  .offset-by-one-third.column,
  .offset-by-one-third.columns {
    margin-left: 34.6666666667%; }
  .offset-by-two-thirds.column,
  .offset-by-two-thirds.columns {
    margin-left: 69.3333333333%; }
  .offset-by-one-half.column,
  .offset-by-one-half.columns {
    margin-left: 52%; } }

/* Base Styles
–––––––––––––––––––––––––––––––––––––––––––––––––– */
/* NOTE
html is set to 62.5% so that all the REM measurements throughout Skeleton
are based on 10px sizing. So basically 1.5rem = 15px :) */
html {
  font-size: 62.5%; }

body {
  font-size: 1.5em;
  /* currently ems cause chrome bug misinterpreting rems on body element */
  line-height: 1.6;
  font-weight: 400;
  font-family: "Raleway", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
  color: #222; }

/* Typography
–––––––––––––––––––––––––––––––––––––––––––––––––– */
h1, h2, h3, h4, h5, h6 {
  margin-top: 0;
  margin-bottom: 2rem;
  font-weight: 300; }

h1 {
  font-size: 4.0rem;
  line-height: 1.2;
  letter-spacing: -.1rem; }

h2 {
  font-size: 3.6rem;
  line-height: 1.25;
  letter-spacing: -.1rem; }

h3 {
  font-size: 3.0rem;
  line-height: 1.3;
  letter-spacing: -.1rem; }

h4 {
  font-size: 2.4rem;
  line-height: 1.35;
  letter-spacing: -.08rem; }

h5 {
  font-size: 1.8rem;
  line-height: 1.5;
  letter-spacing: -.05rem; }

h6 {
  font-size: 1.5rem;
  line-height: 1.6;
  letter-spacing: 0; }

/* Larger than phablet */
@media (min-width: 550px) {
  h1 {
    font-size: 5.0rem; }
  h2 {
    font-size: 4.2rem; }
  h3 {
    font-size: 3.6rem; }
  h4 {
    font-size: 3.0rem; }
  h5 {
    font-size: 2.4rem; }
  h6 {
    font-size: 1.5rem; } }

p {
  margin-top: 0; }

/* Links
–––––––––––––––––––––––––––––––––––––––––––––––––– */
a {
  color: #1EAEDB; }

a:hover {
  color: #0FA0CE; }

/* Buttons
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.button,
button,
input[type="submit"],
input[type="reset"],
input[type="button"] {
  display: inline-block;
  height: 38px;
  padding: 0 30px;
  color: #555;
  text-align: center;
  font-size: 11px;
  font-weight: 600;
  line-height: 38px;
  letter-spacing: .1rem;
  text-transform: uppercase;
  text-decoration: none;
  white-space: nowrap;
  background-color: transparent;
  border-radius: 4px;
  border: 1px solid #bbb;
  cursor: pointer;
  box-sizing: border-box; }

.button:hover,
button:hover,
input[type="submit"]:hover,
input[type="reset"]:hover,
input[type="button"]:hover,
.button:focus,
button:focus,
input[type="submit"]:focus,
input[type="reset"]:focus,
input[type="button"]:focus {
  color: #333;
  border-color: #888;
  outline: 0; }

.button.button-primary,
button.button-primary,
input[type="submit"].button-primary,
input[type="reset"].button-primary,
input[type="button"].button-primary {
  color: #FFF;
  background-color: #33C3F0;
  border-color: #33C3F0; }

.button.button-primary:hover,
button.button-primary:hover,
input[type="submit"].button-primary:hover,
input[type="reset"].button-primary:hover,
input[type="button"].button-primary:hover,
.button.button-primary:focus,
button.button-primary:focus,
input[type="submit"].button-primary:focus,
input[type="reset"].button-primary:focus,
input[type="button"].button-primary:focus {
  color: #FFF;
  background-color: #1EAEDB;
  border-color: #1EAEDB; }

/* Forms
–––––––––––––––––––––––––––––––––––––––––––––––––– */
input[type="email"],
input[type="number"],
input[type="search"],
input[type="text"],
input[type="tel"],
input[type="url"],
input[type="password"],
textarea,
select {
  height: 38px;
  padding: 6px 10px;
  /* The 6px vertically centers text on FF, ignored by Webkit */
  background-color: #fff;
  border: 1px solid #D1D1D1;
  border-radius: 4px;
  box-shadow: none;
  box-sizing: border-box; }

/* Removes awkward default styles on some inputs for iOS */
input[type="email"],
input[type="number"],
input[type="search"],
input[type="text"],
input[type="tel"],
input[type="url"],
input[type="password"],
textarea {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none; }

textarea {
  min-height: 65px;
  padding-top: 6px;
  padding-bottom: 6px; }

input[type="email"]:focus,
input[type="number"]:focus,
input[type="search"]:focus,
input[type="text"]:focus,
input[type="tel"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
textarea:focus,
select:focus {
  border: 1px solid #33C3F0;
  outline: 0; }

label,
legend {
  display: block;
  margin-bottom: .5rem;
  font-weight: 600; }

fieldset {
  padding: 0;
  border-width: 0; }

input[type="checkbox"],
input[type="radio"] {
  display: inline; }

label > .label-body {
  display: inline-block;
  margin-left: .5rem;
  font-weight: normal; }

/* Lists
–––––––––––––––––––––––––––––––––––––––––––––––––– */
ul {
  list-style: circle inside; }

ol {
  list-style: decimal inside; }

ol, ul {
  padding-left: 0;
  margin-top: 0; }

ul ul,
ul ol,
ol ol,
ol ul {
  margin: 1.5rem 0 1.5rem 3rem;
  font-size: 90%; }

li {
  margin-bottom: 1rem; }

/* Code
–––––––––––––––––––––––––––––––––––––––––––––––––– */
code {
  padding: .2rem .5rem;
  margin: 0 .2rem;
  font-size: 90%;
  white-space: nowrap;
  background: #F1F1F1;
  border: 1px solid #E1E1E1;
  border-radius: 4px; }

pre > code {
  display: block;
  padding: 1rem 1.5rem;
  white-space: pre; }

/* Tables
–––––––––––––––––––––––––––––––––––––––––––––––––– */
th,
td {
  padding: 12px 15px;
  text-align: left;
  border-bottom: 1px solid #E1E1E1; }

th:first-child,
td:first-child {
  padding-left: 0; }

th:last-child,
td:last-child {
  padding-right: 0; }

/* Spacing
–––––––––––––––––––––––––––––––––––––––––––––––––– */
button,
.button {
  margin-bottom: 1rem; }

input,
textarea,
select,
fieldset {
  margin-bottom: 1.5rem; }

pre,
blockquote,
dl,
figure,
table,
p,
ul,
ol,
form {
  margin-bottom: 2.5rem; }

/* Utilities
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.u-full-width {
  width: 100%;
  box-sizing: border-box; }

.u-max-full-width {
  max-width: 100%;
  box-sizing: border-box; }

.u-pull-right {
  float: right; }

.u-pull-left {
  float: left; }

/* Misc
–––––––––––––––––––––––––––––––––––––––––––––––––– */
hr {
  margin-top: 3rem;
  margin-bottom: 3.5rem;
  border-width: 0;
  border-top: 1px solid #E1E1E1; }

/* Clearing
–––––––––––––––––––––––––––––––––––––––––––––––––– */
/* Self Clearing Goodness */
.container:after,
.row:after,
.u-cf {
  content: "";
  display: table;
  clear: both; }

/* Media Queries
–––––––––––––––––––––––––––––––––––––––––––––––––– */
/*
Note: The best way to structure the use of media queries is to create the queries
near the relevant code. For example, if you wanted to change the styles for buttons
on small devices, paste the mobile query code up in the buttons section and style it
there.
*/
/* Larger than mobile */
/* Larger than phablet (also point when grid becomes active) */
/* Larger than tablet */
/* Larger than desktop */
/* Larger than Desktop HD */
.col-60 {
  width: 60%; }

.col-40 {
  width: 40%; }

.col-60, .col-40 {
  display: inline-block;
  height: 100%;
  vertical-align: top; }

.welcome {
  height: 100vh;
  width: 100%; }

.welcome .desc {
  background: linear-gradient(to right bottom, #ef5251, #191f29);
  position: relative; }

.welcome .desc .title {
  color: white;
  text-align: center;
  position: absolute;
  width: 100%;
  top: 40%;
  font-weight: bold;
  letter-spacing: 1px; }

.welcome .desc .title h1 {
  letter-spacing: 2.5px;
  margin-bottom: 5px;
  font-weight: bold;
  transition: 3s; }

.welcome .desc .title hr {
  width: 10%;
  border-top: 5px solid #fff;
  margin: 0px auto; }

.welcome .auth {
  position: relative; }

.welcome .auth h3 {
  text-align: left;
  color: #783239;
  font-weight: bold;
  letter-spacing: 2px;
  border-bottom: 4px solid;
  display: inline-block;
  font-size: 30px; }

.welcome .auth form {
  width: 70%;
  margin: 0px 15%;
  position: absolute;
  top: 25%; }

.welcome .auth form input {
  display: inline-block;
  width: 100%;
  border-radius: 0px;
  border: 0px;
  border-bottom: 1px solid #f7a8a8; }

.welcome .auth form button {
  color: #ef5251;
  width: initial;
  border: 1px solid #f7a8a8;
  border-radius: 0px; }

.welcome .auth form button:hover {
  color: white;
  background: #5f2c34;
  border: 0px; }

.outer-grid {
  width: 80%;
  margin-left: 20%;
  height: 100vh; }

.inner-grid {
  width: 80%;
  margin: 0px auto;
  padding: 20px 0px;
  background: white; }

.sidemenu {
  width: 20%;
  height: 100%;
  background: #191f29;
  color: white;
  text-align: center;
  position: fixed; }

.sidemenu .sidemenu-grid {
  width: 80%;
  margin: 20px auto; }

.sidemenu .ispace {
  width: 100px;
  margin: 30px 0px; }

.sidemenu .userDetails {
  width: 100%;
  margin: 0px 0px 15px 0px; }

.sidemenu .userDetails img {
  border-radius: 50%;
  width: 100px; }

.sidemenu .userDetails button {
  width: initial;
  color: #babbbe; }

.sidemenu .userDetails h4 {
  font-size: 15px;
  letter-spacing: 1px;
  margin: 20px 0px;
  font-weight: bold; }

.sidemenu h2 {
  color: #f6685e;
  padding: 30px 0px; }

.sidemenu li {
  padding: 15px 0px;
  width: 80%;
  text-align: left;
  margin: 6px auto;
  color: #5e6269; }

.sidemenu li i {
  vertical-align: middle;
  background: linear-gradient(#bf7c3f, #ef4f53);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent; }

.sidemenu li .arrow {
  float: right;
  padding: 5px 0px; }

.sidemenu li a {
  color: #5e6269;
  padding: 5px 25px;
  text-decoration: none;
  display: inline-block;
  font-size: 13px;
  letter-spacing: 1px;
  font-weight: bold; }

.sidemenu li a:hover {
  color: #fff; }

.dashList {
  margin: 20px auto; }

.dashList table {
  width: 90%;
  margin: auto;
  table-layout: fixed; }

table td {
  cursor: pointer;
  white-space: nowrap;
  overflow: hidden !important;
  text-overflow: ellipsis; }

.myprofile form input {
  margin: 0px;
  width: 100%; }
.toast-title {
  font-weight: 700; }

.toast-message {
  -ms-word-wrap: break-word;
  word-wrap: break-word; }

.toast-message a, .toast-message label {
  color: #fff; }

.toast-message a:hover {
  color: #ccc;
  text-decoration: none; }

.toast-close-button {
  position: relative;
  right: -.3em;
  top: -.3em;
  float: right;
  font-size: 20px;
  font-weight: 700;
  color: #fff;
  -webkit-text-shadow: 0 1px 0 #fff;
  text-shadow: 0 1px 0 #fff;
  opacity: .8;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
  filter: alpha(opacity=80); }

.toast-close-button:focus, .toast-close-button:hover {
  color: #000;
  text-decoration: none;
  cursor: pointer;
  opacity: .4;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40);
  filter: alpha(opacity=40); }

button.toast-close-button {
  padding: 0;
  cursor: pointer;
  background: 0 0;
  border: 0;
  -webkit-appearance: none; }

.toast-top-center {
  top: 0;
  right: 0;
  width: 100%; }

.toast-bottom-center {
  bottom: 0;
  right: 0;
  width: 100%; }

.toast-top-full-width {
  top: 0;
  right: 0;
  width: 100%; }

.toast-bottom-full-width {
  bottom: 0;
  right: 0;
  width: 100%; }

.toast-top-left {
  top: 12px;
  left: 12px; }

.toast-top-right {
  top: 12px;
  right: 12px; }

.toast-bottom-right {
  right: 12px;
  bottom: 12px; }

.toast-bottom-left {
  bottom: 12px;
  left: 12px; }

#toast-container {
  position: fixed;
  z-index: 999999;
  pointer-events: none; }

#toast-container * {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

#toast-container > div {
  position: relative;
  pointer-events: auto;
  overflow: hidden;
  margin: 0 0 6px;
  padding: 15px 15px 15px 50px;
  width: 300px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  background-position: 15px center;
  background-repeat: no-repeat;
  -moz-box-shadow: 0 0 12px #999;
  -webkit-box-shadow: 0 0 12px #999;
  box-shadow: 0 0 12px #999;
  color: #fff;
  opacity: .8;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
  filter: alpha(opacity=80); }

#toast-container > :hover {
  -moz-box-shadow: 0 0 12px #000;
  -webkit-box-shadow: 0 0 12px #000;
  box-shadow: 0 0 12px #000;
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  filter: alpha(opacity=100);
  cursor: pointer; }

#toast-container > .toast-info {
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAGwSURBVEhLtZa9SgNBEMc9sUxxRcoUKSzSWIhXpFMhhYWFhaBg4yPYiWCXZxBLERsLRS3EQkEfwCKdjWJAwSKCgoKCcudv4O5YLrt7EzgXhiU3/4+b2ckmwVjJSpKkQ6wAi4gwhT+z3wRBcEz0yjSseUTrcRyfsHsXmD0AmbHOC9Ii8VImnuXBPglHpQ5wwSVM7sNnTG7Za4JwDdCjxyAiH3nyA2mtaTJufiDZ5dCaqlItILh1NHatfN5skvjx9Z38m69CgzuXmZgVrPIGE763Jx9qKsRozWYw6xOHdER+nn2KkO+Bb+UV5CBN6WC6QtBgbRVozrahAbmm6HtUsgtPC19tFdxXZYBOfkbmFJ1VaHA1VAHjd0pp70oTZzvR+EVrx2Ygfdsq6eu55BHYR8hlcki+n+kERUFG8BrA0BwjeAv2M8WLQBtcy+SD6fNsmnB3AlBLrgTtVW1c2QN4bVWLATaIS60J2Du5y1TiJgjSBvFVZgTmwCU+dAZFoPxGEEs8nyHC9Bwe2GvEJv2WXZb0vjdyFT4Cxk3e/kIqlOGoVLwwPevpYHT+00T+hWwXDf4AJAOUqWcDhbwAAAAASUVORK5CYII=) !important; }

#toast-container > .toast-error {
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAHOSURBVEhLrZa/SgNBEMZzh0WKCClSCKaIYOED+AAKeQQLG8HWztLCImBrYadgIdY+gIKNYkBFSwu7CAoqCgkkoGBI/E28PdbLZmeDLgzZzcx83/zZ2SSXC1j9fr+I1Hq93g2yxH4iwM1vkoBWAdxCmpzTxfkN2RcyZNaHFIkSo10+8kgxkXIURV5HGxTmFuc75B2RfQkpxHG8aAgaAFa0tAHqYFfQ7Iwe2yhODk8+J4C7yAoRTWI3w/4klGRgR4lO7Rpn9+gvMyWp+uxFh8+H+ARlgN1nJuJuQAYvNkEnwGFck18Er4q3egEc/oO+mhLdKgRyhdNFiacC0rlOCbhNVz4H9FnAYgDBvU3QIioZlJFLJtsoHYRDfiZoUyIxqCtRpVlANq0EU4dApjrtgezPFad5S19Wgjkc0hNVnuF4HjVA6C7QrSIbylB+oZe3aHgBsqlNqKYH48jXyJKMuAbiyVJ8KzaB3eRc0pg9VwQ4niFryI68qiOi3AbjwdsfnAtk0bCjTLJKr6mrD9g8iq/S/B81hguOMlQTnVyG40wAcjnmgsCNESDrjme7wfftP4P7SP4N3CJZdvzoNyGq2c/HWOXJGsvVg+RA/k2MC/wN6I2YA2Pt8GkAAAAASUVORK5CYII=) !important; }

#toast-container > .toast-success {
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAADsSURBVEhLY2AYBfQMgf///3P8+/evAIgvA/FsIF+BavYDDWMBGroaSMMBiE8VC7AZDrIFaMFnii3AZTjUgsUUWUDA8OdAH6iQbQEhw4HyGsPEcKBXBIC4ARhex4G4BsjmweU1soIFaGg/WtoFZRIZdEvIMhxkCCjXIVsATV6gFGACs4Rsw0EGgIIH3QJYJgHSARQZDrWAB+jawzgs+Q2UO49D7jnRSRGoEFRILcdmEMWGI0cm0JJ2QpYA1RDvcmzJEWhABhD/pqrL0S0CWuABKgnRki9lLseS7g2AlqwHWQSKH4oKLrILpRGhEQCw2LiRUIa4lwAAAABJRU5ErkJggg==) !important; }

#toast-container > .toast-warning {
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAGYSURBVEhL5ZSvTsNQFMbXZGICMYGYmJhAQIJAICYQPAACiSDB8AiICQQJT4CqQEwgJvYASAQCiZiYmJhAIBATCARJy+9rTsldd8sKu1M0+dLb057v6/lbq/2rK0mS/TRNj9cWNAKPYIJII7gIxCcQ51cvqID+GIEX8ASG4B1bK5gIZFeQfoJdEXOfgX4QAQg7kH2A65yQ87lyxb27sggkAzAuFhbbg1K2kgCkB1bVwyIR9m2L7PRPIhDUIXgGtyKw575yz3lTNs6X4JXnjV+LKM/m3MydnTbtOKIjtz6VhCBq4vSm3ncdrD2lk0VgUXSVKjVDJXJzijW1RQdsU7F77He8u68koNZTz8Oz5yGa6J3H3lZ0xYgXBK2QymlWWA+RWnYhskLBv2vmE+hBMCtbA7KX5drWyRT/2JsqZ2IvfB9Y4bWDNMFbJRFmC9E74SoS0CqulwjkC0+5bpcV1CZ8NMej4pjy0U+doDQsGyo1hzVJttIjhQ7GnBtRFN1UarUlH8F3xict+HY07rEzoUGPlWcjRFRr4/gChZgc3ZL2d8oAAAAASUVORK5CYII=) !important; }

#toast-container.toast-bottom-center > div, #toast-container.toast-top-center > div {
  width: 300px;
  margin-left: auto;
  margin-right: auto; }

#toast-container.toast-bottom-full-width > div, #toast-container.toast-top-full-width > div {
  width: 96%;
  margin-left: auto;
  margin-right: auto; }

.toast {
  background-color: #030303; }

.toast-success {
  background-color: #51a351; }

.toast-error {
  background-color: #bd362f; }

.toast-info {
  background-color: #2f96b4; }

.toast-warning {
  background-color: #f89406; }

.toast-progress {
  position: absolute;
  left: 0;
  bottom: 0;
  height: 4px;
  background-color: #000;
  opacity: .4;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40);
  filter: alpha(opacity=40); }

@media all and (max-width: 240px) {
  #toast-container > div {
    padding: 8px 8px 8px 50px;
    width: 11em; }
  #toast-container .toast-close-button {
    right: -.2em;
    top: -.2em; } }

@media all and (min-width: 241px) and (max-width: 480px) {
  #toast-container > div {
    padding: 8px 8px 8px 50px;
    width: 18em; }
  #toast-container .toast-close-button {
    right: -.2em;
    top: -.2em; } }

@media all and (min-width: 481px) and (max-width: 768px) {
  #toast-container > div {
    padding: 15px 15px 15px 50px;
    width: 25em; } }