body{
    font-family: 'Playfair Display', serif;  
    background: #f1f1f1;
}
a,a:hover{
    transition-delay: 0s;
    transition-duration: 0.5s;
    transition-property: all;
    transition-timing-function: ease;
    color: #a8874e;
}
a:hover{
    text-decoration: none;  
    color: #fff;
}
p{
    font-size: 14px;  
    font-family: 'Lato', sans-serif;
}
.fleft{
    float:left;   
}
.container-fluid{
    padding-left:10em;
    padding-right:10em;
}
.navbar-default.navbar-shrink{
    background: rgb(0,0,0);
    background: rgba(0,0,0,0.8);
    padding-bottom: 20px;
    padding-top: 20px;
}
div#video{
    width: 100%;
    height: auto;
    max-height:100vh;
    margin:0;
    overflow: hidden;
    background: url("../img/orphica-formacia.jpg") center left no-repeat;
    background-size: cover;
    float: left;
    position: relative;
}
video {
  width: 100%    !important;
  height: auto   !important;
  float: left;
  margin: 0;
  opacity: 1;
  transition: opacity 0s ease 0s;
}
#section10 a {
	padding-top: 60px;
}
#section10 a span {
	position: absolute;
	top: 0;
	left: 50%;
	width: 45px;
	height: 45px;
	margin-left: -15px;
	border: 2px solid #fff;
	border-radius: 50%;
	box-sizing: border-box;
}
#section10 a span::before {
	position: absolute;
	top: 10px;
	left: 50%;
	content: '';
	width: 6px;
	height: 6px;
	margin-left: -3px;
	background-color: #ebcc7a;
	border-radius:50px;
	-webkit-animation: sdb10 2s infinite;
	animation: sdb10 1.5s infinite;
	box-sizing: border-box;
}
@-webkit-keyframes sdb10 {
	0% {
		-webkit-transform: translate(0, 0);
		opacity: 0;
	}
	40% {
		opacity: 1;
	}
	80% {
		-webkit-transform: translate(0, 20px);
		opacity: 0;
	}
	100% {
		opacity: 0;
	}
}
@keyframes sdb10 {
	0% {
		transform: translate(0, 0);
		opacity: 0;
	}
	40% {
		opacity: 1;
	}
	80% {
		transform: translate(0, 20px);
		opacity: 0;
	}
	100% {
		opacity: 0;
	}
}
.demo a {
	position: absolute;
	bottom: 20px;
	left: 50%;
	z-index: 2;
	display: inline-block;
	-webkit-transform: translate(0, -50%);
	transform: translate(0, -50%);
	color: #fff;
	font : normal 400 20px/1 'Josefin Sans', sans-serif;
	letter-spacing: .1em;
	text-decoration: none;
	transition: opacity .3s;
}
#section10 a span:hover {
	border: 2px solid #ebcc7a;
}
.navbar-default .nav li{
        padding-right:15px;
    padding-left:15px;   
}
.navbar-default .nav li a{
    color: #fff;  
    font-family: 'Ubuntu Condensed', sans-serif;
    font-size: 16px;
    letter-spacing: 0.1em;
    padding-right:0;
    padding-left: 0;
    padding-bottom:10px;
}
.navbar-default .nav li a:hover{
    color:#ebcc7a;   
}
.navbar-default .navbar-nav > .active > a{
    color:#ebcc7a;   
    background: transparent;
    border-bottom: 1px solid #ebcc7a;
}
.navbar-default .navbar-nav > .active > a:hover,.navbar-default .navbar-nav > .active > a:focus{
    background: transparent;
    color:#ebcc7a;
}
ul.cl-effect-4 a::after {
	position: absolute;
	top: 100%;
	left: 0;
	width:100%;
	height:0.5px;
	background: #ebcc7a;
	content: '';
	opacity: 0;
	-webkit-transition: height 0.3s, opacity 0.3s, -webkit-transform 0.3s;
	-moz-transition: height 0.3s, opacity 0.3s, -moz-transform 0.3s;
	transition: height 0.3s, opacity 0.3s, transform 0.3s;
	-webkit-transform: translateY(-10px);
	-moz-transform: translateY(-10px);
	transform: translateY(-10px);
}
ul.cl-effect-4 a:hover::after,
ul.cl-effect-4 a:focus::after {
	height: 3px;
	opacity: 1;
	-webkit-transform: translateY(0px);
	-moz-transform: translateY(0px);
	transform: translateY(0px);
}
.logo{
    width: 150px;   
}
.navbar-brand{
    padding: 0;   
}
section{
    padding-top:70px; 
    padding-bottom:70px;
}
.gold{
    background: #c2a677; /* fallback for old browsers */
    background: -webkit-linear-gradient(to left, #c2a677 , #e1c89f); /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to left, #c2a677 , #e1c89f); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */      
    background-repeat: repeat;
    height: auto;
    min-height:540px;
    position: relative;
    z-index: 1;
    overflow: hidden;
    padding:2em;
}
.white-header{
    background:#fff;
    height:100px;
    padding: 0px 2em 20px;
}
.white, .grey{
    background: #fff;
    height: auto;
    min-height:480px;
    padding:2em;
}
.grey{
   background: #f8f8f8;
    margin-bottom: 3em;
}
.noPaddingRigh{
    padding-right: 0 !important;
}
.video-latest{
    margin-bottom: 1.5em;
    margin-left: 1.5em;
    margin-top: 2.5em;
}
.noPaddingLeft{
    padding-left: 0;   
}
.noPaddingRight{
    padding-right: 0;   
}
.noPadding{
   padding-left: 0; 
    padding-right: 0;   
}
.white h2, .event h3{
   color: #222; 
    font-size:40px;
    font-family: 'Playfair Display', serif;
    font-weight:500;
    letter-spacing: 0.1em;
    margin-bottom:1em;
    margin-left: 0.5em;
}
.events-container{
    margin-top:1em;
    margin-left:3em;
}
.event h3{
  font-size:35px;
    margin-bottom:0;
    margin-left:1em;
}
.event h4{
    font-size:18px;
}
.event h4 a{
    font-family: 'Ubuntu Condensed', sans-serif;
    letter-spacing: 0.1em;
    font-weight:500;
    color:#333;
}
.event h4 a:hover{
    color:#887351;
}
hr{margin-left:2.5em;}
.date{
   font-family: 'Ubuntu Condensed', sans-serif;    
}
blockquote{
    font-weight:300;
    font-size:19px;
    font-style: italic;
    width:100%;
    letter-spacing: 3px;
    margin-top:1em;
    margin-bottom:1em;
    border-left: none;
}
.golden{
    margin-left:1.5em;
    width:60%; 
    border-top-color:#c2a677;
}
#playlist,audio{
    background:rgba(34,34,34,1);
    width:650px;
    padding:20px 30px;
    margin-left:2em;
    box-shadow: 0 1px 50px 0 rgba(0, 0, 0, 0.2);
}
audio{
    margin-top:2em; 
}

