/* --- section bg var --- */
.img-fluid{ max-width: 100%; height: auto; }
.bg-white{background: #fff;}
.bg-gray {background: #f8f8f8;}
.bg-dark {background: #575757;}
.bg-light {background:#E4E4E4;}
.bg-babyblue{background:#163571;}
.bg-red{background: #A40002;}
.blueColour{color:#163571;}
.headerBackgrounds{text-align:center;}
.black{ color:#272727;}
.bg-yellow{background:#ffcf01;}

.btn:focus, .btn:active, button:focus, button:active {
  outline: none !important;
  box-shadow: none !important;
}
.container-fluid{max-width: 100%;min-width: 450px;margin: 0 auto;}


/* --- section color var --- */

.text-light {color: #BBBBBB ; text-shadow: 0.5px 0.5px  rgba(217,217,217,0.10); -webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale; font-weight:400;}

.text-white {color: #F8F8F8; text-shadow: 0.5px 0.5px  rgba(217,217,217,0.10); -webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;}

	
.text-dark {color:#424242; text-shadow: 0.5px 0.5px  rgba(217,217,217,0.10); -webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale; font-weight:400; font-size: 15px;}	

.text-black {color:black; text-shadow: 0.5px 0.5px  rgba(217,217,217,0.10); -webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale; font-weight:400;}	

.text-red{color:#A40002;}

.text-green{color:#0ECD1E0; text-shadow: 0.5px 0.5px  rgba(217,217,217,0.10); -webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;}


.text-babyblue {color:#163571; text-shadow: 0.5px 0.5px  rgba(217,217,217,0.10); -webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;}

.text-green {color:#21b573; text-shadow: 0.5px 0.5px  rgba(217,217,217,0.10); -webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;}

.mainBackground {background-color:rgba(0, 0, 0, 0.1);   background-blend-mode: luminosity ; ; 
    background-size: cover no-repeat center center fixed; min-width: 450px;
}	
.mainBackground2 {background-color:rgba(0, 0, 0, 0.1);   background-blend-mode: luminosity; position:fixed;   min-width: 100%; 
  min-height: 100%;
	
transform: translate(-50%, -50%);
 
  top: 50%;
  left: 50%;;
}	
.fixedBorder{height: 100%; width: 10px; position: fixed; z-index: 999994264564599; top: 0px; left: 0px; background-color:white;}
.fixedBorder2{height: 100%; width: 10px; position: fixed; z-index: 9999994564564569; top: 0px; right: 0px; background-color:white;}
.fixedBorder3{height: 20px; width: 100%; position: fixed; z-index: 9999456456456456999; bottom: 0px; left: 0px; background-color:white;}
.map-container{
overflow:hidden;
padding-bottom:56.25%;
position:relative;
height:0;
}
.map-container iframe{
left:0;
top:0;
height:100%;
width:100%;
position:absolute;
}






#myVideo {
  

  min-width: 100%; 
  min-height: 100%;
	
transform: translate(-50%, -50%);
  position: fixed;
  top: 50%;
  left: 50%;
}




.offsetBottom{margin-bottom:120px;}

a,.tp-caption a.btn:hover {color:#fff;}

.top-nav-collapse {background-color:rgba(0,0,0,0.50);}

.navbar-custom ul.nav ul.dropdown-menu li a:hover {color: #000; }

.widget-avatar .avatar:hover { border: 5px solid #67b0d1;}

.bg-skin {background: #67b0d1;}

form#contact-form input:focus,form#contact-form select:focus,form#contact-form textarea:focus {border-color: #FFB600;}

footer {background-color: #FFFFFF;}

/* --- FORMATTING!--- */

h2 {margin: 0 0 30px;   text-transform: uppercase;    font-family: Montserrat,sans-serif;    font-weight: 900;    letter-spacing: 2px;	font-size:40px;}

h3 {margin: 0 0 15px;    text-transform: uppercase;    font-family: Montserrat,sans-serif;    font-weight: 500;    letter-spacing: 0px;	font-size:25px;}

h4 {margin: 0 0 0px;    text-transform: uppercase;    font-family:Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif"sans-serif;    font-weight: 800;    letter-spacing: 1px;	font-size:16px;}

h5 {margin: 0 0 0px;    text-transform: uppercase;    font-family: Montserrat,sans-serif;    font-weight: 800;    letter-spacing: 0px;	font-size:15px;z-index: 0;}
h9 {margin: 0 0 0px;    text-transform: uppercase;    font-family: Montserrat,sans-serif;    font-weight: 800;    letter-spacing: 0px;	font-size:15px;z-index: 0;}

p2 {margin: 0 0 20px;    font-size: 20px;    line-height: 1.6em;	font-weight:700;}

p2.lead {font-weight: 600;}

.btn-skin {color: #fff;  background-color: #FFB600;  border-color: #FFB600;}

.home-section {top:0px; padding-top: 0px; padding-bottom:0px; display:block; position:relative; z-index:120; height:100%; width:100%; -webkit-background-size: cover;  -moz-background-size: cover;  -o-background-size: cover;  background-size: cover;}

/* --- CREATIVE ABOUT SECTION --- */

.creative-section {background-color:  white;  top:0px; padding-top:0px; padding-bottom: 0px; margin-top: 0px; min-width: 455px;display:block; position:relative; border: 0; z-index:120;}

.creativeLeft{ position:relative; height:100%;  width:100%; padding-top:0px; padding-bottom:50px;}
.creativeLeftPic{ position:relative; height:450px;  width:100%; background-image: url("../img/Picture/Wallpaper1.jpg"); background-size:cover;}
.creativeRight1{position:relative; height:400px; width:100%; padding-top:50px; padding-bottom:0px; background-image: url("../img/Picture/sidefood.jpg");background-size: cover;}
.creativeRight{position:relative; height:100%; width:100%; padding-top:50px; padding-bottom:0px; background-size: cover; 
  margin: -10px -10px 0px 0px;}

.creativeRight1:hover {  background-color: #3e8e41;  color: white;}

.creativeLeftPic:hover {  background-color: #3e8e41;  color: white;}


.footer-section{background-color:  white;  text-align: center; top:0px; padding-top:0px;  min-width: 455px; padding-bottom: 0px; margin-top: 0px; display:block; position:relative; z-index:120;}
 
 /* --- LIBRARY SECTION --- */

.menu-section {top:0px; padding-top: 0px; padding-bottom: 0px; display:block; position:relative; z-index:125; background-color:#FFFFFF; min-width: 455px; margin-top:-30px }

.foodTitle {display:inline;float: left; position:relative; text-align: left; z-index:125; }


.menuBackground {top:0px; padding-top: 0px; padding-bottom: 0px; height:1000px; margin-left:auto; margin-right: auto; display:block; position:relative; z-index:125; background-image:url(../img/comics.jpg); background-repeat:no-repeat; background-position:center top;}
.menu-selection{top:0px; padding-top:25px;display:block; width:100%; position:relative;z-index: 6546464;}
.menu-frameContainer{position:relative; display: block;}
.menu-frame{position:relative; display:block;height:auto; border-left:2px solid #E4E4E4; border-right:2px solid #E4E4E4; padding-bottom:25px;}
.menu-frame-picture{height:100%; width:100%; position:relative;}
.menu-frame-title{height:100%; width:100%; position:relative; background-color:#FFFFFF; padding-top:20px; padding-bottom:20px;}
.menu-blog{}

.nav2{
    border:1px solid #000;
    border-width:1px 0;
    list-style:none;
    margin:0;
    padding:0;
    text-align:center;
}
.nav2 li{
    display:inline;
}
.nav2 a{
    display:inline-block;
    padding:10px;
}



.menuLeft{ position:relative; height:100%;  width:100%; padding-top:25px; padding-bottom:50px; text-align: left;}
.menuRight{position:relative; height:100%; width:100%; padding-top:25px; padding-bottom:50px;text-align: left; display:inline-block;}

.no-gutter > [class*='col-'] {
    padding-right:0;
    padding-left:0;
}


 /* --- ABOUT SECTION --- */

.gallery-section {background-color: white; top:0px; padding-top: 0px; padding-bottom: 0px; min-width: 455px;display:block; position:relative; z-index:15545554; height:auto;}
.aboutLeft{ position:relative; height:100%;  width:100%; padding-top:25px; padding-bottom:25px;}
.about-information {top:0px; padding-top:50px; padding-bottom: 50px; display:block; position:relative; z-index:120; }
 /* --- HERO SECTION --- */

.menu-section {background-color: white; padding-top:0px; padding-bottom: 0px; display:block; position:relative; z-index:440; }
.hero-information {top:0px; padding-top:50px; padding-bottom: 50px; display:block; position:relative; z-index:120;}
.hero-member{ box-sizing:border-box; margin-bottom:50px;}
.img-circle{ border-radius:100%; vertical-align:middle;}
.img-responsive{ max-width:75%; height:auto; display:block;}
.hero-img{ vertical-align:middle; position:relative; border:10px solid #FFFFFF; margin-left:auto; margin-right:auto;}


 /* --- CONNECT SECTION --- */
.connect-section {background-color:white; padding-top:0px; padding-bottom:0px; min-width: 455px; display:block; position:relative; z-index:6546;}
.connect-section2 {top:0px; padding-top:10%; padding-bottom:0px; display:block; position:relative; z-index:1265440;}


.navbar .navbar-nav {display: inline-block;  float: none;  vertical-align: top;  text-align: center;  white-space:nowrap;z-index:99999999999999999999;}

.navbar .navbar-collapse {text-align: center;  z-index:99999999999999999999;}

.navbar-brand {font-weight:700;}

 .navbar {
  min-height: 70px;
}

.navbar-brand {height: 75px;  padding: 5px 15px;  font-size: 18px;  line-height: 1em; z-index:99999999999999999999;}

.logoCenter{position:relative; padding-top:450px; padding-bottom:100px; height:80px; width:100%; text-align:center; color:#FFFFFF; letter-spacing: 1px; font-size:30px;}

/* Responsive layout - makes a two column-layout instead of four columns */
@media screen and (max-width: 800px) {
  .column {
    -ms-flex: 50%;
    flex: 50%;
    max-width: 50%;
  }
}

/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 768px) {
  .column {
    -ms-flex: 100%;
    flex: 100%;
    max-width: 100%;
  }
}


.rowGallery {
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -ms-flex-wrap: wrap; /* IE10 */
  flex-wrap: wrap;
  padding: 10px 10px 10px 10px;
}

/* Create four equal columns that sits next to each other */
.columnGallery {
  -ms-flex: 33.000%; /* IE10 */
  flex: 33.333%;
  max-width: 33.333%;
  padding: 10px 10px 10px 10px;
}

.columnGallery img {
  margin-top: 10px;
  vertical-align: middle;
  width: 100%;
}

* {
  box-sizing: border-box;
}







.zoom2 {
  transition: transform .2s;
  margin: 0px 0px 0px 0px;
}

.zoom2:hover {
  -ms-transform: scale(1.1); /* IE 9 */
  -webkit-transform: scale(1.1); /* Safari 3-8 */
  transform: scale(1.1); 
}



#myImg {
  border-radius: 5px;
  cursor: pointer;
  transition: 0.3s;
}

#myImg:hover {
  opacity: 0.7;
}

.modal {
  display: none;
  /* Hidden by default */
  position: fixed;
  /* Stay in place */
  z-index: 1;
  /* Sit on top */
  padding-top: 100px;
  /* Location of the box */
  left: 0;
  top: 0;
  width: 100%;
  /* Full width */
  height: 100%;
  /* Full height */
  overflow: auto;
  /* Enable scroll if needed */
  background-color: rgb(0, 0, 0);
  /* Fallback color */
  background-color: rgba(0, 0, 0, 0.9);
  /* Black w/ opacity */
}

.modal-content {
  margin: auto;
  display: block;
  width: 80%;
  max-width: 700px;
}

#caption {
  margin: auto;
  display: block;
  width: 80%;
  max-width: 700px;
  text-align: center;
  color: #ccc;
  padding: 10px 0;
  height: 150px;
}

.modal-content,
#caption {
  animation-name: zoom;
  animation-duration: 0.6s;
}

@keyframes zoom {
  from {
    transform: scale(0)
  }
  to {
    transform: scale(1)
  }
}

.close {
  position: absolute;
  top: 70px;
  right: 10px;
  color: #f1f1f1;
  font-size:100px;
  font-weight: bold;
  transition: 0.3s;
	width: 100%;
	height: 100%;
	z-index: 99999999;
}

.close:hover,
.close:focus {
  color: #bbb;
  text-decoration: none;
  cursor: pointer;
}

@media only screen and (max-width: 700px) {
  .modal-content {
    width: 100%;
  }
}


.myImages {
  transition: transform .2s;
  margin: -10px -10px 0px 0px;
}

.myImages:hover {
  -ms-transform: scale(1.1); /* IE 9 */
  -webkit-transform: scale(1.1); /* Safari 3-8 */
  transform: scale(1.1); 
}