/**
* @file
* Page Styling
*
* Style the markup found in page.tpl.php. Also includes some styling of
* miscellaneous Drupal elements that appear in the $content variable, such as
* ul.links, .pager, .more-link, etc.
*/


/*
* Body
*/


/* @media all and (min-width: 920px) { */

body {
    margin: 0;
    padding: 0;
    background-color: black;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
}

.front #page {
    background-color: black;
}


/*
  * The skip-link link will be completely hidden until a user tabs to the link.
  * See the element-focusable rule in system.base.css.
  */

#skip-link {
    margin: 0;
}

#skip-link a,
#skip-link a:visited {
    display: block;
    width: 100%;
    padding: 2px 0 3px 0;
    text-align: center;
    background-color: #666;
    color: #fff;
}


/*
  * Header
  */

#header {
    margin: 30px 0;
    padding-top: 0px;
    height: 56px;
}

#logo {
    /* Wrapping link for logo */
    float: left;
    /* LTR */
    margin: 0;
    padding: 0;
}

#logo img {
    vertical-align: bottom;
}

.navbar .logo {
    padding-left: 15px;
    padding-right: 15px;
    max-width: 100%;
}

@media all and (min-width: 768px) {
    .navbar .logo {
        padding: 0;
    }
}

#name-and-slogan {
    /* Wrapper for website name and slogan */
    float: left;
}

#site-name {
    /* The name of the website */
    margin: 0;
    font-size: 2em;
    line-height: 1.5em;
}

#site-name a:link,
#site-name a:visited {
    color: #000;
    text-decoration: none;
}

#site-name a:hover,
#site-name a:focus {
    text-decoration: underline;
}

#site-slogan {
    /* The slogan (or tagline) of a website */
    margin: 0;
    font-size: 1em;
}

.region-header {
    /* Wrapper for any blocks placed in the header region */
    clear: both;
    /* Clear the logo */
    padding-left: 15px;
    padding-right: 15px;
}


/*
  * Main (container for everything else)
  */

#main {
    width: 100%;
}


/*
  * Content
  */

.front #content {
    margin-top: 30px;
    /* Move all the children of #main down to make room. */
}

.region-highlighted {}

.breadcrumb {
    /* The path to the current page in the form of a list of links */
}

.breadcrumb ol {
    margin: 0;
    padding: 0;
}

.breadcrumb li {
    display: inline;
    list-style-type: none;
    margin: 0;
    padding: 0;
}

h1.title,

/* The title of the page */

h2.node-title,

/* Title of a piece of content when it is given in a list of content */

h2.block-title,

/* Block title */

h2.title,

/* Comment section heading */

h2.comment-form,

/* Comment form heading */

h3.title {
    /* Comment title */
    /* margin: 0; */
}

tr.even {
    /* Some tables have rows marked even or odd. */
    /* background-color: #eee; */
    /* Drupal core uses a #eee background */
}

tr.odd {
    /* background-color: #eee; */
    /* Drupal core uses a #eee background */
}

div.messages {
    /* Important messages (status, warning, and error) for the user. See also the declarations in messages.css. */
    margin: 1.5em 0;
    /* Drupal core uses "6px 0" margin */
}

div.messages ul {
    margin-top: 0;
    margin-bottom: 0;
}

div.status {
    /* Normal priority messages */
}

div.warning,
tr.warning {
    /* Medium priority messages */
    /* border: 1px solid #f0c020; */
    /* Drupal core uses: 1px solid #f0c020 */
}

div.error,
tr.error {
    /* High priority messages. See also the .error declaration below. */
}

.error {
    /* Errors that are separate from div.messages status messages. */
    /* color: #e55; */
    /* Drupal core uses a #e55 background */
}

.warning {
    /* Warnings that are separate from div.messages status messages. */
    /* color: #e09010; */
    /* Drupal core uses a #e09010 background */
}

.tabs {
    /* See also the tabs.css file. */
}

.region-help {
    /* Help text on a page */
}

.more-help-link {
    /* Link to more help */
}

