html {
	scroll-behavior: smooth;
}

* {
	position: relative;
	box-sizing: border-box;
	outline: none;
}

input, select, textarea {
	font-family: inherit;
	font-size: inherit;
	color: inherit;
}

a {
	text-decoration: none;
	color: inherit;
}
.corpo a {
	color: #960030 ;
	font-weight: 300;
}

.larguraMaxima {
    display: inline-block;
    width: 840px;
}

.bgVerdeClaro {
    background-color: #f4f7e2;
}

body {
	font-family: 'Lato', Arial, sans-serif;
	font-size: 16px;
	font-weight: 300;
	line-height: 22px;
	margin: 0;
	padding: 0;
	color: #000;
	background-color: #fff;
	text-align: center;
	transition: all 0.5s ease 0s;
}
body[scrolling="1"] {
}


.center {
	text-align: center;
}
.left {
	text-align: left;
}

h1 {
	margin: 0 0 10px 0;
	color: #960030;
    font-weight: 300;
}

h1 {
    font-size: 1.77em;
    text-align: center;
    text-transform: uppercase;
    margin: 4.39vw 0;
}
h2 {
    font-size: 1.35em;
    font-weight: bold;
}
.titulo {
	font-size: 40px;
	line-height: 1.5em;
    font-weight: 400;
    text-transform: uppercase;
}
.borderB {
	border-bottom: #960030 1px solid;
}
.borderR {
	border-right: #960030 1px solid;
}
.borderL {
	border-left: #960030 1px solid;
}
.borderT {
	border-top: #960030 1px solid;
}
.borderTRBL {
	border: #960030 1px solid;
}
.border2w {
	border-width: 2px;
}
.p2tb {
    padding: 2.93vw 0;
}
.p10vw {
	padding: 120px;
}

.corpo h1 a, .corpo h2 a, .corpo h3 a, .corpo h4 a, .corpo h5 a {
	color: inherit;
	text-decoration: none;
}

.corpo h1 a {
	font-weight: normal;
}

.separador {
    background-color: #960030 ;
    height: 2.56vw;
    line-height: 2.56vw;
}

.m4t {
    margin-top: 4.39vw;
}
.m40t {
	margin-top: 40px;
}
.m50b {
	margin-bottom: 50px;
}

.cabecalho-mobile, .menu-mobile {
	display: none;
}

.cabecalho {
	position: sticky;
	top: 0;
	height: 60px;
	color: #960030;
	transition: all 0.5s ease 0s;
    z-index: 10;
	border-bottom: #960030 1px solid;
	background-color: #fff
}
    .cabecalho > .menu {
        display: flex;
		position: absolute;
		width: 1024px;
		top: 15px;
		bottom: 15px;
		left: calc(50% - (1024px / 2));
    }
        .cabecalho > .menu > a {
            flex: 1 auto;
			border-right: 1px solid;
			line-height: 30px;
			color: #000;
			text-transform: uppercase;
			font-size: 0.75em;
        }
        .cabecalho > .menu > .logo {
            
        }
			.cabecalho > .menu > .logo > img {
				width: 158px;
			}

.corpo {

}

	[slideshow], [slideshow] .slide {
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
	}
		[slideshow] .slide {
			background-size: cover;
			background-position: center;
			background-repeat: no-repeat;
			z-index: 0;
			opacity: 0;
			transition: all 0.5s ease 0s;
		}
			[slideshow] .slide.show-true {
				z-index: 1;
				opacity: 1;
			}
			[slideshow] .slide > [texto] {
				position: absolute;
				left: 0;
				right: 0;
				bottom: 50px;
				text-align: center;
			}
		[slideshow] .move {
			position: absolute;
			top: 50%;
			height: 100px;
			line-height: 100px;
			font-size: 80px;
			color: #fff;
			text-shadow: rgba(0,0,0,0.5) 0 3px 3px;
			margin-top: -50px;
			z-index: 2;
			width: 100px;
			text-align: center;
			cursor: pointer;
			opacity: 0.3;
		}
			[slideshow] .move:hover {
				opacity: 1;
			}
			[slideshow] .move.left {
				left: 0;
			}
			[slideshow] .move.right {
				right: 0;
			}
		[slideshow] .balls {
			position: absolute;
			display: flex;
			right: 10px;
			bottom: 10px;
			z-index: 2;
		}
			[slideshow] .balls > .ball {
				background-color: #fff;
				display: block;
				flex: 1 auto;
				width: 20px;
				height: 20px;
				margin-left: 2px;
				border-radius: 10em;
				cursor: pointer;
			}
			[slideshow] .balls > .ball.selected-true {
				background-color: #960030 ;
			}
			
