.p-editor-main-container {
      width: 100%;
      display: flex;
      flex-direction: column;
   }

    .p-topbar {
      width: 100%;
      display: flex;
      background-color: #ffffff !important;
      height: 50px;
      align-items: center;
    }

    .p-topbar-a {
      width: 50%;
    }

    /* .topbar-b {
      width: 50%;
      text-align: right;
    } */

    .p-btn {
      background-color: #FD1C00 !important;
      font-size: 18px;
      color: white !important;
      border: none;
      padding: 7px 15px;
      border-radius: 5px;
      margin-left: 10px;
    }

    .p-btn:hover {
      background-color: #333333 !important;
      cursor: pointer;
    }

    .p-btn:active {
      background-color: #666666 !important;
    }
    .p-mtbtn{
	  display: none;
	}

    .p-em-container {
      width: 100%;
      height: 350px !important;
      display: flex;
      height: auto;
      bottom: 0;
      background-color: white !important;
      overflow: auto;
    }

    .p-textareawraper {
      width: 50%;
      background-color: #ffffff !important;
      height: 100%;
      padding: 0 2px 0 10px;
      overflow-y: auto;
    }

    .p-ct-tabs {
      display: flex;
      align-items: center;
      justify-content: end;
      flex-wrap: wrap;
      background-color: #D5D5D5;
      border-right: 1px solid #D5D5D5;
	  border-left: 1px solid #D5D5D5;
      height: 10%;
	  padding: 0px;
    }

    .p-tab {
      cursor: pointer;
      color: #333333;
      border-bottom: 2px solid transparent;
      padding: 0 10px;
	  margin:0 !important;
      border-left: 1px solid #eeeeee;
      color: #333333;
      height: 100% !important;
      display: flex;
      align-items: center;
    }

    .p-tab.p-active {
      background-color: #333333;
	  color: white;
    }


    .p-textarea {
      width: 100%;
      height: 90%;
      resize: none;
      border: 1px solid #d5d5d5 !important;
      font-size: 18px;
      padding: 8px;
      overflow: auto;
      font-family: consolas, Menlo, "courier new", monospace;
      display: none;
      border-top: 0px !important;
      outline: none;
    }
    
    .p-textareawraper .CodeMirror {
	  font-size: 12px;
      height: 90% !important;
      width: 100%;
	  border: 1px solid #D5D5D5;
	  overflow-x: hidden !important;
    }
    .p-textareawraper .CodeMirror-hints{
	  z-index: 99999999 !important;
	  font-size: 12px !important;
    }

    .p-textarea.p-active {
      display: block;
	  border-radius: 0px !important;
	  font-size: 12px !important;
		
    }

    .p-iframewraper {
      width: 50%;
      background-color: #ffffff !important;
      height: 100%;
      padding: 0 10px 0 2px;
      flex: 1;
    }

    .p-iframe {
      width: 100%;
      background-color: #ffffff !important;
      height: 100%;
      border: 1px solid #d5d5d5 !important;
      overflow: hidden;
    }

    .p-bar {
      width: 5px;
      height: 100%;
      cursor: col-resize;
      background-color: #eeeeee !important;
    }

    @media screen and (max-width: 830px) {
      .p-topbar-a {
        width: 100%;
      }

      .p-em-container {
        flex-direction: column;
      }
		#p-tbtn{
			display: none;
		}
		.p-mtbtn{
	      display: inline;
	    }
		.p-bar{
			display: none;
		}

      .p-textareawraper {
        width: 100%;
        height: 100%;
        padding: 0 10px;
      }

      .p-iframewraper {
        width: 100%;
        height: 100%;
        padding: 0 10px;
		display: none;
      }

      .p-bar {
        display: none;
      }
      .p-ct-tabs{
        min-height: 10%;
      }
      .p-textarea{
        height: 90%;
      }
      .CodeMirror{
          height: 90% !important;
      }

      .p-tab {
        height: 20px;
      }
    }
@media (max-width: 580px){
	.p-em-container{
		height: 380px !important;	
	}
}

    #p-iframeResult {
      width: 100%;
      height: 100%;
      overflow: auto;
    }