/*------------------------------------Fonts-----------------------------------*/

@import url(https://fonts.googleapis.com/earlyaccess/opensanshebrew.css);
/*------------------------------------Fonts-----------------------------------*/
/*------------------------------------Reset-----------------------------------*/

html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
    display: block;
}

body {
    line-height: 1;
}

blockquote,
q {
    quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
    content: '';
    content: none;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

dl,
dt,
dd,
ol,
ul,
li {
    list-style: none;
    margin: 0;
}

.clear {
    clear: both;
}

a,
a:hover {
    text-decoration: none;
}
/*------------------------------------Reset-----------------------------------*/

body {
    width: 100%;
    background: #D6D6D6 url(../images/bg.png) no-repeat;
    background-repeat: repeat;
    font-size: 16px;
    color: #363636;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
    margin: 0;
    padding: 0;
}

body {
    overflow-x: hidden !important;
}

body #story * {
    direction: rtl;
}

.wrapper {
    margin: 0;
    padding: 0;
    position: relative;
}

.container {
    max-width: 1024px;
    margin: 0 auto;
    position: relative;
}

#canvas.pen {
    cursor: url(../images/pen_pointer.png), auto;
}

#canvas.eraserr {
    cursor: url(../images/eraser_pointer.png), auto;
}
/*img { max-width: 100%; }*/
/* all */

img {
    max-width: 100%;
    display: inline-block;
}

input::-webkit-input-placeholder {
    color: #999999;
    opacity: 1;
}

input::-moz-placeholder {
    color: #999999;
    opacity: 1;
}
/* firefox 19+ */

input:-ms-input-placeholder {
    color: #999999;
    opacity: 1;
}
/* ie */

input:-moz-placeholder {
    color: #999999;
    opacity: 1;
}

input[placeholder],
textarea[placeholder],
[placeholder],
*[placeholder] {
    color: #999999 !important;
}

* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

:before,
:after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

a,
input[type="submit"] {
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
}

.clearfix:before,
.clearfix:after {
    display: table;
    content: "";
}

.clearfix:after {
    clear: both;
}

.center-block {
    display: block;
    margin-right: auto;
    margin-left: auto;
}

.pull-right {
    float: right !important;
}

.pull-left {
    float: left !important;
}

html,
body {
    height: 100%;
    min-height: 100%;
}

#story {
    -webkit-transform-origin: 0px 0px;
    -ms-transform-origin: 0px 0px;
    transform-origin: 0px 0px;
    position: relative;
    overflow: hidden;
}

#stage {
    width: 100%;
    height: 100%;
    margin: 0 auto;
}
/*------------------------------------Reset End-----------------------------------*/
/*========================================header Start========================================*/

.bullet {
    position: absolute;
    right: 59px;
    bottom: -8px;
    z-index: 999999999;
}

.bullet ul li {
    width: 18px;
    height: 18px;
    float: right;
    margin-left: 8px;
}

.bullet ul li a {
    width: 100%;
    height: 100%;
    background: #808080;
    border: 1px solid #808080;
    display: inline-block;
}

.bullet ul li a.active,
.bullet ul li a:hover {
    background: #F17404;
}

.tools_logo {
    padding: 11px 0px 2px 0px;
}

.tools_logo .tools {
    float: left;
    width: 480px;
}

.right_tools {
    float: left;
}

.tools_logo .logo {
    float: right;
}

.right_tools {
    float: left;
    width: 79.7%;
    margin-bottom: 12px;
}

.tools_logo .colors {
    display: none;
    float: left;
    width: 312px;
    height: 57px;
    border: 3px solid #808080;
    position: relative;
    margin-top: 5px;
}

.tools_logo .colors ul li {
    width: 51px;
    height: 51px;
    float: left;
    border: 2px solid #f2f2f2;
}

.tools_logo .colors ul li a {
    width: 100%;
    height: 100%;
    display: block;
}

.tools_logo .colors ul li.pink {
    background: #ff5ddc;
}

.tools_logo .colors ul li.sky_blue {
    background: #1fb4f8;
}

.tools_logo .colors ul li.green {
    background: #3dfa44;
}

.tools_logo .colors ul li.greenyellow {
    background: #c2fa1d;
}

.tools_logo .colors ul li.orange {
    background: #fca900;
}

.tools_logo .colors ul li.violet {
    background: #785dff;
}

.tools_logo .colors:after {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 12px 0 12px 10px;
    border-color: transparent transparent transparent #F17404;
    margin: 13px 5px 13px 0px;
    cursor: pointer;
    content: "";
    display: block;
    position: absolute;
    left: -21px;
}

.tools_logo .tools ul li {
    float: left;
    width: 73px;
    height: 62px;
    border: 2px solid #9a9a9a;
    margin-right: 8px;
}

.tools_logo .tools ul li:last-child {
    margin-right: 0;
}

.tools_logo .tools ul li a {
    width: 100%;
    height: 100%;
    display: inline-block;
}

.tools_logo .tools ul li.printer a {
    background: url(../images/print.png) no-repeat;
    background-position: center center;
}

.tools_logo .tools ul li.certificate a {
    background: url(../images/note2.png) no-repeat;
    background-position: center center;
}

.tools_logo .tools ul li.global a {
    background: url(../images/global.png) no-repeat;
    background-position: center center;
}

.tools_logo .tools ul li.nots a {
    background: url(../images/note.png) no-repeat;
    background-position: center center;
}

.tools_logo .tools ul li.eraser a {
    background: url(../images/eraser.png) no-repeat;
    background-position: center center;
}

.tools_logo .tools ul li.pencil a {
    background: url(../images/pencil.png) no-repeat;
    background-position: center center;
}

.tools_logo .tools ul li.printer a:hover,
.tools_logo .tools ul li.printer.selected a {
    background: #FFB101 url(../images/print_hover.png) no-repeat;
    background-position: center center;
}

.tools_logo .tools ul li.certificate a:hover,
.tools_logo .tools ul li.certificate.selected a {
    background: #1DA8CC url(../images/note2_hover.png) no-repeat;
    background-position: center center;
}

.tools_logo .tools ul li.global a:hover,
.tools_logo .tools ul li.global.selected a {
    background: #F17404 url(../images/global_hover.png) no-repeat;
    background-position: center center;
}

.tools_logo .tools ul li.nots a:hover,
.tools_logo .tools ul li.nots.selected a {
    background: #FFB101 url(../images/note_hover.png) no-repeat;
    background-position: center center;
}

.tools_logo .tools ul li.eraser a:hover,
.tools_logo .tools ul li.eraser.selected a {
    background: #1DA8CC url(../images/eraser_hover.png) no-repeat;
    background-position: center center;
}

.tools_logo .tools ul li.pencil a:hover,
.tools_logo .tools ul li.pencil.selected a {
    background: #F17404 url(../images/pencil_hover.png) no-repeat;
    background-position: center center;
}

.tools_logo .tools ul li.pencil.change_bg a {
    background: #F17404 url(../images/pencil_hover.png) no-repeat;
    background-position: center center;
}

.tools_logo .tools ul li.nots {
    position: relative;
}

.tools_logo .tools ul li.nots.showarrow:after {
    display: block;
}

.left_area {
    width: 79.7%;
    float: left;
    position: relative;
}

.right_area {
    width: 17.7%;
    float: right;
}

.deshbord {
    width: 100%;
}

.deshbord .deshbordimg {
    position: relative;
    /*position:absolute; top:0; left:0;*/
    
    z-index: -2;
}

.deshbord .deshbordimg .bg_img.border {
    border: 1px solid #808080;
}

.deshbord .deshbordimg .bg_img img {
    width: 100%;
    display: block;
}

.deshbord .deshbordimg .bg_white {
    width: 100%;
    min-height: 585px;
    display: block;
    background: #FFF;
    border: 1px solid #808080;
}

.deshbord .deshbordimg .map_img {
    position: absolute;
    top: 20px;
    left: 27px;
}

.deshbord .deshbordimg .map_img span {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    font-size: 28px;
    color: #25408E;
    line-height: 35px;
    display: inline-block;
    position: absolute;
    top: 5px;
    left: 0;
    right: 0;
    text-align: center;
}

.deshbord .deshbordimg .beach_imgs {
    position: absolute;
    top: 122px;
    right: 25px;
}

.deshbord .deshbordimg .beach_imgs .keep {
    font-size: 30px;
    color: #25408E;
    line-height: 35px;
    position: absolute;
    top: 192px;
    left: 127px;
    display: inline-block;
    text-align: center;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
}

.deshbord .deshbordimg .teacher_info {
    position: absolute;
    top: 15px;
    left: 36px;
}

.deshbord .deshbordimg .vedio_inner {
    width: 540px;
    margin: 0 auto;
}

.deshbord .deshbordimg .vedio_controls {
    position: absolute;
    top: 40px;
    left: 0;
    right: 0;
    margin: auto;
    width: 620px;
}

.deshbord .deshbordimg .vedio {
    width: 100%;
    height: 303px;
    border: 2px solid #666666;
}

.post_news {
    margin: 28px 48px 29px 40px;
    text-align: center;
}

.post_news a {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    width: 192px;
    height: 56px;
    background: #25BECE;
    border: 1px solid #808080;
    font-size: 20px;
    color: #FFFFFF;
    font-weight: bold;
    line-height: 20px;
    display: inline-block;
}

.post_news .posting_btn {
    float: left;
    padding-top: 16px;
}

.post_news .news_btn {
    float: right;
    padding-top: 4px;
}

.problem {
    width: 100%;
    text-align: center;
    width: 100%;
    height: 65px;
    background: #E10079;
    border: 1px solid #808080;
    display: block;
    padding-top: 19px;
}

.problem span {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    font-size: 30px;
    color: #FFFFFF;
    line-height: 26px;
    padding-top: 17px;
}

.problem2 span {
    line-height: 23px;
}

.answer {
    width: 100%;
    text-align: center;
    height: 65px;
    background: #fff;
    border: 4px solid #E10079;
}

.answer span {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    font-size: 21px;
    color: #E10079;
    line-height: 28px;
    padding-top: 17px;
}

.answer1 span {
    line-height: 52px;
}

.answer3 span {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
    font-size: 19px;
    color: #000;
    line-height: 18px;
}

.cliffs {
    width: 100%;
    padding: 14px 25px 80px 63px;
    position: absolute;
    top: 0;
    left: 0;
}

.cliffs p {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
    font-size: 24px;
    color: #000000;
    line-height: 35px;
}

a.link {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
    color: #132269;
    text-decoration: underline;
}

.cliffs h1 {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    font-size: 27px;
    color: #E10079;
    line-height: 32px;
    margin: 33px 0px 4px 0px;
}

.cliffs2 {
    padding: 20px 25px 0px 42px;
}

.cliffs2 h1:first-child {
    margin-top: 0;
}

.cliffs2 p {
    font-size: 26px;
    line-height: 30px;
}

.cliffs3 {
    padding: 35px 25px 0px 48px;
}

.cliffs3 p {
    font-size: 31px;
    line-height: 36px;
}

.cliffs3 .map_site {
    margin-top: 0;
}

.cliffs4 {
    padding: 35px 25px 40px 44px;
}

.cliffs4 .contant {
    width: 440px;
    float: left;
    position: absolute;
    right: 247px;
}

.cliffs4 p {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
    font-size: 36px;
    line-height: 37px;
    padding-bottom: 23px;
}

.deshbord .deshbordimg .childdeshbord {
    position: absolute;
    top: 32px;
    right: 30px;
    z-index: 2;
}

.deshbord .deshbordimg .childdeshbord .btns {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 3;
}

.deshbord .deshbordimg .childdeshbord .btns li {
    position: absolute;
    z-index: 2;
}

.deshbord .deshbordimg .childdeshbord .btns li a {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    width: 134px;
    height: 33px;
    display: inline-block;
    text-align: center;
    background: #25BECE;
    border: 1px solid #808080;
    font-size: 23px;
    color: #000;
    line-height: 29px;
}

.deshbord .deshbordimg .childdeshbord .btns li.bt1 {
    top: 13px;
    right: 11px;
}

.deshbord .deshbordimg .childdeshbord .btns li.bt2 {
    top: 98px;
    right: 28px;
}

.deshbord .deshbordimg .childdeshbord .btns li.bt3 {
    top: 144px;
    right: 33px;
}

.deshbord .deshbordimg .childdeshbord .btns li.bt4 {
    top: 217px;
    right: 47px;
}

.deshbord .deshbordimg .childdeshbord .btns li.bt5 {
    top: 258px;
    right: 47px;
}

.deshbord .deshbordimg .childdeshbord .btns li.bt6 {
    top: 316px;
    right: 20px;
}

.deshbord .deshbordimg .childdeshbord .btns li.bt7 {
    top: 362px;
    right: 35px;
}

.deshbord .deshbordimg .childdeshbord .btns li.bt8 {
    top: 405px;
    right: 55px;
}

.deshbord .deshbordimg .childdeshbord .green_stk {
    display: none;
    position: absolute;
    top: 4px;
    right: 18px;
    z-index: 4;
}

.deshbord .deshbordimg .childdeshbord .pink_stk {
    display: none;
    position: absolute;
    top: 314px;
    right: 65px;
    ;
    z-index: 4;
}

.trial p {
    width: 305px;
    float: right;
    padding-bottom: 22px
}

.trial a {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
    width: 102px;
    height: 34px;
    border: 1px solid #808080;
    float: left;
    display: inline-block;
    text-align: center;
    color: #fff;
    font-size: 27px;
    line-height: 27px;
    margin-top: 23px;
}

.trial a.pink {
    background: #FF5DDC;
}

.trial a.green {
    background: #3DFA44;
}

.cliffs5 {
    padding: 20px 35px 28px 27px;
}

.cliffs6 {
    padding: 22px 23px 0px 40px;
}

.cliffs7 {
    padding: 22px 23px 0px 40px;
}

.cliffs7 h1 {
    font-size: 39px;
    color: #E10079;
    margin: 0 0 0px 0;
}

.cliffs7 p {
    font-size: 27px;
    color: #000000;
    line-height: 33px;
}

.cliffs7 .title_box {
    background: #E10079;
    border: 1px solid #808080;
    text-align: center;
    padding: 25px 34px 65px 23px;
    margin-top: 25px;
}

.cliffs7 .title_box span {
    font-size: 39px;
    color: #FFFFFF;
    line-height: 43px;
}

.cliffs8 {
    padding: 22px 23px 0px 40px;
}

.cliffs8 h1 {
    font-size: 36px;
    color: #E10079;
    line-height: 36px;
    margin: 0 0 5px 0;
}

.cliffs8 p {
    font-size: 36px;
    color: #000000;
    line-height: 36px;
}

.cliffs8 .title_box {
    background: #E10079;
    border: 1px solid #808080;
    text-align: center;
    padding: 25px 34px 65px 23px;
    margin-top: 25px;
}

