/*
 Theme Name:   Ernest Child
 Description:  Ernesto Child Theme
 Author:       Psoda
 Author URI:   http://www.psoda.com
 Template:     ernesto
 Version:      1.0.0
 Text Domain:  ernesto-child
*/

/* Changes the colour of the current menu item the user is viewing*/
.js .main-menu .current-menu-item>a{
    color:#0f003a !important;
}

/* Makes menu items white */
.main-menu .nav > li > a{
    color:white;
}

/* Makes menu items white after scroll */
.stuck .main-menu .nav > li > a{
    color:white;
}

/* Makes menu button blue */
.btn-primary{
    background-color:#0f003a !important;
}

/* changes to the contact us section */
#section-contact{
    background-color:white;
    padding-top:0px !important;
    padding-bottom:0px;
}

/* Button on the splash screen */
#landing_button{
    border: 2px solid white;
    border-radius:15px;
    background:none;
    padding:0px 0px;
}

/* Register button text formatting */
#landing_button a{
    font-size: 30px;
    color:white;
    display:inline-block;
    padding:10px 15px;
}

/* Twitter feed in the footer*/
.twitter_feed_footer{
    background-color: #B1CBF0;
    margin-right:0px;
    padding-right:0px;
}

/* padding on social media links area */
.no-padding{
    padding-left: 0;
    padding-right:0;
}

/* padding on social media links area */
.padding_footer{
    padding-bottom:0;
    padding-top:10px;
}

/* padding on twitter feed*/
#twitter-widget-0{
    padding-top: 70px !important;
    padding-bottom:45px !important;
}

/* fix for certain screen width*/
@media (min-width: 768px) and (max-width: 991px){
    #menu{
        margin-top:20px !important;
    }
}

/* centering image and text in the slider */
.slider_content{
    text-align:center !important;
}

/* Apple Download button */
.download_button{
    width:260px;
}

/* Android Download button */
.download_button2{
    width:295px;
}

/* inputs on contact form */
.form-control{
    border-bottom: 1px solid black;
}

/* Logo in the menu bar */
.header_logo{
    padding-top:5px;
}

/* Mobile */
@media (max-width: 768px){
    /* menu button */
    .main-menu .navbar-toggle{
        background-color:#0f003a !important;
        border-color: #0f003a !important;
        margin-top: 15px;
        }
    /* apple Download button */
     .download_button{
        width:200px;
        }
    /* Android Download button */
    .download_button2{
        width:235px;
        }
    /* Menu */
     .HeaderTest{
        background-color: transparent !important;
        box-shadow:0 0 0px rgba(0,0,0,.0);
        }
}

@media (max-width: 767px){
     /* Fix for logo sizing*/
    .header_logo{
       max-width:60% !important;
       padding-top:5px;
    }
}

@media (max-width: 500px){
    /* Fix for logo sizing*/
    .header_logo{
       max-width:90% !important;
       padding-top:5px;
    }
}

/* Splash screen title */
.BigTitle{
    font-size: 5em;
}

/* splash screen cwrapper*/
.SplashBox{
    padding-top:250px !important;
}

/* splash screen button*/
.SplashButton{
    padding-top: 5%;
}

/* contact us title */
.contact_us_heading{
    padding-bottom: 30px;
}

/* contact information */
.contact-info{
    padding-bottom:0px;
}

/* how it works */
#section-How-it-works{
    padding-top:0px;
}

/* portfolio slider*/
.portfolio-slider{
    padding-top:0px;
}

/* download section */
#section-Download{
    padding-top:20px;
    padding-bottom:10px;
}

/* left navigation on slider */
.ion-ios7-arrow-left{
    margin-left:150px;
}

/* right navigation on slider */
.ion-ios7-arrow-right{
    margin-right: 150px;
}

/* pagination dots */
.owl-theme .owl-controls .owl-page span{
    width:10px;
    height:10px;
}

