/* =====================

OCW - Oracle cloud world

========================= */


@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@200..700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Teko:wght@300..700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@200..700&family=Teko:wght@300..700&display=swap');

/* <uniquifier>: Use a unique and descriptive class name
   <weight>: Use a value from 200 to 700*/

.oswald {
    font-family: "Oswald", sans-serif;
    font-optical-sizing: auto;
    /* font-weight: var(); */
    font-style: normal;
}

.teko {
    font-family: "Teko", sans-serif;
    font-optical-sizing: auto;
    /* font-weight: var(); */
    font-style: normal;
}

.section-gap {
    padding-top: 70px;
    padding-bottom: 70px;
}


.black {
    color: #000000;
}

.white {
    color: #FFFFFF;
}

.thunder {
    color: #2E2E2E;
}

.smokeyGrey {
    color: #707070;
}

.lavaRed {
    color: #E0231D;
}

.mt5 {
    margin-top: 5px;
}

/* .1 banner section */
.banner-section.ocw-banner-container {
    padding: 0px;
    min-height: 767px;
    display: block;
    overflow: hidden;
    border-radius: 0px;

}


.banner-section.ocw-banner-container .ocw-banner {
    position: relative;
    width: 100%;
    height: 100%;
    background-image: url('/assets/img/oracle_cloud_world/hero-banner.png');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    z-index: 2;
    display: -ms-grid;
    display: grid;
    -ms-flex-line-pack: center;
        align-content: center;
    padding: 200px 0px;
    /* z-index: 0; */
}

.ocw-banner h1 {
    position: relative;
    -webkit-transform: translateY(70px);
        -ms-transform: translateY(70px);
            transform: translateY(70px);
}

.ocw-banner .btxt-block::before {
    display: none;
}

@media all and (min-width:1600px) {
    .banner-section.ocw-banner-container .ocw-banner {
        background-position-y: bottom;
        background-position-x: right;
    }

    .banner-section.ocw-banner-container {
        min-height: 900px;
    }

   
}
@media all and (max-width:991px){
    .banner-section.ocw-banner-container{
        min-height: unset;
    }
}
@media all and (max-width:767px){
    .banner-section.ocw-banner-container {
        min-height: unset;
    }
    .banner-section.ocw-banner-container .ocw-banner {
        padding: 80px 0px;
    }
    
    .ocw-banner h1 {
        -webkit-transform: translateY(0px);
            -ms-transform: translateY(0px);
                transform: translateY(0px);
    }

   
}

.bg-thread {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
}

.bg-thread::before {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    width: 100%;
    height: 98%;
    -webkit-transition: width 0.5s linear;
    -o-transition: width 0.5s linear;
    transition: width 0.5s linear;
    background: -o-repeating-linear-gradient(left,
            /* Direction of the stripes (horizontal stripes) */
            #E0231D,
            /* Red color */
            #E0231D 2.5%,
            /* Red stripe width */
            #ffffff 2.5%,
            /* Start of white stripe */
            #ffffff 5%
            /* End of white stripe */
        );
    background: repeating-linear-gradient(90deg,
            /* Direction of the stripes (horizontal stripes) */
            #E0231D,
            /* Red color */
            #E0231D 2.5%,
            /* Red stripe width */
            #ffffff 2.5%,
            /* Start of white stripe */
            #ffffff 5%
            /* End of white stripe */
        );
    z-index: -1;
    /* Make sure this is behind the .bg-thread itself */
}

.banner-section.ocw-banner-container:hover .bg-thread::before {
    width: 125%;
}

.herospan {
    display: block;
}

/* .2 About oracle cloud 2024 */
.aocw-tb {
    margin-bottom: 90px;
}

.aocw-cb {
    position: relative;
    height: 100%;
    display: -ms-grid;
    display: grid;
    -ms-flex-line-pack: center;
        align-content: center;
    padding-right: 20px;
}

.aocw-ib {
    position: relative;
    height: 100%;
    width: 100%;
    display: -ms-grid;
    display: grid;
    -ms-flex-line-pack: center;
        align-content: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
}
@media all and (max-width:767px){
    .aocw-ibc{
        position: relative;
        margin-top: 40px;
    }
}

/* .3 Timer section */
.timer-main-container .timer-card {
    position: relative;
    width: 100%;
    height: 100%;
}

