@font-face {
    font-family: 'FontAwesome';
    src: url('./fonts/fontawesome-webfont.eot?v=4.0.1');
    src: url('./fonts/fontawesome-webfont.eot?#iefix&v=4.0.1') format('embedded-opentype'), url('./fonts/fontawesome-webfont.woff?v=4.0.1') format('woff'), url('./fonts/fontawesome-webfont.ttf?v=4.0.1') format('truetype'), url('./fonts/fontawesome-webfont.svg?v=4.0.1#fontawesomeregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

.fa {
    display: inline-block;
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.double {
    zoom: 1.4;
    transform: scale(1.4);
    -ms-transform: scale(1.4);
    -webkit-transform: scale(1.4);
    -o-transform: scale(1.4);
    -moz-transform: scale(1.4);
    transform-origin: 0 0;
    -ms-transform-origin: 0 0;
    -webkit-transform-origin: 0 0;
    -o-transform-origin: 0 0;
    -moz-transform-origin: 0 0;
    -webkit-transform-origin: 0 0;
}

.double2 {
    zoom: 1.65;
    transform: scale(1.65);
    -ms-transform: scale(1.65);
    -webkit-transform: scale(1.65);
    -o-transform: scale(1.65);
    -moz-transform: scale(1.65);
    transform-origin: 0 0;
    -ms-transform-origin: 0 0;
    -webkit-transform-origin: 0 0;
    -o-transform-origin: 0 0;
    -moz-transform-origin: 0 0;
    -webkit-transform-origin: 0 0;
}


.ml4 {
    margin-left: 4px;
}

.outline {
    text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
}

[class^="fa-"],
[class*=" fa-"] {
    /* display: inline-block; */
    /* margin-top: 1px; */
    /* font-size: 14px; */
    *margin-right: .3em;
    /* line-height: 14px; */
}

.rtlfloat {
    float: right !important;
}

.ltrfloat {
    float: left !important;
}


/* Used: http://www.colorzilla.com/gradient-editor/*/
.radial-gradient {
    background: -moz-radial-gradient(center, ellipse cover, rgba(0,0,0,0.7) 39%, rgba(0,0,0,0.57) 45%, rgba(0,0,0,0) 72%, rgba(0,0,0,0) 100%); /* FF3.6+ */
    background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(39%,rgba(0,0,0,0.7)), color-stop(45%,rgba(0,0,0,0.57)), color-stop(72%,rgba(0,0,0,0)), color-stop(100%,rgba(0,0,0,0))); /* Chrome,Safari4+ */
    background: -webkit-radial-gradient(center, ellipse cover, rgba(0,0,0,0.7) 39%,rgba(0,0,0,0.57) 45%,rgba(0,0,0,0) 72%,rgba(0,0,0,0) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-radial-gradient(center, ellipse cover, rgba(0,0,0,0.7) 39%,rgba(0,0,0,0.57) 45%,rgba(0,0,0,0) 72%,rgba(0,0,0,0) 100%); /* Opera 12+ */
    background: -ms-radial-gradient(center, ellipse cover, rgba(0,0,0,0.7) 39%,rgba(0,0,0,0.57) 45%,rgba(0,0,0,0) 72%,rgba(0,0,0,0) 100%); /* IE10+ */
    background: radial-gradient(ellipse at center, rgba(0,0,0,0.7) 39%,rgba(0,0,0,0.57) 45%,rgba(0,0,0,0) 72%,rgba(0,0,0,0) 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b3000000', endColorstr='#00000000',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}

.vertical-gradient {
    background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0)), color-stop(100%,rgba(0,0,0,1))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%); /* IE10+ */
    background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#000000',GradientType=0 ); /* IE6-9 */
}

.SubHeadingPoint {
    background-color: rgba(255,255,255,0);
    width: 240px;
    min-height: 250px;
    display: inline-block;
    vertical-align: top;
}

.SubHeadingImageContainer {
    margin-top: 30px;
}

.SubHeadingImageTitle {
    color: #808080;
    font-weight: bolder;
    width: 100%;
    font-size: 17px;
    line-height: 35px;
}

.SubHeadingImageDescription {
    font-size: 13px;
    color: rgb(154, 161, 169);
}

.HPBackground {
 /**/   background-color: rgb(61,61,61);
    width: auto;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0px;
    min-height: 600px;
    background-repeat: no-repeat;
    background-size: cover;
    overflow-x: hidden;
    overflow-y: auto;
    /* margin-bottom:30px;*/
    /*margin-top: 62px;*/
    /*position: absolute; */
    color: white;
    width: 100%;
    background-size: cover;
}

.DiscoverAndMeet {
    color: white; /*rgb(224,34,34);*/
    font-size: 36px;
    font-weight: bold;
    text-align: center;
    text-transform: uppercase;
}

.MainRegWindow {
    background-color: rgba(0,0,0,0.5);
    padding: 10px;
}

option {
    color: white;
}

.HPInformation {
    margin-top: 30px;
    margin-left: auto;
    margin-right: auto;
    padding: 30px 30px 3px 30px;
    max-width: 760px;
    font-size: x-large;
    border: solid 0px;
    border-radius: 10px;
    /*   background-color: rgb(61,61,61);*/
    opacity: 1;
}

.ml30 {
    margin-left: 30px;
}

.HPPoints {
    margin-left: 100px;
    padding-top: 15px;
    font-size: large;
}

.HPIcon {
    margin-left: 20px;
    margin-top: 10px;
    font-size: medium;
    height: 60px;
}

.HPSignup {
    display: none;
    padding-top: 70px;
    padding-right: 20px;
    padding-left: 30px;
    padding-bottom: 40px;
    float: right;
    max-width: 400px;
    width: 100%;
    z-index: 1000;
    opacity: 0.95;
    background-color: black;
    color: white;
}

.HPEntry {
    width: 48%;
    /*display: inline-block;*/
    height: 460px;
    float: left;
}

#PressCoverageSection
{
    background-color:rgba(0,0,0,0.5);/*rgb(235,235,235);*/
    height:160px;
}

.AsSeenOn
{
    color:white;
}

#AllLogos
{
    height:70px;
}

#FounderVision
{
    background-color:rgb(235,235,235);
    
}

#WOEDContent
{
    text-align:center;
    margin:30px;
}

.FooterDiv
{
    width:calc(25% - 45px);
    display:inline-block;
    vertical-align:top;
    padding-right:20px;
    padding-left:20px;
    text-align:center;
    line-height:30px;
}

#ReadyToGoContents {
       
    margin-left:auto;
    margin-right:auto;
    text-align:center;
}

.phonescreenshots
{
    height:490px;
}

#uplogowhite
    {
        display:inline-block;
    }
    #uplogo
    {
        display:none;
    }

@media (max-width:1100px) {
    .phonescreenshots {
        height: 400px;
    }
    #PressCoverageSection {
        background-color: rgb(235,235,235);
        height:80px;
        color:black;
    }
    .AsSeenOn
    {
        color:black;
    }
    #uplogo
    {
        display:inline-block;
    }
    #uplogowhite
    {
        display:none;
    }
}

