/**
* Template Name: Moderna - v4.8.0
* Template URL: https://bootstrapmade.com/free-bootstrap-template-corporate-moderna/
* Author: BootstrapMade.com
* License: https://bootstrapmade.com/license/
*/

/*--------------------------------------------------------------
# General
--------------------------------------------------------------*/
body {
  font-family: "Open Sans", sans-serif;
  color: #444;
  background: #1e4356;
}

a {
  color: #4fa6d5;
  text-decoration: none;
}

a:hover {
  color: #45beff;
  text-decoration: none;
}

h1, h2, h3, h4, h5, h6, .font-primary {
  font-family: "Roboto", sans-serif;
}

/*--------------------------------------------------------------
# Back to top button
--------------------------------------------------------------*/
.material-symbols-outlined {
  font-variation-settings:
  'FILL' 0,
  'wght' 400,
  'GRAD' 0,
  'opsz' 48
}
.back-to-top {
  position: fixed;
  visibility: hidden;
  opacity: 0;
  right: 15px;
  bottom: 15px;
  z-index: 99999;
  background: #68A4C4;
  width: 40px;
  height: 40px;
  border-radius: 4px;
  transition: all 0.4s;
}
.back-to-top:hover {
  background: #85b6cf;
  color: rgb(18, 52, 56);
}
.back-to-top.active {
  visibility: visible;
  opacity: 1;
}
#icon{
  color: #1e5069;
  
}
#icon:hover{
  color: #1c3745;
}
/*--------------------------------------------------------------
# Header
--------------------------------------------------------------*/
#header {
  height: 80px;
  transition: all 0.5s;
  z-index: 997;
  transition: all 0.5s;
  background: #1e4356;
  display: flex;
  justify-content: space-around;
}
#header.header-transparent {
  background: none;
}
#header.header-scrolled {
  background: rgba(0, 0, 0, 0.8);
  height: 60px;
}
#header .logo h1 {
  font-size: 28px;
  margin: 0;
  padding: 4px 0;
  line-height: 1;
  font-weight: 400;
  letter-spacing: 3px;
  text-transform: uppercase;
}
#header .logo h1 a, #header .logo h1 a:hover {
  color: #fff;
  text-decoration: none;
}
#header .logo img {
  padding: 0;
  margin: 0;
  max-height: 40px;
}

#main {
  margin-top: 80px;
}

/*--------------------------------------------------------------
# Navigation Menu
--------------------------------------------------------------*/
/**
* Desktop Navigation 
*/
.navbar {
  padding: 0;
}
.navbar ul {
  margin: 0;
  padding: 0;
  display: flex;
  list-style: none;
  align-items: center;
}
.navbar li {
  position: relative;
}
.navbar a, .navbar a:focus {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 0 10px 30px;
  font-family: "Open Sans", sans-serif;
  font-size: 14px;
  color: #fff;
  white-space: nowrap;
  transition: 0.3s;
}
.navbar a i, .navbar a:focus i {
  font-size: 12px;
  line-height: 0;
  margin-left: 5px;
}
.navbar a:hover, .navbar .active, .navbar .active:focus, .navbar li:hover > a {
  color: #a2cce3;
}
.navbar .dropdown ul {
  display: block;
  position: absolute;
  left: 14px;
  top: calc(100% + 30px);
  margin: 0;
  padding: 10px 0;
  z-index: 99;
  opacity: 0;
  visibility: hidden;
  background: rgb(9, 103, 146);
  box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.25);
  transition: 0.3s;
}
.navbar .dropdown ul li {
  min-width: 200px;
}
.navbar .dropdown ul a {
  padding: 10px 20px;
  font-size: 14px;
  text-transform: none;
  color: #1c3745;
}
.navbar .dropdown ul a i {
  font-size: 12px;
}
.navbar .dropdown ul a:hover, .navbar .dropdown ul .active:hover, .navbar .dropdown ul li:hover > a {
  color: #68A4C4;
}
.navbar .dropdown:hover > ul {
  opacity: 1;
  top: 100%;
  visibility: visible;
}
.navbar .dropdown .dropdown ul {
  top: 0;
  left: calc(100% - 30px);
  visibility: hidden;
}
.navbar .dropdown .dropdown:hover > ul {
  opacity: 1;
  top: 0;
  left: 100%;
  visibility: visible;
}
@media (max-width: 1366px) {
  .navbar .dropdown .dropdown ul {
    left: -90%;
  }
  .navbar .dropdown .dropdown:hover > ul {
    left: -100%;
  }
}

