@charset "UTF-8";

body {
font-family:Arial,Helvetica,sans-serif;
text-align:center;
background:url(/img/bgprimavera.png) repeat-y center top #FFC;
background-attachment:fixed;
}

h1,h2,h3 {
color:#006;
font-size:16px;
text-align:center
}

h1 {
color:#990;
font-weight:700
}

h3 {
font-size:12px;
}

img {
border:0;
vertical-align:bottom
}

a {
text-decoration:none;
color:#006
}

a:visited {
color:#006
}

#cssmenu {
height:26px;
display:block;
border:2px solid;
width:753px;
box-shadow:-2px 2px 6px #999;
border-color:#000;
margin:2px 0 12px 155px;
padding:0
}

#cssmenu > ul {
list-style:inside none;
margin:0;
padding:0
}

#cssmenu > ul > li {
list-style:inside none;
float:left;
display:block;
position:relative;
margin:0;
padding:0
}

#cssmenu > ul > li > a {
outline:none;
display:block;
position:relative;
margin-left:1px;
font:bold 13px/100% Arial, Helvetica, sans-serif;
text-align:center;
text-decoration:none;
border-right:1px solid #000;
color:#00319b;
padding:7px 20px
}

#cssmenu > ul > li:first-child > a {
border-radius:5px 0 0 5px
}

#cssmenu > ul > li > a:after {
content:'';
position:absolute;
border-right:1px solid;
top:-1px;
bottom:-1px;
right:-2px;
z-index:99;
border-color:#444
}

#cssmenu ul li.has-sub:hover > a:after {
top:0;
bottom:0
}

#cssmenu > ul > li.has-sub > a:before {
content:'';
position:absolute;
top:13px;
right:6px;
border:5px solid transparent;
border-top:5px solid #00319b
}

#cssmenu > ul > li.has-sub:hover > a:before {
top:13px
}

#cssmenu ul li.has-sub:hover > a {
background:#fae391;
padding-bottom:19px;
padding-top:7px;
margin-left:1px;
margin-top:1px;
top:-1px;
z-index:999;
border-color:#3f3f3f
}

#cssmenu ul li.has-sub:hover > ul,#cssmenu ul li.has-sub:hover > div {
display:block;
box-shadow:0 6px 6px 2px #999
}

#cssmenu ul li.has-sub > a:hover {
background:#fae391;
border-color:#3f3f3f
}

#cssmenu ul li > ul,#cssmenu ul li > div {
display:none;
width:auto;
text-align:left;
position:absolute;
top:30px;
background:#fae391;
border-radius:0 10px 10px 10px;
z-index:999;
padding:10px
}

#cssmenu ul li > ul {
width:230px
}

#cssmenu ul li > ul li {
display:block;
list-style:inside none;
position:relative;
margin:0;
padding:0
}

#cssmenu ul li > ul li a {
outline:none;
display:block;
position:relative;
font:8pt Arial, Helvetica, sans-serif;
color:#00319b;
text-decoration:none;
margin:0;
padding:6px 10px
}

#cssmenu,#cssmenu > ul > li > ul >li a:hover {
background:#fed02a
}

#cssmenu > ul > li > a:hover {
background:#fae391;
padding-bottom:6px
}

.mtitle {
outline:none;
display:block;
position:relative;
margin-left:1px;
font:bold 13px/100% Arial, Helvetica, sans-serif;
text-decoration:none;
color:#00319b;
padding:7px 20px
}

#container {
margin-left:auto;
margin-right:auto;
margin-top:32px;
width:910px;
}

#header {
display:table;
position:relative;
top:24px
}

#headerTop,#headerBottom {
display:table-row
}

#logo1a {
background:url(/portada/picsHD/logopipoclub01.png) no-repeat;
width:173px;
height:173px;
position:absolute;
z-index:999;
top:24px;
margin-left:-8px;
}

#title {
margin-left:190px;
margin-bottom:14px;
float:left
}

#engSite {
float:right
}

#leftCol,#rightCol {
background-color:#f0f08f;
display:table-cell;
display:none;
width:130px;
vertical-align:top
}

#leftCol {
border-left:5px solid #d9d97b;
border-right:5px solid #eded8d;
padding-top:80px;
box-shadow:2px 2px 6px #999;
display:none;
}

#rightCol {
border-right:5px solid #d9d97b;
border-left:5px solid #eded8d;
margin-top:-12px;
padding-top:40px;
box-shadow:-2px 2px 6px #999
}