#ShortTourContents
{
    max-width:1024px;
    width:100%;
    margin-left:auto;
    margin-right:auto;
}

#Testimonials
{
    background-color:rgb(255,255,255);
    max-width:100%;
    padding:30px;
}

#WorksOnEveryDevice
{
    background-color:rgb(235,235,235);
    padding:20px;
}


#TestimonialContents
{
    max-width:1024px;
    width:100%;
    margin-left:auto;
    margin-right:auto;
    text-align:center;
}

#StatisticsContents
{
    max-width:1024px;
    width:100%;
    margin-left:auto;
    margin-right:auto;
    
    text-align:center;
    
}

#FounderVisionContent
{
    max-width:1024px;
    width:100%;
    padding:30px;   
    margin-left:auto;
    margin-right:auto;
}

#PlayVideoContainer
    {
        display:inline-block;
        width:740px;
    }

@media (max-width:1080px) {
    #PlayVideoContainer
    {
        width:640px;
    }
}
@media (max-width:767px)
{
    #PlayVideoContainer
    {
        display:none;
    }
}

.QOIcon
{
    border-radius:50%;
    width:35px;
    height:35px;
    display:inline-block;
    vertical-align:top;
    border:solid 2px #3F51B5;
    background-origin:content-box;
    background-repeat:no-repeat;
    padding:3px;
    text-align:center;
    line-height:35px;
    background-size:cover;
}
.QOExplanation
{
    font-size:small;
    color:#303030;
}

#QuickOverviewPhone
{
    max-width:1024px;
    background-color:rgb(255,255,255);
    width:100%;
    margin-left:auto;
    margin-right:auto;
    padding-top:30px;
    padding-bottom:30px;
}


#BulletPoint1,#BulletPoint2,#BulletPoint3,#BulletPoint4,#BulletPoint5,#BulletPoint6
{
    height:32%;
    font-size:15px;
}

#ReadyToGo
{
    
       width:100%;
    background-color:rgb(235,235,235);
}

#footer
{
    background-color:rgb(255,255,255);
    padding:40px;
}

#ReadyToGoContents
{
    max-width:1024px;
    padding:30px;
    
}

#MainSection
{
    margin-top:100px;
    margin-left:auto;
    margin-right:auto;
    width:1100px;
    max-width:100%;
    
}

#LeftMainSection{
    display:inline-block;
    width:512px;vertical-align:top;margin-right:100px;
}

#PressCoverageSubSection
{
    padding-top:40px;
}

@media (max-width:1100px) {
    #LeftMainSection {
        padding-left:30px;
    }
    #jwtlogo
    {
        display:none;
    }
    #PressCoverageSubSection
{
    padding-top:0px;
}
}

.MainLeftTitle
{
    font-size:48px;
}

.MainLeftDescription
{
    font-size:18px;
}

#vodafonelogo
{
    margin-right:30px;
}

#PlayVideoAppContainer
{
    display:inline-block;
}

#QOImage
{
    width:33%;
}
#QOLeft
{
    width:calc(33% - 20px);
}
#QORight
{
    display:inline-block;
}

#RBulletPoint4, #RBulletPoint5, #RBulletPoint6 {
    display: none;
}

@media (max-width:800px) {
    #LeftMainSection {
        width: 420px;
        margin-right: 60px;
    }

    #QOImage
    {
        width:46%;
    }
    #QOLeft
    {
        width:calc(53% - 20px);
    }
    #QORight
    {
        display:none;
    }
    #BulletPoint1,#BulletPoint2,#BulletPoint3,#RBulletPoint4,#RBulletPoint5,#RBulletPoint6,
    #BBulletPoint1,#BBulletPoint2,#BBulletPoint3,#BRBulletPoint4,#BRBulletPoint5,#BRBulletPoint6
{
    height:16%;
    font-size:12px;
    display:inline-block;
}
    .QOExplanation
    {
        font-size:9px;
    }

    #PlayVideoAppContainer
{
    display:block;
    margin-left:auto;
    margin-right:auto;
}

    #PlayVideoContainer
    {
        display:none;
    }
    .phonescreenshots {
        height: 300px;
    }
    .MainLeftTitle
{
    font-size:34px;
}
    .MainLeftDescription
{
    font-size:16px;
    line-height:20px;
}
    .HPBackground
    {
        min-height:430px;
    }
    #uplogo
    {
        display:none;
    }
    #vodafonelogo
    {
        margin-right:0px;
    }
}

