/*#region min-width:760px */
@media screen and (min-width:760px) {
    #ParkInfoStyleMenu {
        height: 230px;
    }
    .ImageShape img {
        width: 100%;
        height: 600px;
    }
    .ImageShape2 img {
        width: 100%;
        height: 140px;
    }
    .ImageShape2 {
        
        top: 2150px
    }
    .ParkInfoStyle {
        height: 400px;
    }

    #ParkInfoStyleMenu {
        width: 760px;
    }



    #ParkInfoMenuItem1 {
        right: 0px;
    }

    #ParkInfoMenuItem2 {
        right: 140px;
    }

    #ParkInfoMenuItem3 {
        right: 280px;
    }

    #ParkInfoMenuItem4 {
        right: 420px;
    }

    #ParkInfoMenuItem5 {
        right: 560px;
    }
}
@media screen and (max-width:760px) and (min-width:480px) {
    #ParkInfoStyleMenu {
        height: 360px;
    }

    .ImageShape img {
        width: 100%;
        height: 730px;
    }
    .ImageShape2 img {
        width: 100%;
        height: 150px;
    }
    .ImageShape2 {
        top: 2880px
    }
    .ParkInfoStyle {
        height: 530px;
    }

    #ParkInfoStyleMenu {
        width: 480px;
    }

    #ParkInfoMenuItem1 {
        right: 0px;
    }

    #ParkInfoMenuItem2 {
        right: 140px;
    }

    #ParkInfoMenuItem3 {
        right: 280px;
    }

    #ParkInfoMenuItem4 {
        right: 60px;
        top: 170px;
    }

    #ParkInfoMenuItem5 {
        right: 200px;
        top: 170px;
    }
}
@media screen and (max-width:480px) {
    #ParkInfoStyleMenu {
        height: 510px;
    }

    .ImageShape img {
        width: 100%;
        height: 970px;
    }
    .ImageShape2 img {
        width: 100%;
        height: 160px;
    }
    .ImageShape2 {
        top: 3400px
    }
    .ParkInfoStyle {
        height: 790px;
    }

    #ParkInfoStyleMenu {
        width: 320px;
    }

    #ParkInfoMenuItem1 {
        right: 0px;
    }

    #ParkInfoMenuItem2 {
        right: 140px;
    }

    #ParkInfoMenuItem3 {
        right: 0px;
        top: 170px;
    }

    #ParkInfoMenuItem4 {
        right: 140px;
        top: 170px;
    }

    #ParkInfoMenuItem5 {
        right: 70px;
        top: 340px;
    }
}
.ParkInfoStyle {
    background-color: #fff;
    text-align: center
}
#ParkInfoStyleMenu {
   
  
    margin: auto;
    position: relative;
    padding-top: 25px
}
.ParkInfoMenuItem {
    float: right;
    width: 200px;
    height: 145px;
    position: absolute;
    z-index: 220;
    margin-top: 10px
}
.ParkInfoMenuItem img {
        width: 100%;
        height: 100%;
        position: absolute;
        z-index: 211;
        right: 0px
    }
#ParkInfoStyleDiv {
    width: 100%;
    height: auto;
    z-index: 200;
    position: absolute
}
.ImageShape {
    position: absolute;
    width: 100%;
    z-index: 100;
    top: 470px
}

.ImageShape2 {
    position: absolute;
    width: 100%;
    z-index: 110;
    
}
/*#endregion */



/*#region min-width:900px */

@media screen and (max-width:900px) {
        .ParkInfoStyleTitle {
            width: 90%;
        }

        .ParkInfoStyleText {
            width: 90%;
        }
    }
@media screen and (min-width:900px) {


        .ParkInfoStyleTitle {
            width: 900px;
        }

        .ParkInfoStyleText {
            width: 900px;
        }
    }
.ParkInfoStyleTitle {
    
    height: 70px;
    margin: auto;
    font-size: 21px;
    font-weight: bolder;
    margin-top: 20px
}
.ParkInfoStyleText {
   
    height: auto;
    margin: auto;
}
/*#endregion */

/*#region min-width:965px */


@media screen and (min-width:965px) {
    .SlideVideo {
        width: 100%;
        height: auto
    }
    .SlideVideo {
        display: block;
    }
    .SlideVideoSmall {
        display: none;
    }
    .wrapper {
        
        width: 50%;
    }
    #HeadText {
       
        top: 15%;
    }
    #HeadMenu {
        display: block;
    }

    #QuickMenu {
        display: block;
    }

    .HeadText1 {
        width: 50%;
    }

    .HeadText2 {
        width: 50%;
    }

    .HeadText3 {
        width: 50%;
    }


    #MenuSmall {
        display: none;
    }

    #Define {
        height: 500px;
    }

    #DefineText {
        width: 50%;
        height: 500px;
    }

    #DefinePiroziText {
        display: none;
    }




}

@media screen and (max-width:965px) {
    .SlideVideoSmall {
        width: 100%;
        height: 609px;
    }
    .SlideVideo {
       display: none
    }
    .SlideVideoSmall {
        display: block;
    }
    .wrapper {
        width: 90%;
    }
    #HeadText {
        top: 23%;
    }
    #HeadMenu {
        display: none;
    }

    #QuickMenu {
        display: none;
    }

    .HeadText1 {
        width: 90%;
    }

    .HeadText2 {
        width: 90%;
    }

    .HeadText3 {
        width: 90%;
    }

    #MenuSmall {
        display: block;
    }

    #DefineBlackDiv {
        display: none;
    }

    #DefineSix {
        display: none;
    }

    #DefinePirozi {
        display: none;
    }

    #Define {
        height: 750px;
    }

    

    #DefinePiroziText {
        display: block;
    }

    

   
    

}




