.w-auto { width: auto; }
.w-25 { width: 25%; }
.w-50 { width: 50%; }
.w-75 { width: 75%; }
.w-100 { width: 100%; }

.w-100px { width: 100px; }
.w-200px { width: 200px; }
.w-300px { width: 300px; }
.w-400px { width: 400px; }
.w-500px { width: 500px; }
.w-600px { width: 600px; }
.w-700px { width: 700px; }
.w-800px { width: 800px; }
.w-900px { width: 900px; }
.w-1000px { width: 1000px; }

@media (max-width: 991.98px) {
    .w-md-auto { width: auto; }
    .w-md-25 { width: 25%; }
    .w-md-50 { width: 50%; }
    .w-md-75 { width: 75%; }
    .w-md-100 { width: 100%; }

    .w-md-100px { width: 100px; }
    .w-md-200px { width: 200px; }
    .w-md-300px { width: 300px; }
    .w-md-400px { width: 400px; }
    .w-md-500px { width: 500px; }
    .w-md-600px { width: 600px; }
    .w-md-700px { width: 700px; }
    .w-md-800px { width: 800px; }
    .w-md-900px { width: 900px; }
    .w-md-1000px { width: 1000px; }
}

@media (max-width: 767.98px) {
    .w-sm-auto { width: auto; }
    .w-sm-25 { width: 25%; }
    .w-sm-50 { width: 50%; }
    .w-sm-75 { width: 75%; }
    .w-sm-100 { width: 100%; }

    .w-sm-100px { width: 100px; }
    .w-sm-200px { width: 200px; }
    .w-sm-300px { width: 300px; }
    .w-sm-400px { width: 400px; }
    .w-sm-500px { width: 500px; }
    .w-sm-600px { width: 600px; }
    .w-sm-700px { width: 700px; }
    .w-sm-800px { width: 800px; }
    .w-sm-900px { width: 900px; }
    .w-sm-1000px { width: 1000px; }
}