/* For devices with narrow screens, phones, tablets, etc. */
/*  * 1625px and above huge screens * */
/*  * 600px and below-common things for 480px, 600px, and below .. IE 9 ignored this if it had 'only screen' in the query   * */
/*  * iPad in landscape mode * */
/*  * iPad in portrait mode * */
/*  * iPhone in landscape mode * */
/*  * iPhone in portrait mode * */

/*  *  1625px and above huge screens * */
@media screen and (min-width : 1024px)  {

body {
background: url(imagesui/fond.jpg)  #FFF no-repeat center top; 
-webkit-background-size:100%;
-moz-background-size:100%;
-o-background-size:100%;
background-size:100%;
}

#portal-top,#portal-header {
z-index:auto;
}

#portal-column-content {
background:white;
top:-30px;
}

#portal-logo {
margin:0.7em 0;
}

#logo {
z-index:999;
margin-left:none!important;
width:auto;
}

#slogan {
background:#000;
color:#FFF;
position:absolute;
top:90px;
left:13em;
font-size:90%;
padding:0.1em;
left: 144pt;
opacity: 0.7;
}

a.advanced-search {
background:#000;
color:#FFF!important;
font-size:80%;
padding:0.2em;
opacity: 0.7;
display:inline-block;
}


#partenaires {
position:absolute;
right:12em;
}

#partenaires img {
margin:0.3em 0.3em 0 0;
vertical-align:middle;
}

.nav-primary {
z-index:1;
height:160px;
background: url(imagesui/fond-primary-nav.png) no-repeat center top; 
}

#portal-globalnav {
background:white;
background:-webkit-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,0) 144.9pt,rgba(255,255,255,1) 145pt);
background:   -moz-linear-gradient(to right,rgba(255, 255, 255, 0) 0%,rgba(255, 255, 255, 0) 144.9pt, white 145pt);
background:     -o-linear-gradient(to right,rgba(255, 255, 255, 0) 0%,rgba(255, 255, 255, 0) 144.9pt, white 145pt);
background:        linear-gradient(to right,rgba(255, 255, 255, 0) 0%,rgba(255, 255, 255, 0) 144.9pt, white 145pt);
top:-90px;
padding-left:17em;
}

#portal-globalnav>li {
padding: 0.5em 0.5em 0.7em 0.8em;
background:url(imagesui/icone-menu.png) left 4px no-repeat;
margin-top:-16px;
-webkit-transition:background 0.5s;
-moz-transition:background 0.5s;
-o-transition:background 0.5s;
transition:background 0.5s;
}

#portal-globalnav>li:hover {
background:url(imagesui/icone-menu.png) 0 10px no-repeat;
}

#portal-globalnav li a {
padding: 0.5em;
border:none;
color:#e44325;
background:none;
position:relative;
top: 10px;
}

#portal-globalnav li a:hover {
color:#741900;
background:none;
}

#portal-globalnav .submenu li {
background:#e44325;
}

#portal-globalnav .submenu li a {
color:#FFF !important;
background:#e44325;
width:12em!important;
border:none;
border-top:1px solid white;
top:0;
}

ul.submenu {
z-index: 1;
}

#portal-globalnav .submenu li:first-child a {
border-top:none;
}

#portal-globalnav .submenu li a:hover {
color:#FFF;
background:#c1290b;
display:block;
}

#portal-globalnav li.selected {
background:url(imagesui/icone-menu-noir.png) left 4px no-repeat;
}

#portal-globalnav .selected a,#portal-globalnav .selected a:hover {
color:#000;
background:none;
}

#portal-searchbox {
position: absolute;
right: 0;
top: 60px;
} 

#portal-personaltools {
background:#FFF;
}

#portal-column-content {
background:#EBEBEB;
border:0.5em solid white;
}

#portal-column-two {
background:#EBEBEB;
border:0.5em solid white;
top:-30px;
}

div#portal-column-content.width-full {
width:96.25%;
}

#content {
background:white;
margin: 1em;
padding: 1em;
}

.collage-item {
background:white;
/*border:1px solid #bfbfbf;*/
}

.portletgeoconfluencesCollectionPortlet .portletHeader {
height:auto;
}