@media screen and (max-width:965px) and (min-width:520px) {


    #DefineText {
        width: 100%;
        height: 750px;
    }



    #DefineText div:last-child {
        margin-top: 220px;
    }
}
@media screen and (max-width:520px)  {

    #Define {
        height: 950px;
    }
    #DefineText {
        width: 100%;
        height: 950px;
    }



        #DefineText div:last-child {
            margin-top: 220px;
        }
}

#MenuSmall {
    width: 100%;
    height: 65px;
    position: fixed;
    top: 0px;
    right: 0px;
    background-color: #fff;
    z-index: 300;
    box-shadow: 0px 0px 2px #ccc
}

#MenuSmallDiv {
    float: right;
    height: 65px;
}

#MenuHide {
    float: right;
    height: 32px;
    border: 1px solid #2b0822;
    border-radius: 3px;
    width: 35px;
    margin: 15px 15px 0px 15px;
    cursor: pointer;
}

    #MenuHide img {
        width: 32px;
        margin-top: 6px
    }

#MenuSmallDiv span {
    float: right;
    padding-top: 20px;
    font-weight: bold;
}

#TopHeader {
    height: auto;
    width: 140px;
    float: left;
    padding-bottom: 5px;
    background-color: #fff;
}

    #TopHeader a:first-child {
        float: left;
        margin-left: 25px;
        width: 140px;
        height: 30px;
        border-radius: 5px;
        color: #fff;
        text-align: center;
        background-color: #0e7b9b;
        margin-top: 18px;
        padding-top: 5px;
        text-decoration: none;
        font-size: 14px;
    }

#TopHeaderSmall {
    height: auto;
    width: 105px;
    float: left;
    padding-bottom: 5px;
    background-color: #fff;
    margin-left: 8px;
}
#TopHeaderSmall a:first-child {
        float: left;
        width: 105px;
        height: 30px;
        border-radius: 5px;
        color: #fff;
        text-align: center;
        background-color: #0e7b9b;
        margin-top: 18px;
        padding-top: 5px;
        text-decoration: none;
        font-size: 14px;
    }
#MenuSubSmall {
    width: 100%;
    height: auto;
    position: fixed;
    top: 65px;
    background-color: #41b593;
    z-index: 300;
    padding-bottom: 10px;
    display: none;
}

    #MenuSubSmall a {
        color: #ffffff;
        padding: 3px 10px 3px 10px;
        float: right;
        width: 100%
    }

    #MenuSubSmall div:first-child {
        float: right;
        width: 200px;
        text-align: right;
        padding: 20px;
        z-index: 300;
        position: relative
    }

    #MenuSubSmall div:nth-child(2) {
        float: left;
        color: #fff;
        padding: 20px;
        position: relative;
        z-index: 300;
        width: 210px
    }

#DefineBlackDiv {
    position: absolute;
    right: 0px;
    width: 50%;
    background-color: #000;
    opacity: 0.2;
    z-index: 50;
    height: 500px
}

#DefineSix {
    position: absolute;
    right: 0px;
    width: 50%;
    z-index: 51;
    height: 500px
}

    #DefineSix img {
        height: 500px;
        width: 100%;
        opacity: 0.1;
    }

#DefinePirozi {
    width: 50%;
    float: right;
    height: 500px;
}

    #DefinePirozi img {
        width: 100%;
        height: 500px;
    }

#DefineText {
    float: right;
    color: #fff;
    text-align: justify;
    position: relative;
}

    #DefineText div:first-child {
        padding: 150px 25px 20px 25px;
        font-size: 30px;
        font-weight: bold
    }

    #DefineText div:last-child {
        padding: 20px 25px 20px 25px;
        font-size: 14px
    }

#Define {
    position: relative;
}

#DefinePiroziText {
    width: 100%;
    padding: 20px 25px 20px 25px;
    position: absolute;
}

    #DefinePiroziText img {
        width: 100%;
        height: 200px;
    }




/*#endregion */

/*#region BlogMedia */
@media screen and (min-width:1300px) {
    #BlogBoxHead {
        height: 250px;
    }

    .MenuNews {
        height: 1000px;
    }

    #MenuNewsDivO {
        display: none;
    }
    #MenuNewsOSmall {
        display: none;
    }
    #BlogBox {
        padding-right: 150px;
    }

    .BlogimgActive {
        width: 25%;
    }
    .EventimgActive {
        width: 25%;
    }
    .AgreementimgActive {
        width: 25%;
    }

    .BlogPicture {
        height: 1000px
    }

    .BlogimgText {
        width: 71%;
        padding-right: 10px
    }
    .EventimgText {
        width: 71%;
        padding-right: 10px
    }
    .AgreementimgText {
        width: 71%;
        padding-right: 10px
    }
    .Blogimg {
        width: 125px;
        height: 86px;
    }
    .Eventimg {
        width: 125px;
        height: 86px;
    }
    .Agreementimg {
        width: 125px;
        height: 86px;
    }


    .MediaimgActive {
        width: 25%;
    }
    .MediaimgText {
        width: 71%;
        padding-right: 10px
    }
    .Mediaimg {
        width: 125px;
        height: 86px;
    }

}

