/* general */
html {
	box-sizing: border-box;
}

*, *:before, *:after {
	box-sizing: inherit;
}

/* clearfix */
.group:before,
.group:after { content: " "; display: table; }
.group:after { clear: both; }

::-moz-selection{ background: #3fb0c3; color: #000; text-shadow: none; }
::selection{ background: #3fb0c3; color: #000; text-shadow: none; }

body {
	color: #333;
	font-size: 18px;
	line-height: 30px;
	font-family: 'Catamaran', sans-serif;
	background: url("../img/cloud.jpg") 50% 45% no-repeat;
	background-size: cover;
	background-attachment: fixed;
	-webkit-font-smoothing: antialiased;

	overflow-x: hidden;
}

h1, h2, h3, h4, h5, h6 {
	font-weight: 500 !important;
}


a {
	color: #000;	/* #6FB7E9 #fff*/

}

a:hover,
a:focus {
	color: #3fb0c3;	/* ##6FB7E9 , fff */
	text-decoration: none;
}

p {
	font-size: 18px;
	line-height: 28px;
}

ul.clean-li {
	list-style-type : none;
	padding-left: 20%;
}

.fa-3 {
	font-size: 4em;
}

.fa-facebook-official {
	vertical-align: middle;
	font-size: 30px;
	color: #333;
	color: #8b9dc3;
}

a .fa-facebook-official:hover {
	color: #3b5998;
}

.fa-youtube-play {
	vertical-align: middle;
	font-size: 30px;
	color: #333;
	color: #FF6666;
}

a .fa-youtube-play:hover {
	color: #FF0000;
}

.quote {
	font-family: 'Kaushan Script', cursive;
	font-family: 'Courgette', cursive;
	line-height: 25px;
}

.main-quote {
	padding-left: 10em;
	padding-top: 1.5em;
}

/* --- Hlavička --- */

header {
	/*background: url("../img/logo-kostol.png") no-repeat;*/

	padding-top: 1em;
	/*margin-bottom: 3em;*/
	/*background-color: #fff;*/
}

.logo a {
	opacity: 0.5;
	position: relative;
	top: 7em;
}

.logo a:hover,
.logo a:focus {
	opacity: 1;
}

.cover {
	background: url("../img/cover_1.png") no-repeat;
    height: 202px;
    position: relative;
}

article h2 {
	padding: 0;
}

section header { 
	background: transparent;
}

.main {
	margin-top: 2em;
	margin-bottom: 3em;

	padding: 1em;

	background: url("../img/000/halftone.png");
	box-shadow: 0 0 20px rgba(0,0,0,0.6); 
}

article .btn-default {
	background-image: none;
	background: transparent;
	border-radius: 0px;
	/*padding: .5em 5em;*/
    font-size: 1.2em;
    /*width: 80%;*/
}

article .btn-default:hover,
article .btn-default:focus {
	text-shadow: none;
	background-color: #3fb0c3; /* #409f74 */
	color: #fff;
}

.dokumenty span {
	float: right;
}


/* --- Navigacia ---*/

.navbar-nav {
    width: 100%;
    text-align: center;
    color: #fff; /* #ccbb9f */
}

.navbar-nav > li > a {
	color: #fff !important; /* #ccbb9f */
}

.navbar-nav > li {
	float: none;
	display: inline-block;
}

.navbar-default {
	background-image: none;
	background-repeat: no-repeat;
    border: none;
    border-radius: 0;
    box-shadow: none;

	font-size: 18px;
    background-color: #c44732; /* #3b3229 */

    margin-top: 1em;
    margin-left: 1em;
    margin-right: 1em;

}

.navbar-default .navbar-nav>.active>a, 
.navbar-default .navbar-nav>.open>a,
.navbar-default .navbar-nav>.open>a:hover, 
.navbar-default .navbar-nav>.open>a:focus,
.navbar-default .navbar-nav>.active>li:hover,
.navbar-nav li:hover,
.navbar-nav li:focus,
.navbar-nav a:hover,
.navbar-nav a:focus/*,
.navbar-nav .dropdown a:hover,
.navbar-nav .dropdown a:focus,
.navbar-nav .dropdown .open>a:hover,
.navbar-nav .dropdown .open>a:focus*/{
	background: none !important;
	color: #fff !important; /* #ccbb9f */
	box-shadow: none;
}

.navbar-default .navbar-nav>.active>a {
	background: none !important;
	box-shadow: none;
}

.dropdown-menu {

	padding: 0 !important;
	border-radius: 0;
}

.navbar-nav>li>.dropdown-menu {
	font-size: 15px;
	font-style: italic;
	padding: 0;
	margin-top: -10px;
	border-radius: 0;
}

.navbar-nav>li>.dropdown-menu a {
	color: #666;
	padding: 8px 15px;
	border-bottom: 1px solid #e8e8e8;
}

.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus {
	background-color: #3fb0c3 !important; /* #409f74 */
	color: #fff !important;
}


.navbar-nav > li > a {
	position: relative;
	color: #3fb0c3; /* #409f74 */
	text-decoration: none;
}

.navbar-nav > li > a:hover {
	color: #3fb0c3; /* #409f74 */
}

.navbar-nav > li > a:before {
  content: "";
  position: absolute;
  width: 105%;
  height: 3px; /* 2px */
  bottom: -5%; /* 12% */
  left: 0;
  background-color: #3fb0c3; /* #409f74 */
  visibility: hidden;
}

.navbar-nav > li > a:hover:before,
.navbar-nav > li > a:focus:before,
.navbar-nav > li > .active > a,
.navbar-nav > .active > a {
  visibility: visible;
}

.navbar-default .navbar-nav>.active>a:before {
	visibility: visible !important;
}

/* show dropdown menu when hover */

ul.nav li.dropdown:hover > ul.dropdown-menu {
    display: block;    
}

@media (min-width: 979px) {
  ul.nav li.dropdown:hover > ul.dropdown-menu {
    display: block;
  }
}

.navbar-toggle {
	background-color: transparent;
	border: 1px solid #fff;
	border-radius: 0;
}

.navbar-default .navbar-toggle .icon-bar {
	background-color: #fff;
}

.navbar-default button:hover,
.navbar-default button:focus {
	background-color: #3fb0c3 !important;
}

/* slideshow */

.slideshow { 
   	/*margin: 0 auto;*/
    position: relative; 
    width: 50%; /* 700px */ /* 450px / 754px */
    height: 400px; 	/* 350 / 754 */
    /*padding: 10px;*/ 	    
}

.slideshow img {
	background-size: cover;
	position: absolute;
	text-align: center;
	/*border: 3px solid #fff;*/
	/*border-radius: 4px;*/
	box-shadow: 0 0 20px rgba(0,0,0,0.4); 
}

.slideshow > div { 
    position: absolute; 
    top: 10px; 
    left: 10px; 
    right: 10px; 
    bottom: 10px; 
}

.carousel {
	box-shadow: 0 0 20px rgba(0,0,0,0.4);
}

.carousel .btn {
	border: none;
}

.carousel .btn-default {
	background-image: none;
	background-color: #fff;
	background-color: rgba(255, 255, 255, 0.8);
	border-radius: 0px;
	padding: .5em 5em;
    font-size: 1.2em;
}

.carousel .btn-default:hover,
.carousel .btn-default:focus {
	text-shadow: none;
	background-color: #3fb0c3; /* #409f74 */
	color: #fff;
}

.info {
	background-color: #fff;
	background-color: rgba(255, 255, 255, 0.3);
	border: 1px solid #c3bca7;
    /*margin-right: 3em;
    margin-left: -3em;
    margin-top: 2em;*/ 
    text-align: center;

    box-shadow: 0 0 20px rgba(0,0,0,0.4);
}

.info h3 {
	font-size: 20px;
	color: #fff; /* #ccbb9f */
	background-color: #c44732; /* #3b3229 */ 
	margin: 0;
	padding: 12px 0; /* 15px 0 */
}

.info h4 {
	padding-top: 9px; /* 10px */
}

.info p {
	border-bottom: 1px solid #c3bca7;
	margin: 0 20px;
    padding-bottom: 10px;
}

.info p:last-child {
	border-bottom: none;
}

.news p {
	font-size: 18px;
	font-style: italic;
	padding-top: 10px;
}

/*.news {
	border: 1px solid #c3bca7;
    margin-right: -3em;
    margin-left: 3em;
    margin-top: 3em; 
    text-align: center;
}

.news li {
	padding-bottom: .5em;
}

.news a h3 {
	font-size: 20px;
	color: #ccbb9f;
	background-color: #3b3229; 
	margin: 0;
	padding: 35px 0;
	border-radius: 4px;
}

.news a h3 i {
	font-size: 30px;
	padding-left: 1em;
}

.news h4 {
	padding-top: 10px;
	background-color: #3b3229;
	color: #ccbb9f;
}

.news a h3:hover,
.news a h3:focus {
	color: #3b3229;
	background-color: #ccbb9f;
}*/

article {
	/*border-top: 2px solid #c3bca7;*/
	padding-top: 1em;
}

hr {
	color: #333;
	border-bottom: 1px solid #c3bca7;
}


.thumbnail-grid {
	user-select: none;
	padding: 10px;
}
.thumbnail-grid figure {
	position: relative;
	min-width: 100%;
	height: 180px;
	/*margin: 5px;*/
	/*padding: 1em;*/
	/*border-radius: 3px;*/
	box-shadow: inset 0 -40px 0 0 rgba(0, 0, 0, 0.3);
	transition: all .2s ease-in-out;

	border: 1px solid #ddd;
	box-shadow: 0 0 20px rgba(0,0,0,0.4);
}
.thumbnail-grid figure:hover {
	box-shadow: inset 0 -180px 0 0 rgba(0, 0, 0, 0.6)
}
.thumbnail-grid figcaption {
	position: absolute;
	width: 100%;
	font-size: 22px;
	font-weight: 500;
	text-align: center;
	color: #f4f4f4;
	text-shadow: 0 0 3px black;
	bottom: 10px;
	transition: all .2s ease-in-out
}
.thumbnail-grid figure:hover figcaption {
	color: #3fb0c3; /* #409f74 */
	bottom: 70px
}
.flex {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-around;
	align-items: stretch;
	align-content: stretch
}
.flex-item {
	flex: 1 0 auto
}

.thumbnail-grid figure.i1 {
	background: url(../img/foto/deti/uprava_web_mail_153.JPG) no-repeat center;
	background-size: cover
}
.thumbnail-grid figure.i2 {
	background: url(../img/foto/spevokol/Ine/uprava_web_mail_129.JPG) no-repeat center;
	background-size: cover
}
.thumbnail-grid figure.i3 {
	background: url(../img/foto/konfirmanti-a-mladez/Svit-2015/IMG_20150508_112107_1.jpg) no-repeat center;
	background-size: cover
}
.thumbnail-grid figure.i4 {
	background: url(../img/foto/kostol/sobota-farar-kazen.jpg) 50% 20% no-repeat;
	background-size: cover
}
.thumbnail-grid figure.i5 {
	background: url(../img/foto/kostol/DSC_0174.jpg) no-repeat center;
	background-size: cover
}

.thumbnail {
	padding: 0;
	background-color: transparent;
	border-radius: 0;
}

.thumbnail .caption {
	background-color: #fff;
	background-color: rgba(255, 255, 255, 0.3);
	text-align: center;

	/*position: relative;
    top: -74px;
    margin-bottom: -74px;*/

	/*top: -180px;
    background-color: rgba(255, 255, 255, 0.6);*/
}

/*.thumbnail .caption a {
	color: ;
}

.thumbnail .caption a:hover,
.thumbnail .caption a:focus {
	color: #3fb0c3;
}*/

.thumbnail .btn-default {
	background-image: none;
	background: transparent;
	border-radius: 0px;
	/*border-top: none;*/
	/*padding: .5em 5em;*/
    font-size: 1.5em;
    /*width: 100%;*/
}

.thumbnail .btn-default:hover,
.thumbnail .btn-default:focus {
	text-shadow: none;
	background-color: #3fb0c3; /* #409f74 */
	color: #fff;
}

.thumbnail .caption {
	/*background-color: #fff;*/
}

.thumbnail .caption a{
	color: #666;
}

/*.thumbnail .caption:hover,
.thumbnail .caption:focus {
	background-color: #3fb0c3;
}*/

.thumbnail .caption a:hover,
.thumbnail .caption a:focus {
	/*color: #fff;*/
	/*text-decoration: underline;*/
	/*background-color: #3fb0c3;*/

	color: #c44732;
}

footer {
	color: #333;
	font-size: 13px;
}

.main-footer a {
	color: #333;
}

footer p {
	text-align: center;
}

.main-footer a,
.main-footer a:hover,
.main-footer a:focus,
.main-footer a:visited {
	color: #3fb0c3; /* #409f74 */
}


.img-thumbnail {
	border: none;
	border-radius: 0;
}


#map-outer {
	/*height: 440px; */
	padding: 20px; 
	/*border: 2px solid #CCC;*/ 
	margin-bottom: 20px; 
	/*background-color:#FFF; */
}
#map-container { 
	height: 400px;
	padding: 20px;
	margin-bottom: 20px; 

	-webkit-box-shadow: 0px 2px 6px 2px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 2px 6px 2px rgba(0,0,0,0.75);
    box-shadow: 0px 2px 6px 2px rgba(0,0,0,0.75);
}