/**
* Mobile Navigation 
*/
.mobile-nav-toggle {
  color: #fff;
  font-size: 28px;
  cursor: pointer;
  display: none;
  line-height: 0;
  transition: 0.5s;
}

@media (max-width: 991px) {
  .mobile-nav-toggle {
    display: block;
  }

  .navbar ul {
    display: none;
  }
}
.navbar-mobile {
  position: fixed;
  overflow: hidden;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  background: rgba(17, 38, 48, 0.9);
  transition: 0.3s;
}
.navbar-mobile .mobile-nav-toggle {
  position: absolute;
  top: 15px;
  right: 15px;
}
.navbar-mobile ul {
  display: block;
  position: absolute;
  top: 55px;
  right: 15px;
  bottom: 15px;
  left: 15px;
  padding: 10px 0;
  background-color: #fff;
  overflow-y: auto;
  transition: 0.3s;
}
.navbar-mobile a, .navbar-mobile a:focus {
  padding: 10px 20px;
  font-size: 15px;
  color: #1e4356;
}
.navbar-mobile a:hover, .navbar-mobile .active, .navbar-mobile li:hover > a {
  color: #68A4C4;
}
.navbar-mobile .getstarted, .navbar-mobile .getstarted:focus {
  margin: 15px;
}
.navbar-mobile .dropdown ul {
  position: static;
  display: none;
  margin: 10px 20px;
  padding: 10px 0;
  z-index: 99;
  opacity: 1;
  visibility: visible;
  background: #fff;
  box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.25);
}
.navbar-mobile .dropdown ul li {
  min-width: 200px;
}
.navbar-mobile .dropdown ul a {
  padding: 10px 20px;
}
.navbar-mobile .dropdown ul a i {
  font-size: 12px;
}
.navbar-mobile .dropdown ul a:hover, .navbar-mobile .dropdown ul .active:hover, .navbar-mobile .dropdown ul li:hover > a {
  color: #68A4C4;
}
.navbar-mobile .dropdown > .dropdown-active {
  display: block;
}
/*--------------------------------------------------------------
# LOGO
--------------------------------------------------------------*/
#txt{
  font-size: 30px;
  color:#7EC8E3;
  font-weight: 900;
}