#middleCol {
display:table-cell;
background-color:#ffc;
box-shadow:-2px 2px 6px #999;
width:720px;
font-size:12px;
padding-top:80px;
padding-bottom:24px;
padding-left:24px;
padding-right:24px;
border-left:5px solid #d9d97b;
}

.textCol1,.textCol1:visited,.textCol2 {
color:#990;
display:inline-block;
text-align:center;
margin-left:1px;
margin-right:1px
}

.textCol1 {
font-size:14px;
font-weight:700;
margin-top:2em
}

.textCol2 {
font-size:12px;
margin-top:.3em;
margin-bottom:1em;
line-height:130%
}

.productText {
font-size:12px;
display:inline-block;
margin-top:8px;
margin-left:14px;
margin-right:14px
}

#onlineCol,#demoCol,#digitalCol,#cdromCol,#freeCol,#barquitosCol,#mobileCol {
float:left;
background-color:#99F;
height:320px;
border-radius:18px;
width:200px;
margin-top:48px;
margin-left:16px;
}

#mobileCol {
    width: 320px;
    height: 280px;
    margin-left:200px;
}

#onlineCol {
float:right;
margin-right:32px;
}

#digitalCol {
background-color:#CF3;
float:right;
margin-right:32px;
}

#demoCol {
float:right;
margin-right:32px;
}

#cdromCol {
float:right;
background-color:#3CC;
margin-right:32px;
}

#freeCol {
margin-top:33px;
height:1440px;
width:406px;
margin-left:32px;
}

#imgFree {
background-image: url("/juegos-para-ninos-gratis/img/ranas.png");
background-repeat: no-repeat;
width:250px;
height:188px;
margin-left:78px;
margin-top:20px;
transition: background-position 1s;
-webkit-transition: background-position 1s;
}

#imgGame01 { background-position: -2px -0px;}
#imgGame02 { background-position: -2px -188px;}
#imgGame03 { background-position: -2px -379px;}
#imgGame04 { background-position: -2px -568px;}
#imgGame05 { background-position: -2px -757px;}
#imgGame06 { background-position: -2px -945px;}
#imgGame01,#imgGame02,#imgGame03,#imgGame04,#imgGame05,#imgGame06 {
	background-image: url("/juegos-para-ninos-gratis/img/shots02.png");
 	background-repeat: no-repeat;
 	width:250px;
 	height: 188px;
 	margin-left:78px;
    margin-top:20px;
}

#headerNewBox {
margin-left:8px;
margin-right:8px;
background-color:#99F;
border-radius:18px;
font-size:18px;
display:none;
padding:8px;
margin-top:16px;
margin-bottom:12px
}

#headerNewBox {
display:block
}

.buttonCol {
margin:14px 30px
}

.imgSection {
margin-top:-15px
}

.imgCol {
margin-top:12px;
margin-bottom:12px
}

.vSpacer,.vSpacer2 {
height:40px;
width:100%;
float:left
}

.vSpacer2 {
height:20px
}

#footer {
color:#990;
background-color:#ffc;
box-shadow:-2px 2px 6px #999;
padding:16px;
font-size:12px;
margin-top:18px
}

.list-files li {
list-style:none;
height:20px
}

.icon-pdf-file {
background:url(/img/pdficon_small.png) no-repeat;
padding-left:20px;
padding-bottom:4px;
text-decoration:none;
font-size:12px;
float:left
}

.stamp-fileinfo {
color:#888
}

.descText {
color:#006;
width:100%;
padding-left:20px;
padding-right:45px;
margin-bottom:10px;
float:left;
display:block;
text-align:left
}

.eduPhraseBox,.eduPhraseSubBox {
width:80%;
margin-top:25px;
display:inline-block
}

.eduPhraseSubBox {
margin-top:0;
margin-bottom:8px;
width:98%;
border-radius:1em;
border:2px solid #9a6900;
background-color:#fc0
}

.eduPhraseText {
font-size:20px;
color:#9a6900;
display:inline-block;
font-style:italic
}

.eduPhraseSender {
font-size:12px;
text-align:right;
width:90%;
color:#ce9000;
float:right;
margin-right:8px
}

.maxFont {
font-size:24px;
font-weight:700
}

.text01 {
font-size:14px;
width:98%;
color:#9a6900;
text-align:left;
margin-left:10px;
display:block
}

.text02 {
font-size:10px;
color:grey;
text-align:left;
margin-left:20px;
display:block
}