@media all and (max-width: 991px) {
#map-outer  { 
	height: 650px 
}
}

.galeria img {
	margin-top: 1.3em;
}

.img-responsive {
    margin-bottom:20px;
    /*border: 2px solid #fff;*/

    -webkit-box-shadow: 0px 2px 6px 2px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 2px 6px 2px rgba(0,0,0,0.75);
    box-shadow: 0px 2px 6px 2px rgba(0,0,0,0.75);

    transition: all .2s ease;
    /*max-width: 100%;*/
	height: 200px;
    width: 300px;
}

.img-responsive:hover {
	/*border: 2px solid #3fb0c3;*/

	/*width: 110%;*/

	transform: scale(1.2);
}

.img-responsive-no-hover:hover {
	transform: none;
}

.embed-responsive {
	box-shadow: 0 0 20px rgba(0,0,0,0.6);
}

.btn-facebook {
	  background: #3B5998;
	  border-radius: 0;
	  color: #fff;
	  border-width: 1px;
	  border-style: solid;
	  border-color: #263961; 
	}
	.btn-facebook:link, .btn-facebook:visited {
	  color: #fff;
	}
	.btn-facebook:active, .btn-facebook:hover {
	  background: #263961;
	  color: #fff;
	}

.kazen-audio audio {
	width: 70%;
}



@media (max-width: 990px) {
  .logo a {
    top: 0em;
  }
  .info {
  	margin: .6em 0;
  }
  .thumbnail-grid > div {
  	margin-bottom: .5em;
  }
}

@media (max-width: 768px) {
  .btn-responsive {
    padding:2px 4px;
    font-size:80%;
    line-height: 1;
    border-radius:3px;
  }
}

@media (min-width: 769px) and (max-width: 992px) {
  .btn-responsive {
    padding:4px 9px;
    font-size:90%;
    line-height: 1.2;
  }
}

@media (max-width: 655px) {
  .main-quote {
    padding-left: 1em;
	padding-top: 0.5em;
  }
}

@media (max-width: 469px) {
  .main-quote {
  	font-size: 18px;
    padding-left: 0em;
	padding-top: 0em;
  }
  .cover h1 {
  	font-size: 25px;
  }
}