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


#container {
	height:100%;
	width:auto;
  white-space : nowrap; 
  overflow : hidden;
  position:relative;
}

#customInputBox {
  height:50%;
  display:block;
  width:100%;
  
  }
.bottomFooter
  {
    background:white;
    color:black;
    margin-top:16px;
    padding-top:12px;
    border-radius:10px;
  }

  .bottomFooter p{
    font-size:14px;
    coor:black;
    text-align:center;
  }

  .bottomFooter a{
    font-size:14px;
    coor:black;
    text-align:center;
    padding-left:20px;
  }

.site-footer {
    padding-top: 2em;
    background: rgb(250,249,247); }
    .site-footer p {
      color: rgb(102,102,102); }
    .site-footer h2, .site-footer h3, .site-footer h4, .site-footer h5 {
      color: black; 
        
    }
    .site-footer h3 {
      font-size: 20px;
      margin-bottom: 7px; }
    .site-footer a {
      color: rgb(102,102,102);
      font-size:14px;
      }
      .site-footer a:hover {
        color:rgb(0,115,255); }
    .site-footer ul li {
       }
    .site-footer .footer-heading {
      font-size: 14px;
      color: #fff; }


/* disable tag matching */
.ace_editor .ace_marker-layer .ace_bracket { display: none;  }


  /* Navbar */
  .site-navbar {
    margin-bottom: 0px;
    z-index: 1999;
    position: relative; }
    .site-navbar .site-logo a {
      color: #000; }
    .site-navbar .site-navigation.border-bottom {
      border-bottom: 1px solid #f3f3f4 !important; }
    .site-navbar .site-navigation .site-menu {
      margin-bottom: 0; }
      .site-navbar .site-navigation .site-menu .active > a {
        color: white;
        opacity:1.0;
       }
      .site-navbar .site-navigation .site-menu a {
        text-decoration: none !important;
        font-size: 15px;
        display: inline-block; }
      .site-navbar .site-navigation .site-menu > li {
        display: inline-block;
        padding: 10px 5px; }
        .site-navbar .site-navigation .site-menu > li > a {
          padding: 10px 10px;
          color: white;
          opacity:0.6;
          font-size: 12px;
          text-decoration: none !important; }
          .site-navbar .site-navigation .site-menu > li > a:hover {
            color: white;
            opacity:1.0;
           }
      .site-navbar .site-navigation .site-menu .has-children {
        position: relative; }
        .site-navbar .site-navigation .site-menu .has-children > a {
          position: relative;
          padding-right: 20px; }
          .site-navbar .site-navigation .site-menu .has-children > a:before {
            position: absolute;
            content: "";
            font-size: 16px;
            top: 50%;
            right: 0;
            -webkit-transform: translateY(-50%);
            -ms-transform: translateY(-50%);
            transform: translateY(-50%);
            font-family: 'icomoon'; }
        .site-navbar .site-navigation .site-menu .has-children .dropdown {
          visibility: hidden;
          opacity: 0;
          top: 100%;
          position: absolute;
          text-align: left;
          -webkit-box-shadow: 0 5px 10px -3px rgba(0, 0, 0, 0.25);
          box-shadow: 0 5px 10px -3px rgba(0, 0, 0, 0.25);
          padding: 0px 0;
          margin-top: 20px;
          margin-left: 0px;
          background: #fff;
          -webkit-transition: 0.2s 0s;
          -o-transition: 0.2s 0s;
          transition: 0.2s 0s; }
          .site-navbar .site-navigation .site-menu .has-children .dropdown.arrow-top {
            position: absolute;
            display: none;}
            .site-navbar .site-navigation .site-menu .has-children .dropdown.arrow-top :before {
              bottom: 100%;
              left: 20%;
              border: solid transparent;
              content: "";
              height: 0;
              width: 0;
              position: absolute;
              pointer-events: none; }
            .site-navbar .site-navigation .site-menu .has-children .dropdown.arrow-top:before {
              border-color: rgba(136, 183, 213, 0);
              border-bottom-color: #fff;
              border-width: 10px;
              margin-left: -10px; }
          .site-navbar .site-navigation .site-menu .has-children .dropdown a {
            font-size: 16px;
            text-transform: none;
            letter-spacing: normal;
            -webkit-transition: 0s all;
            -o-transition: 0s all;
            transition: 0s all;
            color: #343a40; }
          .site-navbar .site-navigation .site-menu .has-children .dropdown .active > a {
            color: white !important; 
          opacity:1.0;}
          .site-navbar .site-navigation .site-menu .has-children .dropdown > li {
            list-style: none;
            padding: 0;
            margin: 0;
            min-width: 200px; }
            .site-navbar .site-navigation .site-menu .has-children .dropdown > li > a {
              padding: 9px 20px;
              display: block; }
              .site-navbar .site-navigation .site-menu .has-children .dropdown > li > a:hover {
                background: #f4f5f9;
                background: #3ca59d;
                color: #25262a;
                color: #fff; }
            .site-navbar .site-navigation .site-menu .has-children .dropdown > li.has-children > a {
              position: relative;
              display: block; }
              .site-navbar .site-navigation .site-menu .has-children .dropdown > li.has-children > a:before {
                position: absolute;
                content: "\e315";
                position: absolute;
                left: auto !important;
                right: 20px !important;
                top: 10px; }
            .site-navbar .site-navigation .site-menu .has-children .dropdown > li.has-children > .dropdown, .site-navbar .site-navigation .site-menu .has-children .dropdown > li.has-children > ul {
              left: 100%;
              top: 0; }
            .site-navbar .site-navigation .site-menu .has-children .dropdown > li.has-children:hover > a, .site-navbar .site-navigation .site-menu .has-children .dropdown > li.has-children:active > a, .site-navbar .site-navigation .site-menu .has-children .dropdown > li.has-children:focus > a {
              background: #f4f5f9;
              background: #3ca59d;
              color: #25262a;
              color: #fff; }
        .site-navbar .site-navigation .site-menu .has-children:hover > a, .site-navbar .site-navigation .site-menu .has-children:focus > a, .site-navbar .site-navigation .site-menu .has-children:active > a {
          color: white;
        opacity:1.0; }
        .site-navbar .site-navigation .site-menu .has-children:hover, .site-navbar .site-navigation .site-menu .has-children:focus, .site-navbar .site-navigation .site-menu .has-children:active {
          cursor: pointer; }
          .site-navbar .site-navigation .site-menu .has-children:hover > .dropdown, .site-navbar .site-navigation .site-menu .has-children:focus > .dropdown, .site-navbar .site-navigation .site-menu .has-children:active > .dropdown {
            -webkit-transition-delay: 0s;
            -o-transition-delay: 0s;
            transition-delay: 0s;
            margin-top: 0px;
            visibility: visible;
            opacity: 1; }

/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {
    #editor {
    height: 50%;
    width:100%;
    display:block;
    font-size: 13pt;
}

#iframe {
	height:50%;
	display:block;
	width:100%;
  
  }

  #customInputBox {
    height:50%;
    display:block;
    width:100%;
    
    }
  

#container {
	height:100%;
	width:auto;
  white-space : nowrap; 
  overflow : hidden;
  position:relative;
}

#maxBtn
{
  display: none;
}

.img-fluid
  {
     margin-top:20%;
     max-width:100%;
  }
.headerLogo
{
  display: none;

}
  .header-developers-card
  {
    display: none;
  }

  .moreCourses
  {
    color:black;
    padding:12px;
    border-radius:24px;color:rgb(94,94,94);
    margin-left:1%    
  }
  textarea
  {
    width:100%;
    padding-left:10px;
  }

  .site-navbar
{
    margin-bottom: 0px;
}



.site-logo-div
{
    display:none;
}
.site-logo-div-visible
{
    display:block;
}

.site-logo-div img 
{
    width:50px;height:50px;
}
.site-logo-div-visible a
{
    font-size:20px;
    text-align:center;
}

.site-logo-div
{
    display: block;
}
.site-logo-div img 
{
    width:40px;height:40px;
}

.header-title-div
    {
        padding-left:10px;color:rgb(235,185,233);font-weight:200px;padding-top:50px;
    }

    .smallDevice
    {
    flex: 0 0 100%;
    max-width: 100%;
    }
}

/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {
    #editor {
    height: 100%;
    width:55%;
    display:inline-block;
    font-size: 13pt;
}
#maxBtn
{
  display: inline-block;
}
#iframe {
	height:100%;
	display:inline-block;
    width:50%;
    /* border:1px solid black; */
}

#customInputBox {
	height:100%;
	display:inline-block;
    width:50%;
    /* border:1px solid black; */
}
#container {
	height:300%;
	width:auto;
  white-space : nowrap; 
  overflow : hidden;
  position:relative;
}