.region-content {
    /* Wrapper for the actual page content */
}

ul.inline {
    /* List of links generated by theme_links() */
    display: inline;
    padding: 0;
}

ul.inline li {
    display: inline;
    list-style-type: none;
    padding: 0 1em 0 0;
    /* LTR */
}

span.field-label {
    /* The inline field label used by the Fences module */
    padding: 0 1em 0 0;
    /* LTR */
}

.item-list .pager {
    /* A list of page numbers when more than 1 page of content is available */
    padding: 0;
}

.item-list .pager li {
    /* Each page number in the pager list */
    padding: 0 0.5em;
}

.feed-icon {
    /* The link to the RSS or Atom feed for the current list of content */
}

.more-link {
    /* Aggregator, blog, and forum more link */
}


/*
  * First sidebar (on left in LTR languages, on right in RTL)
  *
  * Remember to NOT add padding or margin to your .region-sidebar-first
  * (see the layout.css file.)
  */

.region-sidebar-first {}


/*
  * Second sidebar (on right in LTR languages, on left in RTL)
  *
  * Remember to NOT add padding or margin to your .region-sidebar-second
  * (see the layout.css file.)
  */

.region-sidebar-second {}

@media all and (max-width: 812px) {
    .ismobiledevice #right-sidebar #block-block-2,
    .ismobiledevice #right-sidebar #block-block-3,
    .ismobiledevice #right-sidebar #block-block-4,
    .ismobiledevice #right-sidebar #block-block-5 {
        display: none;
    }
    .ismobiledevice.istablet #right-sidebar #block-block-2,
    .ismobiledevice.istablet #right-sidebar #block-block-3,
    .ismobiledevice.istablet #right-sidebar #block-block-4,
    .ismobiledevice.istablet #right-sidebar #block-block-5 {
        display: block;
    }
}


/*
  * Footer
  */

#footer {
    padding: 0px;
}


/*
  * Page bottom
  */

.region-bottom {
    /* Wrapper for any blocks placed in the page bottom region */
}


/* FRONT PAGE CUSTOM THEME */


/* NAVIGATION */

#navigation.front {
    position: absolute;
    top: 0;
    height: 3em;
    width: 100%;
}

#navigation.front ul.links,

/* Main menu and secondary menu links */

#navigation.front ul.menu {
    /* Menu block links */
    margin: 0;
    padding: 0;
    text-align: left;
    /* LTR */
}

#navigation.front ul.links li.first,
#navigation.front ul.menu li.first {
    padding: 0;
    border-left: none;
}

#navigation.front ul.links li.first a,
#navigation.front ul.menu li.first a {
    display: block;
    background-image: url('../images/home_icon.png');
    background-repeat: no-repeat;
    background-position: left;
    padding: 0;
    width: 17px;
    text-indent: -9999px;
    border-right: none;
}

#navigation.front .menu-218.first.active {
    border-right: none;
}

#navigation.front ul.links li,
#navigation.front ul.menu li {
    /* A simple method to get navigation links to appear in one line. */
    float: left;
    /* LTR */
    padding: 0 10px 0 0;
    /* LTR */
    list-style-type: none;
    list-style-image: none;
    font-size: 19px;
    border-right: 3px solid #e61c23;
    font-weight: bold;
    padding: 0 15px;
}

#navigation.front ul.links li a,
#navigation.front ul.menu li a {
    color: white;
}

#navigation.front ul.links li.last,
#navigation.front ul.menu li.last {
    border-right: none;
}

#navigation.front ul.links li a:hover,
a:focus,
#navigation.front ul.menu li a:hover,
a:focus {
    color: #e61c23;
}


/* SOCIAL MEDIA BAR */

#search_smallcontainer {
    width: 100%;
    height: 40px;
    background-image: url('../images/top_bg.png');
    background-repeat: repeat-x;
    margin: 0 auto;
}


