@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');

:root{ 

    font-family: 'Roboto', sans-serif;

    /* cores padrões */
    --color-primary: #205a61;  /*#269664*/
    --color-secondary: #25A54C; /*#007E7D*/
    --color-tetiary: #d4d48c;
    --color-text: #4D4D4D;
    --color-back: #FFF;
    --color-dark: rgba(0,0,0,0.7);
    --color-light: #F5F6FA;

    /* botões */
    --btn-back: var(--color-tetiary);
    --btn-back-hover: var(--color-tetiary);
    --btn-color: #FFF;
    --btn-color-hover: var(--btn-color);

    /* top bar */
    --bar-back: var(--color-primary);
    --bar-color: #FFF;
    --bar-icon-color: var(--color-tetiary);
    --bar-icon-redes-color: var(--color-tetiary);
    --bar-icon-redes-color-hover: var(--color-tetiary);

    /* top */
    --top-logo-padding: 5px;
    --top-logo-padding-responsive: 5px;
    --top-logo-width-responsive: 160px;
    --top-logo-height-responsive: 80px;
    --top-back: transparent;    
    --top-nav-back: transparent;
    --top-nav-color: #FFF;    
    --top-nav-hover-back: transparent;
    --top-nav-hover-color: var(--color-primary);
    --top-drop-back: #FFF;    
    --top-drop-color: var(--color-primary);
    --top-drop-hover-back: rgba(0,0,0,0.05);
    --top-drop-hover-color: var(--color-secondary);

    /* footer */
    --footer-back: var(--color-primary);
    --footer-color: var(--top-nav-color);
    --footer-copy-back: rgba(0,0,0,0.1);
    --footer-copy-color: var(--footer-color);
    --footer-icon-color: var(--bar-icon-color);
    --footer-icon-redes-color: var(--bar-icon-redes-color);
    --footer-icon-redes-color-hover: var(--bar-icon-redes-color-hover);

    /* title */
    --title-color: var(--color-primary);
    --title-line-color: var(--color-tetiary);
    --title-line-size: 150px;
    --title-post-color: #333;

    --title-internal-color: var(--title-post-color);
    --title-internal-back: #F9F9F9;

}

header { position: absolute; z-index:999; width: 100%; background: linear-gradient(180deg, rgba(32,90,97,1) 0%, rgba(32,90,97,0) 100%); }
header .navbar-nav a {padding:12px 14px; margin-left: 2px; /*text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);*/ border-radius: 4px; letter-spacing: 0.1em; }

.slider-main  {  }
.slider-main .slider-item { overflow: hidden; }
.slider-main .slider-item img { animation: zoom-in-zoom-out 30s ease-out infinite; }

.accordion .card-header { display: block; cursor: pointer; }
.accordion .card-header:after { font-family: "Font Awesome 5 Free"; font-weight: 900; content: "f068"; float: right; }
.accordion .card-header.collapsed:after { content: "f067"; }

.header-foto {  position: relative; width: 100%;  height:500px; overflow: hidden;  }
.header-foto img { width: 100% }

.card { font-size: 0.9em; font-weight: 300; }
.card .card-title { font-size: 1.5em; color: var(--color-secondary) }
.card .card-subtitle { font-size: 0.9em; margin: 15px 0; font-weight: 300 }
.card ul {  padding: 0; margin: 0 0 0 15px; }
.card ul li { padding: 0; margin: 0 }

.title { font-weight: 300px; }
.title strong { font-weight: 900; }

#box-sementes { color: #FFF; background: url('https://www.sementescapaogrande.com.br/images/banner/1.jpg'); background-size: cover; background-position: center; }
#box-sementes .title { color: #FFF; }
#box-sementes .card { background: transparent; border: 2px solid #FFF; border-radius: 0; }
#box-sementes .card ul li { list-style: none; letter-spacing: 0.1em; }
#box-sementes .card .card-title { font-size: 2.5em; color: var(--color-tetiary); }
#box-sementes .card .card-subtitle { color: #FFF !important; }

.glass { height: 100%; background: rgba(0, 0, 0, 0.5); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); }

@media (max-width:991.99px){
   .header-foto {  height:250px; }
   header .navbar-nav {background:#FFF;}
   header .navbar-nav a{text-shadow: none; color: #333;}
}

@keyframes zoom-in-zoom-out {
  0% {
    transform: scale(1, 1);
  }
  50% {
    transform: scale(1.2, 1.2);
  }
  100% {
    transform: scale(1, 1);
  }
}