#playlist li{
    margin-bottom: 0.5em;
    list-style-type:none;
}
#playlist li a{
  color: #ebcc7a;
    font-size:16px;
}
#playlist li a:hover{
    color:#fff;
}
.centered{
    margin-left: auto;
    margin-right: auto;
    padding-left: 1em;
}
ul.social-buttons li a:hover{
    background: #c2a677;   
}

.btn-more{
    margin:3em 2em;
}
.btn-more a{
    color:#fff;
    border:1px solid #fff;
    padding:1em 2.5em;
    font-size: 16px;
}
.btn-more a:hover{
    background: #fff;  
    color:#c2a677;
    border:1px solid #fff;
}
.gold-btn{
    margin-left:0;   
}
.gold-btn a{
    border:1px solid #c2a677;
    background:#c2a677;
    color:#fff;
}
.gold-btn a:hover{
    border:1px solid #c2a677;
    background:#fff;
    color:#c2a677;
}
.stopfade { 
    opacity: 0.5; 
}
#video button{ 
  display: block;
  border: none; 
  font-size: 1.3em;
  background: none;
  color: #fff;
  cursor: pointer;
  -webkit-transition: .3s background;
  transition: .3s background;
    margin-top:0.4em;
    margin-left:0.4em;
    font-family:"Ubuntu Condensed",sans-serif;
}
video.fade {
	opacity: 0.5;
	transition: opacity 1s ease 0s;
}
.pause-button{
    border: 2px solid #fff;
	border-radius: 50%;
    cursor: pointer;
    display: block;
    height: 45px;
    position: absolute;
    right:7em;
    bottom:60px;
    width: 45px;
    z-index: 300;
    font-family: 'Comfortaa', cursive;
}
.pause-button:hover{
    border: 2px solid #c2a677;   
}
.image-responsive{
    background: url("../img/issoty-bg.jpg");  
    height:540px;
}
.navbar-default .navbar-toggle{
    background: transparent;
}
.navbar-toggle, .navbar-default .navbar-toggle:focus, .navbar-default .navbar-toggle:hover{
    border: none;
    background: transparent;
}
.navbar-default .navbar-toggle .icon-bar{
    background-color:#fff !important; 
    width: 30px;
}
#about{
    padding-top:120px;
    padding-bottom: 0;
}
.relative{
    position: relative;
}