/* #join_us {
    float:left;
    margin-left: 550px;
    margin-right: 10px;
    margin-top: 10px;
  }

  #twitter {
  width: 26px;
  height: 26px;
  float:left;
  margin: 8px 0 0 5px;
  }

  #facebook {
  width: 26px;
  height: 26px;
  float:left;
  margin: 8px 0 0 5px;
  }

  #youtube {
  width: 26px;
  height: 26px;
  float:left;
  margin: 8px 0 0 5px;
  } */


/* DROPDOWN */

#block-block-10,
#block-block-11,
#block-block-12,
#block-block-13 {
    display: none;
    margin-bottom: 5px;
}

#whitebox {
    background-image: url('../images/dropdown_bg.png');
    background-repeat: no-repeat;
    background-color: white;
    /* height: 130px; */
    background-position: 35px top;
    padding-bottom: 20px;
}

#whitebox #links {
    margin-left: 10px;
    padding-top: 20px;
}

@media all and (min-width: 665px) {
    #whitebox.film-festival {
        background-position: 25px top;
    }
    #whitebox.about {
        background-position: -100px top;
    }
    #whitebox.ms {
        background-position: 250px top;
    }
    #whitebox.ptp {
        background-position: 340px top;
    }
    #whitebox ul.menu {
        margin-right: 20px;
        float: left;
    }
    #whitebox #links {
        width: 400px;
        height: 100px;
        padding-top: 20px;
    }
    #whitebox.about #links {
        margin-left: 10px;
    }
    #whitebox.film-festival #links {
        margin-left: 135px;
    }
    #whitebox.ms #links {
        margin-left: 350px;
    }
    #whitebox.ptp #links {
        margin-left: 440px;
    }
}

#whitebox ul li.leaf {
    list-style-image: none;
    list-style-type: none;
    text-align: center;
}

@media all and (min-width: 665px) {
    #whitebox ul li.leaf {
        text-align: left;
    }
}

#whitebox li a:visited,
#whitebox li a:link,
#whitebox li a:active {
    color: #7d7d7d;
    font-size: 16px;
}

@media all and (min-width: 565px) {
    #whitebox li a:visited,
    #whitebox li a:link,
    #whitebox li a:active {
        font-size: 12px;
    }
}

#whitebox li a:hover {
    color: #e61c23;
}


/* IMAGE SLIDER */

@media (min-width: 415px) {
    #block-views-highlights-slideshow-block-single {
        width: 100%;
        /*height: 518px;
    background-image: url(http://mopsal/sites/default/files/mock_1232x518.jpg);*/
    }
    #block-views-highlights-slideshow-block-single-mobport {
        display: none;
    }
}

@media (max-width: 414px) {
    #block-views-highlights-slideshow-block-single {
        display: none;
        /*height: 518px;
    background-image: url(http://mopsal/sites/default/files/mock_1232x518.jpg);*/
    }
    #block-views-highlights-slideshow-block-single-mobport {
        width: 100%;
    }
}

#block-views-highlights-slideshow-block,
#block-views-home-slides-block {
    /* background-color: white; */
    width: 100%;
    padding-top: 15px;
}

#views_slideshow_cycle_main_highlights_slideshow-block,
#views_slideshow_cycle_teaser_section_highlights_slideshow-block,
#views_slideshow_cycle_div_highlights_slideshow-block_0 .views-slideshow-cycle-main-frame-row-item.views-row.views-row-0.views-row-first.views-row-odd,
#views_slideshow_cycle_div_highlights_slideshow-block_1 .views-slideshow-cycle-main-frame-row-item.views-row.views-row-0.views-row-first.views-row-odd,
#views_slideshow_cycle_div_highlights_slideshow-block_2 .views-slideshow-cycle-main-frame-row-item.views-row.views-row-0.views-row-first.views-row-odd,
.views-field.views-field-field-highlights-image .field-content,
#views_slideshow_cycle_main_highlights_slideshow-block-1,
#views_slideshow_cycle_teaser_section_highlights_slideshow-block-1 {
    height: 380px;
}

.views-slideshow-cycle-main-frame-row,
.views-slideshow-cycle-main-frame-row-item {
    width: 100%!important;
}

