/* media queries for small devices */
@media screen and (max-width: 479px) {
   .nav_pag_center_div {
      display: none;
   }
  


    .nav_pag_last_div {
        width: 60px;
        display: inline-block;
    }
    
    .nav_pag_next_div {
        width: 60px;
        display: inline-block;
    }
    
    .nav_pag_center_div {
        display: none;
    }

    .nav_pag_play_div {
        max-width: 60px;
        display: inline-block;
    }
    
    .nav_pag_first_div {
        width: 60px;
        display: inline-block;
    }
    
    .nav_pag_prev_div {
        width: 60px;
        display: inline-block;
    }
    
    #banner_img {
        width: 80%;
        height: auto;
        margin-top: 0px;
    }
    
    
    #social_div {
      min-height: 60px;
      padding-top: 10px;
      padding-left: 20px;
      text-align: left;
    }
    
    #social_div_e {
      min-height: 60px;
      padding-top: 10px;
      padding-left: 20px;
      text-align: right;
    }
    
    
    /* books */
    
    .book_box {
        border: 2px solid #FFFFFF;
        /* background-color: #d5d7e0; */
        margin: 5px;
        padding: 5px;
        width: 98%;
        height: auto;
        display: inline-block;
        text-align: right;
    }

    .book_box_e {
        border: 2px solid #FFFFFF;
        /* background-color: #d5d7e0; */
        margin: 5px;
        padding: 5px;
        width: 98%;
        height: auto;
        display: inline-block;
        text-align: left;
    }
    
    .book_pict {
        float: right;
        margin: 2px 5px;
        width: 40%;
        height: auto;
    }

    .book_pict_e {
        float: left;
        margin: 2px 5px;
        width: 40%;
        height: auto;
    }
    
    .book_desc {
        float: right;
        margin: 2px 5px;
        width: 50%;
        height: auto;
    }
    
    .book_desc_e {
        float: left;
        margin: 2px 5px;
        width: 50%;
        height: auto;
    }

    .book_desc_e H2, P {
        font-size: 12pt;
    }
    