#AllLogosSmall
    {
        display:none;
    }
#AllLogos
    {
        display:block;
    }



#PlatonicTitle
{
    font-size:32px;
}
#QOLeft
    {
        display:inline-block;
    }
#QOBottom
    {
        display:none;
    }
@media (max-width:512px)
{
    #QOImage
    {
        width:100%;
    }
    #LeftMainSection
    {
        width:calc(100% - 40px);
    }
    #QOBottom
    {
        display:block;
    }
    #QuickOverviewPhone
    {
        padding-bottom:0px;
    }

    #footer
    {
        padding:5px;
        font-size:x-small;
    }
    #QOLeft
    {
        display:none;
    }
    .HPHeader
    {
        display:none;
    }
    .MainLeftTitle
    {
        font-size:24px;
    }
    #PlatonicTitle
{
    font-size:24px;
}
    #LocalVideo
    {
        display:none;
    }
    #Testimonials
    {
        font-size:small;
    }
    .phonescreenshots
    {
        display:none;
    }
    #AllLogos
    {
        display:none;
    }
    #AllLogosSmall
    {
        display:block;
    }
}
#ScreenShotAndPlay{
    display:inline-block;
}

#CallstoAction
{
    margin-top:10px;
}
.HPHeader {
    /*background-color: #212121 !important;*/
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    min-height: 62px;
    height: 62px;
    z-index: 10000;
}

.PointIcon {
    color: red;
    font-size: large;
    margin-bottom: 5px;
}

.HPSpanDB {
    display: none;
}

.HPGender {
    border: 0 !important;
    padding-top: 10px !important;
    padding-left: 0px !important;
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
}

.HPSelect {
    width: 250px !important;
    float: right !important;
    color: white !important;
    background-color: black !important;
}

.mr5 {
    margin-right: 5px;
}

.mr10 {
    margin-right: 10px;
}

.HPMonth {
    /*margin-left:14px !important;*/
    width: 139px !important;
}

.HPSignupPassword {
    margin-left: 10px !important;
}

.logo_image {
    padding: 10px 0 0 10px;
    margin: 0 0 0 20px;
}



/* For iPad and iPhone */
@media (max-width:900px) {

    .HPBackground {
        background-image: none;
/*        margin-top: 0px;*/
    }

    .HPInformation {
        margin-left: 0px;
        margin-top: 60px;
        font-size: large;
        padding: 3px 3px 3px 3px;
    }

    .HPIcon {
        margin-left: 5px;
        font-size: small;
        height: 60px;
    }

    .HPPoints {
        margin-left: 75px;
        font-size: medium;
    }
}

.input-icon {
    position: relative;
}


    .input-icon input {
        padding-left: 33px !important;
    }

    .input-icon i {
        color: #ccc;
        display: block;
        position: absolute;
        margin: 11px 2px 4px 10px;
        width: 16px;
        height: 16px;
        font-size: 16px;
        text-align: center;
    }

    .input-icon.right input {
        padding-left: 12px !important;
        padding-right: 33px !important;
    }

    .input-icon.right i {
        right: 8px;
        float: right;
    }

.has-success .input-icon > i {
    color: #468847;
}

.has-warning .input-icon > i {
    color: #c09853;
}

.has-error .input-icon > i {
    color: #b94a48;
}

.fa-envelope-o:before {
    content: "\f003";
}

.fa-lock:before {
    content: "\f023";
}

.fa-user:before {
    content: "\f007";
}

.validation-message {
    color: rgb(223,0,33);
    font-size: small;
}

/***
Make font awesome icons fixed width(latest version issue)
***/
li [class^="fa-"],
li [class*=" fa-"] {
    display: inline-block;
    width: 1.25em;
    text-align: center;
}

    li [class^="fa-"].icon-large,
    li [class*=" fa-"].icon-large {
        /* increased font size for icon-large */
        width: 1.5625em;
    }

.text {
    font-family: 'Open Sans', sans-serif;
    color: #ddd;
}



.smallcheck {
    font-size: small;
    color: #bb2413;
    margin-left: 10px;
}

.strength0 {
    width: 250px;
    color: #cccccc;
}

.strength1 {
    width: 50px;
    color: #ff0000;
}

.strength2 {
    width: 100px;
    color: #ff5f5f;
}

.strength3 {
    width: 150px;
    color: #56e500;
}

.strength4 {
    color: #4dcd00;
    width: 200px;
}

.strength5 {
    color: #399800;
    width: 250px;
}

.usernameavailable {
    font-size: small;
    color: #1d943b !important;
}

.usernameunavailable {
    font-size: small;
    color: #bb2413 !important;
}

.form-control:-moz-placeholder {
    color: #999999;
}

.form-control::-moz-placeholder {
    color: #999999;
}

.form-control:-ms-input-placeholder {
    color: #999999;
}

.form-control::-webkit-input-placeholder {
    color: #999999;
}