.cliffs8 .map_site {
    position: absolute;
    top: 369px;
    right: 177px;
}

.cliffs8 .map_site a.map_btn {
    padding-top: 6px;
}

.cliffs8 .title_box span {
    font-size: 39px;
    color: #FFFFFF;
    line-height: 43px;
}

.cliffs9 {
    padding: 15px 40px 0 114px;
}

.cliffs9 .right_text {
    float: right;
    width: 318px;
}

.cliffs9 .left_img {
    float: left;
    width: 172px;
    margin-top: 5px;
}

.cliffs9 .right_text .text_box {
    width: 317px;
    height: 157px;
    background: #E10079;
    border: 1px solid #808080;
    text-align: center;
    padding-top: 45px;
    margin-bottom: 24px;
}

.cliffs9 .right_text .text_box span {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
    font-size: 26px;
    color: #FFFFFF;
    line-height: 30px;
}

.cliffs10 {
    padding: 16px 24px 0px 36px;
}

.cliffs10 p {
    font-size: 34px;
    color: #000000;
    line-height: 36px;
}

.cliffs10 .emphasize .character {
    float: right;
    width: 159px;
    margin-top: 10px;
}

.cliffs10 .emphasize .left_content {
    float: right;
    width: 469px;
    margin-top: 35px;
    margin-right: 20px;
}

.cliffs10 .emphasize .left_content .head_title {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    float: right;
    font-size: 34px;
    color: #000000;
}

.cliffs10 .title_box {
    background: #E10079;
    border: 1px solid #808080;
    text-align: center;
    padding: 55px 45px 75px 42px;
    margin-top: 25px;
}

.cliffs10 .title_box span {
    font-size: 34px;
    color: #FFFFFF;
    line-height: 38px;
}

.cliffs11 {
    padding: 27px 60px 0 60px;
}

.cliffs11 h2 {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    font-size: 32px;
    color: #E10079;
    line-height: 32px;
}

.cliffs11 .title_box {
    width: 325px;
    height: 180px;
    background: #E10079;
    border: 1px solid #808080;
    text-align: center;
    padding: 40px 34px 27px 23px;
}

.cliffs11 .title_box span {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
    font-size: 31px;
    color: #FFFFFF;
    line-height: 38px;
}

.cliffs11 .beach_changes {
    margin: 25px 0px 48px 0px;
}

.cliffs12 h2 {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    font-size: 29px;
    color: #E10079;
    line-height: 45px;
}

.cliffs12 h2:first-child {
    margin-bottom: 15px;
}

.cliffs12 p {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
    font-size: 25px;
    color: #000000;
    line-height: 40px;
}

.cliffs12 .btn1 p {}

.cliffs12 .btn a {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
    width: 102px;
    height: 34px;
    border: 1px solid #808080;
    color: #fff;
    font-size: 27px;
    line-height: 25px;
    text-align: center;
    display: inline-block;
    margin: 2px 13px 0 0;
}

.cliffs12 .btn3 p {
    line-height: 29px;
}

.cliffs12 .btn1 a {
    background: #C2FA1D;
}

.cliffs12 .btn2 a {
    background: #FF5DDC;
}

.cliffs12 .btn3 a {
    background: #1FB4F8;
}

.cliffs12 .btn4 a {
    background: #3DFA44;
}

.cliffs19 {
    padding: 35px 20px 0px 43px;
}

.cliffs19 h1 {
    font-size: 36px;
    color: #E10079;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    margin: 0 0 35px 0;
}

.cliffs19 p {
    font-size: 27px;
    color: #000000;
    line-height: 34px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
}

.cliffs19 p.padding {
    padding: 35px 0;
}

.cliffs20 h1 {
    font-size: 35px;
    color: #E10079;
    line-height: 35px;
    margin: 0px 0px 22px 0px;
}

.cliffs20 p {
    font-size: 27px;
    color: #000l000;
    line-height: 34px;
}

.cliffs20 .plight {
    margin-top: 27px;
}

.cliffs20 .map_site {
    width: 405px;
    margin-top: 15px;
    margin-bottom: 28px;
}

.cliffs20 .map_site a {
    height: 68px;
    line-height: 25px;
}

.cliffs20 .map_site a.map_btn {
    padding-top: 6px;
}

.cliffs21 {
    padding: 20px;
}

.cliffs21 h1 {
    font-size: 36px;
    color: #E10079;
    line-height: 36px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    margin: 0 0px 25px 0;
}

.cliffs21 .continue_assignment {
    width: 378px;
    float: right;
}

.cliffs21 .map_img2 {
    float: left;
}

.cliffs21 .padding2 {
    padding: 30px 0px 22px 0px;
}

.cliffs21 .links_example a {
    width: 180px;
    height: 67px;
    background: #25BECE;
    border: 1px solid #808080;
    display: inline-block;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    font-size: 18px;
    color: #FFFFFF;
    line-height: 19px;
    text-align: center;
    padding-top: 6px;
}

.cliffs21 .top_btns {
    margin-bottom: 15px;
}

.cliffs22 {
    padding: 27px 30px 0px 30px;
}

.cliffs22 h1 {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    font-size: 36px;
    color: #E10079;
    line-height: 36px;
    margin: 0 0 22px 0;
}

.cliffs22 h3 {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    font-size: 27px;
    color: #E10079;
    line-height: 27px;
    margin: 32px 45px 0 0;
}

.cliffs22 .beach_img2 {
    position: absolute;
    top: 234px;
    right: 30px;
}

.attachedfile_question {
    padding-top: 25px;
}

.attachedfile_question .title_box {
    float: right;
    width: 445px;
    height: 172px;
    background: #E10079;
    border: 1px solid #808080;
    padding: 35px 45px 0 45px;
    text-align: center;
}

.attachedfile_question .title_box span {
    font-size: 29px;
    color: #FFFFFF;
    line-height: 36px;
}

.attachedfile_question .attached_files {
    float: left;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    width: 145px;
    height: 37px;
    font-size: 22px;
    color: #FFFFFF;
    line-height: 28px;
    background: #25BECE;
    border: 1px solid #808080;
    display: inline-block;
    text-align: center;
    margin: 231px 0 0 58px;
}

.center {
    text-align: center;
}

.cliffs6 h1 {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    font-size: 39px;
    color: #E10079;
    line-height: 39px;
    margin: 0 0 5px 0;
}

.cliffs6 p {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
    font-size: 36px;
    color: #000000;
    line-height: 45px;
}

.cliffs6 .title_box {
    background: #E10079;
    border: 1px solid #808080;
    text-align: center;
    padding: 30px 34px 27px 23px;
    margin-top: 25px;
}

.cliffs6 .title_box span {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
    font-size: 39px;
    color: #FFFFFF;
    line-height: 43px;
}

a.trial {
    width: 102px;
    height: 34px;
    background: #3DFA44;
    border: 1px solid #808080;
    font-size: 27px;
    color: #FFFFFF;
    line-height: 27px;
    display: inline-block;
    text-align: center;
    padding-top: 0px;
    margin: 18px 33px 0px 0px;
}

.cliffs6 .map_site {
    width: 192px;
    margin: 0 auto;
    margin-top: 12px;
    position: absolute;
    top: 502px;
    right: 38%;
}

.title2 {
    text-align: center;
}

.title2 h1 {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
    font-size: 29px;
    color: #E10079;
    line-height: 29px;
    padding: 0;
    margin: 0;
}

.title2 h2 {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
    font-size: 29px;
    color: #000000;
    line-height: 43px;
    padding-bottom: 40px;
}

.beach_deatils {
    width: 585px;
    height: 182px;
    background: #E10079;
    border: 1px solid #808080;
    padding: 17px 30px 17px 45px;
}

.beach_deatils .right_box {
    float: right;
    width: 245px;
    text-align: center;
}

.beach_deatils .left_box {
    float: left;
    width: 223px;
}

.beach_deatils .right_box span {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
    font-size: 29px;
    color: #FFFFFF;
    line-height: 35px;
}

.beaches {
    width: 260px;
    height: 150px;
    background: #E10079;
    border: 1px solid #808080;
    text-align: center;
    padding: 17px;
    float: left;
    margin: 30px 0px 0px 13px;
}

.answer2 {
    width: 260px;
    height: 150px;
    background: #fff;
    text-align: center;
    padding: 17px;
    float: left;
    margin: 30px 0px 0px 13px;
    padding-top: 4px;
}

.answer2 span {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
    font-size: 25px;
    color: #000000;
    line-height: 26px;
}

.answer4 {
    width: 585px;
    height: 182px;
    background: #fff;
    padding-right: 6px;
}

.answer4 .right_content {
    width: 360px;
    float: right;
    padding-top: 5px;
}

.answer4 .right_content span {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
    font-size: 20px;
    color: #000000;
    line-height: 23px;
    text-align: right;
}

.beaches span {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
    font-size: 27px;
    color: #FFFFFF;
    line-height: 30px;
}

.answer4 .left_imag {
    width: 211px;
    float: left;
    text-align: center;
    margin-top: 18px;
}

.answer4 .left_imag span {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    font-size: 17px;
    color: #000000;
    line-height: 20px;
}

.box_margin {
    width: 639px;
    position: absolute;
    top: 314px;
}

.beach_deatils2 {
    padding: 15px 0px 15px 0px;
    text-align: center;
}

.beach_deatils2 p {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
    font-size: 25px;
    color: #000000;
    line-height: 30px;
}

.beach_deatils3 .detail_box {
    float: right;
    width: 390px;
    height: 138px;
    background: #E10079;
    border: 1px solid #808080;
    padding: 33px 20px 0px 20px;
    text-align: center;
}

.beach_deatils3 .detail_box span {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
    font-size: 29px;
    color: #FFFFFF;
    line-height: 29px;
}

.beach_deatils3 .cool_site {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    float: left;
    width: 192px;
    height: 55px;
    font-size: 20px;
    color: #fff;
    line-height: 20px;
    background: #25BECE;
    border: 1px solid #808080;
    display: block;
    text-align: center;
    vertical-align: middle;
    padding-top: 6px;
    margin-top: 70px;
}

.answer5 {
    float: right;
    width: 390px;
    height: 138px;
    background: #fff;
    padding-top: 22px;
}

.answer5 span {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
    font-size: 26px;
    color: #000000;
    line-height: 26px;
}

.answer6 {
    width: 100%;
    height: 185px;
    background: #fff;
    margin-top: 28px;
}

.answer6 ol li {
    list-style: decimal;
    margin-right: 43px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
    text-align: right;
    font-size: 22px;
    color: #000000;
    line-height: 28px;
}

.answer7 {
    width: 100%;
    height: 174px;
    background: #fff;
    margin-top: 28px;
    padding: 10px 20px 0px 20px;
}

.answer7 ol li {
    list-style: decimal;
    margin-right: 43px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
    text-align: right;
    font-size: 30px;
    color: #000000;
    line-height: 28px;
}

.answer8 {
    width: 100%;
    height: 174px;
    background: #fff;
    margin-top: 28px;
    padding: 10px 20px 0px 20px;
}

.answer8 ol li {
    list-style: decimal;
    margin-right: 43px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
    text-align: right;
    font-size: 30px;
    color: #000000;
    line-height: 28px;
}

.answer9 {
    width: 317px;
    height: 157px;
    background: #fff;
    text-align: center;
}

.answer9 span {
    font-size: 26px;
    color: #000000;
    line-height: 30px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
}

.answer10 {
    width: 469px;
    height: 206px;
    background: #fff;
    padding: 5px 5px 3px 10px;
    text-align: right;
}

.answer10 span {
    font-size: 23px;
    color: #000000;
    line-height: 27px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
}

.card__back4 {
    top: 27px;
}

.answer11 {
    width: 325px;
    height: 180px;
    background: #fff;
    padding: 13px;
}

.answer11 span {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
    font-size: 26px;
    color: #000000;
}

.answer12 {
    width: 445px;
    height: 172px;
    background: #fff;
    padding: 13px;
    text-align: right;
}

.answer12 span {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 20px;
    color: #000000;
}

.card__front2 {
    top: 190px;
}

.card__back2 {
    top: 190px;
}

.card__front3 {
    top: 385px;
}

.card__back3 {
    top: 385px;
}

.card__back3 span {
    display: block;
    padding-top: 40px;
}

.vedio_controls2 .title {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
    font-size: 33px;
    color: #000000;
    line-height: 33px;
    text-align: center;
    padding-bottom: 27px;
}

.vedio_controls2 .vedio {
    margin-bottom: 20px;
}

.problem2 a {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
    height: 95px;
    padding-top: 35px;
}

.map_site {
    width: 450px;
    margin: 0 auto;
    margin-top: 40px;
}

.map_site a.map_btn {
    float: right;
    padding-top: 16px;
}

.map_site a.cool_site {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    float: left;
    padding-top: 6px;
}

.map_site a {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    width: 192px;
    height: 55px;
    font-size: 20px;
    color: #fff;
    line-height: 20px;
    background: #25BECE;
    border: 1px solid #808080;
    display: block;
    text-align: center;
    vertical-align: middle;
}

.note {
    width: 100%;
    height: 88px;
    background: #717ebb;
    padding: 12px 17px 12px 14px;
    margin-bottom: 13px;
    text-align: center;
}

.note h2 {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    font-size: 28px;
    color: #000;
    padding-bottom: 2px;
}

.note h5 {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    font-size: 13px;
    color: #000;
    padding: 3px 0px 7px 0px;
}

.note h3 {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
    font-size: 15px;
    color: #000;
}

.side_nav ul li {
    width: 100%;
    height: 39px;
    text-align: center;
    vertical-align: middle;
    border: 3px solid #1DA8CC;
    margin-bottom: 4px;
}

.side_nav ul li.yello {
    border: 3px solid #ffb101;
}

.side_nav ul li.green {
    border: 3px solid #05b138;
}

.side_nav ul li.blue {
    border: 3px solid #1DA8CC;
}

.side_nav ul li a {
    width: 100%;
    height: 100%;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    font-size: 16px;
    color: #808080;
    line-height: 16px;
    padding-top: 9px;
    display: block;
    position: relative;
}

.side_nav ul li.yello a:hover,
.side_nav ul li.yello a.active {
    background: #ffb101;
    color: #fff;
}

.side_nav ul li.green a:hover,
.side_nav ul li.green a.active {
    background: #05b138;
    color: #fff;
}

.side_nav ul li.blue a:hover,
.side_nav ul li.blue a.active {
    background: #1DA8CC;
    color: #fff;
}

.side_nav ul li a:hover:after,
.side_nav ul li a.active:after {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 15px 13px 15px 0;
    content: "";
    display: block;
    position: absolute;
    top: 2px;
    left: -19px;
    z-index: 999999;
}

.side_nav ul li.yello a:after,
.side_nav ul li.yello a.active:after {
    border-color: transparent #ffb101 transparent transparent;
}

