/*GLOBAL*/
@import "fonts/stylesheet.css";

*:focus {
    outline: 2px solid #397899 !important;
}

html {
    background-color: #99C348;
    position: relative;
    min-height: 100%;
}

body {
    /* Margin bottom by footer height */
    /*margin-bottom: 15%;*/
    background:none;
    font-family: 'Open Sans Hebrew';
}

/*.footer {*/
/*position: absolute;*/
/*bottom: 0;*/
/*width: 100%;*/
/*!* Set the fixed height of the footer here *!*/
/*!*height: 60px;*!*/
/*!*line-height: 60px; !* Vertically center the text there *!*!*/
/*background-color: #f5f5f5;*/
/*}*/
.shareTitle {
    line-height: 1.2
}
.overlay {
    position: absolute;
    display: none;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(255, 255, 255, 0.85);
    z-index: 101;
    cursor: pointer;
    /* color: #ffffff; */
    /* padding: 10.5%; */
    text-align: center;
    line-height: 12;
}

.similapp-input-email {
    border: 1px solid #b15b92;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

.similapp-email-btn {
    background: #b15b92;
    border-color: #b15b92;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 3px;
    cursor: pointer;
    color: #ffffff;
}
.similapp-error p {
    margin: 0;
}

.similapp-error span {
    float: right;
}
.similapp-error {
    display: none;
    position: absolute;
    background: #fff;
    border: 2px solid #b15b92;
    text-align: center;
    padding: 5px;
    z-index: 1;
}


.btn-similapp {
    -webkit-border-radius: 7px;
    -moz-border-radius: 7px;
    border-radius: 7px;
    -webkit-box-shadow: 3px 3px 1px #0078a3;
    -moz-box-shadow: 3px 3px 1px #0078a3;
    box-shadow: 3px 3px 1px #0078a3;
    color: #ffffff;
    background: #925288;
    padding: 6px 15px 6px 15px;
    /*padding: 10px 20px 10px 20px;*/
    text-decoration: none;
    -webkit-transition: box-shadow 100ms; /* Safari */
    transition: box-shadow 100ms;
}

.btn-similapp-gray {
    -webkit-border-radius: 7px;
    -moz-border-radius: 7px;
    border-radius: 7px;
    -webkit-box-shadow: 3px 3px 1px #0078a3;
    -moz-box-shadow: 3px 3px 1px #0078a3;
    box-shadow: 3px 3px 1px #0078a3;
    color: #ffffff;
    background: #7c8083;
    padding: 6px 15px 6px 15px;
    /*padding: 10px 20px 10px 20px;*/
    text-decoration: none;
    -webkit-transition: box-shadow 100ms; /* Safari */
    transition: box-shadow 100ms;
}

.btn-similapp:hover, .btn-similapp:focus,.btn-similapp-gray:hover, .btn-similapp-gray:focus {
    text-decoration: none;
    color: #ffffff;
    -webkit-box-shadow: 1px 1px 1px #0078a3;
    -moz-box-shadow: 1px 1px 1px #0078a3;
    box-shadow: 1px 1px 1px #0078a3;
}

.input-similapp {
    border-color: #397899;
    color: #397899;
}

.cropper-face {
    background: url(images/ghost2B.png) no-repeat center center;
    background-size: cover;
    opacity: .8;
}

.cropper-point {
    display: none;
}

.cropper-view-box {
    outline: none;
}

/*CONST*/
.text-purple {
    color: #925289;
}

.text-blue {
    color: #397899;
}

.rtl {
    direction: rtl;
}

.font-900 {
    font-weight: 900;
}

.font-600 {
    font-weight: 600;
}

.font-1vw {
    font-size: 1vw;
}

.font-2vw {
    font-size: 2vw;
}

.font-3vw {
    font-size: 3vw;
}

.font-4vw {
    font-size: 4vw;
}

.font-5vw {
    font-size: 5vw;
}

.similapp-h1 {
    font-size: 30px;
}

.similapp-h2 {
    font-size: 16px;
}

.similapp-h3 {
    font-size: 14px;
}

.line-3 {
    line-height: 3;
}

img.boy-girl-btn {
    width: 40px;
}

/* The Modal (background) */
.modal-content-c {
    background-color: rgba(0, 0, 0, 0.8);
    font-size: 20px;
    color: #fff;
    padding: 30px;
    direction: rtl;
    text-align: center;
    font-weight: bold;
}

/* The Modal (background) */
.modal-c {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1000; /* Sit on top */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0, 0, 0); /* Fallback color */
    background-color: rgba(0, 0, 0, 0.4); /* Black w/ opacity */
}

/* Modal Content/Box */
.modal-content-c {
    background-color: rgba(0, 0, 0, 0.8);
    margin: 15% auto;
    padding: 20px;
    /* border: 1px solid #888; */
    width: 75%;
    font-size: 18px;
    color: #fff;
    text-align: center;
}