.form-control {
    font-size: 14px;
    font-weight: normal;
    color: white;
    background-color: #353535;
    border: 1px solid #e5e5e5;
    border-radius: 0;
    box-shadow: none;
    width: 100%;
    height: 34px;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.428571429;
    vertical-align: middle;
    /*background-image: none;*/
    border: 0px solid #cccccc;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    -webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
    transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
}

    .form-control:focus {
        border-color: #999999;
        outline: 0;
        -webkit-box-shadow: none !important;
        box-shadow: none !important;
    }

body {
    padding: 0px 0px 0px 0px;
    margin: 0px 0px 0px 0px;
    font-family: 'Open Sans', serif;
}

.btn {
    border-width: 0;
    padding: 7px 14px;
    font-size: 14px;
    outline: none !important;
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    box-shadow: none !important;
    -webkit-border-radius: 0 !important;
    -moz-border-radius: 0 !important;
    border-radius: 0px !important;
    text-shadow: none;
}

.editor-field {
    margin-top: 10px;
}

.btn.red {
    color: white;
    text-shadow: none;
    background-color: #d84a38;
}

    .btn.red:hover,
    .btn.red:focus,
    .btn.red:active,
    .btn.red.active,
    .btn.red[disabled],
    .btn.red.disabled {
        background-color: #bb2413 !important;
        color: #fff !important;
        outline: none !important;
    }


.btn {
    display: inline-block;
    padding: 6px 12px;
    margin-bottom: 0;
    font-size: 14px;
    font-weight: normal;
    line-height: 1.428571429;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    cursor: pointer;
    background-image: none;
    border: 1px solid transparent;
    border-radius: 4px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -o-user-select: none;
    user-select: none;
}

    .btn:focus {
        outline: thin dotted;
        outline: 5px auto -webkit-focus-ring-color;
        outline-offset: -2px;
    }

    .btn:hover,
    .btn:focus {
        color: #333333;
        text-decoration: none;
    }

    .btn:active,
    .btn.active {
        background-image: none;
        outline: 0;
        -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
        box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    }

    .btn.disabled,
    .btn[disabled],
    fieldset[disabled] .btn {
        pointer-events: none;
        cursor: not-allowed;
        opacity: 0.65;
        filter: alpha(opacity=65);
        -webkit-box-shadow: none;
        box-shadow: none;
    }

.footer {
    padding: 8px 20px 5px 20px;
    font-size: 13px;
    font-family: 'Lato', sans-serif;
}

a {
    text-decoration: none;
}

.footer:after,
.footer:before {
    content: "";
    display: table;
    line-height: 0;
}

.footer:after {
    clear: both;
}

.footer .footer-inner {
    float: left;
    display: inline-block;
}

.footer .footer-tools {
    float: right;
    display: inline-block;
}

    .footer .footer-tools .go-top {
        display: block;
        text-decoration: none;
        cursor: pointer;
        margin-top: -2px;
        margin-right: 0px;
        margin-bottom: 0px;
        font-size: 16px;
        padding: 0px 6px 0px 6px;
    }

        .footer .footer-tools .go-top i {
            font-size: 22px;
            margin-bottom: 5px;
        }

.registration-label {
    width: 100px;
    display: inline-block;
}

.editor-field {
    display: inline-block;
    width: calc(100% - 110px);
}

#ExplanationIcons {
    font-family: 'Lato', sans-serif;
    font-weight: normal;
}

select {
    border: 0;
    position: relative;
    font-size: large;
    height: 32px;
    bottom: 1px;
    border: 0;
    border-bottom: solid 1px gray;
    padding: 5px;
    background: rgba(255,255,255,1) url(/National_Library/oe_/https://patook.com/images/select-arrow-red.png) right center no-repeat;
    -moz-appearance: none;
    -webkit-appearance: none;
}

#city {
    background-color: rgba(255,255,255,1.0);
    color: black;
    border: 0;
    position: relative;
    font-size: large;
    height: 32px;
    bottom: 1px;
    border: 0;
    border-bottom: solid 1px gray;
    padding: 5px;
    background: rgba(255,255,255,1.0);
    -moz-appearance: none;
    -webkit-appearance: none;
}

#locallanguage {
    background-color: rgba(0,0,0,0);
    color: white;
    border: 0;
    position: relative;
    font-size: large;
    height: 32px;
    bottom: 1px;
    border: 0;
    border-bottom: solid 1px gray;
    padding: 5px;
}

#locallanguage {
    background: rgba(0,0,0,0) url(/National_Library/oe_/https://patook.com/images/select-arrow-red.png) right center no-repeat;
    -moz-appearance: none;
    -webkit-appearance: none;
}

a, a:visited {
    color: darkgray;
    text-shadow: none;
}

#divcity {
    position: relative;
    bottom: 0px;
}

.social_icon {
    margin: 0 3px 0 3px;
}

input, select {
    font-family: 'Open Sans', sans-serif;
}

.dropdown-dark > a::after {
    border-color: #FF0000 rgba(0, 0, 0, 0) rgba(0, 0, 0, 0);
}

option {
    background-color: black;
}

.ml10 {
    margin-left: 10px;
}

.lpane {
    width: 50%;
    float: none;
    margin-left: auto;
    margin-right: auto;
    height: auto;
    min-height: calc(100% - 50px);
    overflow: visible;
}

.rpane {
    width: 50%;
    float: right;
    background-color: rgba(0,0,0,0.8);
    height: auto;
    min-height: 100%;
    overflow: visible;
}