.side_nav ul li.green a:after,
.side_nav ul li.green a.active:after {
    border-color: transparent #05b138 transparent transparent;
}

.side_nav ul li.blue a:after,
.side_nav ul li.blue a.active:after {
    border-color: transparent #1DA8CC transparent transparent;
}

.top_to {
    width: 23px;
    text-align: center;
    margin-top: 9px;
    display: block !important;
}

.top_to a {
    display: block;
}

.top_to a i {
    width: 26px;
    height: 26px;
    background: url(../images/close_arrow.png) no-repeat;
    display: inline-block;
}

.top_to a span {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    color: #F17404;
    font-size: 11px;
    line-height: 11px;
    ;
    display: inline-block;
}

.top_to_bottom.top_to i {
    width: 26px;
    height: 26px;
    background: url(../images/open_arrow.png) no-repeat;
    display: inline-block;
}

.info {
    margin-top: 40px;
    position: absolute;
    bottom: 0;
}

.deshbord2 .info {
    margin-top: 0;
    position: absolute;
    bottom: auto;
}

.info ul li {
    float: left;
    text-align: center;
    padding: 0px 16px;
}

.info ul li:first-child {
    padding-left: 11px;
}

.info ul li:last-child {
    padding-right: 0;
}

.info ul li a span {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    font-size: 10px;
    color: #F17404;
    line-height: 11px;
    display: inline-block;
}

.info ul li a i.icon {
    display: block;
    padding-bottom: 40px;
}

.info ul li a i.icon1 {
    width: 40px;
    height: 33px;
    background: url(../images/Information_teacher.png) no-repeat;
    background-position: center center;
}

.info ul li a i.icon2 {
    width: 49px;
    height: 33px;
    background: url(../images/chapters_school.png) no-repeat;
    background-position: center center;
}

.info ul li a i.icon3 {
    width: 28px;
    height: 33px;
    background: url(../images/exchange_school.png) no-repeat;
    background-position: center center;
}

.info ul li.midalteacher {
    position: relative;
}

.midalteacher_show {
    display: none;
    position: relative;
    text-align: right;
    width: 817px;
    min-height: 100px;
    border: 1px solid #666666;
    padding: 10px 62px 10px 13px;
    position: absolute;
    top: -17px;
    right: 82px;
    z-index: 9999999999;
    background: #fff url(../images/Information_teacher2.png) no-repeat;
    background-position: right 12px;
}

.midalteacher_show p {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
    font-size: 18px;
    color: #666666;
    line-height: 20px;
}

.midalteacher_show:after {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 15px 13px 15px 0;
    border-color: transparent #F17404 transparent transparent;
    content: "";
    display: block;
    position: absolute;
    top: 22px;
    right: -23px;
}

.leftright_arrow .left_arrow {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 41px 0 0 41px;
    border-color: transparent transparent transparent #808080;
    position: absolute;
    left: 0;
    bottom: 0px;
    z-index: 999999999;
}

.leftright_arrow .left_arrow:after {
    width: 13px;
    height: 13px;
    background: url(../images/left_arrow.png) no-repeat;
    background-position: center center;
    position: absolute;
    top: -18px;
    left: -35px;
    content: "";
    display: block;
}

.leftright_arrow .right_arrow {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 0 41px 41px;
    border-color: transparent transparent #808080 transparent;
    position: absolute;
    right: 0;
    bottom: 0px;
    z-index: 999999999;
}

.leftright_arrow .right_arrow:after {
    width: 13px;
    height: 13px;
    background: url(../images/right_arrow.png) no-repeat;
    background-position: center center;
    position: absolute;
    top: 23px;
    left: -18px;
    content: "";
    display: block;
}

#content {
    width: 100%;
    height: 100%;
    position: absolute;
}

#canvas {
    position: relative;
    opacity: 0.6;
    filter: Alpha(opacity=60);
}

.textarea_field {
    display: none;
    width: 212px;
    height: 100px;
    border: 1px solid #ccc;
    background: #fff;
    position: absolute;
    top: 75px;
    left: -77px;
    z-index: 999999999;
    text-align: center;
}

textarea {
    width: 100%;
    height: 100%;
    font-size: 15px;
    color: #000;
    resize: none;
    border: 3px solid #FFB101;
    ;
    outline: none;
    padding: 10px;
}

.textarea_field:after {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 12px 11.5px 0 11.5px;
    border-color: #FFB101 transparent transparent transparent;
    content: "";
    position: absolute;
    TOP: -18px;
    left: 100px;
}

.time_line {
    position: relative;
    width: 100%;
    height: 6px;
    background: #666666;
    border-radius: 12px;
    position: absolute;
    bottom: -20px;
    left: 0;
}

.time_line .time_set {
    position: absolute;
    top: 13px;
    left: 170px;
    text-align: center;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 21.5px 22px 21.5px;
    border-color: transparent transparent #666666 transparent;
}

.time_line .time_set span {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
    width: 35px;
    font-size: 13px;
    color: #FFFFFF;
    line-height: 28px;
    margin: 0 auto;
    display: block;
    position: absolute;
    left: -17px;
}

.web_link {
    width: 298px;
    position: absolute;
    right: 23px;
    bottom: 21px;
}

.web_link span {
    font-size: 16px;
    color: #666666;
    line-height: 16px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    display: inline-block;
}

.web_link a {
    font-size: 14px;
    color: #1DA8CC;
    line-height: 14px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
    text-decoration: underline;
    display: inline-block;
}

.cliffs23 {
    padding: 33px 25px 80px 63px;
}

.picture {
    text-align: center;
}

.rightalign {
    text-align: right;
}

.leftalign {
    text-align: left;
}

.options {
    max-width: 506px;
    width: 100%;
    margin: 0 auto;
}

.options2 {
    position: absolute;
    top: 274px;
    right: 118px;
}

.options3 {
    position: absolute;
    top: 281px;
    right: 196px;
}

.options h2 {
    font-size: 25px;
    color: #05B138;
    line-height: 25px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    margin: 14px 13px 17px 0px;
}

.cliffs28 {
    padding: 40px 25px 80px 63px;
}

.cliffs28 .picture {
    max-width: 219px;
    width: 100%;
    float: right;
    text-align: right;
}

.cliffs28 .options {
    max-width: 495px;
    width: 100%;
    float: left;
}

.cliffs28 .options h2 {
    margin: 58px 11px 70px 0px;
}

.cliffs29 {
    padding: 22px 58px 0px 54px;
}

.cliffs29 .options {
    max-width: inherit;
    width: 100%;
    position: absolute;
    top: 275px;
    right: 98px;
}

input[type=checkbox].css-checkbox {
    position: absolute;
    overflow: hidden;
    clip: rect(0 0 0 0);
    height: 1px;
    width: 1px;
    margin: -1px;
    padding: 0;
    border: 0;
}

input[type=checkbox].css-checkbox + label.css-label,
input[type=checkbox].css-checkbox + label.css-label.clr {
    background-repeat: no-repeat;
    background-position: right 27px;
    padding-right: 65px;
    height: 62px;
    display: inline-block;
    line-height: 87px;
    font-size: 21px;
    color: #000;
    vertical-align: middle;
    cursor: pointer;
}

input[type=checkbox].css-checkbox:checked + label.css-label,
input[type=checkbox].css-checkbox + label.css-label.chk {
    background-position: right -337px;
}

