/*
Theme Name: Cinemagic
Theme URI:
Description: A custom WordPress site for Cinemagic
Author: Kaizen
Author URI:
Version: 1.0
Tags: clean, light, responsive, custom-post-types, custom-fields

License: GNU General Public License v2.0
License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/

/* Page Styles
================================================== */

html
{
    width: 100%;
    height: 100%;
    margin: 0px;
    padding: 0px;
    overflow-x: hidden; }

body {font-family: sofia-pro, sans-serif; color:#35353f}

.single_event_listing .event-details {margin-top: 50px}
.single_event_listing .organizer-details  {margin-top: 50px}

.frm_primary_label{color: white!important;}
a.viewmoreevents {line-height: 40px}

#mega-menu-item-861 {border: 1px solid white !important; border-radius: 5px !important;}
.newsletter {padding-top: 200px}

#headbar { 
	background-image: url(images/redgradient_nav.png);
	height: 120px;
	padding-top: 10px;
	left: auto;
	position: relative;
	margin-top: 0px;
	top: auto;
	width: 100%;
	z-index: 100;
	display: flex;
	justify-content: center;
	align-items: center;
}

.leftmenu {width: 20%; float: left}

.rightmenu {
	width: 80%;
	float: right;
	margin-right: -350px;
	display: flex;
    justify-content: flex-end;
    align-items: center;
    margin: 0!important;
}

.logo {width: 100%; margin-top: 0px;}

