/* W3Schools Font Logo */
.w3schools-logo {
font-family:Impact, sans-serif;
text-decoration:none;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-size:37px;
letter-spacing:3px;
color:green;
display:block;
position:relative;
text-shadow: 1px 1px .5px #000
}

.w3schools-logo:hover {color:#32CD32; text-shadow: 1.2px 1.2px .5px #000}
.dotcom {color:#f10b0b;font-size:.8em;text-shadow: 1.1px 1.1px .5px #000}
.dotcom:hover {color:orange;text-shadow: 1.1px 1.1px 1px #000}

/* Customize W3.CSS */
#nav_tutorials,#nav_references,#nav_examples,#nav_exercises {
display:none;
padding-bottom:40px;
position:absolute;
width:100%;
z-index:5 !important;
}
.w3-col .w3-button {
margin:5px 5px 5px 0;
font-size:16px;
}
.w3-col.l4 .w3-card-2 {
padding:15px 10px;
height:260px;
}
.w3-theme {color:#fff !important;background-color:#008B8B !important;}
.w3-main {margin-left:230px;}
.w3-sidebar {
z-index:3;
width:230px;
overflow:hidden !important;
position:absolute !important;
margin-bottom:-155px;
}
.w3-sidebar .w3-bar-block .w3-bar-item{
padding:0 16px;
font-size:16px;
}
.w3-bar {
position:relative;
z-index:4;
font-size:17px;
}
.w3-wide {
font-family:"Segoe UI",Arial,sans-serif;
}
h1 {font-size: 2em;
  color: white;
  margin: -10px 0 10px 0;
  text-shadow: 1px 1px 1px #000;
}
h2 {
  font-size:60px;
  color:#555;
  margin:2px 0 -20px 0 !important;
}
.certoverlay {
  position:absolute;
  top:0;
  background-color:rgba(0, 0, 0, 0.5);
  width:100%;
  text-align:center;
  padding:15px
}
.certoverlay h2 {
  margin:10px 0 0 0;
  font-size:36px;
}
.certoverlay h3 {
  margin:0 0 10px 0;
}

@media screen and (min-width:769px){.w3-sidebar.w3-collapse{display:block !important;}}
@media screen and (min-width:769px){#myAccordion,.hidesm{display:none !important;}}
@media screen and (min-width:769px){.w3-main{margin-left:230px !important;}.w3-bar-block .w3-button{padding:0;}}
@media screen and (max-width:768px){.w3-sidebar.w3-collapse,.barex,.navex{display:none !important;}.w3-bar-block .w3-bar-item{text-align:center !important;padding:2px 0;}h1,.w3-jumbo{font-size:40px !important;}}
@media screen and (max-width:545px){.certoverlay{padding:10px;height:100%;}.certoverlay h3{font-size:15px;}}
@media screen and (max-width:380px){.getcert{position:absolute;text-align:center;left:50%;bottom:50%;font-size:13px;}}
@media only screen and (max-width: 1366px){.w3-hide-device{display:none;}}


/* Customize main.css */
body {background: #F5F5DC; position:relative;min-height:100%;}
.shadow-black-1 {text-shadow: 1px 1px 1px #000}

.box-h70 {height:70px}
.picker {width:150px;height:128px;margin-top:16px}
.pro {font-size:.1em;}

.tryit-button {
  background-color: #04AA6D;
  color: white;
  border-radius: 25px;
  font-size: 18px;
  width:200px;
}

.tut-button {
  background-color: #04AA6D;
  color: white;
  font-size: 18px;
  margin: auto;
  display: block;
  width: 200px;
  border-radius: 25px;
}

.tut-button:hover,.tryit-button:hover,.exercise-button:hover,#getdiploma a:hover,.bar-item-hover:hover {
  background-color: #059862 !important;
  color:white!important;
}

.black-color {
  background-color: #282A35;
  color: white;
}

.black-color:hover {
  background-color: #000!important;
  color: white!important;
}

.grey-color {
  background-color: #E7E9EB;
  color: black
}

.exercise-button {
  background-color: #04AA6D;
  color: white;
  padding: 17px;
  font-size: 19px;
  width: 100%;
}