#timer_container{display:flex;width:1024px;margin:25px auto 50px auto;justify-content: space-between;flex-direction:row;}


#timer_settings_container{width:270px;background-color:#f7f7f7;text-align:center;}

#time_settings_header{display:block;width:90%;font-family:'Raleway', sans-serif;font-size:20px;font-weight:400;color:#414141;margin:0 auto 20px auto; padding:25px 0 0 0;}
#time_settings_container{display:flex;flex-direction:column;width:80%;margin:0px auto 0 auto;justify-content:left;}
#time_hour{text-align:left;}
#time_minute{text-align:left;}
#time_second{text-align:left;}
#time_hour label{display:inline-block;min-width:130px;}
#time_minute label{display:inline-block;min-width:130px;}
#time_second label{display:inline-block;min-width:130px;}


#time_settings_container select{margin-top:10px;font-family:'Raleway', sans-serif;font-size:18px;font-weight:400;color:#414141;border-width:1px;border-style:solid;padding:5px;border-color:#D4D4D4;cursor:pointer;}
#time_settings_container label{font-family:'Raleway', sans-serif;font-size:18px;font-weight:400;color:#414141;margin: 0 0px 0 0px;}
#timer_settings_container hr{margin:30px auto 30px auto;padding:0;width:80%;background-color:white;height:1px;border-top-style: solid;border-top-width: 1px;border-top-color: #dbdbdb;}


#custom_title_header{display:block;font-family:'Raleway', sans-serif;font-size:18px;font-weight:400;color:#414141;width:90%;margin:0px auto 0 auto;}
#custom_title{width:80%;margin:10px auto 0 auto;font-family:'Raleway', sans-serif;font-size:18px;font-weight:400;color:#414141;border-width:1px;border-style:solid;padding:5px;border-color:#D4D4D4;}

#sound_title{display:block;font-family:'Raleway', sans-serif;font-size:18px;font-weight:400;color:#414141;width:90%;margin:35px auto 0 auto;}
#sounds_container{width:85%;margin:11px auto 50px auto;display:flex;justify-content:center;align-items: center;}
#sounds_container select{width:83%;font-family:'Raleway', sans-serif;font-size:18px;font-weight:400;color:#414141;border-width:1px;border-style:solid;padding:5px;border-color:#D4D4D4;cursor:pointer;margin:0 10px 0 0;}
#sounds_container button{text-align:center;border:none !important;cursor:pointer;margin:0 !important;width:35px;font-family:'Open Sans', sans-serif;font-size:23px;font-weight:700;color:white !important;text-decoration:none;border-radius:5px;color:#72a600;background-color:#0ca0b5;transition:0.3s;}
#sounds_container button:hover{background-color:#fd9500 !important;}
#sounds_container button:disabled{color:#c9c9c9 !important;cursor:default;}

#timer_display_container{width:735px;background-color:#f7f7f7;text-align:center;padding: 0 0 120px 0;margin: 0 0 0 0;overflow:hidden;transition:0.3s;}


#timer_display{width:90%;margin:0 auto 0 auto;text-align:center;}
#timer_title{margin:0;padding:0 0 0 0;text-align:center;font-family:'Raleway', sans-serif;font-size:35px;font-weight:500;color:#414141;}
#timer{margin:0;padding:0;text-align:center;font-family:'Open Sans', sans-serif;font-size:90px;font-weight:600;color:#414141;}
#timer_buttons_container{display:flex;justify-content:center;margin:30px 0 0 0;}

#timer_buttons_container button{border:none;cursor:pointer;margin:0 0 0 0;display:inline-block;font-family:'Raleway', sans-serif;font-size:18px;font-weight:300;color:white;padding:10px 25px 10px 25px;text-decoration:none;border-radius:5px;background-color:#0ca0b5;transition:0.3s;}
#timer_buttons_container button:hover{background-color:#fd9500;}
#timer_buttons_container button:disabled{background-color:#c9c9c9;cursor:default;}
#timer_buttons_container button:nth-child(1){margin-right:10px;}

#custom_timer_container{width:1024px;margin:50px auto 75px auto;}
#custom_timer_container h2{font-family:'Raleway', sans-serif;font-size:24px;font-weight:500;color:#6c6c6c;margin:0 0 20px 0;padding:0;text-align:center;}
.custom_timer_list{display:flex;flex-flow:row wrap;justify-content:center;}

#custom_timer_container a{text-align:center;color:#414141;padding:10px 25px 10px 25px;width:170px;background-color:#f2f2f2;text-decoration:none;margin:5px;font-family:'Open Sans', sans-serif;font-size:18px;font-weight:300;transition:0.3s;border-radius:7px;}
#custom_timer_container a:hover{background-color:#27bfd5;color:white;}


@media screen and (max-width:1024px)
{
    #timer_container{width:90%;flex-direction:column;}
    #timer_settings_container{width:100%;float:none;}
    #timer_display_container{width:100%;float:none;margin:25px 0 0 0;}
    #sounds_container{margin:11px auto 0 auto;padding:0 0 25px 0;}
    #custom_timer_container{width:90%;margin:50px auto 75px auto;}
    #custom_timer_container p{text-align:center;}
    .custom_timer_list{justify-content:center;}
}

@media screen and (max-width:500px)
{
    #timer_title{font-size:25px;}
    #timer{font-size: 70px;}
}

@media screen and (max-width:370px)
{
    #timer_title{font-size:18px;}
    #timer{font-size: 50px;}
}