@import url('../font/stylesheet.css');

/* -----------------------
Base styles
------------------------*/

a {text-decoration: underline;color: #000;}

a:focus,
a:active {
    text-decoration: none;
}

a:hover {
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

html {
    height: 100%;
    box-sizing: border-box;
}

*:before,
*:after {
    box-sizing: inherit;
}

a:hover {
    color: #000;
    text-decoration: none;
}

h1, h2, h3, h4, h5, h6 {
}

h1 {color: #fff;font-size: 54px;    font-family: 'Intel Clear';
    font-weight: 300;
    font-style: normal;}

h2 {    font-family: 'Intel Clear';
    font-weight: bold;
    font-style: normal;color: #053B70;}

body {
    margin: 0;
    padding: 0;
    color: #292B2D;
    font-size: 16px;
    position: relative;
    margin: 0;
    min-height: 100%;
    font-family: 'Intel Clear';
    font-weight: normal;
    font-style: normal;
    background-color: #053B70;
    background-image: url(../images/bg.jpg);
    background-repeat: no-repeat;
    background-position: top left;
    padding-bottom: 5rem;
}

.whiteBox {background: #fff;}

body.signInPg .content {width: 360px;margin: 0 auto;text-align: center;}

.formContent {
    margin: 10px 0 30px 0;
}



.actionBtns {
    text-align: left;
    margin: 30px auto 0px auto;
}

/** Buttons Styles **/

.btn,
a.btn {
    display: inline-block;
    text-align: center;
    padding:10px 0px 10px 0px;

    font-size: 16px;
    color: #fff !important;
-webkit-border-radius: 0px;
border-radius: 0px;
    text-align: center;
    text-decoration: none;
    background-color: #0F68B6;
    white-space: normal !important;
    min-width: 100%;
        font-family: 'Intel Clear';
    font-weight: normal;
    font-style: normal;
}

.btn .fas {margin-left: 10px;}

.btn:hover,
a.btn:hover,
.btn:focus,
a.btn:focus,
.btn:active,
a.btn:active {
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    transition: all 0.5s ease;
    background-color: #075091;
}

.btn.grey, .btn.grey:hover {background-color: #E8EAED;border:3px solid #E8EAED;color: #202124 !important;}
.btn.grey.selected {border-color: #4285F4;}

label {float: left;
    color: #292B2D;
    font-size: 16px;
    margin-bottom: 0px;margin-bottom: 3px;
        font-family: 'Intel Clear';
    font-weight: normal;
    font-style: normal;
    width: 100%;
}


/** Buttons Styles **/


/** Footer Styles **/

.footer {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    padding: 15px;
    text-align: center;
    color: #fff;
    background-color: #053B70;
}



.footer .links {background-color:#E65725;width: 100%;padding: 15px;}



.footer .logoFooter {margin-bottom: 20px;}

body.signInPg .footer p.cpyTxt, .footer p.cpyTxt {
    margin: 0px auto 0px auto;
    font-size: 14px;
    color: #fff;
    margin-bottom: 0px;
}

.footerNav {
        padding-top: 15px;border-top: 1px solid #BDC1C6;width: 380px;margin: 0 auto 15px auto;
}

.footerNav li {
    border-right: 1px solid #fff;
    display: inline-block;
}

.logos li {margin-right: 45px;display: inline-block;}

.footerNav li:last-child {
    border-right: none;
}

.headerImg h2 {font-size: 65px;text-transform: uppercase;color: #fff;}

.footerNav li a {
    font-size: 16px;
    color: #5F6368;
    padding: 0px 25px;
    text-decoration: none;

}

.footerNav li a:hover {
    color: #3071DE;
    text-decoration: none;

}


/* placeholder Css */

.form-control::-webkit-input-placeholder {
       color: #292B2D;
    font-family: 'Intel Clear';
    font-weight: normal;
    font-style: normal;
    font-size: 16px;
}

.form-control:-moz-placeholder {
      color: #292B2D;
    font-family: 'Intel Clear';
    font-weight: normal;
    font-style: normal;
    font-size: 16px;
}

.form-control::-moz-placeholder {
    color: #292B2D;
    font-family: 'Intel Clear';
    font-weight: normal;
    font-style: normal;
    font-size: 16px;
}

.form-control:-ms-input-placeholder {
    color: #292B2D;
    font-family: 'Intel Clear';
    font-weight: normal;
    font-style: normal;
    font-size: 16px;
}

.right header .form-control::-webkit-input-placeholder {
       color: #fff;
    font-family: 'Intel Clear';
    font-weight: normal;
    font-style: normal;
    font-size: 16px;
}

.right header .form-control:-moz-placeholder {
      color: #fff;
    font-family: 'Intel Clear';
    font-weight: normal;
    font-style: normal;
    font-size: 16px;
}

.right header .form-control::-moz-placeholder {
    color: #fff;
    font-family: 'Intel Clear';
    font-weight: normal;
    font-style: normal;
    font-size: 16px;
}

.right header .form-control:-ms-input-placeholder {
    color: #fff;
    font-family: 'Intel Clear';
    font-weight: normal;
    font-style: normal;
    font-size: 16px;
}

.gridSearch .form-control::-webkit-input-placeholder {
       color: #555555;
    font-family: 'Intel Clear';
    font-weight: normal;
    font-style: normal;
    font-size: 16px;
}

.gridSearch .form-control:-moz-placeholder {
      color: #555555;
    font-family: 'Intel Clear';
    font-weight: normal;
    font-style: normal;
    font-size: 16px;
}

.gridSearch .form-control::-moz-placeholder {
    color: #555555;
    font-family: 'Intel Clear';
    font-weight: normal;
    font-style: normal;
    font-size: 16px;
}

.gridSearch .form-control:-ms-input-placeholder {
    color: #555555;
    font-family: 'Intel Clear';
    font-weight: normal;
    font-style: normal;
    font-size: 16px;
}

select {height: 45px !important;}
.form-control {
    width: 100%;
border: none;border: 1px solid #D7D7D7;box-shadow: none;background-color: transparent;-webkit-border-radius: 3px;border-radius: 3px;padding:11px 10px 10px 10px;
       color: #292B2D;
    font-family: 'Intel Clear';
    font-weight: normal;
    font-style: normal;
    font-size: 16px;
}





.form-control:hover, .form-control:active, .form-control:focus {
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    transition: all 0.5s ease;
    outline: 0;
    box-shadow: none;
    border: 1px solid #92959A;box-shadow: none;background-color: transparent;
}

.questions .form-control {
    width: 100%;
        color: #fff;
    font-size: 12px;
border: none;border: 2px solid #E27826;box-shadow: none;background-color: transparent;-webkit-border-radius: 0;border-radius: 0;color: #fff !important;
    padding: 10px;top: 10px;resize: none;height: 80px;
}

.questions .form-control:hover, .questions .form-control:active, .questions .form-control:focus {
    background-color: transparent;
    border: 2px solid #E27826;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    transition: all 0.5s ease;
    outline: 0;
    box-shadow: none;
}


.questions .formContent .btn {margin-top: 20px;}

.formContent small.reqLbl {font-size: 14px;color: #5F6368;float: left;margin-bottom: 30px;}
.formContent .cssBased {clear: both;}

/* CSS for custom checkbox */

.checkbox .cr,
.radio .cr {
    position: relative;
    display: inline-block;
    border: 1px solid #5F6367;
    border-radius: 3px;
    width: 24px;
    height: 24px;
    float: left;
    margin-right: 20px;
    background-color: #fff;
    float: left;
}

.form-group {
    margin-bottom: 12px;
}

.cssBased .cr {margin-right: 10px;float: left;}
.cssBased p {position: relative;top:4px;text-align: left;float: left;width: 89%;margin: 0px !important;font-size: 14px;}
.stqContent p.stqchkboxlbl {font-weight: 500;font-size: 16px;color: #333333;}
.radio .cr {
    border-radius: 50%;
}

.checkbox .cr .cr-icon,
.radio .cr .cr-icon {
    position: absolute;
    font-size: 16px;
    line-height: 0;
    top: 50%;
    left: 20%;
}

.cssBased {margin-top: 25px;
    margin-bottom: 20px;
    overflow: hidden;}

.cssBased:first-child {margin-top: 10px;}

.radio .cr .cr-icon {
    margin-left: 0.04em;
}

.checkbox label input[type="checkbox"],
.radio label input[type="radio"] {
    display: none;
}

.checkbox label input[type="checkbox"] + .cr > .cr-icon,
.radio label input[type="radio"] + .cr > .cr-icon {
    transform: scale(3) rotateZ(-20deg);
    opacity: 0;
    transition: all .3s ease-in;
}

.checkbox label input[type="checkbox"]:checked + .cr > .cr-icon,
.radio label input[type="radio"]:checked + .cr > .cr-icon {
    transform: scale(1) rotateZ(0deg);
opacity: 1;
    color: #4285F4;
    left: 3px;
    top: 11px;
}

.checkbox label input[type="checkbox"]:disabled + .cr,
.radio label input[type="radio"]:disabled + .cr {
    opacity: .5;
}

/* CSS for custom checkbox */

.cssBased p {
    width: 87%;
    color: #5F6368;
    font-size: 16px;

}

.cssBased p a {
    color: #0F68B6;
    text-decoration: underline;
}

.cssBased label {width: 100%;}
button:focus {outline:0;}

.content h2, .content h3 {margin-bottom: 20px;}
.content.stq {width: 480px;}
.stqContent {
    margin: 0px auto;
    padding: 20px;
    overflow: hidden;
    box-sizing: border-box;
    padding: 0px;
    margin: 0px auto 30px auto;
    text-align: left;
}
.stq {margin-top: 10px;}
.stq h3 {font-size: 36px;    font-family: 'Intel Clear';
    font-weight: 300;
    font-style: normal;}

.stq .shippingInfo {margin: 30px 0px;}
.stq .shippingInfo p {margin-bottom: 30px;}
.stq .shippingInfo h3 {margin-bottom: 10px;}
.stq .shippingInfo .form-group {width: 100% !important;}

.stq h4, .stq h5 {font-size: 24px;text-transform: uppercase;color: #0F68B6;font-family: 'Intel Clear';
    font-weight: normal !important;
    font-style: normal !important;}
.stq h4 span {display: block;font-size: 16px;text-transform: none;color: #292B2D;}

.stq .actionBtns .btn {min-width: 325px;}

.stq p.requiredLbl {font-size: 11px;}
.stqContent p.lblPrize {text-transform: uppercase;margin-bottom: 0px;}

.stqContent p.desc {
    font-size: 15px;
    color: #fff;
    text-align: center;
}

.stqContent h2 {
    font-size: 24px;
    margin-top: 30px;
    margin-bottom: 5px;
}




.stqContent p.question {
font-size: 16px;
    margin-bottom: 0px;
    line-height: 14px;
    margin-bottom: 10px;
    color: #202124;
    margin-top: 5px;
}

.stq .legalcpy p {font-size: 12px;}
.stq form {margin-top: 30px;}
.stq form .form-group {width:440px;}
.stq form .form-group small {font-size: 11px;}
.stq p.lblstq {margin-bottom: 0px;}

.stq .cssBased p {color: #0F68B6;font-weight: bold;}
.stqContent p.question span {
width: 160px;
    display: inline-block;
    font-size: 16px;
    line-height: 14px;
}

.stqContent .form-group p.lbl {
    color: #5F6368;
    margin: 5px 0px;
    font-size: 12px;
}

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

header {background-color: transparent;text-align: right;padding: 15px;}
header a.logout {color: #fff;text-decoration: underline;}
.content {margin:50px 70px;}
.content .logo {margin-bottom: 15px;}
.content h1 {margin-bottom: 30px;}
body.landingPg .whiteBox, body.claimrewardPg .whiteBox {width: 760px;padding: 30px;}
.whiteBox h4 {font-size: 24px;    font-family: 'Intel Clear';
    font-weight: bold;
    font-style: normal;margin-bottom: 20px;}

body.landingPg .whiteBox p {color: #0051A5;font-size: 18px;}
body.landingPg .whiteBox .actionBtns {margin: 50px 0px 30px 0px;}
body.landingPg .whiteBox .actionBtns .btn {min-width: 325px;}
body.allrewardsPg .whiteBox {width: 100%;padding: 30px;}


.modal-dialog {
    max-width: 670px;
    margin: 1.75rem auto;
}

.modal-content {-webkit-border-radius: 0;
border-radius: 0;}

#uploadcontest .modal-body {text-align: center;width: 360px;margin: 0 auto;}
#claimreward .modal-body, #declinereward .modal-body, #rewarddeclined .modal-body {text-align: center;padding: 50px;}
#claimreward .modal-body .btn, #rewarddeclined .modal-body .btn {margin-top: 40px;}
#declinereward .modal-body .btn.first {margin-right: 10px;}
#uploadcontest .modal-body img.uploadImg {width: 100%;margin-top: 20px;margin-bottom: 20px;}
.modal-body label {text-align: left;}
.modal-body h3 {font-size: 30px;margin: 30px 0px;}
.modal-body h4 {font-size: 18px;margin: 0px 0px 30px 0p;color: #0051A5;}
.modal-body .btn {min-width: auto;-webkit-border-radius: 0;
border-radius: 0;padding: 10px 50px 10px 50px;}
.modal-content button.close {position: absolute;
    top: 10px;
    right: 10px;z-index: 9999;}

#declinereward .actionBtns {text-align: center;margin-top: 50px;}
.rewardItem {border: 1px solid #D8D8D8;margin: 15px 0px;padding: 15px;}
.rewardItem .proName {overflow: hidden;}
.rewardItem .proName img, .rewardItem .proName p {float: left;}
.rewardItem img { width: 100%; max-width: 90px }
.rewardItem .proName p {margin-left: 15px;color: #0F68B6;width: 60%;}
.rewardItem .proName p span {display: block;color: #292B2D;font-weight: bold;margin-top: 5px;}
.rewardItem .prodetails p {color: #0F68B6;font-size: 14px;}
.rewardItem .prodetails p span {display: block;color: #292B2D;margin-top: 5px;font-size: 16px;}
.rewardItem .prodetails p a {color: #1A0EAB;text-decoration: underline;}
.rewardItem .actionBtns {overflow: hidden;margin-top: 0px;}
.rewardItem .actionBtns .btn {float: right;min-width: 175px;margin-left: 10px; margin-top:5px}

body.claimrewardPg .whiteBox h4 {margin-bottom: 40px;margin-top: 20px;}

.project-tab {
    padding: 10%;
    margin-top: -8%;
}
.project-tab #tabs{
    background: #007b5e;
    color: #eee;
}
.project-tab #tabs h6.section-title{
    color: #eee;
}
.project-tab #tabs .nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
    color: #0062cc;
    background-color: transparent;
    border-color: transparent transparent #f3f3f3;
    border-bottom: 3px solid !important;
    font-size: 16px;
    font-weight: bold;
}
.project-tab .nav-link {
    border: 1px solid transparent;
    border-top-left-radius: .25rem;
    border-top-right-radius: .25rem;
    color: #0062cc;
    font-size: 16px;
    font-weight: 600;
}
.project-tab .nav-link:hover {
    border: none;
}
.project-tab thead{
    background: #f3f3f3;
    color: #333;
}
.project-tab a{
    text-decoration: none;
    color: #333;
    font-weight: 600;
}

.nav-fill .nav-item {flex: none;}
body.allrewardsPg .whiteBox .nav-tabs a {color: #0051A5;font-size: 18px;text-decoration: none;height: 45px;}
body.allrewardsPg .whiteBox .nav-tabs a:hover {border-color: transparent;}
body.allrewardsPg .whiteBox .nav-tabs a.active {color: #053B70;border-bottom: 4px solid #0F68B6 !important;}
.rewardsContNew .rewardItem {-webkit-border-radius: 3px;border-radius: 3px;}
.rewardsContNew .rewardItem .head {background-color: #F7F7F7;border-bottom: 1px solid #D8D8D8;margin: -15px -15px 15px -15px;overflow: hidden;padding: 15px;}
.rewardsContNew .rewardItem .head p.orderDate {float: left;font-size:16px;color: #292B2D;margin-bottom: 0px;}
.rewardsContNew .rewardItem .head p.orderDate span {display: block;color: #0F68B6;margin-bottom: 10px;}
.rewardsContNew .rewardItem .head p.orderNo {float: right;font-size: 18px;color: #053B70;position: relative;top: 15px;}
.rewardsContNew .rewardItem .proName {margin-top: 10px; margin-bottom: 20px;}
.rewardsContNew .rewardItem .btnCont .btn {min-width: 170px;float: right;margin-left: 15px;}
body.allrewardsPg .whiteBox {width: 100%;padding: 30px 30px 60px 30px;}
.footer .cpyInfo {float: left;}
.footer .cpyInfo ul {padding: 0px;margin: 0px 0px 10px 0px;list-style: none;}
.footer .cpyInfo ul li {display: inline;margin-right: 15px;}
.footer .cpyInfo ul li a {color: #fff;}
body.allrewardsPg .footer {padding: 0px;text-align: left;padding: 50px 70px;background-color:#053B70; }
.footer .lang {float: right;}
.footer .lang select {color: #fff !important;border-color: #fff !important;-webkit-border-radius: 0;
border-radius: 0;height: 40px !important;padding: 5px 10px 6px 10px;background-color: #0b3b71;}
/* Media Qurries */

@media (min-width:320px) and (max-width:767px) and (orientation: portrait) {
    body.landingPg .whiteBox, body.claimrewardPg .whiteBox {width: 100%;padding: 15px;}
    body.allrewardsPg .whiteBox {width: 100%;padding: 15px;}
    .content {margin: 10px 15px;}
    .content .logo {margin-bottom: 15px;width: 250px;}
    .content h1 {margin-bottom: 20px;font-size: 30px;}
    body.landingPg .whiteBox .actionBtns .btn {min-width: 100%;}
    .tabsCont .nav {flex-wrap: nowrap;}
    .rewardItem .proName img {width: 75px;}
    .rewardItem .proName p span {margin-top: 0px;}
    .prodetails {margin-left: 30%;}
    .rewardItem .actionBtns .btn, .modal-body .btn {min-width: 100%;margin-bottom: 10px;}
    .stq form .form-group {width: 100%;}
    .stq h3 {font-size: 26px;}
    .whiteBox h4, .stq h4, .stq h5 {font-size: 20px;}
    #claimreward .modal-body, #declinereward .modal-body, #rewarddeclined .modal-body {text-align: center;padding: 50px 20px;}
    p br, h2 br, h3 br, h4 br, h5 br {display: none;}


}
@media (min-width:320px) and (max-width:767px) and (orientation: landscape) {
    body.landingPg .whiteBox, body.claimrewardPg .whiteBox {width: 100%;padding: 15px;}
    body.allrewardsPg .whiteBox {width: 100%;padding: 15px;}
    .content {margin: 10px 15px;}
    .content .logo {margin-bottom: 15px;width: 250px;}
    .content h1 {margin-bottom: 20px;font-size: 30px;}
    .tabsCont .nav {flex-wrap: nowrap;}
    .rewardItem .proName img {width: 75px;}
    .rewardItem .proName p span {margin-top: 0px;}
    .prodetails {margin-left: 16%;}
    .rewardItem .actionBtns .btn, .modal-body .btn {min-width: 45%;margin-bottom: 10px;float: none;}
    .stq form .form-group {width: 100%;}
    #claimreward .modal-body, #declinereward .modal-body, #rewarddeclined .modal-body {text-align: center;padding: 50px 20px;}
    .modal-dialog {max-width: 500px;}
    p br, h2 br, h3 br, h4 br, h5 br {display: none;}
}
@media (min-width:768px) and (max-width:1024px) and (orientation: portrait) {
    body.landingPg .whiteBox, body.claimrewardPg .whiteBox {width: 100%;padding: 15px;}
    body.allrewardsPg .whiteBox {width: 100%;padding: 15px;}
    .content {margin: 10px 15px;}
    .content .logo {margin-bottom: 15px;width: 250px;}
    .content h1 {margin-bottom: 20px;font-size: 30px;}
    .tabsCont .nav {flex-wrap: nowrap;}
    .rewardItem .proName img {width: 75px;}
    .rewardItem .proName p span {margin-top: 0px;}
    .prodetails {margin-left: 13.5%;}
    .rewardItem .actionBtns .btn, .modal-body .btn {min-width: 47%;margin-bottom: 10px;float: none;}
    .modal-body .btn {min-width: 60%;}
    .stq form .form-group {width: 100%;}
    #claimreward .modal-body, #declinereward .modal-body, #rewarddeclined .modal-body {text-align: center;padding: 50px 20px;}
    .modal-dialog {max-width: 500px;}
    p br, h2 br, h3 br, h4 br, h5 br {display: none;}
    .rewardItem .col-md-4, .rewardItem .col-md-1, .rewardItem .col-md-2, .rewardItem .col-md-6 {flex: 0 0 100%;max-width: 100%;}
}
@media (min-width:768px) and (max-width:1024px) and (orientation: landscape) {
.rewardItem .proName p {margin-left: 1opx;width: 55%;}
}

/* Phones Portrait */
@media (min-width:360px) and (max-width:400px) and (orientation: portrait) {

}
@media (min-width:401px) and (max-width:450px) and (orientation: portrait) {

}
@media (min-width:451px) and (max-width:500px) and (orientation: portrait) {

}

/* Tablets Lanscape */
@media (min-width:767px) and (max-width:800px) and (orientation: portrait) {

}

/* Desktop */
@media (min-width:1200px) and (max-width:1300px) and (orientation: landscape) {

}
@media (min-width:1301px) and (max-width:1400px) and (orientation: landscape) {

}
@media (min-width:1401px) and (max-width:1500px) and (orientation: landscape) {

}
@media (min-width:1501px) and (max-width:1600px) and (orientation: landscape) {

}
@media (min-width:1901px) and (orientation: landscape) {

}