.text03,.text06,.text07 {
font-size:14px;
width:70%;
color:#9a6900;
text-align:left;
margin-left:auto;
margin-right:auto;
margin-bottom:5px;
font-weight:700;
display:block
}

.text04 {
font-weight:400
}

.text05,.text09 {
font-size:16px;
color:#006;
width:300px;
text-align:left;
display:inline-block
}

.text06 {
margin-left:0
}

.text07 {
text-align:center;
margin-bottom:16px
}

.text08 {
font-family: 'lucida grande',tahoma,verdana,arial,sans-serif;
color: #0e385f;
font-size: 16px;
font-weight: bold;
margin-top:24px;
}

.text09 {
width:100%;
margin-bottom:18px;
}

.text10 {
font-size:12px;
margin-left:5px;
display:block;
float:left
}


.cell1,.cell2 {
background-color:#ff6;
margin-left:auto;
margin-right:auto;
width:480px;
padding:10px
}

.cell2 {
background-color:#ff9;
border-top:1px solid grey
}

.link01 {
font-size:16px;
width:100%;
text-align:left;
float:left
}

#cdUpdates,#cdProblems {
display:block;
overflow:auto;
height:870px;
width:530px;
margin-left:auto;
margin-right:auto
}

#cdProblems {
display:none
}

.bckPipo {
background-color:#fc0;
height:10px;
width:96%;
margin-bottom:10px;
padding-bottom:6px;
padding-top:6px;
display:inline-block
}

.blogLink,.fbookLink,.twitLink,.ytubeLink,.appsLink,.acomercial,
.feducacion,.colegios,.coleeuu {
background:url(/img/common-sprite.png) no-repeat;
float:left;
}

.coleeuu {
background-position: 0px -339px;
width:102px;
height:124px;
margin-left:14px;
}

.colegios {
background-position: 0px -180px;
width:107px;
height:44px;
margin-left:12px;
}

.feducacion {
background-position: 0px -74px;
width:122px;
height:96px;
margin-left:4px;
}

.acomercial {
background-position: 0px -680px;
width:111px;
height:37px;
margin-left:10px;
}

.appsLink {
background-position: 0px -473px;
width:122px;
height:130px;
margin-left:2px;
}

.blogLink,.fbookLink,.twitLink,.ytubeLink {
width:32px;
height:32px;
margin-left:16px;
margin-bottom:8px;
}

.blogLink {
background-position:0 0;
margin-left:24px
}

.fbookLink {
background-position:-32px 0
}

.twitLink {
background-position:0 -32px;
margin-left:24px
}

.ytubeLink {
background-position:-32px -32px
}

.locator {
width:100%;
color:#006;
text-align:left;
margin-left:8px;
position:relative;
left:4px
}

#cookiesmsg {
color: #333;
bottom:0px;
position:fixed;
left: 0px;
background-color: white;
opacity:0.8;
width:100%;
font-size:14px;
}

@media screen and (max-width: 1024px) {
body {
background-image:none
}
}

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

#headerBottom,#title,#engSite,#rightCol {
display:none;
}

#container {
width:360px;
margin-left:-12px;
}

#logo1a {
top:0px;
margin-left:94px;
}

#middleCol {
padding-top:190px;
box-shadow:none;
border-left:none;
}

#headerNewBox,.text08 {
width:304px;
}

#headerNewBox {
margin-left:6px;
}

#freeCol {
width:300px;
margin-left:auto;
}

#imgGame01,#imgGame02,#imgGame03,#imgGame04,#imgGame05,#imgGame06 {
margin-left:24px;
}

#onlineCol {
float:left;
margin-left:auto;
}

#mobileCol {
float:left;
margin-left:auto;
}

#demoCol {
float:left;
margin-left:auto;
}

#digitalCol {
float:left;
margin-left:auto;
}

#cdromCol{
float:left;
margin-left:auto;
}


.imgMobile{
    margin-left:-12px;
}

.locator {
margin-top:16px;
left:-20px;
}

}

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

#headerBottom,#title,#engSite,#rightCol {
display:none;
}

#container {
width:320px;
}

#logo1a {
margin-left:74px;
}

#headerNewBox,.text08 {
width:264px;
}

#headerNewBox {
margin-left:-12px;
}

#freeCol {
width:260px;
margin-left:0px;
}

#imgGame01,#imgGame02,#imgGame03,#imgGame04,#imgGame05,#imgGame06 {
margin-left:6px;
}


}