section.module.parallax {
    min-height:550px;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover;
    z-index:0;
    overflow: hidden;
}
section.module.parallax-1{
    background-image:url("../img/events.jpg");
}
.header-2{
    height: auto;
    margin-bottom: 0;
    margin-left: 0;
    margin-right: 0;
    margin-top: 0;
    overflow-x: hidden;
    overflow-y: hidden;
    padding-right: 0;
    position: relative;
    width: 100%;
}
.ornament{
    margin-left: 0;
    width: 550px;   
}
.overlay{
    height: auto;
    min-height:500px;
    width: 100%;
} 
#media,#events{
    padding-top:20px; 
    padding-bottom:20px;
}
#contacts{
    padding-top:10px; 
    padding-bottom:10px;   
}
.gold-overlay h3{
    margin-bottom: 1em;
    color: #333;
    font-family:"Ubuntu Condensed",sans-serif;
    font-size: 27px;
    font-weight: 300;
}
.marginTop{
    margin-top: -100px;   
}
.margin{
    margin-left: auto;
    margin-right: auto;
}
.noMarginleft{
    margin-left:0 !important;   
}
.marginLeft{
    margin-left: 2em;   
}
.inner-p{
    width: 60%;
    margin-bottom: 1em;
}
.inner-title{
    color:#c2a677; 
    font-family: 'Playfair Display', serif;  
    text-transform: none;
    margin-top: 1em;
}
.row {
    margin-right: 0px;
}
/* ==========================================================================
   Media Queries
   ========================================================================== */
@media screen and (min-width:992px) and (max-width:1680px){
   blockquote{font-size:19px;}   
    .ornament{width:550px;margin-top:1.5em;}
    .white h2, .event h3{font-size: 35px;}
}
/* Tablet */
@media screen and (min-width: 767px) and (max-width: 992px){
    #playlist, audio{width:650px;}
    .ornament{width:550px;margin-top: 2em;}
    .container-fluid{padding-left:2em;padding-right:2em;}
    #about,#events,#media{padding-bottom:0;padding-top:0;}
}

/* Mobile HD */
@media screen and (min-width: 420px) and (max-width: 766px){
    #playlist, audio{width:500px;}
    .ornament{width:550px;margin-top: 2em;}
    blockquote{margin-bottom: 0.2em;font-size:20px;}
    #playlist, audio{width:410px;}
    .container-fluid{padding-left:2em;padding-right:2em;}
    .marginTop,.margin-top2{margin-top:0;}
    #about,#events,#media{padding-bottom:0;padding-top:0;}
}
@media screen and (min-width: 768px) and (max-width: 844px){
    .navbar-default .nav li a{font-size: 14px;}
    .container-fluid{padding-left:2em;padding-right:2em;}
    .marginTop,.margin-top2{margin-top:0;}
}
/* Smallest PC */
@media screen and (min-width: 992px) and (max-width: 1280px){
    blockquote{margin-bottom: 0.5em;}
    .ornament{width:550px;margin-top:1.5em;}
    .white h2, .event h3{font-size: 35px;}
}
@media screen and (min-width: 992px) and (max-width:1080px){
    #about,#events,#media{padding-bottom:0;padding-top:0;}
}

/* Medium PC */
@media screen and (min-width:1180px) and (max-width:1280px){
    #playlist, audio{width:520px;}   
}
@media screen and (min-width:992px) and (max-width:1180px){
    #playlist, audio{width:400px;}   
}
@media screen and (min-width: 1280px) and (max-width: 1380px){
    .white{padding-top:0;}
    blockquote{margin-bottom: 0.5em;}
    #playlist, audio{width:550px;}
}
@media screen and (min-width: 1380px) and (max-width: 1691px){
    blockquote{margin-bottom: 0.5em;}
    #playlist, audio{width:650px;}
}
@media screen and (min-width: 1692px) and (max-width: 1840px){
    #playlist, audio{width:650px;}
}
@media only screen and (max-width: 365px) {
    #playlist, audio{width:500px;}
    .ornament{width:550px;margin-top: 2em;}
    blockquote{margin-bottom: 0.2em;font-size:20px;}
    .container-fluid{padding-left:2em;padding-right:2em;}
    #playlist, audio{width:300px;}   
    .marginTop,.margin-top2{margin-top:0;}
}
@media (max-width: 768px) /* @grid-float-breakpoint -1 */
{
    .navbar-fixed-top
    {
    position: relative;
    top: auto;
    }
    .navbar{margin-bottom: 0px;}
    #about{padding-top:0;}
    #media, #events{padding-bottom:0;padding-top:0;}
    .container-fluid{padding-left:2em;padding-right:2em;}
    #playlist, audio{width:300px;}   
    .marginTop,.margin-top2{margin-top:0;}
}