/* ********************************************************************** */
/*  CUSTOM CSS WITH RESPONSIOVENESS AND CUSTOM ELEMENTS FCE ETC...
/* ********************************************************************** */

/***** lot of important styles moved at end as they conflicted with responsve layout, bring them back to top*/

/* ********************************************************************** */
/* NON RESPONSIVE LAYOUT: ONLY CONTENT
/* ********************************************************************** */


/* ********************************************************************** */
/*  Main Navigation : mostly inline through Jquery
/* ********************************************************************** */
#main_navigation {   margin-top: 110px;  display: block; width: 60%;  z-index: 1;}

/* ********************************************************************** */
/*  LIGHT and DARK BG: To come at end as to OVERRIDE?
/* ********************************************************************** */

.standard_content_style  .light {  background-color: white; padding: 20px 250px 20px 250px;margin-top: 50px;}
.standard_content_style  .dark {  background-color: #E2E2E2; padding: 20px 250px 20px 250px;margin-top: 30px;}

.standard_content_style  .light h1{  text-align: center;}
.standard_content_style  .dark h1{  text-align: center;}


/* ********************************************************************** */
/* RESPONSIVE LAYOUT: IMAGES AND CONTENT
/* ********************************************************************** */




@media only screen  and (min-width : 1281px) {
    #main_navigation { margin-top: 110px;  display: block; width: 60%; background-color: white;   z-index: 1;}
    .flexslider .slides li {background-color: white;}
    .flexslider .slides img {margin:auto; padding:auto;}
    .flex-control-nav {padding-right:200px;}
}

@media only screen and (min-width: 959px) and (max-width: 1281px) {
    #main_navigation { margin-top: 110px;  display: block; width: 60%; background-color: white;   z-index: 1;}
}


@media only screen and (min-width: 768px) and (max-width: 1024px) {   
    #navigation_box {height: 215px;}
}

@media only screen and (max-width: 1024px) {   
    .speakers {padding: 0px; }
}

@media only screen and (max-width: 600px) {   
    #scrollbar a.left {display: none;}
    #scrollbar a.right {display: none;}
    .speakers .speaker_item img {height: 100px;}
}

@media only screen and (min-width: 768px) and (max-width: 959px) {          
    #main_navigation {  background-color: #E9E9E9;   width: 780px;     padding-left: 42px;  padding-top: 10px;}
    .standard_content_style .light { padding: 0px;}
    .standard_content_style .dark {  padding: 0px;}
}

/* Smaller than standard 960 (devices and browsers) */
@media only screen and (max-width: 959px) {    
    #main_navigation {   margin-top: 0px; width: 100%; margin-left: 0px;}       
    footer #sitemap_box nav.sitemap ul#footer_sitemap li.sitemap_nav_1{display:block; margin-bottom: 10px;}               
    .standard_content_style .light { padding: 0px;}
    .standard_content_style .dark { padding: 0px;}
}


/* All Mobile Sizes (devices and browser) : Smaller than 767 */
@media only screen and (max-width: 767px) {
    #main_navigation { margin-top: 1px;  width: 100%; margin-left: 0px;   display: table;}
    #main_navigation { float: none; margin-left: 0px; }
    #navigation_box{height: auto;} /*important for responsive menu*/
    .standard_content_style .light { padding: 0px;}
    .standard_content_style .dark { padding: 0px;}
    #post_banner {display: none; }
    #top_menu #social_menu{margin-left:0px;}
    .popupContactButton {margin-left:0px; margin-right:0px;}
    #top_menu #language_menu{margin:0px;}
    #navigation_box #logo {padding-top: 125px;}
    .flexslider .slides li canvas {display: none;}
    .flexslider .slides .flex-caption-top {  margin-left: 0px; padding: 10px; font-size: 12px; line-height: 18px; opacity: 0.9; margin-bottom: 100px; padding-left: 50px; background-color: #A0C63C; background-image: none;}
    .flex-control-nav {display: none;}
    .flexslider .slides li span {left:0;}
    .standard_content_style .green_table table td.col3_special_empty {padding-right: 0px;}
    .standard_content_style .green_table table td.col3_special {padding-right: 0px;} 
    .speakers{  overflow: hidden; }
    #navigation_box {background-image: none;}
    #top_menu #useful_links_menu {margin-left: 20px; margin-right:0px; } 
    #top_menu #social_menu{margin: 0px; }
    #top_menu #language_menu {margin-left: 65px; }
    #top_menu {padding-top: 52px; height: 40px; position: absolute; }
    .navbar-default .navbar-collapse, .navbar-default .navbar-form {border-color: transparent; }
     #top_menu {padding-top: 64px; height: 106px; background-color: whitesmoke;     width: 100%;}
    .navbar-header {background-color: whitesmoke;    }
}


@media only screen and (max-width: 479px){
    #top_menu{display: none;}
 #top_menu #social_menu{float: none; }
 #navigation_box #logo {margin-left: 0px;padding-top: 140px;}
 .navbar-toggle {float: left; } 
#top_menu_compact {display: block; position: absolute; width: 100%; margin-top: 65px;    text-align: center; background-color: whitesmoke; }
#top_menu_compact a{ margin-right: 5px;}
#top_menu_compact span{margin-right: 5px; }

#top_menu_compact .popupContactButton {    margin-right: 3px; color: #9d9fa4;}
 }


/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
@media only screen and (max-width: 479px) {
    #top_menu #language_menu{margin:0px;}
    .popupContactButton {margin-left:0px; margin-right:0px;}
}

@media only screen and (min-width: 900px) and (max-width: 1200px){
    #top_menu #useful_links_menu {margin-left: 0px; } 
    #top_menu #social_menu{margin-left: 0px; }
}

@media only screen and (min-width: 767px) and (max-width: 900px){
    #top_menu #useful_links_menu {margin: 0px; }
    #top_menu #social_menu{margin: 0px; }
    #top_menu #language_menu {margin-left: -80px; }
    #navigation_box {background-position: 160px 0px; }
}


@media only screen and (max-width: 1200px) {
    #scrolling_image{height: 0px;}
}



/* Large devices */
@media only screen and (min-width: 1400px) {
    #post_banner {display: none;}
    #navigation_box {    background-color: white;
    padding: 0px 250px 0px 250px;}
    #navigation_box {   
    background-position: 480px 0px;
}
}

@media only screen and (min-width: 1600px) {
    .flexslider .slides li canvas {margin-right:300px;}
    .flex-control-nav {padding-right:400px;}
    .flexslider .slides li span {margin-right: 400px;}
}


/* highres devices */
@media screen and (-moz-min-device-pixel-ratio:1.5),
screen and (-o-min-device-pixel-ratio:3/2),
screen and (-webkit-min-device-pixel-ratio:1.5),
screen and (min-device-pixel-ratio:1.5){}

img, embed, object, video {
    max-width: 100%;
    height: auto;
    width: auto;
}

DIV.csc-textpic-above DIV.csc-textpic-imagewrap,
DIV.csc-textpic-below DIV.csc-textpic-imagewrap,
DIV.csc-textpic DIV.csc-textpic-imagewrap UL LI,
DIV.csc-textpic DIV.csc-textpic-imagewrap DL.csc-textpic-image {
    float: none;
}


#about img{

    width: 196px;
}