label.css-label {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.currect label.css-label {
    background-image: url(../images/currect_checkbox.png);
}

.wrong label.css-label {
    background-image: url(../images/wrong_checkbox.png);
}

.popupwrap {
    display: none;
}

.popup {
    width: 567px;
    position: fixed;
    top: 96px;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    z-index: 9999999999;
}

.popup_bg {
    background: #7682bc;
    /* Old browsers */
    
    background: -moz-linear-gradient(top, #7682bc 0%, #b4bbda 12%, #dadded 25%, #dde0ef 33%, #e5e7f2 43%, #ffffff 90%, #ffffff 100%);
    /* FF3.6+ */
    
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #7682bc), color-stop(12%, #b4bbda), color-stop(25%, #dadded), color-stop(33%, #dde0ef), color-stop(43%, #e5e7f2), color-stop(90%, #ffffff), color-stop(100%, #ffffff));
    /* Chrome,Safari4+ */
    
    background: -webkit-linear-gradient(top, #7682bc 0%, #b4bbda 12%, #dadded 25%, #dde0ef 33%, #e5e7f2 43%, #ffffff 90%, #ffffff 100%);
    /* Chrome10+,Safari5.1+ */
    
    background: -o-linear-gradient(top, #7682bc 0%, #b4bbda 12%, #dadded 25%, #dde0ef 33%, #e5e7f2 43%, #ffffff 90%, #ffffff 100%);
    /* Opera 11.10+ */
    
    background: -ms-linear-gradient(top, #7682bc 0%, #b4bbda 12%, #dadded 25%, #dde0ef 33%, #e5e7f2 43%, #ffffff 90%, #ffffff 100%);
    /* IE10+ */
    
    background: linear-gradient(to bottom, #7682bc 0%, #b4bbda 12%, #dadded 25%, #dde0ef 33%, #e5e7f2 43%, #ffffff 90%, #ffffff 100%);
    /* W3C */
    
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#7682bc', endColorstr='#ffffff', GradientType=0);
    border-left: 2px solid #717EBB;
    border-bottom: 2px solid #717EBB;
    border-right: 2px solid #717EBB;
    padding: 10px 19px 23px 32px;
    width: 100%;
    position: relative;
    overflow-y: auto;
}

.popup span.close_btn {
    width: 16px;
    height: 16px;
    background: url(../images/close_btn.png) no-repeat;
    position: absolute;
    top: 12px;
    left: 9px;
    cursor: pointer;
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
}

.popup span.close_btn:hover {
    opacity: 0.4;
    filter: alpha(opacity=40);
}

.popup h2 {
    font-size: 22px;
    color: #000000;
    line-height: 22px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    padding-bottom: 5px;
}

.popup p {
    font-size: 20px;
    color: #000000;
    line-height: 22px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
}

.popup .beach_images {
    width: 442px;
    margin: 0 auto;
    margin-top: 25px;
    margin-bottom: 45px;
}

.popup .beach_images img {
    height: 122px;
    border: 1px solid #717EBB;
}

.popup .beach_images span {
    font-size: 22px;
    color: #000000;
    line-height: 22px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
}

.popup .beach_images .right_img {
    width: 219px;
    float: right;
    text-align: center;
}

.popup .beach_images .left_img {
    width: 219px;
    float: left;
    text-align: center;
}

.popup .pop_map {
    max-width: 449px;
    margin: 0 auto;
    margin-top: 12px;
}

.popupwrap6 {
    text-align: center;
}

.popupwrap6 .popup_bg {
    background: #9cd8d6;
    /* Old browsers */
    
    background: -moz-linear-gradient(top, #9cd8d6 0%, #b9e3e2 11%, #e3f4f3 27%, #ffffff 100%);
    /* FF3.6+ */
    
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #9cd8d6), color-stop(11%, #b9e3e2), color-stop(27%, #e3f4f3), color-stop(100%, #ffffff));
    /* Chrome,Safari4+ */
    
    background: -webkit-linear-gradient(top, #9cd8d6 0%, #b9e3e2 11%, #e3f4f3 27%, #ffffff 100%);
    /* Chrome10+,Safari5.1+ */
    
    background: -o-linear-gradient(top, #9cd8d6 0%, #b9e3e2 11%, #e3f4f3 27%, #ffffff 100%);
    /* Opera 11.10+ */
    
    background: -ms-linear-gradient(top, #9cd8d6 0%, #b9e3e2 11%, #e3f4f3 27%, #ffffff 100%);
    /* IE10+ */
    
    background: linear-gradient(to bottom, #9cd8d6 0%, #b9e3e2 11%, #e3f4f3 27%, #ffffff 100%);
    /* W3C */
    
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#9cd8d6', endColorstr='#ffffff', GradientType=0);
    border-left: 2px solid #93D4D2;
    border-bottom: 2px solid #93D4D2;
    border-right: 2px solid #93D4D2;
    padding: 15px 0px 20px 0px;
}

.popupwrap6 .popup_bg h2 {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    font-size: 26px;
    color: #000;
    line-height: 26px;
    padding-bottom: 15px;
}

.popup2 {
    width: 320px;
    text-align: center;
}

.popup2 .popup_bg {
    background: #9cd8d6;
    /* Old browsers */
    
    background: -moz-linear-gradient(top, #9cd8d6 0%, #b9e3e2 11%, #e3f4f3 27%, #ffffff 100%);
    /* FF3.6+ */
    
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #9cd8d6), color-stop(11%, #b9e3e2), color-stop(27%, #e3f4f3), color-stop(100%, #ffffff));
    /* Chrome,Safari4+ */
    
    background: -webkit-linear-gradient(top, #9cd8d6 0%, #b9e3e2 11%, #e3f4f3 27%, #ffffff 100%);
    /* Chrome10+,Safari5.1+ */
    
    background: -o-linear-gradient(top, #9cd8d6 0%, #b9e3e2 11%, #e3f4f3 27%, #ffffff 100%);
    /* Opera 11.10+ */
    
    background: -ms-linear-gradient(top, #9cd8d6 0%, #b9e3e2 11%, #e3f4f3 27%, #ffffff 100%);
    /* IE10+ */
    
    background: linear-gradient(to bottom, #9cd8d6 0%, #b9e3e2 11%, #e3f4f3 27%, #ffffff 100%);
    /* W3C */
    
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#9cd8d6', endColorstr='#ffffff', GradientType=0);
    border-left: 2px solid #93D4D2;
    border-bottom: 2px solid #93D4D2;
    border-right: 2px solid #93D4D2;
    padding: 15px 0px 20px 0px;
    padding: 20px 20px 23px 20px;
}

.popup2 h2 {
    font-size: 37px;
    color: #000000;
    line-height: 37px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    margin-bottom: 5px;
}
/*-----------------------------------------*/

.mid_update .note h3 {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    font-size: 25px;
    color: #ffffff;
    padding-bottom: 2px;
}

.right_list {
    padding-right: 20px;
}

.right_list.side_nav ul li {
    border: none;
    text-align: right;
    list-style: disc;
    margin-bottom: 20px;
}

.right_list.side_nav ul li a {
    color: #666666;
    line-height: 20px;
}
/*.right_list.side_nav ul li a:hover:after, .side_nav ul li a.active:after { display: none; }*/

.onclick_open .info {
    margin-top: 0;
    position: relative;
}

.onclick_open .midalteacher_show {
    padding: 0;
    background: none;
    border: none;
}

.onclick_open .midalteacher_show img {
    top: -73px;
    position: absolute;
    right: 5px;
    width: 97.5%;
}

.mid_newdasboard {
    position: relative;
}

.mid_newdasboard .deshbordimg {
    position: relative;
}

.middle_four_blocks {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 270px;
    right: 0;
    margin: auto;
    display: block;
    max-width: 240px;
    max-height: 165px;
    width: 100%;
}

.middle_four_blocks ul {
    margin: 0;
    padding: 0;
}

.middle_four_blocks ul li {
    margin: 0;
    padding: 0;
    display: inline-block;
    width: 49%;
    text-align: center;
}

.middle_four_blocks ul li a {
    color: #ffffff;
    font-weight: 700;
    font-size: 14px;
    text-decoration: none;
    margin: 0;
    padding: 0;
    display: block;
}

.middle_four_blocks ul li a span {
    display: block;
    margin-top: 5px;
    margin-bottom: 10px;
}
/*========================================BOOK TWO========================================*/

.sea_ques .keep {
    font-size: 28px;
    color: #25408E;
    line-height: 35px;
    position: absolute;
    top: 90px;
    right: 60px;
    display: inline-block;
    text-align: center;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
}

.measure_water_level span {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    font-size: 14px;
    color: #25408E;
    line-height: 17px;
    display: inline-block;
    position: absolute;
    top: 115px;
    left: 185px;
    text-align: center;
}

.article_link {
    position: absolute;
    top: 15px;
    margin: auto;
    width: 100%;
    padding: 0 50px 0 15px;
}

.redtitle {
    font-size: 24px;
    line-height: 28px;
    color: #dc192b;
    font-weight: 700;
    float: right;
}

.redbtn {
    font-size: 20px;
    font-weight: 700;
    color: #ffffff;
    line-height: 21px;
    background: #dc192b;
    padding: 7px 15px;
    width: 160px;
    height: 60px;
    text-align: center;
    float: left;
    display: block;
}

.yellobg_text {
    background: #ffe5b5;
    padding: 10px 10px 25px 18px;
    border: 1px solid #ffb101;
    width: 630px;
    height: 330px;
    margin: 10px auto 50px;
}

.yellobg_text h2 {
    margin: 0;
    line-height: 26px;
    font-size: 22px;
    color: #000000;
    font-weight: 700;
}

.yellobg_text .article_author {
    font-size: 19px;
    line-height: 22px;
    color: #000000;
    margin-bottom: 20px;
}

.yellobg_text p {
    font-size: 21px;
    line-height: 25px;
    color: #000000;
    margin: 0;
    display: block;
}

.article_link .problem {
    width: 545px;
    margin: 0 auto;
}

.article_link .answer {
    width: 550px;
    margin: 0 auto;
}

.article_link .answer1 span {
    line-height: 21px;
    font-size: 21px;
    display: block;
    padding-top: 7px;
    font-weight: normal;
}

.water_authority {
    position: absolute;
    top: 15px;
    left: 0;
    right: 0;
    text-align: center;
    margin: auto;
    width: 100%;
}

.black_title {
    color: #000000;
    font-size: 22px;
    line-height: 26px;
    font-weight: 700;
}

.water_authority .redtitle {
    margin: 10px auto 15px;
    float: none;
}

.water_authority .redbtn {
    width: 270px;
    height: 60px;
    float: none;
    margin: 0 auto;
}

.problem3 {
    width: 545px;
    height: 130px;
    margin: 40px auto 30px;
    text-align: center;
    background: #e10079;
}

.problem3 span {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    font-size: 28px;
    color: #FFFFFF;
    line-height: 26px;
    padding-top: 50px;
    display: block;
}

.problem3_answer {
    width: 400px;
    height: 123px;
    margin: 40px auto 30px;
    text-align: right;
}

.problem3_answer span {
    font-size: 21px;
    line-height: 25px;
    font-weight: normal;
    padding: 5px;
    display: block;
}

.problem4 {
    width: 400px;
    height: 123px;
    margin: 40px auto 30px 135px;
    text-align: center;
    background: #e10079;
}

.problem4 span {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: normal;
    font-size: 28px;
    color: #FFFFFF;
    line-height: 26px;
    padding-top: 21px;
    display: block;
}

.problem4_answer {
    width: 400px;
    height: 123px;
    margin: 40px auto 30px 135px;
    text-align: center;
}

.problem4_answer span {
    font-size: 21px;
    line-height: 25px;
    font-weight: normal;
    padding: 31px 0 0 0;
    display: block;
}

.card__front.card__front5 {
    top: 160px;
}

.card__back.card__back5 {
    top: 160px;
}

.problem5 {
    width: 545px;
    height: 130px;
    margin: 40px auto 30px;
    text-align: center;
    background: #e10079;
}

.problem5 span {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    font-size: 28px;
    color: #FFFFFF;
    line-height: 26px;
    padding-top: 50px;
    display: block;
}

.problem5_answer {
    width: 545px;
    height: 123px;
    margin: 40px auto 30px;
    text-align: center;
}

.problem5_answer span {
    font-size: 21px;
    line-height: 25px;
    font-weight: normal;
    padding: 26px 5px 5px 5px;
    display: block;
}

.problem6 {
    width: 397px;
    height: 123px;
    margin: 40px auto 30px;
    text-align: center;
    background: #e10079;
}

.problem6 span {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: normal;
    font-size: 28px;
    color: #FFFFFF;
    padding-top: 31px;
    display: block;
    font-weight: 700;
    line-height: 35px !important;
}

.problem6_answer {
    width: 397px;
    height: 123px;
    margin: 40px auto 30px;
    text-align: center;
}

.problem6_answer span {
    font-size: 21px;
    line-height: 25px;
    font-weight: normal;
    padding: 20px 0 0 0;
    display: block;
}

.redbtn2 {
    padding-top: 18px;
    margin-top: 45px !important;
}

.right_red_green_btn {
    margin-top: 260px;
    margin-right: 30px;
}

.right_red_green_btn .redbtn {
    float: right;
    font-size: 17px;
    width: 272px;
}

.greenbtn {
    color: #ffffff;
    text-decoration: none;
    display: block;
    background: #7ac943;
    width: 270px;
    height: 60px;
    line-height: 24px;
    font-weight: 700;
    padding-top: 16px;
}

.right_red_green_btn .greenbtn {
    font-size: 26px;
    float: right;
    margin-top: 26px;
}

.darkblue_title {
    font-size: 26px;
    font-weight: 700;
    line-height: 32px;
    color: #25408e;
    text-align: right;
}

.surface_water_reservoir .darkblue_title {
    padding-right: 30px;
    margin-bottom: 80px;
    display: block;
}

.surface_water_reservoir .redbtn {
    float: right;
    width: 160px;
    font-size: 25px;
    line-height: 24px;
    padding-top: 15px;
}

.surface_water_reservoir .greenbtn {
    float: left;
    font-size: 26px;
    line-height: 24px;
    padding-top: 5px;
}

.surface_water_reservoir .btnred {
    display: inline-block;
    float: right;
    margin-right: 135px;
}

.surface_water_reservoir .btngrn {
    display: inline-block;
    float: left;
    margin-left: 70px;
}

.surface_water_reservoir .problem5 {
    margin-top: 10px;
}

.surface_water_reservoir .black_title {
    margin-top: 40px;
}

.problem7 {
    color: #ffffff;
    font-weight: 700;
    background: #25bece;
    width: 144px;
    height: 40px;
    display: block;
    margin: 20px auto 0;
    position: absolute;
    top: 315px;
    left: 40px;
    border: none;
    padding-top: 11px;
}

.problem7_answer {
    width: 410px;
    height: 65px;
    position: absolute;
    left: 30px;
    top: 310px;
    text-align: center;
    border: 2px solid #93d4d2;
    background: rgb(147, 212, 210);
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzkzZDRkMiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjgwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=);
    background: -moz-linear-gradient(top, rgba(147, 212, 210, 1) 0%, rgba(255, 255, 255, 1) 80%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(147, 212, 210, 1)), color-stop(80%, rgba(255, 255, 255, 1)));
    background: -webkit-linear-gradient(top, rgba(147, 212, 210, 1) 0%, rgba(255, 255, 255, 1) 80%);
    background: -o-linear-gradient(top, rgba(147, 212, 210, 1) 0%, rgba(255, 255, 255, 1) 80%);
    background: -ms-linear-gradient(top, rgba(147, 212, 210, 1) 0%, rgba(255, 255, 255, 1) 80%);
    background: linear-gradient(to bottom, rgba(147, 212, 210, 1) 0%, rgba(255, 255, 255, 1) 80%);
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#93d4d2', endColorstr='#ffffff', GradientType=0);
}

.problem7_answer span {
    font-size: 24px;
    line-height: 26px;
    font-weight: normal;
    padding: 0px 0 0 0;
    display: block;
    color: #000000;
}

.problem5_answer.problem5_answer_2 {
    margin-top: 10px;
}

.problem5_answer.problem5_answer_2 span {
    padding-top: 5px !important;
    font-size: 18px !important;
}

.water_limit_pg {
    margin-left: 40px;
}

.water_limit_pg.right_red_green_btn .redbtn {
    float: left;
    font-size: 25px;
    line-height: 24px;
    width: 272px;
    padding-top: 15px;
}

.water_limit_pg.right_red_green_btn .greenbtn {
    font-size: 26px;
    float: left;
    margin-top: 26px;
    line-height: 24px;
    padding-top: 4px
}

.problem5_answer.problem5_answer_3 {
    height: 145px;
}

.problem5_answer.problem5_answer_3 span {
    padding-top: 5px !important;
    font-size: 21px !important;
}

.lower_level_danger .problem5,
.lower_level_danger .problem5_answer {
    margin-left: auto;
    margin-right: 30px;
    margin-top: 25px;
}

.lower_level_danger .problem5_answer span {
    padding-top: 6px;
}

.hintbtn {
    position: absolute;
    top: 520px;
    left: 200px;
}

.lower_level_danger .redbtn {
    padding-top: 18px;
    width: 170px;
    height: 60px;
    font-size: 26px;
    line-height: 24px;
}

.graph_section {
    margin-top: 30px;
}

.graphimg {
    float: right;
    margin-right: 50px;
}

.graphoptions {
    float: left;
    margin-left: 50px;
}

ul.popup_btns {
    margin: 0;
    padding: 0;
}

.popup_btns li {
    display: block;
    width: 170px;
    height: 60px;
    text-align: center;
    border: 1px solid #808080;
    margin-bottom: 30px;
    background: #7ac943;
    cursor: pointer;
}

.popup_btns li a {
    color: #ffffff;
    text-decoration: none;
    font-size: 26px;
    line-height: 24px;
    font-weight: 700;
    padding-top: 15px;
    display: block;
}

.problem8 {
    width: 270px;
    height: 140px;
    margin: 40px auto 30px 135px;
    text-align: center;
    background: #e10079;
}

.problem8 span {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    font-size: 26px;
    color: #FFFFFF;
    line-height: 32px;
    padding-top: 21px;
    display: block;
}

.problem8_answer {
    width: 270px;
    height: 140px;
    margin: 40px auto 30px 135px;
    text-align: center;
}

.problem8_answer span {
    font-size: 23px;
    line-height: 27px;
    font-weight: normal;
    padding: 24px 0 0 0;
    display: block;
}

.problem9 {
    width: 270px;
    height: 140px;
    margin: 40px auto 30px 135px;
    text-align: center;
    background: #e10079;
}

.problem9 span {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    font-size: 26px;
    color: #FFFFFF;
    line-height: 32px;
    padding-top: 21px;
    display: block;
}

.problem9_answer {
    width: 270px;
    height: 140px;
    margin: 40px auto 30px 135px;
    text-align: center;
}

.problem9_answer span {
    font-size: 23px;
    line-height: 27px;
    font-weight: normal;
    padding: 24px 0 0 0;
    display: block;
}

.card__front.card__front6 {
    top: 0;
    right: -320px;
}

.card__back.card__back6 {
    top: 0;
    right: -320px;
}

.graph_popup {
    background: rgb(122, 201, 67);
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzdhYzk0MyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9Ijc0JSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=);
    background: -moz-linear-gradient(top, rgba(122, 201, 67, 1) 0%, rgba(255, 255, 255, 1) 74%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(122, 201, 67, 1)), color-stop(74%, rgba(255, 255, 255, 1)));
    background: -webkit-linear-gradient(top, rgba(122, 201, 67, 1) 0%, rgba(255, 255, 255, 1) 74%);
    background: -o-linear-gradient(top, rgba(122, 201, 67, 1) 0%, rgba(255, 255, 255, 1) 74%);
    background: -ms-linear-gradient(top, rgba(122, 201, 67, 1) 0%, rgba(255, 255, 255, 1) 74%);
    background: linear-gradient(to bottom, rgba(122, 201, 67, 1) 0%, rgba(255, 255, 255, 1) 74%);
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#7ac943', endColorstr='#ffffff', GradientType=0);
    border: 1px solid #7ac943;
}

.graph_popup1 {
    width: 600px;
    height: 355px;
    display: block;
    font-size: 31px;
    line-height: 37px;
    text-align: center;
    padding: 20px;
}

.graph_popup1 strong {
    font-weight: 700;
    margin-top: 8px;
    display: block;
}

.graph_popup1 span.close_btn {
    left: -16px;
}

.graph_popup2 {
    width: 600px;
    height: 137px;
    display: block;
    font-size: 31px;
    line-height: 37px;
    text-align: right;
    padding: 10px 20px;
}

.graph_popup2 strong {
    font-weight: 700;
}

.graph_popup3 {
    width: 600px;
    height: 70px;
    display: block;
    font-size: 31px;
    line-height: 37px;
    text-align: right;
    padding: 10px 20px;
}

.graph2 {
    max-width: 512px;
    width: 100%;
    display: block;
    margin: 0px auto;
}

.graph2 .popup_btns {
    float: left;
    margin-top: 120px;
}

.graph2 .pinkcard {
    float: right;
}

.graphxaxis {
    left: 344px;
    right: auto;
    top: auto;
    bottom: 100px;
}

.graph_popup3 span.close_btn {
    left: -15px;
}

.graph3 .graphimg {
    float: none;
    margin: 0 auto;
}

.graph3 .popup_btns {
    position: absolute;
    top: 155px;
    right: 20px;
}

.graph3 .popup_btns li {
    height: 38px;
}

.graph3 .popup_btns li a {
    font-size: 18px;
    padding-top: 5px;
}

.popupwrap16 {
    z-index: 111;
}

.graph3 .problem9_answer span {
    font-size: 20px;
    padding-top: 10px;
    line-height: 22px;
}

.middlegrnbtn .popup_btns {
    position: relative;
    top: 32px;
    right: 0;
    left: 0;
    margin: 0 auto;
    display: block;
    width: 170px;
}

.middlegrnbtn .popup_btns li {
    height: 60px;
}

.middlegrnbtn .popup_btns li a {
    font-size: 26px;
    line-height: 24px;
    padding-top: 16px;
}

.graph_popup4 {
    width: 600px;
    height: 142px;
    display: block;
    font-size: 30px;
    line-height: 37px;
    text-align: right;
    padding: 10px 20px;
}

.graph_popup4 strong {
    font-weight: 700;
}

.graph_popup5 {
    width: 600px;
    height: 245px;
    display: block;
    font-size: 30px;
    line-height: 37px;
    text-align: center;
    padding: 10px 20px;
}

.graph_popup5 span.close_btn {
    left: -22px;
}

.graph_popup5 strong {
    font-weight: 700;
}

.graph_popup6 {
    width: 600px;
    height: 214px;
    display: block;
    font-size: 30px;
    line-height: 37px;
    text-align: center;
    padding: 10px 20px;
}

.graph_popup6 span.close_btn {
    left: -22px;
}

.graph_popup6 strong {
    font-weight: 700;
}

.graph_prblm_5 .problem5_answer span {
    padding-top: 8px;
}

.midalteacher_show2 {
    height: auto;
}

.linktolake_btn {
    position: absolute;
    bottom: -2px;
    left: 135px;
}

.linktolake_btn .redbtn {
    width: 170px;
    height: 60px;
}

.rightgrnbtn {
    position: absolute;
    bottom: -40px;
    right: 40px;
}

.rightgrnbtn .popup_btns {
    position: relative;
    top: 32px;
    right: 0;
    left: 0;
    margin: 0 auto;
    display: block;
    width: 170px;
}

.rightgrnbtn .popup_btns li {
    height: 60px;
}

.rightgrnbtn .popup_btns li a {
    font-size: 26px;
    line-height: 24px;
    padding-top: 16px;
}

.problem10 {
    width: 520px;
    height: 213px;
    margin: 60px 82px 0px auto;
    text-align: center;
    background: #e10079;
}

.problem10 span {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    font-size: 26px;
    color: #FFFFFF;
    line-height: 26px;
    padding-top: 90px;
    display: block;
}

.problem10_answer {
    width: 520px;
    height: 213px;
    margin: 60px 82px 0px auto;
    text-align: right;
}

.problem10_answer span {
    font-size: 26px;
    line-height: 33px;
    font-weight: normal;
    padding: 0px 8px 5px 5px;
    display: block;
}

.problem10_answer strong {
    font-weight: 700;
}

.problem10_answer2 {
    text-align: center;
    padding-top: 16px;
}

.graph_popup7 {
    width: 518px;
    height: 90px;
    display: block;
    font-size: 26px;
    line-height: 34px;
    text-align: center;
    padding: 10px 20px;
}

.graph_popup7 span.close_btn {
    left: 65px;
}

.graph_popup7 strong {
    font-weight: 700;
}

.graph_form_section {
    width: 662px;
    height: 472px;
    display: block;
    margin: 0 auto;
    border: 1px solid #1da8cc;
    padding: 25px;
    text-align: right;
    background: rgb(156, 212, 210);
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzljZDRkMiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjYxJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=);
    background: -moz-linear-gradient(top, rgba(156, 212, 210, 1) 0%, rgba(255, 255, 255, 1) 61%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(156, 212, 210, 1)), color-stop(61%, rgba(255, 255, 255, 1)));
    background: -webkit-linear-gradient(top, rgba(156, 212, 210, 1) 0%, rgba(255, 255, 255, 1) 61%);
    background: -o-linear-gradient(top, rgba(156, 212, 210, 1) 0%, rgba(255, 255, 255, 1) 61%);
    background: -ms-linear-gradient(top, rgba(156, 212, 210, 1) 0%, rgba(255, 255, 255, 1) 61%);
    background: linear-gradient(to bottom, rgba(156, 212, 210, 1) 0%, rgba(255, 255, 255, 1) 61%);
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#9cd4d2', endColorstr='#ffffff', GradientType=0);
}

.boxtitle {
    font-size: 32px;
    line-height: 100%;
    color: #1da8cc;
    text-align: center;
    font-weight: 700;
}

.readingwater_level label {
    display: inline-block;
    color: #000000;
    font-size: 28px;
    line-height: 51px;
    text-align: right;
}

.readingwater_level input {
    background: none;
    background-color: transparent;
    border-top: none;
    border-right: none;
    border-left: none;
    border-bottom: 2px solid #1da8cc;
    border-radius: 0;
    outline: none;
    padding: 5px;
    margin-right: 10px;
}

.readingwater_level .inputbox1 {
    width: 333px;
}

.readingwater_level .inputbox2 {
    width: 359px;
}

.readingwater_level .inputbox3 {
    width: 359px;
}

.readingwater_level .inputbox4 {
    width: 533px;
}

.readingwater_level .inputbox5 {
    width: 472px;
}

.readingwater_level .inputbox6 {
    width: 536px;
}

.readingwater_level .inputbox7 {
    width: 409px;
}

.yellowbtn {
    width: 136px;
    height: 50px;
    display: block;
    background: #ffb101;
    color: #ffffff;
    text-align: center;
    font-weight: 700;
    font-size: 23px;
    padding-top: 12px;
}

.bluebtn {
    width: 136px;
    height: 50px;
    display: block;
    background: #25bece;
    color: #ffffff;
    text-align: center;
    font-weight: 700;
    font-size: 23px;
    padding-top: 12px;
}

.form_three_buttons .redbtn {
    width: 136px;
    height: 50px;
    font-weight: 700;
    font-size: 23px;
    padding-top: 12px;
}

.form_three_buttons {
    display: block;
}

.form_three_buttons ul {
    margin: 35px 0 0 0;
    padding: 0;
    text-align: center;
}

.form_three_buttons ul li {
    display: inline-block;
    width: 30%;
}

.form_three_buttons ul li a {
    display: inline-block;
}

.strategypopup {
    width: 662px;
    height: 472px;
    border: 1px solid #93d4d2;
    font-size: 22px;
    line-height: 26px;
    padding: 15px 10px 20px 25px;
    display: block;
    background: rgb(156, 212, 210);
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzljZDRkMiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjYxJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=);
    background: -moz-linear-gradient(top, rgba(156, 212, 210, 1) 0%, rgba(255, 255, 255, 1) 61%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(156, 212, 210, 1)), color-stop(61%, rgba(255, 255, 255, 1)));
    background: -webkit-linear-gradient(top, rgba(156, 212, 210, 1) 0%, rgba(255, 255, 255, 1) 61%);
    background: -o-linear-gradient(top, rgba(156, 212, 210, 1) 0%, rgba(255, 255, 255, 1) 61%);
    background: -ms-linear-gradient(top, rgba(156, 212, 210, 1) 0%, rgba(255, 255, 255, 1) 61%);
    background: linear-gradient(to bottom, rgba(156, 212, 210, 1) 0%, rgba(255, 255, 255, 1) 61%);
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#9cd4d2', endColorstr='#ffffff', GradientType=0);
}

.strategypopup strong {
    font-weight: 700;
}

.strategypopup span.close_btn {
    left: -80px;
}

.popuptitle {
    display: block;
    text-align: center;
    width: 100%;
    margin-bottom: 7px;
}

.graph_form_section2 {
    margin-top: 20px;
}

.graph_form_section2 .boxtitle {
    font-size: 27px;
}

.exceltable {
    margin-top: 10px;
}

.exceltable .bluebtn {
    position: absolute;
    left: 100px;
    top: 100px;
}

.completeinfo {
    color: #ffffff;
    font-size: 24px;
    line-height: 28px;
    font-weight: 700;
    display: inline-block;
    margin-top: 20px;
    float: left;
    margin-left: 77px;
}

.missonbtn .redbtn {
    font-size: 23px;
    width: 136px;
    height: 50px;
    padding-top: 14px;
    margin-right: 8px;
}

.missonbtn {
    display: inline-block;
}

.graph_form_section2 .redtitle {
    font-size: 23px;
    font-weight: normal;
}

.includedsteps ul {
    margin: 0;
}

.includedsteps ul li {
    display: block;
    font-size: 21px;
    line-height: 30px;
}

.includedsteps ul li strong {
    font-weight: 700;
}

.boywithcloud {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    text-align: center;
}

.cloudtext {
    font-size: 18px;
    line-height: 21px;
    color: #1da8cc;
    font-weight: 700;
    position: absolute;
    left: 0;
    right: 0;
    top: 43px;
}

.articleread {
    font-weight: 700;
    font-size: 23px;
    line-height: 33px;
    color: #dc192b;
    text-align: center;
    position: absolute;
    top: 30px;
    right: 0;
    left: 0;
}

.articleread strong {
    font-size: 29px;
}

.gameinstructions {
    width: 589px;
    height: 412px;
    background: #ffe5b5;
    color: #1da8cc;
    font-size: 28px;
    font-weight: 700;
    padding: 25px;
    line-height: 46px;
    text-align: center;
    position: absolute;
    top: 50px;
    left: 0;
    right: 0;
    margin: auto;
}

.gameinstructions strong {
    display: block;
    font-size: 38px;
}

.bottom_img {
    width: 589px;
    position: absolute;
    bottom: 230px;
    left: 0;
    right: 0;
    margin: auto;
}

.bottom_img .left {
    left: -22px;
    position: absolute;
}

.bottom_img .right {
    right: -5px;
    position: absolute;
}

.portswater {
    position: absolute;
    top: 30px;
    left: 0;
    right: 0;
    margin: auto;
    text-align: center;
}

.portswater .redtitle {
    float: none;
}

.portswater .gameinstructions {
    height: 460px;
}

.portswater .gameinstructions.gameinstructions_lg {
    height: 482px;
}

.chkboxes {
    position: absolute;
    top: 342px;
    left: 0;
    right: 0;
    text-align: right;
}

.axis_represents {
    font-size: 24px;
    line-height: 23px;
    color: #000000;
    font-weight: 700;
    margin-bottom: 10px;
}

.represent_label {
    font-size: 24px;
    color: #000000;
}

input[type=checkbox].css-checkbox2 {
    position: absolute;
    overflow: hidden;
    clip: rect(0 0 0 0);
    height: 1px;
    width: 1px;
    margin: -1px;
    padding: 0;
    border: 0;
}

input[type=checkbox].css-checkbox2 + label.css-label2,
input[type=checkbox].css-checkbox2 + label.css-label2.clr {
    background-repeat: no-repeat;
    background-position: right 6px;
    padding-right: 45px;
    height: 42px;
    display: inline-block;
    line-height: 41px;
    font-size: 21px;
    color: #000;
    vertical-align: middle;
    cursor: pointer;
}

input[type=checkbox].css-checkbox2:checked + label.css-label2,
input[type=checkbox].css-checkbox2 + label.css-label2.chk {
    background-position: right -358px;
}

label.css-label2 {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.currect2 label.css-label2 {
    background-image: url(../images/currect_checkbox2.png);
}

.wrong2 label.css-label2 {
    background-image: url(../images/wrong_checkbox2.png);
}

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

.axis_represents2 {
    font-size: 22px;
}

.chkbox_label_lg input[type=checkbox].css-checkbox2 + label.css-label2,
input[type=checkbox].css-checkbox2 + label.css-label2.clr {
    height: 52px;
    line-height: 21px;
    font-size: 19px;
}

.right_area2 .note {
    padding-top: 2px;
}

.close-canvas {
    width: 25px;
    height: 25px;
    background: url(../images/close_cnv.png) no-repeat left top;
    background-size: contain;
    display: none;
    position: absolute;
    left: 10px;
    top: 10px;
    z-index: 999999999;
    cursor: pointer;
}
/*========================================BOOK Three========================================*/

.note2 {
    padding: 5px 6px 12px 10px;
}

.text1 h2,
.text2 h2 {
    color: #1DA8CC;
    font-size: 28px;
    line-height: 36px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    text-align: center;
}

.text1 h2 {
    position: absolute;
    top: 35px;
    right: 30px;
}

.text2 h2 {
    position: absolute;
    bottom: 115px;
    right: 60px;
}

.info_btns {
    text-align: center;
    margin-left: -19px;
    margin-right: -19px;
    margin-top: 28px;
    margin-bottom: 27px;
}

.info_btns ul li {
    float: left;
    padding-left: 19px;
    padding-right: 19px;
}

.info_btns a {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    width: 154px;
    height: 56px;
    background: #25BECE;
    border: 1px solid #808080;
    font-size: 20px;
    color: #FFFFFF;
    font-weight: bold;
    line-height: 22px;
    display: inline-block;
    padding-top: 4px;
}

.info_btns a.info_btn2 {
    padding-top: 15px;
}

.problem11 {
    height: 75px;
    padding-top: 10px;
}

.problem11 span {
    font-size: 22px;
}

.answer13 {
    height: 75px;
    padding-top: 2px;
}

.answer13 span {
    font-size: 21px;
    line-height: 20px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
}

.water_consumption {
    position: absolute;
    top: 20px;
    right: 0;
    left: 0;
    margin: auto;
    text-align: center;
}

.water_consumption p {
    font-size: 19px;
    color: #000;
    line-height: 25px;
}

.water_consumption .info_consumption {
    margin: 25px 0px 40px 0px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    width: 154px;
    height: 56px;
    background: #25BECE;
    border: 1px solid #808080;
    font-size: 15px;
    color: #FFFFFF;
    font-weight: bold;
    line-height: 16px;
    display: inline-block;
    padding-top: 2px;
}

.card__front7 {
    top: 90px;
}

.card__back7 {
    top: 90px;
}

.card__front8 {
    top: 178px;
}

.card__back8 {
    top: 178px;
}

.problem12 {
    padding-top: 13px;
}

.problem12 span {
    font-size: 18px;
    line-height: 21px;
}

.answer14 {
    padding-top: 13px;
}

.answer14 span {
    font-size: 21px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
}

.problem_container {
    max-width: 545px;
    width: 100%;
    margin: 0 auto;
}

.card__front9 .problem13 {
    height: 297px;
    padding-top: 117px;
}

.card__front9 .problem13 span {
    font-size: 18px;
    color: #fff;
    line-height: 20px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
}

.card__front10 {
    top: 345px;
}

.problem14 {
    padding-top: 13px;
}

.problem14 span {
    font-size: 18px;
    color: #fff;
    line-height: 20px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
}

.card__back10 {
    top: 345px
}

.answer16 {
    padding-top: 4px;
}

.answer16 span {
    font-size: 21px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
    line-height: 23px;
    display: block;
    padding: 0;
}

.answer16 span.black {
    color: #000;
}

.answer15 .top_title {
    font-size: 21px;
    color: #E10079;
    line-height: 21px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
    margin: 10px 0 13px 0;
}

.answer15 {
    height: 305px;
}

.chart {
    position: absolute;
    top: 75px;
    right: 0;
    left: 0;
    margin: auto;
    text-align: center;
}

.problem15 span {
    font-size: 18px;
    color: #fff;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
}

.answer17 {
    padding-top: 5px;
}

.answer17 span {
    font-size: 21px;
    color: #E10079;
    line-height: 23px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
}

.graph_img {
    margin-top: 110px;
}

.chart2 {
    position: absolute;
    top: 10px;
    right: 0;
    left: 0;
    margin: auto;
    text-align: center;
}

.flip_btn {
    width: 182px;
    height: 45px;
    position: absolute;
    top: 0;
    left: 20px;
}

.flip_btn2 {
    width: 182px;
    height: 45px;
    position: absolute;
    bootom: 10px;
    right: 100px;
}

.graph_img2 {
    margin-top: 75px;
    position: relative;
}

.graph_text {
    width: 375px;
    position: absolute;
    top: 11px;
    right: 86px;
}

.graph_text p {
    font-size: 14px;
    color: #000000;
    line-height: 18px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
}

.graph_text p span {
    font-size: 10px;
}

.mission {
    position: absolute;
    left: 17px;
    bottom: -48px;
}

.mission a {
    width: 208px;
    height: 40px;
    background: #7AC943;
    border: 1px solid #808080;
    font-size: 27px;
    color: #000000;
    line-height: 27px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
    text-align: center;
    padding-top: 5px;
    display: inline-block;
}

.water_consumption2 {
    width: 100%;
    position: absolute;
    top: 0;
    right: 0;
}

.water_consumption2 .top_title {
    font-size: 24px;
    color: #E10079;
    line-height: 24px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    margin: 16px 7px 0 0;
}

.problem_container2 {
    max-width: 520px;
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
}

.grap4 {
    position: relative;
    max-width: 520px;
    left: 0;
    right: 0;
    margin: auto;
}

.graph_info {
    position: absolute;
    top: 14px;
    right: -40px;
}

.flip_btns {
    position: relative;
    top: 10px;
}

.flip_btns .flipbtn {
    width: 235px;
    height: 60px;
}

.flip_btns .flip_btn3 {
    position: absolute;
    top: 0;
    right: 0;
}

.flip_btns .flip_btn4 {
    position: absolute;
    top: 0;
    left: 0;
}

.flip_btns .flip_btn5 {
    position: absolute;
    top: 90px;
    right: 0;
}

.flip_btns .flip_btn6 {
    position: absolute;
    top: 90px;
    left: 0;
}

.problem16 {
    padding: 3px 21px 0 21px;
}

.problem16 span {
    font-size: 18px;
    line-height: 19px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
}

.answer18 {
    padding-top: 15px;
}

.answer18 span {
    font-size: 27px;
    color: #000;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
}

.flip_btns .flipbtn2 {
    width: 100%;
    height: 60px;
}

.flip_btns .flip_btn7 {
    position: absolute;
    top: 0;
    right: 0;
}

.flip_btns .flip_btn8 {
    position: absolute;
    top: 90px;
    right: 0;
}

.flipbtn2 .problem16 {
    padding: 13px 21px 0 21px;
}

.graph_content {
    max-width: 585px;
    margin: 0 auto;
    text-align: center;
    margin-top: 375px;
}

.graph_content p {
    font-size: 32px;
    color: #000;
    line-height: 40px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
}

.grap6 {
    position: relative;
    max-width: 735px;
    margin: 0 auto;
    margin-top: 22px;
    margin-bottom: 5px;
}

.graph_img3 {
    max-width: 350px;
    width: 100%;
    float: left;
    position: relative;
}

.graph_img3 .graph_info {
    width: 168px;
}

.flip_btns .flip_btn9 {
    width: 100%;
    height: 88px;
    position: absolute;
    top: 0;
    right: 0;
}

.flip_btns .flip_btn10 {
    width: 100%;
    height: 55px;
    position: absolute;
    top: 102px;
    right: 0;
}

.flip_btns .flip_btn11 {
    width: 100%;
    height: 55px;
    position: absolute;
    top: 175px;
    right: 0;
}

.flip_btns .flip_btn9 .answer {
    height: 88px;
    padding-top: 14px;
}

.flip_btns .flip_btn10 .answer,
.flip_btns .flip_btn11 .answer {
    height: 55px;
    padding-top: 10px;
}

.flip_btns .flip_btn9 .answer span {
    height: 88px;
    line-height: 25px;
}

.flip_btns .flip_btn9 .problem {
    height: 88px;
}

.flip_btns .flip_btn10 .problem,
.flip_btns .flip_btn11 .problem {
    height: 55px;
}

.flip_btns .flip_btn9 .problem span {
    font-size: 20px;
    line-height: 23px;
}

.flip_btns .flip_btn10 .problem,
.flip_btns .flip_btn11 .problem {
    padding-top: 15px;
}

.flip_btns .flip_btn10 .problem span,
.flip_btns .flip_btn11 .problem span {
    font-size: 23px !important;
    line-height: 23px;
}

.graph_content2 {
    max-width: 585px;
    margin: 0 auto;
    text-align: center;
    margin-top: 370px;
}

.graph_content2 p {
    font-size: 22px;
    color: #000000;
    line-height: 26px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
}

.problem17 {
    padding-top: 13px;
    height: 78px;
}

.problem17 span {
    font-size: 20px;
    color: #fff;
    line-height: 25px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
}

.answer19 {
    height: 78px;
}

.answer19 span {
    font-size: 22px;
    color: #E10079;
    line-height: 20px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
}

.flip_btns2 {
    max-width: 530px;
    margin: 0 auto;
}

.months {
    width: 100%;
    position: absolute;
    top: 0;
    right: 0;
    text-align: center;
    margin-top: 13px;
}

.months_content {
    max-width: 455px;
    margin: 0 auto;
}

.months p {
    font-size: 25px;
    color: #000000;
    line-height: 33px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
}

.months h2 {
    font-size: 28px;
    color: #E10079;
    line-height: 33px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    margin-top: 17px;
}

.months_cricle {
    width: 100%;
    margin: 75px 13px 0 0
}

.months_cricle img {
    float: right;
    margin-top: 90px;
}

.flip_btns3 {
    position: relative;
    top: 10px;
    right: 30px;
}

.flip_btns3 .flipbtn {
    width: 156px;
    height: 56px;
}

.flip_btns3 .flip_btn3 {
    position: absolute;
    top: 0;
    right: 0;
}

.flip_btns3 .flip_btn4 {
    position: absolute;
    top: 0;
    right: 187px;
}

.flip_btns3 .flip_btn5 {
    position: absolute;
    top: 0;
    right: 374px;
}

.flip_btns3 .flip_btn6 {
    position: absolute;
    top: 0;
    right: 562px;
}

.months_cricle .problem16 {
    padding: 22px 21px 0 21px;
}

.flip_btns4 {
    position: relative;
    top: 15px;
    right: 30px;
}

.flip_btns4 .flipbtn {
    width: 221px;
}

.flip_btns4 .flipbtn .problem {
    height: 88px;
    padding: 32px 21px 0 21px;
}

.flip_btns4 .flip_btn3 {
    position: absolute;
    top: 0;
    right: 0;
}

.flip_btns4 .flip_btn4 {
    position: absolute;
    top: 111px;
    right: 0;
}

.flip_btns4 .flip_btn5 {
    position: absolute;
    top: 216px;
    right: 0;
}

.flip_btns4 .flip_btn6 {
    position: absolute;
    top: 331px;
    right: 0;
}

.table {
    float: left;
    margin: 20px 0 0 28px
}

.flip_btns4 .flipbtn .answer {
    height: 88px;
}

.flip_btns4 .flipbtn .answer span {
    font-size: 17px;
    color: #E10079;
    line-height: 20px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    display: block;
    padding: 0;
}

.flip_btns4 .flipbtn .answer span.black {
    color: #000;
}

.flip_btns4 .flipbtn .answer18 {
    padding-top: 1px;
}

.top_title2 {
    font-size: 24px;
    color: #E10079;
    line-height: 24px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    margin: 16px 7px 0 0;
    text-align: center;
    margin-bottom: 10px;
}

.seasons .table2 {
    float: right;
    position: absolute;
    top: 160px;
    right: 15px;
}

.seasons .graph_img4 {
    float: left;
    position: absolute;
    left: 50px;
}

.seasons .flip_btn2 {
    width: 337px;
    top: 226px;
    right: 36px;
}

.seasons .flip_btn2 .problem {
    height: 122px;
}

.seasons .flip_btn2 .problem15 span {
    font-size: 26px;
}

.seasons .flip_btn2 .answer17 {
    height: 122px;
    padding-top: 25px;
}

.seasons .flip_btn2 .answer17 span {
    font-size: 48px;
    color: #E10079;
    line-height: 48px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
}

.seasons2 .graph_img4 {
    top: 20px;
}

.seasons2 .flip_btn2 {
    width: 313px;
    top: 32px;
    right: 25px;
}

.seasons2 .flip_btn12 {
    width: 313px;
    position: absolute;
    top: 180px;
    right: 25px;
}

.seasons2 .flip_btn12 .problem {
    height: 360px;
    padding-top: 90px;
}

.seasons2 .flip_btn12 .problem15 span {
    font-size: 26px;
    color: #fff;
    line-height: 26px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
}

.seasons2 .flip_btn2 .answer {
    padding-top: 18px;
}

.seasons2 .flip_btn2 .answer span {
    font-size: 23px;
    color: #000000;
    line-height: 26px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
}

.seasons2 .flip_btn12 .answer {
    height: 360px;
    padding-top: 18px;
}

.seasons2 .flip_btn12 .answer span {
    text-align: right;
    font-size: 23px;
    color: #E10079;
    line-height: 23px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    display: inline-block;
    padding: 10px 5px 0 0;
}

.seasons2 .flip_btn12 .answer ul li {
    text-align: right;
    font-size: 23px;
    color: #000000;
    line-height: 23px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    padding: 4px 5px 0 0;
}

.seasons3 .top_title3 {
    margin: 27px 30px 0 0;
}

.seasons3 .top_title3 h3 {
    font-size: 26px;
    color: #E10079;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    line-height: 30px;
}

.seasons3 .graph_img4 {
    top: 20px;
}

.seasons3 .flip_btn2 {
    width: 313px;
    top: 208px;
    right: 25px;
}

.seasons3 .flip_btn12 {
    width: 313px;
    position: absolute;
    top: 180px;
    right: 25px;
}

.seasons3 .flip_btn12 .problem {
    height: 190px;
    padding-top: 90px;
}

.seasons3 .flip_btn12 .problem15 span {
    font-size: 26px;
    color: #fff;
    line-height: 26px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
}

.seasons3 .flip_btn2 {
    top: 211px;
}

.seasons3 .flip_btn2 .answer {
    padding-top: 45px;
}

.seasons3 .flip_btn2 .answer span {
    font-size: 23px;
    color: #000000;
    line-height: 26px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
}

.seasons3 .flip_btn12 {
    top: 350px;
}

.seasons3 .flip_btn12 .answer {
    height: 190px;
    padding-top: 5px;
}

.seasons3 .flip_btn12 .answer span {
    font-size: 22px;
    color: #000000;
    line-height: 24px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
}

.water_consumption3 {
    width: 100%;
    position: absolute;
    top: 0;
    right: 0;
}

.water_consumption3 .top_title {
    font-size: 26px;
    color: #E10079;
    line-height: 28px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    margin: 0 7px 0 0;
    text-align: center;
}

.water_consumption3 .grap4 {
    max-width: 605px;
    margin: 0 auto;
    top: -13px;
}

.graph_content3 {
    width: 100%;
    position: relative;
}

.graph_content3 h3 {
    font-size: 18px;
    color: #000000;
    line-height: 18px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    margin: 0px 28px 5px 0;
}

.graph_content3 ul li {
    font-size: 18px;
    line-height: 22px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
    list-style: decimal;
    margin-right: 53px;
}

.graph_content3 a.popbtn {
    width: 80px;
    height: 26px;
    background: #25BECE;
    border: 1px solid #808080;
    font-size: 21px;
    color: #000000;
    line-height: 15px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    display: inline-block;
    text-align: center;
    padding-top: 2px;
    margin-right: 20px;
}

.mission_btn {
    width: 150px;
    height: 27px;
    background: #7AC943;
    border: 1px solid #808080;
    color: #000000;
    font-size: 21px;
    line-height: 18px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    text-align: center;
    display: inline-block;
    padding-top: 3px;
    position: absolute;
    bottom: 18px;
    left: 36px;
}

.data {
    width: 100%;
    position: absolute;
    top: 0;
    right: 0;
}

.data .graph_img5 {
    position: absolute;
    left: 10px;
    top: 154px;
}

.flip_btn13 {
    width: 385px;
    position: absolute;
    top: 30px;
    right: 95px;
}

.flip_btn13 .problem {
    height: 105px;
    padding-top: 30px;
}

.flip_btn13 .problem span {
    font-size: 36px;
    color: #FFFFFF;
    line-height: 36px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
}

.flip_btn13 .answer {
    height: 105px;
    padding-top: 11px;
}

.flip_btn13 .answer span {
    font-size: 24px;
    color: #000000;
    line-height: 24px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
}

.flip_btn14 {
    width: 385px;
    position: absolute;
    top: 200px;
    left: 80px;
}

.flip_btn14 .problem {
    height: 105px;
    padding-top: 21px;
}

.flip_btn14 .problem span {
    font-size: 24px;
    color: #FFFFFF;
    line-height: 30px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
}

.flip_btn14 .answer {
    height: 105px;
    padding-top: 11px;
}

.flip_btn14 .answer span {
    font-size: 24px;
    color: #000000;
    line-height: 24px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
}

.flip_btn15 {
    width: 385px;
    position: absolute;
    top: 388px;
    right: 35px;
}

.flip_btn15 .problem {
    height: 105px;
    padding-top: 21px;
}

.flip_btn15 .problem span {
    font-size: 24px;
    color: #FFFFFF;
    line-height: 30px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
}

.flip_btn15 .answer {
    height: 105px;
    padding-top: 6px;
}

.flip_btn15 .answer span {
    font-size: 21px;
    color: #000000;
    line-height: 21px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
}

.water_consumption4 {
    width: 100%;
    position: absolute;
    top: 0;
    right: 0;
}

.water_consumption4 .rightdata {
    width: 339px;
    float: right;
    margin: 22px 27px 0 0;
}

.water_consumption4 .leftdata {
    float: left;
    width: 450px;
    margin-top: 68px;
}

.water_consumption4 .rightdata h3 {
    font-size: 36px;
    color: #E10079;
    line-height: 36px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    margin-bottom: 88px;
}

.water_consumption4 p {
    font-size: 26px;
    color: #000;
    line-height: 30px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
    padding-bottom: 30px;
}

.text3 {
    position: absolute;
    top: 292px;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    width: 100%;
    text-align: center;
}

.text3 h2 {
    font-size: 36px;
    color: #E10079;
    line-height: 36px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
}

.text3 a {
    width: 268px;
    height: 48px;
    background: #7AC943;
    border: 1px solid #808080;
    font-size: 24px;
    color: #fff;
    line-height: 24px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    display: inline-block;
    padding-top: 11px;
    margin-top: 15px;
}

.water_account {
    width: 100%;
    position: absolute;
    top: 0;
    right: 0;
    text-align: center;
}

.water_account h3 {
    font-size: 29px;
    color: #E10079;
    line-height: 35px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    margin: 22px 0px 30px 0px;
}

.water_account p {
    font-size: 29px;
    color: #000000;
    line-height: 33px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
    padding-bottom: 35px;
}

.water_account p.paddingb {
    padding-bottom: 15px;
}

.water_account .mission2 {
    width: 150px;
    height: 27px;
    background: #7AC943;
    border: 1px solid #808080;
    font-size: 21px;
    color: #000000;
    line-height: 21px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    padding-top: 1px;
    text-align: center;
    display: inline-block;
}

.water_account2 {
    width: 100%;
    position: absolute;
    top: 0;
    right: 0;
    text-align: center;
}

.water_account2 h3 {
    font-size: 36px;
    color: #E10079;
    line-height: 36px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    margin: 22px 0px 30px 0px;
}

.water_account2 h3.top_head {
    margin: 27px 0 40px 0;
}

.water_account2 p {
    font-size: 29px;
    color: #000000;
    line-height: 35px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
}

.water_account2 h3.bottom_head {
    font-size: 29px;
    color: #E10079;
    line-height: 29px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    margin-top: 50px;
}

.graph_options {
    width: 100%;
    position: absolute;
    top: 0;
    right: 0;
}

.graph_options .top_title4 {
    font-size: 27px;
    color: #E10079;
    line-height: 27px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    text-align: center;
    margin: 22px 0px 25px 0px;
}

.graph_img6 {
    margin-right: 20px;
}

.axis_represents2 {
    font-size: 25px;
    color: #000000;
    line-height: 25px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    margin: 30px 0 15px 0;
}

.chkbox_label_lg2 input[type=checkbox].css-checkbox2 + label.css-label2 {
    height: 42px;
    line-height: 54px;
    font-size: 25px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    padding-right: 63px
}

input[type=checkbox].css-checkbox3 + label.css-label3,
input[type=checkbox].css-checkbox3 + label.css-label3.clr {
    background-position: right 15px;
}

.currect3 label.css-label2 {
    background-image: url(../images/currect_checkbox3.png);
}

.wrong3 label.css-label2 {
    background-image: url(../images/wrong_checkbox3.png);
}

.options4 {
    max-width: 479px;
    width: 100%;
    margin: 0 auto;
}

.popup3 .headtitle {
    font-size: 20px;
    color: #000000;
    line-height: 20px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
}

.popup3 {
    width: 410px;
}

.popup4 {
    width: 608px;
    text-align: center;
}

.popup5 {
    width: 700px;
    height: 492px;
    background: #fff;
    border: 1px solid #666666;
    text-align: center;
    padding-top: 70px;
}

.popup3 .popup_bg {
    background: #9cd8d6;
    /* Old browsers */
    
    background: -moz-linear-gradient(top, #9cd8d6 0%, #b9e3e2 11%, #e3f4f3 27%, #ffffff 100%);
    /* FF3.6+ */
    
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #9cd8d6), color-stop(11%, #b9e3e2), color-stop(27%, #e3f4f3), color-stop(100%, #ffffff));
    /* Chrome,Safari4+ */
    
    background: -webkit-linear-gradient(top, #9cd8d6 0%, #b9e3e2 11%, #e3f4f3 27%, #ffffff 100%);
    /* Chrome10+,Safari5.1+ */
    
    background: -o-linear-gradient(top, #9cd8d6 0%, #b9e3e2 11%, #e3f4f3 27%, #ffffff 100%);
    /* Opera 11.10+ */
    
    background: -ms-linear-gradient(top, #9cd8d6 0%, #b9e3e2 11%, #e3f4f3 27%, #ffffff 100%);
    /* IE10+ */
    
    background: linear-gradient(to bottom, #9cd8d6 0%, #b9e3e2 11%, #e3f4f3 27%, #ffffff 100%);
    /* W3C */
    
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#9cd8d6', endColorstr='#ffffff', GradientType=0);
    border-left: 2px solid #93D4D2;
    border-bottom: 2px solid #93D4D2;
    border-right: 2px solid #93D4D2;
    padding: 15px 0px 20px 0px;
    padding: 20px 20px 23px 20px;
}

.popup3 h2 {
    font-size: 37px;
    color: #000000;
    line-height: 37px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    margin-bottom: 5px;
}

.popup4 h2 {
    margin-top: 13px;
    margin-bottom: 0;
}

.popup4 h3 {
    font-size: 18px;
    color: #000000;
    line-height: 18px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    margin-bottom: 11px;
}

.popup4 span {
    font-size: 15px;
    display: inline-block;
}

.popup5 .grid_img {
    width: 500px;
    margin: 0 auto;
}

.popup6 {
    width: 410px;
}

.popup6 .popup_bg {
    background: #9cd8d6;
    /* Old browsers */
    
    background: -moz-linear-gradient(top, #9cd8d6 0%, #b9e3e2 11%, #e3f4f3 27%, #ffffff 100%);
    /* FF3.6+ */
    
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #9cd8d6), color-stop(11%, #b9e3e2), color-stop(27%, #e3f4f3), color-stop(100%, #ffffff));
    /* Chrome,Safari4+ */
    
    background: -webkit-linear-gradient(top, #9cd8d6 0%, #b9e3e2 11%, #e3f4f3 27%, #ffffff 100%);
    /* Chrome10+,Safari5.1+ */
    
    background: -o-linear-gradient(top, #9cd8d6 0%, #b9e3e2 11%, #e3f4f3 27%, #ffffff 100%);
    /* Opera 11.10+ */
    
    background: -ms-linear-gradient(top, #9cd8d6 0%, #b9e3e2 11%, #e3f4f3 27%, #ffffff 100%);
    /* IE10+ */
    
    background: linear-gradient(to bottom, #9cd8d6 0%, #b9e3e2 11%, #e3f4f3 27%, #ffffff 100%);
    /* W3C */
    
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#9cd8d6', endColorstr='#ffffff', GradientType=0);
    border-left: 2px solid #93D4D2;
    border-bottom: 2px solid #93D4D2;
    border-right: 2px solid #93D4D2;
    padding: 15px 0px 20px 0px;
    padding: 20px 20px 23px 20px;
}

.popup6 p {
    font-size: 22px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
}

.paddinhl {
    padding-right: 25px;
}

.water_consumption5 {
    width: 100%;
    position: absolute;
    top: 0;
    right: 0;
    padding: 20px 10px 0 30px;
}

.water_consumption5 .top_title {
    font-size: 24px;
    color: #E10079;
    line-height: 24px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
}

.water_consumption5 p {
    font-size: 23px;
    color: #000000;
    line-height: 31px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
    padding-top: 2px;
}

.water_consumption5 .trial_btn {
    width: 127px;
    height: 40px;
    background: #7AC943;
    border: 1px solid #808080;
    font-size: 23px;
    color: #000000;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
    display: inline-block;
    text-align: center;
    padding-top: 7px;
}

.rightcontent {
    width: 525px;
    float: right;
}

.leftcontent {
    width: 127px;
    float: left;
}

.graph_img7 {
    max-width: 600px;
    margin: 0 auto;
    margin-top: 10px;
}

.popup7 {
    width: 600px;
}

.popup7 .popup_bg {
    background: #9cd8d6;
    /* Old browsers */
    
    background: -moz-linear-gradient(top, #9cd8d6 0%, #b9e3e2 11%, #e3f4f3 27%, #ffffff 100%);
    /* FF3.6+ */
    
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #9cd8d6), color-stop(11%, #b9e3e2), color-stop(27%, #e3f4f3), color-stop(100%, #ffffff));
    /* Chrome,Safari4+ */
    
    background: -webkit-linear-gradient(top, #9cd8d6 0%, #b9e3e2 11%, #e3f4f3 27%, #ffffff 100%);
    /* Chrome10+,Safari5.1+ */
    
    background: -o-linear-gradient(top, #9cd8d6 0%, #b9e3e2 11%, #e3f4f3 27%, #ffffff 100%);
    /* Opera 11.10+ */
    
    background: -ms-linear-gradient(top, #9cd8d6 0%, #b9e3e2 11%, #e3f4f3 27%, #ffffff 100%);
    /* IE10+ */
    
    background: linear-gradient(to bottom, #9cd8d6 0%, #b9e3e2 11%, #e3f4f3 27%, #ffffff 100%);
    /* W3C */
    
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#9cd8d6', endColorstr='#ffffff', GradientType=0);
    border-left: 2px solid #93D4D2;
    border-bottom: 2px solid #93D4D2;
    border-right: 2px solid #93D4D2;
    padding: 15px 0px 20px 0px;
    padding: 20px 20px 23px 20px;
}
/*========================================BOOK 4th========================================*/

.note3 {
    width: 100%;
    height: 88px;
    background: #717ebb;
    padding: 7px 7px 0px 3px;
    margin-bottom: 13px;
    text-align: center;
}

.note3 h2 {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    font-size: 15px;
    color: #000;
    line-height: 20px;
    padding-bottom: 15px;
}

.note3 h3 {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
    font-size: 15px;
    color: #000;
}

.img_content {
    position: absolute;
    top: 285px;
    right: 30px;
    width: 444px;
}

.img_content .question {
    font-size: 34px;
    color: #DC192B;
    line-height: 43px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    display: inline-block;
    padding-bottom: 35px;
}

.deshbord .deshbordimg .teacher_info2 {
    position: absolute;
    top: 15px;
    left: 16px;
}

.questions_box {
    max-width: 370px;
    margin: 0 auto;
    margin-top: 38px;
}

.questions_box .problem span {
    font-size: 17px;
    color: #FFFFFF;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
}

.questions_box .question_vedio {
    margin-top: 113px;
    text-align: center;
}

.questions_box .question_vedio span {
    font-size: 28px;
    color: #000000;
    line-height: 35px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
}

.questions_box .question_vedio span a {
    color: #0A657C;
}

.water_consumption6 {
    position: absolute;
    top: 25px;
    right: 20px;
}

.water_consumption6 p {
    font-size: 27px;
    color: #000000;
    line-height: 32px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
}

.water_consumption6 a {
    color: #0A657C;
}

.water_consumption6 .problem_container {
    max-width: 285px;
    margin: 0 auto;
    margin-top: 75px;
}

.water_consumption6 .problem span {
    font-size: 24px;
}

.water_consumption6 .answer {
    padding-top: 13px;
}

.water_consumption6 .info_consumption {
    width: 170px;
    height: 65px;
    background: #C1272D;
    border: 1px solid #C1272D;
    font-size: 24px;
    color: #FFFFFF;
    line-height: 24px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    display: inline-block;
    text-align: center;
    padding-top: 19px;
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    margin-top: 100px;
}

.look_map {
    width: 100%;
    position: absolute;
    top: 20px;
}

.map_details {
    max-width: 719px;
    margin: 0 auto;
}

.map_details .right_map {
    float: right;
}

.map_details .mid_map {
    float: right;
}

.map_details .left_map {
    float: left;
}

.map_details .left_map .showlocations {
    position: relative;
}

.map_details .left_map .showlocations .problem {
    height: 20px;
    padding: 0;
}

.map_details .left_map .showlocations .problem span {
    font-size: 15px;
    color: #FFFFFF;
    line-height: 0;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
}

.map_details .left_map .showlocations .answer {
    height: 20px;
    padding: 0;
}

.map_details .left_map .showlocations .answer span {
    font-size: 8px;
    line-height: 0;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
    padding-top: 5px;
    display: block;
}

.map_details .left_map .showlocations .locatin1 {
    width: 60px;
    background: #E10079;
    border: 1px solid #808080;
    position: absolute;
    right: 96px;
    top: 8px;
}

.map_details .left_map .showlocations .locatin2 {
    width: 60px;
    background: #E10079;
    border: 1px solid #808080;
    position: absolute;
    right: 42px;
    top: 39px;
}

.map_details .left_map .showlocations .locatin3 {
    width: 60px;
    background: #E10079;
    border: 1px solid #808080;
    position: absolute;
    right: 174px;
    top: 82px;
}

.map_details .left_map .showlocations .locatin4 {
    width: 60px;
    background: #E10079;
    border: 1px solid #808080;
    position: absolute;
    right: 72px;
    top: 133px;
}

.map_details .left_map .showlocations .locatin5 {
    width: 60px;
    background: #E10079;
    border: 1px solid #808080;
    position: absolute;
    right: 180px;
    top: 133px;
}

.map_details .left_map .showlocations .locatin6 {
    width: 60px;
    background: #E10079;
    border: 1px solid #808080;
    position: absolute;
    right: 150px;
    top: 299px;
}

.map_details .left_map .showlocations .locatin7 {
    width: 60px;
    background: #E10079;
    border: 1px solid #808080;
    position: absolute;
    right: 183px;
    top: 327px;
}

.look_map5 .left_map {
    margin-top: 33px;
}

.look_map p {
    font-size: 28px;
    color: #000000;
    line-height: 35px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    margin-bottom: 11px;
    margin-right: 25px;
}

.mid_map .flip_btn10 {
    width: 182px;
    height: 187px;
    margin-top: 32px;
    margin-right: 56px;
}

.mid_map .flip_btn10 .problem {
    height: 187px;
    padding: 16px;
}

.mid_map .flip_btn10 .problem span {
    font-size: 22px;
    color: #fff;
    line-height: 34px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
}

.mid_map .flip_btn10 .answer {
    height: 187px;
    padding: 16px;
}

.look_map2 {
    top: 9px;
}

.look_map2 p {
    font-size: 24px;
    color: #000000;
    line-height: 27px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    margin-right: 47px;
}

.btn_map {
    width: 183px;
    margin: 35px 60px 0 0
}

.btn_map .trial_btn2 {
    width: 100%;
    height: 61px;
    background: #7AC943;
    border: 1px solid #808080;
    font-size: 29px;
    color: #FFFFFF;
    line-height: 29px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    padding-top: 13px;
    display: inline-block;
    text-align: center;
    margin-bottom: 15px;
}

.btn_map .more_info {
    width: 100%;
    height: 61px;
    background: #25BECE;
    border: 1px solid #808080;
    font-size: 29px;
    color: #FFFFFF;
    line-height: 29px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    padding-top: 13px;
    display: inline-block;
    text-align: center;
}

.look_map3 p {
    font-size: 28px;
}

.look_map4 {
    top: 50px;
}

.look_map4 .map_details .right_map {
    width: 385px;
}

.look_map4 .map_details .right_map .problem {
    height: 345px;
    padding: 109px 27px 0px 27px;
}

.look_map4 .map_details .right_map .problem span {
    font-size: 24px;
    color: #FFFFFF;
    line-height: 28px;
}

.look_map4 .map_details .right_map .answer {
    height: 345px;
    padding: 5px;
    text-align: right;
}

.look_map4 .map_details .right_map .answer span {
    font-size: 19px;
    color: #E10079;
    line-height: 23px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
}

.view_task a {
    width: 183px;
    height: 61px;
    display: inline-block;
    text-align: center;
    padding-top: 13px;
    font-size: 29px;
    color: #FFFFFF;
    line-height: 29px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    margin-top: 385px;
}

.view_task .cool_site2 {
    float: right;
    background: #C1272D;
    border: 1px solid #808080;
}

.view_task .viewtask {
    float: left;
    background: #7AC943;
    border: 1px solid #808080;
}

.look_map5 .map_details .right_map {
    width: 385px;
}

.card2 {
    margin-top: 113px;
}

.look_map5 .map_details .right_map .problem18 {
    height: 89px;
    padding: 14px 29px 0px 29px;
}

.look_map5 .map_details .right_map .problem18 span {
    font-size: 24px;
    color: #FFFFFF;
    line-height: 28px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
}

.look_map5 .map_details .right_map .answer20 {
    height: 89px;
    padding-top: 27px;
}

.look_map5 .map_details .right_map .answer20 span {
    font-size: 24px;
    color: #E10079;
    line-height: 24px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
}

.look_map5 .map_details .right_map .problem19 {
    height: 89px;
    padding: 14px 29px 0px 29px;
}

.look_map5 .map_details .right_map .problem19 span {
    font-size: 22px;
    color: #FFFFFF;
    line-height: 26px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
}

.look_map5 .map_details .right_map .answer21 {
    height: 89px;
    padding-top: 9px;
}

.look_map5 .map_details .right_map .answer21 span {
    font-size: 18px;
    color: #E10079;
    line-height: 20px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
}

.coolsite_btns {
    float: left;
    margin-top: 114px;
}

.coolsite_btns a {
    width: 184px;
    height: 48px;
    background: #7AC943;
    border: 1px solid #808080;
    display: block;
    text-align: center;
    color: #FFFFFF;
    font-size: 18px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    margin-bottom: 13px;
}

.coolsite_btns .coolsite_btn {
    padding-top: 3px;
}

.coolsite_btns .view_task {
    font-size: 20px;
    line-height: 22px;
    padding-top: 13px;
    margin-top: 88px;
}

.celltable {
    position: absolute;
    top: 25px;
    right: 20px;
}

.celltable p {
    font-size: 24px;
    color: #1DA8CC;
    line-height: 28px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
}

.celltable .exceltable {
    margin: 20px 0px 60px 0px;
}

.celltable .mission3 {
    float: left;
    width: 183px;
    height: 47px;
    background: #7AC943;
    border: 1px solid #808080;
    font-size: 21px;
    color: #FFFFFF;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    text-align: center;
    padding-top: 12px;
}

.coolsite_btns2 {
    margin-top: 175px;
}

.left_map a.view_task {
    width: 184px;
    height: 48px;
    background: #7AC943;
    border: 1px solid #808080;
    display: block;
    text-align: center;
    color: #FFFFFF;
    font-size: 18px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    margin-bottom: 13px;
    font-size: 20px;
    line-height: 22px;
    padding-top: 13px;
    margin: auto;
    margin-top: 10px;
}

.coolsite_btns3 {
    margin-top: 114px;
}

.answer-question {
    margin-top: 75px;
}

.answer-question span {
    font-size: 24px;
    color: #1DA8CC;
    line-height: 24px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
}

.fillbox {
    position: absolute;
    top: 25px;
    right: 30px;
}

.fillbox .toptitle {
    font-size: 32px;
    color: #1DA8CC;
    line-height: 32px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
}

.fillbox .fill_content {
    font-size: 26px;
    color: #000000;
    line-height: 32px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
}

.fillbox .emptybox {
    width: 110px;
    height: 30px;
    background: #F2F2F2;
    border: 1px solid #808080;
    display: inline-block;
    position: relative;
    top: 6px;
}

.fillbox .select_opt {
    font-size: 25px;
    color: #1DA8CC;
    line-height: 25px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    margin: 13px 0px 20px 0px;
}

.select_answer {
    background: #9cd8d6;
    /* Old browsers */
    
    background: -moz-linear-gradient(top, #9cd8d6 0%, #b9e3e2 11%, #e3f4f3 27%, #ffffff 100%);
    /* FF3.6+ */
    
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #9cd8d6), color-stop(11%, #b9e3e2), color-stop(27%, #e3f4f3), color-stop(100%, #ffffff));
    /* Chrome,Safari4+ */
    
    background: -webkit-linear-gradient(top, #9cd8d6 0%, #b9e3e2 11%, #e3f4f3 27%, #ffffff 100%);
    /* Chrome10+,Safari5.1+ */
    
    background: -o-linear-gradient(top, #9cd8d6 0%, #b9e3e2 11%, #e3f4f3 27%, #ffffff 100%);
    /* Opera 11.10+ */
    
    background: -ms-linear-gradient(top, #9cd8d6 0%, #b9e3e2 11%, #e3f4f3 27%, #ffffff 100%);
    /* IE10+ */
    
    background: linear-gradient(to bottom, #9cd8d6 0%, #b9e3e2 11%, #e3f4f3 27%, #ffffff 100%);
    /* W3C */
    
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#9cd8d6', endColorstr='#ffffff', GradientType=0);
    border-left: 2px solid #93D4D2;
    border-bottom: 2px solid #93D4D2;
    border-right: 2px solid #93D4D2;
    width: 500px;
    height: 117px;
    border: 3px solid #93D4D2;
    padding: 10px 25px 0 25px;
    text-align: center;
    margin-right: 37px;
}

.select_answer span {
    width: 100px;
    height: 30px;
    background: #94D6D4;
    border: 1px solid #1DA8CC;
    font-size: 20px;
    color: #000000;
    line-height: 20px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
    display: inline-block;
    padding-top: 4px;
    text-align: center;
    margin-left: 18px;
    margin-right: 18px;
    margin-bottom: 24px;
    cursor: pointer;
}

.factors {
    width: 100%;
    position: absolute;
    top: 20px;
    text-align: center;
}

.factors h2 {
    font-size: 30px;
    color: #1DA8CC;
    line-height: 35px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
}

.factors h3 {
    font-size: 24px;
    color: #000000;
    line-height: 30px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    margin-top: 10px;
}

.information {
    width: 100%;
    height: 97%;
    position: absolute;
    top: 20px;
    text-align: center;
}

.information h2 {
    font-size: 32px;
    color: #1DA8CC;
    line-height: 36px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    margin-bottom: 45px;
}

.information h3 {
    font-size: 32px;
    color: #000;
    line-height: 34px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
}

.information .mission4 {
    width: 183px;
    height: 47px;
    background: #7AC943;
    border: 1px solid #808080;
    color: #fff;
    font-size: 21px;
    line-height: 21px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    display: inline-block;
    padding-top: 12px;
    text-align: center;
    position: absolute;
    bottom: 35px;
    left: 30px;
}

.popup_bg2 {
    background: #56b3d3;
    /* Old browsers */
    
    background: -moz-linear-gradient(top, #56b3d3 0%, #daeff5 26%, #ffffff 100%);
    /* FF3.6+ */
    
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #56b3d3), color-stop(26%, #daeff5), color-stop(100%, #ffffff));
    /* Chrome,Safari4+ */
    
    background: -webkit-linear-gradient(top, #56b3d3 0%, #daeff5 26%, #ffffff 100%);
    /* Chrome10+,Safari5.1+ */
    
    background: -o-linear-gradient(top, #56b3d3 0%, #daeff5 26%, #ffffff 100%);
    /* Opera 11.10+ */
    
    background: -ms-linear-gradient(top, #56b3d3 0%, #daeff5 26%, #ffffff 100%);
    /* IE10+ */
    
    background: linear-gradient(to bottom, #56b3d3 0%, #daeff5 26%, #ffffff 100%);
    /* W3C */
    
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#56b3d3', endColorstr='#ffffff', GradientType=0);
    /* IE6-9 */
    
    border-left: 2px solid #1da8cc;
    border-bottom: 2px solid #1da8cc;
    border-right: 2px solid #1da8cc;
}

.popup8 p {
    text-align: center;
    font-size: 23px;
    color: #000000;
    line-height: 30px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
}

.popup8 p span {
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
}

.popup9 figure {
    position: relative;
}

.popup9 span {
    width: 50px;
    height: 18px;
    font-size: 13px;
    color: #FFFFFF;
    line-height: 13px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
    position: absolute;
    bottom: 28px;
    left: 83px;
    display: inline-block;
    cursor: pointer;
}

.popup9 span.bt22 {
    bottom: 21px;
}

.popup_bg3 {
    background: #7ac943;
    /* Old browsers */
    
    background: -moz-linear-gradient(top, #7ac943 0%, #c1e6a8 23%, #ffffff 100%);
    /* FF3.6+ */
    
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #7ac943), color-stop(23%, #c1e6a8), color-stop(100%, #ffffff));
    /* Chrome,Safari4+ */
    
    background: -webkit-linear-gradient(top, #7ac943 0%, #c1e6a8 23%, #ffffff 100%);
    /* Chrome10+,Safari5.1+ */
    
    background: -o-linear-gradient(top, #7ac943 0%, #c1e6a8 23%, #ffffff 100%);
    /* Opera 11.10+ */
    
    background: -ms-linear-gradient(top, #7ac943 0%, #c1e6a8 23%, #ffffff 100%);
    /* IE10+ */
    
    background: linear-gradient(to bottom, #7ac943 0%, #c1e6a8 23%, #ffffff 100%);
    /* W3C */
    
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#7ac943', endColorstr='#ffffff', GradientType=0);
    border-left: 2px solid #7ac943;
    border-bottom: 2px solid #7ac943;
    border-right: 2px solid #7ac943;
}

.maintable {
    display: table;
    margin: 0;
    padding: 0;
    width: 100%;
    min-height: 50px;
    border: 3px solid #7ac943;
    border-radius: 6px;
}

.maintable ul.headinggroup {
    display: table-header-group;
    min-height: 50px;
    background: #7ac943;
    color: #FFF;
    text-align: center;
}

.maintable ul.headinggroup li span {
    color: #FFF;
    font-size: 23px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 700;
}

.maintable ul.headinggroup li span:first-child {
    width: 153px;
}

.maintable ul.headinggroup li span:nth-child(2) {
    width: 147px;
}

.maintable ul.headinggroup li span:last-child {
    width: 348px;
}

.maintable ul.rowgroup {
    display: table-row-group;
    margin: 0;
    padding: 0;
    background: #fff;
}

.maintable ul.rowgroup li span {
    font-size: 17px;
    color: #000000;
    line-height: 20px;
    font-family: 'Open Sans Hebrew', serif;
    font-weight: 400;
    border-left: 3px solid #7ac943;
    vertical-align: top;
}

.maintable ul.rowgroup li span:last-child {
    border: none;
}

.maintable li {
    display: table-row;
    width: 100%;
}

.maintable li span {
    display: table-cell;
    padding: 10px;
    vertical-align: middle;
}

.maintable ul.rowgroup li:nth-child(2n) {
    background: #CCC;
}
/*added code : fede*/
/* page4 */

#page4-background {
    background-image: url('../images/page4.png');
    background-size: cover;
    background-repeat-x: no-repeat;
    background-repeat-y: no-repeat;
}

#slide4 {
    position: relative;
}

#slide4 > .slide4-row {
    position: relative;
    width: 100%;
    height: auto;
    font-size: 20px;
    font-weight: 600;
    padding: 10px 25px;
}

#slide4 > .slide4-row > .col-right {
    width: 70%;
    float: right;
    padding-top: 30px;
    padding-bottom: 50px;
    padding-right: 25px;
}

#slide4 > .slide4-row > .col-left {
    width: 30%;
    float: right;
    padding-top: 50px;
    padding-bottom: 50px;
}

#slide4 > .slide4-row > .col-right > .ul {
    display: list-item;
}

#slide4 > .slide4-row > .col-right > .ul > li {
    list-style: disc;
}

#slide4 > a.slide4_btn,
a.slide4_btn:link,
a.slide4_btn:hover,
a.slide4_btn:visited,
a.slide4_btn:active {
    text-decoration: none;
    color: white;
    background-color: #24bdce;
    padding: 20px;
    font-weight: 100;
}

#slide4 > .slide4-titles {
    padding: 25px 50px 0 50px;
}

#slide4 > .slide4-titles > .slide4-pop-up1,
.slide4-pop-up2 {
    padding: 10px;
    position: absolute;
    z-index: 55;
    border: 2px solid #1da8cc;
    background: -webkit-linear-gradient(#56b3d3, #fff);
    background: -o-linear-gradient(#56b3d3, #fff);
    background: -moz-linear-gradient(#56b3d3, #fff);
    background: linear-gradient(#56b3d3, #fff);
    width: 280px;
    height: auto;
    right: 20%;
    margin-top: 5px;
    display: none;
}

#slide4 > .slide4-titles > .lead {
    font-size: 25px;
    font-weight: 600;
}

#slide4 > .slide4-titles > .lead > .titles-click1,
.titles-click2 {
    cursor: pointer;
    color: #534e40;
    text-shadow: 2px 0 0 #1da8cc, -2px 0 0 #1da8cc, 0 2px 0 #1da8cc, 0 -2px 0 #1da8cc, 1px 1px #1da8cc, -1px -1px 0 #1da8cc, 1px -1px 0 #1da8cc, -1px 1px 0 #1da8cc;
}

#slide4 > .slide4-embed {
    padding: 25px;
    text-align: center;
}

#slide4 > .slide4-embed > iframe {
    width: 80%;
    height: 325px;
}
/*page 5:*/

#page5-background {
    background-image: url('../images/page5.png');
    background-size: cover;
    background-repeat-x: no-repeat;
    background-repeat-y: no-repeat;
}

#slide5 > .slide5-title {
    color: #1da8cc;
    font-weight: 600;
    font-size: 25px;
    text-align: center;
    padding: 20px 25px;
}

#slide5 > .slide5-embed {
    padding: 25px 25px 0 25px;
    text-align: center;
}

#slide5 > .slide5-embed > iframe {
    width: 80%;
    height: 300px;
}

#slide5 > .slide5-row {
    position: relative;
    width: 80%;
    height: auto;
    padding: 10px 50px 50px 50px;
    text-align: center;
    margin: auto;
}

#slide5 > .slide5-row > .card {
    cursor: pointer;
    margin-bottom: 25px;
}

#slide5 > .slide5-row > .card > .card__front > .front {
    padding: 15px;
    background-color: #e00079;
    color: #fff;
}

#slide5 > .slide5-row > .card > .card__back > .back {
    padding: 15px;
    background-color: #fff;
    color: #e00079;
    border: 2px solid #e00079;
    /*    display: none;*/
}