/*LARGE DESKTOP */
@media (min-width: 1900px) {

}
/*MID-LARGE DESKTOP */
@media (min-width:1660px) and (max-width:1899px) {

}

/*SEMI-LARGE DESKTOP */
@media (min-width:1400px) and (max-width:1599px) {

}

/*NORMAL DESKTOP */
@media (min-width: 1200px) {
.container { max-width: 1200px;}
}

/*NORMAL DESKTOP */
@media (min-width: 1200px) and (max-width: 1399px) {
.navbar-brand { width: 300px;}
.intro .content h1 { font-size: 35px;}
.intro .content p { font-size: 15px;}
.intro .dropdowns select { font-size: 16px;}
.table td h3 { font-size: 16px;}
.table td .topic-marks { font-size: 28px; max-width: 100px;}
.guidance .content h2 { font-size: 24px;}
.guidance .content h3 { font-size: 18px;}
.guidance .content p { font-size: 15px;}
}

/*iPad OR SMALL DESKTOP*/
@media (min-width: 992px) and (max-width: 1199px) {
.navbar-brand { width: 300px;}
.intro .content h1 { font-size: 35px;}
.intro .content p { font-size: 15px;}
.intro .dropdowns select { font-size: 16px;}
.table td h3 { font-size: 16px;}
.table td .topic-marks { font-size: 28px; max-width: 100px;}
.guidance .content h2 { font-size: 24px;}
.guidance .content h3 { font-size: 18px;}
.guidance .content p { font-size: 15px;}
}

/*TABLET & iPad*/
@media (min-width: 768px) and (max-width: 991px) {
.navbar-brand { width: 250px;}
.intro .content h1 { font-size: 30px;}
.intro .content p { font-size: 14px;}
.intro .dropdowns select { font-size: 14px;}
.table td h3 { font-size: 15px;}
.table td .topic-marks { font-size: 25px; max-width: 100px;}
.table td .suggestions li { font-size: 13px;}
.guidance .content h2 { font-size: 20px;}
.guidance .content h3 { font-size: 16px;}
.guidance .content p { font-size: 14px;}
}

/*LARGE MOBILES OR PHABLET*/
@media (max-width: 767px) {
.container { padding: 0 20px;}
.navbar-brand { width: 250px;}
.switch { width: 50px; height: 28px;}
.slider::before { width: 20px; height: 20px; left: 4px;}
.switch input:checked + .slider::before { left: 0; right: 4px;}
.intro { padding: 30px 0;}
.intro .content h1 { font-size: 35px; margin: 0 0 10px 0; padding: 0 40px 0 0;}
.intro .content p { font-size: 20px;}
.intro .dropdowns { margin: 0;}
.intro .dropdowns select { font-size: 15px; margin: 0 0 20px 0;}
.table td:first-of-type, .table td:last-child { white-space: nowrap;}
.table td h3 { font-size: 15px;}
.table td .score { min-width: 80px}
.table td .topic-marks { font-size: 25px; min-width: 80px; max-width: 80px;}
.table td .suggestions li { font-size: 13px;}
.guidance .content h2 { font-size: 18px; margin: 0 0 10px 0;}
.guidance .content h3 { font-size: 16px; margin: 0 0 10px 0;}
.guidance .content p { font-size: 13px; margin: 0;}
}

/*MEDIUM MOBILES*/
@media (min-width: 360px) and (max-width: 480px) {

}

/*SMALL MOBILES*/
@media (max-width: 320px){

}