@media (min-width: 1920px) and (max-width: 2560px) {



}

@media (min-width: 1600px) and (max-width: 1919px) {

.common-ttle{ font-size: 46px;}
.common-desc{ font-size: 20px;}
.common-cta{ font-size: 15px;}
}

/* 
@media  screen and (max-width: 1440px) {

.common-ttle{ font-size: 46px;}
.common-desc{ font-size: 20px;}
.common-cta{ font-size: 15px;}
#value-creation .creationRight {padding: 40px;}


}
*/

@media only screen and (min-width: 1400px) and (max-width: 1599px) { 
.event-overview .bigarrow {
    left: -470px;
    top: -260px;
    transform: scale(0.7);
}

}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {

.common-ttle{ font-size: 40px;}
.common-desc{ font-size: 20px;}
.common-cta{ font-size: 15px;}
.schedule-container .event {font-size: 22px;}
#banner .hero-text h1 {font-size: 32px;}
#banner .time-box {font-size: 60px;}
.event-overview .bigarrow {
    left: -470px;
    top: -260px;
    transform: scale(0.7);
}
}


/* 3. scale and layout setting at 150% */
@media (resolution: 1.5dppx) {
.common-ttle{ font-size: 40px;}
.common-desc{ font-size: 20px;}
.common-cta{ font-size: 15px;}
.schedule-container .event {font-size: 22px;}
#banner .hero-text h1 {font-size: 32px;}
#banner .time-box {font-size: 60px;}

}



/* 4. scale and layout setting at 175% */
@media (resolution: 1.75dppx) {
p {
font-size: 14px;
line-height: 22px;
}


}

/* Medium */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
    #header .brand img {
    width: 560px;
}
#header .brand {padding-left: 0px;}
}

/* Small */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait)   {
    #header nav ul {
        display: block;
    }
    #header nav {
        width: 100%;
        padding: 10px 0 15px;
    }
    #header .brand img {
    width: 370px;
}

#header .brand {padding-left: 0px;}

#header nav {
        width: fit-content;
        padding: 10px 0 15px;
        position: absolute;
        right: 20px;
    }
    .logo img {
    width: 270px;
}
.logo {
    margin-top: 19px;
    display: block;
}
#about {
    padding: 50px 0px;
}

.register-form {max-width: 100%;}

}


/* Extra small */
@media (min-width: 320px) and (max-width: 767px) {
.row {
margin-left: 0px;
margin-right: 0px;
}
.common-ttle{ font-size: 30px;}
.common-desc{ font-size: 20px;}
.common-cta{ font-size: 15px;}
.schedule-container .event,.schedule-container .time {font-size: 17px;}
.schedule-container .time {width: 110px;}
#banner .hero-text h1 {font-size: 20px;}
#banner .time-box {font-size: 46px;width: 62px;padding: 10px 0px;}
#banner .hero-overlay {padding: 1rem;bottom: inherit;}
#about {
    padding: 40px 0px;
}

#speakers {
    padding: 0px 0px;
}
#speakers .card {height: 290px;}
#speakers .card-wrap {width: 49%;}
#speakers .card-info {padding: 10px;}
#speakers .card-info h1 {    font-size: 16px;
    letter-spacing: 0px;}

    .schedule-container .schedule-item {padding: 30px 10px;}
#header .brand {padding-left: 0px;line-height: 50px;left: 0px;
    right: 0px;}
#header .brand img {
    width: 275px;
}


.Discussion {padding-left: 0px;}
.Discussion li { width: 100%; }
    #header nav {
        width: 100%;
        padding: 30px 0 15px;
    }
    .logo img {
    width: 180px;
}

.sysdig-tour .logo-title { padding-top: 50px; }
.sysdig-tour { height: auto; }
.sysdig-tour .banner1,.sysdig-tour .banner2  { opacity: 0.2; } 
.event-overview {
        padding: 50px 0;
    }
    .event-overview .bigarrow { display: none; }

    .event-overview .container,.event-overview .event-pic .container { position: relative; padding-bottom: 0px; }
    .agenda-section {padding: 40px 0 90px;}
    .agenda-section .timeline {gap: 10px;}
    .agenda-section .agenda-card {padding: 19px;}
    .agenda-section .container {padding: 0 20px;}
    .speaker-grid-section {padding: 40px 0px;}
    .speaker-grid .speaker-card:nth-child(2), .speaker-grid .speaker-card:nth-child(5) { transform: translateY(0px); }
    .speaker-grid {margin-top: 30px;}
    #header .nav-container .brand a {
    display: inline-block;
    padding-top: 0px;
}
}