[catalogo] {
	margin: 50px 0 0 0;
}
	[catalogo] .slides {
		height: 400px;
	}
		[catalogo] .slide {
			position: absolute;
			top: 0;
			left: 0;
			right: 0;
			bottom: 0;
			background-size: contain;
			background-position: center;
			background-repeat: no-repeat;
			z-index: 0;
			opacity: 0;
			transition: all 0.5s ease 0s;
		}
			[catalogo] .slide.show-true {
				z-index: 1;
				opacity: 1;
			}
			[catalogo] .slide > [texto] {
				position: absolute;
				left: 0;
				right: 0;
				bottom: 50px;
				text-align: center;
			}
		[catalogo] .move {
			position: absolute;
			top: 50%;
			height: 100px;
			line-height: 100px;
			font-size: 80px;
			color: #fff;
			text-shadow: #960030 0 3px 3px;
			margin-top: -50px;
			z-index: 2;
			width: 100px;
			text-align: center;
			cursor: pointer;
			opacity: 0.3;
		}
			[catalogo] .move:hover {
				opacity: 1;
			}
			[catalogo] .move.left {
				left: 0;
			}
			[catalogo] .move.right {
				right: 0;
			}
		
		[catalogo] .list {
			margin-top: 20px;
			padding: 5px;
		}
			[catalogo] .list > .img {
				width: calc((100% / 12) - (130px / 12));
				height: 50px;
				display: inline-block;
				margin: 5px;
				background-size: cover;
				background-position: center;
				background-repeat: no-repeat;
				cursor: pointer;
			}
			[catalogo] .list > .img.selected-true {
				border: 3px solid #960030;
			}

.modalProduto {
    position: fixed;
    top: 20px;
    left: 20px;
    right: 20px;
    bottom: 20px;
    background-color: #666;
    z-index: 10000;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: rgba(0,0,0,0.65) 0 0 50px;
}

    .modalProduto > .content {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
    }

        .modalProduto > .content > * {
            position: absolute;
            top: 0;
            bottom: 0;
        }

        .modalProduto > .content > .bg {
            left: 0;
            right: 50%;
            background-size: cover;
            background-position: center;
            filter: blur(50px);
            -webkit-filter: blur(50px);
            opacity: 0.5;
            background-repeat: no-repeat;
            background-color: #000;
        }

        .modalProduto > .content > .img {
            left: 0;
            right: 50%;
            background-position: center;
            background-size: contain;
            background-repeat: no-repeat;
            cursor: zoom-in;
        }

        .modalProduto > .content > .data {
            left: 50%;
            right: 0;
            padding: 50px;
            overflow-y: auto;
            overflow-x: hidden;
            background-color: #fff;
        }

            .modalProduto > .content > .data > .img-list {
                margin-top: 20px;
            }

                .modalProduto > .content > .data > .img-list > .img {
                    float: left;
                    margin: 0 20px 20px 0;
                    cursor: pointer;
                    height: 80px;
                    width: 80px;
                    border-radius: 10px;
                    background-position: center;
                    background-size: cover;
                }

        .modalProduto > .content > .loading {
            top: 50%;
            bottom: auto;
            height: 50px;
            line-height: 50px;
            margin-top: -25px;
            text-align: center;
            color: #fff;
            text-transform: uppercase;
            font-weight: bold;
            font-size: 11px;
            left: 0;
            right: 50%;
        }

    .modalProduto > .left, .modalProduto > .right {
        position: absolute;
        color: black;
        font-size: 35px;
        width: 50px;
        text-align: center;
        height: 50px;
        line-height: 45px;
        cursor: pointer;
        text-shadow: rgba(255,255,255,0.25) 1px 2px 0px;
    }

    .modalProduto > .left, .modalProduto > .right {
        top: 50%;
        margin-top: -18px;
    }

    .modalProduto > .left {
        left: 0;
    }

    .modalProduto > .right {
        right: 0;
    }

    .modalProduto > [title] {
        position: absolute;
        left: 20px;
        bottom: 20px;
        background-color: rgb(167,135,86);
        color: rgb(255,255,255);
        height: 50px;
        line-height: 50px;
        padding: 0 20px;
    }

    .modalProduto > .close {
        position: absolute;
        top: 0;
        right: 0;
        color: red;
        font-size: 35px;
        width: 50px;
        text-align: center;
        height: 50px;
        line-height: 50px;
        cursor: pointer;
    }