@media screen and (max-width:1300px) and (min-width:1212px) {
    .Blogimg {
        width: 115px;
        height: 76px;
    }
    .Eventimg {
        width: 115px;
        height: 76px;
    }

    .Agreementimg {
        width: 115px;
        height: 76px;
    }
    #BlogBoxHead {
        height: 250px;
    }

    .BlogimgLine {
        margin-top: 13px
    }

    #MenuNewsDivO {
        display: none;
    }
    #MenuNewsOSmall {
        display: none;
    }
    #BlogBox {
        padding-right: 150px;
    }

    .MenuNews {
        height: 1000px;
    }

    .BlogimgActive {
        width: 25%;
    }
    .EventimgActive {
        width: 25%;
    }

    .AgreementimgActive {
        width: 25%;
    }
    .BlogPicture {
        height: 1000px
    }

    .BlogimgText {
        width: 71%;
        padding-right: 10px
    }
    .EventimgText {
        width: 71%;
        padding-right: 10px
    }

    .AgreementimgText {
        width: 71%;
        padding-right: 10px
    }

    .MediaimgActive {
        width: 25%;
    }

    .MediaimgText {
        width: 71%;
        padding-right: 10px
    }

    .Mediaimg {
        width: 115px;
        height: 76px;
    }
}

@media screen and (max-width:1212px) and (min-width:1140px) {
    .Blogimg {
        width: 105px;
        height: 70px;
    }
    .Eventimg {
        width: 105px;
        height: 70px;
    }

    .Agreementimg {
        width: 105px;
        height: 70px;
    }
    #BlogBoxHead {
        height: 250px;
    }

    .BlogimgLine {
        margin-top: 13px
    }

    #MenuNewsDivO {
        display: none;
    }

    #MenuNewsOSmall {
        display: none;
    }

    #BlogBox {
        padding-right: 150px;
    }

    .MenuNews {
        height: 1000px;
    }

    .BlogimgActive {
        width: 25%;
    }
    .EventimgActive {
        width: 25%;
    }

    .AgreementimgActive {
        width: 25%;
    }
    .BlogPicture {
        height: 1000px
    }

    .BlogimgText {
        width: 71%;
        padding-right: 10px
    }
    .EventimgText {
        width: 71%;
        padding-right: 10px
    }

    .AgreementimgText {
        width: 71%;
        padding-right: 10px
    }

    .MediaimgActive {
        width: 25%;
    }

    .MediaimgText {
        width: 71%;
        padding-right: 10px
    }

    .Mediaimg {
        width: 105px;
        height: 70px;
    }
}


@media screen and (max-width:1140px)and (min-width:965px) {
    #MenuNewsDivO {
        display: none;
    }
    #MenuNewsOSmall {
        display: none;
    }
    .Blogimg {
        width: 100px;
        height: 60px;
    }
    .Eventimg {
        width: 100px;
        height: 60px;
    }

    .Agreementimg {
        width: 100px;
        height: 60px;
    }
    #BlogBoxHead {
        height: 250px;
    }

    .BlogimgLine {
        margin-top: 25px
    }

    #BlogBox {
        padding-right: 150px;
    }

    .MenuNews {
        height: 1000px;
    }

    .BlogimgActive {
        width: 25%;
    }
    .EventimgActive {
        width: 25%;
    }

    .AgreementimgActive {
        width: 25%;
    }
    .BlogPicture {
        height: 1000px
    }

    .BlogimgText {
        width: 71%;
        padding-right: 10px
    }
    .EventimgText {
        width: 71%;
        padding-right: 10px
    }

    .AgreementimgText {
        width: 71%;
        padding-right: 10px
    }

    .MediaimgActive {
        width: 25%;
    }

    .MediaimgText {
        width: 71%;
        padding-right: 10px
    }

    .Mediaimg {
        width: 100px;
        height: 60px;
    }
}

@media screen and (max-width:965px) and (min-width:890px) {
    #MenuNewsDiv {
        display: none;
    }

    .ScrollMenu {
        display: none;
    }

    #MenuNewsDivO {
        display: block;
    }
    #MenuNewsOSmall {
        display: none;
    }
    .Blogimg {
        width: 90px;
        height: 60px
    }
    .Eventimg {
        width: 90px;
        height: 60px
    }

    .Agreementimg {
        width: 90px;
        height: 60px
    }
    .BlogimgLine {
        margin-top: 19px
    }

    #BlogBox {
        padding-right: 0px;
    }

    #BlogBoxHead {
        height: 250px;
    }

    .MenuNews {
        height: 1400px;
    }

    .BlogimgActive {
        width: 25%;
    }
    .EventimgActive {
        width: 25%;
    }

    .AgreementimgActive {
        width: 25%;
    }
    .BlogPicture {
        height: 1400px
    }

    .BlogimgText {
        width: 71%;
        padding-right: 10px
    }
    .EventimgText {
        width: 71%;
        padding-right: 10px
    }

    .AgreementimgText {
        width: 71%;
        padding-right: 10px
    }

    #BlogTalkBox {
        width: 90%;
        margin-right: 5%;
        margin-left: 5%;
        height: 600px;
    }

    #BlogTalk {
        margin-top: 330px;
        height: auto;
        width: 100%;
        left: 0px;
        
        
    }
  

    #BlogVideo img {
        width: 100%;
    }

    .MediaimgActive {
        width: 25%;
    }

    .MediaimgText {
        width: 71%;
        padding-right: 10px
    }

    .Mediaimg {
        width: 90px;
        height: 60px;
    }

}