.lborder {
    border-left: solid 1px gray;
    padding-left: 10px;
    padding-right: 10px;
    height: auto;
    min-height: 100%;
}

.rev-registration-label {
    display: none !important;
}

.DOB {
    display: inline-block;
    width: 100%;
}

.registration-entry {
    margin-top: 5px;
    margin-bottom: 5px;
}

.lpane-inner {
    margin-left: 5px;
    margin-right: 5px;
    min-width: 320px;
    max-width: 480px;
    margin-left: auto;
    margin-right: auto;
    width: calc(100% - 40px);
    margin-top: 0;
    padding: 20px 20px 20px 20px;
}

@media (max-width:360px) {
    .lpane-inner {
        width: calc(100% - 8px);
    }
}

@media (max-height:680px) {
    .lpane-inner {
        margin-top: 0;
    }
}

.AlmostDone {
    font-size: 24px;
    margin-bottom: 20px;
   /* font-weight: bold;*/
    font-family:Lane,sans-serif;
}

#locallanguagediv {
    display: inline-block;
}

.hide-when-small {
    display: inline-block;
}

#divcity
{
    width:140px;
}
#divcountry
{
    width:140px;
}

@media (max-width:1023px)
{
    #city
    {
        font-size:small;
    }
    #localcountry
    {
        font-size:smaller;
    }
    #divcity
{
    width:100px;
}
#divcountry
{
    width:100px;
}
}
#SubmitButton {
    margin-top: -1px;
}

.TOSText {
    width:100%;
    /*width: 570px;*/
}

#login_form {
    height: 48px;
    padding-top: 15px;
}

.lpane-inner {
    margin-top: 30px;
}

.FBBackground {
    height: 750px;
}

@media (max-width:600px) {
    .TOSText {
        width: 220px;
    }

    .FBBackground {
        height: 900px;
    }

    .lpane-inner {
        margin-top: 0px;
    }


    #login_form {
        height: 35px;
        padding-top: 10px;
    }

    .OddPointExplanation {
        padding-left: 10px;
        padding-right: 10px;
        font-size: 12px !important;
    }

    .HPInformation {
        margin-top: 70px;
    }

    #SubmitButton {
        margin-top: 10px;
    }

    .DiscoverAndMeet {
        font-size: 18px;
    }

    .rpane {
        display: none;
    }

    .registration-label {
        display: none;
    }

    .InnerRegistration {
        text-align: center;
    }

    .hide-when-small {
        display: none;
    }

    .editor-field {
        width: 100%;
    }

    .lpane-inner {
        min-width: 300px;
        padding: 10px 10px 10px 10px;
    }

    .AlmostDone {
        font-size: 14px;
    /*    margin-top: 90px;*/
    }

    .lpane {
        width: 100%;
    }

    #locallanguagediv {
        display: none;
    }

    #locallanguage {
        display: none;
    }

    .HPInformation {
        padding: 30px 10px 10px 10px;
        margin-top: 30px;
    }

    .RegisterForm {
        margin-top: -30px;
    }
}

.picture-row {
    width: 100%;
    height: 200px;
}

@media (max-width:1024px) {
    .picture-row {
        height: 120px;
    }
}

@media (min-width:815px) {
    .picture-row {
        width: 485px;
    }
}


@media (min-width:1035px) {
    .picture-row {
        width: 485px;
    }
}

@media (min-width:1225px) {
    .picture-row {
        width: 585px;
    }
}

@media (min-width:1400px) {
    .picture-row {
        width: 680px;
    }
}

@media (min-width:1650px) {
    .picture-row {
        width: 100%;
    }
}

.WhyJoinPatook {
    color: white;
    font-size: 24px;
    text-transform: none;
}

@media (max-width:1024px) {
    .WhyJoinPatook {
        color: white;
        font-size: 18px;
        text-transform: none;
    }
}

.hotspotsection {
    width: 100%;
    height: 120px;
    overflow-x: auto;
    display: inline-block;
    overflow-y: hidden;
}

@media (min-height:870px) {
    .hotspotsection {
        height: 255px;
    }
}

@media (max-height:700px) {
    .picture-row {
        height: 100px;
    }
}

.OddPoint {
    background-color: white;
    width: 100%;
    text-align: center;
}

.OddPointHeader {
    font-weight: bold;
    font-size: 28px;
    color: rgb(51, 51, 51);
    padding-top: 20px;
}

.OddPointSubheader {
    font-size: 20px;
    color: rgba(128,128,128,1);
    margin-top: 10px;
}

.OddPointExplanation {
    color: rgb(169, 169, 169);
    font-size: 16px;
    margin-top: 10px;
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
}

.custombutton {
    font-size: 16px;
    text-decoration: none;
    background-color: #EEEEEE;
    color: #333333;
    padding: 2px 6px 2px 6px;
    border-top: 1px solid #CCCCCC;
    border-right: 1px solid #333333;
    border-bottom: 1px solid #333333;
    border-left: 1px solid #CCCCCC;
}

.even {
    background-color: rgba(239,243,246,1);
}

@media (max-width:1023px) {
    .SubHeadingPoint {
        width: 40%;
    }
}

@media (max-width:500px) {
    .SubHeadingPoint {
        width: 90%;
    }
}

.fwb, ._4z_f {
    color: red !important;
}

@keyframes bounce {
    0%, 20%, 50%, 80%, 100% {
        -ms-transform: translateY(0);
        transform: translateY(0);
    }

    40% {
        -ms-transform: translateY(-30px);
        transform: translateY(-30px);
    }

    60% {
        -ms-transform: translateY(-15px);
        transform: translateY(-15px);
    }
}


