@charset "utf-8";
@import url("fonts.css");
@import url("jquery.bxslider.css");
@import url("menu.css");
/* CSS Document */
* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; }
body { font-family: 'robotoregular', Arial, Helvetica, sans-serif; font-size: 14px; line-height: 22px; color: #21320e; background: #ee2a89; }
ul { margin: 0; padding: 0; list-style: none; }
li { list-style: none; }
h1 { font-family: 'robotomedium'; color: #000; font-size: 70px; margin: 10px 0px; padding-bottom: 5px; text-transform: none; padding-bottom: 20px; text-transform: uppercase; line-height: 40px; background: url(../images/h1bg.jpg) no-repeat center bottom; }
h2 { font-family: 'robotomedium'; color: #111111; font-size: 36px; margin: 10px 0px; text-transform: uppercase; padding-bottom: 20px; background: url(../images/h1bg.jpg) no-repeat center bottom; }
h3 { font-family: 'robotomedium'; color: #111111; font-size: 24px; margin: 10px 0px; text-transform: none; }
h4 { font-family: 'robotomedium'; color: #c01d2e; font-size: 20px; margin: 0px 0px 20px 0px; text-transform: none; }
h1 span { font-size: 26px; line-height: 30px; }
.nopadding { padding: 0 !important; margin: 0 !important; }
.container { max-width: 1000px; margin: 0px auto !important; }
p { margin: 22px 0px; }
.img-rounded { border-radius: 3px !important; }
.homess { height: 100vh; min-height: 100vh; position: relative; }
.header { min-height: 120px; background: rgba(0,0,0,0.25); }
.header .container { position: relative; }
a { color: #ee2a89; text-decoration: none; }
a:hover { color: #ee2a89; text-decoration: underline; }
p.splp { width: 60%; margin-left: auto; margin-right: auto; }
.mc-hide-scrolls { overflow: hidden; }
body .mc-cycle { height: 100%; left: 0; overflow: hidden; position: fixed; top: 0; width: 100%; z-index: -1; }
div.mc-image { /*NOTE: Mozilla flickers when fading and using 'all', so we have to be specific with what property we want to transition:
	 	If you are using fading transitions, use 'opacity: */ -webkit-transition: opacity 1s ease-in-out; -moz-transition: opacity 1s ease-in-out; -o-transition: opacity 1s ease-in-out; transition: opacity 1s ease-in-out; /*If you are using horizontal slide transitions, use the following CSS:
	-webkit-transition: left 1s ease-in-out; 
	-moz-transition: left 1s ease-in-out; 
	-o-transition: left 1s ease-in-out; 
	transition: left 1s ease-in-out;*/ -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; background-position: center center; background-repeat: no-repeat; height: 100%; overflow: hidden; width: 100%; }
.mc-old-browser .mc-image { overflow: hidden; }
.contentarea { background: #eaeaea; }
a.logo { margin: 27px 0px; display: block; float: left; }
.menuholder { height: 54px; border-radius: 3px; position: absolute; left: 0; right: 0; /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#f27790+0,ee2a89+100 */
background: #f27790; /* Old browsers */ background: -moz-linear-gradient(top, #f27790 0%, #ee2a89 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, #f27790 0%, #ee2a89 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, #f27790 0%, #ee2a89 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f27790', endColorstr='#ee2a89', GradientType=0 ); /* IE6-9 */
}
.subss{}
.subss img{width:100%; height:auto;}
.topcontact { text-align: right; font-size: 16px; line-height: 20px; text-transform: uppercase; color: #fff; }
.topcontact img { display: block; float: right; margin: 19px; }
.topcontact .topcontext { padding: 24px 0px; font-family: 'robotomedium'; }
.topcontact .topcontext a { color: #fff; text-decoration: none; }
.topcontact .topcontext a:hover { color: #fff; text-decoration: underline; }
.contentarea { background: #eaeaea url(../images/sepbg.jpg) repeat-x top; padding-top: 4px !important; }
.contentbox { background: url(../images/content-bg.jpg) no-repeat center top; padding: 60px 0px !important; }
.spl1 { background: url(../images/spl1.jpg) no-repeat center; background-size: cover; text-align: left; padding: 20px; margin: 1% !important; width: 23%; color: #fff; }
.spl2 { background: url(../images/spl2.jpg) no-repeat center; background-size: cover; text-align: left; padding: 20px; margin: 1% !important; width: 23%; color: #fff; }
.spl3 { background: url(../images/spl3.jpg) no-repeat center; background-size: cover; text-align: left; padding: 20px; margin: 1% !important; width: 23%; color: #fff; }
.spl4 { background: url(../images/spl4.jpg) no-repeat center; background-size: cover; text-align: left; padding: 20px; margin: 1% !important; width: 23%; color: #fff; }
.spl1 h2, .spl2 h2, .spl3 h2, .spl4 h2 { color: #ff8aa2; font-size: 22px; margin: 5px; padding-bottom: 15px; background: url(../images/splhbg.jpg) no-repeat bottom left; text-transform: none; }
.spl1 p, .spl2 p, .spl3 p, .spl4 p { font-size: 18px; line-height: 24px; }
.who { background: #d2d2d2; display: flex; }
.whochild { align-items: stretch; }
.whobg { min-height: 542px; background: url(../images/whobg.jpg) no-repeat left; background-size: cover; }
.whotxt { padding: 40px 20px 40px 0px !important; width: 480px; float: right; }
.testiblock { background: #eaeaea url(../images/testibg.jpg) no-repeat center top; padding: 80px 0px 0px 0px !important; font-size: 22px; line-height: 35px; color: #5f5f5f; text-align: center; }
.footertop { background: #ee2a89; padding: 30px 0px !important; color: #fff; }
.footer { background: #ee2a89; padding: 0px !important; color: #fff; }
.footertop { color: #fff; }
.footer .container { border-top: 1px solid #f880ba; padding: 20px 0px !important; }
.mapbox iframe { width: 100%; height: 160px; border-radius: 3px; }
.footercontact { font-size: 14px; line-height: 20px; }
.footercontact h3 { font-family: 'robotomedium'; font-size: 18px; margin: 5px 0px !important; color: #fff; }
.footercontact p { margin: 15px 0px; }
.footercontact img { vertical-align: middle; margin-right: 10px; }
.footercontact a { color: #fff; text-decoration: none; }
.footercontact a:hover { color: #fff; text-decoration: underline; }
.footer a { color: #fff; text-decoration: none; }
.footer a:hover { color: #fff; text-decoration: underline; }
.footer p { margin: 15px 0px; }
.smltxt { font-size: 12px; line-height: 18px; color: #feb1d6; }
.whotxt h2 { background-position: bottom left; }

a.scroll-downs { position: absolute; /*top: 0;*/
right: 0; bottom: 20px; left: 0; margin: auto; width : 34px; height: 55px; }
.mousey { width: 3px; padding: 10px 15px; height: 55px; border: 2px solid #fff; border-radius: 25px; opacity: 0.75; }
.scroller { width: 2px; height: 10px; border-radius: 25%; background-color: #fff; animation-name: scroll; animation-duration: 2.2s; animation-timing-function: cubic-bezier(.15, .41, .69, .94); animation-iteration-count: infinite; }
@keyframes scroll {  0% {
opacity: 0;
}
 10% {
transform: translateY(0);
opacity: 1;
}
 100% {
transform: translateY(15px);
opacity: 0;
}
}


/*==========  Non-Mobile First Method  ==========*/

/* Large Devices, Wide Screens */
@media only screen and (max-width : 1200px) {
nav .menu a{padding: 0 17px;}
.sp{width:100%; text-align:center;}
.sp h2{text-align:center; background-position:bottom center !important;}
}

/* Medium Devices, Desktops */
@media only screen and (max-width : 992px) {
.menuholder{height:40px;}
nav .menu{width:100%; background:#e66a83;}
nav{max-height:40px;}
nav .menu a{line-height:33px;}
.container{width:90%;}
.whochild{width:100%;}
.footercontact{text-align:center;}
.mapbox{margin-bottom:20px;}
}

/* Small Devices, Tablets */
@media only screen and (max-width : 768px) {
.logoholder{display:block; width:100%;}
.logoholder img{width:100%; height:auto;}
.logoholder a{margin:10px auto;}
.topcontact{width:100%; text-align:center; padding:10px 0px; margin-top:20px !important; display:inline-block;}
.topcontact img{display:none;}
h1{font-size:40px; line-height:28px;}
h1 span {font-size: 16px;line-height: 18px !important;}
p.splp {margin-left: auto;margin-right: auto;width: 100%;}
.whotxt{width:90%; margin:0px auto; text-align:center;}
.whotxt h2{background-position:bottom center;}
.whobg{display:none;}
.testiblock{ padding: 40px 0 0px !important;}
a.logo{width:100%;}
a.logo img{margin:0px auto; width:60%; height:auto; display:block;}
.topcontact .topcontext{padding:0px 0px 10px 0px;}
}

/* Extra Small Devices, Phones */ 
@media only screen and (max-width : 480px) {
h1 {font-size: 28px;line-height: 23px;}
h1 span {font-size: 12px;}
}

/* Custom, iPhone Retina */ 
@media only screen and (max-width : 320px) {
	
}