@body{
font-family: 'Ropa Sans', sans-serif;
background: #e1e1e1;
}
.card-body img{
    border-radius: 1rem;
    line-height: 120px;

}
.flip-div{
cursor: pointer;
}
.flip-div:hover .back,.flip-div.hover .back {
    -webkit-transform: rotateY(0deg);
    -moz-transform: rotateY(0deg);
    -o-transform: rotateY(0deg);
    -ms-transform: rotateY(0deg);
    transform: rotateY(0deg);
    max-height: 320px;
}
.flip-div:hover .front,.flip-div.hover .front {
-webkit-transform: rotateY(180deg);
-moz-transform: rotateY(180deg);
-o-transform: rotateY(180deg);
transform: rotateY(180deg);
}
.flip-main{
    -webkit-transition: 1s;
    -webkit-transform-style: preserve-3d;
    -ms-transition: 1s;
    -moz-transition: 1s;
    -moz-transform: perspective(1000px);
    -moz-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
    transition: 1s;
    transform-style: preserve-3d;
    position: relative;
    font-size: medium;
}
.front{
position: relative;
-webkit-transform: rotateY(0deg);
-ms-transform: rotateY(0deg);
z-index: 2;
margin-bottom: 30px;
}
.back{
position: absolute;
top: 0;
left: 0;
-webkit-transform: rotateY(-180deg);
-moz-transform: rotateY(-180deg);
-o-transform: rotateY(-180deg);
-ms-transform: rotateY(-180deg);
transform: rotateY(-180deg);
-webkit-box-shadow: 5px 7px 9px -4px rgb(158, 158, 158);
-moz-box-shadow: 5px 7px 9px -4px rgb(158, 158, 158);
box-shadow: 5px 7px 9px -4px rgb(158, 158, 158);
}
.back ul li a{
font-size: 18px;
}
.front,.back {
-webkit-backface-visibility: hidden;
-moz-backface-visibility: hidden;
-ms-backface-visibility: hidden;
backface-visibility: hidden;
-webkit-transition: 1s;
-webkit-transform-style: preserve-3d;
-moz-transition: 1s;
-moz-transform-style: preserve-3d;
-o-transition: 1s;
-o-transform-style: preserve-3d;
-ms-transition: 1s;
-ms-transform-style: preserve-3d;
transition: 1s;
transform-style: preserve-3d;
}

blockquote {
  background: #f9f9f9;
  border-left: 10px solid #ccc;
  margin: 1.5em 10px;
  padding: 0.5em 10px;
  quotes: "\201C""\201D""\2018""\2019";
}

blockquote:before {
  color: #ccc;
  content: open-quote;
  font-size: 4em;
  line-height: 0.1em;
  margin-right: 0.25em;
  vertical-align: -0.4em;
}
blockquote p {
    display: inline;
    font-size: 1rem;
    text-align: justify;
    font-weight: 400;
    color: #707070;
    padding-left: 15px;
}
figcaption {
    font-size: 0.9rem;
    text-align: right;
    font-weight: 400;
    color: #3E3E3E;
}


.wrapper {
	max-width: 1120px;
   margin: 0 auto;
   padding: 0 .5rem;
   overflow: hidden;
}

img.round {
    border-radius: .5rem;
    box-shadow: 2px 2px 7px 2px rgba(89,89,89,0.96);
    -webkit-box-shadow: 2px 2px 7px 2px rgba(89,89,89,0.96);
}
/*-- Center All Images & Set Max Width --*/
img {
   display: block;
	margin: 0 auto;
   max-width: 100%;
}

/*============= TOP BAR HEADER =============*/
.top-bar {
    height: 2.5rem;
    padding: .4rem 0 .5rem;
    border-radius: 0.5rem;
    -webkit-box-shadow: inset 1px 1px 0px 2px #000000;
    box-shadow: inset 1px 1px 0px 2px #000000;
}
.top-bar [class*="col-"] {
   padding: 0!important;
   margin: 0!important;
}
.top-bar p, .top-bar a {
   color: #425170!important;
   text-decoration: none!important;
   font-size: 1rem;
   display: inline;
}
ul.social {
   display: table;
   list-style-type: none;
   margin: 0 auto;
   padding: 0;
}
ul.social li {
   display: inline;
   padding: 0 .5rem;
}
.top-bar .svg-inline--fa.fa-w-14 {
   color: #647597;
   font-size: 1.45rem;
   transition: all 0.5s ease 0s;
}
.top-bar .svg-inline--fa.fa-w-14:hover {
   color: #293346;
}