/* download title */
 .about_heading{
    margin-bottom:0px !important;
}

/* Form error */
.name_error{
    display:none;
}

/* Form error */
.formError{
    color:red;
}

/* Form success */
.formSent{
    color:green;
}

/* email on contact us section */
.contact-email>p>a{
    color: #666;
}

/* keeping the home menu item white*/
#menu-item-129 >a{
    color:white !important;
}

/* keeping the home menu item white*/
.stuck #menu-item-129>a{
    color:white !important;
}

/* Mobile */
@media (max-width: 768px){
    .HeaderTest{
        color:white !important;
    }
    .BigTitle{
        font-size: 3em !important;
    }
    .SplashBox{
        padding-top:200px !important;
    }
}

@media (min-width: 768px) and (max-height:660px){
    .BigTitle {
        font-size: 3.5em !important;
    }
}

@media (max-width:768px) and (max-height: 700px){
    /* less padding for shorter phones */
    .SplashBox{
        padding-top:100px !important;
    }
}

/* Mobile */
@media (max-width:321px){
    /* changing font size on smaller phones */
    .BigTitle{
        font-size: 2.0em !important;
    }
}

/* background colour of menu after scrolling */
.stuck{
    background-color: rgba(192,192,192,.95) !important;
}

/* form success */
#es_msg_pg{
    color:green;
}

/* space between menu items */
.main-menu .nav > li > a{
    padding:30px 40px;
}

/* space between menu items on screens smaller than 991px wide. */
@media (max-width:991px){
    .main-menu .nav > li > a{
        padding:15px 20px;
    }
}

/* hovering on a menu item */
.main-menu .nav > li:hover{
   transform: scale(1.2);
    -webkit-transition: all 0.2s ease;
     -moz-transition: all 0.2s ease;
       -o-transition: all 0.2s ease;
          transition: all 0.2s ease;
}

/* hovering on the splash button */
#landing_button:hover{
     transform: scale(1.1);
    -webkit-transition: all 0.2s ease;
     -moz-transition: all 0.2s ease;
       -o-transition: all 0.2s ease;
          transition: all 0.2s ease;
}

/* hovering on the send message button */
#submit:hover{
     transform: scale(1.1);
    -webkit-transition: all 0.2s ease;
     -moz-transition: all 0.2s ease;
       -o-transition: all 0.2s ease;
          transition: all 0.2s ease;
}

@media (min-width: 1200px){
    .img-responsive, .thumbnail>img, .thumbnail a>img, .carousel-inner>.item>img, .carousel-inner>.item>a>img{
         max-width:80%;
     }
}

/* changes the colour of the pagination*/
.owl-theme .owl-controls .owl-page.active span, .owl-theme .owl-controls.clickable .owl-page:hover span{
    background-color: #B1CBF0;
}

/* changes color of navbar when it reaches the top  */
.navbarattop{
    background-color: rgba(192,192,192,.95) !important;
}

.navbar, .navbar-inverse {
	border-radius: 0;
	border: none;
	margin-bottom: 0;
	min-height: 60px;
}

/* navbar */
.nav li {
	display: inline;
	color: white;
}

/* changes the postiton of the pagination on the first item  */
.owl-pagination-first {
    position: absolute !important;
    right: 45% !important;
    top: 41% ;
}

/* changes the postiton of the pagination on the rest of the items  */
.owl-pagination-others{
    position: absolute !important;
    right: 45% !important;
    top: 64% ;
}

/* changes the postiton of the left and right arrows on slider for 1st pic */
.navigator-fix-first{
    top: 29% !important;
}

.splash-image-normal{
    /*overflow:auto;*/
    min-height:600px;
}

/*::::::::::::START OF WRAPPER HEIGHTS:::::::::::::::::*/
/*::::::::::::START OF WRAPPER HEIGHTS:::::::::::::::::*/
/*::::::::::::START OF WRAPPER HEIGHTS:::::::::::::::::*/

