@charset "UTF-8";

@font-face {
	font-family: Helvetica_Neue;
	src: url(../fonts/helvetica-neue.ttf);
}
@font-face {
	font-family: Avant_Garde_Gothic;
	src: url(../fonts/itc-avant-garde-gothic-lt-book.ttf);
}
@font-face {
	font-family: TrajanPro-Bold;
	src: url(../fonts/TrajanPro-Bold.otf);
}
@font-face {
	font-family: TrajanPro-Regular;
	src: url(../fonts/TrajanPro-Regular.otf);
}

body, figure, h1, h2, h3, h4, ul, p {margin: 0; border: 0; padding: 0;}
a {text-decoration: none;}
* {box-sizing: border-box; font-family: Helvetica_Neue;}
.row {margin: 0;}


/*MENU*/
  .navbar {border-radius: 0px; height: 150px; margin-bottom: 0px; border: none; background-color: transparent !important;}
  .container-fluid {max-width: 1200px;}
  .navbar-header, .navbar-brand, .navbar-right, .navbar-right li {}
  .navbar-inverse .navbar-nav > .active > a {color: #D2AE6D !important;}
  .navbar-inverse .navbar-nav > .active:hover > a {color: #D2AE6D !important;}
  .navbar-inverse .navbar-nav > li {margin: 10px !important;}
  .navbar-inverse .navbar-nav > li > a {font-family: Avant_Garde_Gothic; color: #000 !important; margin-top: 25px; font-size: 14px; text-align: center; padding: 0;}
  .navbar-inverse .navbar-nav > li:hover > a {color: #D2AE6D !important; border-style: solid; border-width: 0 0 1px 0; border-color: #D2AE6D; padding-bottom: 2px;}
	.navbar-inverse .navbar-nav > .ativo > a {color: #D2AE6D !important; border-style: solid; border-width: 0 0 1px 0; border-color: #D2AE6D; padding-bottom: 2px;}
	.container-fluid > .navbar-header {margin-left: 30px;}
	.navbar-inverse .navbar-collapse {margin-right: 20.5%;}

	#indice{width: 100%;}
	.navbar-inverse .campo-busca { margin-top: 45px; height: 30px;margin-right: 1%;}
	.navbar-inverse .campo-busca button {position: relative; margin-top: -20px; width: 30px; right: 30px; border: none; height: 25px; background-color: transparent; pointer-events: none;cursor: default;}

  .navbar-inverse .navbar-toggle {border: none; margin-top: 10px; background-color: transparent !important; }
  /*.navbar-inverse .navbar-toggle:hover {background-color: #007577 !important;}*/
  .navbar-inverse .navbar-toggle .icon-bar {background-color: transparent;}
  /*.navbar-inverse .navbar-toggle:hover .icon-bar {background-color: #fff;}*/

	/* DROPDOWN */
	.dropdown-menu {margin-top: -0.5%;border: none; background-color: rgb(210,174,109); border-radius: 0; padding: 0;}
	.dropdown-menu li{border-style: solid; border-width: 0.5px 0 0 0; border-color: #ffffff;}
	.navbar-right .dropdown-menu {margin-right: 42%;}

  .navbar-toggle .icon-bar {
    width: 30px;
    transition: all 0.2s;
  }
  .navbar-toggle.collapsed .top-bar {
    transform: rotate(0);
  }
  .navbar-toggle.collapsed .middle-bar {
    opacity: 1;
  }
  .navbar-toggle.collapsed .bottom-bar {
    transform: rotate(0);
  }
  .navbar-toggle .top-bar {
    transform: rotate(45deg);
    transform-origin: 10% 10%;
  }
  .navbar-toggle .middle-bar {
    opacity: 0;
  }
  .navbar-toggle .bottom-bar {
    transform: rotate(-45deg);
    transform-origin: 10% 90%;
  }


/*RODAPE*/
  .rodape {position: relative; width: 100%; padding-top: 20px; background-color: #373435; border-style: solid; border-width: 4px 0 0 0; border-color: #AE7400; margin-top: 30px;z-index: 5}
  .rodape .info p {color: #fff; font-size: 12px; font-family: Helvetica_Neue; float: left; margin-top: 6px;}
  .rodape .info p:nth-child(1) {border-style: solid; border-width: 0 2px 0 0; border-color: #fff; margin-right: 10px; padding-right: 10px;}
  .rodape .rodapeConteudo {position: relative; padding-bottom: 20px;}
  .rodape .rodapeConteudo ul li a {color: #fff;}

/* Sombra */
  .sombra {border-style: solid; border-width: 0 0 0 0; border-color: rgba(0,0,0,.6); width: 100%; float: left; position: relative; height: auto; box-shadow: 0px -7px 20px 2px rgba(54,58,66,.4);}
  .sombra p {font-size: 1px; color: transparent;}

/* MAIN */
  /* Banner */
    main.home .banner {margin-bottom: 5px; margin-top: -1px;}
  /* INFO */
    main.home .informacoes-home article {margin-bottom: 5px; padding-left: 0 !important;}
    main.home .informacoes-home article:nth-child(2) {margin-bottom: 15px;}
    main.home .informacoes-home .imagem {padding-left: 0 !important;}
    main.home .informacoes-home .informacoes {padding-left: 0 !important; padding-right: 0 !important;}
    main.home .informacoes-home .informacoes h1 {font-size: 18px; padding-top: 10px; font-family: TrajanPro-Bold, bold; font-weight: bold; padding-bottom: 8px; text-transform: uppercase;}
    main.home .informacoes-home .informacoes p {font-size: 16px; font-family: Helvetica_Neue;}
    main.home .informacoes-home  img {width: 100%;}
    main.home .informacoes-home .info-grande {margin-top: 5px;}
    main.home .informacoes-home .informacao-principal {padding-left: 0 !important;}
    main.home .informacoes-home .informacao-principal h1 {font-size: 25px; padding-top: 10px; font-family: TrajanPro-Bold, bold; font-weight: bold; text-transform: uppercase;}
    main.home .informacoes-home .informacao-principal h2 {font-size: 18px; padding-bottom: 8px; font-family: TrajanPro-Bold, bold; font-weight: bold; text-transform: uppercase;}
    main.home .informacoes-home .informacao-principal p {font-size: 16px; font-family: Helvetica_Neue;}

		.accordionjs {border-style: solid; border-width: 0 2px 0 0; border-color: #FFBB4B;}
		.accordionjs-tittle .accordionjs-select {font-size: 60px}
/*SLIDER*/
    .slideTopo {height: 350px; position: relative; float: left; width: 100%;}
    .carousel-fade .carousel-inner .item {
      -webkit-transition-property: opacity;
              transition-property: opacity;
    }
    .carousel-fade .carousel-inner .item,
    .carousel-fade .carousel-inner .active.left,
    .carousel-fade .carousel-inner .active.right {
      opacity: 0;
    }
    .carousel-fade .carousel-inner .active,
    .carousel-fade .carousel-inner .next.left,
    .carousel-fade .carousel-inner .prev.right {
      opacity: 1;
    }
    .carousel-fade .carousel-inner .next,
    .carousel-fade .carousel-inner .prev,
    .carousel-fade .carousel-inner .active.left,
    .carousel-fade .carousel-inner .active.right {
      left: 0;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
    .carousel-fade .carousel-control {
      z-index: 2;
    }
    .carousel,
    .carousel-inner,
    .carousel-inner .item {
      height: 100%;
    }
    .item:nth-child(1) {
      background: url(../img/home/royale-banner.png) no-repeat center; background-size: cover;
    }
    .item:nth-child(2) {
      background: url(../img/home/royale-banner.png) no-repeat center; background-size: cover;
    }
    .item:nth-child(3) {
      background: url(../img/home/royale-banner.png) no-repeat center; background-size: cover;
    }

    .carousel-caption {max-width: 80%;}
    .carousel-caption h1 {text-align: center; text-transform: uppercase; margin-bottom: 25px; font-family: TrajanPro-Bold; font-weight: 600; font-size: 45px; text-shadow: none; }
    .carousel-caption h2 {font-size: 28px; text-shadow: none; font-weight: 300; max-width: 690px; margin: 0 auto; margin-bottom: 40px;}
    .carousel-caption h2 span {font-weight: 600;}
    .carousel-caption button {background-color: rgba(191,30,46,.85); font-size: 18px; color: #fff; font-weight: 700; border: none; width: 260px; height: 50px; border-radius: 15px; font-family: TrajanPro-Bold; text-transform: uppercase;}

/*MAPA*/
		.mapa {padding: 0;}
		#map{height: 275px; width: 100%}
/* RESPONSIVO */
@media screen and (max-width: 1900px)
{
	.navbar-right .dropdown-menu {margin-right: 42%;}
	#map{height: 305px;}
	#indice{width: 90%;}
}
@media screen and (max-width: 1300px)
{
	.navbar-inverse .navbar-collapse {margin-right: 4.5%;}
	.navbar-right .dropdown-menu {margin-right: 45%;}

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

/*MENU*/
    .navbar-inverse .navbar-nav > li {margin: 0 5px !important;}
		.navbar-inverse .navbar-collapse {margin-right: 4.5%;}
		.navbar-right .dropdown-menu {margin-right: 48%;}
		#map{height: 325px;}

}
@media screen and (max-width: 800px) {
	.navbar-inverse .navbar-nav > li > a{  margin: 0 5px; font-size: 14px;}
	.navbar-inverse .navbar-collapse {margin-right: 4.5%;}
	.navbar-right .dropdown-menu {margin-right: 51%;}

}
@media screen and (max-width: 767px) {

/*MENU*/
    .navbar-right {width: 100%;}
		.navbar-inverse .navbar-nav > li {margin-top: 5px !important;}
		.navbar-inverse .navbar-nav  li  a {margin-top: 0; color: #fff !important;}

    .navbar-right li {width: 100%; text-align: center; min-height: 20px; margin: 0 auto;}
    .navbar-right li a {padding-top: 15px; min-height: 50px; margin-top: 0; color: #000 !important;}

    .navbar {background-color: rgba(0,0,0,.31);}
    .navbar-inverse .navbar-collapse {border: none; z-index: 9999; position: absolute; width: 100%;}
    .navbar-collapse {background-color: rgba(0,0,0,.8); }

		.navbar-inverse .navbar-toggle {background-color: transparent !important; color: rgb(210,174,109) !important;}
		.navbar-inverse .navbar-toggle .icon-bar {background-color: rgb(210,174,109) !important;}


		/* BUSCA */
		.navbar-inverse .campo-busca {margin-right: 30px !important;}
		.campo-busca .navbar-right {width: 208px !important; float: right !important;}

	/* MAIN */
		main.home .informacoes-home .info-grande {margin-bottom: 15px;}
		main.home .informacoes-home article:nth-child(2) {margin-bottom: 0;}

	/* RODAPE */
		.rodape .rodapeConteudo {margin-top: 15px;z-index: 9999}

}
@media screen and (max-width: 520px) {
	main.home .informacoes-home {margin-top: 15px;}
	main.home .informacoes-home .informacoes h1 {padding-top: 0;}
	main.home .informacoes-home .informacao-principal h1 {padding-top: 0;}
}
@media screen and (max-width: 450px) {
	/* MAIN */
	main.home .informacoes-home .info-grande .imagem {margin-bottom: 8px;}
	main.home .informacoes-home .info-grande .imagem, .informacao-principal {width: 100% !important; float: none !important;}

}
@media screen and (max-width: 448px) {
	.navbar {height: auto;}

	.navbar-inverse .campo-busca {width: 100%; margin-top: 0; margin-bottom: 10px;}
	.campo-busca .navbar-right {width: 100% !important; float: left !important; margin-bottom: 30px;}
	.campo-busca .navbar-right input {width: 100%;}
	.navbar-inverse .campo-busca button {position: absolute;}
	.navbar-inverse .campo-busca button {margin-top: -25px;}
	.navbar-inverse .campo-busca button i {float: right;}

	.navbar-brand {float: none; width: 100%;}
	.navbar-brand img {text-align: center; margin-left: 15px; float: none;}

	/* RODAPE */
	.rodape .info p {text-align: left; font-family: TimesNewRoman}
	.rodape .info p:nth-child(1) {border-width: 0 0 0 0;}
}

/* QUEM SOMOS */
	.quem-somos .banner {width: 100%; float: left; position: relative; height: 350px; background: url(../img/quem_somos/royale-banner-quem-somos.png) no-repeat center center; background-size: cover;}

	/* BANNERS */
	.servicos .banner {background: url(../img/servicos/royale-banner-servicos.png) no-repeat center center; background-size: cover;}
	.informacoes .banner {background: url(../img/informacoes/royale-banner-informacoes.png) no-repeat center center; background-size: cover;}
	.empresa .empresarial {background: url(../img/para_empresa/royale-banner-empresarial.png) no-repeat center center; background-size: cover;}
	.empresa .bens {background: url(../img/para_empresa/royale-banner-bens-moveis-e-equipamentos.png) no-repeat center center; background-size: cover;}
	.empresa .engenharia {background: url(../img/para_empresa/royale-banner-obras-riscos-de-engenharia.png) no-repeat center center; background-size: cover;}
	.empresa .profissional {background: url(../img/para_empresa/royale-banner-responsabilidade-civil-profissional.png) no-repeat center center; background-size: cover;}
	.empresa .seguro-condominio{background: url(../img/para_empresa/royale-banner-condominio.png) no-repeat center center; background-size: cover;}

	.pessoal .previdencia {background: url(../img/pessoal/royale-banner-previdencia.png) no-repeat center center; background-size: cover;}
	.pessoal .consorcios {background: url(../img/pessoal/royale-banner-consorcio.png) no-repeat center center; background-size: cover;}
	.pessoal .vida {background: url(../img/pessoal/royale-banner-seguro-de-vida.png) no-repeat center center; background-size: cover;}
	.pessoal .planos {background: url(../img/pessoal/royale-banner-plano-de-saude.png) no-repeat center center; background-size: cover;}
	.pessoal .automovel {background: url(../img/pessoal/royale-banner-automovel.png) no-repeat center center; background-size: cover;}
	.pessoal .residencial {background: url(../img/pessoal/royale-banner-residencial.png) no-repeat center center; background-size: cover;}
	.pessoal .investimentos {background: url(../img/pessoal/royale-banner-investimentos.png) no-repeat center center; background-size: cover;}

	.quem-somos .para-voce{background: url(../img/pessoal/royale-banner-investimentos.png) no-repeat center center; background-size: cover;}
	/* breadcrumb */
		.quem-somos .breadcrumb {background-color: transparent; color: #848688;}
		.quem-somos .breadcrumb li {color: #848688; font-size: 11px; font-family: Avant_Garde_Gothic}
		.quem-somos .breadcrumb li a {color: #848688;}

	/* Sobre */
		.quem-somos .royale-corretora {margin-left: 20px; margin-right: 20px;}
		.quem-somos .mvv {margin-top: 30px;}
		.quem-somos .mvv article h1 {font-family: TrajanPro-Bold;text-transform: uppercase; border-style: solid; border-width: 0 0 2px 0; border-color: #D2AE6D; font-size: 16px; width: 35px;}
		.quem-somos p {font-family: Helvetica_Neue; font-size: 16px;}
		@media screen and (max-width: 991px) {
			.quem-somos .mvv article:nth-child(3) {margin-top: 30px;}
		}
		@media screen and (max-width: 767px) {
			.quem-somos .royale-corretora {margin-left: 0; margin-right: 0;}
			.quem-somos .mvv article:nth-child(2) {margin-top: 30px;}
		}

/* SEGUROS */
	.seguros h1 {font-family: TrajanPro-Regular; font-size: 38px;}
	.seguros .horizon-swiper  {margin-top: 40px;}
	.seguros .horizon-swiper  a {color: #000;}
	.seguros .horizon-swiper  a:hover {text-decoration: none;}
	.seguros .horizon-swiper  h2 {background-color: rgb(210,174,109); text-transform: uppercase; font-family: TrajanPro-Regular; font-size: 13px; padding: 3px 0 3px 5px;}
	.seguros .horizon-swiper .item1 h2 {width: 105px;}
	.seguros .horizon-swiper .item2 h2 {width: 240px;}
	.seguros .horizon-swiper .item3 h2 {width: 250px;}
	.seguros .horizon-swiper .item4 h2 {width: auto;}
	.seguros .horizon-swiper .item5 h2 {width: 220px;}
	.seguros .horizon-swiper  img {margin-bottom: 10px;}
	.seguros .horizon-swiper  p {font-size: 14px; font-family: Helvetica_Neue; width: 100%;}
	.seguros .horizon-swiper  {margin-bottom: 30px;}
	.seguros .horizon-swiper hr {background-color: #cecece; height: 1px; width: 100%; margin-top: 15px;}

	.seguros  .maisinfo .colum-conteudo {width: 100%; float: left; position: relative; height: auto;display: inline;}
	.seguros  .maisinfo .colum1 {margin-bottom: 20px;}
	.seguros  .maisinfo {margin-left: 30px; margin-right: 30px;}
	.seguros  .maisinfo .icon-background {float: left; margin-right: 10px; margin-top: 10px;}
	.seguros  .maisinfo h2 {font-size: 15px; margin-top: 15px; margin-bottom: 15px; font-family: Helvetica_Neue; font-weight: bold;}
	.seguros  .maisinfo h2.planejamento {margin-top: 20px !important;}
	.seguros  .maisinfo p {font-size: 16px; font-family: Helvetica_Neue; width: 100%; float: none;}

/* SEGURO DE VIDA */
	.segura-de-vida .seguro h1 {font-family: TrajanPro-Bold; font-size: 18px; text-transform: uppercase;}
	.segura-de-vida .seguro .borda {width: 100%; float: left; position: relative; height: auto;}
	.segura-de-vida .seguro hr {background-color: #D2AE6D; height: 3px; width: 90px; float: left; margin-top: -3px;}
	.segura-de-vida p {font-size: 16px; font-family: Helvetica_Neue;}


	.segura-de-vida .colum-conteudo {width: 100%; float: left; position: relative; height: auto;}
	.segura-de-vida .colum1 {margin-bottom: 20px;}
	.segura-de-vida .icon-background {float: left; margin-right: 10px; margin-top: 10px;}
	.segura-de-vida .colum-conteudo h2 {font-size: 20px; font-family: Helvetica_Neue; font-weight: bold; margin-bottom: 10px; margin-top: 12px;}

/* SERVIÇOS */
	.servicos .mvv p {font-size: 16px; font-family: Helvetica_Neue; margin-top: 0; margin-bottom: 10px;}
	.servicos .mvv .colum1 .colum-conteudo img {margin-top: 5px;}

/* PARA SUA EMPRESA */
	.empresarial .horizon-swiper section h2 {background-color: rgb(210,174,109); text-transform: uppercase; font-family: Avant_Garde_Gothic; font-size: 10px; padding: 3px 0 3px 5px; width: 220px;}

	@media screen and (max-width: 991px) {
		.empresarial .horizon-swiper section:nth-child(2) {margin-bottom: 50px;}
		.seguros .horizon-swiper section:nth-child(2) {margin-bottom: 50px;}
		.servicos .mvv article:nth-child(3), .segura-de-vida .mvv article:nth-child(3) {margin-top: 0;}
	}

/* INFORMAÇÕES IMPORTANTES */
	.informacoes .mvv p {font-family: Helvetica_Neue; font-size: 16px;}
	.informacoes .question {background-color: rgb(210,174,109); color: #fff; padding: 5px 1px 1px 10px; margin: 10px 10px 0 0; border-radius: 4px;}
	.informacoes .question img {float: left; margin-right: 15px;}
	.informacoes .question p {line-height: 1; font-family: Helvetica_Neue; font-size: 16px;}
	.informacoes .leis ul {margin-left: 15px;}
	.informacoes .leis ul li {list-style: square; color: rgb(210,174,109); font-size: 16px; font-family: Helvetica_Neue; font-weight: normal;}
	.informacoes .leis ul li p {color: #000; font-size: 16px; font-family: Helvetica_Neue; font-weight: normal;}

/* CONTATO */
	.contato {margin-top: 30px;}
	.contato section h1 {font-family: Avant_Garde_Gothic; font-size: 21px; border-left: 2px solid #000; padding-left: 15px;}
	.contato section p {margin-top: 15px;font-family: Helvetica_Neue; font-size: 15px;}
	.contato section button {margin-top: 15px; border-radius: 5px; background-color: rgb(210,174,109); color: #fff; border: none; padding: 15px 10px;font-family: Helvetica_Neue; font-size: 15px; width: 40%;}
	.contato section label {width: 100%; margin-bottom: -3px; font-size: 13px;font-family: Helvetica_Neue;}
	.contato section input {width: 100%; margin-bottom: 10px;}
	.contato section textarea {width: 100%;}
	.contato .background {background-color: #cecece; padding: 15px 0;}
	.contato .background .container {color: #fff !important; width: 60%; margin: 0 auto;}
	.contato .background .container h1 {padding-left: 0; border-left: 0; border-bottom: 2px solid #fff; margin-top: 15px; font-size: 26px; font-family: Avant_Garde_Gothic}
	.contato .background .container p {font-size: 16px;font-family: Helvetica_Neue}

	.links {margin-top: 20px;}
	.links li {font-family: Avant_Garde_Gothic; font-size: 13px; color: #000;}
	.links p a {color: #000; padding-left: 20px; font-family: Helvetica_Neue; font-size: 10px;}

/*GLOSSARIO*/
	.container .tittle h2 {text-align: center; margin-top: 30px;}
	.container .text {margin-top: -60px;}
	.container .text  a {color: #D2AE6D !important;}
	.navbar-inverse .navbar-nav .Indices {position: auto;margin-left: 120px;margin-right:100px;text-align: center;}
	.navbar-inverse .navbar-nav .Indices> .active > a {color: #D2AE6D !important;}
	.navbar-inverse .navbar-nav .Indices> .active:hover > a {color: #D2AE6D !important;}
	.navbar-inverse .navbar-nav .Indices> li { display: inline;margin: 0 10px !important;}
	.navbar-inverse .navbar-nav .Indices> li > a {font-family: Avant_Garde_Gothic; color: #000 ; margin-top: 100px; font-size: 20px;margin-left: 15px;text-align: center;}
	.navbar-inverse .navbar-nav .Indices> li:hover > a {color: #fff !important; border-color: #D2AE6D; padding-bottom: 0px;}
	.navbar-inverse .navbar-nav .Indices> li:hover > a {color: #D2AE6D !important; border-color: #D2AE6D; padding-bottom: 0px;}
	.navbar-inverse .navbar-nav .Indices> .ativo > a {color: #D2AE6D !important; border-color: #D2AE6D; padding-bottom: 0px;}
	.navbar-inverse .glossario {margin-top: -20px;}

/*Item slider*/
	.empresarial  {float: left; width: 100%;}
	.horizon-swiper{overflow:hidden; position: relative; padding-bottom: 25%; height: 310px; min-height: 310;width: 100%}
	.horizontal-item{position: relative; float: left; width: 23%; min-height: 320px;display: block;}
	.Seguro-item{position: relative; float: left; width: 23%; min-height: 320px;display: block;margin-right: 2%}
	.slider{overflow:visible;position: absolute; width: 100%; height: 100%;}
	.pre, .nxt{z-index: 2;font-size: 30px;position: absolute;top: 45%; border: 0;background: #ffc4c4; background: hsla(0,0%,90%,0.75); cursor: pointer;}
	.nxt{right:0;}

/*Busca*/
	.barra {text-align: center; background-color: rgba(0,0,0,.8);width: 100%; height:auto; min-height: 50px; position:absolute; left: 0px;z-index: 999; visibility: hidden;}

	.barra h2 {color: #fff !important;}
	.barra ul{list-style-type: none;}
	.barra li { margin-top: 0px !important;}
	.barra li  a { margin-top: 0px;font-family: Avant_Garde_Gothic; color: #fff ;font-size: 8px;margin-top: 5px;text-align: center;}
	.barra li:hover > a {color: #D2AE6D !important; border-color: #D2AE6D; padding-bottom: 0px;}



	@media screen and (max-width: 1000px)
	{
		.item1{margin-left: 1%;}
		.item2{margin-left: 1%;}
		.item3{margin-left: 1%;}
		.item4{margin-left: 1%;}
		.item5{margin-left: 1%;}
		.horizon-swiper{overflow:hidden; position: relative; padding-bottom: 25%; height: 300px; min-height: 310;width: 100%}
		.horizontal-item{position: relative; float: left; width: 25%; min-height: 320px;display: block;}
	}

	@media screen and (max-width: 767px)
	{
		.item1{margin-left: 1%;}
		.item2{margin-left: 1%;}
		.item3{margin-left: 1%;}
		.item4{margin-left: 1%;}
		.item5{margin-left: 1%;}
		.horizon-swiper{overflow:hidden; position: relative; padding-bottom: 25%;min-height: 350px;width: 100%}
		.horizontal-item{position: relative; float: left; width: 25%; min-height: 320px;display: block;}
		.barra{background-color: rgba(0,0,0,.8);}
	}

	@media screen and (max-width: 600px)
	{
		.item1{margin-left: 1%;}
		.item2{margin-left: 1%;}
		.item3{margin-left: 1%;}
		.item4{margin-left: 1%;}
		.item5{margin-left: 1%;}
		.horizon-swiper{overflow:hidden; position: relative; padding-bottom: 25%;min-height: 350px;width: 100%}
		.horizontal-item{position: relative; float: left; width: 25%; min-height: 320px;display: block;}
	}

	@media screen and (max-width: 520px)
	{
		.item1{margin-left: 5%;}
		.item2{margin-left: 107%;}
		.item3{margin-left: 205%;}
		.item4{margin-left: 305%;}
		.item5{margin-left: 405%;}
		.slider{width: auto;}
		.horizon-swiper{overflow:hidden; position: relative; padding-bottom: 25%; height: 300px; min-height: 310px;width: 100%}
		.horizontal-item{position: relative; float: left; width: 80%; min-height: 320px;display: block;}
		.slider{margin-left: inherit;}
	}