/* pagination */

ul.pagination {
    display: inline-block;
    padding-top: 25px;
    padding-right: 25px;
    padding-left: 25px;
    padding-bottom: 25px;
    margin: 0;
}

ul.pagination li {display: inline;}

ul.pagination li a {
    color: #FFF;
    float: left;
    padding-top: 15px;
    padding-right: 10px;
    padding-left: 10px;
    padding-bottom: 5px;
    text-decoration: none;
    border: 1px solid #ddd;
    margin: 0 2px;
    font-size: large;
    background-color: #C89E0E;
}

ul.pagination li a.active {
    background-color: #4CA4AF;
    color: white;
    border: 1px solid #4CAF50;
}

ul.pagination li a:hover:not(.active) {
    background-color: #ddd;
    color: #070707;
    
}

div.center {text-align: center;}



/*----------------------------------------*/
/*  01.8 FB's Breadcrumb
/*----------------------------------------*/
.breadcrumb-content {
	padding: 21px 0 22px 15px;
	background: #ffffff;
	border: 1px solid #ededed;
}
.breadcrumb-content li {
  display: inline-block;
  font-size: 14px;
  margin-right: 10px;
  position: relative;
}
.breadcrumb-content li.active {
	color: #4C8007;
	font-size: medium;
}
.breadcrumb-content li a {
	color: #333333;
	transition: all 0.3s ease-in-out;
	font-weight: normal;
	font-size: medium;
}
.breadcrumb-content li a:hover {
  color: #e23e57;
}
.breadcrumb-content li::before {
  content: "\f125";
  position: absolute;
  right: -9px;
  top: 1px;
  font-family: "Ionicons";
  font-size: 8px;
}
.breadcrumb-content li:last-child::before {
  display: none;
}
/*----------------------------------------*


/*-- Headings --*/
h1 {
   font-family: 'Roboto Condensed', sans-serif;
	text-align: center;
	font-size: 175%;
	text-transform: uppercase;
	letter-spacing: .1rem;
	padding: .6rem 0;
}
h2, h3, h4 {
   font-family: 'Roboto Condensed', sans-serif;
	text-align: center;
	text-transform: uppercase;
}

hr.border-orange {
    max-width: 70%;
    margin: 1rem auto;
    border-top: .15rem solid #F07818;
    border-radius: 20%;
    box-shadow: 0 0 .5rem rgba(0, 0, 0, .1);
    opacity: 0.5;
}


/*============= TOP BAR HEADER =============*/
.top-bar {
    height: 2.5rem;
    padding: .4rem 0 .5rem;
    border-radius: 0.5rem;
    -webkit-box-shadow: inset 1px 1px 0px 2px #000000;
    box-shadow: inset 1px 1px 0px 2px #000000;
}
.top-bar [class*="col-"] {
   padding: 0!important;
   margin: 0!important;
}
.top-bar p, .top-bar a {
   color: #425170!important;
   text-decoration: none!important;
   font-size: 1rem;
   display: inline;
}
ul.social {
   display: table;
   list-style-type: none;
   margin: 0 auto;
   padding: 0;
}
ul.social li {
   display: inline;
   padding: 0 .5rem;
}
.top-bar .svg-inline--fa.fa-w-14 {
   color: #647597;
   font-size: 1.45rem;
   transition: all 0.5s ease 0s;
}
.top-bar .svg-inline--fa.fa-w-14:hover {
   color: #293346;
}

/*-- Breadcrumbs (all pages other than home page) --*/
.bread-banner {
	width: 100%;
	height: 4.5rem;
   background-color: #DCDCDC;
   color: #394560;
}
.bread-banner a {
   color: #394560;
}
.bread-banner a:hover {
   color: #5e74a0;
}

/*============= NAVIGATION =============*/

.navbar {
   padding: 0;
   background-color: rgba(66, 81, 112, .9); /* #53668c (for non-transparent menu */
   box-shadow: 0 -.5rem .5rem .1rem rgba(0, 0, 0,.02);
   padding: .5rem 0 .3rem;
   font-family: 'Roboto Condensed', sans-serif;
   font-weight: 900;
   text-transform: uppercase;
}
.navbar .container {
   max-width: 950px;
}
.navbar-brand img {
   height: 3rem;
}
.svg-inline--fa.fa-bars {
   color: #FFF;
   font-size: 1.7rem;
}
.navbar-nav li {
    padding-right: .5rem;
    display: inherit;
}
.navbar-nav .nav-link {
    font-size: 1.2rem;
    padding-top: 0rem;
    color: #F5F5F5;
    display: inherit;
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
}
.navbar-nav .nav-link.active,
.navbar-nav .nav-link:hover {
    color: #FFF!important;
    border-bottom: .15rem solid #FFF;
    display: inherit;
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
}
.nav-item {
    padding: 1rem .8rem .5rem .8rem;
    display: inherit;
}