/* changes the height of the slider */
.wrapperheight{
      min-height: 787px !important;
}

@media (max-width: 767px){
    /* changes the height of the slider */
    .wrapperheight{
        min-height: 1000px !important;
    }
}

@media (max-width: 500px) and (max-height: 639px){
    /* changes the height of the slider */
    .wrapperheight{
        min-height: 1100px !important;
    }
}

@media (max-height: 385px) and (max-width: 499px){
    .wrapperheight{
      min-height: 900px !important;
    }
}

@media (max-height: 415px) and (min-width:500px) and (max-width: 767px){
    .wrapperheight{
      min-height: 787px !important;
    }
}
/*::::::::::::END OF WRAPPER HEIGHTS:::::::::::::::::*/
/*::::::::::::END OF WRAPPER HEIGHTS:::::::::::::::::*/
/*::::::::::::END OF WRAPPER HEIGHTS:::::::::::::::::*/


/*:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: END OF SLIDE ONE CSS ::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
/*:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: END OF SLIDE ONE CSS ::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
/*:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: END OF SLIDE ONE CSS ::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/

/* Wraps around everything*/
#TheVidWrapper{
    height:330px;
}

/* The whole div including the video and tablet*/
#VidandTablet{
    background-image: url('images/Phone-horizontal.svg');
    background-repeat: no-repeat;
    background-size: 100% 100%;
    height:100%;
}

/* changing properties on the div surrounding video */
#IntroVideo{
    padding-top:1.5%;
    height:95%;
    width:56%;
    margin-left:23%;
}

/* changing properties just on the video */
#IntroVideo iframe{
    z-index: 20;
    height:100%;
    width:100%;
}

@media (max-width: 1199px){
    #TheVidWrapper{
        height:250px;
    }
    #IntroVideo{
        height:95%;
        width:52%;
        margin-left:25%;
    }
    #IntroVideo iframe{
        height:100%;
        width:100%;
    }
    .owl-pagination-first {
        position: absolute !important;
        right: 36% !important;
        left: 36% !important;
        top: 31%;
    }
    .owl-theme .owl-controls .owl-buttons .owl-next{
            margin-top: -90px;
    }
    .owl-theme .owl-controls .owl-buttons .owl-prev{
            margin-top: -90px;
    }
}

@media (max-width: 991px){
    #TheVidWrapper{
        height:250px;
    }
    #IntroVideo{
        height:95%;
        width:56%;
        margin-left:23%;
    }
    #IntroVideo iframe{
        height:100%;
        width:100%;
    }
    .owl-pagination-first {
        position: absolute !important;
        right: 36% !important;
        left: 36% !important;
        top: 36%;
    }
    .owl-pagination-others{
        position: absolute !important;
        right: 43% !important;
        top: 66% ;
    }
}

@media (max-width: 767px){
    #TheVidWrapper{
        height:200px;
    }
    #IntroVideo{
        padding-top:2%;
        height:95%;
        width:78%;
        display: block;
        margin: 0 auto;
        max-width:300px;
        min-width:200px;
    }
    #IntroVideo iframe{
        height:100%;
        width:100%;
    }
    .owl-pagination-first {
        position: absolute !important;
        right: 36% !important;
        left: 36% !important;
        top: 14.5em;
    }
    .owl-pagination-others{
        position: absolute !important;
        right: 43% !important;
        top: 66% ;
    }
}

@media (max-width:721px){
    .owl-pagination-others{
        position: absolute !important;
        top: 64% ;
        right: 42.5% !important;
    }
}

@media (max-width:570px){
     .owl-pagination-others{
        position: absolute !important;
        top: 64% ;
        right: 41% !important;
    }
}