#photosModal {
    margin: 5% auto;
}

img.modalImages {
    max-width: 120px;
    padding: 5px;
    cursor: pointer;
}

/* The Close Button */
.close-c {
    color: #aaa;
    float: right;
    font-size: 28px;
    font-weight: bold;
    line-height: 0;
}

.close-c:hover,
.close-c:focus {
    color: black;
    text-decoration: none;
    cursor: pointer;
}

/* Modal Footer */
.modal-footer-c {
    padding: 2px 16px;
    background-color: #5cb85c;
    color: white;
}

div#photosModalDiv {
    max-height: 400px;
    overflow: auto;
}

.modalAlbum p {
    font-size: 14px;
}

.modalAlbum {
    float: left;
    border: 1px solid rgba(116, 116, 116, 0.73);
    margin: 6px;
    padding: 5px;
    /*width: 43%;*/
    /*height: 130px;*/
    cursor: pointer;
    overflow: hidden;
}

.modalAlbumPhotos img {
    max-height: 40px;
    margin: 3px;
    /* float: left; */
}

.modalPhotosFullDiv {
    display: none
}

.modalPhotosFullDiv img {
    max-height: 100px;
    /*margin: 5px;*/

}



#image-upload-choose a {
    display: block;
    color: #fff;
    padding: 8px;
    margin: 10px auto;
    width: 50%;
    text-align: center;
    border-radius: 5px;
    -moz-border-radius: 5px;
    text-decoration: none;
}

#image-upload-choose a:hover {
    text-decoration: none;
    color: #fff;
}
#image-upload-choose a:visited {
    text-decoration: none;
    color: #fff;
}

.btn-similapp-fb {
    background: #0078a3;

}.btn-similapp-fb:focus {
    outline: 2px solid #397899;
}

.btn-similapp-comp {
    background: #925288;
}

.btn-similapp-comp:focus {
     outline: 2px solid #397899;
 }

#image-upload-edit {
    width: 100%;
    height: 100%;
    position: relative;
}
.similapp-image-control {
    position: absolute;
    padding: 2px 5px;
    background: rgba(255,255,255,0.7);
    border-bottom: 1px solid #397899;
    border-top: 1px solid #397899;
    border-left: 1px solid #397899;
    z-index: 100;
    cursor: pointer;
}

.similapp-image-control-return {
    top:3%;
}
.similapp-image-control-left {
    top: 23%;
}
.similapp-image-control-right {
    top:41%;
}

.similapp-image-control-zoomin {
    top:61%;
}

.similapp-image-control-zoomout {
    top:80%;
}

div#image-container {
    background: #fff;
    border: 1px solid #0078a3;
    height: 178px;
    width:100%;
    border-radius: 5px;
}

div#image-upload-choose {
    padding-top: 30px;
}

/*P3*/
.similapp-image-text-group {
    z-index: 1;
    cursor: pointer;
    max-width: 75px;
    text-align: center;
    display: inline-block;
    font-weight:500;
}

/*label.similapp-h2.font-900.line-3 {*/
    /*font-size: 16px;*/
/*}*/

label.similapp-h3.font-900 {
    font-weight:500;
}

.p3-atts, .p3-lable {
    text-align: center !important;
}

.p3-lable > label {
    font-size: 14px;
    line-height: normal;
}


.hasEmail {
    text-align: center;
    background: #925288;
    color: #ffffff;
    padding: 5px;
    border-radius: 7px;
    border: 1px solid #0078a3;
    font-size: 14px;
}
#hasEmail {
    display: none;
}

/*.p5-top {*/
    /*background: url(images/p5/m-top.png) no-repeat top center;*/
    /*background-size: contain;*/
/*}*/

/*.p5-top h1 {*/
    /*padding-top: 48px;*/
    /*padding-bottom: 25px;*/
    /*font-size: 26px;*/
/*}*/

.p5-top h1 {
    padding-top: 13%;
    padding-bottom: 25px;
    background: url(images/p5/m-top.png) no-repeat top center;
    background-size: contain;
    font-size: 26px;
}

/*Small devices (landscape phones, 576px and up)*/
@media (min-width: 576px) {
    .p5-top h1 {
        padding-top: 73px;
        padding-bottom: 25px;
        background: url(images/p5/m-top.png) no-repeat top center;
        background-size: contain;
        font-size: 30px;
    }

    .similapp-h1 {
        font-size: 30px;
    }


    .similapp-h3 {
        font-size: 14px;
    }

    img.boy-girl-btn {
        width: 50px;
    }

    /*P3*/
    /*.similapp-image-text-group {
        z-index: 1;
        cursor: pointer;
        max-width: 75px;
        text-align: center;
        display: inline-block;
        font-weight:500;
    }

    label.similapp-h2.font-900.line-3 {
        font-size: 16px;
    }

    label.similapp-h3.font-900 {
        font-weight:500;
    }
*/
}