@media screen and (max-width:890px)and (min-width:540px) {
    #MenuNewsDiv {
        display: none;
    }

    .ScrollMenu {
        display: none;
    }

    #MenuNewsDivO {
        display: block;
    }
    #MenuNewsOSmall {
        display: none;
    }

    .Blogimg {
        width: 100px;
        height: 70px;
    }
    .Eventimg {
        width: 100px;
        height: 70px;
    }

    .Agreementimg {
        width: 100px;
        height: 70px;
    }
    .BlogimgLine {
        margin-top: 25px
    }

    #BlogBox {
        padding-right: 0px;
    }

    .MenuNews {
        height: 1600px;
    }

    .BlogimgActive {
        width: 96%;
    }
    .EventimgActive {
        width: 96%;
    }

    .AgreementimgActive {
        width: 96%;
    }
    #BlogBoxHead {
        height: 500px;
    }

    .BlogPicture {
        height: 1600px
    }

    .BlogimgText {
        width: 100%;
        padding-right: 0px
    }
    .EventimgText {
        width: 100%;
        padding-right: 0px
    }

    .AgreementimgText {
        width: 100%;
        padding-right: 0px
    }

    #BlogTalkBox {
        width: 90%;
        margin-right: 5%;
        margin-left: 5%;
        height: 600px;
    }

    #BlogTalk {
        margin-top: 330px;
        height: auto;
        width: 100%;
        left: 0px;
    }

    #BlogVideo img {
        width: 100%;
    }
    .MediaimgActive {
        width: 96%;
    }

    .MediaimgText {
        width: 100%;
        padding-right: 0px
    }

    .Mediaimg {
        width: 100px;
        height: 70px;
    }
}

@media screen and (max-width:540px) {
    #MenuNewsDiv {
        display: none;
    }

    .ScrollMenu {
        display: none;
    }

    #MenuNewsDivO {
        display: block;
    }
    #MenuNewsOSmall {
        display: block;
    }
    #MenuNewsOLink {
        display: none;
    }
    .Blogimg {
        width: 80px;
        height: 60px;
    }
    .Eventimg {
        width: 80px;
        height: 60px;
    }

    .Agreementimg {
        width: 80px;
        height: 60px;
    }
    .BlogimgLine {
        margin-top: 45px
    }

    #BlogBox {
        padding-right: 0px;
    }

    .MenuNews {
        height: 1900px;
    }

    .BlogimgActive {
        width: 96%;
    }
    .EventimgActive {
        width: 96%;
    }

    .AgreementimgActive {
        width: 96%;
    }
    #BlogBoxHead {
        height: 500px;
    }

    .BlogimgText {
        width: 100%;
        padding-right: 0px
    }
    .EventimgText {
        width: 100%;
        padding-right: 0px
    }

    .AgreementimgText {
        width: 100%;
        padding-right: 0px
    }

    .BlogPicture {
        height: 1650px
    }

    #BlogTalkBox {
        width: 90%;
        margin-right: 5%;
        margin-left: 5%;
        height: 720px;
    }

    #BlogTalk {
        margin-top: 320px;
        height: auto;
        width: 100%;
        left: 0px;
    }

    #BlogVideo img {
        width: 100%;
        height: 300px;
    }
    .MediaimgActive {
        width: 96%;
    }

    .MediaimgText {
        width: 100%;
        padding-right: 0px
    }

    .Mediaimg {
        width: 80px;
        height: 60px;
    }
}


@media screen and (min-width:1200px) {
    #BlogTalk {
        height: 280px;
        margin-top: 89px;
        width: 47%;
        left: 450px;
    }
    #BlogVideo img {
        height: 370px
    }
    #BlogTalkBox {
        width: 88%;
        height: 370px
    }
}
@media screen and (max-width:1200px)and (min-width:1045px) {
    #BlogTalk {
        margin-top: 34px;
        height: auto;
        width: 47%;
        left: 450px;
    }
    #BlogVideo img {
        height: 370px
    }
    #BlogTalkBox {
        width: 88%;
        height: 370px
    }
}
@media screen and (max-width:1045px)and (min-width:965px) {
    #BlogTalk {
        margin-top: 34px;
        height: auto;
        width: 55%;
        left: 350px;
    }
    #BlogVideo img {
        width: 70%;
    }
    #BlogTalkBox {
        width: 88%;
        height: 370px
    }
    
}


    .MenuNews {
        background-color: #fff;
        font-size: 14px;
        font-weight: bold;
        text-align: center;
        position: relative
    }

    #MenuNewsDiv {
        width: 130px;
        float: right;
        z-index: 201;
        position: absolute
    }

    #MenuNewsItems {
        float: right;
        width: 130px;
        height: 500px;
        margin-right: 40px;
    }

    .MnuNewsActive {
        float: right;
        width: 100%;
        height: 80px;
        background-color: #23a09c;
    }

    .MnuNewsActiveO {
        color: #fff;
        float: right;
        width: 110px;
        height: 80px;
        padding-top: 30px;
        background-color: #23a09c;
    }

    .MnuNews {
        float: right;
        width: 100%;
        height: 80px;
        background-color: #222222;
        position: relative;
    }

    .MnuNewsO {
        float: right;
        width: 110px;
        height: 80px;
        color: #fff;
        padding-top: 30px;
    }

    .MnuNewsOIcon {
        float: right;
        width: 80px;
        height: 80px;
        color: #fff;
        padding-top: 30px;
    }

    .MnuNewsActive div {
        float: right;
        width: 100%;
        padding-top: 30px;
        color: #fff;
    }

    .MnuNews div {
        float: right;
        width: 100%;
        padding-top: 30px;
        color: #fff;
    }

    .MnuNews:hover {
        background-color: #23a09c;
    }

    .MnuNewsO:hover {
        background-color: #23a09c;
    }

    #BlogBox {
        width: 100%;
        float: right;
        z-index: 101;
        position: relative;
    }

    .BlogTitr {
        color: #0f7172;
        font-size: 25px;
        font-weight: bold;
        padding-top: 50px
    }

    .BlogText {
        color: #5a5a5a;
        font-size: 16px;
        margin-top: 25px;
        padding-bottom: 30px;
        width: 94%;
        margin-right: 3%;
    }

    .BlogBackground {
        width: 80%;
        margin-right: 10%;
        margin-left: 10%;
        float: right;
        height: 2px;
        background-color: #f0f0f0;
    }

    #BlogBoxHead {
        float: right;
        margin: 50px 5% 20px 5%;
        width: 85%;
        text-align: right
    }

    #BlogBoxSlid {
        float: right;
        margin: 0px 5% 0px 5%;
        height: 100px;
        width: 85%;
        text-align: right
    }

    #MenuNewsDivO {
        background-color: #000;
        height: 80px;
        font-size: 14px;
        font-weight: bold;
        text-align: center;
        position: relative;
        z-index: 201;
    }

    #MenuNewsShowSmall {
        background-color: #000;
        height: auto;
        padding-bottom: 20px;
        font-size: 14px;
        font-weight: bold;
        text-align: center;
        position: relative;
        z-index: 201;
        display: none;
    }

        #MenuNewsShowSmall a {
            padding-right: 8px;
            color: #fff;
        }

