/*
Theme Name: MyCMS for TaiSeiko
Text Domain: MyCMS
Version: 0.2
Description: MyCMS for Organizations child theme
Tags: sidebar
Author: Iserveweb
Author URI: http://iserveweb.com
Template: mycms-org
Text Domain: mycms-org-taiseiko
*/
body{background: url(assets/i/rect1916.png) #dbeeff; font-family: 'Bricolage Grotesque';}
body .container{box-shadow: 0 10px 20px #004;}
#header{background: linear-gradient(0deg,rgba(255, 255, 255, 1) 0%, rgba(221, 238, 255, 1) 100%);}

nav#sitenav{font-weight: 600; vertical-align: baseline; }
#navLinks ul li a{ text-transform: uppercase;}

div.jumbotron{background: #003; color: #f0f8ff}
#content .jumbotron header{background: url(assets/i/home-bg.jpg) no-repeat; background-size: contain; text-align: justify;}
#content div.jumbotron.about-taiseiko header{background: url(assets/i/about-bg.jpg) top right no-repeat; background-size: contain;}
#content div.jumbotron.our-people header{background: url(assets/i/people-bg.jpg) top right no-repeat; background-size: contain;}
#content div.jumbotron.our-services header{background: url(assets/i/services-bg.jpg) top right no-repeat; background-size: contain;}
#content div.jumbotron.contact-us header{background: url(assets/i/contact-bg.jpg) top right no-repeat; background-size: contain;}
#content .jumbotron header h1{color: #f3f8fb;}
#content .jumbotron header #main-text{background-color: #00032899;}
@media screen and (min-width: 1200px) {
#content .jumbotron header #main-text{background-color: transparent;}
}
.jumbotron a{color: #fff;}
.jumbotron #main-text img{border-radius: 10px;  transition: 250ms transform ease-in-out;}
.jumbotron #main-text img:hover{transform:  scale(1.025);}
.btn-primary{background-color: #04e;}
.btn-dark{background-color: #000328;}
.btn-dark:hover{background-color: #0d41e1;}

.navbar .nav-item a.nav-link{color: #000328;}
.navbar .nav-item a.nav-link.active{color: #0d41e1;}
.navbar .nav-item a.nav-link:hover{color: #00883f;  transition: color 1.5s;}

.tai-search{display: inline-block; width: 1em; height: 1em; background: url(assets/i/arrow-white.png) no-repeat;
    background-size: cover;}
#content h1{
    font-weight: 600;
}
#pagewidth{background: linear-gradient(0deg,rgba(255, 255, 255, 1) 0%, rgba(221, 238, 255, 1) 100%);}
#highlights{ font-size: smaller;;}
/*.highlight{background: linear-gradient(135deg,rgba(255, 255, 255, 1) 0%, rgba(13, 65, 225, 1) 100%); color: #fff;}*/
#highlights .card{box-shadow: 1px 3px 5px 0 #000328; overflow: hidden;}
#highlights .card .card-body{background: #eef linear-gradient(135deg,rgba(238, 238, 238, 1) 0%, rgba(221, 238, 255, 1) 100%);;}
#highlights .card, #highlights .card .card-img-top, #highlights .card .card-footer{border-color: #062181; border-width: 0; }
#highlights .card .card-img-top{border-bottom: 1px solid #dde;}
#highlights h5.card-title{font-weight: 800; color: #062181;}
#highlights .card-text{text-align: justify;}
#highlights .card-text h3{text-align: start;}
#highlights .card-text strong{color:#374366;}
#highlights .card-text img.float-start{margin: 0  15px 15px 0; box-shadow: 5px 5px 15px #000328; transition: 250ms transform ease-in-out;}
#highlights .card-text img.float-start:hover{transform:  scale(1.025);}
#highlights .card-footer{background: linear-gradient(135deg,rgba(64, 112, 255, 1) 0%, rgba(6, 33, 129, 1) 100%); color: #dbeeff;}
#highlights .card-footer a {font-size: larger; font-weight: 700;}
.tai-more{background: transparent url(assets/i/arrow-white-3.png) no-repeat; text-decoration: none; background-position: center right; background-size: 1em; padding-right: 1.5em; color: #fff;}
a.tai-more{background: transparent url(assets/i/arrow-white-3.png) no-repeat; text-decoration: none; background-position: center right; background-size: 1em; padding-right: 1.5em; color: #fff;}
a.tai-more:hover{background: transparent url(assets/i/arrow-blue-3.png) no-repeat; color: #0066ee; background-position: center right; background-size: 1em;padding-right: 1.8em; transition: 0.5s;}

#col2 .card{
    background: #7094ef;
    border: 0;
    border-radius: 0;
    margin-bottom: 20px;
    padding-bottom: 10px;
  }
  #col2 .card-header{
    background: #062181;
    color: #fff;
    text-wrap: nowrap;
    margin-bottom: 10px;
  }

body #footer .container{box-shadow: none;}
#footer{background: url(assets/i/tai-bg-01.jpg) bottom center #7094ef; background-size: cover;  margin: 0 -12px -20px; padding: 15px 15px 30px; color: #fff;}
#footer .col{margin-bottom: 10px;}
#footer .col div:first-child{background: #4070ffcc; height: 100%;  border-radius: 10px;}
#footer .col div:first-child:hover{background: #4070ffdd;}
#footer h3{background: #000033; padding: 5px 10px; color: #cdf; font-weight: 600;}
#footer .textwidget{padding: 10px;}
#footer p{ padding: 5px 0;}
#footer #credits p{font-size: 90%;}
#footer a{color: #dbeeff;}
#footer a:hover{ color: #fff; text-decoration: underline; transition: all 0.35s ease-in-out;}
#footer .nav > li > a {padding: 3px;}
#footer .highlight{color: #fff;}
i.tai-social{width: 50px; height: 50px; display: inline-block; background-size: contain; background-repeat: no-repeat; background-position: center center; border-radius: 10px; background-color: #ddf;}
.tai-facebook{background-image: url(assets/i/social-icon_facebook.png);}
.tai-linkedin{background-image: url(assets/i/social-icon_linkedin.png);}
.tai-twitter{background-image: url(assets/i/social-icon_twitter.png);}
.social a{margin: 0 2px 10px 0}
.social a:hover i{background-color: #003;}
#footer .col .textwidget div.social{background: transparent; border-radius: 0;}

@keyframes flash1{
    0% {filter: opacity(100%)}
    100% {filter: opacity(80%)}
}
@keyframes fadeIn {
    0% {        opacity: 0;   }
   100% {        opacity: 1;}
}
@keyframes fadeIn25 {
    0% {        opacity: 0.25;   }
   100% {        opacity: 1;}
}
@keyframes fadeInTurn {
    0% {        opacity: 0; transform: rotateY(90deg);   }
   20% {        opacity: 1;   transform: rotateY(0deg);}
   60% {        opacity: 1;   transform: rotateY(0deg);}
   100% {        opacity: 0; transform: rotateY(90deg);   }
}
@keyframes logoReveal{
    0%{ margin-top: 0; opacity: 1; width: 200px;}
    20%{ margin-top: 0; opacity: 0; width: 200px; height: 55px;}
    25%{ margin-top: 0; opacity: 0; width: 60px; height: 55px;}
    50%{ margin-top: 55px; opacity: 0; width: 60px;}
    75%{ margin-top: 0; opacity: 1;width: 60px;}
    100%{ margin-top: 0; opacity: 1; width: 200px;}

}

@media (prefers-reduced-motion: no-preference){
#pagewidth.container div#highlights div.card.highlight img.card-img-top{transition: 250ms transform ease-in-out;}
#pagewidth.container div#highlights div.card.highlight img.card-img-top:hover{transform:  scale(1.025);}
  #content .jumbotron header #side-image img{
    opacity: 0; transform: rotateY(90deg);
    animation: fadeInTurn 5s ease-in forwards 5s infinite alternate;
}

#header a.navbar-brand{
    width: 200px;
    max-height: 73px;
    overflow: hidden;
}
#header a.navbar-brand img#logo-image{
    opacity: 1;
    width: 200px;
    height: 55px;
    object-fit: cover;
    object-position: 0 0;
    animation: logoReveal 2s forwards 1s;
   
    
}
nav#sitenav #navLinks, nav#sitenav  #navbar-toggler, nav#sitenav  #searchform{
    opacity: 0.25;
    animation: fadeIn25 1s ease-in 3s forwards;}
}