/*Medium devices (tablets, 768px and up)*/
@media (min-width: 768px) {
    .shareTitle {
        line-height: 1.8
    }
    .similapplayer {
        margin-bottom: 20px;
    }
    .p5-top h1 {
        padding-top: 76px;
        padding-bottom: 40px;
        background: url(images/p5/top.png) no-repeat top center;
        background-size: cover;
        font-size: 40px;
    }


    .hasEmail {
    text-align: center;
    background: #925288;
    color: #ffffff;
    padding: 5px;
    border-radius: 7px;
    border: 1px solid #0078a3;
    font-size: 18px;
}

    .p2-full > body {
    background: url(images/bg-top.png) no-repeat right top #fff;
    background-size: contain;
}

    div#image-container {
    width: 85%;
}

    .similapp-h1 {
    font-size: 30px;
}

    .similapp-h2 {
    font-size: 17px;
}

    .similapp-h3 {
    font-size: 14px;
}

    .p1 {
    background: url(images/p1/d/tree.png) no-repeat;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    padding-left: 31%;
    padding-top: 14%;
}

    /*div#image-container {*/
    /*background: #fff;*/
    /*border: 1px solid #0078a3;*/
    /*height: 203px;*/
    /*width:85%;*/
    /*border-radius: 5px;*/
    /*}*/

    /*#image-upload-choose a {*/
    /*display: block;*/
    /*color: #fff;*/
    /*padding: 8px;*/
    /*margin: 10px auto;*/
    /*width: 50%;*/
    /*text-align: center;*/
    /*border-radius: 5px;*/
    /*-moz-border-radius: 5px;*/
    /*text-decoration: none;*/
    /*}*/

    /*#image-upload-choose a:hover {*/
    /*text-decoration: none;*/
    /*color: #fff;*/
    /*}*/
    /*#image-upload-choose a:visited {*/
    /*text-decoration: none;*/
    /*color: #fff;*/
    /*}*/

    /*.btn-similapp-fb {*/
    /*background: #0078a3;*/
    /*}*/

    /*.btn-similapp-comp {*/
    /*background: #925288;*/
    /*}*/
    /*#image-upload-edit {*/
    /*width: 100%;*/
    /*height: 100%;*/
    /*}*/
    /*.similapp-image-control {*/
    /*position: absolute;*/
    /*padding: 5px;*/
    /*background: rgba(255,255,255,0.7);*/
    /*border-bottom: 1px solid #397899;*/
    /*border-top: 1px solid #397899;*/
    /*border-left: 1px solid #397899;*/
    /*z-index: 100;*/
    /*cursor: pointer;*/
    /*}*/

    /*.similapp-image-control-return {*/
    /*top:25%;*/
    /*}*/
    /*.similapp-image-control-left {*/
    /*top:50%;*/
    /*}*/
    /*.similapp-image-control-right {*/
    /*top:65%;*/
    /*}*/

    img.boy-girl-btn {
    width: 50px;
}

    /*P3*/
    .similapp-image-text-group {
    z-index: 1;
    cursor: pointer;
    max-width: 75px;
    text-align: center;
    display: inline-block;
}

    /*label.similapp-h2.font-900.line-3 {*/
    /*font-size: 16px;*/
    /*}*/

    label.similapp-h3.font-900 {
    font-weight: 900;
}

    .p3-lable {
    text-align: left !important;
}
    .p3-atts {
    text-align: right !important;
}
    .p3-lable > label {
    font-size: 14px;
    line-height: 4;
}
}

/*Large devices (desktops, 992px and up)*/
@media (min-width: 992px) {
    .p5-top h1 {
        padding-top: 76px;
        padding-bottom: 40px;
        background: url(images/p5/top.png) no-repeat top center;
        background-size: cover;
    }

    .similapp-h1 {
    font-size: 30px;
}

    .similapp-h2 {
    font-size: 17px;
}

    .similapp-h3 {
    font-size: 14px;
}
    img.boy-girl-btn {
    width: 39px;
}
    div#image-container {
    height:178px;
    width:85%;
}



}

/*Extra large devices (large desktops, 1200px and up)*/
@media (min-width: 1200px) {
    .p5-top h1 {
        padding-top: 90px;
        padding-bottom: 40px;
        background: url(images/p5/top.png) no-repeat top center;
        background-size: cover;
        font-size:45px;
    }

    .similapp-h1 {
    font-size: 30px;
}

    .similapp-h2 {
    font-size: 19px;
}

    .similapp-h3 {
    font-size: 14px;
}

    img.boy-girl-btn {
        width: 55px;
    }
    /*P3*/
    .similapp-image-text-group {
        z-index: 1;
        cursor: pointer;
        max-width: 90px;
        text-align: center;
        display: inline-block;
    }
}