@import url('https://fonts.googleapis.com/css?family=Smythe');

body{
	padding: 0;
	margin: 0 auto;
	font-size: 19px;
	font-weight: 200;
	line-height: 142%;
	color: #333;
	font-family: "lft-etica",sans-serif;
}


body, p, input, textarea, select 
{
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	-moz-font-smoothing: antialiased;
	-o-font-smoothing: antialiased;
	font-smoothing: antialiased;
}

h1, h2{
	-webkit-margin-before: 0px;
	-webkit-margin-after: 0px;
	margin: 2em;
	font-size: 4em;
	font-weight: 400;
	line-height: 90%;
	text-shadow: 2px 2px rgba(0,0,0,0.3);
	font-family: 'Smythe', cursive;
}

* {
  -webkit-transition: all 0.2s ease;
  -moz-transition:    all 0.2s ease;
  -ms-transition:     all 0.2s ease;
   transition:      all 0.2s ease;
}
/* [++] css da pagina index.php */

/*___ [+] Conteudo do header ___*/
.header{
	display: flex;
	flex-direction: column;
	align-items: center;
	min-height: 500px;
	padding-bottom: 70px;
	background: #FBECCF;
}

.header-logo{
	margin: 40px 0 46px 0;
}

.header h1{
	-webkit-margin-before: 0px;
	-webkit-margin-after: 0px;
	max-width: 140vh;
	font-size: 4em;
	font-weight: 400;
	line-height: 90%;
	text-align:center;
	font-family: 'Smythe', cursive;
}

.video-button{
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 200px;
	height: 60px;
	margin-top: 50px;
	padding: 0 10px 0 25px;
	border-radius: 56px;
	font-size: 16px;
	font-weight: 600;
	text-transform: uppercase;
	text-decoration: none;
	color: #b7540d;
	box-shadow: 0px 7px 0px -2px rgba(0,0,0,0.27);
	background: #fff;
	transition: 0.3s color, 0.3s background;
}

.video-button i{
	display: flex;
	justify-content: center;
	align-items: center;
	width: 35px;
	height: 40px;
	padding-left: 5px;
	border-radius: 60px;
	font-size: 10px;
	text-align: center;
	color: #fff;
	background: #b7540d;
	transition: 0.3s color, 0.3s background;
}

.video-button:hover, .video-button:focus{
	color: #fff;
	background:  rgb(183, 84, 13);
}

.video-button:hover>i{
	color: #b7540d;
	background: #fff; 
}

/*___ [-] Conteudo do header ___*/

/*___ [+] Conteudo da Colecao ___*/

.colecao{
	display: flex;
	flex-direction: column;
	align-items: center;
	padding-bottom: 150px;
	background: url('/assets/img/fundo/livros.jpg') center;
	background-repeat: no-repeat;
	background-size: cover;
}

.colecao h2{
	color: #fff;
	margin:1em 0;
}

.colecao-cards{
	/* background-color: yellow; */
	display: flex;
	flex-wrap: wrap;
	justify-content: space-evenly;
	align-content: center;
	width: 100%;
	max-width: 90%;
}

.colecao-cards-item{
	display: flex;
	background-color: rgb(255, 255, 255);
	border-radius: 20px;
	width: 15%;
	/* margin: 60px 5px 20px 5px; */
	margin-top:30px;
	transition: box-shadow 500ms;
}

.colecao-cards-item:hover, .colecao-cards-item:focus{
	box-shadow: inset 0px 0px 8px 0px rgba(0, 0, 0, 0.5);
}

.colecao-cards-item a{
	display: flex;
	flex-direction: column;
	text-decoration: none;
	text-align: center;
}

.colecao-cards-avatar{
	width: 100%;
	/* height: 100%; */
	margin: -60px 0 0 0;
	object-fit: contain;
}

.colecao-cards-item p{
	padding: 25px 30px;
	font-size: 90%;
	text-align: center;
	color: #757575;
	height: 100%;
}


.colecao-cards-simb{
	width: 30px;
	height: 30px;
	border: 5px solid #fff;
	border-radius: 60px;
	margin: 0 auto -20px auto;
}

/*___ [-] Conteudo da Colecao ___*/

/*_____ [+] Conteudo Sobre ______*/

.sobre{
	display: flex;
	flex-direction: column;
	align-items: center;
	padding-bottom: 50px;
	background: url('/assets/img/fundo/sobre-2.png') center;
	background-size: cover;
	background-repeat: no-repeat;
}

.sobre h2{
	color: #fff;
	margin:1em 0;
}