#MenuNewsShowSmall a:hover {
                padding: 4px;
                color: #fff;
                background-color: #23a09c;
                text-decoration: none;
            }

.BlogimgActive {
        height: 250px;
        float: right
    }
.EventimgActive {
    height: 250px;
    float: right
}

.AgreementimgActive {
    height: 250px;
    float: right
}

.BlogimgText {
        height: 250px;
        float: right;
    }
.EventimgText {
    height: 250px;
    float: right;
}

.AgreementimgText {
    height: 250px;
    float: right;
}


.MediaimgActive {
    height: 250px;
    float: right
}

.MediaimgText {
    height: 250px;
    float: right;
}




.BlogPicture {
        position: absolute;
        top: 0px;
        width: 100%;
        z-index: 100;
    }

#MenuNewsOSmall {
        color: #fff;
        text-align: right;
        padding-top: 30px;
        font-size: 16px;
        cursor: pointer;
    }

#BlogTalk {
        position: absolute;
        
        background-color: #154d9f;
        
        padding: 30px;
        text-align: justify;
        color: #fff;
        font-size: 15px
    }

#BlogTalk div {
            border: 4px solid #317ec0;
            border-radius: 20px;
            width: 120px;
            height: 40px;
            color: #fff;
            text-align: center;
            padding-top: 5px;
            cursor: pointer;
            float: left;
            margin-top: 10px
        }
#BlogVideo {
    position: absolute;
    left: 0px;
    text-align: left;
}
#BlogTalkBox {
    float: right;
    z-index: 101;
    position: absolute;
    bottom: 0px;
}
/*#endregion */


/*#region Body */
@media screen and (max-width:400px) {
    #TopHeader {
        display: none;
    }

    #TopHeaderSmall {
        display: block;
    }
}
@media screen and (min-width:400px) {
    #TopHeader {
        display: block;
    }

    #TopHeaderSmall {
        display:none ;
    }
}

@media screen and (min-width:600px) {
    .W-33 {
        width: 33%
    }

    .W-25 {
        width: 25%
    }

    .WC-26 {
        width: 26%;
        margin-right: 37%;
    }

    .WC-40 {
        width: 40%;
        margin-right: 30%;
    }

    .W-50 {
        width: 50%
    }

    .WC-50 {
        width: 50%;
        margin-right: 25%;
    }

    .W-20 {
        width: 20%
    }

    .W-75 {
        width: 75%
    }

    .WC-76 {
        width: 76%;
        margin-right: 12%;
    }

    .NPL-5 {
        padding-left: 5px
    }
}

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

    .W-33 {
        width: 100%
    }

    .W-25 {
        width: 100%
    }

    .WC-26 {
        width: 100%;
        margin-right: 0%;
    }

    .WC-40 {
        width: 100%;
        margin-right: 0%;
    }

    .W-50 {
        width: 100%
    }

    .WC-50 {
        width: 100%;
        margin-right: 0%;
    }

    .W-20 {
        width: 100%
    }

    .W-75 {
        width: 100%
    }

    .WC-76 {
        width: 100%;
        margin-right: 0%;
    }

    .NPL-5 {
        padding-left: 0px
    }
}

.W-33 {
    padding: 0px;
    float: right;
    margin-top: 8px;
}

.W-25 {
    padding: 0px;
    float: right;
    margin-top: 8px;
}

.W-50 {
    padding: 0px;
    float: right;
    margin-top: 8px;
}

.W-75 {
    padding: 0px;
    float: right;
    margin-top: 8px;
}

.W-20 {
    padding: 0px;
    float: right;
    margin-top: 8px;
}

.W-100 {
    padding: 0px;
    float: right;
    margin-top: 8px;
    width: 100%;
}

.WC-26 {
    padding: 0px;
    float: right;
    margin-top: 8px;
}

.WC-40 {
    padding: 0px;
    float: right;
    margin-top: 8px;
}

.WC-50 {
    padding: 0px;
    float: right;
    margin-top: 8px;
}

.WC-76 {
    padding: 0px;
    float: right;
    margin-top: 8px;
}



.txtPanel {
    border: 1px solid #d9d9d9;
    width: 99%;
    padding: 7px;
    outline: none
}

.txtPanel:focus {
    border-right: 3px solid #10beff;
}

.txtPanelLeft {
    border: 1px solid #d9d9d9;
    width: 100%;
    padding: 7px;
    outline: none;
    text-align: left;
}

