.header { height: 100vh; width: 100%; float: left;  background-size: cover; user-select: none;}
.logo { width: 150px; height: 150px; float: none; margin: 40px;}
.menuBarra { width: 30px; height: 18px; float: left; border-bottom: 1px solid #FFF;transition: .2s linear; }
.menuLetrasO { opacity: .5; transition: .2s linear; }

.menuMenu{ float: left; color: #FFF;  font-size: 18px; height: 36px; line-height: 36px; position: relative; font-weight: 700;}
.menuBolitas { float: left; background-size: contain; background-repeat: no-repeat; background-position: center left; height: 36px; width: 30px; opacity:0; margin-left: 3px;}

.menu{display:table-cell;}
.menuIconitoIcon {
    display: none;
    float: right;
    height: 100%;
    cursor: pointer;
}

.menuMenu:hover .menuBarra{ width: 50px;}
.menuMenu:hover .menuLetrasO{ opacity: 1;}
.menuMenu:hover .menuBolitas { opacity: 1;}

.menuRayitaVert1{ width: 1px; height: 18px; background-color: #FFF; position: absolute; top: 0; left: 0;}
.menuRayitaVert2{ width: 1px; height: 18px; background-color: #FFF;  position: absolute; bottom: 0; left: 0;}

.menuBarraFuera {width: 150px; height: 1px; background-color: #FFF; float: left;}

.headerS { width: 100%; float: left; position: relative; top: 0; z-index: 999; color: #000;} 
.menuMenuS{ float: left; position: relative; color: #000; height: 55px; line-height: 70px; padding: 0 12px 0 12px;}
.menuMenuS:hover { color:#25bcc3; border-bottom: 1px solid; opacity:0.8;}
.menuMenuI { color:#25bcc3; border-bottom: 1px solid;}


.headerSitio {
    float: left;
    width: 100%;
    position: fixed;
    z-index: 999;
    background-color: #FFF;
}

@media screen and (max-width: 600px) {
.menuMenu{ font-size: 14px; }
.menuBarraFuera { width: 50px;}
.logo { width: 100px; height: 100px; float: none; margin: 20px;}
}

@media screen and (max-width:955px) {

.headerines{ display: none;}

.menu {position:fixed; height: 90vh;   overflow-y: auto;right:0; top:70px;    width:100%; z-index:9999;  display: none;}
.divisMenus { display:block; height:1px; background-color:#EBEBEB;}
.menuMenuS  { width:100%; background-color:rgba(0,0,0,.8); padding: 10px; height: auto; line-height: normal;}
#cursos { display:none;}
.menuGrande { width:100%;}
.menuSub { float:left; display:block; position:static; width:100%;}
.menuSubM {padding-left: 30px;}
.menuContenido {    width:100%; transition: all 0.2s linear; position:absolute; padding-bottom: 20px; }
.menuIconitoIcon { display:block;}

.menuMenuS:hover { background-color:#000;}
	}