@import url('/fonts.css');

BODY {
	color:#444; font:normal 13px open sans, dejavu sans, sans-serif; line-height:1.35em;
	display:flex;
	flex-flow:column;
}

H1, H2, H3, H4 {
 color:#341;
 font-family: Din Condensed, Oswald Light, Abel, Roboto Condensed, Open Sans Condensed, Condensed, Franklin Gothic Book, Franklin Gothic Medium, Calibri, Helvetica, Sans-Serif;
 font-size: 46px;
 font-weight:bold;
}

BODY.hu H1, BODY.hu H2, BODY.hu H3, BODY.hu H3, BODY.hu H4 {
 font-family: Oswald Light, Open Sans Condensed, Roboto Condensed, Open Sans Condensed, Abel, Franklin Gothic Book, Franklin Gothic Medium, Arial Narrow, Condensed, Calibri, Helvetica, Sans-Serif;
}

H1 { line-height:46px }
H2 { font-size:34px }
H2 { font-size:34px }
H2.dark { color:#572 }
H3 { font-size:28px }
H4 { font-size:25px }
H5 { font-size:19px }

.pSection, .pSectionMenu { display:-webkit-flex; display:flex; -webkit-flex-flow:column; flex-flow:column;  margin:0 }
.pSection { width:100%; background-size:100%; overflow:hidden; }

#pHeader { display:block }

.pSection > .content { width:85%; max-width:1024px; margin:4px auto; min-width:320px }
.pSection > .content H2 { margin-bottom:8px }

#swLang { position:absolute; top:12px; width:256px; left:calc(100% - 256px); left:-moz-calc(100% - 256px); text-align:right }
#swLang A { display:none; margin-left:10px }

.pSection .hblock {
  display:flex;
  flex-flow:row;
  align-items:flex-start;
  justify-content:space-between;
  min-height:300px;
}

.swLang A > IMG { width:26px; -ms-tansition:all 0.5s; -webkit-transition:all 0.5s; transition:all 0.5s }
.swLang A > IMG:hover { -ms-transform:scale(1.15); -webkit-transform:scale(1.15); -o-transform:scale(1.15); transform:scale(1.15) }
.sideBarBlock { }
.sideBarBlock > DIV { display:inline-block; vertical-align:top }
.sideBarBlock > .major { width:63%; float:left }
.sideBarBlock > .minor { width:37%; padding-left:3%; float:right }

.pSection .hblock > DIV { flex:1 1 auto }

.pSection > .content .menu { align-self:flex-start; padding-right:5% }

.main { text-align:justify; font-size:14px; line-height:1.3em }
.main P.title, .main P.title2 {
	margin:8px 0; color:#444;
	font:bold 25px Din Condensed, Oswald Light, Roboto Condensed, Open Sans Condensed, Sans-Serif;
	letter-spacing:0.5px;
}

BODY.hu .main P.title, BODY.hu .main P.title2 {
 font: bold 23px Oswald Light, Open Sans Condensed, Roboto Condensed, Open Sans Condensed, Abel, Franklin Gothic Book, Franklin Gothic Medium, Arial Narrow, Condensed, Calibri, Helvetica, Sans-Serif;
}

.main P.title { color: #000; border: 0 solid #000; border-bottom-width:2px; margin-bottom:24px }

.main P.title2 {
	display:inline-block;
	margin:4px 0;
	font-size:20px; text-transform:uppercase;
	border:0 solid #9c5; border-bottom-width:2px;
}

.main P.indent { margin: 2px 0 8px 3% }

.main A { color:#571; text-decoration:none }
.main A:hover { text-decoration:underline }
.main UL { margin:1.2em 0; padding:0 0 0 2em } 
.main UL > LI { margin:0 0 0.33em 0; padding:0 0 0 4px; list-style-image:none }

.pSection > .content .main { max-width:660px }

.pSection .hblock .menu { max-width:320px; min-width:244px }
.Section > .content > .hblock { margin-top:16px }

.dpage > DIV { display:inline-block; vertical-align:top; }
.pSection .dpage > .minor { width:27.5%; float:left; min-height:360px }
.pSection .dpage > .major { width:70.5%; float:right; border:0 dotted #ab4; border-left-width:1px; padding-left:2%; max-width:768px }
.dpage .major { font-size:1.2em; line-height:1.3em; padding-bottom:16px }
.dpage .major UL > LI { margin-bottom:0.6em }

.pSection > .content .menu > A {
 box-sizing:border-box;
 display:inline-block;
 width:100%;
 min-height:48px;
 color:#444;
 text-decoration:none;
 margin:5px 0;
 padding:10px 15%;
 font:bold 21px Din Condensed, Din Condensed C, Oswald Light, Open Sans Condensed, Roboto Condensed, sans-serif;
 border:1px solid #9c4;
}

BODY.hu .pSection > .content .menu > A {
 font: bold 20px Oswald Light, Open Sans Condensed, Roboto Condensed, Open Sans Condensed, Abel, Franklin Gothic Book, Franklin Gothic Medium, Arial Narrow, Condensed, Calibri, Helvetica, Sans-Serif;
}

.pSection > .content .menu > A.active { background:#8cc63e; color:#fff }

.pSection > .content .menu > A:hover { background:#b7db85 }
.pSection > .content .menu > A.separator { margin-top:16px }

.pSection > .content .menu > A.single { border:0; font-style:italic; font-size:19px }

A.arrowBtn:after { content: '>'; float:right }

.goUp { text-align:right; margin:8px 4px 4px auto }

#about .hblock { min-height:224px }
A.btn, A.button { box-sizing:border-box; display:inline-block; text-decoration:none }
A.button {
	font:bold 1.5em Din Condensed, Oswald Light, Abel, Roboto Condensed, Open Sans Condensed, Condensed, Franklin Gothic Book, Franklin Gothic Medium, Calibri, Helvetica, Sans-Serif;
	color:#95c; background:#fff; padding:0.32em 0.7em; margin:8px 0
}
A.button:hover { background:#571 }

BODY.hu A.button {
 font: bold 1.46em Oswald Light, Open Sans Condensed, Roboto Condensed, Open Sans Condensed, Abel, Franklin Gothic Book, Franklin Gothic Medium, Arial Narrow, Condensed, Calibri, Helvetica, Sans-Serif;
}

A.btn { background:#95c; color:#fff; padding:8px; min-width:80px; text-align:center; letter-spacing:0.07em;  }
A.btn.lightgreen { background:#cde3b2 }
A.btn:hover { background:#571 }

.pSectionMenu { -webkit-flex-flow:column; flex-flow:column }

.whiteBox, .main .whiteBox, DIV.whiteBox { background:#fff; color:#120; border:1px solid #571; padding:10px 12px; margin:12px 10%; }
.greenBox, .main .greenBox, DIV.greenBox { background:#95c; color:#fff; border:1px solid #571; padding:10px 12px; margin:12px 6%; font-size:0.9em }
.whiteBox A, .greenBox A { text-decoration:underline }
.whiteBox A { color:#571 }
.greenBox A, { color:#ef0 }

.copy { font-size:12px; letter-spacing:1px }
.copy A { color:#451; text-decoration:none }
.copy A:hover { text-decoration:underline }

.menuNav1 {
 width:85%; max-width:1024px;
 margin:0 auto;
 display:-webkit-flex;
 display:flex;
 -webkit-flex-flow:row;
 flex-flow:row;
 -webkit-justify-content:space-between;
 justify-content:space-between;
 -webkit-align-items:stretch;
 align-items:stretch;
 background:#9c4;
}

.menuNav1 H3 {
 -webkit-flex:1 1 auto;
 flex:1 1 auto; 
 width:15%;
 font-weight:bold;
 padding-top:5px;
}

.menuNav1 > A {
 display:inline-block;
 text-align:center;
 -webkit-flex:1 1 auto;
 flex:1 1 auto;
 font:bold 24px Din Condensed, Oswald Light, Abel, Roboto Condensed, Open Sans Condensed, Sans-Serif;
 text-decoration:none;
 color:#fff;
 padding:9px 4px 8px 4px;
}

.menuNav1 > A.active { color:#351 }
.menuNav1 > A:hover { color:#fff; background:#351 }

BODY.hu .menuNav1 > A {
 font:bold 21px Oswald Light, Open Sans Condensed, Roboto Condensed, Abel, Arial Narrow, Condensed, sans-serif;
}


#pHeaderTop { position:relative; padding:0; vertical-align:bottom; margin:1.5 auto 0 auto }
#mainLogo, #secondaryLogo { height:100%; display:inline-block; vertical-align:bottom }
#secondaryLogo > IMG { height:100%; }
#pHeaderTop H1 { font-size:4.14em; line-height:1.04em; letter-spacing:-0.0075em; text-align:center; padding:0 2px }
#pHeaderTop > A > IMG { vertical-align:bottom }

.mainTitle H4 {
 background:#162; color:#fff; padding:0 0 1px 0; text-align:center; 
 font-size:2.6em; line-height:1.3em; font-weight:400; text-shadow:0px 0 0.5px #fff; letter-spacing:0.006em;
}

.dialog .dialogTitle {
 font:bold 32px/32px Din Condensed, Oswald Light, Abel, Roboto Condensed, Franklin Gothic Medium, Arial Narrow, Open Sans Condensed, Condensed, Sans-Serif;
 color:#231;
 text-align:center;
 margin:5px 0 5px 0;
}

BODY.hu .dialog .dialogTitle {
 font-family: Oswald Light, Open Sans Condensed, Roboto Condensed, Open Sans Condensed, Abel, Franklin Gothic Book, Franklin Gothic Medium, Arial Narrow, Condensed, Calibri, Helvetica, Sans-Serif;
}

.dialog .dialogMsg {
 font:normal 17px Open Sans, FreeSans, Helvetica, Sans Serif;
 color:#341;
 text-align:center;
}

.dialog BUTTON { border:1px solid #8a2; padding:4px; font-size:18px }
.dialog .okBtn { background:#341; color:#fff }
.dialog .okBtn:hover { background:#791 }
.dialog .cancelBtn { background:#aaa }
.dialog .cancelBtn:hover  { background:#777 }
.dialog INPUT[type=text] {
	border:1px solid #484848;
	font-size:18px; color:#555;
	padding:0 3px;
	height:32px; border-radius:5px;
}

/* --- ESTILOS DE LAS NEWS (news.css en UNICEO) --- */

.body P { margin:0.3em 0 }
.body UL { margin:0.5em 0 }

P.title1, .title2, .title3, .title4, .title5 { 
	font:normal 36px Din Condensed, Oswald Light, Abel, Roboto Condensed, Open Sans Condensed, franklin gothic book, franklin gothic medium, calibri, helvetica, sans-serif;
	color:#226; margin:0 0 0.52em 0;
	text-align:left;
}

BODY.hu P.title1, BODY.hu .title2, BODY.hu .title3, BODY.hu .title4, BODY.hu .title5 {
 font: normal 34px Oswald Light, Open Sans Condensed, Roboto Condensed, Open Sans Condensed, Abel, Franklin Gothic Book, Franklin Gothic Medium, Arial Narrow, Condensed, Calibri, Helvetica, Sans-Serif;
}

.title1, P.title1, .title2 { font-weight:bold }
.title1, P.title1 { color:#8c1 }

.title2 { font-size:28px }
.title3 { font-size:25px }
.title3 { font-size:23px }
.title4, P.title4 { font-size:1.6em; margin:0.7em 0 0.2em 0 }
.title5 { font-size:21px }

UL > LI > P:first-child { margin-top:0 }
UL.news { padding-left:1.2em; margin:1.0em 0 }
UL.news > LI { list-style-image:url(/images/icon-arrow-blue-10x10-i.png); margin:0; line-height:1.3em }
.main UL.news { margin:0.5em 0; padding-left:1.5em }
.main UL.news > LI { list-style-image:none; margin-bottom:0.3em }

TABLE.tabbedList TD { padding:0 3px 3px 0 }