.txtLeft {
    text-align: left;
}

.txtPanelLeft:focus {
    border-left: 3px solid #10beff;
}

.dropPanel {
    border: 1px solid #d9d9d9;
    width: 99%;
    padding: 6px 7px 4px 7px;
    outline: none
}

.dropPanel:focus {
    border-right: 3px solid #10beff;
}

.birthPanel {
    border: 1px solid #d9d9d9;
    width: 99%;
    padding: 6px 7px 6px 7px;
    outline: none
}

.BirthPanel:focus {
    border-right: 3px solid #10beff;
}


.wrapper {
    position: relative;
    transform: translateY(-50%);
    top: 50%;
    margin: 0 auto;
    min-height: 160px;
    overflow: hidden;
    z-index: 1000;
}
.wrapper a{
    color: #fff;
    text-decoration: none;
}

.wrapper p {
    position: absolute;
    left: 100%;
    width: 100%;
    font-size: 1.8em;
    color: #ffffff;
    top: 0;
    cursor: pointer;
    opacity: 0;
    transition: left 1.4s, opacity .5s ease;
}

.wrapper p.activeText {
    position: relative;
    left: 0;
    opacity: 1;
}

.wrapper p.slideLeft {
    left: -100%;
    opacity: 0;
}

.wrapper p:before {
    content: "\201C";
    font-size: 3em;
    line-height: 0.1em;
    margin-right: 0.1em;
    vertical-align: -0.4em;
}

.wrapper p:after {
    content: "\201D";
    font-size: 3em;
    line-height: 0.1em;
    margin-left: 0.1em;
    vertical-align: -0.45em;
}

ul {
    margin: 0;
    padding: 0;
    text-align: center;
}

ul li {
    list-style: none;
}

.dot {
    width: 10px;
    height: 10px;
    border-radius: 100px;
    background: #7f8c8d;
    display: inline-block;
    text-align: center;
    cursor: pointer;
}

/*.active {
    background: #ecf0f1;
}*/
.NewsDetailTitle {
    width: 100%;
    float: right;
    padding: 8px;
    height: auto;
    background-color: #dcdcdc;
    font-size: 15px;
    text-align: right;
    border-right: 3px solid #de1d6b;
    margin-top: 20px
}

.hide {
    display: none
}
#DefineBox {
    float: right;
    width: 100%;
}
    #DefineBox p {
        line-height: 22px;
        font-size: 16px
    }


.ppp {
    /*   -webkit-clip-path: polygon(0 45%, 0 0, 100% 0, 100% 45%, 51% 67%);
        clip-path: polygon(0 45%, 0 0, 100% 0, 100% 45%, 51% 67%);*/
    clip-path: polygon(100% 0, 100% 60%, 50% 80%, 0 60%, 0 0)
}

    .Hashur1 {
        background: linear-gradient(45deg, #57bcb4 25%, #2f6661 25%, #2f6661 50%, #57bcb4 50%, #57bcb4 75%, #2f6661 75%);
        background-size: 7px 7px;
    }

    .Hashur2 {
        background: linear-gradient(45deg, #233e7a 25%, #445b8c 25%, #445b8c 50%, #233e7a 50%, #233e7a 75%, #445b8c 75%);
        background-size: 7px 7px;
    }

    .Hashur3 {
        background: linear-gradient(45deg, #11418d 25%, #265297 25%, #265297 50%, #11418d 50%, #11418d 75%, #265297 75%);
        background-size: 7px 7px;
    }

    .SlideImage {
        position: absolute;
        width: 100%;
        height: 600px;
        z-index: 90
    }

    .HeaderDiv {
        height: 630px;
        position: relative;
    }

    .SlideShape {
        position: absolute;
        width: 100%;
        height: 600px;
        z-index: 91;
        opacity: 0.2
    }

.SlideColor {
    position: absolute;
    width: 100%;
    background-color: #102550;
    height: 610px;
    z-index: 92;
    opacity: 0.8
}

    #HeadMenu {
        position: absolute;
        right: 0px;
        width: 100px;
        background-color: #fff;
        height: 600px;
        z-index: 100;
        text-align: center;
        color: #fff;
        font-size: 14px;
    }

    #HeadMenu logo {
            height: 90px;
            cursor: pointer
        }

    .MenuItem {
        height: 75px;
        cursor: pointer
    }

    .MenuIcon {
        padding-top: 13px;
        padding-bottom: 3px
    }

    #HeadText {
        position: absolute;
        width: 100%;
       
        height: 200px;
        z-index: 93;
        color: #fff;
        text-align: center
    }

    .HeadText1 {
        font-size: 30px;
        font-weight: bold;
        margin: auto
    }

    .HeadText2 {
        font-size: 18px;
        padding-top: 20px;
        margin: auto
    }

    .HeadText3 {
        font-size: 18px;
        padding-top: 40px;
        margin: auto
    }

    #QuickMenu {
        position: absolute;
        bottom: 20px;
        width: 100%;
        z-index: 93;
        text-align: center
    }

    .ShapeMenu {
        width: 860px;
        margin: auto;
        position: relative;
        background-color: #57bcb4;
    }

    .QuickMenuItem {
        background-color: #fff;
        position: absolute;
        right: 0px;
        border-radius: 8px;
        height: 240px;
        width: 200px;
        margin-left: 15px;
        opacity: 0.4;
        z-index: 30;
        margin-top: 20px;
    }

.QuickMenuItem1 {
    color: #fff;
    border-radius: 8px;
    height: 240px;
    width: 200px;
    float: right;
    margin-left: 15px;
    z-index: 40;
    margin-top: 20px;
}