.site-logo-div
  {
      display:block;
  }
  .site-logo-div-visible
  {
      display:none;
  }
  
  .site-logo-div img 
  {
      width:50px;height:50px;
  }

  .header-title-div
    {
        padding-left:180px;color:rgb(235,185,233);font-weight:200px;
    }

}

.sticky
{
  position: -webkit-sticky;top:0;position: sticky;z-index:122;
}

.saveDiv
{
  margin-left:0%;
}

#saveAsButton 
{
  background:rgb(245,245,245);
  border:1px solid black;
  border-radius:4px;
  font-size:15px;
}

#errorBlock
{
  padding-left:15px;
  text-decoration:underline;
  font-size:12px;
  padding-top:10px;
}

input,
input::-webkit-input-placeholder {
    font-size: 16px;
    padding-left:4px;
    border-radius:4px;
    
    border:none;
    border-bottom: 1px solid black;

}

input:focus {
  border:1px solid black;
  border-bottom: 1px solid black;

  outline: none;
}

.site-navbar
{
  background:rgb(38,40,34);
  color:white;
}

.sveExpnd 
{
  background-color:none;
  padding:10px;
  color:white;
  opacity:0.6;
}

.sveExpnd:hover 
{
  color:white;
  opacity:1;
  cursor:pointer;
}

iframe 
{
  background: white;

}

.featured
{
  color:black;
  opacity:0.7;
}


.featured:hover
{
  color:black;
  opacity:1;
}