.sobre-cards{
	display: flex;
	justify-content: center;
	align-items: baseline;
	width: 100%;
	max-width: 1200px;
	flex-wrap: wrap;
}

.sobre-cards-item{
	display: flex;
	align-items: center;
	flex-direction: column;
	color: #fff;
	text-decoration: none;
	width: 12%;
	margin: 25px;
	padding: 15px;
}

.sobre-cards-item a{
	display: flex;
	flex-direction: column;
	text-decoration: none;
}

.sobre-cards-imagem{
	border-radius: 10px;
	width: 100%;

	margin: 8px 0 4px 0;
}

.sobre-cards-titulo{
	display: flex;
	align-items: center;
	font-family: 'Smythe', cursive;
	font-size: 1.4em;
}

.sobre-cards-item p{
	padding: 0px 30px;
	font-size: 90%;
	text-align: center;
	color: #fff;
	margin: 0;
}

.sobre-cards-top-golden-bar{
	display: flex;
	width: 100%;
	height: 17px;
	background: url('/assets/img/cards/assets-01-01.png') center no-repeat;
}

.sobre-cards-bottom-golden-bar{
	display: flex;
	width: 100%;
	height: 17px;
	background: url('/assets/img/cards/assets-02-01.png') center no-repeat;
}

.sobre-cards-left-lys{
	display: flex;
	width: 11px;
	height: 15px;
	background: url('/assets/img/cards/assets-03.png');
	margin-right: 16px;
}

.sobre-cards-right-lys{
	display: flex;
	width: 11px;
	height: 15px;
	background: url('/assets/img/cards/assets-04.png');
	margin-left: 16px;
}

/*_____ [-] Conteudo Sobre ______*/

/* [--] css da pagina index.php */

/* [++] css de todas as paginas Footer */

/*_____ [+] Footer ______*/

.footer{
	background: rgba(60, 122, 135, 1);
	width:100%
}
.footer a{
	color:rgb(255, 255, 255);
	font-weight: bold;
	text-decoration: none;
	
}
.footer a:hover,.footer a:focus{
	color: rgba(255, 255, 255, 0.5);
}
.footer i{
	padding-right: .5em;
}
.footer h5{
	color:#fff;
}

.footer-container{
	display: flex;
	 flex-direction: row; 
	justify-content: space-between;
	max-width: 81.5em;
	margin:0 auto;
}

.footer-content-left{
	padding: 20px;
	width: 50%;
	direction: rtl;
}

.footer-content-left img{
	width: 168px;
	height: auto;
}

.footer-content-left h4{
	margin-top: 15px;
	color: rgb(255, 255, 255);
}

.footer-content-left>ul{
	font-size: .8em;
	font-weight: 600;
	list-style: none;
	color: rgb(255, 255, 255);
	/* text-align:left; */
	margin: 0;
	padding: 0;
}

.footer-content-left>ul>li{
	padding:0;
	margin:0;
	direction: initial;
}

.footer-content-left li>a{
	text-decoration: none;
	color: #fff;
}

.footer-evoluir{
	width: 50%;
	padding: 15px;
	background: #366e79;
}

.footer-evoluir h4{
	font-size: 16px;
	font-weight: 700;
	color: #fff;
}

.footer-evoluir p{
	font-size: 14px;
	color: #fff;
}

.footer-evoluir-social{
	display: flex;
	max-width: 100%;
	padding: 0px;
	list-style: none;
}

.footer-evoluir-social li{
	width: 38px;
	height: 38px;
	margin-right: 20px;
	font-size: 38px;
}

.footer-evoluir-social a{
	text-decoration: none;
	color: #fff;
}

.footer-marcas{
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 100%;
	padding: 10px 0;
	background: #fff;
}
.footer-marcas p{
	font-size: .8em;
	text-align: center;
}
.footer-marcas a{
	color: rgb(60, 122, 135);
	font-weight:100;
}
.footer-marcas a:hover,
.footer-marcas a:focus{
	color: rgb(60, 122, 135,0.5);
	font-weight:100;
}
.footer-marcas-logo{
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	width: 100%;
	max-width: 1200px;
}

.footer-marcas-logo img{
	width: 148px;
	margin: 0 5px;
}

/*_____ [-] Footer ______*/

/* [--] css de todas as paginas Footer */

/* [++] Codigos extras */

/*_____ [+] Cores ______*/

.merlim-page-bg{
	background-color: rgb(104, 69, 130) !important;
}

