/*
 Developer: Nhi Nguyen
 Cesoft co., ltd
*/
/**
 For Smatphone
**/

@media (max-width: 767px) {

    .site-wrapper {
        clear: both;
    }
    .style11 {
        width: 100%;
    }
    .style11.s2 img {
        width: 100%;
    }
    .comment-form .field-name-comment-body {
        width: 100%;
    }
    
    #block-block-37,
    #block-views-latest-news-block-1,
    #block-block-32,
    #block-views-latest-news-block {
        float: left;
        width: 100%;
	margin-left:10px;
    }
    #bg-unsolved {
        height: 100%;
    }
    .menu.navbar-nav a.submit-stories {
        height: 45px;
    }
    #block-views-user-comments-block {
        padding-left: 15px;
    }
    #slideshow-news {
        padding-right: 10px;
    }
    #slideshow-comments {
        padding-left: 10px;
    }
    #block-block-33 .row {
        margin-left: 0;
        margin-right: 0;
        width: 100%;
    }
    .header-left .main-logo {
        margin-top: 0;
        float: none;
        text-align: center;
    }
    a.logo {
        position: relative;
        right: 0;
    }
    .main-logo .logo img {
        max-width: 300px;
    }
    #block-block-34 .content,
    #block-block-34 h2 {
        text-align: center;
        font-weight: bold;
    }
    .header-right #block-block-34 {
        margin-top: 0;
    }
    #section-header .zone-wrapper {
        height: auto;
    }
    #section-header #main-menu {
        margin: 0;
        padding: 0;
    }
    #site-wrapper .main-container {
        padding-top: 10px;
    }
    #carousel ul.slides {
        width: 100%!important;
    }
    .fb-like-box.fb_iframe_widget,
    .fb-like-box.fb_iframe_widget span,
    .fb_iframe_widget iframe {
        width: 100%!important;
    }
    .fb-comments.fb_iframe_widget,
    .fb-comments.fb_iframe_widget span,
    .fb-comments.fb_iframe_widget iframe {
        width: 100%!important;
    }
    #footer .container {
        display: block;
        overflow: hidden;
    }
    .footer .container {
        border-top: 1px solid #89b9bf;
        margin-top: 10px;
        padding: 15px 10px;
        width: 100%;
    }
    .view-archives .views-row {
        height: auto;
    }
    #bg-archives {
        height: 100%;
    }
    #block-views-discussion-board-block {
        padding: 10px;
    }
    .region-slideshow-left {
        height: auto;
        margin-bottom: 10px;
    }
    .flexslider .flex-direction-nav a {
        opacity: 0;
    }
    .flexslider .flex-direction-nav a:hover {
        opacity: 1;
    }
    .view-Carousel .flexslider .flex-direction-nav a.flex-prev {
        left: -10px;
    }
    .view-Carousel .flexslider .flex-direction-nav a.flex-next {
        right: -10px;
    }
    .footer #block-block-30 .copyright {
        text-align: left;
        padding-left: 10px;
    }
    .views-field-subject {
        width: 100%;
    }
    .footer #block-block-30 .copyright {
        font-size: 12px;
    }
    .webform-client-form {
        margin-left: 0;
    }
    .webform-client-form label {
        width: 100%;
    }
    .webform-client-form .webform-component-radios label {
        width: 150px;
    }
    .webform-client-form #webform-component-link input.form-text {
        width: 100%;
    }
    .webform-client-form .webform-component-textarea .form-textarea-wrapper {
        margin-left: 0;
        width: 100%;
    }
    .webform-client-form .form-actions input.form-submit,
    .webform-client-form .form-item-mollom-captcha input.form-text {
        margin-left: 0;
    }
    .mollom-audio-captcha {
        width: 80%;
    }
    .mollom-audio-captcha #mollom_captcha_audio {
        width: 100%;
    }
    .footer .container .row {
        margin-left: 0;
        margin-right: 0;
    }
    .form-textarea-wrapper textarea {
        box-sizing: border-box;
        display: initial;
        margin: 0;
        width: 100%;
    }
    .block-taxonomy-menu-block ul li {
        float: left;
        width: 50%;
    }
    #block-taxonomy-menu-block-1 .content ul {
        clear: both;
        display: block;
        overflow: hidden;
    }
    .node-type-archives .node-archives .field-name-body table img {
        height: auto;
    }
    .video-js {
        width: 100%!important
    }
    .view-mysteries-news .views-row,
    .view-latest-news .views-row {
        height: auto;
        min-height: 50px;
    }
    .comment-form .field-name-comment-body {
        width: auto;
    }
    .region-slideshow-right {
        float: left !important;
        width: 100% !important;     

    }
    #block-views-mysteries-news-block {
        margin: 20px 10px 10px 10px !important;
        border-bottom: solid 6px #CAAA00;
        padding: 0px 0px 10px 0px !important;
        clear: both !important;
    }

    #block-views-carousel-block{
      margin-left:10px;
      
    }
    #block-views-carousel-block h2 {
        clear: both !important;
        width: 100% !important;
    }
    .view-display-id-block {
        clear: both !important;
    }
    .view-id-Carousel {
        clear: both !important;
        padding-left: 0px !important;
        margin-left: 0px !important;
        width: 100%;
        text-align:center;
        margin: 20px 10px 10px 10px !important;
/*
        height: 350px !important;
        overflow: scroll !important;
*/
 overflow-x:hidden !important;

    }