.QuickMenuItem2 {
    background-color: #fff;
    border-radius: 8px;
    height: 240px;
    width: 200px;
    float: right;
    margin-left: 15px;
    color: #000;
    margin-top: 20px;
}
.QuickMenuItem2:hover {
    margin-top: 5px;
    font-size: 18px;
}


        .SlideShape2 {
            position: absolute;
            bottom: 0px;
            width: 100%;
            z-index: 94
        }

    .ScrollMenu {
        float: right;
        width: 100px;
        height: 60px;
        margin-top: 60px;
        margin-right: 40px;
        position: relative
    }

    .ScrollMenuColor {
        float: right;
        width: 130px;
        height: 60px;
        position: absolute;
        background-color: #000;
        
        opacity: 0.8;
    }

  
/*#endregion */
/*#region Amar */
@media screen and (min-width:965px) {
    .AmarBox {
        height: 590px;
    }
    .AmarPic img {
        height: 100%
    }
    .AmarShap {
        margin-top: 91px;
    }
    .AmarShapNumber {
        margin-top: 130px;
        width: 150px;
    }
    .AmarBoxShap {
        margin-top: 144px;
        width: 150px;
    }
    #AmarBoxShap1 {
        margin-right: 20%;
    }

    #AmarBoxShap2 {
        margin-right: 36%;
    }

    #AmarBoxShap3 {
        margin-right: 52%;
    }

    #AmarBoxShap4 {
        margin-right: 68%;
    }
}
@media screen and (max-width:965px) and (min-width:765px) {
    .AmarBox {
        height: 590px;
    }
    .AmarPic img {
        height: auto;
        width: 100%
    }
    .AmarBoxShap {
        margin-top: 144px;
        width: 150px;
    }
    
    .AmarShap {
        margin-top: 91px;
    }
    .AmarShapNumber {
        margin-top: 130px;
        width: 150px;
    }
    #AmarBoxShap1 {
        margin-right: 20%;
    }

    #AmarBoxShap2 {
        margin-right: 36%;
    }

    #AmarBoxShap3 {
        margin-right: 52%;
    }

    #AmarBoxShap4 {
        margin-right: 68%;
    }
}
@media screen and (max-width:765px) and (min-width:500px) {
    .AmarBox {
        height: 890px;
    }

    .AmarLine {
        display: none;
    }

    .AmarLineCircleLeft {
        display: none;
    }

    .AmarLineCircleRight {
        display: none;
    }

    .AmarPic img {
        height: auto;
        width: 100%
    }

    .AmarShapCircle {
        display: none;
    }

    .AmarShapLine {
        display: none;
    }

    .AmarShap {
        margin-top: 0px;
    }

    .AmarShapNumber {
        margin-top: 40px;
        width: 100%;
    }

    .AmarBoxShap {
        width: 100%;
        margin-top: 0px;
    }

    #AmarBoxShap1 {
        margin-right: 0%;
        margin-top: 100px;
    }

    #AmarBoxShap2 {
        margin-right: 0%;
        margin-top: 300px;
    }

    #AmarBoxShap3 {
        margin-right: 0%;
        margin-top: 500px;
    }

    #AmarBoxShap4 {
        margin-right: 0%;
        margin-top: 700px;
    }
}
@media screen and (max-width:500px) {
    .AmarBox {
        height: 950px;
    }

    .AmarLine {
        display: none;
    }

    .AmarLineCircleLeft {
        display: none;
    }

    .AmarLineCircleRight {
        display: none;
    }

    .AmarPic img {
        height: auto;
        width: 100%;
        margin-top: 400px
    }

    .AmarShapCircle {
        display: none;
    }

    .AmarShapLine {
        display: none;
    }

    .AmarShap {
        margin-top: 0px;
    }

    .AmarShapNumber {
        margin-top: 40px;
        width: 100%;
    }

    .AmarBoxShap {
        width: 100%;
        margin-top: 0px;
    }

    #AmarBoxShap1 {
        margin-right: 0%;
        margin-top: 150px;
    }

    #AmarBoxShap2 {
        margin-right: 0%;
        margin-top: 350px;
    }

    #AmarBoxShap3 {
        margin-right: 0%;
        margin-top: 550px;
    }

    #AmarBoxShap4 {
        margin-right: 0%;
        margin-top: 750px;
    }
}


.AmarBox {
    background-color: #fff;
    font-size: 13px;
    font-weight: bold;
    text-align: center;
    position: relative
}
.AmarLine {
    position: absolute;
    z-index: 101;
    height: 2px;
    width: 80%;
    margin: 150px 10% 0px 10%;
    background-color: #b8b8b8
}
.AmarLineCircleLeft {
    position: absolute;
    z-index: 102;
    height: 13px;
    width: 13px;
    margin: 144px 89.5% 0px 0%;
    background-color: #b8b8b8;
    border-radius: 13px
}
.AmarLineCircleRight {
    position: absolute;
    z-index: 102;
    height: 13px;
    width: 13px;
    margin: 144px 9.5% 0px 0%;
    background-color: #b8b8b8;
    border-radius: 13px
}
.AmarPic {
    position: absolute;
    top: 40px;
    width: 100%;
    z-index: 100;
    height: 510px
}
.AmarShapCircle {
    height: 13px;
    width: 13px;
    background-color: #b8b8b8;
    border-radius: 13px;
    margin-right: 69px
}
.AmarShapLine {
    height: 80px;
    width: 2px;
    background-color: #b8b8b8;
    margin-right: 74px
}
.AmarShap {
    position: absolute;
    z-index: 103;
    height: 155px;
    width: 100%;
    
}
.AmarShap img {
        width: 122px;
    }