@-moz-keyframes bounce {
    0%, 20%, 50%, 80%, 100% {
        transform: translateY(0);
    }

    40% {
        transform: translateY(-30px);
    }

    60% {
        transform: translateY(-15px);
    }
}

@-webkit-keyframes bounce {
    0%, 20%, 50%, 80%, 100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }

    40% {
        -webkit-transform: translateY(-30px);
        transform: translateY(-30px);
    }

    60% {
        -webkit-transform: translateY(-15px);
        transform: translateY(-15px);
    }
}

.arrow_subtext {
    position: fixed;
    bottom: 0px;
    right: 0px;
    font-size: small;
    color: white;
    background-color: orange;
    border-radius: 4px;
    padding: 6px;
    border: solid 1px lightgray;
}

.arrow {
    position: fixed;
    bottom: 30px;
    right: 20px;
    margin-left: -20px;
    width: 50px;
    display: none;
    height: 40px;
    background-image: url('arrowDown.png');
    background-size: contain;
}

.mr10 {
    margin-right: 10px;
}

.jumptarget:before {
    content: "";
    display: block;
    height: 60px; /* fixed header height*/
    margin: -60px 0 0; /* negative fixed header height */
}

.bounce {
    animation-name: bounce;
    animation-duration: 2s;
    animation-delay: 2s;
    animation-iteration-count: 3;
    -webkit-animation-name: bounce;
    -webkit-animation-duration: 2s;
    -webkit-animation-delay: 2s;
    -webkit-animation-iteration-count: 5;
    -moz-animation-name: bounce;
    -moz-animation-duration: 2s;
    -moz-animation-delay: 2s;
    -moz-animation-iteration-count: 3;
}

@media screen and (min-color-index:0) and (-webkit-min-device-pixel-ratio:0) {
    @media {
        .SubHeadingImageTitle {
            font-size: 17px;
        }
    }
}

/*
@media (min-height:800px) {
    .arrow {
        display:none;
    }
}*/




.row-fluid:after {
    content: "";
    display: table;
    clear: both;
}

.user-description-wrapper > ul span, .messages-opened-page .message .d-text {
    float: left;
}

.user-description-wrapper > ul ul {
    float: right;
}

.discussion::after,
.discussion .replies {
    position: absolute;
}

.discussion, .d-upper-side, .user-description-wrapper > ul span {
    position: relative;
}

.latest-discussion-title, .ht-discussion .name,
.user-description-wrapper > ul {
    font-family: 'Montserrat', sans-serif;
}

    .user-description-wrapper > ul span, .meta, .replies, .d-text {
        font-family: 'Open Sans', Arial, sans-serif;
    }

.meta, .replies {
    font-size: 12px;
}

.user-description-wrapper > ul, .match .d-text {
    font-size: 13px;
}

    .latest-discussion-title, .user-description-wrapper > ul span,
    .d-text {
        font-size: 14px;
    }

.user-description-wrapper > ul, .meta, .replies {
    font-weight: bold;
}

    .meta a {
        color: #3F51B5 !important;
    }

.discussion::after {
   /* border: 1px solid #dfdcd6;*/
}

.discussion::after, .discussion {
    border-radius: 4px;
}

.discussion {
    border: 1px solid #dfdcd5;
}

    .discussion::after,
    .user-description-wrapper > ul > li {
        width: 100%;
    }

.latest-discussions .meta, .ht-discussion .name {
    display: inline-block;
}

.d-upper-side h4 {
    display: block;
}

.latest-discussion-title, .meta, .replies, .d-text {
    color: #737373;
}


.row-fluid span {
    width: 100%;
}

.d-upper-side h4 a {
    transition: all .35s ease;
    -moz-transition: all .35s ease;
    -webkit-transition: all .35s ease;
    -o-transition: all .35s ease;
    -ms-transition: all .35s ease;
}

    .d-upper-side h4 a:hover {
        opacity: .75;
    }

.discussion::after {
    content: '';
    bottom: -3px;
    left: -1px;
    height: 10px;
    z-index: 0;
    border-top: 0;
    transition: all .35s ease;
    -webkit-transition: all .35s ease;
    -moz-transition: all .35s ease;
    -o-transition: all .35s ease;
    -ms-transition: all .35s ease;
}

.home .discussions-dashboard-heading {
    margin-top: 20px;
}


.discussions {
    margin-bottom: 30px;
}


.discussion {
    padding: 15px;
    margin-bottom: 30px;
}

    .discussion:hover::after {
        bottom: -1px;
    }


.d-upper-side {
    margin-bottom: 25px;
    padding-left: 79px;
}


.hotspot-all-discussions .d-upper-side {
    padding-left: 104px;
}


.d-upper-side h4 {
    padding-top: 9px;
    margin-bottom: 5px;
}


    .d-upper-side h4 a {
        color: #343434;
    }


.meta a:hover, .replies:hover {
    text-decoration: underline;
}


