/* --------------------------------------- RESET STYLES -------------------------- */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { 
	margin:0;	padding:0;	border: 0;	font-size: 100%; outline: 0;
}

/* --------------------------------------- GENERAL STYLES ----------------------- */
@font-face {
    font-family: 'Montserrat'; /*a name to be used later*/
    src: url('http://arcdev.housing.salle.url.edu/oikonet/public/fonts/Montserrat-UltraLight.otf'); /*URL to font*/
	font-weight:lighter;
}
@font-face {
    font-family: 'Montserrat'; 
    src: url('http://arcdev.housing.salle.url.edu/oikonet/public/fonts/Montserrat-Light.otf'); 
	font-weight:normal;
}
@font-face {
    font-family: 'Montserrat'; 
    src: url('http://arcdev.housing.salle.url.edu/oikonet/public/fonts/Montserrat-SemiBold.otf');
	font-weight: bold;
}


body{font-weight:normal; font-family: Arial, Verdana, sans-serif; font-size:100%; background:#fff; -webkit-text-stroke: 1px transparent;}

#container{font-family:Montserrat, sans-serif; text-align:left; height: 100%; overflow:hidden; margin:0px auto; width:1280px;}

/* header */
#header{ width:100%;  height:auto; float: left;	background-color:#fff;  z-index:99999; } 
#header #logos{	height:auto; /*width:74.72%; padding:0 14% 0 12.8%;*/ width:90%; padding:0 5%; border-bottom:1px solid #e4e4e4; overflow:hidden; }
#logoOiko{}
#logosUE{float:right; margin-top:15px; width:31%}

#menu{ height:46px; width:auto; /*padding:0 12.36% 0 12.8%;*/ padding: 0 5%; color:#7b7b7b;	font-size:16px; /*font-size:0.813em;*/	overflow:hidden; box-shadow:0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);  }
#menu ul {float:left; width:100%; margin:16px 0px 0px; list-style:none;} 
#menu ul li {float:left; /*margin:0px 13px;*/ margin: 0 9px; font-size: 0.8em; padding-bottom:10px;}
#menu li:hover{border-bottom:5px solid #4bb7e5;}
#menu ul li  a{ text-decoration:none; color:#7b7b7b; font-weight:bold;}
#menu .selected{ border-bottom:5px solid #4bb7e5;  }
#menu .selected a{ color:#000; text-decoration:none;}
#menu #menuContact, #menu #menuGuide{float:right;}
#submenu {height:46px; background-color:#3b5da5; color:#fff; float:left; width:100%; padding: 0 5%;}
#submenu .subcategory{display:none;}
#submenu li{float: left;  font-size: 0.74em;  margin: 0 20px 10px 9px; padding: 15px 0 3px; cursor:pointer;}
#submenu li a{color:#fff; text-decoration:none;}
#submenu li:hover{border-bottom:2px solid #fff;}
#submenu li.selected{border-bottom:2px solid #fff;}
#submenu li.unSelected{border:0;}

/* -------------------------------------------- CONTENT --------------------------------- */
.loading-container{position: fixed; left: 50%; z-index: 1; top:50%;}
#content{width: 100%; overflow:hidden; float: left;	background:#f7f7f7;  min-height: 750px;	}
#subHeader{background:url('../img/imatge header.png') no-repeat; width:1280px; height:240px; text-align:center;  color: #fff; overflow:hidden;} 
#content #main {/*width: 940px;*/ width:74.72%; /*73.4%;*/ float: left; margin-bottom: 40px; /*margin:0 177px 0 160px;*/margin:0 14% 0 12.8%; min-height: 750px;}

#main #leftMain{ /*width:68.7%;*/ float:left; margin-bottom:30px; }
#leftMain.defaultWidth{	/*width:714px;*/ width:897px;}
#leftMain.heightHome{min-height:838px;}
#leftMain.defaultHeight{overflow:hidden; height:auto;}
#leftMain.contactWidth{	width:940px;}
#leftMain.partnersWidth{/*width:618px;*/ /*width:814px;*/width:786px;}
#leftMain .contentDefault{margin-top:58px; margin-right: 12px; float:left;}

#main #rightMain{width:225px; /*width:31.9%;*/ float:left; margin-bottom:20px; padding:0 15px; background-color:#fff;}
#rightMain .contentRight{float:left; margin-top:13px; width:100%; margin-bottom: 28px;    /*margin-bottom: 25px;*/}
.contentRight .textRightMain.oikonetBlogs{font-weight:normal;}
.contentRight .textRightMain.oikonetBlogs:hover{background-color:#fdedf3; color:#fe0056;}


.contentRight .textRightMain.oikodomos{font-weight:normal;}
.contentRight .textRightMain.oikodomos:hover{background-color:#deecf6; color:#0083c4;}
#rightMain .contentRight.withoutMargin{margin-top:0;}

.imgeGraphSidebar{float:left;}
.imgeGraphSidebar:hover{opacity:0.5;}
.logoOikonetwork{float:left; margin-right:5px;}

.contentRight .contentSection{ float:left;/* margin-top:20px;*/ margin-bottom:12px; /*border:1px solid #c9c9c9; padding:15px;*/ background:#f4f4f4; width:226px;}
.contentRight .sectionBackground{ margin-bottom:0px; background-color:#E5EECC; width: 205px; padding: 10px;}
.contentRight .rightParticipate{float:left; width:31%; margin-right:6.6%;}
.contentRight .leftParticipate{float:left; min-width:61.6%; /*margin-bottom:6.6%;*/}
.contentRight .leftParticipate h3{color:#e30054; margin-bottom:18px; font-size:14px; font-weight:bold;}
#content #main .colorSection{background:#e40055; color:#fff; font-weight:normal; padding:4px 10px;}
#main h3.titleParticipate{float:left;  /*font-size:1.000em;*/ /*font-size:1.05em;*/ font-size:0.85em;  width:91%; margin-bottom:5px; }
#main h3.titleParticipate .iconRight{float:right; cursor:pointer;}
#main p.buttonsParticipate{float:right; /* font-size:1.000em;*/ font-size:0.8em; margin-right:3px;}

#main #menuLeft{float:left; width:100px; background:#fff; border:1px solid #c9c9c9; margin:30px 0px 0px 0px; padding:20px 0px 20px 10px; margin-bottom:30px; font-size:0.9em; border-right:0px;}

#footer{width: 100%; float:left; position:relative;} 
#footer #contentFooter{ width:100%; background:#3B5DA5; color:#fff;}
#contentFooter .textFooter{ font-size:0.65em; padding:10px 0px; margin:0 14% 0 12.8%; text-align:center; line-height:17px;}

.hide {display: none;}
.show{display: block;}
.clear {clear: both;}
.break-word { word-wrap: break-word;}/* obliga a cortar el texto*/
.noUnderline{text-decoration:none;}
.separateTop{margin-top:20px;}
.separateLeft{margin-left:15px;}

.separateText10{margin-bottom:10px;}
.separateText20{margin-bottom:20px;}
.pointMagenta{border:5px; width:10px; height:10px; background-color:#E40055; float:left;  margin-right:5px; margin-top:3px;}
.circlePedagogy{border-radius:5px; width:10px; height:10px; background-color:#f7a900; float:left; margin-right:5px; margin-top:3px;}
.circleResearch{border-radius:5px; width:10px; height:10px; background-color:#E40055; float:left;  margin-right:5px; margin-top:3px;}
.circleCommunity{border-radius:5px; width:10px; height:10px; background-color:#7ab51d; float:left;  margin-top:3px;}

img { max-width: 100%; height: auto; width: auto\9; /* ie8 */ display: block;} /*image responsive*/
.consortiumImage{ margin-left:0px; cursor:pointer;}
.imgContenido{width:224px; float:left; margin-left:75px; margin-bottom:12px;}
.imgContenido:hover{opacity:0.5;}

.contentAllRelations{overflow:hidden; margin-top:20px; font-size:12px;  margin-bottom:20px;}
.contentAllRelations.relationsPartner{float:left; display:none; width: 98%;}
.contentAllRelations.relationsConferences{float:left; width:100%;}
.contentTitleRelation{font-size:14px; background-color:#79B51C; padding:5px; color:#fff; margin-bottom:20px;}

#main .contentTitleRelation p{background-color:#F7A800; width:14px; height:15px; text-align:center; color:#fff; border-radius:10px; font-weight:bold; float:left; font-size:12px; padding-right: 1px; padding-bottom:1px; margin-right: 10px;}

/* ------------------------------- BUTTONS SOCIAL MEDIA ------------------------------ */
.twitterShareButton{background:url('./img/twitter.png'); width:20px; height:20px;}

/* -------------------------------  TEXTS ------------------------------ */
#main p { color:#000; /*font-size:12pt;*/ font-size:0.731em; text-align: justify; font-weight:normal; line-height:18px; }
#main p.titlePartner{	font-weight:bold;	color:#e40055;	/*font-size:14pt;*/ font-size:0.85em; 	margin-bottom:25px;	text-align: left; display:block; cursor:pointer;}
#main  h2.titleSection{ color:#000; /*font-size:16pt;*/	/*font-size:1.05em;*/font-size:0.85em; margin:30px 12px 0 0; /*margin: 4.8% 3.2% 0 0;*/ border-bottom:1px solid #e4e4e4; padding-bottom:10px; /*padding-bottom:1.7%; */	font-weight:normal;}
#main  h2.titleSection.caseRight{margin-right:0px;}
#main  h2 .titleConference{margin-right:30px; cursor:pointer;}
#main  h2 .titleConference:hover{color:#000;}
#main  h2 .titleConference.activeConference{color:#000;}
#main  h2 .titleConference.desactiveConference{color:#7b7b7b;}
#main  h2 .titleConference.desactiveConference:hover{color:#000;}
#main  p.lineColorSection{ width:50px; height:3px; background:#4bb7e5; margin-top:-3px; display:block;}
#main .link{color:#4a99cb; text-decoration:none; }
#main .linkMagenta{color:#000; text-decoration:none; font-weight:bold; }
#main .titleColor{color:#e30054; }
#main p.selectItemMenu{color:#2b7ec2; font-weight:bold; margin-bottom:10px; cursor:pointer;}
#main p.unselectItemMenu{color:#909090; margin-bottom:10px; cursor:pointer; font-size:11px; font-weight:bold;}
#main p.newDate{ font-size:0.6em; color:#86837c; margin-top:12px; margin-bottom:10px; font-weight:bold;}
#main p.textRightMain{color:#000; font-family: Montserrat; font-size: 0.65em; text-align: justify; cursor:pointer; opacity:0.7; line-height:15px;}
#main p.textSectionBackground{margin-bottom: 5px; color:#000;}
#main p.textRightMain a{text-decoration:none; color: #000;  cursor:pointer;}
#main p.textRightMain.oikodomos a:hover{color:#0083c4; text-decoration:none; cursor:pointer;}
#main p.textRightMain.oikonetBlogs a:hover{color:#fe0056; text-decoration:none; cursor:pointer;}
#main p.textRightMain > span:not(.specialTextRightMain) :hover {opacity:1;}
/*#main p.textRightMain span.specialTextRightMain:hover{opacity:1; cursor:default;}*/
/*#main p.textRightMain.specialTextRightMain a{opacity:1 !important;}*/
#main p span.titleSectionPartner{color:#79b51c; font-weight:bold; }
#main p.bottomMargin{margin-bottom:15px;}
#main p.bottomMargin.buttonRead{font-size:9px; cursor:pointer; color:#fff; border-radius: 5px; padding: 3px; background:#4bb7e5; float:right;}
#main p > .buttonRead{font-size:9px; cursor:pointer; color:#fff; border-radius: 5px; padding: 3px; background:#4bb7e5;}
#main p.bottomMargin a{color:#4a99cb; text-decoration:none;}
a.linkGraph{width:15px; height:15px; background:url('../img/15X15.png') no-repeat; float:left; margin-right:10px; cursor:pointer;}
a.linkGraph:hover{background:url('../img/15X15HOVER.png');}
#main p.headerTextSection{color:#424242;}
#main p.textContact{color:#424242; font-size:0.75em; line-height:1.5;}
#main p.titleContenido{font-weight:bold;}
#main p.author{margin-bottom:10px; font-weight: bold; font-size: 0.7em; color:#f7a800;}
#main p.relatedFiles{margin-bottom:10px; font-weight: bold; font-size: 0.8em; color:#3b5da5; text-decoration:none; margin-top:30px;}
#main p.titleElement{margin-bottom: 15px;}

#main .textRelatedFiles{width:570px; font-size: 0.9em; /*margin-bottom:30px;*/} /* ponerlo en float para conferences */
#main .textRelatedFiles a{ font-size: 0.8em; text-decoration:underline;}

/* --------------------------------- HOME ------------------------------ */
#leftMain .contentColumn{ min-height:640px; /*margin-top: 25px;*/}
#leftMain .contentNew{overflow:hidden;	/*padding-top:30px;*/	/*padding-top:4%;*/	/*width:224px;*/ width:284px; /*width: 31%;*/	margin-right:12px;	margin-bottom:12px; /*margin-top: 3.2%;*/ /*border-bottom:1px solid #e4e4e4;*/ background:#fff; border:1px solid #c9c9c9;}
#leftMain .contentNew  .contentDate{ overflow:hidden; font-size:0.7em; }
#leftMain .contentNew  .contentHeaderNew{ overflow:hidden; float:left; border-bottom:1px solid #c9c9c9; /*width:200px;*/ width:260px; padding: 0 12px 12px;}
#leftMain .contentNew  .contentTextNew{ overflow:hidden; float:left; border-bottom:1px solid #c9c9c9; /*width:200px;*/ width:260px; padding: 12px;}
#leftMain .contentNew  .contentTagNew{ overflow:hidden; float:left; width:200px; margin-top:15px;}
#leftMain .contentNew  .contentBottomNew{ overflow:hidden; float:left; /*width:200px;*/ width:260px; height:15px;  padding: 12px;}
#main p.leftDate{background:#7ab51d; color:#fff; padding:10px;  float:left; margin-right:1px;  font-size: 0.95em;}
#main p.rightDate{background:#f7a901; color:#fff; padding:10px;  float:left; font-size: 0.95em;}
#main h1.titleNew{ color:#424242; cursor:pointer; /*font-size:20pt;*/ /*font-size:1.33em;*/ /*font-size:1.1em;*/ font-size:0.83em; font-weight:bold; line-height: 19px;}
.contentTextNew p.textNewHome{ color:#000; font-size:0.75em;  float:left; /*width: 200px;*/ width:260px;}
.contentTextNew p.textNewHome span{ color:#fff; font-size:0.7em; border-radius: 5px; padding: 3px; background:#4bb7e5; cursor:pointer; }
.contentTextNew p.textNewHome span:hover{opacity:0.5;}

#main  p.tagNew{ font-size:	0.667em; float:left; margin-right:5px;}
#main  p.tagNew span{ text-decoration:underline; margin-right:5px; float:left;}
#leftMain .contentNew .contentImage{ float:left; border-bottom:1px solid #c9c9c9; /*width:224px;*/ width:284px; cursor:pointer;}

			/*-------- List Home ---------*/
#contentListHome{margin-top:0px;}

#contentListHome #contentFiltersListHome{width:98.5%; overflow:hidden; margin-bottom: 20px;}
#contentFiltersListHome .contentFilter{float:left; margin-right: 10px; cursor:pointer; padding:3px; /*border:1px solid #e3e3e3;*/}
.contentFilter:active{ box-shadow: 0 5px #ccc; transform: translateY(4px);}
.iconGraphFilter{display:inline; float:left;  cursor:pointer;}
.typeUnselected{border:0; opacity:0.3; background-color:#e3e3e3; border:1px solid #f7f7f7;}
/*.typeUnselected:hover{opacity:1; background-color:#fff; border:1px solid #e3e3e3;}*/
.typeSelected{border-top:1px solid #f7f7f7; border-bottom:1px solid #f7f7f7; border-left:1px solid #e3e3e3; border-right:1px solid #e3e3e3;}
/*.typeSelected:hover{opacity:1; background-color:#fff; border:1px solid #e3e3e3;}*/
.contentFilter input[type='checkbox']{float:left; font-size:9px; margin-left:10px;}
.contentFilter span{float:left; font-size:9px; margin-left:5px; padding-top: 2px;}
#contentFiltersListHome .textFilters{float:left; font-size:11px; margin-right:20px; padding-top:5px;}

#contentListHome #contentHeadersListHome{width:98.5%; height:20px;}
#contentHeadersListHome .headerTextList{float:left; text-transform:uppercase; font-weight:bold; font-size:10px;  text-align:center;}
.headerTextList .arrow{cursor:pointer;}
.headerTextList.dateType{width:110px;}
.headerTextList.typeType{width:50px;}
.headerTextList.titleType{margin-right:10px; width:310px;}


#contentListHome #contentAllElements{overflow-y:auto; width:98.5%;}
#contentAllElements .contentElement{width:98.5%; overflow:hidden;}
#main p.newDate.dateElementList{float:left; width:100px; text-align:right; margin-right:20px; margin-top:0px;}
.contentElement .typeElementList{text-align: center; float: left; padding-left: 5px;}
.typeElementList .iconElementList{float:left; margin-right:20px;}
.contentElement .linkElementList{font-size:12px; float:left; margin-right:10px;}

#contentListHome #contentNumPages{float:right; margin-right:2.5%;}
#contentNumPages .numPage{float:left; margin-right:10px; color:blue; cursor:pointer;}

#contentIconsHome{margin-bottom:10px; margin-top:27px; overflow:hidden; width:98.5%; }
#contentIconsHome .iconHome{font-size:14px; text-decoration:underline; float:left; margin-right: 5px; /*border:1px solid #e4e4e4;*/ padding:0px 3px; color:#000000;}
.rightIH{margin-left:30px; cursor:pointer;}
#contentIconsHome img{float:left;}
#contentIconsHome span{float:left; margin-left:10px; font-size: 0.85em;  padding-top: 5px;}
.iconHome:hover, :focus{opacity:0.5;}

/* ---------------------------------- RESOURCES ------------------------------ */
#main  h3.resource{ float:left; margin-top:15px;  line-height:1; }
#main  h3.resource span.titleResources{ font-size:0.85em; text-decoration:underline;}
#main  h3.resource span.textResources{color:#7b7b7b; font-size:0.8em; font-weight:normal; text-decoration:none !important;}

/* ---------------------------------- CONSORTIUM ------------------------------- */
#main #wrapGroupPartner{overflow:hidden;}
#main .wrapPartner {	float:left;	width:21.3%; margin-right:4.3%;  margin-top:5.4%; }
#main .last { margin-right:0%; }

/* ---------------------------------- PARTNERS --------------------------------- */
#leftMain.partnersWidth .contentPartner{float:left; margin-right:12px; border:1px solid #c9c9c9; margin-top:30px; background:#fff; /*border-left:0px;*/ padding-left:20px; padding-bottom:20px; min-height:1177px; /*width:618px;*/}
#leftMain #headerPartner{margin-top:30px; margin-right:20px; float:left; width:97%; }
#main p.contentImageHeaderPartner{width: 100px; float:left; margin-right: 7.3%;}
#leftMain .textPartner{margin-top:30px; margin-right:20px;  float:left;}
img.logoPartnerHeaderPartner{float:left; margin-right:10px;}
#main p.namePartnerHeaderPartner{ font-weight:bold; float:left; max-width: 420px; font-size:14px; color:#79b51c;}
#main p.cityPartnerHeaderPartner{float:left;}
#main #labelMenuLeft{display:none;}

/* ---------------------------------- ACTIVITIES ------------------------------------ */
.contentDefault .contentActivity{float:left; border:1px solid #e4e4e4; padding:15px 15px 10px;  /*width: 670px;*/ width:851px; background: none repeat scroll 0 0 #FFFFFF; margin-bottom: 15px;}
.contentActivity .contentImagesActivity{/*float:left;*/ margin-top:30px; }
.leftActivity{float:left; margin-right:15px; width:140px;}
.rightActivity{float:left; width:100%}
#main h3.titleActivity{margin-bottom:15px;  font-size:0.85em;}

#main  p.footImage{font-size:0.667em; }

/* ---------------------------------- PROJECT --------------------------------------------- */
.contentDefault.contentBlock{background: none repeat scroll 0 0 #FFFFFF; border:1px solid #e4e4e4; }
#main h3.titleTextProject{margin:30px 0 30px 0; font-size:0.85em;}
#main  p.textProject { color:#000; margin:0 15px;}
#main  p.spaceText {margin-bottom:30px;}
#main  p.tabulateText {margin-left:35px;}
#main  p.indexitText {margin-left:64px;}
#main  p.headerText {margin-top:30px;}
#main  p.textProject span {color:#79b51c; font-weight:bold;}
.imgProject{width:80%; margin-left:10%; margin-bottom:30px;}

/* ----------------------------------- CONFERENCES-WORKSHOPS ------------------------------ */
.imgConference{float:left; margin-right:15px; margin-bottom:15px;}
#main p.titleContenido.titleConferenceText{float:left;width: 430px;}
#conferenceBarcelonaContent .programConference{float:left; margin-top:30px;}

/* ----------------------------------- PAGINATION ------------------------------------------ */
 #pagination{position:relative; z-index:1; top:6px; left:0px; height:25px;display:block; width:300px; text-align: right;}
 #pagination  a{ text-decoration:none; color:#5e5e5e; font-size:12px; font-family:Verdana; font-weight:regular;}
 #pagination strong, #pagination a:active{font-weight:bold; color:#79b51c; font-size:12px; font-family:Verdana;}
 #imatge_paginesNoticias{z-index:0; position:relative; width:300px;min-height:42px; margin-right:12px; float:right;}
 .pages{color:#000; font:12px Verdana; padding-right:10px;}
 
/* ----------------------------------- SUBSCRIBE ---------------------------------------------- */
#mc_embed_signup{ clear:left; font:14px Helvetica, Arial, sans-serif;  width:226px; margin-top:15px;}  
#mc_embed_signup form{padding:0;}
#mc_embed_signup h2{font-family:Arial, sans-serif; font-size:11px; font-weight:normal; color:#575757; margin-bottom:2px; margin-top:0px;}
#mc_embed_signup .mc-field-group{min-height: 30px; width:100%; padding-bottom:0;}		
#mc_embed_signup .mc-field-group #mce-EMAIL{ padding: 5px 0; width: 168px; border: 1px solid #e4e4e4; float:left; font:10px Verdana; color:#575757;}
#mc_embed_signup .clear{float:left; }
#mc_embed_signup .mc-field-group #mc-embedded-subscribe {width:45px; margin:0 0 0 10px; padding:3px 0; font:12px Verdana; background-color: #f7f7f7; color: #575757; font-weight: normal; border: 1px solid #e4e4e4; border-radius: 0px; height: 24px;  clear: none; float: left;}
#mc_embed_signup div#mce-responses{padding:0;}
#mc_embed_signup #mce-error-response{display:none font-family: verdana; font-size: 11px;  font-weight: normal;  margin: 5px 0 0; padding: 0;}
#mc_embed_signup #mce-success-response{ font: 11px Verdana; padding:0; margin:0;}

/* ----------------------------------- GUIDE --------------------------------------------------*/
.contentActivity.guide{padding:30px; width:821px;}
.logo_guide{margin-bottom:30px;}
.section_guide{border-top:1px solid #e4e4e4; padding:27px 0; overflow: hidden;}	
#main p.title_guide{font-size:0.8em; color:#3b5da5;  font-weight: 600;}
.text_guide{ font-size:0.731em; line-height:18px;}
#main p.title_section{ font-size:0.8em; color:#3b5da5;  font-weight: 600; margin-bottom: 27px;}
.content_images{margin:15px 0;}
.column_first{float:left; width:194px;}
.column{float:left; width:194px; margin-left:15px;}
#main p.title_column{ font-size:0.8em; color:#4bb7e5; font-weight:600;}
#main p.text_column{text-align:left;}
.half_column{float:left; width:400px;}
.half_column.right{margin-left:20px;}

/* ---- MSG POP UP ---- */

#msgPopUP{display:none; background:#fff; border:1px solid #ddd; left: 342px; position: fixed;  top: 190px;  padding: 30px; font-family:'Montserrat', sans-serif; font-size:14px; text-align:center;}
#msgPopUP .textCenter{font-weight:bold; color:#ff0000; margin:10px 0;}

/* --------------------------------------- MEDIA QUERIES ------------------------------------ */
/* LARGE SCREENS */
@media only screen and (min-width :1410px ) { /*1824px*/
	/*body { width: 1280px; }*/
}

/* WIDE DESKTOP LAYOUT */
@media only screen and (max-width: 1176px) {
	/*body { width: 1080px; }
	#container {	width: 100%;}
	#header #logos{padding:0 12% 0 8.8%; width:79.4%;}
	#header #menu{padding:0 12% 0 8.8%;}
	#content #main {	width:79.4%; margin:0 12% 0 8.8%;}
	#main #leftMain{width:583px; }
	#leftMain .contentNew {width:273px; margin-right: 18px;}
	#main #rightMain{width:273px;}
	
	.leftActivity{float:left; margin-right:13px; width:129px;}
	.rightActivity{float:left; min-width:419px;}*/
} 

/* TABLET LAYOUT */
@media only screen and (min-width: 768px) and (max-width: 991px) {
	/*body {	width: 712px;}
	#container {	width: 100%;}
	#header #logos{padding:0 11% 0 9.8%; width:auto;}
	#header #menu{padding:0 11% 0 9.8%;}
	#content #main {	width:80.4%; margin:0 11% 0 9.8%;}
	#main .heightHome{height:auto; overflow:hidden;}
	#main #leftMain{width:514px; }
	#leftMain .contentNew {width:237px; margin-right: 18px;}
	#main #rightMain{width:514px;}
	
	.leftActivity{float:left; margin-right:15px; width:113px;}
	.rightActivity{float:left; min-width:363px;}
	
	#main #menuLeft{width:57%; overflow-y: scroll; height:50px; margin-bottom:5%;  margin-top: 3%;}
	#main #labelMenuLeft{display:block;  margin-top: 5%;}
	#leftMain #headerPartner{margin-top:0%;}
	p.namePartnerHeaderPartner{width: 55%;word-wrap: break-word;}*/
}

/* MOBILE LAYOUT (PORTRAIT/320PX) */
@media only screen and (max-width: 767px) {
	/*body {width: 320px;}
	#container {	width: 100%;}
	#header #logos{padding:0 3.5% 0 2.8%; width: 94.4%;}
	#header #menu{padding:0 3.5% 0 2.8%; font-size: 0.6em;}	
	#menu ul li {padding: 5px 4px;}
	#menu .selected {border-radius: 2px 2px 2px 2px;}
	#content #main {	width:94.4%; margin:0 3.5% 0 2.8%;}
	#main .heightHome{height:auto; overflow:hidden;}
	#main #leftMain{width:100%; }
	#leftMain .contentNew {width:100%;}
	#main #rightMain{width:100%;}
	
	.leftActivity{float:left; margin-right:7.4px; width:69px;}
	.rightActivity{float:left; min-width:200.26px;}
	#content #main h3.titleActivity {font-size: 1.000em;}
	
	#main #menuLeft{width:57%; overflow-y: scroll; height:50px; margin-bottom:5%;  margin-top: 3%;}
	#main #labelMenuLeft{display:block;  margin-top: 5%;}
	#leftMain #headerPartner{margin-top:0%;}
	p.namePartnerHeaderPartner{width: 55%;word-wrap: break-word;}*/
}

/* WIDE MOBILE LAYOUT (LANDSCAPE/480PX) */
@media only screen and (min-width: 480px) and (max-width: 767px) {
	/*body {	width: 480px;}
	#container {	width: 100%;}
	#header #logos{padding:0 3.5% 0 3.8%; width:auto;}
	#header #menu{padding:0 3.5% 0 3.8%; font-size:0.613em;}	
	#menu ul li {padding: 5px 16px;}
	#menu .selected {border-radius: 20px 20px 20px 20px;}
	#content #main {	width:93%; margin:0 3.5% 0 3.8%;}
	#main .heightHome{height:auto; overflow:hidden;}
	#main #leftMain{width:100%; }
	#leftMain .contentNew {width:100%;}
	#main #rightMain{width:100%;}
	
	.leftActivity{float:left; margin-right:15px; width:101px;}
	.rightActivity{float:left; min-width:309px;}
	
	#main #menuLeft{width:57%; overflow-y: scroll; height:50px; margin-bottom:5%;  margin-top: 3%;}
	#main #labelMenuLeft{display:block;  margin-top: 5%;}
	#leftMain #headerPartner{margin-top:0%;}
	p.namePartnerHeaderPartner{width: 55%;word-wrap: break-word;}*/
} 

@media print { 	
	/*#header, #footer, #menu { display: none; } */
	/*body { font: 12pt Arial, sans-serif; } 
	h1 { font-size: 18pt; } 
	h2 { font-size: 16pt; color: #000; }
	blockquote, ul {margin: 0;}
	ul {list-style: none}
	li {content: "» ";}
	p a {word-wrap: break-word;}
	#main #menuLeft{display:none;}*/
}

/* ----------------------------------------- GRAPH --------------------------------------------- */
#header #logosGraph{	height:auto; width:90%; padding:0 5% 0 5%;	border-bottom:1px solid #e4e4e4; overflow:hidden; }
#content.contentGraph {	min-height:650px;}
#content #main.mainGraph {	width:90%; margin:0 5% 0 5%; min-height:650px;}
#contentFooter .textFooterGraph{font-size:0.7em; padding:10px 0px; margin:0 5% 0 5%; text-align:justify;}
#main p.buttonsGraph{cursor:pointer; border:2px solid #ddd; border-radius:3px; width:45px; text-align:center; float:right; margin-right:15px; font-size: 11px; margin-top: 10px;}
#header #menu.menuGraph{padding: 0 4%;}

#menu.menuGraph ul li {margin:0px 12px; }

#main #topGraph{float:left; overflow: hidden; width:780px;/*1152px;*/}
#topGraph #menuLeft{font-size:0.7em; margin-top:28px; padding-right:10px; text-align:left; margin-bottom:0px; padding-top: 0;}
#menuLeft #headerTopGraph{float:left; margin-bottom:20px; margin-top:10px; padding:5px; background-color: #e4e4e4; width: 110px;/*150px;*/}
#headerTopGraph span{font-size:11px;}
#menuLeft p{margin-bottom:15px; text-align:left;}

#topGraph #contentTextLength{display:none; font-size:10px; font-family:Verdana; float:left;}

#topGraph #leftMain{width:639px; /*970px;*/ margin-bottom:0px; margin-top: 28px;}
#leftMain #boxExpandTop{position:relative; float:left; border:1px solid #c9c9c9; font-size: 22px; left: 1px; top: 305px;  background: #fff; cursor:pointer; border-radius: 2px; color:#c9c9c9; z-index: 9999999;}
#leftMain .contentPartnerGraph{padding:0px; border-left:2px solid #c9c9c9; float:left; /*margin-right:12px;*/ border:1px solid #c9c9c9; margin-top:0px; background:#fff; }
#leftMain .contentPartnerGraph .headerNameGraph{float:left; width:608px; /*935px;*/ margin-top:10px; padding: 5px; background-color: #e4e4e4; font-size:11px; margin-left:10px; margin-right:10px;}
.headerNameGraph span{color: #2b7ec2;}
#leftMain .contentPartnerGraph .headerFiltersGraph{float:left;  width:639px; /*955px;*/}
.headerFiltersGraph .filtersGraph{float:left; width: 590px;/*700px;*/ height: 28px; }
.filtersGraph .contentFilters{float:left; font-size:9px; margin-top:3px; }
.filtersGraph .contentFilters .itemFilter{float:left; margin:0 0 0 10px; padding:2px;}
.itemFilter:active{box-shadow: 0 5px #fff; transform: translateY(4px);}
.filtersGraph .contentFilters .typeSelected{border-top:1px solid #fff; border-bottom:1px solid #fff; border-left:1px solid #e3e3e3; border-right:1px solid #e3e3e3;}
.filtersGraph .contentFilters .typeSelected:hover{opacity:1; background-color:#fff; border:1px solid #e3e3e3;}
input[type=checkbox] {    
  transform: scale(0.8);/* All browsers except webkit*/
  -webkit-transform: scale(0.8); /* Webkit browsers*/
}

.headerFiltersGraph .contentButtonsGraph{float:left; width: 255px; height: 28px; display:none;}
.contentButtonsGraph .buttonsGraph{float:right; position:relative; right:0px; top:0px;}
#leftMain .contentPartnerGraph #graph{width:639px;/*930px;*/  background-color:#fff; float:left; position:relative; top:12px;}
#graph > svg{width:639px;/*930px;*/ height:565px; vertical-align:center; float:left;}

#main #bottomGraph{float:left; width:350px;/*1127px;*/ border:1px solid #c9c9c9; padding: 10px; padding-top:0px; background-color: #fff; margin-top: 28px; height:629px;}
#bottomGraph #boxExpandBottom{position:relative; float:left;  font-size: 22px; left: 580px;   background: #fff; cursor:pointer; transform:rotateZ(90deg); -ms-transform:rotateZ(90deg); -webkit-transform:rotateZ(90deg); height: 29px; top: -9px; border:1px solid #c9c9c9; border-radius: 2px;  color:#c9c9c9; /*background:url('http://arcdev.housing.salle.url.edu/oikonet/public/img/flecha_arriba_oikonet.png') no-repeat; top:-1px; height:14px; width:28px;*/ } /*flechas con imagen --> cambiar el background image por css....*/
#bottomGraph .headerBottomGraph{float:left; width:340px; background-color:#e4e4e4; font-size:11px; padding: 5px; margin-top:10px; }
#bottomGraph #loaderAjax{display:none; position:relative; left:150px;}
#bottomGraph #dataNode{margin-top:30px; float:left; width:340px; /*1115px;*/ overflow-y: auto; overflow-x:none; max-height:560px; /*300px;*/ padding-right: 10px;}

#dataNode .iconPartner{max-width:40%; max-height:10%; border: 1px solid #e4e4e4; padding: 5px;}
.iconGraph{display:inline; margin-right:5px;}
#dataNode .imageContent{max-width:40%; max-height:10%; float:left; }
#dataNode .imageMarginLeft{ margin-left:20px;}
#dataNode span{font-size:11px;}
#main p.fontSizeText{font-size:11px;}
#dataNode .headerPartnerDataNode{margin-bottom:10px; margin-top:10px;}
#main p.marginLeft{margin-left:20px;}
#main p.marginBottom{margin-bottom:10px;}

#loaderAjax_1{display:none; position:absolute; left:450px; top:400px; z-index:99999;}

/* ----------------------------------------- BACKOFFICE ----------------------------------------- */
#menuBackoffice{float:left; width:99%; list-style:none; padding-left: 1%; background-color: #F1F1F1;}
#formsLayer{background-color:#eeeeee; margin-top:2%; width:100%;  text-align:center; color:#333333; border:1px solid #dcdcdc; overflow:hidden; margin-bottom:10%;}
#formsLayer #formLayout{text-align:left; padding:3%; max-width:94.5%; min-width:94.5%; overflow:hidden; }
#formLayout #login{width:60%; margin-left:25%;}
#formLayout #insert{width:100%; }
#login .itemForm{width:80%;}
.itemForm{margin-bottom:1%; height:auto; overflow:hidden; font-size:1.000em;}
.labelForm{float:left; margin-left: 3%;}	
.labelForm_2{float:left; margin-left: 1%;}	
input[type="text"], input[type="password"], input[type="file"]  {float:right; margin-bottom:1%; width:65%; margin-right: 10%;}
input[type="checkbox"] {float:left; margin-bottom:1%; margin-left:16%;}

#error{background-color:white;color:#ff4a4a;display:none; padding:0 2px 0 2px; float:left; width:250px;}

.button{font-size:0.7em; color:#595959; padding:0.5%; cursor:pointer; font-weight:bold;}
.buttonMain{float:left; margin:1% 1% 1% 0%;}
.buttonGeneral{  color:#4ac; background-color:#fff;  border: 1px solid #DDDDDD; font-weight: normal;}
.buttonInsert{float:right; margin:2% 0% 2% 0%;}
.buttonRight{float:right;}

#formsLayer #formLayout input[type="submit"] {width:20%;  float:left; margin-left:35%; margin-top:6%; }

#content .textTitle{font-size:0.875em; font-weight:bold; margin-top:5%; width:100%; float:left; margin-bottom: 1%; }
#adminNews{width:auto; min-height:30%;}

.contentList{float:left; width:100%;}
.listNew{float:left; width:100%; margin-bottom: 1.5%;}
.listDate{width:10%; float:left;}
.listTitle{width:50%; float:left; min-height:5%;}
.acronym{width:15%; float:left; min-height:5%;}
.listAuthor{width:15%; float:left;}
.listType{width:7%; float:left;}
.listSubnet{width:7%; float:left;}
.listEdit{width:5%; float:left;}
.listDelete{width:5%; float:left;}
span.date{font-size:0.75em;}
span.title{font-weight:bold; font-size:0.75em}
span.author{font-size:0.75em}
span.type{font-size:0.75em}
span.edit{font-size:0.70em; text-decoration:underline; cursor:pointer;}
span.delete{font-size:0.70em; text-decoration:underline; cursor:pointer;}

.imgFormulari{float: left; margin-left: 17%; margin-bottom:1%;}
/*
::-webkit-scrollbar {    width: 12px; }  
::-webkit-scrollbar-track {      background-color: #eaeaea;      border-left: 1px solid #ccc;  }  
::-webkit-scrollbar-thumb {      background-color: #ccc;  }  
::-webkit-scrollbar-thumb:hover {      background-color: #aaa;  } 
*/