/*HOME PAGE*/

/*@media (min-width: 760px) {
@keyframes toppicboxzoom {
   0% {-webkit-transform : translateY(-50%) scale(0.5); opacity: 0;}
   100% {-webkit-transform: translateY(-50%) scale(1); opacity: 1;}
}
.toppicbox {animation: toppicboxzoom 1s;}

@keyframes slidecap {
   0% {-webkit-transform : translateY(-48%) translateX(-60%); opacity: 0;}
   100% {-webkit-transform: translateY(-48%) translateX(0%); opacity: 1;}
}
.caption {animation: slidecap 1s;}

@keyframes sblockzoom {
0% {-webkit-transform: scale(0.5,0.5);}
5% {-webkit-transform: scale(1.05,1.05);}
10% {-webkit-transform: scale(1,1);}
}

.sb1 {animation: sblockzoom 12s;}
.sb2 {animation: sblockzoom 14s; animation-delay: .08s;}
.sb3 {animation: sblockzoom 16s; animation-delay: .1s;}
.sb4 {animation: sblockzoom 18s; animation-delay: .15s;}

}*/

@media (max-width: 930px) and (min-width: 460px) {.bodyhead span {display: block;}}

/*--------------------------------*/


/*Top image*/

html, body {height:100%;} 
.toppicback {height: 100%; background-size: cover; background-color: #363F6A;} /*100vh;*/
.toppic {height: 100%; position: relative; background-repeat: no-repeat; background-size: cover;}

@media (min-width: 2801px) and (min-height: 1400px) {.toppicback {height: 70%;}}
@media (min-width: 2501px) and (min-height: 1060px) {.toppicback {height: 900px;}}
@media (max-width: 1300px) and (max-height: 740px) {.toppicback {height: 800px;}}
@media (max-width: 950px) and (max-height: 900px) {.toppicback {height: 850px;}}
@media (max-width: 800px) and (max-height: 900px) {.toppicback {height: 800px;}}

.caption {position: absolute; font-size: 50px; text-align: left; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); /*top: 120px; margin-top: 10%;*/ width: 75%; max-width: 1100px;}
.caption .cap1 {font-size: 1.35em; line-height: 1.15; font-weight: 700; letter-spacing: 1.8px; text-shadow: 1px 1px 2px #000; font-family: 'PT Sans Narrow', Arial, Helvetica, sans-serif; color: #FFF;}
.caption .cap2 {font-size: .6em; line-height: 1.35; font-weight: 400; text-transform: uppercase; font-family: 'PT Sans Narrow', Arial, Helvetica, sans-serif; color: #FFF; margin-top: 40px !important; letter-spacing: 1.4px; word-spacing: 1.5px;}

@media (max-width: 1150px) {.cap2 span {display: block;}}
@media (max-width: 800px) {
.caption .cap1 {font-size: 1.1em;}
.caption .cap2 {font-size: .55em; margin-top: 30px !important;}
}
@media (max-width: 650px) {.caption {text-align: center; margin: 15% auto 0 auto; left: 0; right: 0; width: 90%;}}
@media (max-width: 500px) {
.caption {font-size: 10vw;}
.toppicback {height: 160vw;}
}
@media (max-width: 440px) {
.caption {font-size: 9.8vw;}
.toppicback {height: 190vw;}
#toppicbox td {display: block;}
}
@media (max-width: 420px) {.caption {top: 170px; margin-top: 0;}}
@media (max-width: 380px) {
.caption .cap2 {display: none;}
.toppicback {height: 185vw;}
}
@media (max-width: 320px) {.toppicback {height: 600px;}}
	
@media (max-width: 160px) {
.toppicback {height: 42vw;}
.caption {text-align: center; left: auto; width: 100%; top: 48%;}
.caption .cap1 {font-size: 4.6vw;}
.caption .cap2 {font-size: 13vw;}
}
@media (max-width: 140px) {
.caption .cap1 {font-size: 5vw;}
.caption .cap2 {font-size: 14.5vw;}
}


.toppicback .toppic {background-image: url("../images/toppic.jpg");}
@media (max-width: 100px) {.toppicback .toppic {background-image: url("../images/toppic.jpg");}}
@media (max-width: 100px) {.toppicback .toppic {background-image: url("../images/toppic.jpg");}}
@media (max-width: 180px) {.toppicback .toppic {background-image: url("../images/toppic.jpg");}}


#toppicbox {position: relative; vertical-align: middle; position: relative; z-index: 3; text-align: left; margin-top: 40px; width: 710px; font-size: 1px;}
#toppicbox a {font-size: 18px !important; text-decoration: none; padding: 11px 0; width: 170px; display: table-cell; text-align: center; cursor: pointer; background-color: #EE8C00; color: #FFF; border-radius: 6px; transition: 0.25s; vertical-align: middle;}
#toppicbox ul {margin: 0; padding: 0;}
#toppicbox li {display: inline-block; margin: 2px;}
@media (max-width: 915px) {
#toppicbox {width: 370px;}
#toppicbox li {margin: 1px;}
}
@media (max-width: 650px) {
#toppicbox {margin: 30px auto 0 auto;}
#toppicbox ul {text-align: center;}
}
@media (max-width: 415px) {#toppicbox {width: 180px;}}
#toppicbox a:hover {background-color: #fead1f;}


/*-----------------*/

/*Services*/

/*#svcs {border: 1px solid red;}
#svcs .blk {border: 1px solid green;}*/

#svcsback {background-color: #EE8C00;}
#svcs .img {float: left; background-color: #293779; border-radius: 50%; transition: 0.3s;}
#svcs .img img {height: 60px; width: 60px; display: block; padding: 20px; transition: 0.3s;}
#svcs .txt {display: table-cell; text-align: left; padding-left: 20px; font-size: 19px; -webkit-backface-visibility: hidden;}
#svcs h4 {font-weight: 600; font-size: 1em; text-transform: uppercase;}
#svcs h4, #svcs h4 a {color: #293779;}
#svcs h4 a:hover {color: #334DC9;}
#svcs span {display: block; font-size: .9em; font-weight: 400; line-height: 1.5; margin-top: 10px; color: #FFF;}

#svcs {position: relative; display: table; margin: 0 auto; padding: 20px 0; width: 100%; max-width: 1725px; text-align: center;}
#svcs .blk {position: relative; display: inline-block; margin: 20px 15px; vertical-align: top; width: 29.5%;}

@media (max-width: 990px) {#svcs .blk {width: 44%;}}

@media (max-width: 700px) {
#svcs .img img {height: 52px; width: 52px; padding: 13px;}
#svcs .blk {margin: 15px;}
}
@media (max-width: 630px) {
#svcs .txt {display: block; padding: 0;}
#svcs .img {margin: 0 15px 0 0;}
#svcs .img img {height: 48px; width: 48px; padding: 12px;}
#svcs .blk {width: 43%; margin: 13px;}
}
@media (max-width: 570px) and (min-width: 461px) {
#svcs .img {float: none; height: 75px; width: 75px; margin: 0 auto 12px auto;}
#svcs .img img {padding: 12px 14px;}
#svcs h4 {text-align: center;}
}
@media (max-width: 460px) {
#svcs .blk {width: auto;}
#svcs .txt {display: table-cell;}
}
@media (max-width: 315px) {#svcs .txt {display: block; padding: 0;}}

#svcs .img:hover {transform: scale(1.05); background-color: #334DC9;}


/*--------------------------------*/

/*Why Us*/

.whyus {margin-top: 40px;}
.whyus li {margin: 0; padding: 0 0 22px 40px; list-style: none; background-image: url("../images/check.png"); background-repeat: no-repeat; background-position: left top; background-size: 27px;}
@media (max-width: 560px) {
.whyus {margin-left: -32px;}
.whyus li {background-size: 24px;}
.whyus li:last-child {padding-bottom: 15px;}
}


/*--------------------------------*/

/*Big Pic at bottom*/

.midpic div, .midpicback, .midpic {position: relative;}
.midpic div {top: 48%; transform: translateY(-48%); -webkit-transform: translateY(-48%); -ms-transform: translateY(-48%); -webkit-transform: translateY(-48%); -webkit-transform: translateY(-48%); -ms-transform: translateY(-48%); -ms-transform: translateY(-48%); -webkit-transform: translateY(-48%); -ms-transform: translateY(-48%); margin: 0 auto; padding: 0 25px; text-align: center;}
.midpic div h1 {font-weight: 400 !important; line-height: 1.2; color: #FFF; text-shadow: 1px 1px 2px #222; margin: 0 auto !important; font-family: 'PT Sans Narrow', Arial, Helvetica, sans-serif;}

.midpic {height: 100%; position: relative; background-repeat: no-repeat; background-size: cover; background-image: url("../images/bgpic.jpg"); background-position: 0 50%;}

@media (max-width: 1720px) and (min-width: 950px) {.midpic div span {display: block;}}
	
@media (min-width: 601px) {
.midpic div h1 {font-size: 72px;}
.midpicback {height: 400px;}
}
@media (max-width: 600px) {
.midpic div h1 {font-size: 11.5vw;}
.midpicback {height: 55vw;}
}
@media (max-width: 130px) {.midpicback {display: none;}}