.merlim-cor-1{
	background-color: rgb(104, 69, 130) !important;
}
.merlim-cor-1:hover
.merlim-cor-1:focus{
	background-color: rgb(104, 69, 130,0.5) !important;
}

.merlim-cor-2{
	background: rgb(240, 222, 255);
}

.merlim-cor-3{
	background:  rgb(73, 48, 91);
}
.merlim-cor-3:hover,.merlim-cor-3:focus{
	background:  rgb(73, 48, 91,0.5);
}

.merlim-border-1{
	border-color: rgb(240, 222, 255);
}

.merlim-cor-texto{
	color: rgb(104, 69, 130);
}

.apolo-page-bg{
	background-color: rgb(156, 22, 6) !important;
}
.apolo-cor-1{
	background-color: rgb(156, 22, 6) !important;
}
.apolo-cor-1:hover,.apolo-cor-1:focus{
	background-color: rgb(156, 22, 6,0.5) !important;
}

.apolo-cor-2{
	background: rgb(255, 211, 206);
}

.apolo-cor-3{
	background: rgb(109, 15, 4);
}

.apolo-cor-3:hover,.apolo-cor-3:focus{
	background: rgb(109, 15, 4,0.5);
}

.apolo-border-1{
	border-color: rgb(255, 211, 206);
}

.apolo-cor-texto{
	color: #9c1606;
}

.gaia-page-bg{
	background-color: rgb(119, 146, 33) !important;
}
.gaia-cor-1{
	background-color: rgb(119, 146, 33) !important;
}
.gaia-cor-1:hover,.gaia-cor-1:focus{
	background-color: rgba(120, 146, 33, 0.5) !important;
}

.gaia-cor-2{
	background: rgb(241, 255, 197);
}

.gaia-cor-3{
	background: rgb(83, 102, 23);
}

.gaia-cor-3:hover,.gaia-cor-3:focus{
	background: rgb(83, 102, 23,0.5);
}

.gaia-border-1{
	border-color: rgb(241, 255, 197);
}

.gaia-cor-texto{
	color: rgb(119, 146, 33);
}

.leonardo-page-bg{
	background-color: rgb(55, 131, 148) !important;
}

.leonardo-cor-1{
	background-color: rgb(55, 131, 148) !important;
}
.leonardo-cor-1:hover,.leonardo-cor-1:focus{

	background-color: rgb(55, 131, 148,0.5) !important;
}

.leonardo-cor-2{
	background: rgb(221, 248, 254);
}

.leonardo-cor-3{
	background: rgb(39, 93, 105);
}

.leonardo-cor-3:hover,.leonardo-cor-3:focus{
	background: rgb(39, 93, 105,0.5);
}

.leonardo-border-1{
	border-color: rgb(221, 248, 254);
}

.leonardo-cor-texto{
	color: rgb(56, 133, 150);
}

.mestre-page-bg{
	background-color: rgb(185, 91, 17) !important;
}

.mestre-cor-1{
	background-color: rgb(185, 91, 17) !important;
}
.mestre-cor-1:hover,.mestre-cor-1:focus{
	background-color: rgb(185, 91, 17,0.5) !important;
}

.mestre-cor-2{
	background: rgb(255, 235, 219);
}

.mestre-cor-3{
	background: rgb(129, 64, 12);
}
.mestre-cor-3:hover,.mestre-cor-3:focus{
	background: rgb(129, 64, 12,0.5);
}


.mestre-border-1{
	border-color: rgb(255, 235, 219);
}

/*_____ [-] Cores ______*/

/*_____ [+] Modais index ______*/

/*Modal Video*/
.modal-player{
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.7);
}

.modal-player-content{
	display: flex;
	max-width: 1024px;
	max-height: 768px;
	width: 80%;
	height: 80%;
}

.modal-player-content>iframe{
	flex: 1 1 auto;
 	border: 0;
}

.modal-player-content a{
	width: 36px;
	height: 36px;
	margin-left: 10px;
	font-size: 36px;
	color: #fff;
}

/*Modal Sobre*/

/*[+] gmaps block*/
#project5-left-map {
	width: 720px;
	height: 500px;
	background-color: transparent;
	border-radius: 6px;
}

@media screen and (max-width: 960px) and (min-width: 640px){

	#project5-left-map {
		width: 500px;
		height: 420px;
	}

}

@media screen and (max-width: 639px) and (min-width: 0px){

	#project5-left-map {
		width: 350px;
		height: 500px;
	}

}

/*[-] gmaps block*/

/*_____ [-] Modais index ______*/