.mega-menu-item mega-menu-item-type-custom mega-menu-item-object-custom mega-align-bottom-left mega-menu-flyout mega-menu-item-861 {border: 1px solid #fff}

li#mega-menu-item-953.mega-menu-item.mega-menu-item-type-custom.mega-menu-item-object-custom.mega-align-bottom-left.mega-menu-flyout.mega-menu-item-953 {border: 1px solid #fff !important; border-radius: 5px !important;}
#blogposts{display: flex;flex-wrap: wrap; align-items: stretch;margin-top: 3rem!important;}
img.attachment-post-thumbnail.size-post-thumbnail.wp-post-image{height: 250px!important; width: 100%; object-fit: cover;}
.red-b-post{background-color: #e10000; padding: 1rem 0; text-align: center; min-height: 136px!important;}
.post-boxes{margin: 0 0.5% 1.5rem 0.5%; width: 32%; text-align: center;}
@media only screen and (max-width: 600px) {.post-boxes{margin: 1.5rem 0 ; width: 100%; text-align: center;}}
.red-post-boxes{background-color:#e10000;}
.post-boxes p {flex-grow: 1;}
.post-link-btn{ border: 1px solid #e10000; padding: 10px 20px; border-radius: 5px;color: #e10000; transition: ease-in-out 0.3;s}
.post-link-btn:hover{ border: 1px solid #e10000; padding: 10px 20px; border-radius: 5px;color: white;background-color: #e10000; }
.white-date{color: white; font-size: 14px;}
.blog-strip-title{color: white;}
#pag{float: left!important;}
.page-numbers.current{background-color:#e10000!important;border-color: #e10000; color: white!important; }
.page-numbers{border-color:#e10000!important;color: black!important; }
.page-numbers li a:hover{border-color:#e10000!important;color: white!important; background-color:#e10000!important; }
.blog-main-text{padding-top: 1rem; text-align: center;}
.blackstrip{background-color: black; text-align: center;padding: 1rem 0;}
.white-title{color: white; font-size: 16px; font-weight: 400;}
#slidermenu {position: relative;margin: 0 auto; text-align: center}


.black-form{
	background-color: black;
	padding: 60px;
}
.jury-text{
	padding-top: 40px;
	padding-bottom: 40px;
}
.frm_fields_container input{
	background-color: transparent!important;
	border-top: none!important;
	border-left: none!important;
	border-right: none!important;
	border-radius: 0!important;
	color: white!important;
}
.frm_fields_container textarea{
	background-color: transparent!important;
	border-top: none!important;
	border-left: none!important;
	border-right: none!important;
	border-radius: 0!important;
	color: white!important;
}
.frm_fields_container label{
	color: white!important;
}
.frm_button_submit{
	background-color: transparent!important;
	border-color: white!important;
	color: white!important;
	border-radius: 20px!important;
	padding: 10px 20px!important;
	font-size: 16px;
}
.frm_button_submit:hover{
	background-color: white!important;
	color: black!important;
}
#menu {font-family: sofia-pro, sans-serif;
font-weight: 700;
font-style: normal; margin-top: 0px}

div#mega-menu-wrap-max_mega_menu_1.mega-menu-wrap { width: 100%; margin: 0 auto; }

h1 {font-family: sofia-pro, sans-serif;}
h2 {font-family: sofia-pro, sans-serif;}

.black-banner-text{
	color: white!important;
}

#barcolor { background-image: url(images/redgradient.png);  width: 100%; padding-top: 40px; padding-bottom: 30px}

.upcomingevents a {border: 1px solid #fff; padding: 10px; border-radius: 10px; color:#fff; text-align: center;}

.viewmore {border: 1px solid #f10000; padding: 10px; border-radius: 10px;}

.viewmoreevents {border: 1px solid #fff; padding: 10px; border-radius: 10px; color:#fff; text-align: center;}

.viewmoreevents a:hover {color:#fff;}

.eventmore {text-align: center;padding-bottom: 30px;}


.cities h2 {color: #fff; text-align: center; font-size: 24px}
.citiesp {font-size: 13px; color:#fff; text-align: center; padding-top: 10px}

.homeslogan {text-align: center; color: #e14558; padding-top: 30px; padding-bottom: 30px}
.homeslogan h1 {font-size: 25px; font-weight: 700}


#redbackground {background: #1a1a1a; padding: 10px; padding-top: 15px}
#brightredbackground {background: #f10000; padding: 10px; padding-top: 15px}
#purplebackground {background: #1a1a1a; padding: 10px; padding-top: 15px}
#lightbluebackground {background:#1a1a1a; padding: 10px; padding-top: 15px}
#darkbluebackground {background:#1a1a1a; padding: 10px; padding-top: 15px}


#redstar { background-image: url(images/starred_background.png);}

#redgradient{ background-image: url(images/redgradient.png);}

#redstarburst{ background-image: url(images/redstarburst.png);}

.eventBox { background: #fff !important}

.upcomingevents h2 {color: #fff; text-align: center;font-size: 25px; font-weight: 300}

/*.homepost h2 {line-height: 1em}*/

.newshome h2 {color: #fff; text-align: center;font-size: 25px; font-weight: 700}

.contactmain h2 {color: #fff; text-align: center;font-size: 20px; font-weight: 700}

.donation h2 {color: #fff; text-align: center;font-size: 25px; font-weight: 700}
.donation p {color:#fff; text-align: center; font-size: 14px;}
.donation{padding-top: 20px; padding-bottom: 20px}

.donation a {color:#fff; text-transform: uppercase; letter-spacing: 0.1em}
.socialfeeds {padding-bottom: 30px; padding-top: 30px}

.shopmain {padding-top: 30px; padding-bottom: 30px; text-align: left; color:#fff;}
.shoptext {padding-top: 20px}
.shoptext h3 {font-size: 19px; color:#fff;}

.red {color:#f10000; font-style: italic}

.icon {width: 6%; padding-right: 10px}

.homepost {padding-top: 30px; padding-bottom: 20px}

.homepost h2 {
    font-size: 1.85rem;
}
.homepost h2 a{color: #fff; text-decoration: none;}
/*.homepost h2 a{color: #fff; font-weight: 700; font-size: 24px; padding-top: 30px}*/
.posttext {color:#fff; margin-bottom: 20px;}
.posttext a {background:#fff; padding: 10px; color:#f10000;  text-transform: uppercase; letter-spacing: 0.1em}

.patrons {color: #fff; text-align: center; font-size: 14px; padding-top: 30px; padding-bottom: 30px}
.patrons a {color:#fff; text-transform: uppercase; letter-spacing: 0.1em}
.patrons h2 {font-size: 35px; font-weight: 300; text-transform: uppercase; }

.videos {padding-top: 30px; padding-bottom: 30px}
.videos h2 {color:#fff; text-align: center; font-weight: 300; padding-bottom: 20px}

/* About */

#menuouter {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
    z-index: 13;
    display: flex;
    align-items: center;
    justify-content: center;
}

#menuinner { margin: 0 auto;}

#slidermenu {position: relative;margin: 0 auto; text-align: center}

#menuinner h1 {font-family: 'Roboto', sans-serif; color: #fff; font-size: 90px;}


.ourstory h1 {color: #f10000; font-size: 22px; font-weight: 700}
.ourstory {font-size: 14px; color:#35353f; padding-top: 30px; padding-bottom: 20px}
.img {margin-top: 10px}

.meetteam {padding-top: 30px}

.column-block h3 {font-size: 17px; font-weight: 700; color: #f10000;font-family: 'Roboto', sans-serif; padding-top: 20px}
.column-block {text-align: center; font-size: 12px}
.column-block a:hover {color: #e14558;}
.column-block a {color:#35353f;}.column-block p {margin-top: -8px}

.partners {margin-top: 20px; margin-bottom: 20px}

figcaption {background: #e14558 !important; text-align: center !important}



.envira-gallery-item.envira-lazy-load .envira-title {background: #f10000; padding: 10px; color: #fff;}
.productions {text-align: center; font-size: 13px; padding-top: 30px}

a.envira-pagination-load-more {background: #f10000;  color: #fff; padding: 10px}
div.envira-pagination.envira-pagination-ajax-load-more {text-align: center}

/* ENDORSEMENTS */


/* FOOTER */
footer {background: #fff; padding-bottom: 50px; padding-top: 50px; color:#34363e; font-weight: 700; font-size: 12px}

footer a {color:#34363e}
footer a:hover {color:#e14558}

.menu > li {display: block; }
.menuleft {padding-left: 100px}
.download-btn{
	color: white!important;
	border: 1px solid white;
	padding: 10px 20px;
	border-radius: 5px;
	margin-top: 20px;
	margin-right: 10px;
	margin-bottom: 20px;
}
.download-btn:hover{
	color: black!important;
	border: 1px solid white;
	padding: 10px 20px;
	border-radius: 20px;
	margin-top: 20px;
	margin-right: 10px;
	background-color: white;
}
.phone-separator{
	padding-bottom: 20px!important;
}

.down-titles{
	padding-bottom: 40px;
}

/* CONTACT */

.contactinfo {color:#fff; padding-top: 20px; padding-bottom: 20px; text-align: center; font-size: 14px}
.contactinfo h3 {color: #fff; text-align: center;font-size: 18px; font-weight: 700; font-family: 'Roboto', sans-serif;}

.contactinfo a {color:#fff; font-weight: 700}

.contactenquiry {text-align: center; padding-top: 20px; padding-bottom: 20px}
.contactenquiry  h3 { text-align: center;font-size: 18px; font-weight: 700; font-family: 'Roboto', sans-serif;}

input.wpcf7-form-control.wpcf7-submit{ background: #f10000; float: left; border: 0px; color:#fff; width: 40%; padding-top: 10px; padding-bottom: 10px; text-transform: uppercase; margin-top: 20px}
.single_event_listing .organizer-details a.link-button {background: #f10000 !important; }

div.wpcf7-validation-errors, div.wpcf7-acceptance-missing {border: 1px solid #fff;}

div.wpcf7-validation-errors, div.wpcf7-acceptance-missing {border: 1px solid #fff;}

div.wpcf7-mail-sent-ok{border: 1px solid #fff; font-weight: 700}

#redlogo {float: right; margin-top: -80px}

.downloadables{
	background-color: #1A1A1A;
	color: white!important;
	padding: 50px 0;
}


/* PROJECT */

span.envira-caption.envira-gallery-captioned-text {font-size: 12px !important ; margin-top: 10px !important; line-height: 1.5em !important; height: 180px}

span.envira-title.envira-gallery-captioned-text {text-transform: uppercase;}

.patronimgs .envira-gallery-wrap .envira-gallery-public .envira-gallery-item img
{-webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
    filter: grayscale(100%);}



/*blog */

#blogposts {margin-top: 30px; margin-bottom: 30px}

header.title {background: #1a1a1a; padding-bottom: 4px; padding-top: 4px; padding-left: 20px;}
header.title h3 a {color:#fff; font-family: 'Roboto', sans-serif; font-size: 18px;  text-transform: uppercase;}



.excerpt { margin-top: 20px}

a.post-link{background: #f10000; padding: 10px; color: #fff; margin-top: -10px; margin-bottom: 20px }


#blogposts {margin-top: 210px;}

.blogsingle {margin-top: 30px; font-size: 14px}

.blogsingle h1 {font-size: 25px; font-weight: 700; font-family: 'Roboto', sans-serif;}
.blogsingle h2{font-size: 20px; font-weight: 700; font-family: 'Roboto', sans-serif;}
.blogsingle h3 {font-size: 26px; font-weight: 700; font-family: 'Roboto', sans-serif;}

.blogsingle a {color:#e14558; font-weight: 700}

.half {margin-bottom: 40px}

#date {font-size: 13px; color: #9b9b9b; padding-bottom: 5px}


/*blog pagination numbers */

ul.page-numbers {
list-style: none;
margin: 0;}

.page-numbers:after {
content: ".";
display: block;
clear: both;
visibility: hidden;
line-height: 0;
height: 0;}

ul.page-numbers li {
display: block;
float: left;
margin: 0 4px 4px 0;
text-align: center;
font-weight: 700;}

.page-numbers a,
.page-numbers span {
line-height: 1.6em;
display: block;
padding: 0 6px;
height: 21px;
line-height: 18px;
font-size: 12px;
text-decoration: none;
font-weight: 300;
cursor: pointer;
border: 1px solid #ddd;
color: #888;
}

#pag{margin: 0 auto; text-align: center; float: right; padding-right: 5px; margin-top: 50px; margin-bottom: 30px;}

.page-numbers a span { padding: 0 }


.page-numbers a:hover,
.page-numbers.current,
.page-numbers.current:hover {
color: #fff;
background: #31383e;
text-decoration: none;}
.page-numbers:hover { text-decoration: none }



/*BOARD OF MEMBERS*/

.board h3 {font-size: 20px; font-weight: 700; font-family: 'Roboto', sans-serif;}
.board h4 {font-size: 16px; font-weight: 300; font-family: 'Roboto', sans-serif; margin-top: -10px}

.board p {font-size: 14px}

.board {margin-top: 30px}


.board_new{
	margin: 30px auto;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

.board_members{
    padding: 20px 0; 
    text-align: center;
}

ul#maincontent.tabs a {color:#212121; text-align: center; }

ul#maincontent.tabs img { margin-bottom: 20px}

.tabs {border: none; }
ul#maincontent.tabs a {text-decoration: uppercase}

li.tabs-title {width: 16%;}
.tabs-content {border: none; padding-top: 20px; text-align: center !important; font-size: 12px !important}


.alumni li.tabs-title {width: 25%;}
.event-title h4 {font-size: 16px; color:#ca4558}


/* FILM FESTIVAL SUBMISSION */
.filmsubmission h1 {font-size: 25px; font-weight: 700;font-family: 'Roboto', sans-serif;}
.filmsubmission {font-size: 14px; color:#212121; padding-top: 30px; padding-bottom: 30px}
.filmsubmission img {width: 20%; padding-right: 10px}
.submitdeadline {font-size: 14px; color:#fff; padding-top: 30px; padding-bottom: 30px}

#greybg {background: #f10000; }


/*FESTIVALS */
.festivalmain h1 {font-size: 25px; font-weight: 700;font-family: 'Roboto', sans-serif;}
.festivalmain {padding-top: 30px; padding-bottom: 30px; font-size: 14px}

.howtobook {color:#fff; padding-top: 30px; padding-bottom: 30px; font-size: 13px}

.howtobook h2 {font-size: 18px; font-weight: 700;font-family: 'Roboto', sans-serif;}

.howtobook a {color:#fff; text-decoration: underline}


/*Homepage - Posts */

.img-wrapper {
    height: 350px;
}

.thumbnail{
	object-fit: cover;
}


/*CUSTOM CSS*/

.slick-slide img {
    max-height: 200px;
    width: 100%;
    object-fit: cover;
}

.slick-dots li button {
	display: none;
}

.slick-dots{
	display: flex;
	justify-content: center;
	align-items: center;
}

.slick-dots li {
	position: relative;
	width: 10px;
	height: 10px;
	margin: 0px 5px;
	border-radius: 50%;
	background-color: white;
}

.slick-dots li.slick-active{
	background: rgba(255, 255, 255, 0.20);
}

.flex-direction-nav .flex-next {
	right: 0px!important;
}

.donate-header{
    background-color: #1a1a1a;
    padding: 10px 5px;
    display: flex;
    justify-content: flex-end;
}

.donate-btn{
	padding: 7px 10px;
	border: 1px solid #fff;
	border-radius: 5px;
	color: #fff;
	font-size: 18px;
	margin-left: 10px;
}

.single_event_listing h3 {margin-top: 30px;}

/*Downloaded from https://www.codeseek.co/mahmoudzohdi/slick-slider-syncing-example-WrOJPv */
.slider-for{
	width: 500px;
	height: 250px;
	margin: 30px auto 1px;
	overflow: hidden;
}
img{
	width: 100%;
	min-height: 100%;
}
.slider-nav{
	width: 500px;
	height: 85px;
	margin: auto;
}
.slider-nav .slick-track{
	height: 85px;
}
.slick-arrow{
		position: absolute;
    top: 50%;
    z-index: 50;
    margin-top: -12px;
}
.slick-prev{
	left: 0;
}
.slick-next{
	right: 0;
}

@media screen and (max-width: 1023px) {
	#headbar{
		display: block;
		padding: 2.5rem 10px;
	}
}


/* #Media Queries
================================================== */

/* Small only */
@media screen and (max-width: 39.9375em) {

.leftmenu {width: 50%; float: left; margin-left: 0px}
.rightmenu {width: 50%; float: right; margin-right: 0px }
.logo {width: 50%; margin-top: 0px; margin-left : 0px}

	#headbar {
	  height: 120px;
  left: auto;
  position: absolute;  margin-top: 0px;
  top: auto; width: 100%; z-index: 100;}

	.metaslider {padding-top: 130px}

div#mega-menu-wrap-max_mega_menu_1.mega-menu-wrap { width: 100%; margin: 0 auto; }
.logo {width: 100%}
header { padding-bottom: 0px;}

li.tabs-title {width: 50%;}

.cities h2 { font-size: 16px}
.icon {width: 14%;}
.homeslogan h1 {font-size: 22px; }

.homepost {padding-bottom: 15px}
.homepost h2 a{font-size: 20px; padding-top:0px}
.posttext {font-size: 14px}

.menuleft {display: none}
.menuright {display: none}

.foot {padding-left: 15px}
footer {padding-bottom: 10px;}




#menuinner { padding-top: 30%;}

#menuinner h1 {  font-size: 30px;}


	#mega-menu-wrap-max_mega_menu_1 .mega-menu-toggle .mega-toggle-block-1 .mega-toggle-label { color:#fff}
#mega-menu-wrap-max_mega_menu_1 .mega-menu-toggle .mega-toggle-block-1:after{ color:#fff}

	.socialfeeds {display: none}

	.envira-gallery-public.envira-gallery-3-columns .envira-title {font-size: 12px !important}
	span.envira-caption.envira-gallery-captioned-text {display: none !important}

	header.title {margin-top: 50px}
	.blogsingle img.attachment-post-thumbnail.size-post-thumbnail.wp-post-image {margin-top: 150px}

	div#redlogo {width: 55%}

	a.viewmoreevents {line-height: 40px; font-size: 15px}

	div.event-title {padding-top: 110px;}

}/*** close small **/







/* Medium only */
@media screen and (min-width: 40em) and (max-width: 63.9375em) {

div#mega-menu-wrap-max_mega_menu_1.mega-menu-wrap { width: 100%; margin: 0 auto; }

} /*** close medium **/



/* Custom Menu Query only */
@media screen and (min-width: 1021px) and (max-width: 1188px) {


} /*** close medium **/




/* Large only */
@media screen and (min-width: 64em) and (max-width: 74.9375em) {

}/*** close large**/



/************************ 13inch *********************/
@media all
and (min-width : 800px)
and (max-width : 1280px)  {


.rightmenu {width: 80%; float: right;margin-top: 20px }
	.logo {margin-left: 20px !important}
	#headbar {height: 120px !important}
}




	/************************ 15inch *********************/
@media all
and (min-width : 768px)
and (max-width : 1366px)  {






	#menuouter {position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
    z-index: 13; }
#menuinner { margin: 0 auto; padding-top: 30%;}
#menuinner h1 {font-family: 'Roboto', sans-serif; color: #fff; font-size: 55px;}

	.leftmenu {width: 20%; float: left}
.rightmenu {width: 80%; float: right; margin-right: 0px; margin-top: 20px }
.logo {width: 100%; margin-top: 0px; margin-left : 0px}
	a.mega-menu-link {font-size: 14px !important}


}




	/************************ 19inch *********************/
@media all
and (min-width : 900px)
and (max-width : 1440px)  {


.leftmenu {width: 20%; float: left}
.rightmenu {width: 80%; float: right; margin-right: -10px; margin-top: 20px }
.logo {width: 100%; margin-top: 0px; margin-left : 0px}
	a.mega-menu-link {font-size: 15px}


	#menu {margin-top: 25px}

	#tpcarouselpro-851 .portfolio-item img {height: 140px}

div#slidermenu {padding-top: 0px}

}
.event-ticket{
	display: none;
}
@media only screen and (max-width: 500px) {
.festivalmain{
margin-left: 15px;
}
}
/************************ 20inch *********************/
@media all
and (min-width : 900px)
and (max-width : 1680px)  {
.leftmenu {width: 20%; float: left}
.rightmenu {width: 80%; float: right; margin-right: -130px; margin-top: 20px }
.logo {width: 100%; margin-top: 0px; margin-left : 0px}
a.mega-menu-link {font-size: 15px}
#menu {margin-top: 0px!important}
}