.portletgeoconfluencesCollectionPortlet .portletFooter {
display:none;
}

.portletgeoconfluencesCollectionPortlet {
margin-bottom:0!important;
}

.portletTopLeft {
display:none!important;
}

.portletHeader span {

}

.portletHeader a {
border:none !important;
color:#00ce00 !important;
}

.portletHeader span.portletTopRight  {
display:none;
}

#portal-breadcrumbs {
padding:0.8em;
}

.theme-default .nivoSlider {
margin-bottom:0!important;
box-shadow:none!important;
float:left;
margin-top:-34px;
margin-top:0;
}

.theme-default .nivo-controlNav {
background:#0f110f;
clear:left;
}

.slider-wrapper.theme-default {
margin:0;
padding:0;
}

.portletNavigationTree li.navTreeItem,.portletCollection dd.portletItem {
clear:left;
}

.documentActions li {
clear:left;
}

.section-collage-accueil #collage .two-columns-equal .block_1 {
width:59.49%;
}

.section-collage-accueil #collage .two-columns-equal .block_2 {
width:39.49%;
}

div.width-1\:4 {
width:21.15%;
}

div.row {
width:95%;
left:2.6%;
}


} /*  *  END 1024px and above huge screens * */

@media screen and (min-width : 801px) and (max-width : 1023px)   {

body {
background: url(imagesui/fond.jpg)  #FFF no-repeat center top; 
}

#portal-top {
background:rgba(0,0,0,0.1);
}

#partenaires {
position:relative;
left:200px;
top:10px;
width:200px;
}

#partenaires img {
margin-top:15px!important;
}

#logo img {
width:130px;
}

#slogan {
position:absolute;
top:50px;
right:5px;
background:#000;
color:#FFF;
font-size:90%;
padding:0.3em;
opacity: 0.7;
}

#portal-personaltools {
background:#FFF;
}

#portal-searchbox {
margin-top:8em;
}

#portal-column-content {
background:#EBEBEB;
border:0.5em solid white;
}

#portal-column-two {
background:#EBEBEB;
border:0.5em solid white;
width:21%;
}

#content {
background:white;
margin: 1em;
padding: 1em;
}

div#portal-column-content.width-full {
width:96%;
}

#portal-breadcrumbs {
padding:0.8em;
}

#portal-globalnav {
background:white;
border-radius:5px 5px 0 0;

}

#portal-globalnav>li {
padding: 0.5em 0.5em 0.7em 1em;
padding-top:15x;
margin-top:-16px;
-webkit-transition:background 0.5s;
-moz-transition:background 0.5s;
-o-transition:background 0.5s;
transition:background 0.5s;
}

#portal-globalnav>li:hover {
}

#portal-globalnav li a {
padding: 0.5em;
border:none;
color:#e44325;
background:none;
position:relative;
top: 10px;
}

#portal-globalnav li a:hover {
color:#741900;
background:none;
}

#portal-globalnav .submenu li {
background:#e44325;
}

#portal-globalnav .submenu li a {
color:#FFF !important;
background:#e44325;
width:12em!important;
border:none;
border-top:1px solid white;
top:0;
}

ul.submenu {
z-index: 1;
}

#portal-globalnav .submenu li:first-child a {
border-top:none;
}

#portal-globalnav .submenu li a:hover {
color:#FFF;
background:#c1290b;
display:block;
}

/* dernier menu déroulant aligné à droite */
#portaltab-a-propos ul.submenu {
position:absolute;
right:0;
left:auto;
top:100%;
}



#portal-globalnav .selected a,#portal-globalnav .selected a:hover {
color:#000;
background:none;
}

.portletgeoconfluencesDossiers #dossiers_thematiques, .portletgeoconfluencesDossiers #dossiers_regionaux {
height:200px;
}
.portletgeoconfluencesDossiers #dossiers_thematiques p, .portletgeoconfluencesDossiers #dossiers_regionaux p {
display:none;
}

.portletgeoconfluencesRandomDossier dd.portletItem {
display:inherit!important;
}

}

/*  *  800px and below * */
@media screen and (min-width : 601px) and (max-width : 800px) {
body {
background: url(imagesui/fond.jpg)  #FFF no-repeat center top; 
}

#portal-top {
background:rgba(0,0,0,0.1);
}