@media (max-width: 429px){
    #TheVidWrapper{
        height:180px;
    }
    #IntroVideo{
        padding-top:4%;
        height:93%;
        width:78%;
        display: block;
        margin: 0 auto;
    }
    #IntroVideo iframe{
        height:100%;
        width:100%;
        max-width:285px;
    }
    .owl-pagination-first {
        position: absolute !important;
        right: 36% !important;
        left: 36% !important;
        top: 13.5em;
    }
    .owl-theme .owl-controls .owl-page span {
       margin-left:3px;
    }
    .owl-pagination-others{
        position: absolute !important;
        top: 64% ;
        right: 40% !important;
    }
}

@media (max-width:373px){
    .owl-pagination-others{
        position: absolute !important;
        top: 61% ;
        right: 38.5% !important;
    }
}

@media (max-width: 339px){
    #TheVidWrapper{
        height:140px;
    }
    #IntroVideo{
        padding-top:4%;
        height:93%;
        display: block;
        margin: 0 auto;
        max-width: 220px;
    }
    #IntroVideo iframe{
        height:100%;
        width:100%;
    }
    .owl-pagination-first {
        position: absolute !important;
        right: 36% !important;
        left: 36% !important;
        top: 11em;
    }
    .owl-theme .owl-controls .owl-page span {
       margin-left:-5px;
    }
}

@media (max-width: 280px){
    #TheVidWrapper{
        height:100px;
    }
    #IntroVideo{
        padding-top:4%;
        height:93%;
        display: block;
        margin: 0 auto;
    }
    #IntroVideo iframe{
        height:100%;
        width:80%;
    }
    .owl-pagination-first {
        position: absolute !important;
        right: 36% !important;
        left: 36% !important;
        top: 8.5em;
    }
}

/*:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: END OF SLIDE ONE CSS ::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
/*:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: END OF SLIDE ONE CSS ::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
/*:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: END OF SLIDE ONE CSS ::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/


.BigTitle{
    -webkit-transition: all 0.2s ease-out;
     -moz-transition: all 0.2s ease-out;
       -o-transition: all 0.2s ease-out;
          transition: all 0.2s ease-out;
}
#TheVidWrapper{
    -webkit-transition: all 0.2s ease;
     -moz-transition: all 0.2s ease;
       -o-transition: all 0.2s ease;
          transition: all 0.2s ease;
}
#IntroVideo{
    -webkit-transition: all 0.3s ease;
     -moz-transition: all 0.3s ease;
       -o-transition: all 0.3s ease;
          transition: all 0.3s ease;
}
.owl-item{
    -webkit-transition: all 0.2s ease-in-out;
     -moz-transition: all 0.2s ease-in-out;
       -o-transition: all 0.2s ease-in-out;
          transition: all 0.2s ease-in-out;
}
.owl-pagination {
    -webkit-transition: top 0.2s ease;
     -moz-transition: top 0.2s ease;
       -o-transition: top 0.2s ease;
          transition: top 0.2s ease;
}

/* Making the navbar smaller on landscape/ short devices */
@media (max-height: 385px) and (max-width: 767px){
    .navbar, .navbar-inverse {
        border-radius: 0;
        border: none;
        margin-bottom: 0;
        min-height: 50px;
    }
    .main-menu .navbar-toggle{
        padding: 6px 25px;
    }
    .header_logo{
        max-width:90% !important;
        max-height:45px;
    }
    .main-menu .navbar-toggle{
        margin-top:5px;
    }
    .navbarattop{
        background-color: rgba(192,192,192,.95) !important;
    }
}

/* Making the navbar smaller on mobile */
@media (min-height: 385px) and (max-width: 767px){
    .navbar, .navbar-inverse {
        border-radius: 0;
        border: none;
        margin-bottom: 0;
        min-height: 60px;
    }
    .header_logo{
        max-width:90% !important;
         max-height:55px;
    }
    .main-menu .navbar-toggle{
        margin-top:8px;
    }
}

.my-placeholder{
    color:#aaa;
}

.es_msg{
text-align: center;
}

.formError {
    text-align: center;
}
.formSent {
    text-align: center;
}