.timer-main-container .timer-card {
    background: unset;
    margin: unset;
    padding: 30px 30px 30px 30px;
    border-radius: 19px;
    -webkit-box-shadow: 0px 3px 9px #00000029;
            box-shadow: 0px 3px 9px #00000029;
}

.timer-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -2;
}

.timer-card::after {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background-color: #000000;
    opacity: 0.64;
    border-radius: 19px;
    z-index: -1;


}

/* .timer-main-container .tick-flip-panel-back:after{
    display: none;
} */

/* .timer-main-container .tick-flip-panel-back-highlight,
.timer-main-container .tick-flip-panel-back-shadow,
.timer-main-container  .tick-flip-panel-front-shadow{
    display: none !important;
} */
.timer-main-container .tick-flip-panel {
    color: #FFFFFF;
    /* background-color: transparent; */
}

/* .timer-main-container .tick-flip-shadow{
    box-shadow:none;
} */
.timer-main-container .tick-label {
    font-size: 18px;
    font-weight: 600;
    color: #FFFFFF;
    top: -40px;
}

.timer-main-container .timerBlock {
    position: relative;
    padding: 25px 50px 25px 50px;
    width: 100%;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
}

.timer-main-container .timerBlock::before,
.timer-main-container .timerBlock::after {
    display: none;
}

/* .timer-main-container .tick{
    display: flex;
    width: 100%;
    justify-content: center;
} */
/* .timer-main-container .tick-flip{
    margin-left: 0px;
    margin-right: 0px;
    min-width: 0px;
    border-radius: 0px;
    letter-spacing: 0px;
    text-indent:0px;

} */

.timer-main-container span.tick-flip {
    font-family: "Oswald", sans-serif !important;
}

.timer-main-container .rtp-bb {
    margin-top: 0px;
    padding-top: 0px;
}

.timer-main-container .rtp-btn {
    position: relative;
    background: #FFFFFF 0% 0% no-repeat padding-box;
    border-radius: 50px;
    padding: 17px 32px;
}

.timer-main-container .rtp-btn:hover {
    font-weight: 600;
    color: #E0231D;
}

@media all and (max-width:767px) {
    .timer-main-container .tick-label {
        top: 0px;
    }

    .timer-main-container .timerBlock {
        padding: 25px 10px 25px 10px;
    }
}


/* .5 Why can you anticipate section */

.wcua-tb {
    position: relative;
    margin-bottom: 80px;
}

.wcua-cc {
    position: relative;
    margin-top: 30px;
}

@media all and (min-width:1200px) {
    .wcua-card {
        position: relative;
        padding: 0px 40px;

    }
}

.wcua-cb h5 {
    position: relative;
    margin-top: 12px;
    margin-bottom: 25px;

}

/* .6  */





/* .7 */


/* .8 Join us for happy hour section */
.jufhhc-gif {
    position: relative;
    max-width: 109px;
    max-height: 109px;
}

.jufhh-cc.cc1 .jufhhc-gif {
    max-width: 72px;
    max-height: 72px;
    margin-top: 35px;
}


.jufhh-block {
    position: relative;
    margin-top: 80px;
    width: 100%;
    height: 100%;
    background-image: url('/assets/img/oracle_cloud_world/happy-hour-bg.png');
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 31px 85px;
}

/* .happy-hour-bg{
    position: absolute;
    width: 100%;
    height: 100%;
    top:0;
    left:0;
    z-index: -1;
} */
.jufhh-form {
    position: relative;
    background-color: #FFFFFF;
}
@media all and (max-width:1200px){
    .jufhh-block{
        padding:30px 50px;
    }
}

@media all and (max-width:767px) {
    .jufhh-form {
        background-color: #FFFFFF50;
    }

    .jufhh-block {
        padding: 20px 25px;
    }
    .jufhh-cc{
        margin-top: 30px;
    }

}


/* .9 Join the conversation section */
.jtc-block {
    position: relative;
    width: 100%;
    height: 100%;
    background-color: #6EC9EC;
    padding: 60px 100px;
    border-radius: 30px;
}

.jtc-block p {
    line-height: 35px;
    margin-top: 35px;
}

.jtc-cloud {
    position: absolute;
    right: 0;
    bottom: 0;

}

@media all and (max-width:767px) {
    .jtc-block {
        padding: 30px 30px 0px 30px;
    }

    .jtc-cloud {
        position: relative;
        bottom: 0;
        left: 50%;
        -webkit-transform: translateX(-50%);
            -ms-transform: translateX(-50%);
                transform: translateX(-50%);
    }
}