#partenaires {
display:none;
}

#partenaires img {
margin-top:15px!important;
}

#logo img {
width:130px;
}

#slogan {
position:absolute;
top:50px;
right:5px;
background:#000;
color:#FFF;
font-size:90%;
padding:0.3em;
opacity: 0.7;
}

#portal-personaltools {
background:#FFF;
}

#portal-searchbox {
margin-top:8em;
}

#portal-column-content {
background:#EBEBEB;
border:0.5em solid white;
}

#portal-column-two {
background:#EBEBEB;
border:0.5em solid white;
width: 20.5%;
}

#content {
background:white;
margin: 1em;
padding: 1em;
}

div#portal-column-content.width-full {
width:95.25%;
}

#portal-breadcrumbs {
padding:0.4em;
}

#portal-globalnav {
background:white;
border-radius:5px 5px 0 0;

}

#portal-globalnav>li {
padding: 0.5em 0em 0.7em 0em;
background:none;
padding-top:15x;
margin-top:-16px;}



#portal-globalnav li a {
padding: 0.5em 0.4em;
border:none;
color:#e44325;
background:none;
position:relative;
top: 10px;
min-width:0;
border-right:1px solid lightgrey;
}

#portal-globalnav li a:hover {
color:#741900;
background:none;
}

#portal-globalnav .submenu li {
background:#e44325;
}

#portal-globalnav .submenu li a {
color:#FFF !important;
background:#e44325;
width:12em!important;
border:none;
border-top:1px solid white;
top:0;
}

ul.submenu {
z-index: 1;
}

#portal-globalnav .submenu li:first-child a {
border-top:none;
}

#portal-globalnav .submenu li a:hover {
color:#FFF;
background:#c1290b;
display:block;
}

/* dernier menu déroulant aligné à droite */
#portaltab-a-propos ul.submenu {
position:absolute;
right:0;
left:auto;
top:100%;
}

#portal-globalnav .selected a,#portal-globalnav .selected a:hover {
color:#000;
background:none;
}

.portletgeoconfluencesDossiers #dossiers_thematiques, .portletgeoconfluencesDossiers #dossiers_regionaux {
height:200px;
}
.portletgeoconfluencesDossiers #dossiers_thematiques p, .portletgeoconfluencesDossiers #dossiers_regionaux p {
display:none;
}

.section-collage-accueil .row_1 .block_1 {
width:auto!important;
}

.section-collage-accueil .row_1 .block_2 {
width:auto!important;
float:none!important;
padding-left:0!important;
}
.portletgeoconfluencesRandomDossier dd.portletItem {
display:inherit!important;
}

.section-informations-scientifiques #portlets-below .BelowPortletManager3.width-1\:4,
.section-informations-scientifiques #portlets-below .BelowPortletManager2.width-1\:4,
#portlets-below .BelowPortletManager2.width-1\:3,
#portlets-below .BelowPortletManager3.position-2\:3 {
clear: left!important;
margin-left: -100%!important;
width: 100%!important;
}


}