#carousel .slides li {

  width:165px !important;
}
.portfolio-item .field-content img {


}
    .slider-content {
        display: block !important;
        padding-bottom: 12px;
        padding-top: 5px;
        text-align: center;
    }
    .slider-content a {
        color: white;
    }
    .carousel {
        margin: 20px 10px 10px 10px !important;
    }
    .block-views-latest-news-block-1 {
        margin: 20px 10px 10px 10px !important;
    }
    #block-views-latest-news-block-1 .content {
        height: 400px !important;
    }
    

#block-views-latest-news-block .views-field-nid {
        display: none !important;
    }
    #block-block-32 h2 {
        padding-left: 0px !important;
        padding-top: 20px;
    }
    #block-block-32 .content {
        padding-top: 10px !important;
        margin-left: 0px !important;
        margin-bottom: 20px !important;
        overflow-y: scroll !important;
    }
#block-block-32 {
  margin: 0px 10px 10px 10px !important;
box-sizing: border-box;
clear:both !important;
position:relative !important;

}


#block-views-latest-news-block-1 .pager{
color:black;
 position: relative;
    top: -60px;
color: black;
}


#block-views-latest-news-block-1 .pager-current{
color: white !important;
}
.did-you-know {
background-color:black !important;
padding-top:0px;padding-right:0px;
}

.views-field-field-images {
width:100% !important;

}


}
/**
 For Tablet
**/

@media (min-width: 768px) and (max-width: 959px) {
    #bg-unsolved {
        height: 100%;
    }
    #block-views-latest-news-block-1,
    #block-block-32,
    #block-views-latest-news-block {
        float: left;
        width: 50%;
    }
    #footer-first-inside.col-sm-6 {
        width: 48%;
    }
    #footer-second-inside.col-sm-6 {
        width: 50%;
    }
    .header-right #block-block-34 {
        margin-top: 50%;
    }
    #block-block-33 .row {
        margin-left: 15%;
        width: 80%;
    }
    .footer .menu.nav li a {
        font-size: 12px;
        padding: 3px 8px;
    }
    .footer #block-block-30 .content {
        font-size: 12px;
    }
    .navbar-collapse.collapse {
        display: block;
    }
    #block-block-33 .row ul li {
        margin-left: 10%;
    }
    .region-slideshow-left,
    .region-slideshow-right {
        height: 320px;
    }
    #block-views-mysteries-news-block .content {
        height: 500px !important;
    }
    .region-slideshow-left .flex-viewport .field-content {
        max-height: 300px;
    }
    .views-field-subject {
        width: 80%;
    }
    .footer #block-block-30 .copyright {
        font-size: 12px;
        padding-right: 0;
    }
    .webform-client-form {
        margin-left: 0;
    }
    .view-archives .views-row {
        height: 160px;
    }
    .view-mysteries-news .views-row,
    .view-latest-news .views-row {
        height: auto;
        min-height: 50px;
    }
    .comment-form .field-name-comment-body {
        width: auto;
    }

#block-views-latest-news-block .views-field-nid {
        display: none !important;
width:0px !important;
    }

#block-views-latest-news-block .views-field-title {
  clear:both !important;
  width: 100% !important!;
  min-height: 35px;
  padding-left: 8px;
  padding-top: 5px;
}

    #block-views-latest-news-block-1 .content {
        height: 400px !important;
        /* padding-left: 50px; */
    }




}
/**
 For Desktop - 1024px
**/

@media (min-width: 960px) and (max-width: 1199px) {
    .footer #block-block-30 .copyright {
        font-size: 12px;
    }
    .view-archives .views-row {
        height: 170px;
    }
    .view-mysteries-news .views-row,
    .view-latest-news .views-row {
        height: auto;
        min-height: 50px;
    }
    #block-views-latest-news-block-1,
    #block-block-32,
    #block-views-latest-news-block {
        float: left;
        width: 50%;
    }