.AmarShapNumber {
    position: absolute;
    z-index: 103;
    height: 40px;
    
    font-size: 40px;
}
.AmarShapCounter {
    height: 155px;
    width: 100%;
}
.AmarShapCounter img {
        width: 120px;
    }
.AmarShapText {
    width: 100%;
    color: #6a6a6a;
    font-size: 22px
}
.AmarBoxShap {
    position: absolute;
    z-index: 102;
    height: 250px;
}


/*#endregion */

/*#region Company */
@media screen and (min-width:1200px) {
    #CompanyLogoIcon {
        width: 1200px;
        margin: auto;
    }
}
@media screen and (max-width:1200px) and (min-width:1050px) {
    #CompanyLogoIcon {
        width: 1050px;
        margin: auto;
    }
}
@media screen and (max-width:1050px) {
    #CompanyLogoIcon {
        width: 90%;
        margin-right: 10%;
        margin-left: 10%;
    }
}




    .CompanyLogo {
        background-color: #fff;
        height: 420px;
        position: relative;
        text-align: center;
    }

    .CompanyTitr {
        color: #0f7172;
        font-size: 25px;
        font-weight: bold;
        padding-top: 70px
    }

    .companyText {
        color: #5a5a5a;
        font-size: 16px;
        margin-top: 25px;
        padding-bottom: 30px
    }

    .CompanyLine {
        width: 80%;
        margin-right: 10%;
        margin-left: 10%;
        float: right;
        height: 2px;
        background-color: #f0f0f0;
    }

    .CompanyLeftIcon {
        position: absolute;
        width: 100px;
        left: 0px;
        height: 150px;
        cursor: pointer;
        z-index: 210;
        top: 0px;
    }

    .CompanyRightIcon {
        position: absolute;
        width: 100px;
        right: 0px;
        height: 150px;
        cursor: pointer;
        z-index: 210;
        top: 0px;
    }

    .CompanyPic {
        position: absolute;
        bottom: 0px;
        width: 100%;
    }

    #CompanyLogoIcon {

        text-align: center;
        height: 170px;
        overflow: hidden;
        z-index: 200
    }

/*#endregion */

/*#region Footer */

@media screen and (min-width:1160px) {
    #footerPic img {
        height: 370px;
    }
    #footerBoxTop {
        height: 260px;
    }
    .footerBoxLink {
        margin-right: 80px
    }
    #footerBoxbottom {
        height:80px;
    }
    .footerBoxLink {
        width: 240px;
    }
    #footerBoxNamad {
        width: 200px;
    }
    #footerBoxLink1 {
        margin-top: 0px
    }
}

@media screen and (max-width:1160px)and (min-width:1020px) {
    #footerPic img {
        height: 370px;
    }

    #footerBoxTop {
        height: 260px;
    }

    .footerBoxLink {
        margin-right: 10px
    }
    #footerBoxbottom {
        height: 80px;
    }
    .footerBoxLink {
        width: 240px;
    }
    #footerBoxNamad {
        width: 200px;
    }
    #footerBoxLink1 {
        margin-top: 0px
    }
}
@media screen and (max-width:1020px)and (min-width:770px) {
    #footerPic img {
        height: 610px;
    }

    #footerBoxTop {
        height: 500px;
    }

    .footerBoxLink {
        margin-right: 10px
    }
    #footerBoxbottom {
        height: 80px;
    }
    .footerBoxLink {
        width: 240px;
    }
    #footerBoxNamad {
        width: 200px;
    }
    #footerBoxLink1 {
        margin-top: 0px
    }
}
@media screen and (max-width:770px) {
    #footerPic img {
        height: 1130px;
    }

    #footerBoxTop {
        height: 960px;
    }
    #footerBoxbottom {
        height: 140px;
    }
    .footerBoxLink {
        margin-right: 10px
    }
    .footerBoxLink {
        width: 100%;
    }
    #footerBoxNamad {
        width: 100%;
    }
    #footerBoxLink1 {
        margin-top: 30px
    }
}

#footer {
    background-color: #2f8385;
    height: auto;
    position: relative
}
#footerPic {
    position: absolute;
    width: 100%;
    z-index: 10;

}
 #footerPic img {
        width: 100%;
     opacity: 0.6;

    }
#footerBox {
    padding: 30px 35px 0px 35px;
    z-index: 20;
    position: relative;
    z-index: 121;

}

#footerBoxNamad {
    float: left;
    text-align: center;
    color: #fff;
    font-size: 13px;

}
#footerBoxNamad div{
    float: left;
    width: 100%;

}
.footerBoxLink {
    float: right;
    height: 240px;
    text-align: right;
    color: #ffffff;
    position: relative;

   
}
.footerBoxLinkHead {
    float: right;
    width: 100%;
    height: 50px;
    font-size: 16px;
    font-weight: bold;
    border-bottom: 1px solid #57afb1;
}
.footerBoxLink img {
        width: 22px;
    margin-left: 5px;

    }
.footerLink {
    float: right;
    width: 100%;
    height: auto;
    font-size: 13px;
    text-align: right;
    margin-top: 10px;
    
}
.footerLink div {
    height: auto;
    padding-bottom: 5px;

}
.footerLink a {
        color: #fff
    }
#footerBoxLink1 {
    margin-right: 10px;

}
#footerBoxbottom {
    border-top: 3px solid #61b4b4;
    padding: 7px 15px 0px 15px;
    color: #fff;

}
/*#endregion */