form {
	margin-top: 4.39vw;
}
	form > .input {
		margin-bottom: 20px;
        text-align: left;
	}
		form > .input > label {
			display: block;
			font-weight: 300;
			margin-bottom: 0.35em;
		}
        form > .input > input, form > .input > select, form > .input > textarea {
            display: block;
            margin: 0;
            padding: 0 1em;
            border: 1px solid #960030;
            height: 50px;
            width: 100%;
        }
        form > .input > textarea {
            height: 200px;
            padding: 1em;
            resize: none;
        }
	form > .botoes {
		text-align: center;
	}
        form > .botoes > input[type="submit"] {
            background-color: #960030 ;
            height: 50px;
            color: #fff;
            font-weight: 300;
            text-align: center;
            padding: 0 2em;
            border: none;
            cursor: pointer;
            font-weight: bold;
        }

#banner {
	height: 800px;
}
	#banner > .logo {
		position: absolute;
		z-index: 2;
		width: 765px;
		top: 130px;
		left: calc(50% - (765px / 2));
	}
		#banner > .logo > .logo {
			width: 100%;
		}
		#banner > .logo > .criadores {
			width: 420px;
			position: absolute;
			left: 212px;
			top: 113px;
		}
		
	#banner > .descer {
		position: absolute;
		bottom: 120px;
		width: 60px;
		left: calc(50% - 30px);
		z-index: 2;
	}
		#banner > .descer > img {
			width: 100%;
		}

	#banner > [slideshow] .move {
		display: none;
	}

.box {
    display: flex;
}
    .box > .flex {
        flex: auto 0;
    }
    .box > .flex1 {
        flex: 1 0;
    }
    .box > .flex2 {
        flex: 2 0;
    }
    .box > .flex3 {
        flex: 3 0;
    }
    .box > .flex4 {
        flex: 4 0;
    }
    .box > .flex5 {
        flex: 5 0;
    }
    .box > .flex6 {
        flex: 6 0;
    }
    .box > .flex7 {
        flex: 7 0;
    }
	
#sobre {
	margin: 50px 0;
}	
	#sobre .logo {
		flex: 1 0;
		width: 35%;
		background-image: url('/imagens/inicio/logo_vertical.png');
		background-position: center;
		background-size: 70%;
		background-repeat: no-repeat;
		border-right: #960030 1px solid;
	}
	#sobre .texto {
		flex: 2 0;
		padding: 20px 0 20px 40px;
	}

.paralax {
	height: 400px;
    background-size: cover;
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-position: center;
}
.paralax-full {
    background-size: cover;
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-position: center;
}
.fundo-vacas {
	background-image: url('/imagens/inicio/slide.jpg');
}
.fundo-pasto {
	background-image: url('/imagens/inicio/contato.jpg');
}
.fundo-branco {
	background-color: #fff;
}

