/* Links */		
a { text-decoration: underline; color: #2b2b2b; }
a:hover { text-decoration: underline; color: #fff; }
		
a2 { text-decoration: underline; color: #2b2b2b; cursor: pointer; }
a2:hover { text-decoration: underline; color: #666; }

h1 { font-size: 18px; color:#666; font-weight: normal; }
h2 { font-size: 11px; color:#666; font-weight: normal; margin-top: -18px; }

/* Tipografia */
.theserif { font-family: 'theserif',georgia; }
.thesans { font-family: 'thesans',arial; }

.b_right { }
.b_right:after { left: 30%; }

.b_small { }
.b_small:after { left: 35%; }

p { font-family: 'thesans',arial; font-size:14px; font-weight: normal; text-align:center; }
.tri, .img-container img, .img-container .txt { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); -moz-opacity: 0; -khtml-opacity: 0; opacity: 0; }
.opacityNo { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"!important; filter: alpha(opacity=100)!important; -moz-opacity: 1!important; -khtml-opacity: 1!important; opacity: 1!important; }
.ok, .ko, .plus-but, .txt-container .txt-container-wrapper strong { -webkit-border-radius:50%; -moz-border-radius:50%; border-radius:50%; }
.plus-but { -moz-box-shadow: 0 8px 0 0 rgba(0,0,0,.1); -webkit-box-shadow: 0 8px 0 0 rgba(0,0,0,.1); box-shadow: 0 8px 0 0 rgba(0,0,0,.1); }
#tri-cent1, #tri-cent2 { transform:scale(0); }
.svg-text, #intro-title .title1, #section-title span { font-family: 'chewy', sans-serif; text-shadow:0 .2em 0 rgba(0, 0, 0, 0.15); }

/* Crèdits */
#credits.pagina .txt-container-wrapper { left:50px; top:70px; width:840px; height:470px; }
#credits-text, #credits .txt-container-wrapper, #credits-titol { position:absolute; top:0; left:0; }
#credits-titol { left:0; width:100%; text-align:center; top:20px; color:#000; font-family: 'chewy', sans-serif; font-style:normal; font-weight:normal; font-size:24px; line-height:24px; letter-spacing:1px; }
#credits-text { z-index:100; left:140px; top:130px; color:#000; width:360px; }
#credits-text p { font-size:15px; line-height:20px; }

/* Buttons */
.round-button { font-family: 'thesans',arial; font-size:14px; font-weight:bold; text-align:center; color:#f5f5f5; text-decoration:none; display:block; width:35px; height:35px; line-height:35px; border: 2px solid #f5f5f5; border-radius: 50%; background: #bbb; box-shadow: 0 0 5px gray; cursor: pointer; }
.round-button:hover { background: #999; }

/* Estructura */
body { font-family: 'thesans',arial; font-size: 16px; line-height: 1.2em; color:#666; background: #f0f0f0; }		
#contingut { width: 940px; height: 670px; background-color: #fff; position:absolute; margin:auto; top:0; left:0; right:0; bottom:0; box-shadow: 1px 1px 2px #cccccc, 0 0 25px #cccccc, 0 0 5px #cccccc; }		
.lacaixa { width: 940px; height: 60px; background-color: #fff; position: relative; z-index: 10000; }			
.titol { width: 940px; height: 60px; text-align: center; position: absolute; padding-top: 6px; }	
.logo-titol { position: absolute; }				
.logo-titol-1 { width: 160px; height: 60px; left: 0; }					
.logo-titol-2 { width: 90px; height: 60px; right: 0; padding-top: 6px; font-size: 13px; line-height: 13px; color:#666; font-weight: lighter; }					
.logo-titol-3 { width: 60px; height: 50px; right: 100px; border-right: 1px dotted #666; margin-top: 5px; }					
.footer { position: absolute; bottom: 0px; }				
.logo-footer { position: absolute; left: 370px; }					
.credits { width: 60px; height: 50px; left: 840px; margin-top: 11px; }			
#credits-bg { width: 940px; height: 610px; background-color: rgba(255, 255, 255, 1); position: absolute; bottom: 0; z-index: 9000; }

/* Continguts */
/* Gral */
.content-wrapper { height:550px; position:relative; -webkit-touch-callout:none; -webkit-user-select:none; -khtml-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none; overflow:hidden; }
.content { position:absolute; top:0; left:0; width:100%; height:100%; overflow:hidden; }
.content * { cursor:default; }
.content, .movie { display:none; }

/* Intro */
#pentagon { width:300px; height:300px; position:absolute; top:50%; left:50%; margin:-150px 0 0 -150px; z-index:1; }
#pentagon .penta-wrapper { position:relative; height:100%; }
#pentagon .tri { width:100%; position:absolute; left:0; top:0; }
#shadow { top:92%!important; }
/**/
#intro-img { z-index:2; }
#intro { display:block; }
#intro-title, #section-title { color:#fff; text-align:center; display:block; padding-top:45%; }
#intro-title span, #section-title span { display:block; line-height:1.2em; font-size:1.5em; letter-spacing:.05em; cursor:default; }
#intro-title .title2 { font-family:'lovedbytheking', sans-serif; }
#intro-title #title3 { display:none; }
#intro-icon { width:99%!important; height:100%; line-height:330px; display:block; font-size:6.4em; text-align:center; color:#fff; }
/**/
#section-title { padding:0; position:absolute; display:none; width:600px; text-align:center; z-index:3; }
#section-title span { font-size:1.9em; line-height:1.4em; }
#section-title .title2 { font-size:1.7em; color:#000; text-shadow:none; }
/**/
.button { position:absolute; z-index:100; }
.button-wrapper { position:relative; text-align:center; display:block; }
.button-wrapper .button-base { width:100%; height:auto; }
.button-wrapper i { position:absolute; top:0; left:0; color:#dadada; font-size:2em; width:100%; display:inline-block; text-shadow:none; }
.button .button-wrapper { width:60px; height:60px; }
.button .button-wrapper i { line-height:55px; cursor:pointer; }
#button-continuar { margin:0 auto; margin-top:10px; width:100px; height:100px; }
#button-continuar i { line-height:95px; }
#button-section { right:1em; top:1em; }
#button-close { right:1em; top:1em; }
.button-prev { right:7.7em; bottom:1em; transform:scale(.8); }
.button-prev.yellow .color { fill:#fee100!important; }
.button-prev.yellow i { color:#000!important; }
.button-reload { right:16em; bottom:1em; transform:scale(.8); }
.button-next { right:3.5em; bottom:1em; transform:scale(1.2); }
.button-play { left:30px; bottom:30px; transform:scale(1.2); }
.button-play-big { left:145px; bottom:145px; transform:scale(1.2); }
.button-play-big .button-wrapper { width:200px; height:200px; }
.button-next .button-wrapper i, .button-reload .button-wrapper i, .button-play .button-wrapper i, .button-play-big .button-wrapper i { color:#000; }
.button-play .button-wrapper i { color:#333; font-size:12px; }
.button-play-big .button-wrapper i { color:#fee100; font-size:200px; line-height:200px; }

/*botons triangles*/
/*txt triangles*/
.svg-text { color:#fff; width:40%; display:block; text-align:center; position:absolute; letter-spacing:.05em; font-size:1.2em; line-height:1.4em; display:none; }
.svg-text#svg-text1 { top:-10%; left:-24%; }
.svg-text#svg-text2 { top:65%; left:-37%; }
.svg-text#svg-text3 { bottom:-42%; left:30%; }
.svg-text#svg-text4 { top:65%; right:-37%; }
.svg-text#svg-text5 { top:-10%; right:-22%; }
#svg-text-close { display:none; width:30%; height:120px; left:35%; top:35%; line-height:120px; position:absolute; font-size:2em; text-align:center; color:#fff; }
#svg-text-close i { text-shadow:none; }
/**/
.img-container, .img-container img { position:absolute; bottom:0; right:0; }
.img-container .img-wrapper { position:relative; }
/**/
.txt-container { position:absolute; }
.txt-container .img { width:100%; height:100%; position:absolute; top:0; left:0; z-index:1; }
.txt-container p { position:relative; z-index:2; }
.txt-container .txt-container-wrapper { position:relative; }
.txt-container .txt-container-wrapper h2 { position:absolute; top:0; font-size:18px; letter-spacing:1px; color:#000; z-index:100; font-weight:normal; padding:0; margin:0; font-family: 'chewy', sans-serif; font-style:normal; }
.txt-container.large .txt-container-wrapper h2 { left:0px; top:-20px; }
.txt-container.big .txt-container-wrapper h2 { right:60px; top:-25px; }
.txt-container .txt-container-wrapper strong { position:absolute; left:-10px; top:-25px; background:#000; text-align:center; font-size:24px; color:#fff; width:40px; height:40px; line-height:40px; z-index:100; font-weight:normal; font-family: 'chewy', sans-serif;}
.txt-container.conversa .txt-container-wrapper strong { left:-15px; top:-10px; background:#fee100; color:#000; font-family: 'chewy', sans-serif; }
.txt-container.pregunta.peq { width:200px; }
.txt-container.pregunta, .txt-container.conversa.short { width:250px; }
.txt-container.pregunta.large, .txt-container.conversa.large { width:350px; }
.txt-container.pregunta.big, .txt-container.conversa.big { width:500px; }
.txt-container.pregunta.bigger, .txt-container.conversa.bigger { width:600px; }
.txt-container.pagina { left:20px; top:25px; width:840px; }
.txt-container.pagina .txt-container-wrapper { height:515px; overflow:hidden; }
.txt-container.pagina .pagina-wrapper { width:88%; padding:60px 6% 0 6%; }
.txt-container.pagina .pagina-wrapper.col2 { width:38%; padding:60px 0 0 8%; float:left; } 
.txt-container.pagina .pagina-wrapper p { text-align:center; }
.txt-container.pagina .pagina-wrapper.col2 p { text-align:left; }
.txt-container.pagina p { font-family:Arial, Helvetica, sans-serif; font-size:13px; line-height:18px; padding:0 0 20px 0; margin:0; }
.txt-container.pagina p strong { font-family:Arial, Helvetica, sans-serif; letter-spacing:normal; font-weight:bold; font-style:normal; font-size:13px; line-height:18px; color:#000; position:inherit; top:inherit; left:inherit; right:inherit; bottom:inherit; display:inline; padding:0; margin:0; background:none; -webkit-border-radius:0; -moz-border-radius:0; border-radius:0; width:inherit; height:inherit; }
.txt-container.pagina p strong.typo { font-family: 'chewy', sans-serif; font-style:normal; font-weight:normal; font-size:16px; line-height:20px; letter-spacing:1px; }
.txt-container.pagina p .list { font-size:12px; line-height:20px; display:block; clear:both; padding:5px 0 0 0; text-indent:5px; }
.txt-container.pagina p .list:first-child { padding-top:20px; }
.txt-container.pagina p .list strong { font-weight:normal; font-family: 'chewy', sans-serif; -webkit-border-radius:50%; -moz-border-radius:50%; border-radius:50%; text-align:center; background:#fee100; display:block; width:20px; height:20px; line-height:18px; font-size:16px; text-indent:0; float:left; }
.txt-container.pagina p .list.strong { text-indent:0; font-weight:bold; font-size:13px; letter-spacing:normal; color:#527484; }
.txt-container.pregunta.white .color { fill:#fff; }
.txt-container.conversa.yellow .color, .txt-container.questHover.yellow .color { fill:#fee100; }
.txt-container.pregunta.blue .color, .txt-container.conversa.blue .color { fill:#c2d6df; }
.txt-container.conversa { width:450px; }
.txt-container.conversa.globo { background: url(../images/contents/globo-flcha1.png) no-repeat left 70%; }
.txt-container.conversa.globo.t25 { background: url(../images/contents/globo-flcha1.png) no-repeat left 45%; }
.txt-container.conversa.globo.down { background: url(../images/contents/globo-flcha4.png) no-repeat left 40%; }
.txt-container.conversa.globo.right { background: url(../images/contents/globo-flcha2.png) no-repeat right 70%; }
.txt-container.conversa.globo.right.t25 { background: url(../images/contents/globo-flcha2.png) no-repeat right 25%; }
.txt-container.conversa.globo.right.t45 { background: url(../images/contents/globo-flcha2.png) no-repeat right 45%; }
.txt-container.conversa.globo.right-up { background: url(../images/contents/globo-flcha3.png) no-repeat right 40%; }
.txt-container.conversa.globo.right-up.t15 { background: url(../images/contents/globo-flcha3.png) no-repeat right 15%; }
.txt-container.conversa.globo .txt-container-wrapper { margin-left:70px; }
.txt-container.conversa.globo.right .txt-container-wrapper { margin-left:0; margin-right:70px; }
.txt-container.conversa.globo.bigger.right .txt-container-wrapper { margin-right:50px; }
.txt-selectable { -webkit-touch-callout:text; -webkit-user-select:text; -khtml-user-select:text; -moz-user-select:text; -ms-user-select:text; user-select:text; cursor:text!important; }

.txt-container p { margin:0; padding:0; color:#000; letter-spacing:.05em; font-size:1.2em; line-height:1.4em; font-family: 'chewy', sans-serif; }
.txt-container.conversa p { padding:1.6em 2em 1.3em; }
.txt-container.pregunta p { padding:1em 2em 2em; }
.txt-container#movie3-txt11 { z-index:100; }
.conversa .txt-container-wrapper p { font-family:'lovedbytheking', sans-serif; font-size:1.3em; }
.conversa#movie4-inter2b .txt-container-wrapper p, .conversa#movie4-inter2c .txt-container-wrapper p { font-size:1.15em; }
.conversa .txt-container-wrapper p em { font-family: 'chewy', sans-serif; font-style:normal; }
#movie3-img, #movie3-img .img-wrapper { width:323px; height:455px; }
.img-container .img-wrapper .txt { display:block; width:140px; font-family: 'chewy', sans-serif; text-align:center; font-size:24px; color:#000; letter-spacing:1px; left:inherit; right:5px; top:194px; bottom:inherit; position:absolute; }

.plus-but { position:absolute; z-index:10; right:5px; bottom:-12px; width:45px; height:45px; background:#fee100; text-align:center; display:none; }
.plus-but i { font-size:25px; line-height:45px; color:#000; }

.txt-container.butHover, .txt-container.butHover *, .txt-container.conversa .plus-but, .txt-container.conversa .plus-but * { cursor:pointer!important; }
.cursorDraggable, .cursorDraggable * { cursor:move!important; }
.cursorDefault, .cursorDefault *, .txt-container.cursorDefault, .txt-container.cursorDefault * { cursor:default!important; }
.notransition { -webkit-transition: none !important; -moz-transition: none !important; -o-transition: none !important; -ms-transition: none !important; transition: none !important; }
.txt-container.conversa.top, .txt-container.pregunta.top { width:300px; top:-1.5em; left:-1em; }
.txt-container.pregunta.top { width:500px; left:300px; }
.txt-container.pregunta.top.large { width:650px; left:-20px; }
.txt-container.pregunta.top.more-large { width:860px; left:-25px; }
.txt-container.pregunta.top.minus { width:330px; left:-15px; }
.txt-container.pregunta.top.mini { width:350px; left:-15px; top:-25px!important; }
.txt-container.pregunta.top.minus-large { width:500px; left:-20px; }
.txt-container.pregunta.top.short { width:250px; }
.txt-container.conversa.top p, .txt-container.pregunta.top p { padding-top:2em; padding-left:2em; }

/* Movie */
#movie { background:url(../images/contents/bg.jpg) repeat-x top; }

/* Modals */
#modals { background:rgba(0,0,0,.2); z-index:1000; }
#modals .txt-container { width:300px; height:200px; top:50%; left:50%; margin:-100px 0 0 -150px; }
#modals .txt-container * { cursor:pointer; }
#modals .txt-container p { color:#fee100; }
.ok, .ko  { position:absolute; bottom:-12px; right:20px; background:#fee100; width:40px; height:40px; line-height:36px; font-size:25px; color:#000; z-index:10; text-align:center; }
.ok { background:#fff; }
#ok-close.ok { right:65px; }
#modals .txt-container.large { width:500px; margin:-100px 0 0 -250px; }
#modals .txt-container.large p { padding-bottom:50px; }
#modals .txt-container.large .ok { right:65px; }