/*    
    .book_desc2 {
        float: right;
        margin: 5px 5px;
        max-width: 600px;
        height: 150px;
        border: 2px solid red;
    }
    
    .book_desc2_e {
        float: left;
        margin: 5px 20px;
        max-width: 600px;
        height: 150px;
        border: 2px solid red;
    }
*/    
    .book_btns {
        float: right;
        margin: 2px;
        width: 50%;
        height: 40px;
    }

    .text_page {
        margin: 0 auto;
        padding: 10px;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 14pt;
        width: 100%; 
        COLOR: #333333; 
        background-color: #FFFFFF;
        border: 1px solid #e0e0e0;
        border-radius: 5px;
        -moz-border-radius: 5px;     
    }
    
    .video_page {
        margin: 0 auto;
        padding: 10px;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 14pt;
        width: 100%; 
        COLOR: #FFF; 
        background-color: #333333;
        border: 1px solid #FFF;
        border-radius: 5px;
        -moz-border-radius: 5px;     
    }
    

     .playlist ul li {
         font-size: 14pt;
         font-weight: bold;
     }

     .textlist ul li {
         font-size: 14pt;
         font-weight: bold;
     }

    .table-inshad {
        margin: 5px auto; 
        width: 100%;
    }

    .audio_box {
        border: 2px solid #FFFFFF;
        /* background-color: #d5d7e0; */
        margin: 5px;
        padding: 5px;
        width: 100%;
        max-height: 100px;
        text-align: center;
        border: 1px solid white;
        border-radius: 10px 10px;
    }
    
    .audio_title {
        margin: 0 auto;
        width: 100%;
        height: auto;
    }
    
    .audio_player {
        margin: 0 auto;
        width: 100%;
        height: auto;
    }
    
    
    /* talks */
    
    
    .talk_box {
        display: inline-block;
        width: 98%;
        height: auto;
        margin: 5px auto;
        border: 1px solid white;
        /* background: #C5DDED; */
        border-bottom-right-radius: 10px 10px;
        border-bottom-left-radius: 10px 10px;
        box-shadow: 5px 5px 5px #888888;
        text-align: right;
    }
    
    
    .talk_pict {
        width: 100px;
        float: right; 
        margin: 5px;
        padding: 5px; 
    }
    
    
    .talk_desc {
        width: 95%;
        height: auto;
        margin: 5px;
        padding: 5px; 
        /* background: #C5DDED; */
    }

    .talk_box_e {
        /* display: inline-block;*/
        width: 100%;
        height: auto;
        margin: 5px auto;
        border: 1px solid white;
        /* background: #C5DDED; */
        border-bottom-right-radius: 10px 10px;
        border-bottom-left-radius: 10px 10px;
        box-shadow: 5px 5px 5px #888888;
    }

    .talk_pict_e {
        display: block;
        width: 100px;
        margin: 5px 15px 5px 5px;
        padding: 5px; 
    }
    
    .talk_desc_e {
        display: block;
        width: 100%;
        height: auto;
        margin: 5px;
        padding: 5px; 
        /* background: #C5DDED; */
    }
    
    
    
    /* inshads */
    
    #inshad_menu {
        text-align: center;
        color: white;
    }
    
    .inshad_box {
        display: inline-block;
        width: 98%;
        height: auto;
        margin: 5px;
        border: 1px solid white;
        border-bottom-right-radius: 10px 10px;
        border-bottom-left-radius: 10px 10px;
        box-shadow: 5px 5px 5px #888888;
        text-align: right;
        /* background-color: #edd7ba; */
    }
    
    .inshad_box_e {
        display: inline-block;
        width: 98%;
        height: auto;
        margin: 5px;
        border: 1px solid white;
        border-bottom-right-radius: 10px 10px;
        border-bottom-left-radius: 10px 10px;
        box-shadow: 5px 5px 5px #888888;
        text-align: left;
        /* background-color: #edd7ba; */
    }
    
    .inshad_box_header {
        text-align: center;
        height: 70px;
        width: 95%;
        margin: 5px auto;
        padding:5px; 
        /* background-color: #bf9253; */
    }
    
    .inshad_box_body {
        text-align: center;
        width: 95%;
        height: 150px;
        margin: 5px auto;
        padding: 5px; 
        /* background-color: #fae8c7; */
    }
    
    .inshad_box_pict {
        text-align: center;
        width: 95%;
        height: 80%;
        margin: 5px auto;
    }
    
    .inshad_box_pict img {
        max-width: 280px;
        max-height: 100px;
        border: 2px solid white;
    }
    
    .inshad_box_footer {
        text-align: center;
        bottom: 2px;
        height: 50px;
        width: 95%;
        margin: 5px 7px;
        padding:5px; 
        border-bottom-right-radius: 10px 10px;
        border-bottom-left-radius: 10px 10px;
    }
    
    
    .inshad_box2 {
      border:2px solid #a1a1a1;
      background:#dddddd;
      width: 100%;
      border-bottom-right-radius: 10px 10px;
      border-bottom-left-radius: 10px 10px;
      box-shadow: 5px 5px 5px #888888;
    }
    
    .inshad_page
    {
        margin: 10px auto;
        width: 100%;
        padding: 5px 25px;
        font-size: 18px;
        background-color: #ffffff;
        border: 2px solid #90caf9;
        border-top-right-radius: 10px 10px;
        border-top-left-radius: 10px 10px;
        border-bottom-right-radius: 10px 10px;
        border-bottom-left-radius: 10px 10px;
    }
    
    #inshad_header {
        margin-top: 10px;
        background-color: #eeeeee;
        border: solid 1px #e0e0e0;
        border-top-right-radius: 5px 10px;
        border-top-left-radius: 5px 10px;
        text-align: center;     
    }
    
    #inshad_audio {
        margin-top: 10px;
        background-color: #eeeeee;
        border: solid 1px #e0e0e0;
        padding: 10px;
    }
    
    #inshad_text {
        margin-top: 10px;
        background-color: #eeeeee;
        border: solid 1px #e0e0e0;
        padding: 10px 10px 15px 10px;
    }
    
    #inshad_text ul {
        line-height: 2.0em;
        font-size: 2.0em;
        font-weight: 400;
        text-decoration: none;
        list-style: none;
        background-color: white;
        
    }
    
    #inshad_page_header {
        margin-top: 5px;
        text-align: center;     
    }
    
    #inshad_page_body {
        margin-top: 15px;
        text-align: right;     
    }
    
    /* videos */
    
    #video_menu {
        text-align: center;
        color: white;
    }
    
    .video_box {
        display: inline-block;
        max-width: 420px;
        min-height: 300px;
        margin: 10px 15px;
        border: 1px solid white;
        border-bottom-right-radius: 10px 10px;
        border-bottom-left-radius: 10px 10px;
        box-shadow: 20px 20px 20px #888888;
        text-align: right;
    }
    
    .video_box_header {
        text-align: center;
        height: 70px;
        width: 98%;
        margin: 5px auto;
        padding:5px; 
    }
    
    .video_box_body {
        text-align: center;
        width: 98%;
        min-height: 200px;
        margin: 5px auto;
        padding: 5px; 
    }
    
    .video_box_pict {
        text-align: center;
        display: float;
        width: 100%;
        margin: 5px auto;
        padding: 5px;
    }
    
    .video_box_pict img {
        height: 200px;
        width: auto;
        // border: 2px solid white;
    }
    
    .video_desc {
        text-align: center;
        width: 100%;
        margin: 5px auto;
    }
    
    
    .video_box_header h2 {
      font-size: 14pt;
      font-weight: bold;
    	margin: 0px;
    	padding: 12px 15px 5px;
    	color: white; 
    	line-height: 1.2em;
    }
    
    
    .video_box_header h2 a:link {
    	text-decoration: none; color: white; 
    	}
    .video_box_header h2 a:visited {
    	text-decoration: none; color: white; 
    	}
    .video_box_header h2 a:hover {
    	text-decoration: none; color: #ccb399; 
    	}
    .video_box_header h2 a:active {
    	text-decoration: none; color: white; 
    	}
    
    .video_box2 {
      border:2px solid #a1a1a1;
      background:#dddddd;
      max-width:715px;
      border-bottom-right-radius: 10px 10px;
      border-bottom-left-radius: 10px 10px;
      box-shadow: 5px 5px 5px #888888;
    }
    
    /* photos */
    #photos_list {
        border-top: 2px solid #FFFFFF;
        border-bottom: 2px solid #FFFFFF;
        text-align: center;
        padding: 10px 10px 10px 10px;
        background-color: #333333;
        border: 1px solid #6699CC;
    }
    
    
    .photo_thumb_box {
        display: inline-block;
        vertical-align: middle;
        width: 250px;
        height: 250px;
        border: 2px solid #6e6e6e;
        background-color: #333;
        white-space: nowrap;
        text-align: center; 
        margin: 10px;
    }
    
    .photo_center {
        display: inline-block;
        height: 100%;
        vertical-align: middle;
    }
    
    IMG.photo_thumb {
        background: #3A6F9A;
        vertical-align: middle;
        max-height: 200px;
        max-width: 200px;
        border-left: solid 2px #fff;
        border-top: solid 2px #fff;
        border-right: solid 2px #fff;
        border-bottom: solid 2px #fff;
    }
    
    IMG.photo {
        padding: 0px;
        vertical-align: middle;
        max-height: 1000px;
        max-width: auto;
        border: 5px solid #ffffff;
    }
    
    .photoCapt {
      font-family: Arial, Helvetica, sans-serif;
      font-size: 10pt;
      color: white;
    	FONT-WEIGHT: bold; 
      TEXT-DECORATION: none;
      PADDING-TOP: 5px; 
    	PADDING-RIGHT: 5px; 
      PADDING-LEFT: 5px; 
      PADDING-BOTTOM: 0px; 
    }
    
    .photoBy {
      font-family: Arial, Helvetica, sans-serif;
      font-size: 8pt;
      TEXT-DECORATION: none;
      PADDING-TOP: 2px; 
    	PADDING-RIGHT: 5px; 
      PADDING-LEFT: 5px; 
      PADDING-BOTTOM: 2px; 
      color: #758AA8;
    }
    
    IMG.photo_thumb:hover {
        border: 4px solid #000;
    }
    
    .photo_box_header h2 a:link {
    	text-decoration: none; color: white; 
    	}
    .photo_box_header h2 a:visited {
    	text-decoration: none; color: white; 
    	}
    .photo_box_header h2 a:hover {
    	text-decoration: none; color: #ccb399; 
    	}
    .photo_box_header h2 a:active {
    	text-decoration: none; color: white; 
    	}
    
    #photo_nav_div {
        padding: 5px;
    }
    
    #photo_nav_last_div {
        width: 60px;
        display: inline-block;
    }
    
    #photo_nav_next_div {
        width: 60px;
        display: inline-block;
    }
    
    #photo_nav_center_div {
        width: 200px;
        display: inline-block;
    }
    
    #photo_nav_first_div {
        width: 60px;
        display: inline-block;
    }
    
    #photo_nav_prev_div {
        width: 60px;
        display: inline-block;
    }
    
    
    .carousel-caption {
        position: relative;
        left: auto;
        right: auto;
    }
    
    /* articles */
    
    .article_box {
        border: 2px solid #FFFFFF;
        /* background-color: #d5d7e0; */
        margin: 5px 15px;
        padding: 5px;
        min-height: 160px;
        width: 100%;
        display: inline-block;
    }
    
    .article_pict {
        margin: 2px auto;
        width: 100px;
        height: auto;
    }
    
    .article_desc {
        margin: 2px;
        width: 100%;
        height: auto;
        /* background-color: yellow; */
    }

    .article_box_e {
        border: 2px solid #FFFFFF;
        margin: 5px auto;
        padding: 5px;
        width: 100%;
        height: auto;
        /* background-color: #d5d7e0; */
    }
    
    .article_pict_e {
        margin: 2px auto;
        width: 100px;
        height: auto;
    }
    
    .article_desc_e {
        margin: 2px;
        width: 100%;
        min-height: auto;
    }

    
    /* comments */
    
    #comments_header {
        border-top: 2px solid #FFFFFF;
        border-bottom: 1px solid #FFFFFF;
        text-align: center;     
    }
    
    #comments_write {
        border-top: 2px solid #FFFFFF;
        border-bottom: 1px solid #FFFFFF;
    }
    
    #comments_list {
        border-top: 2px solid #FFFFFF;
        text-align: center;
        background-color: #e3f2fd;     
    }
    
    
    .comment_box {
        background-color: #e3f2fd;
        width: 95%;
        margin: 5px 15px;
        display: inline-block;
        text-align: right;   
    }
    
    .comment_reply_box {
        background-color: #e3f2fd;
        width: 95%;
        margin: 5px 15px;
        display: inline-block;
        text-align: right;   
    }
    
    .comment_box_e {
        background-color: #e3f2fd;
        width: 95%;
        margin: 5px 15px;
        display: inline-block;
        text-align: left;   
    }
    
    .comment_reply_box_e {
        background-color: #e3f2fd;
        width: 95%;
        margin: 5px 15px;
        display: inline-block;
        text-align: left;   
    }
    
    .comment_header {
        margin: auto;
        width: 100%;
        padding: 5px 25px;
        background-color: #bbdefb;
        border-top: 2px solid #90caf9;
        border-left: 2px solid #90caf9;
        border-right: 2px solid #90caf9;
        border-top-right-radius: 10px 10px;
        border-top-left-radius: 10px 10px;
    }
    
    .comment_reply_header {
        margin: auto;
        width: 100%;
        padding: 5px 25px;
        background-color: #d7ccc8;  
        border-top: 2px solid #d7ccc8;
        border-left: 2px solid #d7ccc8;
        border-right: 2px solid #d7ccc8;
        border-top-right-radius: 10px 10px;
        border-top-left-radius: 10px 10px;
    }
    
    .comment_header H2, H3, H4, H5, H6 {
        line-height: 0.9em;
    }
    
    .comment_body {
        margin: auto;
        width: 100%;
        padding: 5px 25px;
        font-size: 18px;
        background-color: #ffffff;
        border-left: 2px solid #90caf9;
        border-right: 2px solid #90caf9;
        border-bottom: 2px solid #90caf9;
        border-bottom-right-radius: 10px 10px;
        border-bottom-left-radius: 10px 10px;
    }
    
    .comment_reply_body {
        margin: auto;
        width: 100%;
        padding: 5px 25px;
        font-size: 18px;
        background-color: #efebe9;
        border-left: 2px solid #d7ccc8;
        border-right: 2px solid #d7ccc8;
        border-bottom: 2px solid #d7ccc8;
        border-bottom-right-radius: 10px 10px;
        border-bottom-left-radius: 10px 10px;
    }
    
    #comment_write {
        margin: auto;
        display: inline-block;
    }
    
    
    /* contacts */
    
    .contact_page {
        margin: 10px auto;
        width: 100%;
        padding: 5px 25px;
        font-size: 18px;
        background-color: #ffffff;
        border: 2px solid #90caf9;
        border-top-right-radius: 10px 10px;
        border-top-left-radius: 10px 10px;
        border-bottom-right-radius: 10px 10px;
        border-bottom-left-radius: 10px 10px;
    }
    
    #contact_header {
        margin-top: 5px;
        text-align: center;     
        background-color: #eeeeee;
    }
    
    #contact_body {
        margin: 10px;
        background-color: #ffffff;
        text-align: right;     
    }
    
    /* misc */
    
    .accordion-caret .accordion-toggle:hover {
        text-decoration: none;
    }
    .accordion-caret .accordion-toggle:hover span,
    .accordion-caret .accordion-toggle:hover strong {
        text-decoration: underline;
    }
    .accordion-caret .accordion-toggle:before {
        font-size: 25px;
        vertical-align: -3px;
    }
    .accordion-caret .accordion-toggle:not(.collapsed):before {
        content: "?";
        margin-right: 0px;
    }
    .accordion-caret .accordion-toggle.collapsed:before {
        content: "?";
        margin-right: 0px;
    }
        
    .hl0 { background-color: #FFFF99 }
    .hl1 { background-color: #FF99FF }
    .hl2 { background-color: #99FFFF }
    
    .row_0 {}
    .row_1 {background-color:#EFF5FB}
    
    .contact {
        border: 1px solid #CCCCFF; 
        max-width: 580;
        height: 440; 
        text-align: right;
        font-size: 14pt;
      	COLOR: #003366; 
        background-color: #FFFFCC;
        margin: 10px;
        border-collapse: collapse;
        border-color: #000066;
        padding: 5;
    }
    
    TD.contact {
      background-color: #dcebff;
      border-color: #dcebff;
    }
    
    TD.contact2 {
      background-color: #003366;
      border-color: #dcebff;
    }
    
    .panel-heading .accordion-toggle:after {
        /* symbol for "opening" panels */
        font-family: 'Glyphicons Halflings';  /* essential for enabling glyphicon */
        content: "\e114";    /* adjust as needed, taken from bootstrap.css */
        float: left;        /* adjust as needed */
        color: white;         /* adjust as needed */
    }
    .panel-heading .accordion-toggle.collapsed:after {
        /* symbol for "collapsed" panels */
        content: "\e080";    /* adjust as needed, taken from bootstrap.css */
    }
    
    div.quote {
        border: 1px solid #CCCCFF; 
        width: 80%; 
        padding: 20px 20px 20px 20px;
        text-align: right;
        font-size: 14pt;
      	COLOR: #003366; 
        background-color: #FFFFCC;
        margin: 10px;
    }
    
    P.quote {
        text-align: right;
        font-size: 12pt;
        line-height: 13pt;
        margin: 20px; 
        COLOR: #333333; 
        padding: 5px;
    }
    
    P.reference {
        text-align: right;
        font-size: 12pt;
        line-height: 13pt;
        margin: 10px; 
        COLOR: #333333; 
        padding: 5px;
    }
    
    P.message {
        border: solid #6699CC;
        text-align: center;
        font-size: 14pt;
        color: #6699CC;
        padding: 5px;
        width: 600px;
    }
    
    P.error {
        border: solid #FF9966;
        text-align: center;
        font-size: 14pt;
        color: #FF9966;
        padding: 5px;
        width: 600px;
    }

}