@charset "UTF-8";
/* CSS Document */

@import "hover.css";
@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,700|Ubuntu:300,400,700');

@font-face {
font-family: 'helvetica_blackregular';
src: url('../webfonts/helvetica-black-webfont.woff2') format('woff2'), url('../webfont/helvetica-black-webfont.woff') format('woff');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'exo_2light';
src: url('../webfonts/exo2-light-webfont.woff2') format('woff2'), url('../webfont/exo2-light-webfont.woff') format('woff');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'exo_2bold';
src: url('../webfonts/exo2-bold-webfont.woff2') format('woff2'), url('../webfont/exo2-bold-webfont.woff') format('woff');
font-weight: normal;
font-style: normal;
}

.loader {
position: fixed;
left: 0px;
top: 0px;
width: 100%;
height: 100%;
z-index: 999999999999999999;
background: url('../img/loading.gif') 50% 50% no-repeat rgb(255,255,255);
}

html, body {margin: 0 !important; padding: 0 !important; background: #F1F2F2; width: 100%; height: 100vh; font-family: 'Open Sans', sans-serif; font-size: 12pt;}
h1, h2, h3, h4, h5, h6 {font-family: 'Ubuntu', sans-serif; color: #460F44;}
h1 {font-size: 21pt;}
.h_xl {font-size: 45pt !important;}
.h_l {font-size: 36pt !important;}
p {line-height: 2;}

a {color: #278FC0; text-decoration: none;}
a:hover {color: #14BBBB; text-decoration: none;}

.page_wrap {display: block; position: absolute; width: 100%; height: 100vh; background: none !important; top:0px !important; bottom: 0px !important;}
.iwrap {box-sizing: border-box; display: inline-block; position: relative; width: 80%; left: 10% !important; padding: 20px 0px !important;background: none;}
.iwrap p {box-sizing: border-box; padding: 0 20px;}
@media screen and (max-width:1200px)  {
.iwrap {width: 80% !important; left: 10% !important;background: none;}
}
@media screen and (min-width:1920px)  {
.iwrap {width: 1200px !important; left: calc(50% - 600px) !important; background: none;}
}
@media screen and (max-width:640px)  {
.iwrap {width: 100% !important; left: 0 !important; background: none;}
}

.Next_line_tog {display: none;}
@media screen and (max-width:640px)  {
    .Next_line_tog {display: inherit !important;}
}


header {display: block; position: fixed; width: 100%; height: 100px; top: 0; background: url(../img/header_left.png) top left no-repeat, white; z-index: 9999 !important;}
.header_bar_top {display: block; position: absolute; width: 100%; height: 5px; top: 0; background: #92278F; z-index: 2;}
.header_wrap {display: block; position: absolute; width: 94%; height: 100px; left: 3%; z-index: 1; background: none;}
#main_logo {width: 270px; height: 60px;}
#logo_link {display: inline-block; position: absolute; width: 270px; height: 60px; top: 20px; left: 0;}
nav.desktop {display: inline-block; position: absolute; top: 40px; right: 0px; background: none;}
nav.desktop a {font-family: "exo_2light"; font-size: 12pt; color: #404042; height: 30px; margin-left: 25px; background: none; text-decoration: none;}
nav.desktop a:hover {color: #460F44 !important; }
nav ul {
margin:0;padding:0;
list-style-type:none;
display:inline-block;
}
nav ul li {
position:relative;
margin:0 10px 0 0;
display:inline-block;
}

li > a:after { content: '   \25BE'; color: #14BBBB; } /* Change this in order to change the Dropdown symbol */
.wSub:after {content: '   \25BE'; color: #14BBBB;}

li > a:only-child:after { content: ''; }

nav ul li a {
padding:0px;
display:inline-block;
color:white;
text-decoration:none;
}

nav ul li a:hover {
opacity:1;
}

nav ul li ul {
margin-top: 0px;
padding: 20px 0 20px 0;
display:none;
position:absolute;
right:-10px;
width: 200px;
background:white;
border: #14BBBB solid 2px;
border-top: none;
border-radius: 0 0 20px 20px;
float:right;
}

nav ul li ul li {
width:100%;
border-bottom:1px solid rgba(255,255,255,.3);
padding: 20px 35px 20px 20px;
}

nav ul li:hover ul {
display:block;
}

nav.mobile {display: none; position: fixed; width: 200px; left: calc(50% - 100px); height: 100vh; background: #92278F !important; z-index: 999 !important; padding-top: 100px; text-align: center;}
nav.mobile a {display: inline-block; position: relative; width: 100%; font-family: "exo_2bold"; font-size: 24px; color: #ffffff; text-decoration: none; padding: 10px 0;}
nav.mobile a:hover{color: #14BBBB;}
nav.mobile a:active{color: #92278F;}

#MM {display: none; width: 100%; height: 100vh; background: #92278F; left: 0;}
a.m_menu {display: none;}
@media screen and (min-width:981px) and (max-width:1120px) {
nav.desktop a {margin-left: 10px;}

}
@media screen and (max-width:1150px) {

nav.desktop a {margin-left: 10px;}
}
@media screen and (max-width:1135px) {
nav.desktop a {display: none;}
#navCONTACTdsk {display: none !important;}
a.m_menu {display: block; position: absolute; width: 30px; height: 30px; top: 35px; right: 0; background: url(../img/mobile-menu.png) center top no-repeat; z-index: 9999 !important;}
a.m_menu:active {background: url(../img/mobile-menu.png) center bottom no-repeat;}
}

a.menuCTA {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    box-sizing: border-box !important;
    padding: 5px 20px 7px 20px !important;
    width: auto !important;
    min-width: 100px !important;
    max-width: 200px !important;
    height: auto !important;
    min-height: 30px !important;
    background: #92278F !important;
    color: #ffffff !important;
    text-align: center !important;
    border-radius: 60px !important;
    font-family: "exo_2bold" !important;
    border: 2px solid #ffffff !important;
}
a.menuCTA:hover {
    background: none !important;
    border: 2px solid #92278F !important;
    color: #92278F !important;
}
.mobile a.menuCTA:hover {
    background: #ffffff !important;
    color: #92278F !important;
    border: 2px solid #ffffff !important;
}


a.CTA {
    background: #92278F !important;
    color: #ffffff !important;
    font-family: "exo_2bold" !important;
    border: 2px solid none !important;
}
a.CTA:hover {
    background: none !important;
    border: 2px solid #92278F !important;
    color: #92278F !important;
}

prefooter {display: inline-block; position: relative; width: 100%; height: 300px; background: url(../img/footer_right.png) bottom right no-repeat; margin-bottom: -10px !important; margin-top: 0px !important;}
.pf {display: inline-block; position: relative; width: 80%; left: 10%; padding: 20px 0px; background: url(../img/pre-footer-left.png) bottom left no-repeat, url(../img/bg-house-on-right.png) bottom right no-repeat, url(../img/bg-line.png) bottom center no-repeat; height: 300px; padding: 0 !important; margin-bottom: -10px;}
footer {display: inline-block; position: relative; width: 100%; height: 1200px !important; background: #92278F; margin-bottom: -10px !important; margin-top: 0px !important;}

.error{height: 100px !important;}

.footer_bar_bottom {display: block; position: absolute; width: 100%; height: 10px; bottom: 0; left: 0; background: #460F44; z-index: 2;}
.footer_wrap {display: block; position: absolute; width: 80%; height: 100px; bottom:0 !important;left: 10%; z-index: 1; background: none; border-top: 3px solid white;}
.copyright {display:block;position:absolute; margin-top:30px !important; font-size:7pt; color:#fff; line-height:1.5;}

.social_bar {display: block; position: absolute; background: none; width: 40px; height: 40px; right: 0px; top: 25px; }
.social_bar a {float: right; width: 40px; height: 40px; /*margin-right: 20px;*/}
.sb_fb {background: url(../img/footer_fb.png) 0px top no-repeat; background-size: cover !important;}
.sb_fb:hover {background: url(../img/footer_fb.png) 0px bottom no-repeat; background-size: cover !important;}

#go2top {display: none; position: fixed; bottom: 35px; right: 30px; width: 40px; height: 40px; background: url(../img/go2top.png) 0px top no-repeat; background-size: cover !important; z-index: 100;}
#go2top:hover {background: url(../img/go2top.png) 0px bottom no-repeat; background-size: cover !important;}

@media screen and (max-width:1152px)  {
.pf {width: 85%; left: 7.5%;}
}
@media screen and (max-width:640px)  {
.pf {width: 85%; left: 7.5%; background: url(../img/pre-footer-left.png) bottom left no-repeat, url(../img/bg-line.png) bottom center no-repeat;}
.footer_wrap {height: 180px; width: 100%; left: 0;}
.copyright {width: 100%; bottom:30px !important; text-align: center;}
#go2top {right: 10px;}
.social_bar {width: 100%; height: 40px; text-align: center; background: none;}
.social_bar a {position: absolute !important; left: calc(50% - 20px);}
}

#contact_wrap {box-sizing: border-box; padding-top: 50px;}
#contact_container {box-sizing: border-box; display: inline-block; position: relative; width: 800px; margin: 50px 0; height: 700px; left: calc(50% - 400px) ; padding: 0; background: none; background: none; color: white !important;}
#contact1 {box-sizing: border-box; position: relative; width: 400px; height: auto; min-height: 100%; background: #460F44; float: left; text-align: center; padding: 0px !important; border-radius: 20px; }
#contact2 {box-sizing: border-box; position: relative; width: 400px; height: auto; min-height: 100%; background: none; float: left; text-align: center; padding: 20px; }
#cntFrame {display: inline-block; width:100% !important; left: 0 !important; height: 540px;}

.pkg {text-align: left;}
.footer_sec{color: white;}

@media screen and (max-width:1152px)  {
#contact_container { width: 700px; margin: 20px 0; left: calc(50% - 350px) ;}
#contact1 {width: 400px; padding: 0px !important;}
#contact2 {width: 300px; padding: 12px;}
}

@media screen and (max-width:960px)  {
#contact_container { width: 400px; margin: 20px 0 !important; left: calc(50% - 200px) !important ;}
#contact1 {width: 100%; padding: 0px !important;}
#contact2 {width: 100%; padding: 12px; height: 400px;}
footer {height: 1650px !important;}
}

@media screen and (max-width:640px)  {
#contact_container { width: 100% !important; margin: 20px 0 !important; left: 0 !important ;}
#contact1 {width: calc(100% - 40px); left: 20px; padding: 0px !important;}
#contact2 {width: 100%; padding: 12px; height: 400px;}
footer {height: 1650px !important;}
}

@media screen and (max-width:360px)  {
#contact_container { width: 360 !important; margin: 20px 0 !important; left: 0 !important ;}
#contact1 {width: 340px; left: calc(50% - 170px) ; padding: 0px !important;}
#contact2 {width: 360px; padding: 0px !important; height: 400px;}
}



#phone:before {
content: "";
display: inline-block;
width: 20px;
height: 20px;
margin-right: 10px;
background-image: url("../img/phone_icon.png");
background-size: contain;
}

#email:before {
content: "";
display: inline-block;
width: 20px;
height: 20px;
margin-right: 10px;
background-image: url("../img/mail_icon.png");
background-size: contain;
}
    

#WAW {display: inline-block; position: relative; width: 50px; height: 50px; background: url(../img/waw.png) center top no-repeat; background-size: cover !important; margin: 20px 0 0 0;}
a#WAW:hover {background: url(../img/waw.png) center bottom no-repeat;}
#FMG {display: inline-block; position: relative; width: 50px; height: 50px; background: url(../img/fmg.png) center top no-repeat; background-size: cover !important; margin: 20px 0 0 20px;}
a#FMG:hover {background: url(../img/fmg.png) center bottom no-repeat;}

.footer_sec a:hover {color:#14BBBB !important; }




.contents {display: block; position: relative; width: 100%; height: auto; background: #ffffff; z-index: 2;}
.errorss {height: 50px !important;}
section {display: inline-block !important; position: relative !important; width: 100%; min-height: 300px; background: none; margin-bottom: -10px !important;}

.hide {font-size: 0 !important; color: white !important;}

.button_container {
display: inline-block;
box-sizing: border-box;
width: 210px;
height: 40px;
background: none;
}

a.button1 {
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    padding: 7px 12px 9px 12px;
    width: auto;
    min-width: 100px;
    max-width: 200px;
    height: auto;
    min-height: 30px;
    background: none;
    color: #92278F;
    text-align: center;
    border-radius: 60px;
    border: 2px solid #92278F;
}
a.button1:hover {
    background: #92278F;
    border: 2px solid #92278F;
    color: #ffffff;
}

.b_left{float: left !important;}
.b_right{float: right !important;}
@media all and (max-width:30em){
.mybutton{
display:block;
margin:0.4em auto;
}
}

.tooltip {
position: relative;
display: inline-block;
/*border-bottom: 1px dotted black;*/
}

.tooltip .tooltiptext {
visibility: hidden;
width: 120px;
background-color: #450C44;
color: #fff;
text-align: center;
border-radius: 6px;
padding: 5px 0;

/* Position the tooltip */
position: absolute;
float: left !important;
z-index: 1;
}

.tooltip:hover .tooltiptext {
visibility: visible;
}

.top_header {display: flex; box-sizing: border-box; justify-content: center; align-items: center; position: relative; margin-top: 100PX !important; height: 320px !important;}
@media screen and (max-width:920px)  {
.top_header {height: auto; padding-bottom: calc(100% / 1.75); background-size: cover;}
}
.top_header h1 {color: #92278F;}

::-moz-selection {background-color:#92278F; color:#fff;}
::selection {background-color:#92278F; color:#fff;}