.views-slideshow-controls-bottom clearfix {
    height: 100px;
}

.views_slideshow_cycle_main {
    width: 100%;
    float: left;
}

.views_slideshow_cycle_main .views-slideshow-cycle-main-frame {
    width: 100% !important;
    height: auto;
}

.views_slideshow_cycle_main .views-slideshow-cycle-main-frame-row {
    width: 100% !important;
    height: auto;
}

.views_slideshow_cycle_main .field-content {
    max-width: 100%;
    width: 100%;
}

.views_slideshow_cycle_main .field-content img {
    max-width: 100%;
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
}

.views-slideshow-cycle-main-frame-row-item .views-field-php {
    margin: 15px;
}

.views-slideshow-cycle-main-frame-row-item .field-content img {
    height: auto;
    margin: auto;
}

.views-slideshow-cycle-main-frame-row-item .views-field.views-field-title {
    font-size: 18px;
    color: #e61c23;
    font-weight: bold;
    /* width: 700px;
    height: 30px; */
    margin: 10px 15px 5px 14px;
}

@media all and (min-width: 768px) {
    .views-slideshow-cycle-main-frame-row-item .views-field.views-field-title {
        font-size: 28px;
    }
}

.views-slideshow-cycle-main-frame-row-item .views-field.views-field-body {
    margin-left: 15px;
    font-size: 13px;
}

@media all and (min-width: 768px) {
    .views-slideshow-cycle-main-frame-row-item .views-field.views-field-body {
        font-size: 16px;
    }
}

.views-slideshow-cycle-main-frame-row-item .views-field.views-field-body p {
    margin: 5px 0;
}

#widget_pager_bottom_highlights_slideshow-block .views-field-title,
#widget_pager_bottom_highlights_slideshow-block_1_1 .views-field-title {
    /* position: relative;
    left: 820px;
    width: 180px;
    bottom: 85px; */
}

.views-content-title {
    background-image: url('../images/slider_dot.png');
    background-repeat: no-repeat;
    height: 19px;
    width: 19px;
    display: block;
    text-indent: -9999px;
    margin-right: 0;
    margin-top: 20px;
    float: left;
}

.views-row-even.active .views-content-title,
.views-row-odd.active .views-content-title {
    background-image: url('../images/slider_dot_active.png');
    background-repeat: no-repeat;
    height: 19px;
    width: 19px;
    display: block;
    text-indent: -9999px;
    margin-right: 0;
    margin-top: 20px;
    float: left;
}

#views_slideshow_controls_text_previous_highlights_slideshow-block,
#views_slideshow_controls_text_previous_highlights_slideshow-block_1_1 {
    background-image: url('../images/left_arrow.png');
    background-repeat: no-repeat;
    height: 32px;
    width: 32px;
    display: block;
    text-indent: -9999px;
    float: left;
    z-index: 10;
    position: absolute;
    bottom: 50%;
    left: 20px;
    /*bottom: 305px;
    right: -30px;*/
    background-size: contain;
}

#views_slideshow_controls_text_next_highlights_slideshow-block,
#views_slideshow_controls_text_next_highlights_slideshow-block_1_1 {
    background-image: url('../images/right_arrow.png');
    background-repeat: no-repeat;
    height: 32px;
    width: 32px;
    display: block;
    text-indent: -9999px;
    float: left;
    z-index: 10;
    position: absolute;
    bottom: 50%;
    right: 20px;
    /*bottom: 305px;
    left: 830px;*/
    background-size: contain;
}

@media all and (min-width: 768px) {
    #views_slideshow_controls_text_previous_highlights_slideshow-block,
    #views_slideshow_controls_text_previous_highlights_slideshow-block_1_1,
    #views_slideshow_controls_text_next_highlights_slideshow-block,
    #views_slideshow_controls_text_next_highlights_slideshow-block_1_1 {
        height: 72px;
        width: 72px;
    }
}