/* [--] Codigos extras */

/* needed for old browsers */
dialog {
	display: block;
	border: 0;
}

.video-grid{
	/* flex-direction: initial; */
	/* width: 98%; */
	margin: 0 auto;
	padding:initial;
	display: grid;
	grid-template-columns: auto auto auto;
}

.video-grid-item{
	border-radius: 6px;
	text-align: center;
	padding:0;
	margin:10px;
	/* min-width:240px; */
	width:250px;
	background-color: rgba(179, 179, 179, 0.1);
}
.video-grid-item>a>img{
	border-radius: 6px;
	width:250px;
	height: auto;
	
}

.video-grid-item>p{
	font-size: 0.8em;
}

	/*breakpoint: generic mobile */
@media screen and (min-width: 0px) and (max-width: 730px) {
	.header h1{
    	font-size: 2.6em;
    	text-align: center;
		max-width: 80%;
	}

	h1, h2{
		font-size: 3em;
		font-weight: 400;
		line-height: 90%;
		text-align: center;
		margin:.5em!important;
	}

	.colecao-cards-item{
		margin: 4em 0 4em 0;
	}
	.colecao-cards-item, .sobre-cards-item{
		width: 100%;
	}
	.sobre-cards-item{
		min-height: initial;
	}

	.footer-container{
		display: flex;
		 flex-direction: column; 
		 width: 100%;
	}
	.footer-content-left{
		width: 100%;
		justify-content: center;
		text-align: center;
		padding: 20px 0;
	}

	.footer-evoluir{
		width: 100%;
		text-align: center;
		padding: 20px 0;
	}
	.footer-evoluir-social{
		
		justify-content: center;
	}
	.footer-content-left h4{
		margin-top: 15px;
		color: #fff;
		text-align: center;
	}
	
	.footer-content-left>ul{
		text-align:center;
	}

	.video-grid{

		grid-template-columns: auto ;

	}

	.video-grid-item{
		border-radius: 6px;
		text-align: center;
		padding:0;
		margin:10px;
		/* min-width:240px; */
		max-width:250px;
		background-color: rgba(179, 179, 179, 0.1);
	}
	.video-grid-item>a>img{
		border-radius: 6px;
		max-width: 250px;
		height:auto;
		
	}
} */

/* [--] css de todas as paginas Footer */


/*breakpoint: generic tablets */
@media screen and (min-width: 731px) and (max-width: 1024px) {
	.header h1{
		font-size: 3.3em;
		text-align: center;
		max-width: 80%;
	}

	h1, h2{
		font-size: 4em;
		font-weight: 400;
		line-height: 90%;
		text-align: center;
		margin:.5em!important;
	}

	.colecao-cards-item{
		/*background-color: yellow;*/
		width: 35%;
		min-width: 320px;	
		margin: 6vh auto 6vh auto;
	}

	.colecao-cards-item p{
		font-size: 80%;
	}

	.sobre-cards-item{
		/*background-color: yellow;*/
		min-width: 320px;
	}

	.video-grid{

		grid-template-columns: auto auto ;
	}
	.video-grid-item{
		border-radius: 6px;
		text-align: center;
		padding:0;
		margin:10px;
		/* min-width:240px; */
		width:250px;
		background-color: rgba(179, 179, 179, 0.1);
	}
	.video-grid-item>a>img{
		border-radius: 6px;
		width:250px;
		height:auto;
		
	}
}

/*breakpoint: dektop */
@media screen and (min-width: 1025px) and (max-width: 1259px) {
	
	.colecao-cards-item{
		/*background-color: blue;*/
		width: 30%;
		min-width: 320px;
		margin: 6vh ;
	}
	.sobre-cards-item{
		/*background-color: blue;*/
		min-width: 320px;
	}

	.video-grid{

		grid-template-columns: auto auto auto  ;
	}
	.video-grid-item{
		border-radius: 6px;
		text-align: center;
		padding:0;
		margin:10px;
		/* min-width:240px; */
		width:250px;
		background-color: rgba(179, 179, 179, 0.1);
	}
	.video-grid-item>a>img{
		border-radius: 6px;
		width:250px;
		height:auto;
		
	}

}

/*breakpoint: wide desktop */
 @media screen and (min-width: 1260px){
	.colecao-cards-item{
		max-width: 15%;
		/*background-color: red;*/
		min-width: 320px;
		margin: 6vh auto 6vh auto;
	} 
	.sobre-cards-item{
		/*background-color: red;*/
		min-width:  290px;
	}
}