#doadoras, #tourinhos, #novilhas, #bezerras, #matriarcas, #girolando {
	padding: 50px 0 0 0;
}
	#doadoras .box > .titulo {
		padding-top: 80px;
	}
	#doadoras .linhagem {
		writing-mode: vertical-rl;
		text-orientation: mixed;
		transform: rotate(-180deg);
	}
	.animais.lista {
		display: flex;
		flex-wrap: wrap;
	}
		.animais.lista > a.item {
			flex: 1 0;
			width: calc(100% / 3);
			min-width: calc(100% / 3);
			max-width: calc(100% / 3);
			color: #000;
			text-transform: uppercase;
			padding: 30px 0;
		}
			.animais.lista > .item > .img, #doadoras .conteudo .img.grupo {
				background-size: cover;
				background-repeat: no-repeat;
				border-radius: 10em;
				height: 100px;
				width: 100px;
				display: inline-block;
				margin: 0 0 10px 0;
				opacity: 0.7;
			}
			.animais.lista > .item:hover > .img {
				opacity: 1;
			}
	#doadoras .lista-lateral {
		border-right: 2px solid #960030;
		padding-right: 10px;
	}
		#doadoras .lista-lateral > a.item {
			color: #000;
			text-transform: uppercase;
			font-size: 0.65em;
			line-height: 1.25em;
		}
			#doadoras .lista-lateral > .item > .img {
				background-size: cover;
				background-repeat: no-repeat;
				border-radius: 10em;
				height: 50px;
				width: 50px;
				display: inline-block;
				margin: 20px 0 0 0;
				opacity: 0.7;
			}
			#doadoras .lista-lateral > .item:hover > .img {
				opacity: 1;
			}
	#doadoras .conteudo {
		padding: 0 0 0 30px;
	}
		#doadoras .conteudo .img.grupo {
			margin: 0 20px 0 0;
			opacity: 1;
		}
		#doadoras .conteudo .info {
			text-align: left;
			text-transform: uppercase;
			padding: 30px 0;
		}
			#doadoras .conteudo .info > .nome {
				font-weight: bold;
			}
	.animais.lista {
		margin-top: 30px;
	}
		.animais.lista > .animal {
			flex: 1 0;
			width: calc((100% / 2) - 15px);
			min-width: calc((100% / 2) - 15px);
			max-width: calc((100% / 2) - 15px);
			margin-bottom: 30px;
		}
		.animais.lista.trio > .animal {
			flex: 1 0;
			width: calc((100% / 3) - 20px);
			min-width: calc((100% / 3) - 20px);
			max-width: calc((100% / 3) - 20px);
			margin-bottom: 30px;
		}
		.animais.lista > .animal:nth-child(odd) {
			margin-right: 30px;
		}
		.animais.lista.trio > .animal {
			margin-right: 0;
		}
		.animais.lista.trio > .animal:nth-child(3n+2) {
			margin-left: 30px;
			margin-right: 30px;
		}
			.animais.lista > .animal > .img {
				margin: 10px;
				height: 200px;
				background-size: cover;
				background-position: center;
				background-repeat: no-repeat;
				cursor: pointer;
			}
			.animais.lista > .animal > .dados {
				margin: 10px;
			}
				.animais.lista > .animal > .dados .nome {
					text-transform: uppercase;
					font-weight: bold;
				}
				.animais.lista > .animal > .dados .certificado {
					position: absolute;
					top: 0;
					left: 0;
					right: 0;
					bottom: 0;
					background-size: cover;
					background-position: center;
					background-repeat: no-repeat;
					cursor: pointer;
				}
				
#citacao {
	background-color: #960030;
    color: #fff;
    font-size: 1.2em;
    line-height: 1.5em;
	margin: 50px 0 0 0;
	padding: 50px 0;
}				
	#citacao .icon > span {
		font-size: 4em;
	}

.h100p {
    height: 100%;
}
iframe {
    height: calc(100% - 12vw);
}
p {
	text-align: justify;
}



.modal {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0,0,0,0.9);
    z-index: 102;
}

    .modal > .content {
        position: absolute;
        top: 1.46vw;
        left: 1.46vw;
        right: 1.46vw;
        bottom: 1.46vw;
    }

        .modal > .content > * {
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
        }

        .modal > .content > .img {
            background-position: center;
            background-size: contain;
            background-repeat: no-repeat;
        }

        .modal > .content > .loading {
            top: 50%;
            bottom: auto;
            height: 3.66vw;
            line-height: 3.66vw;
            margin-top: -25px;
            text-align: center;
            color: #fff;
            text-transform: uppercase;
            font-weight: bold;
            font-size: 11px;
        }

    .modal > .left, .modal > .right {
        position: absolute;
        color: #fff;
        font-size: 35px;
        width: 3.66vw;
        text-align: center;
        height: 3.66vw;
        line-height: 45px;
        cursor: pointer;
        text-shadow: rgba(0,0,0,0.2) 1px 2px 0px;
    }

    .modal > .left, .modal > .right {
        top: 50%;
        margin-top: -18px;
    }

    .modal > .left {
        left: 0;
    }

    .modal > .right {
        right: 0;
    }

    .modal > [title] {
        position: absolute;
        left: 1.46vw;
        bottom: 1.46vw;
        background-color: rgb(167,135,86);
        color: rgb(255,255,255);
        height: 3.66vw;
        line-height: 3.66vw;
        padding: 0 1.46vw;
    }

    .modal > .close {
        position: absolute;
        top: 0;
        right: 0;
        color: #fff;
        font-size: 3.7vw;
        width: 5vw;
        text-align: center;
        height: 5vw;
        line-height: 5vw;
        cursor: pointer;
    }
	
.rodape {
	
}
	.rodape .material-icons {
		font-size: 4em;
		color: #960030;
	}
	.rodape .box > .flex1 {
		margin-top: 5em;
	}