.views-slideshow-cycle-processed .views-slideshow-controls-bottom,
.views-slideshow-cycle-processed .views-slideshow-controls-top {
    position: relative;
}

#views_slideshow_controls_text_pause_highlights_slideshow-block,
#views_slideshow_controls_text_pause_highlights_slideshow-block_1_1 {
    display: none;
}

.views-field.views-field-title a {
    font-size: 16px;
    color: #e61c23;
}

#block-views-highlights-slideshow-block,
#block-views-home-slides-block {
    /* background-color: white; */
    /* height: 450px; */
    margin-bottom: 5px;
    line-height: 1.2;
    padding-bottom: 15px;
}

.views-slideshow-pager-fields {
    position: absolute;
    bottom: 40px;
    right: 15px;
    z-index: 9;
    display: none;
}

@media all and (min-width: 768px) {
    .views-slideshow-pager-fields {
        bottom: 90px;
        right: 40%;
    }
}

@media all and (min-width: 920px) {
    .views-slideshow-pager-fields {
        bottom: 40px;
        right: 15px;
    }
}

@media all and (min-width: 1200px) {
    .views-slideshow-pager-fields {
        display: block;
    }
}

.views-slideshow-pager-fields>div {
    display: inline-block;
}


/* RIGHT SIDEBAR CONTENT */

.region.region-content-sidebar {
    float: right;
}

.region.region-content-sidebar .odd {
    width: 308px;
    border-bottom: 2px solid white;
    margin-left: 30px;
    margin-bottom: 15px;
}

.region.region-content-sidebar .even {
    width: 308px;
    border-bottom: 2px solid white;
    margin-left: 30px;
    margin-bottom: 15px;
    padding-bottom: 15px;
}

#block-block-5 .region.region-content-sidebar .even {
    border-bottom: 0px;
}

.region.region-content-sidebar p {
    margin: 0 0 15px 0;
}

.region.region-content-sidebar .last {
    border-bottom: none;
}

#block-views-home-slides-block .views-field-title .field-content a {
    font-family: Work Sans;
    font-style: normal;
    font-weight: 500;
    font-size: 24px;
    line-height: 28px;
    color: #FFFFFF;
}

#block-views-home-slides-block .views-field-title {
    background: rgba(196, 196, 196, 0.9);
    padding: 20px;
    opacity: 0;
    position: absolute;
    width: calc(100% - 30px);
    bottom: 15px;
    left: 15px;
    transition: opacity .5s ease-out;
    -moz-transition: opacity .5s ease-out;
    -webkit-transition: opacity .5s ease-out;
    -o-transition: opacity .5s ease-out;
}

#block-views-home-slides-block .views-row:hover .views-field-title {
    opacity: 1;
}


/* OUR PROGRAMS BLOCK */

.views-field-title .field-content a,
.views-field-field-link-to a {
    color: #e61c23;
    font-weight: bold;
}

#block-views-our-programs-block {
    /* width: 660px;
    height: 340px; 
    float:left;*/
    /*margin-bottom: 30px;*/
}

.view.view-our-programs {
    background-color: white;
    width: 660px;
    height: 305px;
    float: left;
}

#block-views-our-programs-block img {
    width: 100%;
    height: auto;
    margin: auto;
    margin-bottom: 10px;
}

#block-views-our-programs-block .views-row {
    /* float: left;
    width: 50%;
    height: 260px; */
    margin-bottom: 15px;
}


/* FILM FESTIVAL BLOCK */


/* .view.view-film-festival {
    background-color: white;
    width: 660px;
    height: 305px;
    float:left;
  } */

#block-views-film-festival-block {
    /* width: 660px;
    height: 340px; */
    /* float:left; */
    /* margin-bottom: 30px; */
    margin-top: 30px;
}

#block-views-film-festival-block img {
    width: 100%;
    height: auto;
    margin: auto;
    margin-bottom: 10px;
}

#block-views-film-festival-block .views-row {
    /* float: left;
    width: 200px;
    height: 260px;
    margin-left: 15px;
    margin-top: 15px; */
    margin-bottom: 15px;
}