/*  * 600px and below-common things for 480px, 600px, and below .. IE 9 ignored this if it had 'only screen' in the query * */
@media screen and (max-width: 600px) {
    /* reset the min width to be 320px */
    body { min-width: 320px !important;}
    #visual-portal-wrapper { width: 100% !important;}
    div#logo {
        position: absolute;
        top: 15px !important;
        display: inline-block;
        }
   #portal-logo {
       margin-left: 30px;
       display: inline-block;
       clear: both;
       margin: 0px;}
       
   #portal-logo img { max-width: 300% !important; height: auto;}
    /* make width 100% instead of the stock 97.75% */

        
    /* start position-0 at absolute left */
    div.position-0 {
        margin-left: -100%;
        }

    /* get rid of whatever width is set on visual-portal-wrapper so it expands whole device width */
    #visual-portal-wrapper {
        border: none;
        -webkit-box-shadow: none;
        box-shadow: none;
        }
        
    /* move columns to below main content */    
    #portal-column-two, #portal-column-one {
        clear: both;
        margin-left: -99% !important;
        width: 100% !important;
        margin:1em 0px;
        width: 95% !important;
        } 
        
    /* spread out the content */
    div#portal-column-content {
        width: 94%;
        margin-left: -99%;
        }
        
    dl#portal-personaltools {
        margin-right: 34px;
        float: right;
        }
       
    /* move search box to the center and expand its width */   
    #portal-searchbox {
        margin: 125px 17% 0 17% !important;
        width: 60%;
        font-size: 0.7em !important;
        clear: both !important;
        float: left !important;
        }
    
    #searchGadget {
        width: 81%;
        }
    .searchform #searchString { width: 211px; }
    
    #portal-personaltools {
       font-size: 70%;
       }

   /* global navigation needs to reconfigure itself to be vertical */
  #portal-globalnav {
        margin-left: 0px !important;
        }
                
    ul#portal-globalnav {
        padding: 0px;
        background: none!important;
        width: 100% !important;
        }
        
    ul#portal-globalnav:before { 
        display: block;
        margin-top: 20px;
        font-size: 2em; 
        }
         
    #portal-globalnav {
        height: auto;
        clear: both;
        padding: 0px;
        margin: 7px auto;
        width: 100% !important;
        }
        
    #portal-globalnav li {
        display: list-item !important;
        margin-top: 5px;
        border-top: 1px solid #E7E7E7;
        border-bottom: 1px solid #E7E7E7;
        background-color: white;
        width: 100%;
        }
   .nav-menu .nav-primary.expanded #portal-globalnav li, .nav-menu .nav-primary #portal-globalnav li.navigation-pulldown { display: list-item !important; }
   .nav-menu .nav-primary #portal-globalnav li { display: none !important; }
   #portal-globalnav li.navigation-pulldown {
       padding: 0.5em 1em 2em;
       background-color: #E3E3E3;
       }
       
   #portal-globalnav li a {
        padding: 13px 13px 13px 20px;
        display: block !important;
        text-align: center!important;
        }


/* luke w says breadcrumbs are not found in mobile designs */    
    #portal-breadcrumbs {
        display: none; 
        }
        
 /* make the content font-size bigger */
   #content {
       font-size: 0.9em;
       } 
   #content h1 { font-size: 1.4em;}
   #content h2 { font-size: 1.2em;}
   div#footer {
       width: 99%;
       }   

body {
background: url(imagesui/fond.jpg)  #FFF no-repeat center top; 
}

#portal-top {
background:rgba(0,0,0,0.1);
}

#partenaires {
display:none;
}

#partenaires img {
margin-top:15px!important;
}

div#logo {
margin-left: -70%;
}

#logo img {
width:130px;
}

#slogan {
display:none;
}

#portal-personaltools {
display:none;
}

#portal-searchbox {
margin-top:8em;
text-align:center;
}

#portal-column-content {
background:#EBEBEB;
border:0.5em solid white;
}

#portal-column-two {
background:#EBEBEB;
border:0.5em solid white;
}

#content {
background:white;
margin: 1em;
padding: 1em;
}

div#portal-column-content.width-full {
width:93%;
}

#portal-breadcrumbs {
padding:0.4em;
}

#search-exist > div {
display: table;
}

#search-exist .criteresSearch {
display: table-footer-group;
float: inherit;
width: auto;
}

/* les blocs du collage sont mis à la ligne les uns après les autres */
#collage .two-columns-equal .block_1,#collage .two-columns-equal .block_2 {
width:auto!important;
padding-left:0!important;
float:none!important;
}

.section-collage-accueil .collage-row + .collage-row + .collage-row {
top:0!important;
}

.coin_dossier {
display:none;
}

.portletgeoconfluencesDossiers #dossiers_thematiques, .portletgeoconfluencesDossiers #dossiers_regionaux {
height:100px;
}
.portletgeoconfluencesDossiers #dossiers_thematiques p, .portletgeoconfluencesDossiers #dossiers_regionaux p {
display:none;
}

.theme-default .nivoSlider {
height:auto!important;
}

.portletgeoconfluencesDossiers h3 {
font-size:90%;
}

.portletgeoconfluencesRandomDossier dd.portletItem {
display:inherit!important;
}

