/* https://www.websschool.com */
@import "https://fonts.googleapis.com/css?family=Roboto:400,500";
@import "https://fonts.googleapis.com/icon?family=Material+Icons";
@import "https://fonts.googleapis.com/css?family=Inconsolata";
body{font-family:'Roboto',sans-serif;color:hsla(0,0%,100%,.87);
background-color:#fff;margin:0}
.material-icons{font-size:inherit;position:relative;top:2px;z-index:0}
.editor_content{position:absolute;width:100%;height:auto;top:100px;bottom:0;overflow:hidden}
.navbar{z-index:10002;color:hsla(0,0%,100%,.87);background-color:#43b581;
padding:16px;box-shadow:0 1px 5px rgba(0,0,0,.2),0 2px 2px rgba(0,0,0,.14),
0 3px 1px -2px rgba(0,0,0,.12);position:absolute;top:0;left:0;right:0;font-size:15px}

.navbar span{float:left;padding:0 3px}
.navbar .right{float:right}.navbar a{padding:15px;text-decoration:none;
color:rgba(255,255,255,.56);transition:.3s;overflow:hidden;cursor:pointer;
display:inline;z-index:9997;user-select:none}

a.mi:hover{border-bottom:none!important}
.navbar a:hover,.navbar .active{border-bottom:2px solid rgba(255,255,255,.87);
color:rgba(255,255,255,.87)}.editor{position:absolute;left:0;right:50%;
bottom:0;top:52.4px;z-index:9998;margin:0}
.editor.noiframe{right:0}iframe{position:absolute;left:50%;top:52.4px;z-index:9999}
input[type=text]{position:absolute;top:12px;
font-family:'Inconsolata',monospace;background-color:transparent;outline:none;
padding:5px;color:rgba(255,255,255,.78);margin-left:12px;border:none;
border-bottom:2px solid rgba(255,255,255,.38);transition:.3s}
input[type=text]:focus{border-bottom:2px solid rgba(255,255,255,.87)}
input[type=text]::placeholder{color:rgba(255,255,255,.56)}
.swal-overlay{overflow:hidden}.swal-modal{background-color:#2c2f33;border-radius:2px}
.swal-title{color:rgba(255,255,255,.78);font-weight:400}
.swal-text{color:rgba(255,255,255,.56)}
.swal-button{font-size:14px;border:none;border-radius:2px;
background-color:rgba(0,0,0,0);color:#4286f4}
.swal-button:hover{background-color:#23272a;border:none;box-shadow:none}
.swal-button:focus{color:#41b2f4;border:none;box-shadow:none}
.drop{box-shadow:0 2px 4px 0 rgba(0,0,0,0.16),0 2px 8px 0 rgba(0,0,0,0.12);
position:absolute;padding:0;list-style-type:none;z-index:10003;border-radius:3px;
position:absolute;top:25px;right:20px}

.drop li{padding:12px 1em;
min-width:150px;font-size:90%;transition:.3s;z-index:10000;
background-color:#fff;color:rgba(0,0,0,.87);cursor:pointer}

.drop li:hover{background-color:#eee}

.drop li .right{text-align:right;float:right;color:rgba(0,0,0,.56)}

#panel{z-index:10001;position:absolute;width:300px;height:300px;top:15%;
right:calc(55% - 250px);background-color:#fff;color:rgba(0,0,0,.87);
box-shadow:0 19px 38px rgba(0,0,0,0.30),0 15px 12px rgba(0,0,0,0.22)}


#panel .header{background-color:#43b581;padding:.7em;text-align:center}

#panel .header h1{font-weight:400;color:rgba(255,255,255,.87)}

#panel span.close{position:absolute;top:5px;right:9px;color:rgba(255,255,255,.65);
cursor:pointer}#panel .section{padding:.5em}

#panel h4{font-weight:400;margin:.5em}
select{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:150px;
border:none;outline:none;border-bottom:1.5px solid #555;padding:7px;color:rgba(0,0,0,.65);
font-family:'Roboto';font-size:14px}

select ~ i.material-icons{position:relative;right:24px;top:7px;color:rgba(0,0,0,.56);
font-size:140%;transform:rotateZ(0deg);transition:.7s;-webkit-user-select:none;
-moz-user-select:none;user-select:none}


option{-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:7px;
color:rgba(0,0,0,.65);border:none;outline:none}

.add{height:90px;overflow:hidden;background-color:transparent;text-align:center;
margin:0;padding:0}@media (max-width: 900px){
	.editor{right:0;bottom:50%}.editor.noiframe{bottom:0}iframe{left:0;bottom:0;top:unset;
	
	margin:auto}}