@media all and (min-width: 768px) {
    #block-views-film-festival-block .views-row,
    #block-views-our-programs-block .views-row {
        margin-bottom: 0;
    }
}


/* FOOTER */


/* .front .footer,
body.film-festival-about .footer {
    margin: 0 auto;
    padding-top: 60px;
    background-image: url('../images/bottom_gradient.png');
    background-position: top;
    background-repeat: repeat-x;
    background-color: #000000;
} */

.footer {
    text-align: center;
}

@media all and (min-width: 768px) {
    .footer {
        text-align: left;
    }
}

#footer #block-block-1 {
    margin: 10px;
}

#block-menu-menu-picture-the-possibilities,
#block-menu-menu-film-festival,
#block-menu-menu-maverick-studio,
#block-menu-menu-about-us {
    margin-top: 15px;
}

@media all and (min-width: 768px) {
    .footer #block-block-1 {
        float: left;
        margin: 0;
        width: 20%;
        padding-right: 10px;
    }
    #block-menu-menu-picture-the-possibilities,
    #block-menu-menu-film-festival,
    #block-menu-menu-maverick-studio,
    #block-menu-menu-about-us {
        float: left;
        margin-top: 0;
    }
}

#footer h2.block-title {
    font-size: 12px;
    font-weight: bold;
}


/* #footer menu,
ol,
ul,
.item-list ul {
    font-size: 12px;
    padding: 0px;
    margin: 0px;
} */

#footer ul li.leaf {
    list-style: none;
    color: #58595b;
}

#footer li a.active {
    color: #58595b;
}

#footer li a:hover {
    color: #e61c23;
}

#block-block-8 {
    /* float:left; */
    /* margin-left: 0px; */
    margin-top: 30px;
}


/* HIDDEN DRUPAL ARTICLE CONTENT */

article.node-3 {
    display: none;
}

article.node-2 {
    display: none;
}

article.node-1 {
    display: none;
}


/* mopsal for donate block */

#block-block-2 h2 {
    color: #ff0009;
}

#block-block-2 p {
    color: #ff0009;
}

#block-block-2 a {
    color: #ff0009;
}


/* FRONT BLOCKS */

#block-block-29 .view-content,
#block-block-28 .view-content {
    /* float: left; */
    background-color: white;
    padding: 15px;
}

#block-block-3,
#block-block-2,
#block-block-4 {
    padding-bottom: 30px;
    /* margin-bottom: 15px; */
    border-bottom: 2px solid #ffffff;
}

#block-block-3 .block-content,
#block-block-2 .block-content,
#block-block-4 .block-content,
#block-block-5 .block-content {
    background: #ffffff;
    padding: 10px;
    color: #000000;
}

@media all and (min-width: 768px) {
    #block-block-3 .block-content,
    #block-block-2 .block-content,
    #block-block-4 .block-content,
    #block-block-5 .block-content {
        background: none;
        padding: 0px;
        color: #6d6e70;
    }
}

.views-field-field-promotion-image img {
    max-width: 308px;
    height: auto;
}

@media all and (min-width: 768px) {
    .views-field-field-promotion-image img {
        max-width: 100%;
    }
}


/**
 * Festival Updates email collection (Notify Me - webform node 29153)
 *
 */

.front .webform-submit {
    border: none;
    width: 25px;
    height: 25px;
    display: inline-block;
    text-indent: -9999px;
    background: url('../images/go_arrow.png') no-repeat center;
    background-size: contain;
    position: absolute;
    bottom: 20px;
    right: 20px;
}

.front section .form-group::before {
    content: "Please sign up to receive a tasteful number of exciting updates and line up announcements.";
}

.front .form-control {
    margin-top: 5px;
}

.front .festival-updates-email {
    background-color: #000;
    color: white;
}

.festival-updates-email-wrapper {}


/* hide the undeclared capcha field visible to authenticated users */

.front fieldset.collapsible {
    display: none;
}
.home-slides-content {
    margin: 0;
    position: relative;
}