.section-informations-scientifiques #portlets-below .BelowPortletManager3.width-1\:4,
.section-informations-scientifiques #portlets-below .BelowPortletManager2.width-1\:4,
#portlets-below .BelowPortletManager2.width-1\:3,
#portlets-below .BelowPortletManager3.position-2\:3 {
clear: left!important;
margin-left: -100%!important;
width: 100%!important;
}

#viewlet-above-content #portlets-above {
padding:0.5em 1em;
font-size:80%;
}

} /*  * END 600px and below  * */


@media screen and (max-width: 486px) {
    div.row #portal-searchbox {
    margin: 125px 17% 0 !important;
    }
}

/*  *iPad in landscape mode * */
@media screen and (orientation:landscape) and (max-device-width: 1024px) {
    body {
        font: 1em!important;
    } 
    #visual-portal-wrapper {
 		width: 100% !important;
 		margin: 0 !important;
 	}
    #portal-columns {
       font-size: 1.7em;
       }
     #portal-logo a#logo-site { padding-top: 2%;}

}

/*  * iPad in portrait mode * */
@media screen and (orientation:portrait) and  (max-device-width: 768px) {
   #visual-portal-wrapper {
 		width: 100% !important;
 		margin: 0 !important;
	}
	#portal-columns {
       font-size: 1.7em;
       }
    #portal-logo a#logo-site { padding-top: 2%;}
    
} /*  * END Pad in landscape mode * */



/*  * iPhone * */
@media screen and (orientation:landscape) and (max-device-width: 480px), screen and (orientation:portrait) and  (max-device-width: 320px) {
/** it seems when changing the orientation on the iphone it loses things like globalnav being display block. Have to reset some css that should of been used from before **/
   body { display: inline !important; }
   /* global navigation needs to reconfigure itself to be vertical */

     #portal-logo {
        display: inline-block;
        } 
     div#logo {
        position: absolute;
        top: 15px !important;
        display: inline-block;
        }
   #portal-logo {
       clear: both !important;
       margin: 0;
       display: inline-block;
       width: 80% !important;
       }     
   #portal-logo img { max-width: 300% !important; height: auto;}  
   #portal-searchbox { margin-top: 75px !important; }     
   #portal-globalnav { margin-left: 0px !important; }
                
   ul#portal-globalnav {
        padding: 0px;
        background-color: transparent;
        width: 100% !important;
        }
        
     ul#portal-globalnav:before { 
        display: block;
        margin-top: 20px;
        font-size: 2em; 
        }
        
    #portal-globalnav {
        height: auto;
        clear: both;
        padding: 0px;
        margin: 7px auto;
        width: 100% !important;
        }
        
   #portal-globalnav li {
        display: inline-block !important; 
        margin-top: 4px;
        border-top: 1px solid #E7E7E7;
        /* border-bottom: 1px solid #E7E7E7; */
        background-color: white;
        width: 100%;
        }

        
    #portal-globalnav li a {
        padding: 13px 13px 13px 20px;
        display: block !important;
        }
    
    .field input[type="text"][size] {
        width: 10em;
        } 

input[type='text'],input[type='number'],textarea,input[type="text"]:focus {font-size:16px!important;background:white;}


.portletgeoconfluencesDossiers h3 {
font-size:80%!important;
}

} /*  * END iPhone * */


/* iphone 3 à 4S portrait */

@media screen and (orientation:landscape) and (max-device-width: 480px) {
#slogan {
display:none;
}

#portal-searchbox {
float:right!important;
}

#portal-globalnav {
margin-left: 0px !important;
}
                
ul#portal-globalnav {
padding: 0px;
background:#E44325!important;
width:100% !important;
}
        
ul#portal-globalnav:before { 
display: none;
}
         
#portal-globalnav {
height:auto;
clear: both;
padding: 0px;
margin: 3px auto;
width:100% !important;
}
        
#portal-globalnav li {
display: inline !important;
margin-top: 2px;
border-bottom:none;
background-color: #E44325;
width:20%;
text-overflow:ellipsis;
white-space:nowrap;
overflow: hidden;
padding:0 0 0.2em 0!important;
border:none!important;

}