@media (max-width: 1025px) {
	.cabecalho > .menu {
        width: 98vw;
		top: 15px;
		bottom: 15px;
		left: calc(50% - (98vw / 2));
    }	
	.p10vw {
		padding: 10vw;
	}
}
@media (max-width: 959px) {
	.larguraMaxima {
		width: 80vw;
	}
}
@media (max-width: 959px) and (orientation: portrait) {
	body, body[scrolling="1"] {
		font-size: 4.5vw;
		line-height: 1.5em;
		padding: 21vw 0 0 0;
	}

    .separador {
        height: 9.72vw;
        line-height: 9.72vw;
    }

	.cabecalho {
		display: none;
	}

	.cabecalho-mobile {
		display: block;
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		height: 21vw;
		z-index: 10;
		background-color: #fff;
		color: #960030;
		box-shadow: rgba(0,0,0,0.2) 0 0 2vw;
	}

		.cabecalho-mobile > a.menu {
			position: absolute;
			left: 0;
			top: 0;
			bottom: 0;
			width: 16vw;
			line-height: 21vw;
			font-size: 8vw;
			z-index: 1;
		}
        .cabecalho-mobile > a.link {
            position: absolute;
            top: 0;
            bottom: 0;
            width: 12vw;
            line-height: 21vw;
            font-size: 7vw;
            z-index: 1;
        }

        .cabecalho-mobile > a.link.facebook {
            right: 12vw;
        }
        .cabecalho-mobile > a.link.instagram {
            right: 0vw;
        }


		.cabecalho-mobile > a.logo {
			display: block;
			position: absolute;
			left: 25vw;
			right: 25vw;
			top: 0;
			bottom: 0;
			line-height: 21vw;
			z-index: 0;
		}

			.cabecalho-mobile > a.logo > img {
				max-height: 21vw;
				vertical-align: middle;
			}

	.menu-mobile {
		display: block;
		position: fixed;
		top: 21vw;
		z-index: 9;
		background-color: #fff;
		color: #960030;
		left: 0;
		right: 0;
		bottom: 0;
		overflow-x: hidden;
		overflow-y: auto;
	}

		.menu-mobile > a {
			display: block;
			height: 21vw;
			line-height: 21vw;
			border-bottom: 1px solid #e6e6e6;
			font-size: 1.2em;
			font-weight: 400;
		}

		.menu-mobile > .botoes {
			height: 21vw;
			line-height: 21vw;
			display: flex;
		}

			.menu-mobile > .botoes > a {
				flex: 1;
				line-height: 21vw;
				font-size: 8vw;
				color: #960030 ;
				background-color: #fff;
			}

	.larguraMaxima {
		display: block;
		width: auto;
	}

	img, iframe {
		width: 100%;
		min-width: 100%;
		max-width: 100%;
	}

	iframe {
		height: 75vh;
		min-height: 75vh;
		max-height: 75vh;
	}

	.blocos {
		display: block;
	}

	h1, h2, h3 {
		margin: 0 0 5vw 0;
	}

    #banner {
        height: 50vw;
    }
	
		#banner > .logo {
			display: none;
		}
			
		#banner > .descer {
			display: none;
		}

	#sobre {
		margin: 0;
	}
		#sobre .box {
			display: block;
		}
			#sobre .logo {
				height: 35vw;
				width: 100%;
				border-right: none;
				background-size: contain;
			}
			#sobre .texto {
				padding: 3vw 0 0 0;
			}

	[slideshow] .balls {
		display: none;
	}
	.blocos.fundo-cinza form {
		margin: 0;
	}
	form > .input {
		margin-bottom: 5vw;
	}
	form > .input > input, form > .input > select, form > .input > textarea {
		padding: 0 5vw;
		border: 1px solid #960030;
		height: 12vw;
	}
	form > .input > textarea {
		height: 30vw;
	}
	form > .botoes > input[type="submit"] {
		height: 12vw;
		padding: 0 5vw;
	}

	h1.cor-pesquisa {
		line-height: 1em;
		height: auto;
		margin: 8vw 0;
	}
	.blog > .blocos > .bloco > img, .blog > .blocos > .bloco.artigo > img {
		width: 100%;
		float: none;
		margin: 0 0 5vw;
	}

	h1.m20b {
		margin: 0;
	}

    [catalogos] > .catalogo {
        max-width: 100%;
        min-width: 100%;
        width: 100%;
    }

    [catalogos] > .produto {
        max-width: 100%;
        min-width: 100%;
        width: 100%;
        padding: 1em 0;
    }
        [catalogos] > .produto > .img {
            width: 50vw;
            height: 50vw;
        }

    .modalProduto {
        overflow-y: auto;
        overflow-x: hidden;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        border-radius: 0;
    }

        .modalProduto > .content {
            position: relative;
            top: auto;
            left: auto;
            right: auto;
            bottom: auto;
        }

            .modalProduto > .content > * {
                position: relative;
            }

            .modalProduto > .content > .loading {
                position: absolute;
                right: 0;
            }

            .modalProduto > .content > .bg {
                position: absolute;
            }

            .modalProduto > .content > .bg, .modalProduto > .content > .img {
                left: 0;
                right: 0;
                height: 90vh;
            }

            .modalProduto > .content > .data {
                left: 0;
                right: 0;
                padding: 20px;
                overflow-y: hidden;
                overflow-x: hidden;
            }

            .modalProduto > .content > .loading, .modalProduto > .left, .modalProduto > .right {
                top: 45vh;
                margin-top: -18px;
            }

        .modalProduto > .left {
            left: 0;
        }

        .modalProduto > .right {
            right: 0;
        }

        .modalProduto > .close {
            position: fixed;
        }

    #pesquisar > form {
        height: 12vw;
        line-height: 12vw;
        top: calc(50% - 6vw);
    }

		#pesquisar > form > input[type="text"], #pesquisar > form > input[type="submit"] {
			height: 12vw;
			padding: 0 5vw;
		}

	#pesquisar > .fechar {
		height: 12vw;
		width: 12vw;
		line-height: 12vw;
		font-size: 8vw;
	}

	.indice a {
		margin: 0 2vw;
		padding: 2vw 5vw;
	}


    .mo-p10 {
        padding: 10vw;
    }

    img.apaisagista {
        width: 50vw;
        min-width: auto;
        float: none;
        margin: 0 0 5vw 0;
    }

    .box {
        display: block;
    }
    .box.dados, .flex-mobile {
        display: flex;
    }
	
	
    #contato.mo-p10 {
        padding-bottom: 0;
    }
	
	.titulo {
		font-size: 1.5em;
		padding: 0 3vw;
	}
	
	#doadoras, #tourinhos, #novilhas, #bezerras, #matriarcas, #girolando {
		padding: 30px 0;
	}
	#doadoras .lista-lateral {
		padding: 0 3vw;
	}
	#doadoras .conteudo {
		padding: 0 5vw;		
		font-size: 0.8em;
		line-height: 1.35em;
	}
	#doadoras .conteudo .img.grupo {
		width: 60px;
		height: 60px;
		margin-right: 5vw;
	}
	#doadoras .conteudo .info {
		padding: 15px 0;
	}
	
	
	.animais.lista {
		padding: 0;
		margin-top: 5vw;
	}
	.animais.lista > a.item {
		width: calc(100% / 2);
		min-width: calc(100% / 2);
		max-width: calc(100% / 2);
	}
	.animais.lista.trio {
		padding: 0 30px;
		margin-top: 30px;
	}
	
	.animais.lista > .animal {
		flex: 1 0;
		width: 100%;
		min-width: 100%;
		max-width: 100%;
		margin-bottom: 5vw;
	}
	.animais.lista.trio > .animal {
		flex: 1 0;
		width: 100%;
		min-width: 100%;
		max-width: 100%;
		margin-bottom: 30px;
	}
	.animais.lista > .animal:nth-child(odd) {
		margin-right: 0;
	}
	.animais.lista.trio > .animal {
		margin-right: 0;		
	}
	.animais.lista.trio > .animal:nth-child(3n+2) {
		margin-left: 0;
		margin-right: 0;
	}
	
	[catalogo] {
		margin: 5vw 0 0 0;
	}
	[catalogo] .slides {
		height: 50vw;
	}
	[catalogo] .move {
		top: calc(50% - 7vw);
		height: 14vw;
		line-height: 14vw;
		font-size: 14vw;
		width: 14vw;
		margin: 0;
	}
	[catalogo] .list > .img {
		width: calc((100% / 5) - (60px / 5));
		height: 12vw;
		margin: 2px 5px;
	}
	
				
	#citacao {
		margin: 30px 0;
		padding: 10vw;
	}				
		#citacao .icon > span {
			font-size: 4em;
		}
	
	.modal > .close {
		font-size: 8vw;
		width: 14vw;
		height: 14vw;
		line-height: 14vw;
    }

}