/*rgb(78, 37, 128)*/

body { margin: 0px; font-family: 'Sarpanch', sans-serif; background: #f6f6f6 url('../img/ws-bg.jpg') center center no-repeat fixed; background-size: cover;}
/*Navigation*/
.nav-logo { height: 60px; padding: 0px; margin: 0px; }
.navbar-default .navbar-nav > li > a { color: #fff; }
.navbar-default .navbar-nav > li > a:hover { color: #fff; }
.navbar-brand { margin: 0; padding: 15px; }
.navbar-default {background-color: rgba(20, 80, 180, 0.9); color: #fff; border: none; }

.fixed-layer {background-color: rgba(173, 173, 173, 0.2); margin: 0; border: none; min-height: 400px;}
.slogan { background-color: rgba(201, 200, 200, 0.85); color: #fff;}
.slogan h1 { font-size: 28px; margin: 0; padding: 0;}
.slogan h1 small {color: rgb(20, 80, 180);}

.ci-colored {color: rgb(20, 80, 180);} 

a {color: rgb(20, 80, 180);}
a:visted {color: rgb(20, 80, 180);}

/*Centered Content*/
.v-center {display: table!important; height: 125px; width: 100%;}
.v-center div[class*='col-']{
  display: table-cell!important;
  vertical-align: middle;
  align-content: center;
  float: none;
}

.ex-mg {padding-top: 90px;padding-bottom: 90px;}
.ex-mg-txt {margin-top: 40px;}
.ex-mg-ul {margin-top: 25px;}

.bg-wh {background-color: rgba(255, 255, 255, 0.95);}
.bg-gr {background-color: rgba(246, 246, 246, 0.95);}

h2 { margin-bottom: 40px; }
h3 {margin-bottom: 25px;}

iframe { margin-bottom: -5px;}

footer { color: #fff; background-color: rgba(20, 80, 180, 0.9); padding: 0; }
footer p, footer ul{ padding: 20px 0px; margin: 0; }
footer a { color: #fff; }
footer a:hover {color: #fff; }

/* Social Media Buttons */
.scl-lnk { margin-top: 20px; display: inline-block; min-height: 90px; min-width: 90px;}
.scl-fb { background: url(../img/scl/fb-bw.png) no-repeat center center; background-size: cover;}
.scl-ig { background: url(../img/scl/inst-bw.png) no-repeat center center; background-size: cover;}
.scl-fb:hover { background: url(../img/scl/fb-cl.png) no-repeat center center; background-size: cover;}
.scl-ig:hover { background: url(../img/scl/inst-cl.png) no-repeat center center; background-size: cover;}

/*Image effect*/

.view {
    width: 100%;
    height: 100%;
    margin: 10px;
    float: left;
    border: 10px solid #fff;
    overflow: hidden;
    position: relative;
    text-align: center;
    box-shadow: 1px 1px 2px #e6e6e6;
    cursor: default;
    background: rgba(20, 80, 180, 0.9) url(../img/logo-ws.svg) no-repeat center center
}
.view .mask, .view .content {
    width: 100%;
    height: 100%;
    position: absolute;
    overflow: hidden;
    top: 0;
    left: 0
}
.view img {
    display: block;
    position: relative
}

.view-style img { 
	transition: all 0.4s ease-in-out 0.2s;
    opacity: 1;
}
.view-style .mask { 
    background-size: cover;
	opacity: 0;
	transform: scale(0) rotate(-180deg);
	transition: all 0.4s ease-in;
    border-radius: 0px;
}

.view-style:hover .mask { 
	opacity: 1; 
	transform: scale(1) rotate(0deg);
	transition-delay: 0.2s;
}								  
.view-style:hover img 	  { 
	transform: scale(0); 
    opacity: 0;
	transition-delay: 0s;
}

.view-style .img-01 {
  background: rgba(183, 183, 183, 0.8) url(../img/img-01-2.jpg) no-repeat center top;
  background-size: cover;
}
.view-style .img-02 {
  background: rgba(183, 183, 183, 0.8) url(../img/img-02-2.jpg) no-repeat center top;
  background-size: cover;
}
.view-style .img-03 {
  background: rgba(183, 183, 183, 0.8) url(../img/img-03-2.jpg) no-repeat center top;
  background-size: cover;
}
.view-style .img-04 {
  background: rgba(183, 183, 183, 0.8) url(../img/img-04-2.jpg) no-repeat center top;
  background-size: cover;
}
.view-style .img-05 {
  background: rgba(183, 183, 183, 0.8) url(../img/img-05-2.jpg) no-repeat center top;
  background-size: cover;
}
.view-style .img-06 {
  background: rgba(183, 183, 183, 0.8) url(../img/img-06-2.jpg) no-repeat center top;
  background-size: cover;
}
.view-style .img-07 {
  background: rgba(183, 183, 183, 0.8) url(../img/img-07-2.jpg) no-repeat center top;
  background-size: cover;
}
.view-style .img-08 {
  background: rgba(183, 183, 183, 0.8) url(../img/img-08-2.jpg) no-repeat center top;
  background-size: cover;
}
.view-style .img-09 {
  background: rgba(183, 183, 183, 0.8) url(../img/img-09-2.jpg) no-repeat center top;
  background-size: cover;
}