/*--- Drop-down Menu --*/
.dropdown-menu, .dropdown-item {
    font-size: 1.1rem;
    font-weight: 200!important;
    /*background-color: #53668C; (for non-transparent menu) */
    border: 0;
    color: #F5F5F5;
    text-align: center;
    padding: 0;
}
.dropdown-menu {
   /*background-color: #53668C; (for non-transparent menu) */
   margin-top: 0!important;
   border-radius: 0;
   z-index: 1000;
}
.dropdown-menu:hover, .dropdown-item:hover,
.dropdown-menu:focus, .dropdown-item:focus,
.dropdown-toggle:active, .dropdown-toggle:focus {
   color: #FFF!important;
   background-color: transparent; /*#53668C (for non-transparent menu) */
}
.dropdown-item {
   padding: .3rem 0!important;
}
.dropdown-item:hover {
   text-decoration: underline;
}
.dropdown-submenu > .dropdown-menu {
   width: 100%;
   z-index: 1000;
}
li.nav-item.dropdown.show ul {
   background-color: rgba(66, 81, 112, .9); /*#53668C (for non-transparent menu) */
   margin-top: .3rem!important;
}
.dropdown.show ul li.dropdown-submenu ul {
   background-color: rgba(66, 81, 112, .9); /*#53668C (for non-transparent menu) */
   margin-top: 0!important; 
}

/*-- Top Scroll Button --*/

.scroll-container {
    width: 2.2rem;
    float: right;
    padding-right: 100px;
    text-shadow: 5px 1px;
    text-align: center;
    background-color: #096013;
}
.top-scroll svg.svg-inline--fa {
   font-size: 1.6rem!important;
   height: 2.2rem;
   width: 2.5rem;
   color: #293346;
   background-color: white;
   box-shadow: 0 0 .5rem rgba(0, 0, 0, .05);
   transition: all .5s ease;
}
a.top-scroll {
   bottom: 1.2rem;
   position: fixed;
   opacity: .3;
   z-index: 1000;
   display: none;
}
a.top-scroll:hover {
   opacity: .9;
   transition: all .5s ease;
}
 


@media (max-width: 991.98px) {
   .navbar {
      padding: .25rem 5rem;
   }
   .navbar-nav .nav-link {
      font-size: 1.2rem;
   }
   .navbar-nav .nav-link.active,
   .navbar-nav .nav-link:hover {
      border-bottom: 0;
      text-decoration: underline;
   }
   li.nav-item.dropdown.show ul {
      background-color: transparent;
      margin-top: .3rem!important;
   }
   .dropdown.show ul li.dropdown-submenu ul {
      background-color: transparent;
      margin-top: 0!important; 
   }
   a.dropdown-item {
      text-align: left;
   }
   .carousel-caption h2 {
      font-size: 1.7rem;
   }
}

/* Medium (md) devices (tablets, 768px and under) */
@media (max-width: 767.98px) {
   header img {
      max-width: 20rem;
   }
   .navbar {
      padding: .2rem 2.5rem;
   }
   .navbar-nav .nav-link {
      font-size: 1.1rem;
   }
   .dropdown-menu, .dropdown-item {
      font-size: 1rem;
    }
   .carousel-caption {
      top:38%;
   }
   .carousel-caption h2 {
      font-size: 1.5rem;
   }
   .btn {
      padding: .45rem 1rem;
   }
   h1.title {
      font-size: 2.2rem;
   }
   p.lead {
      font-size: 1.05rem;
   }
   th, td {
      font-size: .9rem;
   }
   td .svg-inline--fa {
      font-size: 1.1rem;;
   }
}

/* Small (sm) devices (landscape phones, 576px and under) */
@media (max-width: 575.98px) {
   .navbar {
      padding: .2rem .5rem;
   }
   .navbar-nav li {
      border-top: 0;
   }
   .carousel-caption {
      top:32%!important;
   }
   .carousel-caption h2 {
      font-size: 1.3rem;
   }
   .btn {
      padding: .4rem .9rem;
   }
   h1.title {
      font-size: 1.9rem;
   }
   h2 {
      font-size: 1.8rem;
   }
   h3 {
      font-size: 1.7rem;
   }
}