#block-views-latest-news-block .views-field-title {
  clear:both !important;
  width: 100%i important!;
  min-height: 35px;
  padding-left: 8px;
  padding-top: 5px;
}
#block-views-latest-news-block .views-field-nid {
        display: none !important;
width:0px !important;
    }

.did-you-know a {
  color: red;
  font-size: 20px !important;
  font-weight: 900;
}

#block-views-latest-news-block-1 .pager{
color:black;
 position: relative;
    top: -80px;
color: black;
}

    #block-views-latest-news-block-1 .content {
        height: 400px !important;
    }



}
/**
 For Desktop - More than 1200px
**/

@media (min-width: 1200px) {
    body {}
}
.navbar-toggle {
    background: none repeat scroll 0 0 #000000;
    display: block;
    height: 30px;
    left: 0;
    opacity: 0.5;
    position: absolute;
    width: 45px;
}
.navbar-toggle .icon-bar {
    background: none repeat scroll 0 0 #FFFFFF;
}
.navbar-collapse.in .navbar-nav li {
    display: block;
}
/* hide the link until viewport size is reached */

a.meanmenu-reveal {
    display: none;
}
/* when under viewport size, .mean-container is added to body */

.mean-container .mean-bar {
    float: left;
    width: 100%;
    position: relative;
    background: #0c1923;
    padding: 4px 0;
    min-height: 42px;
    z-index: 999999;
}
.mean-container a.meanmenu-reveal {
    color: #FFFFFF;
    cursor: pointer;
    display: block;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1px;
    font-weight: 700;
    height: 42px;
    left: 0 !important;
    line-height: 22px;
    padding: 10px 13px 11px;
    position: absolute;
    text-decoration: none;
    text-indent: -9999em;
    top: 0;
    width: 55px;
}
.mean-container a.meanmenu-reveal span {
    display: block;
    background: #fff;
    height: 3px;
    margin-top: 3px;
}
.mean-container .mean-nav {
    float: left;
    width: 100%;
    background: #0c1923;
    margin-top: 33px;
}
.mean-container .mean-nav ul {
    padding: 0;
    margin: 0;
    width: 100%;
    list-style-type: none;
}
.mean-container .mean-nav ul li {
    position: relative;
    float: left;
    width: 100%;
}
.mean-container .mean-nav ul li a {
    display: block;
    float: left;
    width: 96%;
    padding: 1em 5%;
    margin: 0;
    text-align: left;
    color: #fff;
    border-bottom: 1px solid #383838;
    border-bottom: 1px solid rgba(255, 255, 255, 0.5);
    text-decoration: none;
    text-transform: uppercase;
}
.mean-container .mean-nav ul li li a {
    width: 80%;
    padding: 1em 10%;
    border-bottom: 1px solid #f1f1f1;
    border-bottom: 1px solid rgba(255, 255, 255, 0.25);
    opacity: 0.75;
    filter: alpha(opacity=75);
    text-shadow: none !important;
    visibility: visible;
}
.mean-container .mean-nav ul li.mean-last a {
    border-bottom: none;
    margin-bottom: 0;
}
.mean-container .mean-nav ul li li li a {
    width: 70%;
    padding: 1em 15%;
}
.mean-container .mean-nav ul li li li li a {
    width: 60%;
    padding: 1em 20%;
}
.mean-container .mean-nav ul li li li li li a {
    width: 50%;
    padding: 1em 25%;
}
.mean-container .mean-nav ul li a:hover {
    background: #252525;
    background: rgba(255, 255, 255, 0.1);
}
.mean-container .mean-nav ul li a.mean-expand {
    width: 26px;
    height: 26px;
    border: none !important;
    padding: 12px !important;
    text-align: center;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 2;
    font-weight: 700;
}
.mean-container .mean-nav ul li a.mean-expand:hover {
    background: none;
}
.mean-container .mean-push {
    float: left;
    width: 100%;
    padding: 0;
    margin: 0;
    clear: both;
}
.mean-nav .wrapper {
    width: 100%;
    padding: 0;
    margin: 0;
}
.mean-container .menu.navbar-nav a.active {
    background: none;
    color: #66FFFF;
}
.mean-nav .block-search {
    position: absolute;
    right: 0;
    top: 6px;
}
.menu.navbar-nav a.submit-stories:hover,
.menu.navbar-nav a.submit-stories {
    background: none repeat scroll 0 0 #cc0033;
}