#portal-globalnav li a {
text-overflow:ellipsis;
white-space:nowrap;
overflow: hidden;
font-size:80%;
position:0px!important;
border:none!important;
color:white!important;
}

ul.submenu {
display:none;
}

/* les blocs du collage sont mis à la ligne les uns après les autres */
#collage .two-columns-equal .block_1,#collage .two-columns-equal .block_2 {
width:auto!important;
padding-left:0!important;
float:none!important;
}

.section-collage-accueil .collage-row + .collage-row + .collage-row {
top:0!important;
}

.portletgeoconfluencesDossiers #dossiers_thematiques, .portletgeoconfluencesDossiers #dossiers_regionaux {
height:100px;
}
.portletgeoconfluencesDossiers #dossiers_thematiques p, .portletgeoconfluencesDossiers #dossiers_regionaux p {
display:none;
}

.theme-default .nivoSlider {
height:auto!important;
}

.portletgeoconfluencesDossiers h3 {
font-size:90%;
}

h2.titre_dossier {
font-size:1.2em;
}

.portletgeoconfluencesRandomDossier dd.portletItem {
display:inherit!important;
}

.section-informations-scientifiques #portlets-below .BelowPortletManager3.width-1\:4,
.section-informations-scientifiques #portlets-below .BelowPortletManager2.width-1\:4,
#portlets-below .BelowPortletManager2.width-1\:3,
#portlets-below .BelowPortletManager3.position-2\:3 {
clear: left!important;
margin-left: -100%!important;
width: 100%!important;
}

#viewlet-above-content #portlets-above {
padding:0.5em 1em;
font-size:80%;
}

}

/* fin iphone paysage */

/* detection galaxy s2 paysage */
@media only screen 
and (min-device-width : 480px) 
and (max-device-width : 800px) 
and (orientation : landscape) {

#slogan {
display:none;
}

#portal-searchbox {
float:right!important;
}

#portal-globalnav {
margin-left: 0px !important;
}
                
ul#portal-globalnav {
padding: 0px;
background: white!important;
width:100% !important;
}
        
ul#portal-globalnav:before { 
display: none;
}
         
#portal-globalnav {
height:auto;
clear: both;
padding: 0px;
margin: 3px auto;
width:100% !important;
}
        
#portal-globalnav li {
display: inline !important;
margin-top: 2px;
border-top:none;
border-bottom:none;
background-color: white;
width:20%;
text-overflow:ellipsis;
white-space:nowrap;
overflow: hidden;
padding:0 0 0.2em 0!important;
}

#portal-globalnav li a {
text-overflow:ellipsis;
white-space:nowrap;
overflow: hidden;
font-size:80%;
position:0px!important;
}

ul.submenu {
display:none;
}

/* les blocs du collage sont mis à la ligne les uns après les autres */
#collage .two-columns-equal .block_1,#collage .two-columns-equal .block_2 {
width:auto!important;
padding-left:0!important;
float:none!important;
}

.section-collage-accueil .collage-row + .collage-row + .collage-row {
top:0!important;
}

.portletgeoconfluencesDossiers #dossiers_thematiques, .portletgeoconfluencesDossiers #dossiers_regionaux {
height:100px;
}
.portletgeoconfluencesDossiers #dossiers_thematiques p, .portletgeoconfluencesDossiers #dossiers_regionaux p {
display:none;
}

.theme-default .nivoSlider {
height:auto!important;
}

.portletgeoconfluencesDossiers h3 {
font-size:90%;
}

h2.titre_dossier {
font-size:1.2em;
}

.portletgeoconfluencesRandomDossier dd.portletItem {
display:inherit!important;
}

.section-informations-scientifiques #portlets-below .BelowPortletManager3.width-1\:4,
.section-informations-scientifiques #portlets-below .BelowPortletManager2.width-1\:4,
#portlets-below .BelowPortletManager2.width-1\:3,
#portlets-below .BelowPortletManager3.position-2\:3 {
clear: left!important;
margin-left: -100%!important;
width: 100%!important;
}

#viewlet-above-content #portlets-above {
padding:0.5em 1em;
font-size:80%;
}

}

/* fin galaxy s2 paysage */