#txt:hover{
  text-shadow: 2px 2px 20px #2282ff;
}
#hero-no-slider {
  width: 100%;
  height: 98vh;
  overflow: hidden;
  position: relative;
  text-align: center;
}
#hero-no-slider::after {
  content: "";
  position: absolute;
  top: 0;
  width: 95%;
  height: 90%;
  /* background: linear-gradient(to right, rgb(0, 12, 102, 0.7), rgb(0, 0, 255, 0.5)), url("../img/bg.JPG"), no-repeat; */
  background: linear-gradient(to right, rgba(30, 67, 86, 0.747), rgba(30, 67, 86, 0.6)), url(../img/bg.JPG) no-repeat;
  background-size: 100% 100%;
  border-radius: 0 0 5% 5%;
}
#hero-no-slider h2 {
  color: #D4F1F4;
  margin-bottom: 15px;
  font-family: 'Cookie', cursive;
  font-size: 4.7vw;
  font-weight: 900;
}
#czs{
  font-family:'Volkhov', serif; 
  font-size:4.3vw; 
  color:#7EC8E3
}
#hero-no-slider p {
  color: #fff;
  font-size: 1.4vw;
}
#gen-info{
  display: flex;
  justify-content: space-around;
  margin-top: 0;
  padding: 0;
  margin-bottom: 8vw;
}
#gen-div{
  display: flex;
  flex-direction: column;
  width: 45vw;
  transform: translateX(-5vw);
  opacity: 0;
  transition: transform 2.5s .25s , opacity 0.5s .15s ease-out;
  will-change: transform, opacity;
}
#gen-div.is-visible {
  transform: translateX(0);
  opacity: 1;
}
#gen-h{
  color: #7aafcb;
  font-size: 7vw;
  font-family: 'Cookie', cursive;
}
#gen-p{
  color:#fff;
  font-size: 2.1vw;
  font-family: 'Noto Sans', sans-serif ;
}
#gen-img{
  max-width: 100%;
  height: auto;
}
#aaa{
  width: 82vw;
  height: auto;
  margin:auto;
  margin-bottom: 8vw;
}
#butt{
  display: flex;
  justify-content: space-between;
  margin-bottom: 4vw;
}
.b{
  transition: all .5s ease;
  width: 8.75vw;
  height: 8.75vw;
  border-radius: 50%;
  border: 1.5px solid rgb(126, 200, 227);
  background: #1e5069;
  font-size: 1.85vw;
  display: flex;
  justify-content: center;
  align-items: center;
  color:#7EC8E3;
  font-family: 'Noto Sans', sans-serif;
  opacity: 0;
  transform: translateY(2.5vw);
  transition: transform 1s .25s , opacity 1s .25s ease-out;
  will-change: transform, opacity;
}
.b.is-visible{
  transform: translateY(0);
  opacity: 1;
}
.b:hover, #a1:hover{
  font-size: 2vw;
}
#a1{
  transition: all .5s ease;
  width: 8.75vw;
  height: 8.75vw;
  border-radius: 50%;
  border: 1.5px solid #7EC8E3;
  color: #0b212d;
  font-size: 1.85vw;
  display: flex;
  justify-content: center;
  align-items: center;
  background:#7EC8E3;
  font-family: 'Noto Sans', sans-serif;
  opacity: 0;
  transform: translateY(2.5vw);
  transition: transform 1s .25s, opacity 1s .25s ease-out;
  will-change: transform, opacity;
}
#a1.is-visible{
  transform: translateY(0);
  opacity: 1;
}
#para{
  color:#fff;
  font-size: 1.5vw;
  opacity: 0;
  transform: translateY(2.5vw);
  transition: transform 1s .25s, opacity 1s .25s ease-out;
  will-change: transform, opacity;
}
#para.is-visible{
  transform: translateY(0vw);
  opacity: 1;
}
#notice{
  width: 75vw;
  height: auto;
  margin: auto;
  background: #7EC8E3;
  padding-top: 2.5vw;
  padding-bottom: 2.5vw;
  border-radius: 2vw;
  margin-bottom: 2vw;
  border: 0.5vw double #1e5069;
  transform:rotateX(100deg);
  transform-origin:bottom;
  opacity:0;
  transition: transform 1s 0s ease-in-out, opacity 1s .25s ease-out;
  will-change: transform, opacity;
}
#notice.is-visible{
  transform:rotateX(0);
  transform-origin:bottom;
  opacity:1;
}
#not{
  text-align: center;
  font-size: 3.5vw;
  color:#1e4356;
  font-family: 'Volkhov', serif;
  margin-bottom: 2vw;
}
#not-h{
  font-family: 'Cookie', cursive;
  font-size: 4vw;
  color: #0b212d;
  margin-left: 3vw;
  margin-right: 10vw;
}
#not-p{
  font-size: 2vw;
  color:#111;
}
#not-div{
  display: flex;
  align-items: center;
}
.not-a{
  display: block;
  background: #7EC8E3;
  color:#0b212d;
  border-radius: 2vw;
  width: 11.5vw;
  height: 3.5vw;
  font-size: 1.5vw;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: auto;
  margin-bottom: 8vw;
  opacity: 0;
  transform: translateX(-45vw);
  transition: transform 2s .25s, opacity 1s .25s;
  will-change: transform, opacity;
}
.not-a.is-visible{
  transform: translateX(0);
  opacity: 1;
}
.material-symbols-outlined {
  font-variation-settings:
  'FILL' 0,
  'wght' 400,
  'GRAD' 0,
  'opsz' 48
}
.header{
  color: #7EC8E3;
  font-family: 'Cookie', cursive;
  font-size: 6vw;
  margin-bottom: 2.5vw;
  margin-left: 1.5vw;
  transform:rotateY(100deg);
  transform-origin:left;
  opacity:0; 
  transition: transform 2s 0s ease-in-out, opacity 0.5s .25s ease-out;
  will-change: transform, opacity;
}
.header.is-visible{
  transform:rotateY(0);
  transform-origin:left;
  opacity:1;
}
.ex-row{
  display: flex;
  justify-content: space-around;
}
.ex{
  width: max-content;
  height: auto;
  display: flex;
  align-items: center;
  flex-direction: column;
  text-align: center;
  /* opacity: 0;
  transition: opacity 2s .25s ease-out;
}
.ex.is-visible{
  opacity: 1; */
}
.ex-img{
  width: 22vw;
  height: 22vw;
  border-radius: 8%;
  margin-bottom: 1vw;
}
#one{
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(126, 200, 227, 0.45) 75%, rgba(30, 67, 86, 1) 100%), url(../img/1.JPG) no-repeat center / cover;
  opacity: 0;
  transition: opacity 2s 0.25s ease-out;
}
#one.is-visible{
  opacity: 1;
}
#two{
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(126, 200, 227, 0.45) 75%, rgba(30, 67, 86, 1) 100%), url(../img/2.jpg) no-repeat center / cover;
  opacity: 0;
  transition: opacity 2s 0.45s ease-out;
}
#two.is-visible{
  opacity: 1;
}
#three{
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(126, 200, 227, 0.45) 75%, rgba(30, 67, 86, 1) 100%), url(../img/3.jpg) no-repeat center / cover;
  opacity: 0;
  transition: opacity 2s 0.65s ease-out;
}
#three.is-visible{
  opacity: 1;
}
#four{
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(126, 200, 227, 0.45) 75%, rgba(30, 67, 86, 1) 100%), url(../img/4.jpg) no-repeat center / cover;
  opacity: 0;
  transition: opacity 2s 0.85s ease-out;
}
#four.is-visible{
  opacity: 1;
}
#five{
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(126, 200, 227, 0.45) 75%, rgba(30, 67, 86, 1) 100%), url(../img/5.jpg) no-repeat center / cover;
  opacity: 0;
  transition: opacity 2s 0.25s ease-out;
}
#five.is-visible{
  opacity: 1;
}
#six{
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(126, 200, 227, 0.45) 75%, rgba(30, 67, 86, 1) 100%), url(../img/6.jpg) no-repeat center / cover;
  opacity: 0;
  transition: opacity 2s 0.45s ease-out;
}
#six.is-visible{
  opacity: 1;
}
#seven{
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(126, 200, 227, 0.45) 75%, rgba(30, 67, 86, 1) 100%), url(../img/7.jpg) no-repeat center / cover;
  opacity: 0;
  transition: opacity 2s 0.65s ease-out;
}
#seven.is-visible{
  opacity: 1;
}
#eight{
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(126, 200, 227, 0.45) 75%, rgba(30, 67, 86, 1) 100%), url(../img/8.jpg) no-repeat center / cover;
  opacity: 0;
  transition: opacity 2s 0.85s ease-out;
}
#eight.is-visible{
  opacity: 1;
}
#nine{
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(126, 200, 227, 0.45) 75%, rgba(30, 67, 86, 1) 100%), url(../img/9.jpg) no-repeat center / cover;
  opacity: 0;
  transition: opacity 2s 0.25s ease-out;
}
#nine.is-visible{
  opacity: 1;
}
#ex-sec{
  margin-bottom: 8vw;
}
.ex-name{
  font-size: 1.85vw;
  color: #fff;
  font-family: 'Merriweather', serif;
}
.ex-role{
  font-size: 1.35vw;
  color: #fff;
  font-family: 'Noto Sans', sans-serif;
  margin-bottom: 4vw;
}
.empty-div{
  width: 22vw;
  height: 22vw;
}
#eve-wrap{
  display: flex;
  justify-content: space-around;
}
.eve{
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  width: 40vw;
  height: 20vw;
  background-color: #1c3745;
  border-radius: 2vw;
}
.eve-name{
  width: 17vw;
  font-size: 2.2vw;
  font-family: 'Merriweather', serif;
  color: #fff;
  text-align: center;
}
.eve-img{
  background: url(../img/car.jpg);
  width: 10vw;
  height: 10vw;
  border-radius: 50%;
}
#car{
  transform: translateX(-3vw);
  opacity: 0;
  transition: transform 1.5s .15s ease-in-out, opacity 2s .25s ease-out;
  will-change: transform, opacity;
}
#pri{
  transform: translateX(3vw);
  opacity: 0;
  transition: transform 1.5s .15s ease-in-out, opacity 2s .25s ease-out;
  will-change: transform, opacity;
}
#car.is-visible, #pri.is-visible{
  transform: translateX(0);
  opacity: 1;
}
hr{
  color:#fff;
}
.eve-date{
  align-self: flex-end;
  width: 8vw;
  display: flex;
  align-items: center;
}
.eve-date h1{
  font-size: 2.25vw;
  color:#7EC8E3;
  margin-right: 1vw;
}
.eve-date h2{
  font-size: 1.125vw;
  color: #fff;
  margin-bottom: .125vw;
}
.eve-date h3{
  font-size: 1vw;
  color: #fff;
}
#eve-sec{
  margin-bottom: 8vw;
}
.gal-row{
  display: flex;
  justify-content: space-around;
  margin-bottom: 1.5vw;
}
.gal-img{
  width: 100%;
}
.img-wrap{
  width: 24vw;
  height: auto;
  transform:rotateX(100deg);
  transform-origin:bottom;
  opacity:0;
}
.img-wrap.is-visible{
  transform:rotateX(0);
  transform-origin:bottom;
  opacity:1;
}
#last-div{
  background: linear-gradient(to bottom, #1e4356, #133344);
  display: flex;
  justify-content: space-between;
  padding-bottom: 8vw;
  opacity: 0;
  transition: opacity 2s .25s ease-out;
  will-change: opacity;
}
#last-div.is-visible{
  opacity: 1;
}
#follow{
  width: 47.5vw;
}
#contact{
  width: 47.5vw;
}
.f-head{
  font-size: 7vw;
  color: #fff;
  font-family: 'Cookie', cursive;
  text-align: center;
  text-shadow: 0 0 0 transparent;
  transition: text-shadow 1.5s .25s ease-out;
}
.f-head.is-visible{
  text-shadow:  0.01vw 0.01vw .5vw #fff;
}
#s-logo{
  width: 11.5vw;
  justify-self: center;
}
.icon{
  width: 4.5vw;
}
#icon-div{
  width: 11.5vw;
  display: flex;
  justify-content: space-between;
}
#social-wrap{
  display: flex;
  justify-content: space-around;
}
.con{
  display: flex;
  align-items: center;
  margin-bottom: 2vw;
}
.con-h{
  font-family: 'Noto Sans', sans-serif;
  font-size: 1.95vw;
  color:#fff;
}
.con-thing{
  font-family: 'Noto Sans', sans-serif;
  font-size: 2vw;
  color:#fff;
  font-weight: bold;
  margin-right: 1vw;
}
#i-wrap{
  height:20vw;
  display: flex;
  flex-direction: column;
  justify-content: space-evenly;
}
#rafi:hover{
  color: #45beff;
  text-decoration:underline;
}
@media only screen and (max-width: 600px) {
  .header{
    font-size: 15vw;
    text-align: center;
  }
  #hero-no-slider h2 {
    font-size: 9vw;
  }
  #czs{
    font-size: 5.2vw;
  }
  #hero-no-slider p{
    font-size: 3.5vw;
  }
  #gen-info{
    flex-direction: column;
  }
  #gen-div{
    width: 95vw;
    margin: auto;
  }
  #gen-h{
    font-size: 12.5vw;
    text-align: center;
  }
  #gen-p{
    font-size: 4.5vw;
    text-align: center;
  }
  #gen-img{
    margin-bottom: 15vw;
  }
  #aaa{
    width: 90vw;
    margin-bottom: 20vw;
  }
  .b, #a1{
    width: 20vw;
    height: 20vw;
    font-size: 4.25vw;
    border:1.2px;
  }
  .b:hover, #a1:hover{
    font-size: 3.75vw;
  }
  #para{
    font-size: 3.5vw;
  }
  #notice{
    border:2.5vw double rgb(30, 67, 86);
  }
  #not{
    font-size: 8vw;
  }
  #not-div{
    display: block;
  }
  #not-h{
    text-align: center;
    font-size: 9.5vw;
  }
  #not-p{
    font-size: 4.5vw;
    margin-left: 4vw;
  }
  .not-a{
    width: 26vw;
    height: 8vw;
    font-size: 3.65vw;
    border-radius: 3.75vw;
    margin-bottom: 20vw;
  }
  #ex-h{
    font-size: 13.5vw;
  }
  .ex-row{
    flex-direction: column;
    align-items: center;
  }
  .ex-img{
    width: 83.5vw;
    height: 83.5vw;
    margin-bottom: 3.5vw;
  }
  #two{
    transition: opacity 2s 0.25s ease-out;
  }
  #three{
    transition: opacity 2s 0.25s ease-out;
  }
  #four{
    transition: opacity 2s 0.25s ease-out;
  }
  #six{
    transition: opacity 2s 0.25s ease-out;
  }
  #seven{
    transition: opacity 2s 0.25s ease-out;
  }
  #eight{
    transition: opacity 2s 0.25s ease-out;
  }
  .ex-name{
    font-size: 6vw;
  }
  .ex-role{
    font-size: 4.5vw;
    margin-bottom: 6vw;
  }
  .empty-div{
    width: 0;
    height: 0;
  }
  #ex-sec{
    margin-bottom: 20vw;
  }
  #eve-wrap{
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
  .eve{
    width: 95vw;
    height: 47.5vw;
    margin-bottom: 6vw;
    justify-content: space-around;
  }
  .eve-img{
    width: 30vw;
    height: 30vw;
  }
  .eve-name{
    font-size: 5.25vw;
  }
  hr{
    text-align: center;
  }
  .eve-date{
    width: auto;
  }
  .eve-date h1{
    font-size: 5vw;
  }
  .eve-date h2{
    font-size: 2.5vw;
  }
  .eve-date h3{
    font-size: 1.75vw;
  }
  #eve-sec{
    margin-bottom: 20vw;
  }
  .img-wrap{
    width: 97.5vw;
    margin-bottom: 2vw;
  }
  .gal-row{
    flex-direction: column;
    align-items: center;
    margin-bottom: 0;
  }
  .gal-img{
    width: 100%;
    margin: auto;
  }
  #gal-div{
    margin-bottom: 3vw;
  }
  .f-head{
    font-size: 15vw;
    text-shadow: 0.5px 0.5px 1px #fff;
  }
  .f-head.is-visible{
    text-shadow:  0.25vw 0.25vw 1.15vw #fff;
  }
  #last-div{
    flex-direction: column;
  }
  #follow{
    width: 100vw;
    margin-bottom: 10vw;
  }
  #social-wrap{
    flex-direction: column;
  }
  #i-wrap{
    height: 65vw;
    margin: auto;
  }
  #s-logo{
    width: 35vw;
  }
  #icon-div{
    width: 35vw;
  }
  .icon{
    width: 15vw;
  }
  iframe{
    width: 93.5vw;
    margin: auto;
  }
  #contact{
    width: 100vw;
  }
  .con{
    width: 98vw;
    margin: auto;
    margin-bottom: 3vw;
  }
  .con-thing{
    font-size: 6vw;
    margin-right: 3vw;
  }
  .con-h{
    font-size: 5.75vw;
  }
}

#footer {
  background: #0b212d;
  padding: 0 0 30px 0;
  color: #fff;
  font-size: 14px;
}
#footer .copyright {
  text-align: center;
  padding-top: 30px;
}
#footer .credits {
  padding-top: 10px;
  text-align: center;
  font-size: 13px;
  color: #fff;
}
#footer .credits a {
  color: #a2cce3;
}