.replies {
    margin-top: -12px;
    padding: 3px 0 3px 20px;
    background: url(/National_Library/oe_/https://patook.com/images/replies.png) left center no-repeat;
}


.discussion .replies {
    right: 10px;
    top: 50%;
}


.hotspot-list-item .replies {
    color: #0f0f0f;
    padding: 2px 0 3px 22px;
    font-size: 15px;
}


.d-text {
    line-height: 150%;
}


.hotspot-li-right-section .meta, .hotspot-li-right-section .d-text {
    margin-bottom: 15px;
}


.latest-discussions {
    padding: 15px 0 0 0;
}


    .latest-discussions .meta {
        margin-right: 7px;
        font-weight: normal;
    }


    .latest-discussions .meta {
        margin-bottom: 0;
    }


    .latest-discussions li {
        margin-bottom: 10px;
    }


.latest-discussion-title {
    font-weight: normal;
    margin-right: 7px;
}


.visible_when_lt_960 {
    display: none;
}

.visible_when_lt_960 {
    display: block;
}




.upvote {
    width: 24px;
    height: 24px;
    background-image: url(/National_Library/oe_/https://patook.com/Content/up.png);
    background-size: cover;
}


.downvote {
    width: 24px;
    height: 24px;
    background-image: url(/National_Library/oe_/https://patook.com/Content/down.png);
    background-size: cover;
}


.upvote:hover, .upvote-red {
    width: 24px;
    height: 24px;
    background-image: url(/National_Library/oe_/https://patook.com/Content/up-red.png);
    background-size: cover;
}


.downvote:hover, .downvote-red {
    width: 24px;
    height: 24px;
    background-image: url(/National_Library/oe_/https://patook.com/Content/down-red.png);
    background-size: cover;
}


.upvote-small {
    width: 16px;
    height: 16px;
    background-image: url(/National_Library/oe_/https://patook.com/Content/up.png);
    background-size: cover;
}


.downvote-small {
    width: 16px;
    height: 16px;
    background-image: url(/National_Library/oe_/https://patook.com/Content/down.png);
    background-size: cover;
}


.upvote-small:hover, .upvote-red-small {
    width: 16px;
    height: 16px;
    background-image: url(/National_Library/oe_/https://patook.com/Content/up-red.png);
    background-size: cover;
}


.downvote-small:hover, .downvote-red-small {
    width: 16px;
    height: 16px;
    background-image: url(/National_Library/oe_/https://patook.com/Content/down-red.png);
    background-size: cover;
}


.hide-when-small {
    display: inherit !important;
}


.unpad-when-small {
    padding-left: 79px !important;
}


@media (max-width:680px) {
    
.hide-when-small {
    display: none !important;
}


.unpad-when-small {
    padding-left: 5px !important;
}

}

@media (max-width:800px)
{
    .hide-when-small {
    display: none !important;
}

    .pr80
    {
        margin-right:5px !important;
    }
}

.fullwidth-when-small
{
    width:45%;
    float:left;
    margin-left:15px;
}

@media (max-width:640px) {
    .fullwidth-when-small {
        width: 92%;
    }
}

.messages-opened-page .message .d-text {
    margin-top: 15px;
}


.opened-message .d-text {
    float: none !important;
    margin-top: 20px !important;
}


.user-description-wrapper > ul {
    padding: 0 30px;
    color: #0f0f0f;
    text-transform: uppercase;
}


    .user-description-wrapper > ul span {
        font-weight: normal;
        text-transform: none;
        margin-top: -2px;
        margin-right: 5px;
    }


.edit-profile-page .user-description-wrapper > ul span {
    width: 100%;
    cursor: pointer;
}


.user-description-wrapper > ul > li {
    padding-bottom: 15px;
    margin-bottom: 15px;
    border-bottom: 1px solid #dfdcd6;
}


.edit-profile-page .user-description-wrapper > ul li span:hover .edit-icon {
    opacity: 1;
}


.ht-right .meta, .ht-right .d-text {
    margin-bottom: 20px;
}


.ht-discussion {
    padding-left: 34px;
    margin-bottom: 30px;
    border-left: 3px solid #e7e7e7;
    float: left;
}


    .ht-discussion .name {
        font-size: 16px;
        margin-bottom: 3px;
    }


    .ht-discussion .meta {
        font-style: italic;
        font-weight: normal;
    }


#post-discussion-title {
    margin-bottom: 20px;
}


#post-discussion-text {
    margin-bottom: 19px;
}


.conv-meta {
    margin-bottom: 7px;
}


.critique-descr > ul ul {
    width: 70%;
    padding: 0;
    float: right;
    opacity: .55;
}


.critique-descr > ul li {
    margin-bottom: 4px;
}


#register .d-text {
    float: left;
}


.label-d-text {
    margin-right: 15px;
    margin-bottom: 15px;
}


.votes .upvote:hover {
    background-position: 0 -16px;
}


.votes .downvote {
    background-position: 0 -32px;
}


    .votes .downvote:hover {
        background-position: 0 -48px;
    }

.hotspot-all-discussions .page-content, .hotspots-discussion-page .page-content {
    width: 100% !important;
}


.discussions-dashboard-heading .arrows {
    left: 455px;
}




.discussions .jspContainer, .discussions .jspPane {
    width: 100%;
}




.hotspot-all-discussions .col-xs-7 {
    width: 64%;
}


.hotspot-all-discussions .col-xs-3 {
    width: 24%;
}


    .hotspot-all-discussions .col-xs-3 img {
        width: 100%;
    }

}




@media screen and (max-width: 1280px) {


    .home .discussions, .home .discussions .jspContainer, .home .discussions .jspPane {
        max-width: 100%;
    }


    .discussion {
        padding: 20px;
    }


    .home .discussion .d-upper-side {
        padding-left: 0;
    }

    .home .replies {
        display: none;
    }


    .d-text {
        font-size: 13px;
    }


    .d-upper-side {
        margin-bottom: 15px;
    }


    .hotspot-all-discussions .discussion .d-upper-side {
        padding-left: 30px;
    }


    .hotspot-all-discussions .col-xs-7 {
        width: 67%;
    }


    .hotspot-all-discussions .col-xs-3 {
        width: 27%;
    }


    .hotspot-all-discussions img {
        width: 100%;
    }

    .hotspot-people .hsd-inner .d-text {
        width: 100%;
    }


    .user-description-wrapper > ul span {
        font-size: 13px;
    }
}


@media screen and (max-width: 1048px) {
    .hotspot-all-discussions .content.page-content-inner, .hotspots-discussion-page .content.page-content-inner {
        padding-right: 30px;
    }
}


@media screen and (max-width: 885px) {


    .hotspot-all-discussions .info-icon, .hotspot-all-discussion .info-icon2,
    .hotspot-all-discussions .discussion .replies {
        display: none;
    }


    .hotspot-all-discussions .col-xs-7, .hotspot-all-discussions .col-xs-3 {
        width: 100%;
    }


    .hotspot-all-discussions .hsd-inner {
        border-top: 1px solid #dfdcd5;
        border-radius: 4px;
    }


        .hotspot-all-discussions .hsd-inner h4, .hotspot-all-discussions .hsd-inner .d-text {
            width: 100%;
        }
}


@media screen and (max-width: 720px) {


    .message .d-text {
        padding-left: 80px;
    }


    .critique-descr > ul ul {
        width: 100%;
    }
}

@media screen and (max-width: 480px) {


    .d-text {
        display: none;
    }


    .message .d-text {
        display: none;
    }
}



@media screen and (max-width: 420px) {


    .home .discussions {
        display: none;
    }

    .home .discussions-dashboard-heading {
        margin-top: 0px;
    }
}


.ltrfloat {
    float: left !important;
}


.pr80 {
    padding-right: 80px !important;
}


.r10 {
    right: 10px !important;
}


.mr10 {
    margin-right: 10px !important;
}


.mr30 {
    margin-right: 30px !important;
}


.comment-depth0 {
    margin-left: 0px;
    overflow: auto;
    border-left: dashed 0px;
    padding-left: 0px;
}


.pl40 {
    padding-left: 40px;
}


.arrow-150 {
    background: #fff url(/National_Library/oe_/https://patook.com/images/select-arrow.png) 150px center no-repeat;
}


.arrow-90pct {
    background: #fff url(/National_Library/oe_/https://patook.com/images/select-arrow.png) 90% 50% no-repeat;
}


.l0 {
    left: 0px;
}


@media (min-width:768px)
{
    .MainRegWindow
    {
        /*min-width:740px;*/
    }

    .DiscoverAndMeet
    {
        min-width:600px;
    }
}

@media (min-width:600px) and (max-width:768px)
{
    .DiscoverAndMeet
    {
        font-size:xx-large;
    }
}

@media (max-width:400px) {
    .HPSignupPassword {
        margin-left: 3px !important;
    }


    .footer {
        font-size: 9px !important;
    }

    .logo_image {
        padding: 5px 0 0 5px;
    }

    #footer {
        position: relative !important;
    }

    .HPMonth {
        margin-left: 0px !important;
    }

    .HPSelect {
        width: 200px !important;
        float: right !important;
    }

    .HPGender {
        padding: 30px 0px 0px 0px !important;
    }

    .HPSignup {
        margin-top: 0px;
        margin-right: 0px;
    }

    .HPHeader {
        position: relative;
        height: 52px;
        min-height: 52px;
        margin-top:0px !important;
    }

    .HPSpanDB {
        display: block;
        margin-bottom: 5px;
        padding-bottom: 5px;
    }

    .HPBackground
    {
        margin-top:0px;
    }
}

@media (max-width:800px)
{
 
    .pr80
    {
        padding-right:5px !important;
    }
}

 .invalid-field {
                    border: solid 1px red !important;
                    -webkit-box-shadow: 0px 0px 25px red;
                    -moz-box-shadow: 0px 0px 25px red;
                box-shadow: 0px 0px 25px red; /* some variation of blue for the shadow */
            }

.button {
    color:white;
    background: #8bc34a;
    /* Old browsers */
    background: -moz-linear-gradient(top, #8bc34a 0%, #8FC64B 100%);
    /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #8bc34a), color-stop(100%, #8FC64B));
    /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #8bc34a 0%, #8FC64B 100%);
    /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #8bc34a 0%, #8FC64B 100%);
    /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #8bc34a 0%, #8FC64B 100%);
    /* IE10+ */
    background: linear-gradient(to bottom, #8bc34a 0%, #8FC64B 100%);
    /* W3C */
    border: 1px solid #8FC64B;

    cursor:pointer;
}

    .button:hover {
        background: #79A53E;
        /* Old browsers */
        background: -moz-linear-gradient(top, #79A53E 0%, #71993A 100%);
        /* FF3.6+ */
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #79A53E), color-stop(100%, #71993A));
        /* Chrome,Safari4+ */
        background: -webkit-linear-gradient(top, #79A53E 0%, #71993A 100%);
        /* Chrome10+,Safari5.1+ */
        background: -o-linear-gradient(top, #79A53E 0%, #71993A 100%);
        /* Opera 11.10+ */
        background: -ms-linear-gradient(top, #d71919 0%, #71993A 100%);
        /* IE10+ */
        background: linear-gradient(to bottom, #79A53E 0%, #71993A 100%);
        /* W3C */
    }

    .button:active, .gray-button:active {
        top: 1px;
    }

    .button:active {
        background: #79A53E;
    }